@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Sora:wght@500;600;700&display=swap");

:root {
    --bg: #05070b;
    --bg-soft: #090d14;
    --panel: rgba(14, 19, 29, 0.88);
    --panel-strong: rgba(20, 27, 40, 0.96);
    --panel-border: rgba(212, 171, 93, 0.18);
    --gold: #d6a756;
    --gold-soft: rgba(214, 167, 86, 0.14);
    --gold-strong: #f0c777;
    --text: #f6f1e8;
    --muted: #9ca8ba;
    --muted-strong: #c4ccd8;
    --ok: #64d6a3;
    --danger: #ff6f7d;
    --warn: #f0c777;
    --info: #8fb7ff;
    --radius-sm: 0.65rem;
    --radius-md: 0.95rem;
    --radius-lg: 1.25rem;
    --radius-xl: 1.6rem;
    --radius-pill: 999px;
    --shadow-soft: 0 16px 36px rgba(0, 0, 0, 0.28);
    --shadow-strong: 0 24px 60px rgba(0, 0, 0, 0.42);
    --focus-ring: 0 0 0 3px rgba(214, 167, 86, 0.24);
    --dashboard-shell-gap: clamp(1.15rem, 1.85vw, 1.55rem);
    --dashboard-gap: clamp(1rem, 1.5vw, 1.35rem);
    --dashboard-gap-tight: clamp(0.72rem, 1vw, 0.92rem);
    --dashboard-panel-padding: clamp(1rem, 1.6vw, 1.28rem);
    --dashboard-card-padding: clamp(0.82rem, 1.15vw, 0.98rem);
    --dashboard-motion: cubic-bezier(0.22, 1, 0.36, 1);
    --dashboard-hover-shadow: 0 22px 44px rgba(0, 0, 0, 0.26);
    --dashboard-glow-duration: 15s;
    --dashboard-dock-offset: clamp(0.7rem, 1.8vw, 1rem);
    --dashboard-dock-width: min(100%, 760px);
    --dashboard-sheen: linear-gradient(90deg, rgba(240, 199, 119, 0.92), rgba(143, 183, 255, 0.36) 55%, rgba(100, 214, 163, 0.28));
    --motion-quick: 180ms;
    --motion-base: 220ms;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    min-height: 100%;
    background: var(--bg);
}

body {
    margin: 0;
    min-height: 100dvh;
    font-family: "Manrope", "Segoe UI", sans-serif;
    color: var(--text);
    background: radial-gradient(850px 420px at 88% -10%, rgba(214, 167, 86, 0.16), transparent 58%), radial-gradient(720px 420px at -8% 100%, rgba(214, 167, 86, 0.08), transparent 58%), linear-gradient(180deg, #080c13 0%, #05070b 100%);
    overflow-x: hidden;
    line-height: 1.5;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

@keyframes page-shell-rise {
    from {
        opacity: 0;
        transform: translateY(14px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes dashboard-card-bloom {
    0% {
        box-shadow: 0 12px 28px rgba(0, 0, 0, 0.2), 0 0 0 rgba(214, 167, 86, 0);
    }

    55% {
        box-shadow: 0 22px 44px rgba(0, 0, 0, 0.3), 0 0 32px rgba(214, 167, 86, 0.12);
    }

    100% {
        box-shadow: 0 18px 36px rgba(0, 0, 0, 0.26), 0 0 0 rgba(214, 167, 86, 0);
    }
}

@keyframes dashboard-glow-drift {
    0% {
        opacity: 0.56;
        transform: translate3d(-2%, 1%, 0) scale(0.98);
    }

    50% {
        opacity: 0.92;
        transform: translate3d(3%, -4%, 0) scale(1.06);
    }

    100% {
        opacity: 0.56;
        transform: translate3d(-2%, 1%, 0) scale(0.98);
    }
}

@keyframes dashboard-bar-rise {
    0% {
        opacity: 0.2;
        transform: scaleY(0.08);
    }

    100% {
        opacity: 1;
        transform: scaleY(1);
    }
}

@keyframes dashboard-metric-settle {
    0% {
        opacity: 0;
        transform: translateY(10px) scale(0.98);
    }

    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes dashboard-dock-arrive {
    0% {
        opacity: 0;
        transform: translateY(18px) scale(0.96);
    }

    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

a {
    color: inherit;
}

a,
button,
input,
select,
textarea {
    font: inherit;
}

a,
button {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

button {
    cursor: pointer;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: none;
    box-shadow: var(--focus-ring);
}

h1,
h2,
h3,
h4,
p {
    margin-top: 0;
}

h1,
h2,
h3,
h4 {
    font-family: "Sora", "Manrope", sans-serif;
    letter-spacing: -0.03em;
    color: var(--text);
}

img {
    max-width: 100%;
    display: block;
}

::-webkit-scrollbar {
    width: 9px;
    height: 9px;
}

::-webkit-scrollbar-thumb {
    background: rgba(214, 167, 86, 0.42);
    border-radius: 999px;
}

::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.04);
}

.shell-bg {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background: radial-gradient(circle at 18% 16%, rgba(214, 167, 86, 0.08), transparent 32%), radial-gradient(circle at 88% 8%, rgba(214, 167, 86, 0.12), transparent 28%);
}

.app-shell {
    position: relative;
    z-index: 1;
    min-height: 100dvh;
}

.layout,
.layout {
    position: relative;
    min-height: 100dvh;
    display: grid;
    grid-template-columns: 1fr;
}

.main-content,
.main-content {
    width: 100%;
    max-width: 1480px;
    margin: 0 auto;
    padding: clamp(1rem, 1.7vw, 1.45rem);
}

.page-shell,
.page-shell {
    display: grid;
    gap: var(--dashboard-shell-gap);
}

.app-shell .page-shell > * {
    animation: page-shell-rise var(--motion-base) cubic-bezier(0.22, 1, 0.36, 1) both;
}

.app-shell .page-shell > *:nth-child(2) {
    animation-delay: 0.03s;
}

.app-shell .page-shell > *:nth-child(3) {
    animation-delay: 0.06s;
}

.app-shell .page-shell > *:nth-child(4) {
    animation-delay: 0.09s;
}

.nav-overlay,
.nav-overlay {
    position: fixed;
    inset: 0;
    z-index: 40;
    display: block;
    border: 0;
    padding: 0;
    background: rgba(0, 0, 0, 0.62);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: 0.2s ease;
}

.sidebar,
.sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 50;
    width: min(320px, 88vw);
    min-height: 100dvh;
    max-height: 100dvh;
    overflow-y: auto;
    overflow-x: hidden;
    padding: calc(1rem+env(safe-area-inset-top, 0px)) 1rem calc(1rem+env(safe-area-inset-bottom, 0px));
    background: radial-gradient(280px 180px at 112% -8%, rgba(240, 199, 119, 0.14), transparent 62%), linear-gradient(180deg, rgba(14, 19, 29, 0.98), rgba(7, 10, 16, 0.98));
    border-right: 1px solid var(--panel-border);
    box-shadow: var(--shadow-strong);
    transform: translateX(calc(-100% - 24px));
    transition: transform 0.28s var(--dashboard-motion);
}

.sidebar::before {
    content: "";
    position: absolute;
    inset: -8% -34% auto 50%;
    height: 300px;
    pointer-events: none;
    background: radial-gradient(circle, rgba(240, 199, 119, 0.16) 0%, rgba(240, 199, 119, 0) 70%);
    animation: dashboard-glow-drift var(--dashboard-glow-duration) ease-in-out infinite;
}

.sidebar > * {
    position: relative;
    z-index: 1;
}

body.nav-open {
    overflow: hidden;
}

body.nav-open .nav-overlay {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

body.nav-open .sidebar {
    transform: translateX(0);
}

.brand-wrap,
.brand-wrap {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.8rem;
    margin-bottom: 1rem;
}

.brand,
.brand {
    display: grid;
    gap: 0.65rem;
    color: var(--text);
    text-decoration: none;
}

.brand-logo,
.brand-logo {
    width: 76px;
    height: 76px;
    object-fit: contain;
    border-radius: 1rem;
    padding: 0.35rem;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.03));
    border: 1px solid rgba(214, 167, 86, 0.18);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 16px 34px rgba(0, 0, 0, 0.24);
}

.brand-subtitle,
.brand-subtitle {
    margin: 0;
    color: var(--gold);
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.16em;
}

.sidebar-close,
.sidebar-close,
.menu-btn,
.menu-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-height: 42px;
    border: 1px solid var(--panel-border);
    border-radius: 0.8rem;
    background: rgba(255, 255, 255, 0.04);
    color: var(--text);
    font-weight: 800;
    text-decoration: none;
    padding: 0.45rem 0.75rem;
}

.menu-btn-logo,
.menu-btn-logo {
    width: 28px;
    height: 28px;
    object-fit: contain;
    border-radius: 0.55rem;
}

.menu-btn-label,
.nav-link-copy,
.sidebar-shortcut,
.workspace-bar,
.workspace-bar-copy,
.workspace-link,
.workspace-action-chip,
.mobile-command-head,
.mobile-command-grid,
.mobile-command-link,
.mobile-dock-link {
    display: grid;
}

.menu-btn-label {
    font-size: 0.82rem;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.nav-links,
.nav-links,
.nav-section,
.nav-section {
    display: grid;
    gap: 0.35rem;
}

.nav-section-title,
.nav-section-title {
    margin: 1rem 0 0.25rem;
    color: var(--muted);
    font-size: 0.7rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.14em;
}

.nav-link,
.nav-link {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    min-height: 52px;
    padding: 0.82rem 0.9rem;
    border-radius: 0.85rem;
    color: var(--muted-strong);
    text-decoration: none;
    font-weight: 700;
    border: 1px solid rgba(214, 167, 86, 0.08);
    background: rgba(255, 255, 255, 0.025);
    overflow: hidden;
    transition:
        transform 0.24s var(--dashboard-motion),
        border-color 0.24s var(--dashboard-motion),
        background 0.24s var(--dashboard-motion),
        box-shadow 0.24s var(--dashboard-motion);
}

.nav-link::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    border-radius: 999px;
    background: linear-gradient(180deg, #f0c777, #8fb7ff);
    opacity: 0;
    transform: scaleY(0.35);
    transform-origin: center;
    transition: opacity 0.24s var(--dashboard-motion), transform 0.24s var(--dashboard-motion);
}

.nav-link::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), transparent 48%);
    opacity: 0;
    transition: opacity 0.24s var(--dashboard-motion);
}

.nav-link:hover,
.nav-link.active,
.nav-link:hover,
.nav-link.active {
    color: var(--text);
    transform: translateY(-1px);
    background: rgba(214, 167, 86, 0.08);
    border-color: rgba(214, 167, 86, 0.24);
    box-shadow: 0 16px 28px rgba(0, 0, 0, 0.18);
}

.nav-link:hover::before,
.nav-link.active::before {
    opacity: 1;
    transform: scaleY(1);
}

.nav-link:hover::after,
.nav-link.active::after {
    opacity: 1;
}

.nav-link-copy {
    gap: 0.18rem;
}

.nav-link-copy strong {
    font-size: 0.94rem;
}

.nav-link-copy small {
    color: var(--muted);
    font-size: 0.78rem;
    line-height: 1.45;
}

.logout-form,
.logout-form {
    margin-top: 1rem;
}

.logout-btn,
.logout-btn {
    width: 100%;
    min-height: 42px;
    border: 1px solid var(--panel-border);
    border-radius: 0.85rem;
    background: rgba(255, 255, 255, 0.03);
    color: var(--muted-strong);
    font-weight: 800;
}

.topbar,
.topbar {
    display: grid;
    gap: 0.8rem;
    position: relative;
    margin-bottom: 0.9rem;
    padding: 0.95rem;
    border-radius: var(--radius-xl);
    overflow: hidden;
    isolation: isolate;
    background: radial-gradient(360px 180px at 100% 0%, rgba(240, 199, 119, 0.12), transparent 62%), linear-gradient(145deg, rgba(18, 24, 36, 0.94), rgba(10, 14, 22, 0.94));
    border: 1px solid var(--panel-border);
    box-shadow: 0 20px 42px rgba(0, 0, 0, 0.28);
    backdrop-filter: blur(14px);
}

.topbar::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 1px;
    background: linear-gradient(90deg, rgba(240, 199, 119, 0), rgba(240, 199, 119, 0.72), rgba(143, 183, 255, 0.22), rgba(240, 199, 119, 0));
    opacity: 0.92;
}

.topbar::after {
    content: "";
    position: absolute;
    inset: auto -12% -80px 58%;
    width: 220px;
    height: 220px;
    pointer-events: none;
    background: radial-gradient(circle, rgba(240, 199, 119, 0.12) 0%, rgba(240, 199, 119, 0) 72%);
    animation: dashboard-glow-drift calc(var(--dashboard-glow-duration) + 2s) ease-in-out infinite;
}

.topbar > * {
    position: relative;
    z-index: 1;
}

.topbar-primary,
.topbar-primary {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0.8rem;
}

.topbar-start,
.topbar-start {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.topbar-title-row,
.topbar-title-row {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    flex-wrap: wrap;
}

.topbar h2,
.topbar h2 {
    margin: 0;
    font-size: clamp(1.25rem, 2vw, 1.8rem);
    line-height: 1.1;
}

.topbar p,
.topbar p {
    margin: 0.18rem 0 0;
    color: var(--muted);
    font-size: 0.88rem;
}

.topbar-end,
.topbar-end,
.topbar-utility,
.topbar-utility,
.topbar-status-row,
.topbar-status-row,
.topbar-quick-actions,
.topbar-quick-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.topbar-end,
.topbar-end {
    justify-content: flex-end;
}

.status-chip,
.status-chip,
.panel-header-meta,
.panel-header-meta,
.metric-state,
.metric-state,
.badge,
.badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    width: fit-content;
    min-height: 30px;
    padding: 0.28rem 0.62rem;
    border-radius: var(--radius-pill);
    border: 1px solid rgba(214, 167, 86, 0.22);
    background: rgba(214, 167, 86, 0.08);
    color: var(--gold-strong);
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.status-chip-live,
.metric-state-ok,
.badge-status-delivered,
.badge-stock-healthy,
.badge-alert-enabled {
    color: var(--ok);
    border-color: rgba(100, 214, 163, 0.32);
    background: rgba(100, 214, 163, 0.1);
}

.metric-state-alert,
.badge-status-cancelled,
.badge-stock-critical,
.badge-due-overdue {
    color: var(--danger);
    border-color: rgba(255, 111, 125, 0.34);
    background: rgba(255, 111, 125, 0.1);
}

.metric-state-warn,
.badge-status-pending,
.badge-stock-low,
.badge-stock-watch,
.badge-due-today {
    color: var(--warn);
    border-color: rgba(240, 199, 119, 0.34);
    background: rgba(240, 199, 119, 0.1);
}

.metric-state-neutral,
.badge-due-upcoming {
    color: var(--info);
    border-color: rgba(143, 183, 255, 0.32);
    background: rgba(143, 183, 255, 0.1);
}

.quick-action-link,
.table-action,
.action-btn,
.topbar-switch-btn,
.segment-btn,
.preset-chip,
.pagination-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0.52rem 0.78rem;
    border-radius: 0.8rem;
    border: 1px solid var(--panel-border);
    background: rgba(255, 255, 255, 0.04);
    color: var(--text);
    text-decoration: none;
    font-size: 0.82rem;
    font-weight: 800;
    line-height: 1.1;
    transition: 0.18s ease;
}

.quick-action-link:hover,
.table-action:hover,
.action-btn:hover,
.topbar-switch-btn:hover,
.segment-btn:hover,
.preset-chip:hover,
.pagination-link:hover {
    transform: translateY(-1px);
    border-color: rgba(214, 167, 86, 0.42);
    background: rgba(214, 167, 86, 0.1);
}

.action-btn,
.quick-action-link-cta,
.segment-btn.active,
.preset-chip.active {
    color: #171006;
    background: linear-gradient(135deg, #f0c777, #b98534);
    border-color: rgba(240, 199, 119, 0.56);
}

.panel,
.panel,
.metric-card,
.metric-card,
.action-tile,
.action-tile,
.attention-card,
.attention-card,
.staff-card,
.staff-card,
.report-highlight-card,
.report-highlight-card,
.hero-signal,
.hero-signal {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    border-radius: var(--radius-lg);
    border: 1px solid var(--panel-border);
    background: linear-gradient(145deg, rgba(20, 27, 40, 0.9), rgba(9, 13, 21, 0.92));
    box-shadow: var(--shadow-soft);
    backdrop-filter: blur(16px);
}

.panel,
.panel {
    padding: var(--dashboard-panel-padding);
}

.panel::before,
.metric-card::before,
.action-tile::before,
.attention-card::before,
.staff-card::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent 38%);
}

.panel::after,
.metric-card::after,
.action-tile::after,
.attention-card::after,
.staff-card::after,
.report-highlight-card::after,
.hero-signal::after {
    content: "";
    position: absolute;
    inset: auto -18% -32% 48%;
    height: 120px;
    pointer-events: none;
    background: radial-gradient(circle, rgba(240, 199, 119, 0.16) 0%, rgba(240, 199, 119, 0) 68%);
    opacity: 0.78;
}

.panel>*,
.metric-card>*,
.action-tile>*,
.attention-card>*,
.staff-card>* {
    position: relative;
    z-index: 1;
}

.panel-header,
.panel-header,
.portal-hero-head,
.portal-hero-head,
.report-toolbar,
.report-toolbar {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--dashboard-gap-tight);
    margin-bottom: 0.85rem;
}

.panel-header h3,
.panel-header h3 {
    margin: 0;
    font-size: clamp(1.1rem, 1.5vw, 1.35rem);
}

.panel-subtitle,
.panel-subtitle,
.metric-note,
.metric-delta,
.report-window-meta,
.settings-copy,
.settings-note,
.empty-state {
    color: var(--muted);
}

.portal-hero,
.portal-hero {
    display: grid;
    gap: var(--dashboard-gap);
    padding: clamp(1rem, 2vw, 1.35rem);
    border-radius: var(--radius-xl);
    border: 1px solid rgba(214, 167, 86, 0.22);
    background: radial-gradient(520px 240px at 88% 0%, rgba(214, 167, 86, 0.16), transparent 58%), linear-gradient(145deg, rgba(22, 29, 43, 0.96), rgba(8, 12, 20, 0.96));
    box-shadow: 0 24px 54px rgba(0, 0, 0, 0.3);
    transition:
        border-color 0.28s var(--dashboard-motion),
        box-shadow 0.28s var(--dashboard-motion),
        background 0.28s var(--dashboard-motion);
}

.portal-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 34%),
        linear-gradient(90deg, rgba(240, 199, 119, 0.48), rgba(143, 183, 255, 0.18) 48%, rgba(100, 214, 163, 0.22));
    background-repeat: no-repeat;
    background-size: 100% 100%, 100% 2px;
    background-position: 0 0, 0 0;
}

.portal-hero::after {
    content: "";
    position: absolute;
    inset: auto -14% -56% 42%;
    height: 260px;
    pointer-events: none;
    background: radial-gradient(circle, rgba(240, 199, 119, 0.2) 0%, rgba(240, 199, 119, 0) 72%);
    animation: dashboard-glow-drift calc(var(--dashboard-glow-duration) + 4s) ease-in-out infinite;
}

.portal-badge {
    backdrop-filter: blur(12px);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.portal-hero-title,
.portal-hero-title {
    margin: 0;
    max-width: 28ch;
    font-size: clamp(1.45rem, 2.4vw, 2.3rem);
    line-height: 1.05;
    text-wrap: balance;
}

.portal-hero-copy,
.portal-hero-copy {
    margin: 0.65rem 0 0;
    max-width: 68ch;
    color: var(--muted);
    font-size: clamp(0.98rem, 1.15vw, 1.06rem);
}

.metric-grid,
.metric-grid,
.action-grid,
.action-grid,
.attention-rail,
.attention-rail,
.report-highlight-grid,
.report-highlight-grid,
.staff-card-grid,
.staff-card-grid,
.settings-grid,
.settings-grid {
    display: grid;
    gap: 1rem;
}

.metric-grid,
.metric-grid,
.action-grid,
.action-grid,
.attention-rail,
.attention-rail,
.report-highlight-grid,
.report-highlight-grid,
.staff-card-grid,
.staff-card-grid {
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
}

.metric-card,
.metric-card,
.action-tile,
.action-tile,
.attention-card,
.attention-card,
.report-highlight-card,
.report-highlight-card,
.staff-card,
.staff-card {
    padding: 1rem;
}

.metric-card,
.attention-card,
.hero-signal,
.dashboard-hero-card,
.staff-summary-card,
.staff-pulse-card,
.module-snapshot-card {
    transition:
        transform 0.28s var(--dashboard-motion),
        border-color 0.28s var(--dashboard-motion),
        background 0.28s var(--dashboard-motion),
        box-shadow 0.28s var(--dashboard-motion);
}

.dashboard-hero-card,
.staff-summary-card,
.staff-pulse-card,
.module-snapshot-card {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.dashboard-hero-card::before,
.staff-summary-card::before,
.staff-pulse-card::before,
.module-snapshot-card::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), transparent 42%);
}

.dashboard-hero-card::after,
.staff-summary-card::after,
.staff-pulse-card::after,
.module-snapshot-card::after {
    content: "";
    position: absolute;
    inset: auto -14% -42% 50%;
    height: 150px;
    pointer-events: none;
    background: radial-gradient(circle, rgba(240, 199, 119, 0.14) 0%, rgba(240, 199, 119, 0) 70%);
    opacity: 0.84;
}

.dashboard-hero-card > *,
.staff-summary-card > *,
.staff-pulse-card > *,
.module-snapshot-card > * {
    position: relative;
    z-index: 1;
}

.metric-card:hover,
.attention-card:hover,
.hero-signal:hover,
.dashboard-hero-card:hover,
.staff-summary-card:hover,
.staff-pulse-card:hover,
.module-snapshot-card:hover {
    transform: translateY(-3px);
    border-color: rgba(214, 167, 86, 0.24);
    box-shadow: var(--dashboard-hover-shadow);
}

.metric-card:hover,
.attention-card:hover,
.hero-signal:hover {
    background: linear-gradient(180deg, rgba(214, 167, 86, 0.08), rgba(255, 255, 255, 0.03));
}

.metric-card {
    min-height: 100%;
    display: grid;
    grid-template-rows: auto auto 1fr;
    align-content: start;
    gap: 0.35rem;
}

.metric-card::after {
    inset: auto -8% -46% 54%;
    height: 150px;
    opacity: 0.7;
}

.dashboard-hero-card:hover,
.staff-summary-card:hover,
.staff-pulse-card:hover,
.module-snapshot-card:hover {
    background: linear-gradient(180deg, rgba(214, 167, 86, 0.09), rgba(255, 255, 255, 0.035));
}

.metric-card h3,
.metric-card h3,
.attention-card-label,
.hero-signal-label,
.report-highlight-card h4 {
    margin: 0;
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.12em;
}

.metric-card p,
.metric-card p {
    margin: 0.75rem 0 0;
    color: var(--text);
    font-size: clamp(1.8rem, 4vw, 2.55rem);
    font-weight: 900;
    letter-spacing: -0.05em;
    line-height: 1;
}

.metric-summary {
    display: block;
    margin-top: 0.7rem;
    color: var(--muted-strong);
    font-weight: 700;
}

.metric-delta,
.metric-note {
    display: block;
    margin-top: 0.35rem;
    font-size: 0.86rem;
}

.metric-delta-up,
.report-delta-up {
    color: var(--ok);
}

.metric-delta-down,
.report-delta-down {
    color: var(--danger);
}

.action-tile {
    color: var(--text);
    text-decoration: none;
    transition: 0.18s ease;
}

.action-tile:hover {
    transform: translateY(-2px);
    border-color: rgba(214, 167, 86, 0.38);
}

.action-tile strong {
    font-size: 1rem;
}

.action-tile span,
.attention-card p,
.hero-signal small,
.focus-list small {
    color: var(--muted);
}

.brand-block,
.brand-copy,
.topbar-title-block,
.dashboard-view,
.dashboard-panel-group,
.dashboard-hero-copy,
.dashboard-hero-aside,
.dashboard-hero-card,
.dashboard-view-management,
.dashboard-view-staff,
.module-view,
.dashboard-priority-preview,
.settings-card,
.settings-toggle-row span {
    display: grid;
    gap: var(--dashboard-gap-tight);
}

.brand-mark,
.sidebar-presence,
.attention-card-head,
.metric-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

.brand-mark {
    align-items: center;
}

.brand-copy {
    gap: 0.18rem;
}

.brand-title {
    font-family: "Sora", "Manrope", sans-serif;
    font-size: 1.14rem;
    font-weight: 700;
    line-height: 1;
}

.sidebar-presence,
.dashboard-hero-card,
.filter-shell,
.stock-filter-form,
.focus-list li,
.activity-list li,
.settings-toggle-row {
    background: rgba(255, 255, 255, 0.035);
}

.report-table-wrap,
.filter-shell,
.stock-filter-form,
.dashboard-hero-card,
.dashboard-accordion-card,
.focus-list li,
.activity-list li,
.settings-toggle-row,
.dashboard-section-stat,
.dashboard-record-row,
.staff-summary-card,
.staff-focus-item,
.staff-pulse-card,
.dashboard-command-card,
.module-snapshot-card {
    backdrop-filter: blur(14px);
}

.sidebar-presence {
    padding: 0.82rem 0.9rem;
    border: 1px solid var(--panel-border);
    border-radius: var(--radius-md);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.025));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.sidebar-presence-dot {
    width: 0.72rem;
    height: 0.72rem;
    flex: 0 0 auto;
    border-radius: 999px;
    background: var(--ok);
    box-shadow: 0 0 0 0.24rem rgba(100, 214, 163, 0.12);
}

.sidebar-presence-copy {
    display: grid;
    gap: 0.12rem;
}

.sidebar-presence-copy strong {
    font-size: 0.92rem;
}

.sidebar-presence-copy small {
    color: var(--muted);
}

.sidebar-venue-switcher {
    border: 1px solid var(--panel-border);
    border-radius: var(--radius-md);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.03));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
    overflow: hidden;
}

.sidebar-venue-switcher summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.82rem 0.9rem;
    cursor: pointer;
    list-style: none;
    font-size: 0.86rem;
    font-weight: 800;
}

.sidebar-venue-switcher summary::-webkit-details-marker {
    display: none;
}

.sidebar-venue-switcher summary small {
    color: var(--muted);
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.sidebar-venue-switcher-body,
.sidebar-venue-switcher-actions {
    display: grid;
    gap: 0.6rem;
}

.sidebar-venue-switcher-body {
    padding: 0 0.9rem 0.9rem;
}

.sidebar-venue-option {
    display: grid;
    gap: 0.18rem;
    padding: 0.78rem 0.82rem;
    border: 1px solid rgba(214, 167, 86, 0.14);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.025);
    color: var(--muted-strong);
    text-decoration: none;
    transition:
        transform 0.24s var(--dashboard-motion),
        border-color 0.24s var(--dashboard-motion),
        background 0.24s var(--dashboard-motion),
        box-shadow 0.24s var(--dashboard-motion);
}

.sidebar-venue-option small {
    color: var(--muted);
}

.sidebar-venue-option:hover,
.sidebar-venue-option.active {
    color: var(--text);
    transform: translateY(-1px);
    border-color: rgba(214, 167, 86, 0.24);
    background: rgba(214, 167, 86, 0.1);
    box-shadow: 0 14px 26px rgba(0, 0, 0, 0.16);
}

.sidebar-venue-switcher-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.topbar-title-block {
    gap: 0.14rem;
    min-width: 0;
}

.workspace-bar {
    gap: 0.9rem;
    margin-bottom: 1rem;
    padding: 0.95rem 1rem;
    border-radius: var(--radius-xl);
    border: 1px solid var(--panel-border);
    background: linear-gradient(145deg, rgba(16, 22, 34, 0.9), rgba(8, 11, 19, 0.92));
    box-shadow: var(--shadow-soft);
}

.workspace-bar-copy {
    gap: 0.2rem;
}

.workspace-bar-kicker {
    margin: 0;
    color: var(--gold-strong);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.16em;
}

.workspace-bar-copy strong {
    font-size: 1rem;
    line-height: 1.1;
}

.workspace-bar-copy span {
    color: var(--muted);
    font-size: 0.86rem;
}

.workspace-link-row,
.workspace-action-row,
.sidebar-shortcut-grid {
    display: grid;
    gap: 0.75rem;
}

.workspace-link-row {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.workspace-link,
.workspace-action-chip,
.sidebar-shortcut {
    gap: 0.25rem;
    padding: 0.82rem 0.9rem;
    border-radius: var(--radius-lg);
    border: 1px solid rgba(214, 167, 86, 0.14);
    background: rgba(255, 255, 255, 0.035);
    color: var(--text);
    text-decoration: none;
    transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}

.workspace-link {
    min-height: 88px;
}

.workspace-link:hover,
.workspace-link.active,
.workspace-action-chip:hover,
.sidebar-shortcut:hover {
    transform: translateY(-1px);
    border-color: rgba(214, 167, 86, 0.28);
    background: rgba(214, 167, 86, 0.08);
}

.workspace-link.active {
    background: linear-gradient(180deg, rgba(214, 167, 86, 0.16), rgba(255, 255, 255, 0.04));
}

.workspace-link-label,
.workspace-action-chip strong,
.sidebar-shortcut strong {
    font-size: 0.92rem;
}

.workspace-link small,
.workspace-action-chip small,
.sidebar-shortcut small {
    color: var(--muted);
    line-height: 1.45;
}

.workspace-action-row,
.sidebar-shortcut-grid {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.workspace-action-chip-primary,
.sidebar-shortcut-primary {
    background: linear-gradient(135deg, rgba(240, 199, 119, 0.18), rgba(185, 133, 52, 0.12));
    border-color: rgba(240, 199, 119, 0.36);
}

.topbar-eyebrow,
.kicker {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin: 0;
    color: var(--gold-strong);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.16em;
}

.status-chip-user {
    gap: 0.45rem;
    text-transform: none;
    letter-spacing: 0;
}

.status-chip-user strong,
.status-chip-user small {
    color: inherit;
    font-size: inherit;
}

.status-chip-user small {
    opacity: 0.72;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.status-chip-time {
    color: var(--text);
    border-color: rgba(214, 167, 86, 0.18);
    background: rgba(255, 255, 255, 0.055);
}

.topbar-mode-chip {
    color: var(--text);
    border-color: rgba(214, 167, 86, 0.22);
    background: linear-gradient(135deg, rgba(240, 199, 119, 0.14), rgba(255, 255, 255, 0.04));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.dashboard-hero-grid,
.hero-signal-bar,
.overview-board {
    display: grid;
    gap: var(--dashboard-gap);
}

.dashboard-command-grid,
.dashboard-rhythm-grid,
.staff-pulse-grid,
.dashboard-rhythm-legend,
.dashboard-rhythm-key,
.throughput-column,
.throughput-stack {
    display: grid;
    gap: var(--dashboard-gap-tight);
}

.dashboard-hero-grid {
    grid-template-columns: minmax(0, 1.45fr) minmax(280px, 0.85fr);
    align-items: start;
}

.dashboard-hero-copy {
    min-width: 0;
}

.dashboard-hero-card {
    padding: var(--dashboard-panel-padding);
    border: 1px solid var(--panel-border);
    border-radius: var(--radius-lg);
    background: radial-gradient(220px 120px at 100% 0%, rgba(240, 199, 119, 0.08), transparent 66%), linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.03));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.dashboard-command-grid {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.dashboard-view-management,
.dashboard-view-staff {
    display: grid;
    gap: var(--dashboard-shell-gap);
}

.portal-hero-compact {
    gap: var(--dashboard-gap);
}

.portal-command-grid {
    margin-top: 1rem;
}

.portal-panel {
    display: grid;
    gap: var(--dashboard-gap);
    position: relative;
    overflow: clip;
    isolation: isolate;
    transition:
        transform 0.28s var(--dashboard-motion),
        border-color 0.28s var(--dashboard-motion),
        background 0.28s var(--dashboard-motion),
        box-shadow 0.28s var(--dashboard-motion);
    background: radial-gradient(260px 160px at 100% 0%, rgba(214, 167, 86, 0.08), transparent 62%), linear-gradient(145deg, rgba(18, 25, 38, 0.94), rgba(9, 13, 21, 0.94));
    box-shadow: 0 22px 48px rgba(0, 0, 0, 0.24);
    backdrop-filter: blur(18px);
}

.portal-panel::before {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.07), transparent 36%),
        var(--dashboard-sheen);
    background-repeat: no-repeat;
    background-size: 100% 100%, 100% 1px;
    background-position: 0 0, 0 0;
}

.portal-panel::after {
    inset: auto -10% -50% 54%;
    height: 180px;
    background: radial-gradient(circle, rgba(240, 199, 119, 0.16) 0%, rgba(240, 199, 119, 0) 72%);
    opacity: 0.82;
}

.portal-panel:hover {
    transform: translateY(-3px);
    border-color: rgba(214, 167, 86, 0.28);
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.3);
}

.dashboard-view-management .portal-hero {
    background: radial-gradient(440px 220px at 86% 0%, rgba(143, 183, 255, 0.16), transparent 60%), radial-gradient(360px 180px at 12% 100%, rgba(240, 199, 119, 0.12), transparent 62%), linear-gradient(145deg, rgba(20, 28, 42, 0.98), rgba(8, 12, 20, 0.98));
}

.dashboard-view-management .portal-badge {
    color: #bdd0fb;
    border-color: rgba(143, 183, 255, 0.34);
    background: rgba(143, 183, 255, 0.12);
}

.dashboard-view-staff .portal-hero {
    background: radial-gradient(460px 220px at 88% 0%, rgba(100, 214, 163, 0.14), transparent 60%), radial-gradient(360px 180px at 12% 100%, rgba(240, 199, 119, 0.12), transparent 62%), linear-gradient(145deg, rgba(19, 29, 38, 0.98), rgba(7, 12, 18, 0.98));
}

.dashboard-view-staff .portal-badge {
    color: #7ed6b5;
    border-color: rgba(100, 214, 163, 0.34);
    background: rgba(100, 214, 163, 0.12);
}

.module-view .portal-badge {
    color: var(--gold-strong);
}

.module-view {
    gap: var(--dashboard-shell-gap);
}

.module-view-stock .portal-hero {
    background: radial-gradient(460px 220px at 88% 0%, rgba(85, 204, 191, 0.15), transparent 60%), radial-gradient(360px 180px at 8% 100%, rgba(240, 199, 119, 0.12), transparent 62%), linear-gradient(145deg, rgba(18, 30, 36, 0.98), rgba(8, 12, 20, 0.98));
}

.module-view-orders .portal-hero {
    background: radial-gradient(460px 220px at 88% 0%, rgba(143, 183, 255, 0.16), transparent 60%), radial-gradient(360px 180px at 8% 100%, rgba(240, 199, 119, 0.12), transparent 62%), linear-gradient(145deg, rgba(18, 26, 39, 0.98), rgba(8, 12, 20, 0.98));
}

.module-view-shifts .portal-hero {
    background: radial-gradient(460px 220px at 88% 0%, rgba(110, 196, 183, 0.15), transparent 60%), radial-gradient(360px 180px at 8% 100%, rgba(143, 183, 255, 0.1), transparent 62%), linear-gradient(145deg, rgba(17, 28, 37, 0.98), rgba(8, 12, 20, 0.98));
}

.module-view-checklists .portal-hero {
    background: radial-gradient(460px 220px at 88% 0%, rgba(240, 199, 119, 0.18), transparent 60%), radial-gradient(360px 180px at 8% 100%, rgba(100, 214, 163, 0.1), transparent 62%), linear-gradient(145deg, rgba(22, 29, 40, 0.98), rgba(8, 12, 20, 0.98));
}

.dashboard-command-card,
.staff-pulse-card {
    display: grid;
    gap: 0.5rem;
    padding: var(--dashboard-panel-padding);
    border-radius: var(--radius-lg);
    border: 1px solid rgba(214, 167, 86, 0.16);
    background: rgba(255, 255, 255, 0.035);
    color: var(--text);
    text-decoration: none;
    box-shadow: var(--shadow-soft);
    transition:
        transform 0.26s var(--dashboard-motion),
        border-color 0.26s var(--dashboard-motion),
        background 0.26s var(--dashboard-motion),
        box-shadow 0.26s var(--dashboard-motion);
}

.dashboard-command-card:hover,
.staff-pulse-card:hover {
    transform: translateY(-3px);
    border-color: rgba(214, 167, 86, 0.32);
    background: rgba(214, 167, 86, 0.1);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.24);
}

.dashboard-command-card strong,
.staff-pulse-card strong {
    font-size: clamp(1.05rem, 1.8vw, 1.25rem);
    line-height: 1.15;
    letter-spacing: -0.02em;
}

.dashboard-command-card p,
.staff-pulse-card p {
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
}

.dashboard-command-label,
.dashboard-command-meta {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.dashboard-command-meta {
    margin-top: 0.15rem;
    color: var(--gold-strong);
}

.dashboard-rhythm-grid {
    grid-template-columns: minmax(0, 1.25fr) minmax(280px, 0.75fr);
    align-items: start;
}

.dashboard-rhythm-legend {
    gap: 0.95rem;
}

.dashboard-rhythm-key {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 0.75rem;
    padding: 0.82rem;
    border-radius: var(--radius-md);
    border: 1px solid rgba(214, 167, 86, 0.12);
    background: rgba(255, 255, 255, 0.03);
}

.dashboard-rhythm-key strong {
    font-size: 0.92rem;
}

.dashboard-rhythm-key small {
    color: var(--muted);
    line-height: 1.45;
}

.throughput-key {
    width: 0.82rem;
    height: 0.82rem;
    margin-top: 0.2rem;
    border-radius: 999px;
}

.throughput-key-service {
    background: linear-gradient(180deg, #f0c777, #a06b24);
}

.throughput-key-task {
    background: linear-gradient(180deg, #8fb7ff, #356db6);
}

.dashboard-hero-card-compact {
    gap: 0.78rem;
    align-content: start;
}

.dashboard-priority-preview {
    gap: 0.3rem;
}

.dashboard-priority-preview strong {
    font-size: 1.08rem;
}

.dashboard-priority-preview span {
    color: var(--muted);
}

.dashboard-panel-controls {
    padding: 0.9rem;
    border: 1px solid var(--panel-border);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, 0.03);
}

.dashboard-panel-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-left: auto;
}

.dashboard-panel-select-label {
    display: none;
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.dashboard-panel-select {
    min-width: 180px;
    max-width: 220px;
}

.dashboard-collapsible-body {
    display: grid;
    gap: var(--dashboard-gap);
    overflow: hidden;
    will-change: height, opacity;
}

.dashboard-priority-stack {
    gap: var(--dashboard-gap);
}

.dashboard-accordion-group,
.dashboard-accordion-card,
.dashboard-accordion-trigger,
.dashboard-accordion-summary,
.dashboard-accordion-metrics,
.dashboard-accordion-content {
    display: grid;
    gap: var(--dashboard-gap-tight);
}

.dashboard-accordion-group {
    gap: clamp(0.82rem, 1vw, 0.98rem);
}

.dashboard-accordion-card {
    position: relative;
    padding: 0;
    overflow: hidden;
    border: 1px solid rgba(214, 167, 86, 0.12);
    border-radius: var(--radius-lg);
    background: radial-gradient(220px 140px at 100% 0%, rgba(214, 167, 86, 0.07), transparent 70%), linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.02));
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.22);
    transition:
        border-color 0.28s var(--dashboard-motion),
        background 0.28s var(--dashboard-motion),
        transform 0.28s var(--dashboard-motion),
        box-shadow 0.28s var(--dashboard-motion);
}

.dashboard-accordion-card::before,
.dashboard-accordion-card::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    transition: opacity 0.28s var(--dashboard-motion), transform 0.32s var(--dashboard-motion);
}

.dashboard-accordion-card::before {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 34%),
        var(--dashboard-sheen);
    background-repeat: no-repeat;
    background-size: 100% 100%, 100% 1px;
    background-position: 0 0, 0 0;
    opacity: 0.7;
}

.dashboard-accordion-card::after {
    inset: auto -16% -54% 50%;
    height: 190px;
    background: radial-gradient(circle, rgba(240, 199, 119, 0.22) 0%, rgba(240, 199, 119, 0) 70%);
    opacity: 0;
    transform: translateY(20px);
}

.dashboard-accordion-card > * {
    position: relative;
    z-index: 1;
}

.dashboard-accordion-card:hover {
    transform: translateY(-3px);
    border-color: rgba(214, 167, 86, 0.28);
    background: radial-gradient(220px 140px at 100% 0%, rgba(214, 167, 86, 0.14), transparent 70%), linear-gradient(180deg, rgba(214, 167, 86, 0.08), rgba(255, 255, 255, 0.03));
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.28);
}

.dashboard-accordion-card.is-open {
    border-color: rgba(214, 167, 86, 0.34);
    background: radial-gradient(220px 140px at 100% 0%, rgba(214, 167, 86, 0.18), transparent 70%), linear-gradient(180deg, rgba(214, 167, 86, 0.12), rgba(255, 255, 255, 0.03));
    box-shadow: 0 28px 58px rgba(0, 0, 0, 0.34);
    animation: dashboard-card-bloom 0.42s var(--dashboard-motion);
}

.dashboard-accordion-card.is-open::after {
    opacity: 0.9;
    transform: translateY(0);
}

.dashboard-accordion-trigger {
    width: 100%;
    padding: var(--dashboard-panel-padding);
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
    grid-template-columns: minmax(0, 1.2fr) minmax(220px, auto) auto;
    align-items: start;
    cursor: pointer;
}

.dashboard-accordion-trigger:hover {
    color: var(--text);
}

.dashboard-accordion-summary {
    min-width: 0;
    gap: 0.28rem;
    align-content: start;
}

.dashboard-accordion-label {
    color: var(--text);
    font-size: 0.88rem;
    font-weight: 800;
    letter-spacing: -0.01em;
}

.dashboard-accordion-summary strong {
    font-size: clamp(1.02rem, 1.5vw, 1.22rem);
    line-height: 1.12;
    letter-spacing: -0.02em;
    max-width: 24ch;
    text-wrap: balance;
}

.dashboard-accordion-summary small {
    color: var(--muted);
    line-height: 1.5;
    max-width: 62ch;
}

.dashboard-accordion-metrics {
    grid-auto-flow: column;
    grid-auto-columns: minmax(88px, 1fr);
    gap: 0.65rem;
    align-items: stretch;
    align-self: start;
}

.dashboard-accordion-metric {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
    min-height: 78px;
    align-content: start;
    padding: 0.78rem 0.82rem;
    border: 1px solid rgba(214, 167, 86, 0.12);
    border-radius: var(--radius-md);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 10px 22px rgba(0, 0, 0, 0.14);
    transition:
        border-color 0.24s var(--dashboard-motion),
        background 0.24s var(--dashboard-motion),
        transform 0.24s var(--dashboard-motion);
}

.dashboard-accordion-card.is-open .dashboard-accordion-metric {
    border-color: rgba(214, 167, 86, 0.2);
    background: linear-gradient(180deg, rgba(214, 167, 86, 0.12), rgba(255, 255, 255, 0.03));
    transform: translateY(-1px);
    animation: dashboard-metric-settle 0.34s var(--dashboard-motion) both;
}

.dashboard-accordion-card.is-open .dashboard-accordion-metric:nth-child(2) {
    animation-delay: 0.04s;
}

.dashboard-accordion-card.is-open .dashboard-accordion-metric:nth-child(3) {
    animation-delay: 0.08s;
}

.dashboard-accordion-card.is-open .dashboard-accordion-label {
    color: #f1d69a;
}

.dashboard-accordion-card.is-open .dashboard-accordion-summary strong {
    color: #fff7df;
}

.dashboard-accordion-metric strong {
    font-family: "Sora", "Manrope", sans-serif;
    font-size: 1.05rem;
    line-height: 1;
    letter-spacing: -0.03em;
}

.dashboard-accordion-metric small {
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.dashboard-accordion-icon {
    position: relative;
    width: 2.2rem;
    height: 2.2rem;
    justify-self: end;
    align-self: start;
    margin-top: 0.12rem;
    border: 1px solid rgba(214, 167, 86, 0.18);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.04);
    transition:
        transform 0.32s var(--dashboard-motion),
        border-color 0.24s var(--dashboard-motion),
        background 0.24s var(--dashboard-motion),
        box-shadow 0.24s var(--dashboard-motion);
}

.dashboard-accordion-icon::before,
.dashboard-accordion-icon::after {
    content: "";
    position: absolute;
    inset: 50% auto auto 50%;
    width: 0.72rem;
    height: 1.5px;
    background: currentColor;
    transform: translate(-50%, -50%);
    transition: transform 0.24s var(--dashboard-motion), opacity 0.24s var(--dashboard-motion);
}

.dashboard-accordion-icon::after {
    transform: translate(-50%, -50%) rotate(90deg);
}

.dashboard-accordion-card.is-open .dashboard-accordion-icon {
    border-color: rgba(240, 199, 119, 0.42);
    background: rgba(214, 167, 86, 0.14);
    transform: rotate(180deg) scale(1.04);
    box-shadow: 0 10px 22px rgba(214, 167, 86, 0.16);
}

.dashboard-accordion-card.is-open .dashboard-accordion-icon::after {
    opacity: 0;
    transform: translate(-50%, -50%) rotate(90deg) scaleX(0.4);
}

.dashboard-accordion-body {
    padding: 0 var(--dashboard-panel-padding) var(--dashboard-panel-padding);
    border-top: 1px solid rgba(214, 167, 86, 0.1);
    overflow: hidden;
    will-change: height, opacity;
}

.dashboard-accordion-content {
    gap: var(--dashboard-gap);
    padding-top: 0.35rem;
}

.dashboard-accordion-body[data-dashboard-visibility="opening"],
.dashboard-accordion-body[data-dashboard-visibility="closing"],
.dashboard-collapsible-body[data-dashboard-visibility="opening"],
.dashboard-collapsible-body[data-dashboard-visibility="closing"] {
    pointer-events: none;
}

.dashboard-accordion-content,
.dashboard-collapsible-body > * {
    transition: transform 0.28s var(--dashboard-motion), opacity 0.24s ease;
}

.dashboard-accordion-body[data-dashboard-visibility="closed"] .dashboard-accordion-content,
.dashboard-accordion-body[data-dashboard-visibility="closing"] .dashboard-accordion-content,
.dashboard-collapsible-body[data-dashboard-visibility="closed"] > *,
.dashboard-collapsible-body[data-dashboard-visibility="closing"] > * {
    opacity: 0;
    transform: translateY(-0.35rem);
}

.dashboard-accordion-body[data-dashboard-visibility="open"] .dashboard-accordion-content,
.dashboard-accordion-body[data-dashboard-visibility="opening"] .dashboard-accordion-content,
.dashboard-collapsible-body[data-dashboard-visibility="open"] > *,
.dashboard-collapsible-body[data-dashboard-visibility="opening"] > * {
    opacity: 1;
    transform: translateY(0);
}

.dashboard-section-actions {
    padding-top: 0.15rem;
}

.dashboard-snapshot-panel .metric-grid {
    margin-top: 0.1rem;
}

.panel-collapse-toggle {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    white-space: nowrap;
    padding-right: 2.2rem;
    transition:
        transform 0.24s var(--dashboard-motion),
        border-color 0.24s var(--dashboard-motion),
        background 0.24s var(--dashboard-motion),
        box-shadow 0.24s var(--dashboard-motion),
        color 0.24s var(--dashboard-motion);
}

.panel-collapse-toggle::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0.88rem;
    width: 0.5rem;
    height: 0.5rem;
    border-right: 1.6px solid currentColor;
    border-bottom: 1.6px solid currentColor;
    transform: translateY(-62%) rotate(45deg);
    transition: transform 0.24s var(--dashboard-motion);
}

.panel-collapse-toggle[aria-expanded="true"] {
    border-color: rgba(240, 199, 119, 0.52);
    background: linear-gradient(135deg, rgba(240, 199, 119, 0.18), rgba(185, 133, 52, 0.14));
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.16);
}

.panel-collapse-toggle[aria-expanded="true"]::after {
    transform: translateY(-38%) rotate(-135deg);
}

.overview-board {
    grid-template-columns: minmax(0, 1.05fr) minmax(280px, 0.95fr);
}

.dashboard-overview-compact {
    align-items: start;
}

.dashboard-section-tabs {
    margin-bottom: 1rem;
    padding-bottom: 0.35rem;
    border-bottom: 1px solid rgba(214, 167, 86, 0.14);
}

.dashboard-section-tabs .segment-btn {
    min-height: 36px;
    padding: 0.42rem 0.72rem;
    border-color: rgba(214, 167, 86, 0.14);
    background: transparent;
    color: var(--muted-strong);
}

.dashboard-section-tabs .segment-btn.active {
    color: var(--text);
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(214, 167, 86, 0.22);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.dashboard-section-tabs .segment-btn:hover {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(214, 167, 86, 0.2);
}

.dashboard-workspace-group {
    gap: 0;
    padding-top: 0.15rem;
}

.dashboard-workspace-shell {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr);
    gap: 1rem;
    align-items: start;
}

.dashboard-workspace-main,
.dashboard-workspace-side,
.dashboard-workspace-head,
.dashboard-record-copy {
    display: grid;
    gap: 0.75rem;
}

.dashboard-workspace-kicker {
    margin: 0;
    color: var(--muted);
    letter-spacing: 0.12em;
}

.dashboard-workspace-head h4 {
    margin: 0;
    font-size: clamp(1.05rem, 1.6vw, 1.3rem);
    letter-spacing: -0.02em;
}

.dashboard-section-link {
    align-self: start;
}

.dashboard-section-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: var(--dashboard-gap-tight);
}

.dashboard-section-stat,
.dashboard-record-row {
    padding: var(--dashboard-card-padding);
    border: 1px solid rgba(214, 167, 86, 0.12);
    border-radius: var(--radius-md);
    background: rgba(255, 255, 255, 0.025);
}

.dashboard-section-stat {
    display: grid;
    gap: 0.35rem;
}

.dashboard-section-stat span {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.dashboard-section-stat strong {
    font-size: 1.18rem;
    line-height: 1.05;
    letter-spacing: -0.02em;
}

.dashboard-record-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.75rem;
}

.dashboard-record-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--dashboard-gap-tight);
    transition:
        border-color 0.24s var(--dashboard-motion),
        background 0.24s var(--dashboard-motion),
        transform 0.24s var(--dashboard-motion),
        box-shadow 0.24s var(--dashboard-motion);
}

.dashboard-row-link {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--dashboard-gap-tight);
    width: 100%;
    color: inherit;
    text-decoration: none;
    transition: transform 0.24s var(--dashboard-motion), color 0.18s ease;
}

.dashboard-row-link > div,
.dashboard-row-link .dashboard-record-copy,
.dashboard-row-link .staff-focus-copy {
    min-width: 0;
}

.dashboard-record-row:hover,
.focus-list li:hover,
.activity-list li:hover,
.staff-focus-item:hover {
    border-color: rgba(214, 167, 86, 0.24);
    background: rgba(214, 167, 86, 0.06);
    transform: translateY(-1px);
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.18);
}

.dashboard-row-link:hover {
    transform: translateY(-1px);
}

.dashboard-record-copy strong {
    font-size: 0.96rem;
}

.dashboard-record-copy small,
.dashboard-record-note {
    color: var(--muted);
}

.dashboard-record-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin-left: auto;
}

.dashboard-record-note {
    font-size: 0.82rem;
    line-height: 1.45;
}

.dashboard-record-row-actionable {
    align-items: center;
}

.dashboard-view-staff,
.module-view,
.staff-command-main,
.staff-priority-grid,
.staff-pulse-grid,
.staff-summary-grid,
.staff-workspace-grid,
.staff-tool-grid,
.staff-focus-list,
.staff-summary-card,
.staff-focus-copy,
.module-board-shell,
.module-command-main,
.module-action-panel,
.module-action-stack,
.module-snapshot-grid,
.module-snapshot-card,
.module-snapshot-copy {
    display: grid;
    gap: var(--dashboard-gap);
}

.module-workspace-panel {
    gap: var(--dashboard-shell-gap);
}

.module-card-grid {
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}

.module-chart-shell {
    align-items: start;
}

.staff-command-shell,
.module-command-shell {
    display: grid;
    grid-template-columns: minmax(0, 1.24fr) minmax(300px, 0.76fr);
    gap: clamp(1rem, 1.55vw, 1.25rem);
    align-items: start;
}

.staff-priority-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.staff-pulse-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.staff-priority-card {
    min-height: 100%;
}

.staff-focus-panel,
.module-action-panel {
    align-content: start;
}

.staff-focus-list {
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 0.75rem;
}

.staff-focus-item,
.staff-summary-card,
.staff-pulse-card,
.module-snapshot-card {
    padding: var(--dashboard-card-padding);
    border: 1px solid rgba(214, 167, 86, 0.14);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, 0.035);
}

.staff-focus-item,
.staff-summary-head,
.staff-tool-head,
.module-snapshot-head,
.module-utility-links {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

.staff-focus-kicker,
.staff-summary-label,
.staff-pulse-label,
.module-snapshot-label {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.staff-focus-copy {
    gap: 0.3rem;
}

.staff-focus-copy strong {
    font-size: 1rem;
}

.staff-focus-copy small,
.staff-summary-copy,
.staff-pulse-card p,
.module-snapshot-copy {
    color: var(--muted-strong);
}

.staff-summary-grid,
.module-snapshot-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.staff-summary-card {
    gap: 0.75rem;
}

.staff-summary-value,
.module-snapshot-value {
    font-family: "Sora", "Manrope", sans-serif;
    font-size: clamp(1.5rem, 3vw, 2rem);
    line-height: 1;
    letter-spacing: -0.04em;
}

.staff-summary-copy {
    margin: 0;
    line-height: 1.55;
}

.staff-workspace-grid {
    grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
    align-items: start;
}

.staff-tool-grid {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.staff-tool-card {
    gap: 0.8rem;
}

.staff-tool-head .filter-chip {
    justify-self: start;
}

.staff-activity-list {
    gap: 0.6rem;
}

.module-action-stack .action-btn,
.module-action-stack .table-action {
    width: 100%;
}

.module-utility-links {
    flex-wrap: wrap;
    justify-content: flex-start;
}

.module-utility-links .table-action,
.module-utility-links .filter-chip {
    width: auto;
}

.module-toolbar-note {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    flex-wrap: wrap;
}

.action-tile {
    display: grid;
    gap: 0.55rem;
    align-content: start;
    min-height: 100%;
}

.attention-card {
    display: grid;
    gap: 0.7rem;
}

.attention-card-head strong,
.hero-signal strong {
    font-size: clamp(1.18rem, 2vw, 1.55rem);
    line-height: 1.05;
    letter-spacing: -0.03em;
}

.attention-card p,
.hero-signal small {
    margin: 0;
    line-height: 1.55;
}

.attention-card-link {
    margin-top: auto;
}

.hero-signal-bar {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-top: var(--dashboard-gap);
}

.hero-signal {
    display: grid;
    gap: 0.55rem;
    padding: var(--dashboard-panel-padding);
}

.hero-signal-neutral {
    background: linear-gradient(180deg, rgba(143, 183, 255, 0.08), rgba(255, 255, 255, 0.03));
}

.hero-signal-ok {
    background: linear-gradient(180deg, rgba(100, 214, 163, 0.08), rgba(255, 255, 255, 0.03));
}

.hero-signal-warn {
    background: linear-gradient(180deg, rgba(240, 199, 119, 0.08), rgba(255, 255, 255, 0.03));
}

.hero-signal-alert {
    background: linear-gradient(180deg, rgba(255, 111, 125, 0.08), rgba(255, 255, 255, 0.03));
}

.report-toolbar {
    flex-wrap: wrap;
    align-items: center;
}

.report-toolbar .dashboard-controls {
    margin-left: auto;
}

.metric-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.25rem;
}

.metric-card-jump {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    min-height: 34px;
    margin-bottom: 0.35rem;
    padding: 0.35rem 0.62rem;
    border: 1px solid rgba(214, 167, 86, 0.22);
    border-radius: 0.75rem;
    background: rgba(214, 167, 86, 0.08);
    color: var(--gold-strong);
    font-size: 0.76rem;
    font-weight: 900;
    text-decoration: none;
}

.metric-card-jump:hover {
    border-color: rgba(240, 199, 119, 0.58);
    background: rgba(214, 167, 86, 0.14);
}

.metric-card-body {
    display: grid;
    gap: 0.42rem;
    align-content: start;
}

.metric-actions,
.filter-preset-row,
.filter-summary-bar,
.filter-chip-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.filter-shell {
    position: relative;
    overflow: clip;
    isolation: isolate;
    gap: var(--dashboard-gap);
    padding: clamp(1rem, 1.35vw, 1.15rem);
    border: 1px solid var(--panel-border);
    border-radius: var(--radius-lg);
    background: radial-gradient(220px 140px at 100% 0%, rgba(214, 167, 86, 0.08), transparent 68%), linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.025));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 12px 28px rgba(0, 0, 0, 0.14);
}

.filter-shell::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.06), transparent 34%),
        var(--dashboard-sheen);
    background-repeat: no-repeat;
    background-size: 100% 100%, 100% 1px;
    background-position: 0 0, 0 0;
    opacity: 0.55;
}

.filter-shell > * {
    position: relative;
    z-index: 1;
}

.filter-summary-bar {
    justify-content: space-between;
    gap: var(--dashboard-gap-tight);
}

.filter-summary-copy,
.filter-summary-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.filter-summary-copy {
    min-width: 0;
    color: var(--muted);
}

.filter-chip {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0.22rem 0.58rem;
    border-radius: var(--radius-pill);
    border: 1px solid rgba(214, 167, 86, 0.18);
    background: rgba(255, 255, 255, 0.045);
    color: var(--muted-strong);
    font-size: 0.76rem;
    font-weight: 700;
}

.filter-chip-muted {
    color: var(--muted);
}

.stock-filter-form {
    margin-bottom: 0;
}

.settings-card {
    gap: 0.85rem;
}

.settings-toggle-row {
    align-items: center;
}

.settings-toggle-row strong {
    font-size: 0.95rem;
}

.settings-toggle-row small {
    color: var(--muted);
}

.dashboard-stack {
    display: grid;
    gap: var(--dashboard-shell-gap);
}

.focus-list,
.activity-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.75rem;
}

.focus-list li,
.activity-list li,
.settings-toggle-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--dashboard-gap-tight);
    padding: var(--dashboard-card-padding);
    border: 1px solid var(--panel-border);
    border-radius: var(--radius-md);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.03));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.throughput-grid,
.shift-chart-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(72px, 1fr));
    gap: 0.75rem;
    align-items: end;
}

.throughput-bar-wrap,
.shift-chart-bar {
    position: relative;
    overflow: hidden;
    min-height: 130px;
    display: flex;
    align-items: flex-end;
    padding: 0.45rem;
    border-radius: 1rem;
    border: 1px solid var(--panel-border);
    background: rgba(255, 255, 255, 0.035);
}

.throughput-bar-wrap::before,
.shift-chart-bar::before,
.metric-chart::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), transparent 46%);
}

.throughput-column {
    align-items: center;
    text-align: center;
}

.throughput-column strong {
    font-size: 0.86rem;
}

.throughput-column small {
    color: var(--muted);
    line-height: 1.35;
}

.throughput-stack {
    width: 100%;
    height: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: end;
    gap: 0.4rem;
}

.throughput-bar,
.shift-chart-fill,
.metric-chart-bar {
    width: 100%;
    min-height: 4px;
    border-radius: 999px 999px 0.35rem 0.35rem;
    background: linear-gradient(180deg, #f0c777, #a06b24);
    transform-origin: bottom;
    animation: dashboard-bar-rise 0.66s var(--dashboard-motion) both;
}

.throughput-bar-task {
    background: linear-gradient(180deg, #8fb7ff, #356db6);
}

.metric-chart-block,
.sales-panel-stack {
    display: grid;
    gap: 0.7rem;
}

.metric-chart {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    align-items: end;
    gap: 0.35rem;
    min-height: 78px;
    padding: 0.45rem;
    border-radius: 1rem;
    border: 1px solid var(--panel-border);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.025));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.metric-chart-bar.is-latest {
    background: linear-gradient(180deg, #f6ddb0, #c28831);
    box-shadow: 0 0 0 1px rgba(240, 199, 119, 0.18);
}

.metric-chart-label {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.sales-brief-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

.inline-action-form {
    display: inline-flex;
    margin: 0;
}

.inline-action-form button {
    width: auto;
}

.action-btn.is-working {
    opacity: 0.78;
}

.stock-count-stage {
    position: relative;
    display: grid;
    gap: 1rem;
    margin-bottom: 1rem;
    padding: 1.05rem;
    border-radius: 1.35rem;
    border: 1px solid rgba(214, 167, 86, 0.16);
    background:
        radial-gradient(circle at top right, rgba(244, 193, 104, 0.2), transparent 36%),
        linear-gradient(180deg, rgba(9, 17, 29, 0.92), rgba(18, 28, 44, 0.9));
    overflow: hidden;
    box-shadow: 0 28px 60px rgba(4, 9, 17, 0.28);
}

.stock-count-stage::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, transparent 20%, rgba(255, 255, 255, 0.08) 50%, transparent 80%);
    transform: translateX(-65%);
    opacity: 0.55;
    animation: stock-count-sheen 10s linear infinite;
    pointer-events: none;
}

.stock-count-stage > * {
    position: relative;
    z-index: 1;
}

.stock-count-stage-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.stock-count-stage-copy {
    display: grid;
    gap: 0.45rem;
    max-width: 42rem;
}

.stock-count-stage-copy h4,
.stock-count-drawer-title {
    margin: 0;
    color: var(--text);
    font-size: clamp(1.08rem, 1.4vw, 1.4rem);
    line-height: 1.15;
}

.stock-count-stage-link {
    white-space: nowrap;
    align-self: center;
}

.stock-count-stage-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.8rem;
}

.stock-count-stage-card {
    position: relative;
    display: grid;
    gap: 0.28rem;
    padding: 0.95rem 1rem;
    border-radius: 1.05rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.03));
    overflow: hidden;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.stock-count-stage-card::after {
    content: "";
    position: absolute;
    inset: -35% auto auto -15%;
    width: 5.2rem;
    height: 5.2rem;
    border-radius: 999px;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.16), transparent 70%);
    opacity: 0.7;
    pointer-events: none;
}

.stock-count-stage-card-alert {
    border-color: rgba(255, 111, 125, 0.28);
    background: linear-gradient(180deg, rgba(255, 111, 125, 0.18), rgba(255, 255, 255, 0.03));
}

.stock-count-stage-card-warn {
    border-color: rgba(240, 188, 102, 0.26);
    background: linear-gradient(180deg, rgba(240, 188, 102, 0.18), rgba(255, 255, 255, 0.03));
}

.stock-count-stage-card-label {
    color: var(--muted-strong);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.stock-count-stage-card strong {
    color: var(--text);
    font-size: clamp(1.42rem, 1.8vw, 1.8rem);
    line-height: 1;
}

.stock-count-stage-card p {
    margin: 0;
    color: var(--muted);
    font-size: 0.8rem;
    line-height: 1.45;
}

.stock-count-category-board {
    display: grid;
    gap: 0.95rem;
    margin-bottom: 1rem;
}

.stock-count-category-board-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
}

.stock-count-category-board-head h4,
.stock-count-category-card h5 {
    margin: 0;
    color: var(--text);
}

.stock-count-category-board-head h4 {
    font-size: clamp(1.02rem, 1.3vw, 1.28rem);
}

.stock-count-category-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.9rem;
}

.stock-count-category-card {
    display: grid;
    gap: 0.9rem;
    padding: 1rem;
    border-radius: 1.15rem;
    border: 1px solid rgba(214, 167, 86, 0.14);
    background: linear-gradient(180deg, rgba(15, 25, 41, 0.92), rgba(10, 17, 29, 0.96));
    box-shadow:
        0 18px 36px rgba(4, 9, 17, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.stock-count-category-card-alert {
    border-color: rgba(255, 111, 125, 0.24);
}

.stock-count-category-card-warn {
    border-color: rgba(240, 188, 102, 0.24);
}

.stock-count-category-card-ok {
    border-color: rgba(114, 220, 160, 0.18);
}

.stock-count-category-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.9rem;
}

.stock-count-category-card-head p {
    margin: 0.28rem 0 0;
    color: var(--muted);
    font-size: 0.82rem;
    line-height: 1.5;
}

.stock-count-category-metrics {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.stock-count-category-metrics span {
    display: inline-flex;
    align-items: center;
    padding: 0.38rem 0.58rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.06);
    color: var(--muted-strong);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.stock-count-category-lines {
    display: grid;
    gap: 0.65rem;
}

.stock-count-category-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.7rem;
    padding: 0.72rem 0.78rem;
    border-radius: 0.95rem;
    border: 1px solid rgba(255, 255, 255, 0.06);
    background: rgba(255, 255, 255, 0.04);
}

.stock-count-category-line-copy {
    display: grid;
    gap: 0.16rem;
    min-width: 0;
}

.stock-count-category-line-copy strong {
    color: var(--text);
    font-size: 0.92rem;
}

.stock-count-category-line-copy small,
.stock-count-category-overflow {
    color: var(--muted-strong);
    font-size: 0.75rem;
    line-height: 1.45;
}

.stock-count-category-overflow {
    margin: 0;
}

.stock-count-inline-mini-form,
.stock-count-inline-mini {
    min-width: 8.5rem;
}

.stock-count-inline-mini {
    display: grid;
    gap: 0.08rem;
    padding: 0.58rem 0.7rem;
    border-radius: 0.95rem;
    border: 1px solid rgba(214, 167, 86, 0.16);
    background: linear-gradient(180deg, rgba(27, 38, 58, 0.96), rgba(16, 24, 38, 0.98));
    color: var(--text);
    text-align: left;
    transition:
        transform var(--motion-quick) ease,
        border-color var(--motion-quick) ease,
        box-shadow var(--motion-quick) ease;
}

.stock-count-inline-mini span {
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1.1;
}

.stock-count-inline-mini small {
    color: var(--muted-strong);
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.stock-count-inline-mini:hover,
.stock-count-inline-mini:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(214, 167, 86, 0.28);
    box-shadow: 0 12px 24px rgba(4, 9, 17, 0.18);
    outline: none;
}

.stock-count-inline-mini-missing {
    border-color: rgba(255, 111, 125, 0.24);
}

.stock-count-inline-mini-stale {
    border-color: rgba(240, 188, 102, 0.24);
}

.stock-count-inline-mini-watch {
    border-color: rgba(126, 173, 255, 0.22);
}

.stock-count-inline-mini-fresh {
    border-color: rgba(114, 220, 160, 0.18);
}

.stock-count-inline-mini-ghost {
    cursor: pointer;
}

.stock-board-row {
    transition:
        background-color var(--motion-quick) ease,
        transform var(--motion-quick) ease;
}

.stock-board-row td {
    padding-top: 0.95rem;
    padding-bottom: 0.95rem;
}

.stock-board-row td[data-label="Item"] strong {
    display: block;
    margin-bottom: 0.08rem;
}

.stock-board-row td[data-label="Item"] .task-inline-meta {
    display: grid;
    justify-items: start;
    gap: 0.38rem;
    margin-top: 0.24rem;
}

.stock-board-row td[data-label="Item"] .panel-subtitle {
    font-size: 0.76rem;
    line-height: 1.35;
}

.stock-board-row-missing td:first-child strong,
.stock-board-row-stale td:first-child strong {
    color: #fff4ef;
}

.stock-count-cell {
    width: 11.75rem;
    min-width: 11.75rem;
}

.stock-count-form,
.stock-count-review-trigger {
    width: 100%;
}

.stock-count-form.is-count-primed .stock-count-trigger {
    transform: translateY(-1px) scale(0.985);
    box-shadow: 0 14px 28px rgba(9, 17, 29, 0.24);
}

.stock-count-trigger,
.stock-count-review-trigger {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: 0.48rem;
    width: 100%;
    min-width: 0;
    padding: 0.72rem 0.78rem;
    border-radius: 1rem;
    border: 1px solid rgba(214, 167, 86, 0.16);
    background:
        linear-gradient(180deg, rgba(17, 29, 47, 0.96), rgba(9, 17, 29, 0.98));
    text-align: left;
    overflow: hidden;
    transition:
        transform var(--motion-quick) ease,
        box-shadow var(--motion-quick) ease,
        border-color var(--motion-quick) ease,
        background var(--motion-quick) ease,
        filter var(--motion-quick) ease;
}

.stock-count-trigger {
    box-shadow:
        0 16px 34px rgba(5, 10, 20, 0.24),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.stock-count-review-trigger {
    cursor: pointer;
    color: inherit;
    box-shadow:
        0 14px 30px rgba(5, 10, 20, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.stock-count-trigger::after,
.stock-count-review-trigger::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, transparent 28%, rgba(255, 255, 255, 0.08) 50%, transparent 72%);
    transform: translateX(-75%);
    opacity: 0;
    transition: opacity var(--motion-quick) ease;
    pointer-events: none;
}

.stock-count-trigger:hover,
.stock-count-trigger:focus-visible,
.stock-count-review-trigger:hover,
.stock-count-review-trigger:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(214, 167, 86, 0.28);
    box-shadow:
        0 18px 40px rgba(5, 10, 20, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.stock-count-trigger:hover::after,
.stock-count-trigger:focus-visible::after,
.stock-count-review-trigger:hover::after,
.stock-count-review-trigger:focus-visible::after {
    opacity: 1;
}

.stock-count-trigger:focus-visible,
.stock-count-review-trigger:focus-visible {
    outline: none;
    box-shadow:
        0 0 0 1px rgba(214, 167, 86, 0.35),
        0 0 0 4px rgba(214, 167, 86, 0.12),
        0 18px 40px rgba(5, 10, 20, 0.28);
}

.stock-count-trigger-glow {
    position: absolute;
    inset: auto auto -55% -8%;
    width: 7rem;
    height: 7rem;
    border-radius: 999px;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.22), transparent 72%);
    opacity: 0.55;
    animation: stock-count-orbit 7s ease-in-out infinite;
    pointer-events: none;
}

.stock-count-trigger-copy,
.stock-count-review-copy {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 0.18rem;
}

.stock-count-trigger-copy strong,
.stock-count-review-copy strong {
    color: var(--text);
    font-size: 0.88rem;
    font-weight: 800;
    line-height: 1.04;
}

.stock-count-trigger-copy small,
.stock-count-review-copy small,
.stock-count-review-meta {
    color: var(--muted-strong);
    font-size: 0.68rem;
    line-height: 1.25;
}

.stock-count-trigger-chip {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    justify-self: start;
    max-width: 100%;
    padding: 0.34rem 0.5rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    color: var(--muted-strong);
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.stock-count-trigger-dot {
    width: 0.48rem;
    height: 0.48rem;
    border-radius: 999px;
    background: #72dca0;
    box-shadow: 0 0 0 0 rgba(114, 220, 160, 0.28);
    animation: stock-count-pulse 1.8s ease-in-out infinite;
}

.stock-count-review-meta {
    justify-self: start;
    text-align: left;
}

.stock-count-form-missing .stock-count-trigger,
.stock-count-review-trigger-missing,
.stock-count-drawer-card-missing {
    border-color: rgba(255, 111, 125, 0.3);
    background:
        radial-gradient(circle at top right, rgba(255, 111, 125, 0.18), transparent 40%),
        linear-gradient(180deg, rgba(33, 16, 23, 0.98), rgba(18, 17, 24, 0.98));
}

.stock-count-form-missing .stock-count-trigger-dot {
    background: #ff7d93;
    box-shadow: 0 0 0 0 rgba(255, 125, 147, 0.32);
}

.stock-count-form-stale .stock-count-trigger,
.stock-count-review-trigger-stale,
.stock-count-drawer-card-stale {
    border-color: rgba(240, 188, 102, 0.28);
    background:
        radial-gradient(circle at top right, rgba(240, 188, 102, 0.18), transparent 40%),
        linear-gradient(180deg, rgba(35, 25, 13, 0.98), rgba(18, 17, 24, 0.98));
}

.stock-count-form-stale .stock-count-trigger-dot {
    background: #f3c06f;
    box-shadow: 0 0 0 0 rgba(243, 192, 111, 0.32);
}

.stock-count-form-watch .stock-count-trigger,
.stock-count-review-trigger-watch,
.stock-count-drawer-card-watch {
    border-color: rgba(126, 173, 255, 0.26);
    background:
        radial-gradient(circle at top right, rgba(126, 173, 255, 0.16), transparent 40%),
        linear-gradient(180deg, rgba(14, 28, 49, 0.98), rgba(18, 17, 24, 0.98));
}

.stock-count-form-watch .stock-count-trigger-dot {
    background: #85b4ff;
    box-shadow: 0 0 0 0 rgba(133, 180, 255, 0.3);
}

.stock-count-form-fresh .stock-count-trigger,
.stock-count-review-trigger-fresh,
.stock-count-drawer-card-fresh {
    border-color: rgba(114, 220, 160, 0.22);
    background:
        radial-gradient(circle at top right, rgba(114, 220, 160, 0.14), transparent 40%),
        linear-gradient(180deg, rgba(11, 30, 27, 0.98), rgba(18, 17, 24, 0.98));
}

.stock-count-drawer-card {
    gap: 0.9rem;
}

.stock-count-drawer-top {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
}

.stock-count-drawer-orbit {
    position: relative;
    width: 4.6rem;
    height: 4.6rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: radial-gradient(circle, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.02));
    overflow: hidden;
}

.stock-count-drawer-orbit span {
    position: absolute;
    inset: 0.45rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    animation: stock-count-ring 5s linear infinite;
}

.stock-count-drawer-orbit span:nth-child(2) {
    inset: 0.9rem;
    animation-duration: 4.2s;
    animation-direction: reverse;
}

.stock-count-drawer-orbit span:nth-child(3) {
    inset: 1.35rem;
    animation-duration: 3.4s;
}

.stock-count-drawer-action {
    width: 100%;
    justify-content: center;
}

.data-table tr.row-action-pending.row-action-pending-premium td {
    opacity: 0.66;
    transform: none;
    filter: saturate(0.92);
}

.data-table tr.row-action-pending.row-action-pending-premium td.stock-count-cell {
    opacity: 1;
    filter: none;
}

.data-table tr.row-action-pending.row-action-pending-premium .stock-count-trigger {
    transform: translateY(-1px) scale(0.985);
}

@keyframes stock-count-sheen {
    0% {
        transform: translateX(-65%);
    }
    100% {
        transform: translateX(165%);
    }
}

@keyframes stock-count-pulse {
    0%,
    100% {
        box-shadow: 0 0 0 0 rgba(114, 220, 160, 0.28);
        transform: scale(1);
    }
    50% {
        box-shadow: 0 0 0 0.45rem rgba(114, 220, 160, 0);
        transform: scale(1.08);
    }
}

@keyframes stock-count-orbit {
    0%,
    100% {
        transform: translate3d(0, 0, 0) scale(1);
        opacity: 0.48;
    }
    50% {
        transform: translate3d(8px, -6px, 0) scale(1.06);
        opacity: 0.72;
    }
}

@keyframes stock-count-ring {
    0% {
        transform: rotate(0deg) scale(1);
    }
    100% {
        transform: rotate(360deg) scale(1.02);
    }
}

@media (max-width: 1100px) {
    .stock-count-stage-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .stock-count-category-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .stock-count-stage-head,
    .stock-count-drawer-top {
        grid-template-columns: 1fr;
        display: grid;
    }

    .stock-count-stage-link {
        justify-self: start;
    }

    .stock-count-cell {
        min-width: 0;
    }

    .stock-count-trigger,
    .stock-count-review-trigger {
        grid-template-columns: 1fr;
    }

    .stock-count-trigger-chip,
    .stock-count-review-meta {
        justify-self: start;
        text-align: left;
    }

    .stock-count-category-card-head,
    .stock-count-category-line {
        grid-template-columns: 1fr;
    }

    .stock-count-inline-mini-form,
    .stock-count-inline-mini {
        width: 100%;
        min-width: 0;
    }
}

@media (max-width: 620px) {
    .stock-count-stage {
        padding: 0.95rem;
    }

    .stock-count-stage-grid {
        grid-template-columns: 1fr;
    }

    .stock-count-category-grid {
        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion: reduce) {
    .stock-count-stage::before,
    .stock-count-trigger-glow,
    .stock-count-trigger-dot,
    .stock-count-drawer-orbit span {
        animation: none;
    }

    .stock-count-trigger,
    .stock-count-review-trigger,
    .stock-count-stage-card {
        transition: none;
    }
}

html[data-theme="light"] .stock-count-stage {
    border-color: rgba(194, 145, 54, 0.18);
    background:
        radial-gradient(circle at top right, rgba(248, 207, 132, 0.28), transparent 34%),
        linear-gradient(180deg, rgba(255, 251, 244, 0.98), rgba(245, 238, 226, 0.98));
    box-shadow: 0 20px 42px rgba(132, 103, 54, 0.12);
}

html[data-theme="light"] .stock-count-stage-card,
html[data-theme="light"] .stock-count-category-card,
html[data-theme="light"] .stock-count-trigger,
html[data-theme="light"] .stock-count-review-trigger,
html[data-theme="light"] .stock-count-drawer-card {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(247, 241, 231, 0.94));
    border-color: rgba(194, 145, 54, 0.18);
    box-shadow:
        0 14px 28px rgba(132, 103, 54, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.88);
}

html[data-theme="light"] .stock-count-trigger-chip {
    background: rgba(194, 145, 54, 0.08);
}

html[data-theme="light"] .stock-count-category-line,
html[data-theme="light"] .stock-count-inline-mini {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(247, 241, 231, 0.94));
    box-shadow:
        0 10px 22px rgba(132, 103, 54, 0.05),
        inset 0 1px 0 rgba(255, 255, 255, 0.88);
}

.task-primary-block,
.task-due-cell {
    display: grid;
    gap: 0.35rem;
}

.task-inline-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin-top: 0.25rem;
    color: var(--muted);
    font-size: 0.78rem;
}

.task-note-preview {
    color: var(--muted);
    line-height: 1.45;
}

.task-primary-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.55rem;
    width: 100%;
}

code {
    padding: 0.14rem 0.36rem;
    border-radius: 0.45rem;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(214, 167, 86, 0.14);
    color: var(--gold-strong);
    font-size: 0.78rem;
    word-break: break-all;
}

.form-grid,
.form-grid,
.order-items-grid,
.settings-team-list {
    display: grid;
    gap: 0.85rem;
}

.stock-form-panel {
    padding: clamp(1rem, 2vw, 1.35rem);
}

.form-grid,
.form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.form-field,
.filter-field {
    display: grid;
    gap: 0.38rem;
}

.stock-form-panel .stock-edit-form {
    display: grid;
    gap: 1rem;
}

.stock-form-panel .form-grid > .form-field {
    padding: 0.9rem;
    border: 1px solid rgba(214, 167, 86, 0.14);
    border-radius: 1rem;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.025));
    transition: border-color 0.18s ease, background 0.18s ease, transform 0.18s ease;
}

.stock-form-panel .form-grid > .form-field:focus-within {
    border-color: rgba(214, 167, 86, 0.38);
    background: linear-gradient(180deg, rgba(214, 167, 86, 0.08), rgba(255, 255, 255, 0.03));
    transform: translateY(-1px);
}

.detail-panel-head {
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(214, 167, 86, 0.14);
}

.detail-panel-head .panel-subtitle {
    max-width: 62ch;
}

.stock-form-panel .form-actions {
    margin-top: 0.15rem;
    padding-top: 0.95rem;
    border-top: 1px solid rgba(214, 167, 86, 0.14);
}

.stock-form-panel .metric-note {
    margin-top: 0.15rem;
}

.form-field.full-width {
    grid-column: 1 / -1;
}

label,
.form-field label,
.stock-filter-form label,
.login-card label {
    color: var(--muted-strong);
    font-size: 0.78rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

input,
select,
textarea,
.form-field input,
.form-field select,
.form-field textarea,
.stock-filter-form input,
.stock-filter-form select,
.inline-status-form select {
    width: 100%;
    min-height: 42px;
    border: 1px solid var(--panel-border);
    border-radius: 0.85rem;
    background: rgba(255, 255, 255, 0.045);
    color: var(--text);
    padding: 0.58rem 0.7rem;
    outline: none;
}

textarea {
    resize: vertical;
    min-height: 132px;
}

input:hover,
select:hover,
textarea:hover,
input:focus,
select:focus,
textarea:focus {
    border-color: rgba(214, 167, 86, 0.46);
    box-shadow: var(--focus-ring);
}

.action-link {
    text-decoration: none;
}

.form-actions,
.delete-form,
.stock-filter-form,
.report-range-form,
.dashboard-controls,
.settings-actions,
.pagination-bar,
.pagination-actions,
.stock-actions-cell {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.stock-filter-form {
    display: grid;
    grid-template-columns: 1fr;
    align-items: stretch;
    gap: 0.9rem;
    margin-bottom: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.stock-filter-search-row,
.stock-filter-advanced {
    display: grid;
    gap: 0.9rem;
    align-items: end;
}

.stock-filter-search-row {
    grid-template-columns: minmax(0, 1fr) auto;
}

.stock-filter-advanced {
    display: none;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.filter-shell.is-open .stock-filter-advanced {
    display: grid;
}

.stock-filter-search-row > .filter-field,
.stock-filter-advanced > .filter-field {
    min-width: 0;
}

.stock-filter-search-row > .action-btn {
    width: auto;
    min-height: 42px;
}

.field-error,
.form-errors {
    color: var(--danger);
    font-size: 0.86rem;
    font-weight: 700;
}

.report-table-wrap {
    overflow-x: auto;
    padding: clamp(0.32rem, 0.8vw, 0.48rem);
    border: 1px solid var(--panel-border);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, 0.035);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

table {
    width: 100%;
    border-collapse: collapse;
    background: transparent;
}

.data-table tr.row-action-pending {
    pointer-events: none;
}

.data-table tr.row-action-pending td {
    opacity: 0.42;
    transition:
        opacity var(--motion-quick) ease,
        transform var(--motion-quick) ease,
        filter var(--motion-quick) ease;
    transform: translateY(-2px);
    filter: saturate(0.7);
}

th,
td {
    padding: clamp(0.82rem, 0.9vw, 0.98rem);
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid rgba(214, 167, 86, 0.1);
}

th {
    color: var(--gold-strong);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    background: rgba(214, 167, 86, 0.07);
}

tbody tr:hover {
    background: rgba(214, 167, 86, 0.045);
}

tbody tr {
    transition: background 0.18s ease;
}

.data-table th.is-sortable {
    cursor: pointer;
}

.data-table th.is-sortable::after {
    content: " ↕";
    opacity: 0.65;
}

.data-table th[data-sort-direction="asc"]::after {
    content: " ↑";
    color: var(--gold);
}

.data-table th[data-sort-direction="desc"]::after {
    content: " ↓";
    color: var(--gold);
}

.messages {
    display: grid;
    gap: 0.65rem;
    margin-bottom: 1rem;
}

.message,
.empty-state,
.settings-status {
    padding: 0.78rem 0.9rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--panel-border);
    background: rgba(255, 255, 255, 0.04);
    color: var(--muted-strong);
}

.message-success {
    border-color: rgba(100, 214, 163, 0.35);
    color: var(--ok);
}

.message-error,
.message-danger {
    border-color: rgba(255, 111, 125, 0.35);
    color: var(--danger);
}

.message-warning {
    border-color: rgba(240, 199, 119, 0.35);
    color: var(--warn);
}

.message-info {
    border-color: rgba(143, 183, 255, 0.35);
    color: var(--info);
}

.detail-drawer-backdrop {
    position: fixed;
    inset: 0;
    z-index: 80;
    background: rgba(0, 0, 0, 0.62);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: 0.2s ease;
}

.detail-drawer {
    position: fixed;
    inset: 0 0 0 auto;
    z-index: 90;
    width: min(460px, 92vw);
    padding: 1rem;
    overflow-y: auto;
    background: rgba(9, 13, 21, 0.98);
    border-left: 1px solid var(--panel-border);
    box-shadow: var(--shadow-strong);
    transform: translateX(100%);
    transition: 0.24s ease;
}

body.drawer-open .detail-drawer-backdrop {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

body.drawer-open .detail-drawer {
    transform: translateX(0);
}

.login-page {
    min-height: 100dvh;
    display: grid;
    place-items: center;
    padding: 1rem;
    color: var(--text);
    background: radial-gradient(760px 360px at 100% 0%, rgba(214, 167, 86, 0.14), transparent 56%), linear-gradient(180deg, #090d14, #05070b);
}

.login-wrap {
    width: min(460px, 100%);
}

.login-card,
.error-card {
    padding: clamp(1rem, 3vw, 1.4rem);
    border-radius: var(--radius-xl);
    border: 1px solid var(--panel-border);
    background: rgba(14, 19, 29, 0.92);
    box-shadow: var(--shadow-soft);
}

.login-card::after,
.error-card::after {
    content: "";
    position: absolute;
    inset: auto -12% -28% 50%;
    height: 160px;
    pointer-events: none;
    background: radial-gradient(circle, rgba(240, 199, 119, 0.18) 0%, rgba(240, 199, 119, 0) 68%);
}

.login-card > *,
.error-card > * {
    position: relative;
    z-index: 1;
}

.login-logo {
    width: 84px;
    height: 84px;
    object-fit: contain;
    padding: 0.4rem;
    border-radius: 1rem;
    border: 1px solid var(--panel-border);
    background: rgba(255, 255, 255, 0.04);
}

.login-card-header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 1rem;
    align-items: center;
}

.login-brand-copy {
    display: grid;
    gap: 0.45rem;
}

.login-brand-copy h1 {
    margin: 0;
    font-size: clamp(2rem, 7vw, 2.85rem);
    line-height: 0.95;
}

.login-card p,
.login-brand-copy p {
    color: var(--muted);
}

.login-card {
    position: relative;
    overflow: hidden;
    display: grid;
    gap: 0.95rem;
    background: radial-gradient(420px 220px at 100% 0%, rgba(214, 167, 86, 0.18), transparent 55%), linear-gradient(145deg, rgba(18, 24, 36, 0.95), rgba(10, 13, 19, 0.94));
}

.login-card form {
    display: grid;
    gap: 0.9rem;
}

.error-hint-list li,
.error-status-strip {
    border: 1px solid rgba(214, 167, 86, 0.14);
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.04);
}

.error-hint-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.7rem;
}

.error-hint-list li {
    position: relative;
    padding: 0.85rem 0.9rem 0.85rem 1.15rem;
    color: var(--muted-strong);
}

.error-hint-list li::before {
    content: "";
    position: absolute;
    left: 0.7rem;
    top: 1rem;
    width: 0.36rem;
    height: 0.36rem;
    border-radius: 999px;
    background: var(--gold-strong);
    box-shadow: 0 0 0 0.24rem rgba(214, 167, 86, 0.12);
}

.password-toggle-wrap {
    position: relative;
}

.password-toggle-wrap input {
    padding-right: 5.4rem;
}

.password-toggle-btn {
    position: absolute;
    top: 50%;
    right: 0.45rem;
    transform: translateY(-50%);
    min-height: 34px;
    padding: 0.35rem 0.7rem;
    border: 1px solid rgba(214, 167, 86, 0.22);
    border-radius: 0.8rem;
    background: rgba(255, 255, 255, 0.05);
    color: var(--muted-strong);
    font-size: 0.78rem;
    font-weight: 800;
}

.login-submit-btn {
    min-height: 48px;
    border: 1px solid rgba(240, 199, 119, 0.56);
    border-radius: 0.95rem;
    color: #171006;
    background: linear-gradient(135deg, #f0c777, #b98534);
    font-weight: 900;
    letter-spacing: 0.02em;
    box-shadow: 0 18px 34px rgba(185, 133, 52, 0.24);
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.login-submit-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 22px 38px rgba(185, 133, 52, 0.3);
}

.login-security-note {
    margin: 0;
    padding: 0.82rem 0.9rem;
    border: 1px solid rgba(214, 167, 86, 0.14);
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.035);
    color: var(--muted);
}

.error-text {
    margin: 0;
    padding: 0.78rem 0.9rem;
    border: 1px solid rgba(255, 111, 125, 0.28);
    border-radius: 0.95rem;
    background: rgba(255, 111, 125, 0.08);
    color: #ffadb7;
    font-weight: 700;
}

.login-shell {
    width: min(760px, 100%);
}

.error-shell {
    display: grid;
    place-items: center;
}

.error-card {
    display: grid;
    gap: 1rem;
    max-width: 680px;
    background: radial-gradient(440px 220px at 85% 0%, rgba(214, 167, 86, 0.15), transparent 56%), linear-gradient(145deg, rgba(18, 24, 36, 0.96), rgba(10, 13, 19, 0.94));
}

.error-status-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    padding: 0.8rem;
}

.mobile-dock {
    display: none;
    transform-origin: center bottom;
    transition: transform 0.26s var(--dashboard-motion), opacity 0.26s var(--dashboard-motion);
}

.command-sheet-backdrop {
    position: fixed;
    inset: 0;
    z-index: 65;
    display: block;
    border: 0;
    padding: 0;
    background: rgba(0, 0, 0, 0.62);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: 0.18s ease;
}

.mobile-command-sheet {
    position: fixed;
    inset: auto var(--dashboard-dock-offset) calc(5.5rem + env(safe-area-inset-bottom, 0px)) var(--dashboard-dock-offset);
    z-index: 75;
    display: grid;
    gap: 1rem;
    padding: 1rem 1rem calc(1rem + env(safe-area-inset-bottom, 0px));
    border: 1px solid rgba(214, 167, 86, 0.18);
    border-radius: 1.35rem;
    background: radial-gradient(260px 180px at 100% 0%, rgba(214, 167, 86, 0.12), transparent 68%), linear-gradient(180deg, rgba(12, 17, 27, 0.98), rgba(7, 10, 16, 0.98));
    box-shadow: 0 28px 56px rgba(0, 0, 0, 0.38);
    backdrop-filter: blur(20px);
    transform: translateY(calc(100% + 20px));
    transition: transform 0.22s ease;
}

.mobile-command-sheet::before {
    content: "";
    justify-self: center;
    width: 72px;
    height: 4px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(240, 199, 119, 0.08), rgba(240, 199, 119, 0.84), rgba(240, 199, 119, 0.08));
}

.mobile-command-head {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 0.85rem;
}

.mobile-command-copy {
    margin: 0.35rem 0 0;
    color: var(--muted);
}

.mobile-command-close {
    width: auto;
}

.mobile-command-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.8rem;
}

.mobile-command-link {
    gap: 0.3rem;
    padding: 0.95rem;
    border-radius: var(--radius-lg);
    border: 1px solid rgba(214, 167, 86, 0.14);
    background: rgba(255, 255, 255, 0.035);
    color: var(--text);
    text-decoration: none;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 10px 22px rgba(0, 0, 0, 0.16);
    transition:
        transform 0.24s var(--dashboard-motion),
        border-color 0.24s var(--dashboard-motion),
        background 0.24s var(--dashboard-motion),
        box-shadow 0.24s var(--dashboard-motion);
}

.mobile-command-link small {
    color: var(--muted);
    line-height: 1.45;
}

.mobile-command-link:hover {
    transform: translateY(-2px);
    border-color: rgba(214, 167, 86, 0.28);
    background: rgba(214, 167, 86, 0.08);
    box-shadow: 0 18px 34px rgba(0, 0, 0, 0.24);
}

.mobile-command-link-primary {
    background: linear-gradient(135deg, rgba(240, 199, 119, 0.16), rgba(255, 255, 255, 0.04));
    border-color: rgba(240, 199, 119, 0.34);
}

body.command-open .command-sheet-backdrop {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

body.command-open .mobile-command-sheet {
    transform: translateY(0);
}

@media (min-width:1181px) {

    .layout,
    .layout {
        grid-template-columns: minmax(238px, 262px) minmax(0, 1fr);
        gap: clamp(1rem, 1.5vw, 1.3rem);
        padding: clamp(1rem, 1.5vw, 1.2rem);
        align-items: start;
    }

    .sidebar,
    .sidebar {
        position: sticky;
        top: 1rem;
        width: auto;
        min-height: calc(100dvh - 2rem);
        max-height: calc(100dvh - 2rem);
        border-radius: var(--radius-xl);
        transform: none;
        border: 1px solid var(--panel-border);
    }

    .main-content,
    .main-content {
        max-width: none;
        padding: 0;
    }

    .report-table-wrap {
        padding: 0.38rem;
    }

    .topbar-primary,
    .topbar-primary {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }

    .menu-btn,
    .sidebar-close,
    .nav-overlay {
        display: none;
    }

    .login-wrap {
        width: min(520px, calc(100% - 2rem));
    }
}

@media (max-width:1180px) {

    .main-content,
    .main-content {
        padding-bottom: calc(8.4rem + env(safe-area-inset-bottom, 0px));
    }

    .stock-filter-form {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .stock-filter-search-row,
    .stock-filter-advanced {
        grid-template-columns: 1fr;
    }

    .metric-grid,
    .metric-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .mobile-dock {
        position: fixed;
        inset: auto var(--dashboard-dock-offset) calc(var(--dashboard-dock-offset) + env(safe-area-inset-bottom, 0px)) var(--dashboard-dock-offset);
        top: auto;
        z-index: 70;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 0.42rem;
        width: min(calc(100% - (var(--dashboard-dock-offset) * 2)), var(--dashboard-dock-width));
        margin: 0 auto;
        padding: 0.55rem;
        border-radius: 1.45rem;
        border: 1px solid rgba(214, 167, 86, 0.16);
        background: linear-gradient(180deg, rgba(12, 17, 27, 0.96), rgba(7, 10, 16, 0.94));
        box-shadow: 0 22px 44px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.04);
        backdrop-filter: blur(18px);
        animation: dashboard-dock-arrive 0.36s var(--dashboard-motion) both;
    }

    .mobile-dock::before {
        content: "";
        position: absolute;
        inset: 0 auto auto 50%;
        width: 86px;
        height: 3px;
        border-radius: 999px;
        transform: translateX(-50%);
        background: linear-gradient(90deg, rgba(240, 199, 119, 0), rgba(240, 199, 119, 0.82), rgba(240, 199, 119, 0));
        opacity: 0.78;
    }

    .mobile-dock::after {
        content: "";
        position: absolute;
        inset: auto 14% -42% 14%;
        height: 88px;
        pointer-events: none;
        background: radial-gradient(circle, rgba(240, 199, 119, 0.12) 0%, rgba(240, 199, 119, 0) 72%);
    }

    .mobile-dock-link {
        position: relative;
        overflow: hidden;
        isolation: isolate;
        gap: 0.22rem;
        align-content: center;
        min-height: 66px;
        padding: 0.72rem 0.48rem 0.62rem;
        border-radius: 1.05rem;
        border: 1px solid transparent;
        background: transparent;
        color: var(--muted-strong);
        text-decoration: none;
        text-align: center;
        transition:
            background 0.24s var(--dashboard-motion),
            color 0.18s ease,
            transform 0.24s var(--dashboard-motion),
            border-color 0.24s var(--dashboard-motion),
            box-shadow 0.24s var(--dashboard-motion);
    }

    .mobile-dock-link::before {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 48%);
        opacity: 0;
        transition: opacity 0.24s var(--dashboard-motion);
    }

    .mobile-dock-link::after {
        content: "";
        position: absolute;
        inset: auto auto 0.34rem 50%;
        width: 18px;
        height: 3px;
        border-radius: 999px;
        transform: translateX(-50%) scaleX(0.42);
        background: rgba(240, 199, 119, 0.74);
        opacity: 0;
        transition: transform 0.24s var(--dashboard-motion), opacity 0.24s var(--dashboard-motion);
    }

    .mobile-dock-link > * {
        position: relative;
        z-index: 1;
    }

    .mobile-dock-label {
        font-size: 0.76rem;
        font-weight: 900;
        letter-spacing: 0.02em;
    }

    .mobile-dock-meta {
        color: var(--muted);
        font-size: 0.64rem;
        line-height: 1.2;
    }

    .mobile-dock-link.active {
        color: var(--text);
        border-color: rgba(214, 167, 86, 0.22);
        background: linear-gradient(180deg, rgba(214, 167, 86, 0.18), rgba(255, 255, 255, 0.05));
        transform: translateY(-1px);
        box-shadow: 0 16px 30px rgba(0, 0, 0, 0.26);
    }

    .mobile-dock-link.active::before,
    .mobile-dock-link:hover::before {
        opacity: 1;
    }

    .mobile-dock-link.active::after {
        opacity: 1;
        transform: translateX(-50%) scaleX(1);
    }

    .mobile-dock-link-action {
        color: #171006;
        border-color: rgba(240, 199, 119, 0.56);
        background: linear-gradient(135deg, #f3cf87, #b98534);
        box-shadow: 0 14px 28px rgba(185, 133, 52, 0.26);
    }

    .mobile-dock-link-action .mobile-dock-meta {
        color: rgba(23, 16, 6, 0.78);
    }

    .mobile-dock-link:hover {
        transform: translateY(-2px);
        background: rgba(255, 255, 255, 0.05);
        box-shadow: 0 14px 26px rgba(0, 0, 0, 0.18);
    }

    .mobile-dock-link-action:hover {
        background: linear-gradient(135deg, #f6ddb0, #bd832e);
    }

    body.nav-open .mobile-dock,
    body.command-open .mobile-dock {
        opacity: 0;
        transform: translateY(16px);
        pointer-events: none;
    }
}

@media (max-width:940px) {

    .topbar-primary,
    .topbar-primary {
        grid-template-columns: 1fr;
    }

    .topbar-end,
    .topbar-end {
        justify-content: stretch;
    }

    .topbar-end>*,
    .topbar-end>* {
        flex: 1 1 auto;
    }

    .dashboard-stack,
    .settings-grid,
    .shifts-analytics,
    .dashboard-rhythm-grid,
    .overview-board,
    .dashboard-workspace-shell {
        grid-template-columns: 1fr;
    }

    .staff-command-shell,
    .staff-workspace-grid,
    .module-command-shell {
        grid-template-columns: 1fr;
    }

    .dashboard-accordion-trigger {
        grid-template-columns: 1fr;
    }

    .dashboard-accordion-metrics {
        grid-auto-flow: row;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-accordion-icon {
        justify-self: start;
    }

    .staff-summary-grid,
    .module-snapshot-grid,
    .workspace-link-row,
    .staff-pulse-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width:760px) {

    .main-content,
    .main-content {
        padding: 0.8rem 0.8rem 9.2rem;
    }

    .topbar,
    .topbar,
    .panel,
    .panel,
    .portal-hero,
    .portal-hero {
        border-radius: 1.1rem;
    }

    .dashboard-record-row-actionable {
        align-items: flex-start;
    }

    .dashboard-record-actions,
    .task-primary-actions {
        width: 100%;
        justify-content: flex-start;
    }

    .topbar-end,
    .topbar-end,
    .form-grid,
    .form-grid,
    .metric-grid,
    .metric-grid {
        grid-template-columns: 1fr;
    }

    .metric-grid,
    .action-grid,
    .attention-rail,
    .staff-card-grid,
    .report-highlight-grid {
        grid-template-columns: 1fr;
    }

    .sales-brief-grid {
        grid-template-columns: 1fr;
    }

    .panel-header,
    .portal-hero-head,
    .report-toolbar {
        flex-direction: column;
        align-items: flex-start;
    }

    .status-chip {
        white-space: nowrap;
    }

    .staff-priority-grid,
    .staff-pulse-grid,
    .staff-summary-grid,
    .staff-tool-grid,
    .staff-workspace-grid,
    .module-snapshot-grid,
    .portal-command-grid {
        grid-template-columns: 1fr;
    }

    .login-card-header {
        grid-template-columns: 1fr;
        align-items: flex-start;
    }

    .dashboard-row-link {
        flex-direction: column;
        align-items: flex-start;
    }

    .stock-filter-form {
        grid-template-columns: 1fr;
        gap: 0.82rem;
    }

    .stock-filter-search-row,
    .stock-filter-advanced {
        grid-template-columns: 1fr;
    }

    .stock-filter-search-row > .action-btn {
        width: 100%;
    }

    .dashboard-accordion-trigger,
    .dashboard-accordion-body {
        padding-inline: 0.82rem;
    }

    .page-shell,
    .dashboard-stack,
    .dashboard-view,
    .dashboard-view-management,
    .dashboard-view-staff,
    .module-view,
    .dashboard-hero-grid,
    .hero-signal-bar,
    .overview-board,
    .dashboard-command-grid,
    .module-card-grid,
    .module-snapshot-grid {
        gap: 0.9rem;
    }

    .dashboard-hero-card,
    .dashboard-command-card,
    .hero-signal,
    .staff-focus-item,
    .staff-summary-card,
    .module-snapshot-card {
        padding: 0.92rem;
    }

    .dashboard-accordion-metrics {
        grid-template-columns: 1fr;
    }

    .dashboard-row-link .metric-state,
    .dashboard-row-link .badge {
        align-self: flex-start;
    }

    table.data-table,
    table.data-table thead,
    table.data-table tbody,
    table.data-table th,
    table.data-table td,
    table.data-table tr {
        display: block;
    }

    table.data-table thead {
        display: none;
    }

    table.data-table tr {
        margin-bottom: 0.82rem;
        padding: 0.88rem;
        border: 1px solid var(--panel-border);
        border-radius: var(--radius-md);
        background: rgba(255, 255, 255, 0.035);
    }

    table.data-table td {
        display: flex;
        justify-content: space-between;
        gap: 0.82rem;
        padding: 0.52rem 0;
        border: 0;
    }

    table.data-table td::before {
        content: attr(data-label);
        flex: 0 0 42%;
        color: var(--gold);
        font-size: 0.7rem;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 0.08em;
    }

    .mobile-dock {
        position: fixed;
        inset: auto var(--dashboard-dock-offset) calc(var(--dashboard-dock-offset) + env(safe-area-inset-bottom, 0px)) var(--dashboard-dock-offset);
        top: auto;
        z-index: 70;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 0.45rem;
        width: min(calc(100% - (var(--dashboard-dock-offset) * 2)), var(--dashboard-dock-width));
        margin: 0 auto;
        padding: 0.5rem;
        border-radius: 1.35rem;
        border: 1px solid rgba(214, 167, 86, 0.16);
        background: linear-gradient(180deg, rgba(12, 17, 27, 0.96), rgba(7, 10, 16, 0.94));
        box-shadow: 0 22px 44px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.04);
        backdrop-filter: blur(18px);
    }

    .mobile-dock-link {
        position: relative;
        overflow: hidden;
        isolation: isolate;
        gap: 0.18rem;
        align-content: center;
        min-height: 60px;
        padding: 0.52rem 0.42rem;
        border-radius: 1rem;
        border: 1px solid transparent;
        background: transparent;
        color: var(--muted-strong);
        text-decoration: none;
        text-align: center;
        transition:
            background 0.24s var(--dashboard-motion),
            color 0.18s ease,
            transform 0.24s var(--dashboard-motion),
            border-color 0.24s var(--dashboard-motion),
            box-shadow 0.24s var(--dashboard-motion);
    }

    .mobile-dock-link::before {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 48%);
        opacity: 0;
        transition: opacity 0.24s var(--dashboard-motion);
    }

    .mobile-dock-link > * {
        position: relative;
        z-index: 1;
    }

    .mobile-dock-label {
        font-size: 0.74rem;
        font-weight: 900;
        letter-spacing: 0.02em;
    }

    .mobile-dock-meta {
        color: var(--muted);
        font-size: 0.62rem;
        line-height: 1.2;
    }

    .mobile-dock-link.active {
        color: var(--text);
        border-color: rgba(214, 167, 86, 0.22);
        background: rgba(214, 167, 86, 0.12);
        transform: translateY(-1px);
        box-shadow: 0 14px 28px rgba(0, 0, 0, 0.24);
    }

    .mobile-dock-link.active::before,
    .mobile-dock-link:hover::before {
        opacity: 1;
    }

    .mobile-dock-link-action {
        color: #171006;
        border-color: rgba(240, 199, 119, 0.56);
        background: linear-gradient(135deg, #f0c777, #b98534);
        box-shadow: 0 14px 28px rgba(185, 133, 52, 0.26);
    }

    .mobile-dock-link-action .mobile-dock-meta {
        color: rgba(23, 16, 6, 0.78);
    }

    .mobile-dock-link:hover {
        transform: translateY(-2px);
        background: rgba(255, 255, 255, 0.05);
    }

    .mobile-dock-link-action:hover {
        background: linear-gradient(135deg, #f6ddb0, #bd832e);
    }

    body.nav-open .mobile-dock,
    body.command-open .mobile-dock {
        opacity: 0;
        transform: translateY(16px);
        pointer-events: none;
    }

    .dashboard-panel-select-label {
        display: grid;
        width: 100%;
        margin: 0;
    }

    .dashboard-panel-select {
        width: 100%;
        max-width: none;
    }

    .dashboard-section-tabs {
        display: none;
    }

    .password-toggle-btn {
        position: static;
        transform: none;
        width: 100%;
        margin-top: 0.55rem;
    }

    .password-toggle-wrap input {
        padding-right: 0.7rem;
    }
}

@media (max-width:520px) {

    .main-content,
    .main-content {
        padding-inline: 0.65rem;
    }

    .topbar,
    .topbar,
    .panel,
    .panel,
    .metric-card,
    .action-tile,
    .attention-card {
        padding: 0.82rem;
    }

    .topbar h2,
    .topbar h2 {
        font-size: 1.35rem;
    }

    .portal-hero-title,
    .portal-hero-title {
        font-size: 1.55rem;
    }

    .mobile-command-grid {
        grid-template-columns: 1fr;
    }

    .mobile-dock-meta {
        display: none;
    }

    .mobile-dock-link {
        min-height: 56px;
        padding-block: 0.58rem 0.5rem;
    }

    .quick-action-link,
    .table-action,
    .action-btn,
    .topbar-switch-btn,
    .login-submit-btn {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .sidebar::before,
    .topbar::after,
    .portal-hero::after,
    .app-shell .page-shell > *,
    .login-submit-btn,
    .dashboard-command-card,
    .action-tile,
    .metric-card,
    .attention-card,
    .hero-signal,
    .throughput-bar,
    .shift-chart-fill,
    .metric-chart-bar,
    .dashboard-hero-card,
    .staff-summary-card,
    .staff-pulse-card,
    .module-snapshot-card,
    .portal-hero,
    .dashboard-accordion-card,
    .dashboard-accordion-body,
    .dashboard-collapsible-body,
    .dashboard-record-row,
    .dashboard-row-link,
    .mobile-dock-link {
        animation: none !important;
        transition: none !important;
    }
}

html[data-theme="light"] {
    --bg: #eef2f6;
    --bg-soft: #f8fafc;
    --panel: rgba(255, 255, 255, 0.92);
    --panel-strong: rgba(255, 255, 255, 0.98);
    --panel-border: rgba(126, 91, 35, 0.22);
    --gold: #926119;
    --gold-soft: rgba(146, 97, 25, 0.12);
    --gold-strong: #70470d;
    --text: #152132;
    --muted: #647084;
    --muted-strong: #3f4b5d;
    --ok: #167b61;
    --danger: #b23d4a;
    --warn: #9a661a;
    --info: #356db6;
    --shadow-soft: 0 16px 34px rgba(31, 43, 58, 0.1);
    --shadow-strong: 0 24px 54px rgba(31, 43, 58, 0.16);
}

html[data-theme="light"] body {
    background: radial-gradient(850px 420px at 90% -10%, rgba(214, 167, 86, 0.2), transparent 58%), radial-gradient(720px 420px at -8% 100%, rgba(49, 112, 101, 0.1), transparent 58%), linear-gradient(180deg, #f8fafc 0%, #e9eef4 100%);
}

html[data-theme="light"] .sidebar,
html[data-theme="light"] .topbar,
html[data-theme="light"] .workspace-bar,
html[data-theme="light"] .panel,
html[data-theme="light"] .metric-card,
html[data-theme="light"] .action-tile,
html[data-theme="light"] .attention-card,
html[data-theme="light"] .staff-card,
html[data-theme="light"] .report-highlight-card,
html[data-theme="light"] .hero-signal,
html[data-theme="light"] .portal-hero,
html[data-theme="light"] .mobile-dock,
html[data-theme="light"] .mobile-command-sheet,
html[data-theme="light"] .detail-drawer,
html[data-theme="light"] .login-card,
html[data-theme="light"] .error-card {
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(244, 247, 250, 0.96));
}

html[data-theme="light"] .topbar {
    background: radial-gradient(360px 180px at 100% 0%, rgba(240, 199, 119, 0.14), transparent 62%), linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(244, 247, 250, 0.96));
}

html[data-theme="light"] .portal-panel {
    background: radial-gradient(240px 160px at 100% 0%, rgba(240, 199, 119, 0.08), transparent 64%), linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(244, 247, 250, 0.96));
}

html[data-theme="light"] .dashboard-view-management .portal-hero {
    background: radial-gradient(440px 220px at 86% 0%, rgba(143, 183, 255, 0.18), transparent 60%), radial-gradient(360px 180px at 12% 100%, rgba(240, 199, 119, 0.12), transparent 62%), linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(243, 247, 252, 0.96));
}

html[data-theme="light"] .dashboard-view-staff .portal-hero {
    background: radial-gradient(460px 220px at 88% 0%, rgba(100, 214, 163, 0.14), transparent 60%), radial-gradient(360px 180px at 12% 100%, rgba(240, 199, 119, 0.12), transparent 62%), linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(243, 248, 250, 0.96));
}

html[data-theme="light"] .module-view-stock .portal-hero {
    background: radial-gradient(460px 220px at 88% 0%, rgba(85, 204, 191, 0.16), transparent 60%), radial-gradient(360px 180px at 8% 100%, rgba(240, 199, 119, 0.12), transparent 62%), linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(243, 248, 250, 0.96));
}

html[data-theme="light"] .module-view-orders .portal-hero {
    background: radial-gradient(460px 220px at 88% 0%, rgba(143, 183, 255, 0.16), transparent 60%), radial-gradient(360px 180px at 8% 100%, rgba(240, 199, 119, 0.12), transparent 62%), linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(243, 247, 252, 0.96));
}

html[data-theme="light"] .module-view-shifts .portal-hero {
    background: radial-gradient(460px 220px at 88% 0%, rgba(110, 196, 183, 0.16), transparent 60%), radial-gradient(360px 180px at 8% 100%, rgba(143, 183, 255, 0.12), transparent 62%), linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(243, 247, 251, 0.96));
}

html[data-theme="light"] .module-view-checklists .portal-hero {
    background: radial-gradient(460px 220px at 88% 0%, rgba(240, 199, 119, 0.16), transparent 60%), radial-gradient(360px 180px at 8% 100%, rgba(100, 214, 163, 0.1), transparent 62%), linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(244, 247, 250, 0.96));
}

html[data-theme="light"] .sidebar-presence,
html[data-theme="light"] .dashboard-hero-card,
html[data-theme="light"] .dashboard-accordion-card,
html[data-theme="light"] .filter-shell,
html[data-theme="light"] .stock-filter-form,
html[data-theme="light"] .focus-list li,
html[data-theme="light"] .activity-list li,
html[data-theme="light"] .settings-toggle-row,
html[data-theme="light"] .report-table-wrap,
html[data-theme="light"] .dashboard-section-stat,
html[data-theme="light"] .dashboard-record-row,
html[data-theme="light"] .staff-summary-card,
html[data-theme="light"] .staff-focus-item,
html[data-theme="light"] .staff-pulse-card,
html[data-theme="light"] .dashboard-command-card,
html[data-theme="light"] .workspace-link,
html[data-theme="light"] .workspace-action-chip,
html[data-theme="light"] .sidebar-shortcut,
html[data-theme="light"] .mobile-command-link,
html[data-theme="light"] .nav-link {
    background: rgba(255, 255, 255, 0.72);
}

html[data-theme="light"] .sidebar-venue-switcher,
html[data-theme="light"] .portal-badge {
    background: rgba(255, 255, 255, 0.78);
}

html[data-theme="light"] .status-chip-time,
html[data-theme="light"] .topbar-mode-chip {
    background: rgba(255, 255, 255, 0.82);
}

html[data-theme="light"] .error-hint-list li,
html[data-theme="light"] .error-status-strip,
html[data-theme="light"] .stock-form-panel .form-grid > .form-field {
    background: rgba(255, 255, 255, 0.78);
}

html[data-theme="light"] th {
    background: rgba(146, 97, 25, 0.08);
}

.theme-toggle-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-height: 48px;
    padding: 0.55rem 0.9rem;
    border: 1px solid rgba(214, 167, 86, 0.34);
    border-radius: 0.9rem;
    background: rgba(214, 167, 86, 0.1);
    color: var(--gold-strong);
    font-weight: 900;
    letter-spacing: 0.02em;
    transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}

.theme-toggle-btn:hover {
    transform: translateY(-1px);
    border-color: rgba(240, 199, 119, 0.72);
    background: rgba(214, 167, 86, 0.18);
}

.theme-toggle-swatch {
    width: 0.85rem;
    height: 0.85rem;
    border-radius: 999px;
    background: linear-gradient(135deg, #f0c777 0%, #8e5c18 100%);
    box-shadow: 0 0 0 3px rgba(214, 167, 86, 0.12);
}

html[data-theme="light"] .theme-toggle-btn {
    border-color: rgba(112, 71, 13, 0.22);
    background: rgba(255, 255, 255, 0.72);
    color: #70470d;
}

html[data-theme="light"] .theme-toggle-swatch {
    background: linear-gradient(135deg, #fff4c9 0%, #d49c3c 100%);
}

html[data-theme="light"] .mobile-dock-link-action {
    color: #251605;
}

html[data-theme="light"] .mobile-dock-link-action .mobile-dock-meta {
    color: rgba(37, 22, 5, 0.78);
}

.topbar-nav,
.topbar-nav-links,
.topbar-quick-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.topbar .topbar-nav-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0.48rem 0.76rem;
    border: 1px solid rgba(214, 167, 86, 0.2);
    border-radius: 0.8rem;
    background: rgba(255, 255, 255, 0.035);
    color: var(--muted-strong);
    font-size: 0.78rem;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
    transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, color 0.18s ease;
}

.topbar .topbar-nav-link::before {
    display: none;
}

.topbar .topbar-nav-link:hover,
.topbar .topbar-nav-link.active {
    transform: translateY(-1px);
    border-color: rgba(214, 167, 86, 0.52);
    background: rgba(214, 167, 86, 0.12);
    color: var(--gold-strong);
}

.attention-card-link,
.metric-action-link,
.quick-action-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.42rem;
    width: fit-content;
    min-height: 40px;
    padding: 0.5rem 0.75rem;
    border: 1px solid rgba(214, 167, 86, 0.3);
    border-radius: 0.8rem;
    background: rgba(214, 167, 86, 0.08);
    color: var(--gold-strong);
    font-size: 0.8rem;
    font-weight: 900;
    text-decoration: none;
    transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}

.attention-card-link::after,
.metric-action-link::after {
    content: "→";
    font-size: 1rem;
    line-height: 1;
}

.attention-card-link:hover,
.metric-action-link:hover,
.quick-action-link:hover {
    transform: translateY(-1px);
    border-color: rgba(240, 199, 119, 0.68);
    background: linear-gradient(135deg, rgba(240, 199, 119, 0.2), rgba(185, 133, 52, 0.16));
}

@media (max-width:760px) {

    .dashboard-hero-grid,
    .overview-board,
    .dashboard-workspace-shell,
    .workspace-link-row {
        grid-template-columns: 1fr;
    }

    .topbar-nav,
    .topbar-nav-links,
    .topbar-quick-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
    }

    .topbar .topbar-nav-link {
        width: 100%;
        min-height: 44px;
        padding-inline: 0.5rem;
    }

    .attention-card-link,
    .metric-action-link,
    .quick-action-link {
        width: 100%;
    }

    .topbar-eyebrow,
    .topbar-date {
        display: none;
    }

    .dashboard-panel-actions {
        width: 100%;
        margin-left: 0;
    }

    .dashboard-panel-actions .dashboard-controls,
    .dashboard-panel-actions .panel-collapse-toggle,
    .dashboard-panel-actions .dashboard-panel-select-label {
        width: 100%;
    }

    .dashboard-panel-actions .dashboard-controls {
        justify-content: flex-start;
    }

    .dashboard-panel-select-label {
        margin-left: 0;
    }

    .report-toolbar .dashboard-controls {
        margin-left: 0;
        width: 100%;
    }

    .workspace-bar {
        display: none;
    }

    .sidebar-venue-switcher-actions {
        grid-template-columns: 1fr;
    }
}

/* Minimal productive refresh */

:root {
    --bg: #0f151b;
    --bg-soft: #161d25;
    --panel: #151c24;
    --panel-strong: #1a222b;
    --panel-border: rgba(255, 255, 255, 0.08);
    --gold: #bc9050;
    --gold-soft: rgba(188, 144, 80, 0.12);
    --gold-strong: #e3c18d;
    --text: #edf2f7;
    --muted: #8f9cab;
    --muted-strong: #cdd6df;
    --ok: #72c497;
    --danger: #e67d88;
    --warn: #d2a15c;
    --info: #90aed3;
    --shadow-soft: 0 10px 30px rgba(0, 0, 0, 0.18);
    --shadow-strong: 0 18px 42px rgba(0, 0, 0, 0.24);
    --focus-ring: 0 0 0 3px rgba(188, 144, 80, 0.16);
    --dashboard-shell-gap: clamp(0.95rem, 1.25vw, 1.2rem);
    --dashboard-gap: clamp(0.9rem, 1.15vw, 1.08rem);
    --dashboard-gap-tight: 0.66rem;
    --dashboard-panel-padding: clamp(0.95rem, 1.2vw, 1.08rem);
    --dashboard-card-padding: 0.82rem;
    --dashboard-hover-shadow: 0 14px 30px rgba(0, 0, 0, 0.14);
    --dashboard-dock-width: min(100%, 680px);
    --surface-subtle: rgba(255, 255, 255, 0.028);
    --surface-muted: rgba(255, 255, 255, 0.042);
    --surface-hover: rgba(255, 255, 255, 0.06);
    --surface-selected: rgba(188, 144, 80, 0.12);
}

html[data-theme="light"] {
    --bg: #f4f6f8;
    --bg-soft: #fbfcfd;
    --panel: #ffffff;
    --panel-strong: #ffffff;
    --panel-border: rgba(15, 23, 42, 0.09);
    --gold: #8b6b38;
    --gold-soft: rgba(139, 107, 56, 0.1);
    --gold-strong: #704f1c;
    --text: #111827;
    --muted: #667085;
    --muted-strong: #344054;
    --ok: #147d64;
    --danger: #b83d4f;
    --warn: #99651d;
    --info: #315f96;
    --shadow-soft: 0 8px 22px rgba(15, 23, 42, 0.06);
    --shadow-strong: 0 18px 38px rgba(15, 23, 42, 0.1);
    --focus-ring: 0 0 0 3px rgba(139, 107, 56, 0.14);
    --surface-subtle: rgba(15, 23, 42, 0.03);
    --surface-muted: rgba(15, 23, 42, 0.05);
    --surface-hover: rgba(15, 23, 42, 0.07);
    --surface-selected: rgba(139, 107, 56, 0.1);
}

body {
    background: linear-gradient(180deg, var(--bg-soft) 0%, var(--bg) 100%);
}

.shell-bg {
    background:
        radial-gradient(circle at 10% 0%, rgba(188, 144, 80, 0.06), transparent 24%),
        radial-gradient(circle at 100% 0%, rgba(255, 255, 255, 0.04), transparent 18%);
}

html[data-theme="light"] .shell-bg {
    background:
        radial-gradient(circle at 10% 0%, rgba(139, 107, 56, 0.06), transparent 22%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.4), transparent 26%);
}

.sidebar,
.topbar,
.workspace-bar,
.panel,
.metric-card,
.action-tile,
.attention-card,
.staff-card,
.report-highlight-card,
.hero-signal,
.portal-hero,
.mobile-dock,
.mobile-command-sheet,
.detail-drawer,
.login-card,
.error-card {
    background: var(--panel-strong);
    border-color: var(--panel-border);
    box-shadow: var(--shadow-soft);
    backdrop-filter: none;
}

.sidebar::before,
.panel::before,
.panel::after,
.metric-card::before,
.metric-card::after,
.action-tile::before,
.action-tile::after,
.attention-card::before,
.attention-card::after,
.staff-card::before,
.staff-card::after,
.report-highlight-card::after,
.hero-signal::after,
.topbar::before,
.topbar::after,
.portal-hero::before,
.portal-hero::after,
.dashboard-hero-card::before,
.dashboard-hero-card::after,
.staff-summary-card::before,
.staff-summary-card::after,
.staff-pulse-card::before,
.staff-pulse-card::after,
.module-snapshot-card::before,
.module-snapshot-card::after,
.dashboard-accordion-card::before,
.dashboard-accordion-card::after,
.filter-shell::before,
.mobile-dock::before,
.mobile-dock::after,
.login-card::after,
.error-card::after {
    display: none;
}

.main-content {
    max-width: 1560px;
}

@media (min-width:1181px) {
    .layout {
        grid-template-columns: minmax(248px, 276px) minmax(0, 1fr);
        gap: clamp(0.95rem, 1.2vw, 1.15rem);
        padding: clamp(0.9rem, 1.2vw, 1.08rem);
    }

    .sidebar {
        top: 0.9rem;
        min-height: calc(100dvh - 1.8rem);
        max-height: calc(100dvh - 1.8rem);
    }
}

.sidebar {
    background: var(--panel);
    padding: calc(1rem + env(safe-area-inset-top, 0px)) 0.95rem calc(1rem + env(safe-area-inset-bottom, 0px));
}

.brand-wrap {
    margin-bottom: 1.15rem;
}

.brand-logo {
    width: 60px;
    height: 60px;
    padding: 0.3rem;
    border-radius: 0.9rem;
    background: var(--surface-muted);
    border-color: var(--panel-border);
    box-shadow: none;
}

.brand-title {
    font-size: 1.05rem;
}

.brand-subtitle,
.nav-section-title,
.topbar-eyebrow,
.kicker,
.workspace-bar-kicker,
.dashboard-workspace-kicker,
.staff-focus-kicker,
.staff-summary-label,
.staff-pulse-label,
.module-snapshot-label,
.dashboard-command-label,
.dashboard-command-meta,
.metric-card h3,
.attention-card-label,
.hero-signal-label,
.report-highlight-card h4,
th {
    color: var(--muted);
    letter-spacing: 0.12em;
}

.sidebar-presence,
.sidebar-venue-switcher,
.nav-link,
.workspace-link,
.workspace-action-chip,
.sidebar-shortcut,
.mobile-command-link,
.dashboard-hero-card,
.filter-shell,
.dashboard-accordion-card,
.focus-list li,
.activity-list li,
.settings-toggle-row,
.report-table-wrap,
.dashboard-section-stat,
.dashboard-record-row,
.staff-summary-card,
.staff-focus-item,
.staff-pulse-card,
.dashboard-command-card,
.module-snapshot-card,
.stock-form-panel .form-grid > .form-field,
.detail-drawer-card,
.order-item-row,
.error-hint-list li,
.error-status-strip,
.message,
.empty-state,
.settings-status {
    background: var(--surface-subtle);
    border-color: var(--panel-border);
    box-shadow: none;
    backdrop-filter: none;
}

.menu-btn,
.sidebar-close,
.logout-btn,
.theme-toggle-btn,
.table-action,
.action-btn,
.topbar-switch-btn,
.segment-btn,
.preset-chip,
.pagination-link,
.metric-card-jump,
.attention-card-link,
.metric-action-link,
.quick-action-link {
    border-color: var(--panel-border);
    border-radius: 0.9rem;
    background: var(--surface-subtle);
    color: var(--text);
    box-shadow: none;
}

.menu-btn:hover,
.sidebar-close:hover,
.logout-btn:hover,
.theme-toggle-btn:hover,
.table-action:hover,
.action-btn:hover,
.topbar-switch-btn:hover,
.segment-btn:hover,
.preset-chip:hover,
.pagination-link:hover,
.metric-card-jump:hover,
.attention-card-link:hover,
.metric-action-link:hover,
.quick-action-link:hover {
    transform: none;
    border-color: rgba(188, 144, 80, 0.24);
    background: var(--surface-hover);
    box-shadow: none;
}

.action-btn,
.segment-btn.active,
.preset-chip.active,
.mobile-dock-link-action {
    background: var(--text);
    color: var(--bg);
    border-color: transparent;
}

html[data-theme="light"] .action-btn,
html[data-theme="light"] .segment-btn.active,
html[data-theme="light"] .preset-chip.active,
html[data-theme="light"] .mobile-dock-link-action {
    background: #111827;
    color: #ffffff;
}

.theme-toggle-btn {
    min-height: 44px;
    padding: 0.52rem 0.82rem;
    color: var(--muted-strong);
}

.theme-toggle-swatch {
    width: 0.7rem;
    height: 0.7rem;
    background: currentColor;
    box-shadow: none;
    opacity: 0.72;
}

.nav-link {
    min-height: 50px;
    padding: 0.72rem 0.82rem;
    border-color: var(--panel-border);
}

.nav-link::before,
.nav-link::after {
    display: none;
}

.nav-link:hover,
.nav-link.active,
.workspace-link:hover,
.workspace-link.active,
.workspace-action-chip:hover,
.sidebar-shortcut:hover,
.sidebar-venue-option:hover,
.sidebar-venue-option.active {
    transform: none;
    color: var(--text);
    border-color: rgba(188, 144, 80, 0.22);
    background: var(--surface-selected);
    box-shadow: none;
}

.sidebar-venue-option {
    background: var(--surface-subtle);
    border-color: var(--panel-border);
    box-shadow: none;
}

.workspace-bar,
.dashboard-hero-card,
.dashboard-command-card,
.staff-pulse-card,
.module-snapshot-card {
    box-shadow: none;
}

.workspace-link,
.workspace-action-chip,
.sidebar-shortcut {
    background: var(--surface-subtle);
    border-color: var(--panel-border);
}

.topbar {
    margin-bottom: 0.75rem;
    padding: 1rem 1.08rem;
    border-radius: 1.35rem;
}

.topbar-primary {
    gap: 0.7rem;
}

.topbar h2 {
    font-size: clamp(1.2rem, 1.85vw, 1.55rem);
    letter-spacing: -0.04em;
}

.topbar p,
.topbar-date {
    color: var(--muted);
    font-size: 0.82rem;
}

.topbar-end {
    gap: 0.55rem;
}

.topbar-utility {
    padding-top: 0.8rem;
    border-top: 1px solid var(--panel-border);
}

.status-chip,
.panel-header-meta,
.metric-state,
.badge {
    min-height: 28px;
    padding: 0.24rem 0.58rem;
    border-color: var(--panel-border);
    background: var(--surface-subtle);
    color: var(--muted-strong);
    font-size: 0.7rem;
    letter-spacing: 0.08em;
}

.status-chip-user {
    gap: 0.4rem;
}

.status-chip-user strong,
.status-chip-user small {
    color: inherit;
}

.status-chip-live,
.metric-state-ok,
.badge-status-delivered,
.badge-stock-healthy,
.badge-alert-enabled {
    color: var(--ok);
    border-color: rgba(114, 196, 151, 0.24);
    background: rgba(114, 196, 151, 0.08);
}

.metric-state-alert,
.badge-status-cancelled,
.badge-stock-critical,
.badge-due-overdue {
    color: var(--danger);
    border-color: rgba(230, 125, 136, 0.24);
    background: rgba(230, 125, 136, 0.08);
}

.metric-state-warn,
.badge-status-pending,
.badge-stock-low,
.badge-stock-watch,
.badge-due-today {
    color: var(--warn);
    border-color: rgba(210, 161, 92, 0.24);
    background: rgba(210, 161, 92, 0.08);
}

.metric-state-neutral,
.badge-due-upcoming,
.portal-badge,
.topbar-mode-chip,
.status-chip-time {
    color: var(--muted-strong);
    border-color: var(--panel-border);
    background: var(--surface-subtle);
    box-shadow: none;
}

.panel,
.portal-panel,
.portal-hero,
.metric-card,
.action-tile,
.attention-card,
.staff-card,
.report-highlight-card,
.hero-signal {
    border-radius: 1.25rem;
}

.portal-panel,
.portal-hero,
.dashboard-view-management .portal-hero,
.dashboard-view-staff .portal-hero,
.module-view-stock .portal-hero,
.module-view-orders .portal-hero,
.module-view-shifts .portal-hero,
.module-view-checklists .portal-hero,
html[data-theme="light"] .portal-panel,
html[data-theme="light"] .portal-hero,
html[data-theme="light"] .dashboard-view-management .portal-hero,
html[data-theme="light"] .dashboard-view-staff .portal-hero,
html[data-theme="light"] .module-view-stock .portal-hero,
html[data-theme="light"] .module-view-orders .portal-hero,
html[data-theme="light"] .module-view-shifts .portal-hero,
html[data-theme="light"] .module-view-checklists .portal-hero {
    background: var(--panel-strong);
    box-shadow: none;
}

.portal-hero {
    gap: 0.95rem;
    padding: clamp(1rem, 1.5vw, 1.12rem);
}

.portal-hero::before {
    background: linear-gradient(90deg, rgba(240, 199, 119, 0.22), rgba(255, 255, 255, 0.02) 48%, rgba(255, 255, 255, 0));
    background-repeat: no-repeat;
    background-size: 100% 1px;
    background-position: 0 0;
}

.portal-hero::after {
    display: none;
}

.portal-hero-head,
.panel-header,
.report-toolbar {
    gap: 0.75rem;
    margin-bottom: 0.72rem;
}

.portal-hero-title {
    max-width: 22ch;
    font-size: clamp(1.3rem, 2.1vw, 1.85rem);
    letter-spacing: -0.04em;
}

.portal-hero-copy {
    margin-top: 0.35rem;
    max-width: 60ch;
    font-size: 0.95rem;
    line-height: 1.5;
}

.panel-header h3 {
    font-size: clamp(1rem, 1.3vw, 1.18rem);
    letter-spacing: -0.02em;
}

.panel-subtitle,
.metric-note,
.metric-delta,
.report-window-meta,
.settings-copy,
.settings-note,
.empty-state,
.dashboard-record-copy small,
.dashboard-record-note,
.focus-list small,
.activity-list small,
.staff-summary-copy,
.staff-pulse-card p,
.module-snapshot-copy {
    color: var(--muted);
}

.dashboard-hero-grid,
.module-command-shell,
.staff-command-shell,
.dashboard-rhythm-grid,
.dashboard-workspace-shell,
.staff-workspace-grid {
    gap: 0.95rem;
}

.dashboard-hero-grid {
    grid-template-columns: minmax(0, 1.25fr) minmax(300px, 0.75fr);
}

.metric-card,
.attention-card,
.hero-signal,
.dashboard-hero-card,
.staff-summary-card,
.staff-pulse-card,
.module-snapshot-card,
.dashboard-command-card,
.dashboard-record-row,
.focus-list li,
.activity-list li,
.staff-focus-item,
.filter-shell {
    box-shadow: none;
}

.metric-card:hover,
.attention-card:hover,
.hero-signal:hover,
.dashboard-hero-card:hover,
.staff-summary-card:hover,
.staff-pulse-card:hover,
.module-snapshot-card:hover,
.dashboard-command-card:hover,
.dashboard-record-row:hover,
.focus-list li:hover,
.activity-list li:hover,
.staff-focus-item:hover {
    transform: none;
    border-color: rgba(188, 144, 80, 0.18);
    background: var(--surface-hover);
    box-shadow: none;
}

.metric-card {
    gap: 0.32rem;
}

.metric-card p {
    margin-top: 0.48rem;
    font-size: clamp(1.55rem, 3vw, 2.1rem);
    letter-spacing: -0.05em;
}

.metric-summary {
    margin-top: 0.5rem;
    color: var(--muted-strong);
}

.metric-card-jump,
.attention-card-link,
.metric-action-link,
.quick-action-link {
    min-height: 36px;
    padding: 0.4rem 0.68rem;
    color: var(--muted-strong);
}

.attention-card-link::after,
.metric-action-link::after {
    content: "->";
    font-size: 0.9rem;
}

.dashboard-accordion-card {
    border-radius: 1.15rem;
    background: var(--surface-subtle);
}

.dashboard-accordion-card:hover {
    transform: none;
    border-color: rgba(188, 144, 80, 0.18);
    background: var(--surface-hover);
    box-shadow: none;
}

.dashboard-accordion-card.is-open {
    border-color: rgba(188, 144, 80, 0.24);
    background: var(--surface-selected);
    box-shadow: none;
    animation: none;
}

.dashboard-accordion-trigger {
    padding: 1rem 1.05rem;
    grid-template-columns: minmax(0, 1fr) minmax(180px, auto) auto;
}

.dashboard-accordion-summary {
    gap: 0.22rem;
}

.dashboard-accordion-summary strong {
    max-width: none;
    font-size: 1.04rem;
}

.dashboard-accordion-metrics {
    gap: 0.55rem;
}

.dashboard-accordion-metric {
    min-height: auto;
    padding: 0.7rem 0.75rem;
    border-color: var(--panel-border);
    background: var(--surface-muted);
    box-shadow: none;
}

.dashboard-accordion-card.is-open .dashboard-accordion-metric {
    border-color: var(--panel-border);
    background: var(--surface-hover);
    transform: none;
    animation: none;
}

.dashboard-accordion-card.is-open .dashboard-accordion-label,
.dashboard-accordion-card.is-open .dashboard-accordion-summary strong {
    color: var(--text);
}

.dashboard-accordion-icon {
    width: 2rem;
    height: 2rem;
    border-color: var(--panel-border);
    background: transparent;
    box-shadow: none;
}

.dashboard-accordion-card.is-open .dashboard-accordion-icon {
    border-color: rgba(188, 144, 80, 0.22);
    background: var(--surface-muted);
    transform: none;
    box-shadow: none;
}

.dashboard-accordion-body {
    border-top: 1px solid var(--panel-border);
}

.dashboard-section-stat,
.dashboard-record-row,
.focus-list li,
.activity-list li,
.staff-focus-item,
.staff-summary-card,
.staff-pulse-card,
.module-snapshot-card {
    background: var(--surface-subtle);
}

.filter-shell {
    padding: 0.95rem 1rem;
}

label,
.form-field label,
.stock-filter-form label,
.login-card label {
    font-size: 0.76rem;
    letter-spacing: 0.08em;
}

input,
select,
textarea,
.form-field input,
.form-field select,
.form-field textarea,
.stock-filter-form input,
.stock-filter-form select,
.inline-status-form select {
    min-height: 44px;
    padding: 0.68rem 0.78rem;
    border-color: var(--panel-border);
    border-radius: 0.9rem;
    background: var(--surface-subtle);
}

input:hover,
select:hover,
textarea:hover,
input:focus,
select:focus,
textarea:focus {
    border-color: rgba(188, 144, 80, 0.26);
}

.stock-form-panel .form-grid > .form-field:focus-within {
    transform: none;
    border-color: rgba(188, 144, 80, 0.22);
    background: var(--surface-hover);
}

.report-table-wrap {
    padding: 0.3rem;
}

th,
td {
    border-bottom: 1px solid var(--panel-border);
}

th {
    background: transparent;
}

tbody tr:hover {
    background: var(--surface-subtle);
}

.message-success {
    border-color: rgba(114, 196, 151, 0.28);
}

.message-error,
.message-danger {
    border-color: rgba(230, 125, 136, 0.28);
}

.message-warning {
    border-color: rgba(210, 161, 92, 0.28);
}

.message-info {
    border-color: rgba(144, 174, 211, 0.28);
}

.detail-drawer {
    background: var(--panel);
    border-left: 1px solid var(--panel-border);
}

.mobile-command-sheet {
    background: var(--panel-strong);
    border: 1px solid var(--panel-border);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: transform 0.22s ease, opacity 0.18s ease, visibility 0.18s ease;
}

.mobile-command-sheet[aria-hidden="false"] {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.mobile-command-link {
    border-color: var(--panel-border);
    background: var(--surface-subtle);
    box-shadow: none;
}

.mobile-command-link:hover {
    transform: none;
    border-color: rgba(188, 144, 80, 0.18);
    background: var(--surface-hover);
    box-shadow: none;
}

.mobile-command-link-primary {
    background: var(--surface-selected);
    border-color: rgba(188, 144, 80, 0.22);
}

@media (max-width:1180px) {
    .mobile-dock {
        border-color: var(--panel-border);
        background: var(--panel);
        box-shadow: var(--shadow-strong);
        backdrop-filter: none;
    }

    .mobile-dock-link {
        min-height: 60px;
        padding: 0.64rem 0.45rem 0.56rem;
        border: 1px solid transparent;
    }

    .mobile-dock-link::before,
    .mobile-dock-link::after {
        display: none;
    }

    .mobile-dock-link:hover {
        transform: none;
        background: var(--surface-hover);
        box-shadow: none;
    }

    .mobile-dock-link.active {
        transform: none;
        border-color: rgba(188, 144, 80, 0.22);
        background: var(--surface-selected);
        box-shadow: none;
    }

    .mobile-dock-link-action {
        box-shadow: none;
    }

    .mobile-dock-meta {
        color: var(--muted);
    }
}

@media (max-width:940px) {
    .topbar-primary {
        grid-template-columns: 1fr;
    }

    .topbar-end {
        justify-content: flex-start;
    }
}

@media (max-width:760px) {
    .dashboard-hero-grid,
    .overview-board,
    .dashboard-workspace-shell,
    .workspace-link-row {
        grid-template-columns: 1fr;
    }

    .topbar {
        top: calc(0.5rem + env(safe-area-inset-top, 0px));
        padding: 0.88rem 0.92rem;
    }

    .topbar-utility {
        padding-top: 0.65rem;
    }

    .portal-hero {
        padding: 0.95rem;
    }

    .portal-hero-title {
        font-size: 1.32rem;
    }

    .panel,
    .metric-card,
    .action-tile,
    .attention-card,
    .staff-card,
    .report-highlight-card,
    .hero-signal,
    .dashboard-hero-card,
    .dashboard-accordion-card {
        border-radius: 1rem;
    }

    .dashboard-accordion-trigger {
        grid-template-columns: 1fr;
    }

    .dashboard-accordion-metrics {
        grid-auto-flow: row;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-accordion-icon {
        justify-self: start;
    }

    .mobile-dock-meta {
        display: none;
    }
}

/* Shell navigation revamp */

.sidebar {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.02), transparent 18%),
        var(--panel);
    border: 1px solid var(--panel-border);
}

.brand-wrap {
    display: grid;
    gap: 0.9rem;
    margin-bottom: 0;
    padding-bottom: 0.95rem;
    border-bottom: 1px solid var(--panel-border);
}

.brand-block {
    display: grid;
    gap: 0.78rem;
}

.brand {
    display: block;
}

.brand-mark {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.8rem;
    align-items: center;
    padding: 0.72rem;
    border: 1px solid var(--panel-border);
    border-radius: 1.05rem;
    background:
        linear-gradient(135deg, rgba(188, 144, 80, 0.08), transparent 55%),
        var(--surface-subtle);
}

.brand-logo {
    width: 54px;
    height: 54px;
    padding: 0.28rem;
    border-radius: 0.85rem;
    background: rgba(255, 255, 255, 0.03);
}

.brand-copy {
    display: grid;
    gap: 0.12rem;
    min-width: 0;
}

.brand-title {
    font-size: 1rem;
    letter-spacing: -0.03em;
}

.brand-subtitle {
    margin: 0;
    font-size: 0.68rem;
}

.sidebar-presence,
.sidebar-venue-switcher summary,
.sidebar-venue-option {
    border-radius: 1rem;
}

.sidebar-presence {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.72rem;
    align-items: center;
    padding: 0.78rem 0.82rem;
    background: var(--surface-subtle);
}

.sidebar-presence-dot {
    width: 0.58rem;
    height: 0.58rem;
    background: var(--warn);
    box-shadow: 0 0 0 0.22rem rgba(210, 161, 92, 0.12);
}

.sidebar-presence-copy {
    min-width: 0;
}

.sidebar-presence-copy strong,
.sidebar-presence-copy small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sidebar-venue-switcher {
    margin: 0;
    padding: 0.18rem;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.01);
}

.sidebar-venue-switcher summary {
    display: grid;
    gap: 0.16rem;
    padding: 0.72rem 0.78rem;
    background: var(--surface-subtle);
}

.sidebar-venue-switcher-body {
    gap: 0.55rem;
    padding: 0.58rem 0.18rem 0.1rem;
}

.sidebar-venue-option {
    padding: 0.72rem 0.8rem;
}

.sidebar-venue-switcher-actions {
    padding-top: 0.18rem;
}

.nav-links {
    display: grid;
    gap: 0.95rem;
    flex: 1;
    min-height: 0;
    overflow: auto;
    padding-right: 0.05rem;
}

.nav-section {
    display: grid;
    gap: 0.5rem;
    padding: 0.18rem;
    border: 1px solid var(--panel-border);
    border-radius: 1.05rem;
    background: rgba(255, 255, 255, 0.015);
}

.nav-section-title {
    margin: 0;
    padding: 0.24rem 0.5rem 0;
    font-size: 0.68rem;
}

.nav-link {
    position: relative;
    min-height: 0;
    padding: 0.82rem 0.86rem 0.84rem 0.98rem;
    border-radius: 0.96rem;
    overflow: hidden;
}

.nav-link::before {
    display: block;
    content: "";
    position: absolute;
    top: 0.72rem;
    bottom: 0.72rem;
    left: 0.42rem;
    width: 0.18rem;
    border-radius: 999px;
    background: rgba(188, 144, 80, 0.38);
    opacity: 0;
    transition: opacity 0.16s ease;
}

.nav-link:hover::before,
.nav-link.active::before {
    opacity: 1;
}

.nav-link.active {
    background:
        linear-gradient(135deg, rgba(188, 144, 80, 0.12), transparent 52%),
        var(--surface-selected);
}

.nav-link-copy {
    display: grid;
    gap: 0.18rem;
}

.nav-link-copy strong {
    font-size: 0.94rem;
    letter-spacing: -0.01em;
}

.nav-link-copy small {
    color: var(--muted);
    line-height: 1.4;
}

.logout-form {
    margin-top: auto;
    padding-top: 0.95rem;
    border-top: 1px solid var(--panel-border);
}

.logout-btn {
    width: 100%;
    min-height: 46px;
    justify-content: center;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.topbar {
    display: grid;
    gap: 0.85rem;
    padding: 0.96rem 1.04rem;
    background:
        linear-gradient(135deg, rgba(188, 144, 80, 0.08), transparent 45%),
        var(--panel-strong);
    border: 1px solid var(--panel-border);
}

.topbar-primary {
    align-items: start;
}

.topbar-start {
    align-items: start;
    gap: 0.9rem;
}

.menu-btn {
    min-height: 48px;
    padding: 0.52rem 0.72rem;
    border-radius: 1rem;
    background: var(--surface-muted);
}

.menu-btn-logo {
    width: 1.95rem;
    height: 1.95rem;
    padding: 0.16rem;
    border-radius: 0.68rem;
    background: rgba(255, 255, 255, 0.03);
}

.menu-btn-label {
    font-size: 0.78rem;
    letter-spacing: 0.12em;
}

.topbar-title-block {
    display: grid;
    gap: 0.18rem;
}

.topbar-eyebrow {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 0.22rem 0.58rem;
    border: 1px solid var(--panel-border);
    border-radius: 999px;
    background: var(--surface-subtle);
}

.topbar-title-row {
    align-items: end;
}

.topbar h2 {
    font-size: clamp(1.22rem, 2vw, 1.62rem);
}

.topbar-date {
    margin: 0;
}

.topbar-end {
    align-items: start;
    justify-content: flex-end;
    gap: 0.6rem;
}

.theme-toggle-btn,
.topbar-switch-btn,
.sidebar-close {
    min-height: 46px;
    padding: 0.55rem 0.84rem;
    border-radius: 1rem;
}

.topbar-switch-btn {
    font-weight: 600;
}

.topbar-utility {
    margin-top: 0.08rem;
    padding-top: 0.82rem;
    border-top: 1px solid var(--panel-border);
}

.topbar-status-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.status-chip {
    min-height: 34px;
    padding: 0.32rem 0.72rem;
    border-radius: 999px;
}

.status-chip-user {
    padding-right: 0.86rem;
}

.status-chip-user strong {
    font-size: 0.8rem;
}

.mobile-dock {
    padding: 0.52rem;
    background:
        linear-gradient(180deg, rgba(188, 144, 80, 0.08), transparent 70%),
        var(--panel);
}

.mobile-dock-link {
    border-radius: 0.95rem;
    gap: 0.18rem;
}

.mobile-dock-label {
    font-size: 0.72rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.mobile-dock-link.active .mobile-dock-label,
.mobile-dock-link-action .mobile-dock-label {
    color: inherit;
}

.mobile-command-sheet {
    border-radius: 1.25rem 1.25rem 0 0;
    padding: 1rem;
    background:
        linear-gradient(180deg, rgba(188, 144, 80, 0.08), transparent 22%),
        var(--panel-strong);
}

.mobile-command-head {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 0.8rem;
    margin-bottom: 0.9rem;
}

.mobile-command-copy {
    margin: 0.22rem 0 0;
    color: var(--muted);
}

.mobile-command-grid {
    display: grid;
    gap: 0.65rem;
}

.mobile-command-link {
    padding: 0.84rem 0.92rem;
    border-radius: 1rem;
}

.mobile-command-link strong {
    font-size: 0.94rem;
    letter-spacing: -0.01em;
}

.mobile-command-link small {
    color: var(--muted);
}

@media (max-width:1180px) {
    .sidebar {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .nav-links {
        padding-right: 0;
    }
}

@media (max-width:940px) {
    .topbar-primary {
        gap: 0.78rem;
    }
}

@media (max-width:760px) {
    .topbar-start {
        grid-template-columns: 1fr;
        gap: 0.72rem;
    }

    .menu-btn {
        width: 100%;
        justify-content: flex-start;
    }

    .topbar-end {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
    }

    .theme-toggle-btn,
    .topbar-switch-btn {
        width: 100%;
        justify-content: center;
    }

    .status-chip {
        flex: 1 1 calc(50% - 0.5rem);
        justify-content: center;
    }

    .mobile-command-sheet {
        padding-bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
    }
}

/* Bottom navbar is primary navigation */

.main-content {
    padding-bottom: calc(8rem + env(safe-area-inset-bottom, 0px));
}

.mobile-dock {
    position: fixed;
    inset: auto auto calc(1rem + env(safe-area-inset-bottom, 0px)) 50%;
    z-index: 70;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.45rem;
    width: min(calc(100% - 2rem), 860px);
    margin: 0;
    padding: 0.52rem;
    border-radius: 1.35rem;
    border: 1px solid rgba(188, 144, 80, 0.16);
    background:
        linear-gradient(180deg, rgba(188, 144, 80, 0.08), transparent 70%),
        var(--panel);
    box-shadow: 0 22px 44px rgba(0, 0, 0, 0.28);
    transform: translateX(-50%);
}

.mobile-dock::before {
    content: "";
    position: absolute;
    inset: 0 auto auto 50%;
    width: 78px;
    height: 3px;
    border-radius: 999px;
    transform: translateX(-50%);
    background: linear-gradient(90deg, rgba(188, 144, 80, 0), rgba(188, 144, 80, 0.82), rgba(188, 144, 80, 0));
    opacity: 0.78;
}

.mobile-dock::after {
    display: none;
}

.mobile-dock-link {
    min-height: 62px;
    padding: 0.68rem 0.46rem 0.6rem;
    border-radius: 1rem;
    border: 1px solid transparent;
    text-align: center;
}

.mobile-dock-link.active {
    border-color: rgba(188, 144, 80, 0.24);
    background:
        linear-gradient(180deg, rgba(188, 144, 80, 0.18), rgba(255, 255, 255, 0.04)),
        var(--surface-selected);
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.2);
}

.mobile-dock-link-action {
    background: var(--text);
    color: var(--bg);
    border-color: transparent;
}

.mobile-dock-link-action .mobile-dock-meta {
    color: rgba(16, 25, 39, 0.74);
}

body.nav-open .mobile-dock,
body.command-open .mobile-dock {
    opacity: 0;
    pointer-events: none;
}

@media (min-width:1181px) {
    .mobile-dock {
        width: min(calc(100% - 2rem), 760px);
    }
}

@media (max-width:1180px) {
    .main-content {
        padding-bottom: calc(8.4rem + env(safe-area-inset-bottom, 0px));
    }
}

@media (max-width:760px) {
    .main-content {
        padding-bottom: calc(8.7rem + env(safe-area-inset-bottom, 0px));
    }

    .mobile-dock {
        width: min(calc(100% - 1rem), var(--dashboard-dock-width));
        inset: auto auto calc(0.5rem + env(safe-area-inset-bottom, 0px)) 50%;
    }
}

/* Dashboard cleanup and mobile-only dock */

.dashboard-stack-lean {
    gap: 0.95rem;
}

.dashboard-entry-panel {
    gap: 0.85rem;
}

.dashboard-entry-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.85rem;
}

.dashboard-entry-card {
    display: grid;
    gap: 0.55rem;
    padding: 1rem;
    border: 1px solid var(--panel-border);
    border-radius: 1.05rem;
    background: var(--surface-subtle);
    color: var(--text);
    text-decoration: none;
    transition:
        border-color var(--motion-quick) ease,
        background var(--motion-quick) ease,
        transform var(--motion-quick) ease;
}

.dashboard-entry-card:hover {
    border-color: rgba(188, 144, 80, 0.24);
    background: var(--surface-hover);
    transform: translateY(-1px);
}

.dashboard-entry-label {
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.dashboard-entry-card strong {
    font-size: 1rem;
    letter-spacing: -0.02em;
}

.dashboard-entry-card p {
    margin: 0;
    color: var(--muted);
    line-height: 1.45;
}

.sidebar-context {
    display: grid;
    gap: 0.2rem;
    padding: 0.9rem 0.92rem;
    border: 1px solid var(--panel-border);
    border-radius: 1rem;
    background: var(--surface-subtle);
}

.sidebar-context-kicker {
    color: var(--muted);
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.sidebar-context strong,
.sidebar-context small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sidebar-context strong {
    font-size: 1.12rem;
    letter-spacing: -0.03em;
}

.sidebar-context small {
    color: var(--muted);
    line-height: 1.45;
}

.brand-wrap {
    gap: 0.72rem;
    padding-bottom: 0.72rem;
}

.nav-section {
    gap: 0.5rem;
    padding: 0.18rem;
    background: transparent;
}

.nav-section-title {
    padding: 0.12rem 0.46rem 0;
}

.nav-link {
    padding: 0.82rem 0.9rem 0.84rem 0.98rem;
}

.nav-link-copy {
    gap: 0.12rem;
}

.nav-link-copy strong {
    font-size: 0.92rem;
}

.nav-link-copy small {
    color: var(--muted);
}

.topbar {
    gap: 0;
    padding: 0.88rem 1rem;
}

.topbar::after {
    display: none;
}

.topbar-primary {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
}

.topbar-start {
    align-items: center;
}

.topbar-title-block {
    gap: 0.12rem;
}

.topbar h2 {
    font-size: clamp(1.14rem, 1.8vw, 1.48rem);
}

.topbar-eyebrow {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--muted);
}

.topbar-date {
    color: var(--muted);
    font-size: 0.82rem;
}

.topbar-end {
    align-items: center;
}

.dashboard-hero-grid-single {
    grid-template-columns: minmax(0, 1fr);
}

.module-view .dashboard-stack {
    gap: 0.85rem;
}

.dashboard-entry-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
    margin-top: 0.1rem;
}

.dashboard-entry-preview {
    display: grid;
    gap: 0.12rem;
    padding: 0.72rem 0.78rem;
    border: 1px solid var(--panel-border);
    border-radius: 0.9rem;
    background: var(--surface-muted);
}

.dashboard-entry-preview strong {
    font-size: 0.92rem;
}

.dashboard-entry-preview small {
    color: var(--muted);
    line-height: 1.4;
}

.dashboard-entry-stat,
.dashboard-entry-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.dashboard-entry-stat {
    padding: 0.62rem 0.68rem;
    border: 1px solid var(--panel-border);
    border-radius: 0.9rem;
    background: var(--surface-muted);
}

.dashboard-entry-stat strong {
    font-size: 0.98rem;
}

.dashboard-entry-stat small,
.dashboard-entry-cta {
    color: var(--muted);
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.dashboard-entry-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin-top: 0.12rem;
}

.dashboard-entry-footer {
    margin-top: 0.12rem;
}

.dashboard-entry-card-action .badge {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.module-live-panel,
.module-support-panel {
    gap: 0.85rem;
}

.dashboard-ops-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    gap: 0.95rem;
}

.dashboard-ops-panel {
    gap: 0.85rem;
}

.dashboard-activity-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.dashboard-ops-panel .focus-list,
.dashboard-ops-panel .activity-list {
    gap: 0.7rem;
}

.dashboard-ops-panel .dashboard-record-copy {
    gap: 0.18rem;
}

.dashboard-ops-panel .dashboard-record-copy strong {
    font-size: 0.94rem;
    line-height: 1.35;
}

.dashboard-ops-panel .dashboard-row-link {
    align-items: center;
}

.module-live-panel .module-board-shell,
.module-support-panel .dashboard-command-grid {
    margin-top: 0.05rem;
}

@media (min-width:761px) {
    .mobile-dock,
    .mobile-command-sheet,
    .command-sheet-backdrop {
        display: none !important;
    }
}

/* Premium dashboard refresh */

html[data-theme="light"] {
    --bg: #ece5d9;
    --bg-soft: #f8f3eb;
    --panel: rgba(255, 250, 244, 0.82);
    --panel-strong: rgba(255, 250, 244, 0.92);
    --panel-border: rgba(102, 72, 35, 0.12);
    --gold: #8f6b34;
    --gold-soft: rgba(143, 107, 52, 0.12);
    --gold-strong: #6f4d1f;
    --text: #161a24;
    --muted: #6d7285;
    --muted-strong: #3a4256;
    --shadow-soft: 0 22px 48px rgba(71, 48, 17, 0.1);
    --shadow-strong: 0 34px 72px rgba(57, 38, 13, 0.16);
    --surface-subtle: rgba(255, 255, 255, 0.52);
    --surface-muted: rgba(255, 255, 255, 0.76);
    --surface-hover: rgba(255, 255, 255, 0.92);
    --surface-selected: rgba(229, 194, 141, 0.34);
}

body {
    background:
        radial-gradient(900px 420px at 88% -8%, rgba(214, 167, 86, 0.16), transparent 52%),
        radial-gradient(760px 420px at -10% 18%, rgba(143, 183, 255, 0.08), transparent 48%),
        linear-gradient(180deg, var(--bg-soft) 0%, var(--bg) 100%);
}

.shell-bg {
    background:
        radial-gradient(circle at 14% 2%, rgba(240, 199, 119, 0.12), transparent 24%),
        radial-gradient(circle at 100% 0%, rgba(143, 183, 255, 0.08), transparent 18%),
        radial-gradient(circle at 82% 24%, rgba(100, 214, 163, 0.06), transparent 16%);
}

html[data-theme="light"] .shell-bg {
    background:
        radial-gradient(circle at 10% 0%, rgba(181, 133, 52, 0.12), transparent 24%),
        radial-gradient(circle at 94% 6%, rgba(115, 154, 223, 0.1), transparent 18%),
        radial-gradient(circle at 84% 24%, rgba(111, 144, 101, 0.08), transparent 14%);
}

.layout {
    padding: clamp(0.95rem, 1.4vw, 1.2rem);
}

.sidebar,
.topbar,
.portal-hero,
.portal-panel {
    box-shadow: var(--shadow-soft);
}

.sidebar {
    background:
        linear-gradient(180deg, rgba(18, 24, 36, 0.88), rgba(9, 13, 20, 0.94));
    border: 1px solid rgba(214, 167, 86, 0.18);
}

html[data-theme="light"] .sidebar {
    background:
        linear-gradient(180deg, rgba(255, 252, 248, 0.92), rgba(250, 242, 231, 0.82));
    border-color: rgba(102, 72, 35, 0.12);
    box-shadow: 0 26px 52px rgba(71, 48, 17, 0.09);
}

.brand-logo {
    width: 64px;
    height: 64px;
    padding: 0.35rem;
    border-radius: 1rem;
}

.brand-title {
    font-size: 1.12rem;
}

.brand-subtitle {
    letter-spacing: 0.14em;
}

.sidebar-context,
.sidebar-venue-switcher summary,
.sidebar-venue-option,
.nav-link {
    background: rgba(255, 255, 255, 0.04);
}

html[data-theme="light"] .sidebar-context,
html[data-theme="light"] .sidebar-venue-switcher summary,
html[data-theme="light"] .sidebar-venue-option,
html[data-theme="light"] .nav-link {
    background: rgba(255, 255, 255, 0.42);
}

.nav-section {
    gap: 0.48rem;
}

.nav-link {
    min-height: 56px;
    padding: 0.82rem 0.92rem 0.86rem 1rem;
    border-radius: 1.05rem;
    transition:
        transform 0.18s ease,
        background 0.18s ease,
        border-color 0.18s ease,
        box-shadow 0.18s ease;
}

.nav-link:hover,
.nav-link.active {
    transform: translateX(4px);
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.12);
}

html[data-theme="light"] .nav-link:hover,
html[data-theme="light"] .nav-link.active {
    box-shadow: 0 16px 28px rgba(71, 48, 17, 0.08);
}

.topbar {
    margin-bottom: 0.95rem;
    padding: 1.05rem 1.15rem;
    border-radius: 1.4rem;
    background:
        linear-gradient(135deg, rgba(18, 24, 36, 0.92), rgba(11, 15, 23, 0.88));
    border: 1px solid rgba(214, 167, 86, 0.18);
}

html[data-theme="light"] .topbar {
    background:
        radial-gradient(120% 140% at 100% 0%, rgba(221, 179, 110, 0.18), transparent 38%),
        linear-gradient(135deg, rgba(255, 253, 249, 0.94), rgba(250, 243, 232, 0.9));
    border-color: rgba(102, 72, 35, 0.1);
}

.topbar-title-block {
    gap: 0.2rem;
}

.topbar h2 {
    font-size: clamp(1.28rem, 1.95vw, 1.72rem);
}

.portal-hero {
    gap: 1rem;
    padding: clamp(1.15rem, 1.85vw, 1.35rem);
    border-radius: 1.45rem;
    background:
        radial-gradient(120% 140% at 100% 0%, rgba(240, 199, 119, 0.14), transparent 34%),
        linear-gradient(145deg, rgba(22, 29, 43, 0.96), rgba(9, 13, 20, 0.94));
    border: 1px solid rgba(214, 167, 86, 0.2);
}

html[data-theme="light"] .portal-hero,
html[data-theme="light"] .portal-panel {
    background:
        radial-gradient(120% 140% at 100% 0%, rgba(221, 179, 110, 0.16), transparent 38%),
        linear-gradient(145deg, rgba(255, 252, 247, 0.94), rgba(250, 242, 229, 0.9));
}

.dashboard-hero-premium .attention-rail {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.dashboard-hero-grid-premium {
    grid-template-columns: minmax(0, 1.08fr) minmax(340px, 0.92fr);
    align-items: stretch;
}

.dashboard-hero-copy {
    gap: 1rem;
}

.dashboard-hero-action-rail {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 0.82rem;
}

.dashboard-view-staff .dashboard-hero-action-rail {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.72rem;
}

.dashboard-view-staff .dashboard-hero-action-rail .dashboard-hero-action-chip:last-child {
    grid-column: 1 / -1;
}

.dashboard-view-staff .dashboard-hero-copy {
    gap: 0.88rem;
}

.dashboard-view-staff .dashboard-hero-action-chip {
    padding: 0.9rem 0.94rem;
}

.dashboard-view-staff .dashboard-hero-action-chip strong {
    font-size: 0.94rem;
}

.dashboard-view-staff .dashboard-hero-action-chip small {
    font-size: 0.76rem;
}

.dashboard-hero-action-chip {
    display: grid;
    gap: 0.28rem;
    padding: 1rem 1.02rem;
    border: 1px solid rgba(214, 167, 86, 0.18);
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.04);
    color: inherit;
    text-decoration: none;
    transition:
        transform 0.18s ease,
        background 0.18s ease,
        border-color 0.18s ease,
        box-shadow 0.18s ease;
}

.dashboard-hero-action-chip:hover {
    transform: translateY(-2px);
    border-color: rgba(240, 199, 119, 0.34);
    background: rgba(255, 255, 255, 0.07);
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.16);
}

html[data-theme="light"] .dashboard-hero-action-chip {
    background: rgba(255, 255, 255, 0.52);
    border-color: rgba(102, 72, 35, 0.1);
}

html[data-theme="light"] .dashboard-hero-action-chip:hover {
    background: rgba(255, 255, 255, 0.78);
    box-shadow: 0 18px 32px rgba(71, 48, 17, 0.08);
}

.dashboard-hero-action-label {
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.dashboard-hero-action-chip strong {
    font-size: 0.98rem;
    line-height: 1.28;
}

.dashboard-hero-action-chip small {
    color: var(--muted);
    line-height: 1.4;
}

.dashboard-hero-aside-premium {
    display: grid;
    gap: 0.82rem;
}

.dashboard-hero-spotlight {
    display: grid;
    gap: 0.72rem;
    padding: 1.05rem 1.1rem;
    border-radius: 1.25rem;
    border: 1px solid rgba(240, 199, 119, 0.2);
    background:
        radial-gradient(120% 140% at 100% 0%, rgba(240, 199, 119, 0.18), transparent 36%),
        linear-gradient(160deg, rgba(20, 28, 42, 0.98), rgba(10, 14, 22, 0.96));
    box-shadow: 0 22px 44px rgba(0, 0, 0, 0.24);
}

html[data-theme="light"] .dashboard-hero-spotlight {
    color: #f6f1e8;
    border-color: rgba(221, 179, 110, 0.18);
    background:
        radial-gradient(120% 140% at 100% 0%, rgba(240, 199, 119, 0.18), transparent 36%),
        linear-gradient(160deg, rgba(33, 43, 61, 0.98), rgba(79, 50, 20, 0.94));
    box-shadow: 0 26px 48px rgba(52, 35, 12, 0.18);
}

.dashboard-hero-spotlight-head,
.dashboard-signal-card-head,
.dashboard-entry-kicker {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
}

.dashboard-hero-spotlight-value {
    font-size: clamp(2rem, 4vw, 2.7rem);
    line-height: 0.98;
    letter-spacing: -0.05em;
}

.dashboard-hero-spotlight-copy {
    margin: 0;
    color: rgba(246, 241, 232, 0.76);
    font-size: 0.95rem;
    line-height: 1.5;
}

.dashboard-hero-spotlight-trend {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    min-height: 30px;
    padding: 0.35rem 0.7rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    color: rgba(246, 241, 232, 0.84);
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.dashboard-hero-spotlight-trend-up {
    color: #9ce4bf;
}

.dashboard-hero-spotlight-trend-down {
    color: #ffb7bf;
}

.dashboard-hero-spotlight-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.58rem;
}

.dashboard-hero-spotlight .quick-action-link {
    background: rgba(255, 255, 255, 0.08);
    color: #f6f1e8;
    border-color: rgba(255, 255, 255, 0.1);
}

.dashboard-hero-spotlight .quick-action-link:hover {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(240, 199, 119, 0.24);
}

.dashboard-signal-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.dashboard-view-staff .dashboard-signal-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dashboard-view-staff .dashboard-signal-grid .dashboard-signal-card:last-child {
    grid-column: 1 / -1;
}

.dashboard-view-staff .dashboard-signal-card {
    gap: 0.42rem;
    padding: 0.92rem 0.95rem;
}

.dashboard-view-staff .dashboard-signal-card p {
    line-height: 1.45;
}

.dashboard-view-management .dashboard-signal-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dashboard-signal-card {
    display: grid;
    gap: 0.5rem;
    padding: 0.98rem 1rem;
    border: 1px solid var(--panel-border);
    border-radius: 1.05rem;
    background: var(--surface-subtle);
}

.dashboard-signal-card strong {
    font-size: 1.26rem;
    line-height: 1.05;
    letter-spacing: -0.04em;
}

.dashboard-signal-card p {
    margin: 0;
    color: var(--muted);
    font-size: 0.84rem;
    line-height: 1.55;
}

.dashboard-entry-grid-premium {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.08rem;
}

.dashboard-view-staff .dashboard-entry-panel {
    gap: 0.76rem;
}

.dashboard-view-staff .dashboard-entry-grid-premium {
    gap: 0.94rem;
}

.dashboard-entry-card-premium {
    gap: 1rem;
    padding: 1.18rem;
    border-radius: 1.2rem;
    border: 1px solid var(--panel-border);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02));
    box-shadow: none;
}

html[data-theme="light"] .dashboard-entry-card-premium {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.74), rgba(255, 255, 255, 0.46));
}

.dashboard-view-staff .dashboard-entry-card-premium {
    gap: 0.84rem;
    padding: 1.05rem;
}

.dashboard-entry-card-link {
    display: grid;
    gap: 0.6rem;
    color: inherit;
    text-decoration: none;
}

.dashboard-view-staff .dashboard-entry-card-link {
    gap: 0.48rem;
}

.dashboard-view-staff .dashboard-entry-card-premium > .dashboard-entry-card-link strong {
    font-size: 1.04rem;
}

.dashboard-view-staff .dashboard-entry-card-premium > .dashboard-entry-card-link p {
    line-height: 1.46;
}

.dashboard-entry-card-premium > .dashboard-entry-card-link strong {
    font-size: 1.12rem;
    line-height: 1.2;
}

.dashboard-entry-card-premium > .dashboard-entry-card-link p {
    margin: 0;
    line-height: 1.55;
}

.dashboard-entry-card-premium .dashboard-entry-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.72rem;
}

.dashboard-view-staff .dashboard-entry-card-premium .dashboard-entry-stats {
    gap: 0.58rem;
}

.dashboard-entry-card-premium .dashboard-entry-stat {
    display: grid;
    justify-content: flex-start;
    gap: 0.18rem;
    min-height: 82px;
    padding: 0.82rem 0.84rem;
}

.dashboard-view-staff .dashboard-entry-card-premium .dashboard-entry-stat {
    min-height: 72px;
    padding: 0.72rem 0.76rem;
}

.dashboard-entry-card-premium .dashboard-entry-stat strong {
    font-size: 1.08rem;
    line-height: 1.08;
}

.dashboard-entry-card-premium .dashboard-entry-stat small {
    font-size: 0.72rem;
    line-height: 1.35;
}

.dashboard-entry-preview-list {
    display: grid;
    gap: 0.68rem;
}

.dashboard-entry-preview-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.92rem 0.98rem;
    border: 1px solid var(--panel-border);
    border-radius: 0.98rem;
    background: var(--surface-subtle);
    color: inherit;
    text-decoration: none;
    transition:
        border-color 0.18s ease,
        background 0.18s ease,
        transform 0.18s ease;
}

.dashboard-view-staff .dashboard-entry-preview-row {
    padding: 0.82rem 0.88rem;
}

.dashboard-entry-preview-row:hover {
    transform: translateY(-1px);
    border-color: rgba(214, 167, 86, 0.24);
    background: var(--surface-hover);
}

.dashboard-entry-preview-copy {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
}

.dashboard-entry-preview-copy strong {
    font-size: 0.94rem;
    line-height: 1.3;
}

.dashboard-entry-preview-copy small {
    color: var(--muted);
    line-height: 1.45;
}

.dashboard-entry-empty {
    margin: 0;
    padding: 0.88rem 0.92rem;
    border: 1px dashed var(--panel-border);
    border-radius: 0.98rem;
    background: var(--surface-subtle);
}

.dashboard-entry-actions {
    margin-top: auto;
    align-items: center;
}

.dashboard-view-staff .dashboard-entry-actions {
    gap: 0.48rem;
}

.dashboard-ops-panel .panel-header {
    align-items: center;
}

.focus-list,
.activity-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.focus-list li,
.activity-list li {
    position: relative;
    padding: 0.98rem 1.04rem 0.98rem 1.14rem;
    border-radius: 1rem;
    overflow: hidden;
}

.focus-list li::before,
.activity-list li::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: linear-gradient(180deg, rgba(240, 199, 119, 0.9), rgba(143, 183, 255, 0.72));
}

.dashboard-row-link {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.8rem;
    color: inherit;
    text-decoration: none;
}

.dashboard-record-copy {
    min-width: 0;
}

.attention-card {
    min-height: 100%;
}

.attention-card-head strong {
    font-size: 1.04rem;
}

@media (max-width: 1180px) {
    .dashboard-hero-grid-premium,
    .dashboard-ops-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-signal-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .layout {
        padding: 0.72rem;
    }

    .topbar,
    .portal-hero,
    .portal-panel,
    .dashboard-entry-card-premium {
        border-radius: 1.18rem;
    }

    .dashboard-hero-action-rail,
    .dashboard-signal-grid,
    .dashboard-entry-grid-premium {
        grid-template-columns: 1fr;
    }

    .dashboard-entry-card-premium .dashboard-entry-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-entry-preview-row,
    .dashboard-row-link {
        flex-direction: column;
        align-items: flex-start;
    }

    .dashboard-entry-preview-row .badge,
    .dashboard-row-link .filter-chip {
        align-self: flex-start;
    }
}

@media (max-width:760px) {
    .brand-wrap {
        gap: 0.65rem;
    }

    .mobile-dock {
        display: grid !important;
    }

    .topbar {
        gap: 0.72rem;
    }

    .topbar-primary {
        grid-template-columns: 1fr;
    }

    .dashboard-entry-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-ops-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-entry-stats {
        grid-template-columns: 1fr;
    }
}

/* Premium mobile dock refinement */

@media (max-width:760px) {
    .main-content {
        padding-bottom: calc(9.4rem + env(safe-area-inset-bottom, 0px));
    }

    .mobile-dock {
        inset: auto 0 calc(0.65rem + env(safe-area-inset-bottom, 0px)) 0;
        width: min(
            calc(100vw - 1rem - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px)),
            34.5rem
        );
        margin-inline: auto;
        padding: 0.38rem;
        gap: 0.32rem;
        border-radius: 1.6rem;
        overflow: hidden;
        isolation: isolate;
        border: 1px solid rgba(214, 167, 86, 0.18);
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.06), transparent 24%),
            linear-gradient(135deg, rgba(240, 199, 119, 0.18), rgba(143, 183, 255, 0.08) 58%, rgba(8, 12, 18, 0.08)),
            rgba(8, 12, 18, 0.9);
        box-shadow:
            0 24px 60px rgba(0, 0, 0, 0.38),
            inset 0 1px 0 rgba(255, 255, 255, 0.06);
        backdrop-filter: blur(26px) saturate(150%);
        -webkit-backdrop-filter: blur(26px) saturate(150%);
        transform: none;
    }

    .mobile-dock::before {
        display: block;
        inset: 0.55rem 18% auto;
        width: auto;
        height: 1px;
        transform: none;
        background: linear-gradient(
            90deg,
            rgba(240, 199, 119, 0),
            rgba(240, 199, 119, 0.8),
            rgba(143, 183, 255, 0.38),
            rgba(240, 199, 119, 0)
        );
        opacity: 0.9;
    }

    .mobile-dock::after {
        content: "";
        display: block;
        position: absolute;
        inset: auto 14% -42% 14%;
        height: 68%;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(240, 199, 119, 0.18), rgba(240, 199, 119, 0));
        filter: blur(18px);
        pointer-events: none;
    }

    .mobile-dock-link {
        position: relative;
        display: grid;
        align-content: center;
        justify-items: center;
        min-height: 4.1rem;
        padding: 0.74rem 0.2rem 0.6rem;
        gap: 0.12rem;
        border-radius: 1.2rem;
        border: 1px solid transparent;
        background: linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0));
        color: var(--muted-strong);
        overflow: hidden;
        transition:
            transform 0.18s ease,
            border-color 0.18s ease,
            background 0.18s ease,
            color 0.18s ease,
            box-shadow 0.18s ease;
    }

    .mobile-dock-link::before {
        content: "";
        position: absolute;
        inset: 0;
        border-radius: inherit;
        background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0));
        opacity: 0;
        transition: opacity 0.18s ease;
    }

    .mobile-dock-link::after {
        display: none;
    }

    .mobile-dock-label {
        position: relative;
        z-index: 1;
        font-size: 0.68rem;
        font-weight: 800;
        letter-spacing: 0.14em;
    }

    .mobile-dock-meta {
        display: none;
    }

    .mobile-dock-link:hover,
    .mobile-dock-link:focus-visible {
        transform: translateY(-1px);
        color: var(--text);
        background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02));
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
    }

    .mobile-dock-link:hover::before,
    .mobile-dock-link:focus-visible::before {
        opacity: 1;
    }

    .mobile-dock-link.active {
        color: var(--text);
        border-color: rgba(240, 199, 119, 0.24);
        background:
            linear-gradient(180deg, rgba(240, 199, 119, 0.22), rgba(255, 255, 255, 0.06)),
            rgba(28, 34, 48, 0.92);
        box-shadow:
            0 18px 32px rgba(0, 0, 0, 0.26),
            inset 0 1px 0 rgba(255, 255, 255, 0.12);
        transform: translateY(-2px);
    }

    .mobile-dock-link.active::before {
        opacity: 1;
    }

    .mobile-dock-link.active .mobile-dock-label::after {
        content: "";
        display: block;
        width: 1.75rem;
        height: 3px;
        margin: 0.38rem auto 0;
        border-radius: 999px;
        background: linear-gradient(90deg, rgba(240, 199, 119, 0.96), rgba(143, 183, 255, 0.62));
    }

    .mobile-dock-link-action {
        color: #151a22;
        border-color: rgba(240, 199, 119, 0.18);
        background: linear-gradient(135deg, #f2d39a, #d8a85b 55%, #b97a24);
        box-shadow:
            0 16px 28px rgba(188, 144, 80, 0.3),
            inset 0 1px 0 rgba(255, 255, 255, 0.42);
    }

    .mobile-dock-link-action:hover,
    .mobile-dock-link-action:focus-visible {
        color: #101927;
        background: linear-gradient(135deg, #f6ddb0, #d49943 58%, #ad6f1c);
    }

    .mobile-command-sheet {
        inset: auto 0 calc(5.75rem + env(safe-area-inset-bottom, 0px)) 0;
        width: min(
            calc(100vw - 1rem - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px)),
            34.5rem
        );
        margin-inline: auto;
        padding: 1rem 0.95rem calc(1rem + env(safe-area-inset-bottom, 0px));
        border-radius: 1.55rem;
        border: 1px solid rgba(214, 167, 86, 0.18);
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.06), transparent 20%),
            linear-gradient(135deg, rgba(240, 199, 119, 0.16), rgba(143, 183, 255, 0.06) 58%, rgba(8, 12, 18, 0.08)),
            rgba(10, 14, 22, 0.96);
        box-shadow: 0 30px 70px rgba(0, 0, 0, 0.42);
        backdrop-filter: blur(28px) saturate(145%);
        -webkit-backdrop-filter: blur(28px) saturate(145%);
        transform: translateY(calc(100% + 1rem));
    }

    .mobile-command-sheet[aria-hidden="false"],
    body.command-open .mobile-command-sheet {
        transform: translateY(0);
    }

    .mobile-command-head {
        align-items: flex-start;
    }

    .mobile-command-copy {
        max-width: 24rem;
    }

    .mobile-command-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.55rem;
    }

    .mobile-command-link {
        min-height: 4.45rem;
        padding: 0.88rem 0.92rem;
        border-radius: 1.05rem;
        background: rgba(255, 255, 255, 0.04);
    }

    .mobile-command-link strong {
        display: block;
        margin-bottom: 0.14rem;
    }

    .command-sheet-backdrop {
        background: rgba(5, 7, 11, 0.32);
        backdrop-filter: blur(6px);
        -webkit-backdrop-filter: blur(6px);
    }

    body.nav-open .mobile-dock,
    body.command-open .mobile-dock {
        opacity: 0;
        pointer-events: none;
        transform: translateY(14px) scale(0.98);
    }

    html[data-theme="light"] .mobile-dock {
        border-color: rgba(102, 72, 35, 0.14);
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.72), transparent 22%),
            linear-gradient(135deg, rgba(214, 167, 86, 0.18), rgba(115, 154, 223, 0.08) 58%, rgba(255, 255, 255, 0.18)),
            rgba(250, 244, 235, 0.92);
        box-shadow:
            0 24px 52px rgba(71, 48, 17, 0.16),
            inset 0 1px 0 rgba(255, 255, 255, 0.72);
    }

    html[data-theme="light"] .mobile-dock-link {
        color: #5e6475;
    }

    html[data-theme="light"] .mobile-dock-link.active {
        background:
            linear-gradient(180deg, rgba(214, 167, 86, 0.22), rgba(255, 255, 255, 0.72)),
            rgba(255, 255, 255, 0.74);
        box-shadow:
            0 18px 34px rgba(71, 48, 17, 0.12),
            inset 0 1px 0 rgba(255, 255, 255, 0.84);
    }

    html[data-theme="light"] .mobile-command-sheet {
        border-color: rgba(102, 72, 35, 0.14);
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.88), transparent 18%),
            linear-gradient(135deg, rgba(214, 167, 86, 0.16), rgba(115, 154, 223, 0.08) 58%, rgba(255, 255, 255, 0.18)),
            rgba(248, 243, 235, 0.98);
        box-shadow: 0 30px 60px rgba(71, 48, 17, 0.14);
    }

    html[data-theme="light"] .mobile-command-link {
        background: rgba(255, 255, 255, 0.6);
    }
}

@media (max-width:520px) {
    .mobile-dock {
        width: min(
            calc(100vw - 0.75rem - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px)),
            32rem
        );
        padding: 0.34rem;
        gap: 0.28rem;
        border-radius: 1.45rem;
    }

    .mobile-dock-link {
        min-height: 3.95rem;
        padding: 0.7rem 0.14rem 0.56rem;
    }

    .mobile-dock-label {
        font-size: 0.64rem;
        letter-spacing: 0.12em;
    }

    .mobile-command-sheet {
        inset: auto 0 calc(5.55rem + env(safe-area-inset-bottom, 0px)) 0;
        width: min(
            calc(100vw - 0.75rem - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px)),
            32rem
        );
    }
}

@media (max-width:420px) {
    .mobile-command-grid {
        grid-template-columns: 1fr;
    }
}

/* Public-ready state patterns */

.action-btn.is-working,
.login-submit-btn.is-working,
.topbar-switch-btn.is-working {
    opacity: 0.78;
    cursor: wait;
}

.form-state-panel {
    display: grid;
    gap: 0.55rem;
    padding: 0.92rem 1rem;
    border-radius: 1rem;
    border: 1px solid var(--panel-border);
    background: rgba(255, 255, 255, 0.04);
}

.form-state-panel-error,
.form-errors {
    border-color: rgba(255, 111, 125, 0.26);
    background: linear-gradient(180deg, rgba(255, 111, 125, 0.12), rgba(255, 255, 255, 0.03));
    color: var(--danger);
}

.form-errors {
    display: grid;
    gap: 0.35rem;
    padding: 0.88rem 0.95rem;
    border-radius: 1rem;
}

.field-error {
    display: block;
    color: var(--danger);
    font-size: 0.86rem;
    font-weight: 700;
}

.form-state-head {
    display: grid;
    gap: 0.14rem;
}

.form-state-head strong {
    color: var(--text);
    font-size: 0.96rem;
}

.form-state-head span,
.form-state-copy {
    color: var(--muted-strong);
    font-size: 0.84rem;
    line-height: 1.45;
}

.form-state-list {
    display: grid;
    gap: 0.32rem;
    margin: 0;
    padding-left: 1rem;
}

.form-state-list li {
    color: var(--text);
    line-height: 1.45;
}

.message,
.empty-state,
.settings-status {
    position: relative;
    padding: 0.92rem 1rem;
    border-radius: 1rem;
    border: 1px solid var(--panel-border);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.03));
    color: var(--muted-strong);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
    overflow: hidden;
}

.message::before,
.empty-state::before,
.settings-status::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    border-radius: 999px;
    background: rgba(214, 167, 86, 0.45);
}

.message-success::before {
    background: rgba(100, 214, 163, 0.86);
}

.message-error::before,
.message-danger::before {
    background: rgba(255, 111, 125, 0.86);
}

.message-warning::before {
    background: rgba(240, 199, 119, 0.9);
}

.message-info::before {
    background: rgba(143, 183, 255, 0.9);
}

.empty-state {
    min-height: 6.4rem;
    align-content: center;
    border-style: dashed;
    background:
        radial-gradient(circle at top right, rgba(214, 167, 86, 0.08), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.025));
    line-height: 1.55;
}

.stock-edit-form .form-grid > .form-field.has-error,
.stock-edit-form .order-item-row .form-field.has-error {
    border-color: rgba(255, 111, 125, 0.28);
    background: linear-gradient(180deg, rgba(255, 111, 125, 0.08), rgba(255, 255, 255, 0.03));
}

.stock-edit-form .form-grid > .form-field.has-error:focus-within,
.stock-edit-form .order-item-row .form-field.has-error:focus-within {
    border-color: rgba(255, 111, 125, 0.42);
}

.stock-edit-form.is-submitting,
.delete-form.is-submitting,
.login-card form.is-submitting {
    opacity: 0.84;
}

.stock-edit-form.is-submitting .form-actions,
.delete-form.is-submitting,
.login-card form.is-submitting {
    pointer-events: none;
}

html[data-theme="light"] .form-state-panel,
html[data-theme="light"] .message,
html[data-theme="light"] .empty-state,
html[data-theme="light"] .settings-status {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6);
}

html[data-theme="light"] .form-state-panel-error,
html[data-theme="light"] .form-errors {
    background: linear-gradient(180deg, rgba(183, 54, 76, 0.08), rgba(255, 255, 255, 0.78));
}