/* JPCI v9.4. Shared appearance tokens keep the existing page grids and spacing. */
@media screen {
    :root {
        color-scheme: light;
        --ui-page: #f3f6f4;
        --ui-surface: #ffffff;
        --ui-raised: #fafcfb;
        --ui-inset: #edf3f0;
        --ui-input: #fbfdfc;
        --ui-text: #203e46;
        --ui-heading: #173941;
        --ui-muted: #536e74;
        --ui-soft: #61797c;
        --ui-line: #d9e4df;
        --ui-line-strong: #c1d3cb;
        --ui-accent: #2f6a5c;
        --ui-accent-hover: #255749;
        --ui-accent-soft: #e9f3ed;
        --ui-on-accent: #ffffff;
        --ui-gold: #886427;
        --ui-gold-soft: #f5eddc;
        --ui-success: #246548;
        --ui-success-bg: #e8f4ec;
        --ui-warning: #805b1c;
        --ui-warning-bg: #fcf2dd;
        --ui-danger: #a33f3f;
        --ui-danger-bg: #fbeeed;
        --ui-info: #365f8b;
        --ui-info-bg: #edf3fc;
        --ui-shadow: 0 5px 24px #173e2e07, 0 1px 3px #173e2e04;
        --ui-popup-shadow: 0 20px 65px #0e2c3526;
        --ui-focus: #3e8b76;
        --ui-scrollbar: #a5bcb2;
        --ui-ambient: #a6cbb526;
        --ui-ambient-gold: #d4b6771c;
        --ink: var(--ui-text);
        --muted: var(--ui-muted);
        --line: var(--ui-line);
        --surface: var(--ui-page);
        --white: var(--ui-surface);
        --green: var(--ui-success);
        --red: var(--ui-danger);
    }
    :root[data-theme="dark"] {
        color-scheme: dark;
        --ui-page: #101b20;
        --ui-surface: #18292f;
        --ui-raised: #1d3036;
        --ui-inset: #14242a;
        --ui-input: #15262c;
        --ui-text: #d5e4e4;
        --ui-heading: #edf5f1;
        --ui-muted: #adbec0;
        --ui-soft: #a1b7ba;
        --ui-line: #31474c;
        --ui-line-strong: #4c6566;
        --ui-accent: #a2d2bd;
        --ui-accent-hover: #b9e2ce;
        --ui-accent-soft: #243f38;
        --ui-on-accent: #102b25;
        --ui-gold: #dfc18d;
        --ui-gold-soft: #3c3528;
        --ui-success: #b0dec0;
        --ui-success-bg: #244336;
        --ui-warning: #efd299;
        --ui-warning-bg: #443b27;
        --ui-danger: #f4b4b1;
        --ui-danger-bg: #472f34;
        --ui-info: #b5d0f0;
        --ui-info-bg: #293d55;
        --ui-shadow: 0 5px 24px #00000019, 0 1px 3px #0000000d;
        --ui-popup-shadow: 0 20px 65px #00000066;
        --ui-focus: #b0ddc7;
        --ui-scrollbar: #526d70;
        --ui-ambient: #5b9f9220;
        --ui-ambient-gold: #bca46c10;
    }
    :root[data-theme] body {
        background: var(--ui-page);
        color: var(--ui-text);
        font-family: "Segoe UI", system-ui, Arial, sans-serif;
        -webkit-font-smoothing: antialiased;
    }
    :root[data-theme] body :is(h1, h2, h3) { color: var(--ui-heading); }
    :root[data-theme] body :is(p, small, .muted, .filter-caption, .stock-sync, .sheet-help) { color: var(--ui-muted); }
    :root[data-theme] body .eyebrow { color: var(--ui-gold); }
    :root[data-theme] body :is(input, select, textarea) {
        background-color: var(--ui-input);
        border-color: var(--ui-line-strong);
        color: var(--ui-text);
        caret-color: var(--ui-accent);
        box-shadow: inset 0 1px 2px #102c3503;
    }
    :root[data-theme] body :is(input, textarea)::placeholder { color: var(--ui-soft); opacity: 1; }
    :root[data-theme] body :is(input, select, textarea):focus {
        outline: 2px solid var(--ui-focus);
        outline-offset: 1px;
        border-color: var(--ui-focus);
    }
    :root[data-theme] body :is(a, button, summary):focus-visible {
        outline: 2px solid var(--ui-focus);
        outline-offset: 3px;
    }
    :root[data-theme] body input[type="checkbox"] { accent-color: var(--ui-accent); }
    :root[data-theme] body input[readonly] { background: var(--ui-inset); color: var(--ui-muted); }
    :root[data-theme] body option { color: var(--ui-text); background: var(--ui-surface); }
    :root[data-theme] body input:-webkit-autofill {
        -webkit-text-fill-color: var(--ui-text);
        -webkit-box-shadow: 0 0 0 50px var(--ui-input) inset;
        caret-color: var(--ui-accent);
    }
    :root[data-theme] body :is(.card, .kpi-card, .module-card, .account-card, .item-overview-card, .project-funding-card, .service-card, .project-empty) {
        background: var(--ui-surface);
        border-color: var(--ui-line);
        box-shadow: var(--ui-shadow);
    }
    :root[data-theme] body :is(.card-heading, .sheet-intro) {
        background: linear-gradient(110deg, var(--ui-raised), var(--ui-surface));
        border-color: var(--ui-line);
    }
    :root[data-theme] body :is(.topbar, .public-cta, .sheet-footer, .review-identity, .dialog-footer) {
        background: var(--ui-surface);
        border-color: var(--ui-line);
    }
    :root[data-theme] body :is(.topbar > span, .topbar-actions, .top-link, .heading-date, .heading-date small, .workspace-footer, .public-footer, .public-footer strong) {
        color: var(--ui-muted);
        border-color: var(--ui-line);
    }
    :root[data-theme] body :is(.module-card h3, .card-heading h2, .sheet-intro h2, .project-funding-card h3, .item-overview-card h3, .history-totals h3, .section-heading h2, .empty-state strong) { color: var(--ui-heading); }
    :root[data-theme] body :is(.module-card-bottom, .project-card-link, .project-card-location, .item-stock-details, .project-recent-requests, .dispatch-list > div, .project-activity, .project-funding-card dl > div) {
        color: var(--ui-muted);
        border-color: var(--ui-line);
    }
    :root[data-theme] body :is(.item-stock-details span, .account-card > span) { color: var(--ui-muted); }
    :root[data-theme] body :is(.item-stock-details strong, .history-total-value strong) { color: var(--ui-heading); }
    :root[data-theme] body .project-funding-card .negative dd { color: var(--ui-danger); }
    :root[data-theme] body :is(.kpi-value, .item-card-stock strong, .project-request-total > strong, .project-funding-card dd, .project-request-mini strong) { color: var(--ui-heading); }
    :root[data-theme] body .status-approved .kpi-value { color: var(--ui-success); }
    :root[data-theme] body .status-rejected .kpi-value { color: var(--ui-danger); }
    :root[data-theme] body .status-pending .kpi-value { color: var(--ui-warning); }
    :root[data-theme] body :is(.kpi-label, .project-code, .project-request-total > span, .project-request-total > small, .item-card-stock span, .item-overview-card > small, .project-request-mini small, .project-funding-card dt, .sheet-footer small) { color: var(--ui-muted); }
    :root[data-theme] body :is(.kpi-decoration, .item-card-icon, .service-icon, .module-card-icon) { color: var(--ui-accent); background-color: var(--ui-accent-soft); }
    :root[data-theme="dark"] body .module-card-icon { color: var(--ui-accent) !important; }
    :root[data-theme] body .btn {
        background: var(--ui-accent);
        border-color: var(--ui-accent);
        color: var(--ui-on-accent);
        box-shadow: 0 1px 2px #102c3508;
        font-weight: 600;
    }
    :root[data-theme] body .btn:hover { background: var(--ui-accent-hover); border-color: var(--ui-accent-hover); }
    :root[data-theme] body .btn.secondary {
        background: var(--ui-surface);
        border-color: var(--ui-line-strong);
        color: var(--ui-text);
        box-shadow: none;
    }
    :root[data-theme] body .btn.secondary:hover { background: var(--ui-inset); border-color: var(--ui-accent); }
    :root[data-theme] body .btn.gold { background: #d8b77a; border-color: #d8b77a; color: #24362c; }
    :root[data-theme] body :is(.text-btn, .edit-link, .auth-switch a, .auth-links a, .auth-back, .contact-email) { color: var(--ui-accent); }
    :root[data-theme] body .danger-text { color: var(--ui-danger) !important; }
    :root[data-theme] body :is(.module-tabs, .material-context, .finance-entry, .sheet-toolbar, .request-stock-summary, .bulk-toolbar) {
        background: var(--ui-raised);
        border-color: var(--ui-line);
        color: var(--ui-text);
    }
    :root[data-theme] body :is(.module-tabs a, .material-context label, .finance-entry > summary, .filter-bar label) { color: var(--ui-muted); }
    :root[data-theme] body .module-tabs a.active { background: var(--ui-surface); color: var(--ui-accent); box-shadow: 0 2px 8px #102c3509; }
    :root[data-theme] body .filter-bar { background: var(--ui-surface); border-color: var(--ui-line); box-shadow: var(--ui-shadow); }
    :root[data-theme] body .data-table td { border-color: var(--ui-line); color: var(--ui-text); }
    :root[data-theme] body :is(.data-table th, .entry-sheet th) { background: var(--ui-inset); border-color: var(--ui-line); color: var(--ui-muted); }
    :root[data-theme] body :is(.data-table td > strong, .data-table .number, .data-table .number strong) { color: var(--ui-heading); }
    :root[data-theme] body .data-table small { color: var(--ui-muted); }
    :root[data-theme] body .data-table tbody tr:hover { background: var(--ui-accent-soft); }
    :root[data-theme] body :is(.entry-sheet td, .entry-sheet .row-control, .entry-sheet .row-number) { border-color: var(--ui-line); background: var(--ui-surface); color: var(--ui-muted); }
    :root[data-theme] body .entry-sheet tbody tr:nth-child(even) { background: var(--ui-raised); }
    :root[data-theme] body .entry-sheet td :is(input, select) { background: var(--ui-surface); color: var(--ui-text); }
    :root[data-theme] body .entry-sheet td :is(input, select):focus { background: var(--ui-gold-soft); outline-offset: -2px; }
    :root[data-theme] body .entry-sheet td input[readonly] { background: var(--ui-inset); color: var(--ui-muted); }
    :root[data-theme] body .entry-sheet td.error-cell input { background: var(--ui-danger-bg); }
    :root[data-theme] body .entry-sheet tr.selected-row .row-number { background: var(--ui-accent-soft); color: var(--ui-accent); }
    :root[data-theme] body .saved-project-row .row-control { background: var(--ui-success-bg); }
    :root[data-theme] body .saved-project-row .row-control::after { color: var(--ui-success); }
    :root[data-theme] body .stock-position td[data-stock-field="available_milli"] { background: var(--ui-success-bg); color: var(--ui-success); }
    :root[data-theme] body .stock-position td[data-stock-field="received_milli"] { color: var(--ui-success); }
    :root[data-theme] body .stock-position td[data-stock-field="issued_milli"] { color: var(--ui-warning); }
    :root[data-theme] body :is(.stock-options, dialog) { background: var(--ui-surface); color: var(--ui-text); border-color: var(--ui-line-strong); box-shadow: var(--ui-popup-shadow); }
    :root[data-theme] body .stock-options button { background: var(--ui-surface); color: var(--ui-text); }
    :root[data-theme] body .stock-options strong { color: var(--ui-heading); }
    :root[data-theme] body .stock-options button:is(:hover, [aria-selected="true"]) { background: var(--ui-accent-soft); }
    :root[data-theme] body dialog::backdrop { background: #091b2b99; backdrop-filter: blur(3px); }
    :root[data-theme] body :is(.notification-item, .notification-dialog-tools) { color: var(--ui-text); border-color: var(--ui-line); }
    :root[data-theme] body .notification-item.unread { background: var(--ui-raised); }
    :root[data-theme] body .notification-bell { background: var(--ui-surface); border-color: var(--ui-line-strong); color: var(--ui-text); }
    :root[data-theme] body .notification-bell span { background: var(--ui-gold); color: var(--ui-surface); }
    :root[data-theme] body .badge { background: var(--ui-inset); color: var(--ui-muted); font-weight: 600; }
    :root[data-theme] body :is(.badge.approved, .badge.available, .badge.completed, .badge.checked-in, .badge.active) { color: var(--ui-success); background: var(--ui-success-bg); }
    :root[data-theme] body :is(.badge.pending, .badge.reserved, .badge.low-stock, .badge.delayed, .badge.unclassified, .badge.mixed-decisions) { color: var(--ui-warning); background: var(--ui-warning-bg); }
    :root[data-theme] body :is(.badge.rejected, .badge.cancelled, .badge.inactive, .badge.disabled, .badge.review-reservations, .badge.revoked, .badge.invalidated) { color: var(--ui-danger); background: var(--ui-danger-bg); }
    :root[data-theme] body :is(.badge.company, .badge.in, .badge.deposit, .badge.used, .badge.booking) { color: var(--ui-info); background: var(--ui-info-bg); }
    :root[data-theme] body :is(.badge.expense, .badge.expired) { color: var(--ui-warning); background: var(--ui-warning-bg); }
    :root[data-theme] body .badge.income { color: var(--ui-success); background: var(--ui-success-bg); }
    :root[data-theme] body .notice { background: var(--ui-info-bg); color: var(--ui-info); border: 1px solid var(--ui-line); }
    :root[data-theme] body .notice.error { background: var(--ui-danger-bg); color: var(--ui-danger); }
    :root[data-theme] body .notice.success { background: var(--ui-success-bg); color: var(--ui-success); }
    :root[data-theme] body .notice :is(p, small) { color: inherit; }
    :root[data-theme] body :is(.history-totals, .history-totals-table .history-total-value) { background: var(--ui-raised); border-color: var(--ui-line); }
    :root[data-theme] body .history-totals-table tbody th { color: var(--ui-text); }
    :root[data-theme] body .history-totals-table th small { color: var(--ui-muted); }
    :root[data-theme] body .bar-track { background: var(--ui-inset); }
    :root[data-theme] body .bar-fill { background: var(--ui-accent); }
    :root[data-theme] body .bar-fill.negative { background: var(--ui-danger); }
    :root[data-theme] body :is(.bar-row strong, .bar-row > span) { color: var(--ui-text); }
    :root[data-theme] body .progress-bar { background: var(--ui-inset); }
    :root[data-theme] body .progress-bar span { background: var(--ui-accent); }
    :root[data-theme] body .audit-json { color: var(--ui-muted); }
    :root[data-theme] body .sidebar { background: linear-gradient(155deg, #183c43, #16332f); border-color: #ffffff12; }
    :root[data-theme="dark"] body .sidebar { background: linear-gradient(155deg, #142a31, #112721); }
    :root[data-theme] body .sidebar :is(.brand small, .user-name small) { color: #b5cbc9; }
    :root[data-theme] body .sidebar .brand-mark { color: #1c3437; }
    :root[data-theme] body .sidebar .nav-label { color: #a4c4bf; }
    :root[data-theme] body .sidebar .nav-link { color: #d2e3e0; }
    :root[data-theme] body .sidebar .nav-link.active { color: #fff8e8; background: #ffffff10; border-color: #dcc48f38; }
    :root[data-theme] body .sidebar .nav-link:is(:hover, :focus-visible) { background: #ffffff12; color: #ffffff; }
    :root[data-theme] body .sidebar-foot { color: #e2eeeb; }
    :root[data-theme] body .mobile-toggle { background: var(--ui-inset); color: var(--ui-heading); border: 1px solid var(--ui-line-strong); }
    :root[data-theme] body .welcome-banner { background: linear-gradient(120deg, #163c42, #254a40); border-color: #386156; animation: none; }
    :root[data-theme] body .welcome-banner :is(h2, .eyebrow) { color: #fff0d3; }
    :root[data-theme] body .welcome-banner p { color: #d1e1dd; }
    :root[data-theme] body .welcome-banner::before { background: radial-gradient(circle, #d5bc8630, transparent 68%); }
    :root[data-theme] body :is(.auth-page, .public-page) { isolation: isolate; }
    :root[data-theme] body.auth-page,
    :root[data-theme] body.public-page { isolation: isolate; background: var(--ui-page); }
    :root[data-theme] body.auth-page { grid-template-columns: minmax(0, 1fr); }
    :root[data-theme] body:is(.auth-page, .public-page)::before,
    :root[data-theme] body:is(.auth-page, .public-page)::after {
        content: "";
        position: fixed;
        pointer-events: none;
        z-index: -1;
        inset: -10%;
        background: radial-gradient(ellipse at 12% 20%, var(--ui-ambient), transparent 48%);
    }
    :root[data-theme] body:is(.auth-page, .public-page)::after { background: radial-gradient(ellipse at 90% 75%, var(--ui-ambient-gold), transparent 44%); }
    :root[data-theme] body .auth-layout { background: var(--ui-surface); border-color: var(--ui-line-strong); box-shadow: var(--ui-popup-shadow); }
    :root[data-theme] body .auth-layout > section { min-width: 0; }
    :root[data-theme] body .auth-form-card { border-color: transparent; }
    :root[data-theme] body .auth-story { background: linear-gradient(145deg, #183e47, #17332e); }
    :root[data-theme] body .auth-story h1 { color: #fff5e0; }
    :root[data-theme] body .auth-story :is(.eyebrow, .brand-mark) { color: #edcf99; }
    :root[data-theme] body .auth-story .brand-mark { color: #193637; }
    :root[data-theme] body .auth-story :is(p, small) { color: #c2d6d3; }
    :root[data-theme] body .password-field button { color: var(--ui-accent); border-radius: 5px; }
    :root[data-theme] body .password-field button:hover { background: var(--ui-accent-soft); }
    :root[data-theme] body .public-nav nav { color: var(--ui-muted); }
    :root[data-theme] body .public-nav nav > a:not(.btn):hover { color: var(--ui-accent); }
    :root[data-theme] body .public-hero h1 { color: var(--ui-heading); }
    :root[data-theme] body .public-hero h1 em { color: var(--ui-gold); }
    :root[data-theme] body .hero-visual > img { border: 1px solid var(--ui-line); }
    :root[data-theme] body .hero-caption { background: #173c42; color: #edf5ef; box-shadow: var(--ui-shadow); }
    :root[data-theme] body .hero-caption small { color: #c8d6d0; }
    :root[data-theme] body .public-statement { background: #173c42; }
    :root[data-theme] body .public-statement :is(span, strong) { color: #e0e9e3; }
    :root[data-theme] body .service-card > span { color: var(--ui-gold); }
    :root[data-theme] body .public-footer { border-color: var(--ui-line); }
    .theme-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        flex-shrink: 0;
        min-height: 36px;
        width: 108px;
        padding: 7px 11px;
        border: 1px solid var(--ui-line-strong);
        border-radius: 30px;
        background: var(--ui-surface);
        color: var(--ui-text);
        font-size: 11px;
        font-weight: 600;
        line-height: 1.4;
        white-space: nowrap;
    }
    .theme-toggle:hover { background: var(--ui-accent-soft); border-color: var(--ui-accent); }
    .theme-sun { display: none; }
    [data-theme="dark"] .theme-moon { display: none; }
    [data-theme="dark"] .theme-sun { display: block; }
    .auth-page > .theme-toggle { position: absolute; top: 15px; right: 25px; }
    :root[data-theme] body .stock-approval-dialog > p { margin: 10px 0 20px; line-height: 1.65; }
    :root[data-theme] body .stock-approval-dialog .button-group { margin-bottom: 8px; }
    :root[data-theme] body .stock-approval-dialog [data-stock-pin] {
        padding: 17px;
        border: 1px solid var(--ui-line);
        border-radius: 10px;
        background: var(--ui-raised);
    }
    :root[data-theme] body :is([data-stock-pin], [data-pin-field]) input {
        font-family: ui-monospace, monospace;
        font-variant-numeric: tabular-nums;
        letter-spacing: .2em;
    }
    :root[data-theme] body [data-pin-field] small { display: block; font-weight: 400; margin-top: 6px; line-height: 1.6; letter-spacing: normal; }
    :root[data-theme] body [data-stock-pin] .btn { margin-top: 12px; }
    :root[data-theme] body .workflow-card .approval-code { background: var(--ui-surface); color: var(--ui-success); border-color: var(--ui-success); letter-spacing: .1em; }
    :root[data-theme] body input[aria-label="Permanent security code"] { font-family: ui-monospace, monospace; letter-spacing: .2em; }
    :root[data-theme] body :is(.workflow-card, .assignment-table, #requests) { font-variant-numeric: tabular-nums; }
    :root[data-theme] body .table-scroll { scrollbar-color: var(--ui-scrollbar) transparent; }
    :root[data-theme] body .assignment-redeem input { font-variant-numeric: tabular-nums; }
    :root[data-theme-changing] body,
    :root[data-theme-changing] body :is(.card, .card-heading, .topbar, .auth-layout, .auth-story, .kpi-card, .module-card, .service-card, .btn, .theme-toggle, input, select, textarea, .badge, .notice, td, th, dialog) {
        transition: color .22s ease, background-color .22s ease, border-color .22s ease, box-shadow .22s ease;
    }
    @media (prefers-reduced-motion: no-preference) {
        body:is(.auth-page, .public-page)::before { animation: jpci-ambient 28s ease-in-out infinite alternate; }
        body:is(.auth-page, .public-page)::after { animation: jpci-ambient 34s -12s ease-in-out infinite alternate-reverse; }
        :root[data-theme] body .welcome-banner::before { animation: jpci-ambient 25s ease-in-out infinite alternate; }
    }
    @keyframes jpci-ambient {
        from { transform: translate3d(-2%, 0, 0); opacity: .65; }
        to { transform: translate3d(3%, 2%, 0); opacity: 1; }
    }
    :root[data-page-hidden] body::before,
    :root[data-page-hidden] body::after,
    :root[data-page-hidden] body .welcome-banner::before,
    :root[data-page-hidden] .workspace-art *,
    :root[data-page-hidden] .workspace-art::before { animation-play-state: paused; }
    @media (max-width: 700px) {
        :root[data-theme] body :is(input, select, textarea, .request-row input, .request-row select) { font-size: 16px; }
        :root[data-theme] body :is(.btn, .theme-toggle) { min-height: 40px; }
        :root[data-theme] body .btn.small { min-height: 36px; }
        :root[data-theme] body .theme-toggle { width: 40px; padding: 8px 9px; }
        :root[data-theme] body.auth-page > .theme-toggle { width: 108px; }
        :root[data-theme] body .theme-toggle [data-theme-label] { display: none; }
        :root[data-theme] body.auth-page > .theme-toggle [data-theme-label] { display: inline; }
        .auth-page > .theme-toggle { right: 19px; top: 12px; }
    }
    @media (max-width: 760px) {
        :root[data-theme] body.workspace .topbar { padding-left: 60px; }
        :root[data-theme] body.workspace .topbar > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
        :root[data-theme] body.workspace .topbar-actions { flex-shrink: 0; }
        :root[data-theme] body.workspace .top-link { margin-left: 7px; padding-left: 10px; white-space: nowrap; }
    }
    @media (prefers-reduced-motion: reduce) {
        :root[data-theme] *, :root[data-theme] *::before, :root[data-theme] *::after {
            animation: none !important;
            transition: none !important;
            scroll-behavior: auto !important;
        }
        :root[data-theme] body :is(.module-card, .item-overview-card, .kpi-card):hover { transform: none; }
    }
}
@media print {
    .theme-toggle { display: none !important; }
    body.workspace { background: #ffffff !important; }
}

@media screen {
:root[data-theme] body .approval-code-value { font-family: ui-monospace, monospace; font-size: 20px; letter-spacing: .2em; color: var(--ui-heading); }
:root[data-theme] body .global-code-table small { white-space: normal; overflow-wrap: anywhere; }
}

/* Fit the focused daily log without the shared wide-record-table minimum. */
.daily-activity-table { min-width: 0; width: 100%; table-layout: fixed; }
.daily-activity-table th, .daily-activity-table td { width: 50%; overflow-wrap: anywhere; }
.global-code-table { min-width: 1050px; table-layout: fixed; }
.global-code-table th:nth-child(1) { width: 18%; }
.global-code-table th:nth-child(2) { width: 20%; }
.global-code-table th:nth-child(3) { width: 10%; }
.global-code-table th:nth-child(4) { width: 25%; }
.global-code-table th:nth-child(5) { width: 27%; }
.approval-code-form label small { font-weight: 400; line-height: 1.5; }