/* People Hub mobile workflows. The shared layout explicitly opts in at phone
   widths; print and kiosk screens retain their presentation. Embedded hosts
   own their navigation. Only JS-verified simple records become cards. */
@media screen and (max-width: 767.98px) {
    body.people-hub-mobile {
        --em-ink: var(--oa-ink); --em-muted: var(--oa-muted); --em-line: var(--oa-border); --em-accent: var(--oa-accent);
        --ea-ink: var(--oa-ink); --ea-muted: var(--oa-muted); --ea-line: var(--oa-border); --ea-blue: var(--oa-accent); --ea-soft: var(--oa-bg);
        --pr-ink: var(--oa-ink); --pr-muted: var(--oa-muted); --pr-line: var(--oa-border);
    }

    /* Named workflow roots: no global display/position rules and no alteration
       to [hidden], disabled controls, validation states or dialog semantics. */
    body.people-hub-mobile :is(.alpha-page, .assignment-page, .email-mgmt-shell, .ee-shell, .em-shell, .ea-shell, .sig-shell, .leave-maint-shell, .lar-shell, .lr-shell, .tlc-page, .pmo-shell, .nwd-page, .notif-shell, .role-shell, .svc-shell, .su-shell, .pr-shell, .daily-dtr-shell, .coc-shell, .coc-dtr-shell, .coc-batch-page, .personal-tlmr, .payroll-eval-shell, .employee-calendar, .ws-shell, .delegations-workspace, #cocApp) {
        min-width: 0; max-width: 100%; background: var(--oa-bg); color: var(--oa-ink); font-size: 15px; line-height: 1.6;
    }
    body.people-hub-mobile :is(.alpha-shell, .assignment-panel, .email-panel, .email-status-card, .ee-card, .ee-preview, .em-directory, .ea-record, .ea-review, .sig-panel, .leave-maint-panel, .lar-panel, .lr-panel, .tlc-main, .pmo-panel, .nwd-top-card, .nwd-table-card, .nwd-calendar-card, .notif-list, .role-panel, .role-preview-card, .svc-table-shell, .su-card, .su-data-control, .su-explainer, .pr-panel, .daily-dtr-card, .coc-panel, .coc-batch-panel, .personal-tlmr-panel) {
        min-width: 0; border: 1px solid #ffffffb3; border-radius: 20px; background: var(--oa-bg); color: var(--oa-ink); box-shadow: var(--oa-raised);
    }
    body.people-hub-mobile :is(.alpha-topbar, .email-mgmt-hero, .leave-maint-hero, .role-hero, .svc-hero, .su-hero, .pr-hero, .daily-dtr-hero, .personal-tlmr-profile, .coc-batch-hero) {
        min-width: 0; padding: 20px 16px; border: 1px solid #ffffffb3; border-radius: 20px; background: var(--oa-bg); color: var(--oa-ink); box-shadow: var(--oa-raised); margin-bottom: 24px;
    }
    body.people-hub-mobile :is(.assignment-title, .email-mgmt-title, .lar-title, .lr-title, .pmo-title, .nwd-title, .notif-title, .role-title, .svc-title, .su-title, .daily-dtr-title, .coc-title, .coc-dtr-title) { color: var(--oa-ink); font-size: 26px; line-height: 1.2; letter-spacing: -.6px; overflow-wrap: anywhere; }
    body.people-hub-mobile :is(.assignment-subtitle, .email-mgmt-subtitle, .lar-subtitle, .pmo-subtitle, .nwd-subtitle, .notif-subtitle, .svc-subtitle, .su-subtitle, .daily-dtr-subtitle, .leave-maint-muted, .sig-muted, .lr-muted, .lar-muted, .role-muted, .svc-muted) { color: var(--oa-muted); font-size: 14px; line-height: 1.6; }
    body.people-hub-mobile :is(.alpha-topbar, .assignment-panel-header, .email-mgmt-hero, .email-mgmt-actions, .em-heading, .em-directory-heading, .em-footer, .ee-heading, .sig-topbar, .sig-actions, .leave-maint-header, .lar-hero, .lar-panel-header, .lr-panel-header, .pmo-topbar, .pmo-actions, .pmo-history-toolbar, .nwd-legend, .notif-hero, .notif-toolbar, .notif-pager, .svc-hero, .pr-hero, .pr-section-heading, .personal-tlmr-heading, .personal-tlmr-detail-actions, .personal-tlmr-pagination, .coc-batch-topbar, .coc-batch-actions) { gap: 16px; flex-wrap: wrap; }
    body.people-hub-mobile :is(.alpha-search-panel, .assignment-panel-header, .email-panel-head, .email-form, .ee-card, .ee-preview, .em-directory-heading, .em-toolbar, .em-footer, .ea-review, .sig-panel, .lar-panel-header, .lr-panel-header, .pmo-panel-head, .pmo-panel-body, .notif-toolbar, .svc-filter, .pr-panel, .daily-dtr-card, .coc-panel-body, .coc-batch-panel, .personal-tlmr-section) { padding: 16px; }
    body.people-hub-mobile :is(.email-grid, .email-card-grid, .ee-columns, .ee-fields, .ee-review-grid, .em-toolbar, .sig-layout, .sig-detail-grid, .lar-form-grid, .pmo-grid, .pmo-row-targets, .su-grid, .su-explainer-grid, .pr-overview, .pr-checks, .daily-dtr-grid, .coc-grid, .coc-check-grid, .coc-batch-grid, .coc-batch-form-grid, .personal-tlmr-facts, .personal-tlmr-identity, .tlc-body) { grid-template-columns: minmax(0, 1fr) !important; gap: 16px; }
    body.people-hub-mobile :is(.email-field, .ee-field, .em-search, .em-filter, .sig-detail, .lar-edit-cell, .pmo-field, .pmo-target-group, .pr-check, .coc-field, .coc-batch-field) { min-width: 0; }
    body.people-hub-mobile :is(.email-value, .ee-review-values, .sig-detail-value, .pmo-preview-value, .pr-check, .personal-tlmr-person, .personal-tlmr-facts dd, .notif-row-title, .notif-message) { overflow-wrap: anywhere; }
    body.people-hub-mobile .leave-maint-hero .leave-maint-pill { background: var(--oa-tint); color: var(--oa-accent); border: 1px solid var(--oa-border); font-size: 13px; line-height: 1.5; }
    body.people-hub-mobile .leave-maint-hero .text-white { color: var(--oa-ink) !important; }
    body.people-hub-mobile :is(.leave-maint-panel-head, .leave-maint-search) { padding: 16px; gap: 12px; flex-wrap: wrap; }
    body.people-hub-mobile :is(.su-hero, .coc-batch-hero) { grid-template-columns: minmax(0, 1fr); }

    /* Native fields in custom page families need the same readable touch size
       as Bootstrap fields. Checkboxes, switches and file inputs retain type UI. */
    body.people-hub-mobile :is(.alpha-page, .assignment-page, .email-mgmt-shell, .ee-shell, .em-shell, .ea-shell, .sig-shell, .leave-maint-shell, .lar-shell, .lr-shell, .tlc-page, .pmo-shell, .nwd-page, .notif-shell, .role-shell, .svc-shell, .pr-shell, .coc-shell, .coc-dtr-shell, .coc-batch-page, .personal-tlmr, .payroll-eval-shell, .dtr-workspace, .ws-shell) :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=range]), select, textarea) {
        min-width: 0; max-width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid var(--oa-border); border-radius: 12px; background-color: var(--oa-surface); color: var(--oa-ink); font-size: 16px; line-height: 1.5;
    }
    body.people-hub-mobile :is(.ee-shell, .ea-shell, .lar-shell, .lr-shell, .pmo-shell, .coc-shell, .coc-batch-page, .dtr-workspace, .payroll-eval-shell, .ws-shell) :is(input, select, textarea):disabled { background-color: #e4e8f2; color: var(--oa-muted); cursor: not-allowed; }
    body.people-hub-mobile :is(.email-field, .ee-field, .ea-field, .em-filter, .pmo-field, .coc-field, .coc-batch-field) > label { color: var(--oa-muted); font-size: 14px; line-height: 1.5; }
    body.people-hub-mobile :is(.email-send-btn, .ee-progress button, .ee-actions button, .ee-actions a, .em-add, .em-search-button, .em-clear, .em-view, .ea-button, .sig-actions .btn, .pmo-button, .pmo-remove-row, .nwd-year-btn, .nwd-action-btn, .notif-action, .notif-tab, .svc-btn, .pr-button, .coc-date-button, .coc-batch-button, .dtr-print-toggle, .dtr-signatory-change, .dtr-signatory-reset, .eval-icon-btn) { min-width: 44px; min-height: 44px; border-radius: 12px; font-size: 14px; line-height: 1.5; white-space: normal; }
    body.people-hub-mobile :is(.em-add, .em-search-button, .email-send-btn, .svc-btn-primary, .coc-batch-button-primary) { background: var(--oa-accent); border-color: var(--oa-accent); color: #fff; }
    body.people-hub-mobile :is(.ee-help, .ee-optional, .email-note, .email-label, .pmo-field-hint, .pmo-rule-list, .coc-note, .coc-label, .coc-batch-history-meta, .personal-tlmr-footnote, .personal-tlmr-section-intro, .eval-helper-note) { color: var(--oa-muted); font-size: 13px; line-height: 1.6; }

    /* Verified simple-record tables only. Preserve the source header for AT.
       Root JS skips editable, hidden-column and multi-span data matrices. */
    body.people-hub-mobile table.people-mobile-record-table { display: block; width: 100% !important; min-width: 0 !important; max-width: 100%; background: transparent; border: 0; }
    body.people-hub-mobile table.people-mobile-record-table > thead { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
    body.people-hub-mobile table.people-mobile-record-table > tbody { display: grid; width: 100%; gap: 16px; padding: 2px; }
    body.people-hub-mobile table.people-mobile-record-table > tbody > tr { display: grid; width: 100%; min-width: 0; grid-template-columns: minmax(0, 1fr); gap: 12px; padding: 16px; border: 1px solid var(--oa-border); border-radius: 16px; background: var(--oa-surface); color: var(--oa-ink); }
    body.people-hub-mobile table.people-mobile-record-table > tbody > tr > :is(td, th) { display: block; min-width: 0; width: auto !important; max-width: none; padding: 0; border: 0; background: transparent; color: inherit; box-shadow: none; text-align: left !important; white-space: normal !important; overflow-wrap: anywhere; font-size: 15px; line-height: 1.6; }
    body.people-hub-mobile table.people-mobile-record-table > tbody > tr > [data-mobile-label]::before { content: attr(data-mobile-label); display: block; color: var(--oa-muted); font-size: 12px; font-weight: 600; line-height: 1.5; margin-bottom: 3px; }
    body.people-hub-mobile table.people-mobile-record-table > tbody > tr > [data-mobile-wide] { grid-column: 1 / -1; }
    body.people-hub-mobile table.people-mobile-record-table :is(.em-person, .em-position) { min-width: 0; }
    body.people-hub-mobile table.people-mobile-record-table :is(.btn, .em-view) { min-height: 44px; min-width: 44px; }

    /* Employee directory, four-step entry and standalone employee editor. */
    body.people-hub-mobile .em-shell { --em-ink: var(--oa-ink); --em-muted: var(--oa-muted); --em-line: var(--oa-border); --em-accent: var(--oa-accent); }
    body.people-hub-mobile .em-table-scroll { max-width: 100%; overflow-x: auto; padding: 0 16px 16px; }
    body.people-hub-mobile .em-search > input { width: 100%; }
    body.people-hub-mobile .em-heading h1, body.people-hub-mobile .ee-heading h1 { font-size: 27px; color: var(--oa-ink); }
    body.people-hub-mobile .ee-progress { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-block: 24px; }
    body.people-hub-mobile .ee-progress button { width: 100%; min-height: 44px; padding: 10px; font-size: 13px; background: var(--oa-surface); border-radius: 12px; }
    body.people-hub-mobile .ee-progress li:not(:last-child)::after { display: none; }
    body.people-hub-mobile :is(.ee-preview, .ee-actions, .tlc-rail) { position: static; }
    body.people-hub-mobile :is(.ee-actions, .ee-success-actions) { display: flex; flex-wrap: wrap; gap: 12px; }
    body.people-hub-mobile .ea-shell { margin-block: 20px; padding-inline: 16px !important; }
    body.people-hub-mobile .ea-workspace { display: flex; flex-direction: column; gap: 24px; }
    body.people-hub-mobile .ea-navigation { display: flex; flex-wrap: wrap; gap: 8px; position: static; padding: 0; }
    body.people-hub-mobile .ea-navigation a { min-height: 44px; padding: 10px 12px; border: 1px solid var(--oa-border); border-radius: 12px; background: var(--oa-surface); font-size: 14px; }
    body.people-hub-mobile .ea-navigation a.is-current { background: var(--oa-tint); border-color: var(--oa-accent); color: var(--oa-accent); }
    body.people-hub-mobile .ea-record { width: 100%; padding: 16px; }
    body.people-hub-mobile .ea-review { position: static; width: 100%; }
    body.people-hub-mobile :is(.ea-three, .ea-two, .ea-personal-extra, .ea-employment-row) { grid-template-columns: minmax(0, 1fr) !important; gap: 16px; }
    body.people-hub-mobile :is(.ea-profile-copy, .ea-record-summary, .ea-changes) { min-width: 0; overflow-wrap: anywhere; }
    body.people-hub-mobile .ea-profile-copy h2 { font-size: 22px; line-height: 1.3; }
    body.people-hub-mobile .ea-section { padding-block: 24px; border-color: var(--oa-border); scroll-margin-top: 84px; }
    body.people-hub-mobile .ea-photo-buttons button { min-height: 44px; padding: 8px; font-size: 13px; }
    body.people-hub-mobile .ea-switch-row { min-height: 44px; gap: 12px; }
    body.people-hub-mobile .ea-check { min-height: 44px; font-size: 14px; }
    body.people-hub-mobile .sig-preview-card { background: var(--oa-surface); border-color: var(--oa-border); border-radius: 16px; }
    body.people-hub-mobile .sig-preview-img { max-width: 100%; height: auto; }
    body.people-hub-mobile .bio-wrap .bio-card { border-radius: 20px; background: var(--oa-bg); border-color: #ffffffb3; box-shadow: var(--oa-raised); color: var(--oa-ink); }
    body.people-hub-mobile .bio-wrap :is(.emp-name, .emp-sub, .info-item) { overflow-wrap: anywhere; }
    body.people-hub-mobile .bio-wrap :is(.emp-sub, .info-label) { font-size: 14px; color: var(--oa-muted); }

    /* Attendance: maintain the semantic matrix and its independently scrollable
       viewport. Give review/print controls a normal document flow on phones. */
    body.people-hub-mobile :is(.dtr-workspace, .payroll-eval-shell .dtr-review-grid, .payroll-eval-shell .dtr-context-rail) { grid-template-columns: minmax(0, 1fr) !important; gap: 24px; min-width: 0; }
    body.people-hub-mobile :is(.dtr-attendance-pane, .dtr-table-region, .dtr-table-shell, .coc-table-wrap, .personal-tlmr-table-wrap, .coc-batch-table-wrap, .svc-table-shell, .pr-table-scroll) { min-width: 0; max-width: 100%; }
    body.people-hub-mobile :is(.dtr-table-shell, .coc-table-wrap, .personal-tlmr-table-wrap, .coc-batch-table-wrap, .pr-table-scroll) { overflow-x: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; border: 1px solid var(--oa-border); border-radius: 16px; background: var(--oa-surface); }
    body.people-hub-mobile :is(.dtr-table-shell, .coc-table-wrap, .personal-tlmr-table-wrap) table { background: var(--oa-surface); font-size: 14px; }
    body.people-hub-mobile :is(.dtr-workspace, .payroll-eval-shell) .dtr-table thead th { background: var(--oa-tint); color: var(--oa-ink); font-size: 12px !important; line-height: 1.5; padding: 12px 8px; }
    body.people-hub-mobile :is(.dtr-workspace, .payroll-eval-shell) .dtr-table tbody td { font-size: 14px; line-height: 1.5; }
    body.people-hub-mobile :is(.dtr-hero, .dtr-profile-card, .dtr-schedule-panel, .dtr-print-console, .eval-employee-panel, .dtr-payroll-eval-panel, .dtr-evaluation-console, .dtr-legend-panel) { min-width: 0; padding: 16px; border: 1px solid #ffffffb3; border-radius: 20px; background: var(--oa-bg); color: var(--oa-ink); box-shadow: var(--oa-raised); }
    body.people-hub-mobile :is(.dtr-hero, .eval-page-bar, .eval-filter-form, .coc-dtr-header, .coc-dtr-tools, .coc-dtr-totalbar) { flex-wrap: wrap; gap: 16px; }
    body.people-hub-mobile :is(.dtr-page-title, .eval-page-title, .eval-employee-name) { color: var(--oa-ink); overflow-wrap: anywhere; }
    body.people-hub-mobile :is(.dtr-page-subtitle, .dtr-schedule-summary, .eval-page-subtitle, .eval-employee-subtitle, .dtr-payroll-eval-text, .dtr-console-print-note, .dtr-legend-note) { color: var(--oa-muted); font-size: 14px; line-height: 1.6; }
    body.people-hub-mobile .dtr-period-form { width: 100%; min-width: 0; grid-template-columns: minmax(0, 1fr) minmax(0, .8fr) 44px; gap: 8px; }
    body.people-hub-mobile :is(.eval-filter-field, .eval-employee-main) { min-width: 0; }
    body.people-hub-mobile .eval-filter-field { flex: 1 1 130px; }
    body.people-hub-mobile :is(.eval-meta-grid, .dtr-signatories-grid, .dtr-leave-earned-grid, .dtr-month-total, .daily-dtr-metrics) { grid-template-columns: minmax(0, 1fr) !important; gap: 12px; }
    body.people-hub-mobile :is(.eval-meta-item, .dtr-signatory-choice, .dtr-leave-earned-card, .dtr-month-total-card, .daily-dtr-metric, .daily-dtr-time) { padding: 16px; border: 1px solid var(--oa-border); border-radius: 14px; background: var(--oa-surface); color: var(--oa-ink); box-shadow: none; }
    body.people-hub-mobile :is(.dtr-print-console, .dtr-evaluation-console, .dtr-context-rail, .dtr-console-actions) { position: static; width: 100%; max-height: none; }
    body.people-hub-mobile :is(.dtr-signatory-role-row, .dtr-signatory-actions, .dtr-action-bar, .dtr-action-group) { flex-wrap: wrap; gap: 12px; }
    body.people-hub-mobile :is(.dtr-signatory-current-name, .dtr-signatory-position, .eval-meta-value) { overflow-wrap: anywhere; }
    body.people-hub-mobile :is(.dtr-signatory-role, .dtr-signatory-position, .eval-meta-label, .dtr-month-total-label) { color: var(--oa-muted); font-size: 13px; }
    body.people-hub-mobile .dtr-signatory-search-status { font-size: 13px; line-height: 1.6; }
    body.people-hub-mobile .dtr-signatory-results { max-height: 260px; overflow-y: auto; }
    body.people-hub-mobile .dtr-signatory-results button { min-height: 44px; font-size: 14px; }
    body.people-hub-mobile .dtr-review { max-width: calc(100vw - 32px); width: 520px; max-height: calc(100dvh - 32px); overflow-y: auto; padding: 20px 16px; border: 1px solid var(--oa-border); border-radius: 20px; background: var(--oa-surface); color: var(--oa-ink); }
    body.people-hub-mobile .dtr-review [data-close-dtr-review] { min-width: 44px; min-height: 44px; }
    body.people-hub-mobile :is(.personal-tlmr-filters, .personal-tlmr-actions, .personal-tlmr-history-top) { flex-wrap: wrap; gap: 12px; }
    body.people-hub-mobile .personal-tlmr-filters { padding: 16px; }
    body.people-hub-mobile .personal-tlmr-filters > div { flex: 1 1 120px; min-width: 0; }
    body.people-hub-mobile .personal-tlmr-new { flex-basis: 100%; margin-left: 0; }
    body.people-hub-mobile :is(.personal-tlmr-written, .personal-tlmr-history > li, .coc-readonly, .coc-stat, .daily-dtr-schedule) { background: var(--oa-surface); border: 1px solid var(--oa-border); border-radius: 14px; padding: 16px; }
    body.people-hub-mobile .coc-hour-input { min-width: 88px !important; }
    body.people-hub-mobile .day-list { gap: 16px; }
    body.people-hub-mobile .day-list .day-card { min-width: 0; padding: 16px; border: 1px solid var(--oa-border); border-radius: 20px; background: var(--oa-surface); color: var(--oa-ink); }

    /* Calendars keep seven-day geometry. Category colors, picked dates and
       native calendar dialogs remain controlled by their existing CSS/JS. */
    body.people-hub-mobile .employee-calendar { --ec-bg: var(--oa-bg); --ec-panel: var(--oa-surface); --ec-ink: var(--oa-ink); --ec-muted: var(--oa-muted); --ec-line: var(--oa-border); --ec-soft: var(--oa-tint); --ec-accent: var(--oa-accent); }
    body.people-hub-mobile .employee-calendar :is(.ec-month-panel, .ec-detail-panel) { min-width: 0; border-color: var(--oa-border); border-radius: 20px; background: var(--oa-surface); }
    body.people-hub-mobile .employee-calendar .ec-month-panel { box-shadow: var(--oa-raised); }
    body.people-hub-mobile .employee-calendar :is(.ec-grid, .ec-weekdays) { grid-template-columns: repeat(7, minmax(0, 1fr)) !important; }
    body.people-hub-mobile .employee-calendar .ec-weekdays { font-size: 12px; color: var(--oa-muted); }
    body.people-hub-mobile .employee-calendar :is(.ec-button, .ec-month-input) { min-height: 44px; min-width: 44px; border-radius: 12px; }
    body.people-hub-mobile .employee-calendar :is(input:not([type=checkbox]):not([type=radio]), select, textarea) { min-width: 0; font-size: 16px; }
    body.people-hub-mobile .employee-calendar .ec-day { min-width: 0; min-height: 52px; }
    body.people-hub-mobile .employee-calendar :is(.ec-dialog, .ec-day-dialog) { border-color: var(--oa-border); background: var(--oa-surface); color: var(--oa-ink); }
    body.people-hub-mobile .employee-calendar :is(.ec-subtitle, .ec-calendar-footer, .ec-filter-context, .ec-record-count) { font-size: 13px; line-height: 1.6; }
    body.people-hub-mobile .nwd-calendar-grid { grid-template-columns: repeat(7, minmax(0, 1fr)) !important; gap: 4px; }
    body.people-hub-mobile .nwd-calendar-card { padding: 16px 10px; }
    body.people-hub-mobile .nwd-day-cell { min-width: 0; }
    body.people-hub-mobile .nwd-day { min-height: 36px; font-size: 12px; }
    body.people-hub-mobile .nwd-day-name { font-size: 11px; }

    /* Schedule pages and opted-in HR panels share readable employee controls.
       The office-specific selectors take precedence. The drag/drop calendar
       is intentionally scrollable to retain the assignment targets. */
    body.people-hub-mobile .ws-shell { --ws-ink: var(--oa-ink); --ws-muted: var(--oa-muted); --ws-line: var(--oa-border); --ws-soft: var(--oa-bg); --ws-accent: var(--oa-accent); --ws-accent-soft: var(--oa-tint); }
    body.people-hub-mobile .ws-shell :is(.ws-card, .ws-hero) { padding: 20px 16px; background: var(--oa-bg); border: 1px solid #ffffffb3; border-radius: 20px; box-shadow: var(--oa-raised); }
    body.people-hub-mobile .ws-shell :is(.ws-workflow-grid, .ws-assignment-layout, .ws-group-filterbar, .ws-quick-assign, .ws-assign-row, .ws-scope-control) { grid-template-columns: minmax(0, 1fr) !important; gap: 16px; }
    body.people-hub-mobile .ws-shell :is(.ws-workflow-panel, .ws-editor-panel, .ws-employee-card, .ws-schedule-zone, .ws-toolbar, .ws-quick-assign) { min-width: 0; padding: 16px; background: var(--oa-surface); border: 1px solid var(--oa-border); border-radius: 16px; box-shadow: none; }
    body.people-hub-mobile .ws-shell :is(.ws-toolbar, .ws-actions, .ws-zone-actions, .ws-assignment-tools) { flex-wrap: wrap; gap: 12px; }
    body.people-hub-mobile .ws-shell .ws-calendar-viewport { min-width: 0; max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; }
    body.people-hub-mobile .ws-shell .ws-calendar-surface { min-width: 920px; }
    body.people-hub-mobile .ws-shell .ws-grid { grid-template-columns: repeat(7, minmax(0, 1fr)) !important; }
    body.people-hub-mobile .ws-shell :is(.ws-employee-name, .ws-zone-title) { font-size: 16px; overflow-wrap: anywhere; }
    body.people-hub-mobile .ws-shell :is(.ws-employee-meta, .ws-zone-meta, .ws-quick-help, .ws-group-audit) { color: var(--oa-muted); font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
    body.people-hub-mobile .ws-shell :is(.btn, .ws-calendar-nav-button, .ws-member button) { min-width: 44px; min-height: 44px; border-radius: 12px; white-space: normal; font-size: 14px; }
    body.people-hub-mobile .ws-shell .ws-member { min-height: 44px; padding: 6px 8px; font-size: 14px; }
    body.people-hub-mobile .ws-shell .ws-group-preview > summary { min-height: 44px; padding-block: 10px; font-size: 14px; }

    /* COC top-level application. Embedded instances continue to use their
       parent's narrower office/approver workflow marker instead of this one. */
    body.people-hub-mobile #cocApp { padding: 16px; border-radius: 20px; background: var(--oa-bg); color: var(--oa-ink); }
    body.people-hub-mobile #cocApp :is(.coc-top, .coc-actions) { gap: 16px; }
    body.people-hub-mobile #cocApp :is(h1, h2, h3) { color: var(--oa-ink); overflow-wrap: anywhere; }
    body.people-hub-mobile #cocApp .coc-grid { grid-template-columns: minmax(0, 1fr) !important; gap: 16px; }
    body.people-hub-mobile #cocApp .coc-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; border-color: var(--oa-border); }
    body.people-hub-mobile #cocApp .coc-steps li { font-size: 13px; }
    body.people-hub-mobile #cocApp [aria-current=step] { color: var(--oa-accent); }
    body.people-hub-mobile #cocApp [aria-current=step] b { background: var(--oa-accent); border-color: var(--oa-accent); }
    body.people-hub-mobile #cocApp :is(.coc-management-card, .coc-summary, .coc-choice) { min-width: 0; padding: 16px; border: 1px solid var(--oa-border); border-radius: 16px; background: var(--oa-surface); color: var(--oa-ink); }
    body.people-hub-mobile #cocApp .coc-management-card { box-shadow: var(--oa-raised); }
    body.people-hub-mobile #cocApp .coc-choice:has(input:checked) { background: var(--oa-tint); border-color: var(--oa-accent); }
    body.people-hub-mobile #cocApp :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]), select, textarea) { min-height: 44px; min-width: 0; max-width: 100%; padding: 10px 12px; border: 1px solid var(--oa-border); border-radius: 12px; background: var(--oa-surface); color: var(--oa-ink); font-size: 16px; }
    body.people-hub-mobile #cocApp :is(input, select, textarea):disabled { background: #e4e8f2; color: var(--oa-muted); }
    body.people-hub-mobile #cocApp button { min-height: 44px; min-width: 44px; border-radius: 12px; border-color: var(--oa-border); font-size: 14px; color: var(--oa-ink); }
    body.people-hub-mobile #cocApp button.primary { background: var(--oa-accent); border-color: var(--oa-accent); color: #fff; }
    body.people-hub-mobile #cocApp small { color: var(--oa-muted); font-size: 13px; line-height: 1.6; }
    body.people-hub-mobile #cocApp .coc-scroll { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; }
    body.people-hub-mobile #cocApp table:not(.people-mobile-record-table) { font-size: 14px; }
    body.people-hub-mobile #cocApp .coc-balance-table tr { background: var(--oa-surface); border-color: var(--oa-border); }
    body.people-hub-mobile #cocApp .coc-balance-table :is(td, th) { color: var(--oa-ink); font-size: 14px; }
    body.people-hub-mobile #cocApp .coc-balance-table .coc-number::before { color: var(--oa-muted); font-size: 12px; }
    body.people-hub-mobile #cocApp .coc-actions button { flex: 1 1 130px; }

    /* Delegation pages and opted-in HR frames retain the list/detail flow and
       policy restrictions. Larger type keeps authority and reason text clear. */
    body.people-hub-mobile .delegations-workspace { --dl-bg: var(--oa-bg); --dl-surface: var(--oa-surface); --dl-ink: var(--oa-ink); --dl-muted: var(--oa-muted); --dl-line: var(--oa-border); --dl-accent: var(--oa-accent); --dl-tint: var(--oa-tint); border: 0; border-radius: 20px; }
    body.people-hub-mobile .delegations-workspace :is(.dl-body, .dl-body.dl-has-panel) { grid-template-columns: minmax(0, 1fr); gap: 24px; }
    body.people-hub-mobile .delegations-workspace :is(.dl-list, .dl-detail) { border-radius: 20px; border-color: var(--oa-border); box-shadow: var(--oa-raised); }
    body.people-hub-mobile .delegations-workspace :is(.dl-intro, .dl-list-top, .dl-detail-top, .dl-detail-content) { padding: 16px; }
    body.people-hub-mobile .delegations-workspace :is(.dl-mode, .dl-states, .dl-filters, .dl-pagination, .dl-detail-actions, .dl-footer) { flex-wrap: wrap; gap: 12px; }
    body.people-hub-mobile .delegations-workspace :is(.dl-button, .dl-mode button, .dl-states button, .dl-action-info, .dl-pagination button, .dl-detail-top button) { min-width: 44px; min-height: 44px; height: auto; border-radius: 12px; font-size: 14px; }
    body.people-hub-mobile .delegations-workspace .dl-action-info { flex-basis: 44px; width: 44px; margin: 0; }
    body.people-hub-mobile .delegations-workspace .dl-primary { background: var(--oa-accent); color: #fff; border-color: var(--oa-accent); }
    body.people-hub-mobile .delegations-workspace :is(.dl-field, .dl-search input, .dl-type-filter select) { min-height: 44px; min-width: 0; max-width: 100%; padding: 10px 12px; font-size: 16px; border-radius: 12px; }
    body.people-hub-mobile .delegations-workspace .dl-row { padding: 16px; gap: 12px; }
    body.people-hub-mobile .delegations-workspace :is(.dl-people, .dl-path-name, .dl-property, .dl-capability, .dl-action-copy > span) { color: var(--oa-ink); font-size: 15px; line-height: 1.6; overflow-wrap: anywhere; }
    body.people-hub-mobile .delegations-workspace :is(.dl-capability.is-disabled, .dl-capability.is-disabled i, .dl-action-choice.is-disabled, .dl-action-choice.is-disabled .dl-action-copy > span) { color: var(--oa-muted); }
    body.people-hub-mobile .delegations-workspace :is(.dl-label, .dl-note, .dl-form-hint, .dl-action-copy small, .dl-subtitle, .dl-meta, .dl-status, .dl-policy-tag, .dl-form label, .dl-rule, .dl-availability, .dl-footer) { font-size: 13px; line-height: 1.6; }
    body.people-hub-mobile .delegations-workspace .dl-action-choice { padding: 12px; }
    body.people-hub-mobile .delegations-workspace .dl-action-choice input { flex-basis: 22px; width: 22px; height: 22px; }
    body.people-hub-mobile .delegations-workspace .dl-events li { flex-direction: column; gap: 4px; font-size: 13px; }
    body.people-hub-mobile .delegations-workspace .dl-availability summary { min-height: 44px; padding-block: 10px; }
    body.people-hub-mobile .dl-action-tooltip { background: var(--oa-surface); color: var(--oa-ink); border-color: var(--oa-border); border-radius: 16px; font-size: 14px; }
    body.people-hub-mobile .dl-action-tooltip :is(strong, .dl-tooltip-policy) { font-size: 13px; }

    /* Administration, reporting and notification content use flat record
       surfaces inside the raised panels. Leave semantic status colors intact. */
    body.people-hub-mobile :is(.pmo-metric, .coc-batch-stat, .svc-metric, .pr-metric, .notif-metric, .su-explainer-item, .email-status-card) { min-width: 0; padding: 16px; background: var(--oa-surface); border: 1px solid var(--oa-border); border-radius: 16px; box-shadow: none; }
    body.people-hub-mobile :is(.pmo-metrics, .coc-batch-stats, .svc-metrics, .notif-metrics) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    body.people-hub-mobile :is(.pmo-order, .pmo-preview-box, .pmo-rule-note, .lr-policy-summary, .lr-rule, .pr-check, .su-data-item) { min-width: 0; background: var(--oa-surface); border: 1px solid var(--oa-border); border-radius: 16px; padding: 16px; }
    body.people-hub-mobile :is(.pmo-row-tools, .pmo-row-top, .pmo-order-head, .notif-tabs, .notif-filter-form) { flex-wrap: wrap; gap: 12px; }
    body.people-hub-mobile .pmo-collapse-toggle { min-width: 44px; min-height: 44px; }
    body.people-hub-mobile .pmo-search-select { min-width: 180px; }
    body.people-hub-mobile :is(.pmo-table, .lar-table, .lr-table, .svc-table) { font-size: 14px; }
    body.people-hub-mobile .notif-filter-field { min-width: 0; flex: 1 1 140px; }
    body.people-hub-mobile .notif-row { padding: 16px; gap: 12px; background: var(--oa-surface); }
    body.people-hub-mobile .notif-body { min-width: 0; }
    body.people-hub-mobile :is(.notif-meta, .notif-applicant-label, .notif-pager-note) { font-size: 13px; color: var(--oa-muted); }
    body.people-hub-mobile .notif-action-chip { min-height: 44px; padding: 10px 12px; font-size: 13px; border-radius: 12px; }
    body.people-hub-mobile .svc-code-list { flex-wrap: wrap; }
    body.people-hub-mobile :is(.svc-code, .svc-service-name, .svc-note, .su-card-desc, .pr-section-copy, .pr-observation-note) { overflow-wrap: anywhere; font-size: 14px; line-height: 1.6; }
    body.people-hub-mobile .pr-shell { --pr-ink: var(--oa-ink); --pr-muted: var(--oa-muted); --pr-line: var(--oa-border); }
    body.people-hub-mobile .tlc-rail { background: var(--oa-surface); border: 1px solid var(--oa-border); border-radius: 16px; }
    /* The ledger already supplies mobile records, filtering and an application
       history dialog. Keep that markup and restore the header actions' natural
       width after the shared legacy rule expands all *-actions to 100%. */
    body.people-hub-mobile .leave-ledger-shell:has(.mobile-ledger) { padding: 0; background: var(--oa-bg); }
    body.people-hub-mobile .mobile-ledger { min-width: 0; max-width: 100%; background: var(--oa-bg); color: var(--oa-ink); font-size: 15px; line-height: 1.6; }
    body.people-hub-mobile .mobile-ledger .ml-header { padding: 24px 16px 0; }
    body.people-hub-mobile .mobile-ledger .ml-topline { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; }
    body.people-hub-mobile .mobile-ledger .ml-kicker { min-width: 0; font-size: 11px; line-height: 1.6; letter-spacing: 1px; color: var(--oa-muted); overflow-wrap: anywhere; }
    body.people-hub-mobile .mobile-ledger .ml-header-actions { width: auto; max-width: 100%; min-width: 0; flex-shrink: 1; }
    body.people-hub-mobile .mobile-ledger :is(.ml-back, .ml-print, .ml-eye) { min-width: 44px; min-height: 44px; border: 1px solid var(--oa-border); border-radius: 13px; background: var(--oa-surface); color: var(--oa-accent); box-shadow: var(--oa-raised); }
    body.people-hub-mobile .mobile-ledger .ml-print { font-size: 14px; line-height: 1.5; padding: 10px 12px; }
    body.people-hub-mobile .mobile-ledger .ml-header h1 { font-size: 27px; line-height: 1.25; font-weight: 600; letter-spacing: -.6px; }
    body.people-hub-mobile .mobile-ledger :is(.ml-employee, .ml-balance-label, .ml-date, .ml-type, .ml-effect, .ml-help) { font-size: 13px; line-height: 1.6; color: var(--oa-muted); }
    body.people-hub-mobile .mobile-ledger .ml-employee strong { color: var(--oa-ink); }
    body.people-hub-mobile .mobile-ledger .ml-balance { margin: 24px 16px; padding: 20px 16px; border: 1px solid #ffffffb3; border-radius: 20px; background: var(--oa-bg); box-shadow: var(--oa-raised); }
    body.people-hub-mobile .mobile-ledger .ml-total { font-size: 38px; color: var(--oa-ink); font-variant-numeric: tabular-nums; }
    body.people-hub-mobile .mobile-ledger :is(.ml-balances, .ml-balances div+div, .ml-running-values > div+div) { border-color: var(--oa-border); }
    body.people-hub-mobile .mobile-ledger :is(.ml-balances span, .ml-running-values span, .ml-running-values small, .ml-total small, .ml-amount small) { font-size: 12px; line-height: 1.5; color: var(--oa-muted); }
    body.people-hub-mobile .mobile-ledger .ml-financial { margin: 0 16px 24px; border-color: var(--oa-border); font-size: 14px; }
    body.people-hub-mobile .mobile-ledger .ml-financial summary { min-height: 44px; color: var(--oa-accent); font-size: 14px; }
    body.people-hub-mobile .mobile-ledger .ml-financial dl { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
    body.people-hub-mobile .mobile-ledger .ml-financial :is(dt, dd) { min-width: 0; overflow-wrap: anywhere; }
    body.people-hub-mobile .mobile-ledger .ml-financial dt { color: var(--oa-muted); }
    body.people-hub-mobile .mobile-ledger .ml-financial dd { text-align: right; }
    body.people-hub-mobile .mobile-ledger .ml-transactions { padding: 0 16px 24px; }
    body.people-hub-mobile .mobile-ledger .ml-section-head { flex-wrap: wrap; gap: 12px; }
    body.people-hub-mobile .mobile-ledger .ml-section-head span { font-size: 12px; color: var(--oa-muted); }
    body.people-hub-mobile .mobile-ledger .ml-search { min-height: 48px; font-size: 16px; background: var(--oa-surface); color: var(--oa-ink); border-color: var(--oa-border); border-radius: 12px; }
    body.people-hub-mobile .mobile-ledger .ml-search::placeholder { font-size: 14px; color: var(--oa-muted); }
    body.people-hub-mobile .mobile-ledger .ml-filters { gap: 8px; margin-block: 16px 24px; }
    body.people-hub-mobile .mobile-ledger .ml-filters button { min-height: 44px; padding: 10px 12px; border-color: var(--oa-border); border-radius: 12px; background: var(--oa-surface); color: var(--oa-muted); font-size: 14px; }
    body.people-hub-mobile .mobile-ledger .ml-filters button[aria-pressed=true] { background: var(--oa-tint); border-color: var(--oa-accent); color: var(--oa-accent); box-shadow: var(--oa-inset); }
    body.people-hub-mobile .mobile-ledger .ml-record { margin-bottom: 16px; padding: 16px; border-color: var(--oa-border); border-radius: 18px; background: var(--oa-surface); }
    body.people-hub-mobile .mobile-ledger .ml-record h3 { font-size: 16px; line-height: 1.4; }
    body.people-hub-mobile .mobile-ledger .ml-movement { flex-wrap: wrap; gap: 12px; }
    body.people-hub-mobile .mobile-ledger .ml-movement > div { min-width: 0; }
    body.people-hub-mobile .mobile-ledger .ml-status { max-width: 100%; font-size: 12px; line-height: 1.5; }
    body.people-hub-mobile .mobile-ledger .ml-running { background: var(--oa-bg); border-color: var(--oa-border); border-radius: 12px; padding: 14px 12px; }
    body.people-hub-mobile .mobile-ledger .ml-running-title { color: var(--oa-muted); font-size: 13px; }
    body.people-hub-mobile .mobile-ledger .ml-running-values strong { color: var(--oa-ink); font-size: 20px; }
    body.people-hub-mobile .mobile-ledger .ledger-pagination { flex-wrap: wrap; font-size: 14px; }
    body.people-hub-mobile .mobile-ledger .ledger-pagination :is(button, select) { min-height: 44px; min-width: 44px; border-color: var(--oa-border); border-radius: 12px; }
    body.people-hub-mobile .mobile-ledger .ledger-pagination select { font-size: 16px; }
    body.people-hub-mobile .ledger-history-drawer { background: var(--oa-surface); color: var(--oa-ink); border-color: var(--oa-border); }
    body.people-hub-mobile .ledger-history-heading { background: var(--oa-bg); padding: 20px 16px; border-color: var(--oa-border); }
    body.people-hub-mobile .ledger-history-content { padding: 16px; }
    body.people-hub-mobile .ledger-history-close { width: 44px; height: 44px; border-radius: 12px; border-color: var(--oa-border); background: var(--oa-surface); color: var(--oa-accent); }

    /* Waiver creation, acceptance, AWMA preparation, review and records share
       the flow layout. Both its plain and timeline variants use these tokens. */
    body.people-hub-mobile .mw-flow {
        --bg: var(--oa-bg); --surface: var(--oa-surface); --ink: var(--oa-ink); --muted: var(--oa-muted); --line: var(--oa-border); --accent: var(--oa-accent); --wash: var(--oa-tint); --radius: 20px; --mobile-radius: 20px;
        --mw-bg: var(--oa-bg); --mw-surface: var(--oa-surface); --mw-ink: var(--oa-ink); --mw-muted: var(--oa-muted); --mw-line: var(--oa-border); --mw-accent: var(--oa-accent); --mw-wash: var(--oa-tint); --mw-radius: 20px;
        min-width: 0; background: var(--oa-bg); color: var(--oa-ink); font-size: 15px; line-height: 1.6;
    }
    body.people-hub-mobile .mw-flow.clarity {
        --oa-accent:#087a5e; --oa-bg:#f5fbf8; --oa-surface:#fff; --oa-ink:#203d3a; --oa-muted:#526a62; --oa-border:#cee3d8; --oa-tint:#e4f4eb;
        --oa-raised:0 8px 22px #2b6b4612; --oa-inset:inset 0 0 0 1px #c6e2d4;
    }
    body.people-hub-mobile > .container-xl:has(.mw-flow) { padding-inline: 0; }
    body.people-hub-mobile .mw-flow .main { padding: 24px 16px; }
    body.people-hub-mobile .mw-flow :is(.page-heading, .mw-heading, .mw-section-head, .panel-head, .dialog-actions, .mw-actions, .mwa-card-header, .awma-review-card-head, .awma-balance-main, .awma-balance-footer) { flex-wrap: wrap; gap: 16px; }
    body.people-hub-mobile .mw-flow :is(.page-heading, .mw-heading) h1 { font-size: 27px; line-height: 1.25; letter-spacing: -.6px; }
    body.people-hub-mobile .mw-flow :is(.panel, .mw-panel, .mwa-card, .awma-review-card, .awma-review-empty, .awma-balance, .balance) { min-width: 0; background: var(--oa-bg); border: 1px solid #ffffffb3; border-radius: 20px; box-shadow: var(--oa-raised); }
    body.people-hub-mobile .mw-flow :is(.mw-panel, .balance, .awma-balance) { padding: 20px 16px; margin-bottom: 24px; }
    body.people-hub-mobile .mw-flow :is(.panel-head, .dialog-head, .dialog-body, .mwa-card-header, .awma-review-card-head, .mwa-card-footer, .mwa-document-list, .mwa-incoming-list, .awma-review-actions) { padding: 16px; }
    body.people-hub-mobile .mw-flow :is(.stat, .awma-review-stat, .recipient-card, .evaluation, .mw-doc, .mw-source-record) { min-width: 0; padding: 16px; border: 1px solid var(--oa-border); border-radius: 16px; background: var(--oa-surface); color: var(--oa-ink); box-shadow: none; }
    body.people-hub-mobile .mw-flow :is(.overview, .search-line, .mwa-incoming, .mwa-detail-grid, .awma-balance-breakdown, .awma-review-stats) { grid-template-columns: minmax(0, 1fr) !important; gap: 16px; }
    body.people-hub-mobile .mw-flow .mw-progress { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    body.people-hub-mobile .mw-flow :is(.mw-input-row, .mw-section-head, .mw-doc-head, .review-line, .record-footer, .filter-line) { flex-wrap: wrap; gap: 12px; min-width: 0; }
    body.people-hub-mobile .mw-flow :is(.mw-source-sub, .mw-source-explanation, .mw-source-usage, .mwa-document small, .mwa-person small, .awma-balance p, .mw-small, .helper, .attachment, .policy) { font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
    body.people-hub-mobile .mw-flow :is(.profile-meta, .mw-profile-meta) { max-width: 100%; font-size: 13px; }
    body.people-hub-mobile .mw-flow :is(.mw-doc-head strong, .mw-source-top strong, .mw-pairs strong, .review-line > :last-child, .awma-balance-remaining) { overflow-wrap: anywhere; }
    body.people-hub-mobile .mw-flow :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]), select, textarea) { min-width: 0; max-width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid var(--oa-border); border-radius: 12px; background: var(--oa-surface); color: var(--oa-ink); font-size: 16px !important; line-height: 1.5; }
    body.people-hub-mobile .mw-flow :is(input, select, textarea):disabled { background: #e4e8f2; color: var(--oa-muted); }
    body.people-hub-mobile .mw-flow :is(.field-search, .recipient-search-field, .day-field) { min-width: 0; }
    body.people-hub-mobile .mw-flow .field-search { border-radius: 12px; background: var(--oa-surface); }
    body.people-hub-mobile .mw-flow .field-search input { border: 0; }
    body.people-hub-mobile .mw-flow :is(button, a.primary, .flow-return, .mw-button, .awma-balance-link) { min-height: 44px; min-width: 44px; border-radius: 12px; font-size: 14px; line-height: 1.5; white-space: normal; }
    body.people-hub-mobile .mw-flow :is(.tabs, .mw-tabs) { gap: 16px; }
    body.people-hub-mobile .mw-flow :is(.tabs, .mw-tabs) :is(button, a) { padding-inline: 10px; font-size: 14px; }
    body.people-hub-mobile .mw-flow :is(.mw-proof, .check-row) { min-height: 44px; align-items: flex-start; font-size: 14px; line-height: 1.6; }
    body.people-hub-mobile .mw-flow :is(.mw-proof, .check-row) input { width: 22px; height: 22px; flex-shrink: 0; accent-color: var(--oa-accent); }
    body.people-hub-mobile .mw-flow :is(.policy summary, .mw-allocation-history > summary) { min-height: 44px; padding-block: 10px; font-size: 14px; }
    body.people-hub-mobile .mw-flow .policy-dialog .policy :is(p, li, small, div) { font-size: 14px; line-height: 1.6; }
    body.people-hub-mobile .mw-flow .waiver-policy-access { padding: 16px; border-color: var(--oa-border); background: var(--oa-tint); }
    body.people-hub-mobile .mw-flow dialog { background: var(--oa-surface); color: var(--oa-ink); border-color: var(--oa-border); border-radius: 20px; }
    body.people-hub-mobile .mw-flow .table :is(th, td) { font-size: 14px; line-height: 1.6; }
    body.people-hub-mobile .mw-flow .mwr-filters form { gap: 12px; }

    /* HR keeps its existing teal appearance tokens and native Topics sheet.
       Add mobile depth and breathing room without replacing that palette or
       its visibility, focus handling, route selection and frame lifecycle. */
    body.people-hub-mobile #leaveAdminDashboard.hr-welfare-workspace {
        --hr-mobile-raised: 6px 6px 14px color-mix(in srgb, var(--hr-ink, #2c4553) 12%, transparent), -6px -6px 14px #ffffffd9;
        --hr-mobile-inset: inset 3px 3px 7px color-mix(in srgb, var(--hr-ink, #2c4553) 12%, transparent), inset -3px -3px 7px #ffffffd9;
    }
    html.hr-navigation-ready body.people-hub-mobile #leaveAdminDashboard.hr-welfare-workspace { --hr-mobile-nav-space: calc(108px + env(safe-area-inset-bottom, 0px)); }
    body.people-hub-mobile #leaveAdminDashboard.hr-welfare-workspace .dh-main { gap: 24px; padding-inline: 16px; }
    body.people-hub-mobile #leaveAdminDashboard.hr-welfare-workspace :is(.dashboard-panel, .approval-surface, .employee-search-sidebar, .employee-profile-card, .employee-profile-header, .dh-stat-card) { min-width: 0; border-radius: 20px; border-color: var(--hr-line, #dfe9ee); background: var(--hr-surface, #fff); box-shadow: var(--hr-mobile-raised); }
    body.people-hub-mobile #leaveAdminDashboard.hr-welfare-workspace :is(.dashboard-panel-header, .employee-search-sidebar, .employee-profile-card, .employee-profile-header) { padding: 20px 16px; }
    body.people-hub-mobile #leaveAdminDashboard.hr-welfare-workspace :is(.dh-subtitle, .dh-date-chip, .dh-stat-label, .dh-stat-unit, .hr-topics-eyebrow) { font-size: 13px; line-height: 1.6; }
    body.people-hub-mobile #leaveAdminDashboard.hr-welfare-workspace :is(.form-control, .form-select, .leave-admin-filter-select, .approval-search-input) { min-height: 44px; min-width: 0; font-size: 16px !important; border-radius: 12px; }
    body.people-hub-mobile #leaveAdminDashboard.hr-welfare-workspace .hr-mobile-nav button { min-height: 54px; border-radius: 14px; font-size: 12px; padding: 8px 3px; }
    html.hr-navigation-ready body.people-hub-mobile #leaveAdminDashboard.hr-welfare-workspace .hr-mobile-nav { inset: auto 12px calc(10px + env(safe-area-inset-bottom, 0px)); width: auto; padding: 8px; gap: 6px; border: 1px solid var(--hr-line, #dfe9ee); border-radius: 22px; background: var(--hr-wash, #f6f9fb); box-shadow: var(--hr-mobile-raised); }
    body.people-hub-mobile #leaveAdminDashboard.hr-welfare-workspace .hr-mobile-nav button[aria-current="page"] { box-shadow: var(--hr-mobile-inset); }
    html.hr-navigation-ready body.people-hub-mobile #leaveAdminDashboard.hr-welfare-workspace .dh-workspace-bar { padding: 20px 16px max(20px, env(safe-area-inset-bottom, 0px)); border-radius: 24px 24px 0 0; background: var(--hr-surface, #fff); box-shadow: 0 -8px 36px color-mix(in srgb, var(--hr-ink, #2c4553) 16%, transparent); }
    body.people-hub-mobile #leaveAdminDashboard.hr-welfare-workspace .dh-workspace-tab:nth-child(n) { min-height: 48px; padding: 12px; border-radius: 12px; font-size: 14px; line-height: 1.5; }
    body.people-hub-mobile #leaveAdminDashboard.hr-welfare-workspace .dh-workspace-links :is(a, button) { min-height: 44px; font-size: 14px; }
    body.people-hub-mobile :is(input, select, textarea):is(.input-validation-error, .is-invalid, [aria-invalid="true"]) { border-color: #b33149 !important; }
}