:root { --ink:#17212f; --muted:#677487; --line:#e5eaf0; --page:#f6f8fb; --panel:#fff; --brand:#0f766e; --brand-soft:#e8f5f3; --warning:#b45309; --danger:#b42318; --radius:12px; font-family:"Microsoft YaHei", "PingFang SC", system-ui, sans-serif; color:var(--ink); }
*{box-sizing:border-box} body{margin:0;background:var(--page);font-size:14px}.sidebar{position:fixed;inset:0 auto 0 0;width:244px;background:#132c3a;color:#dce6eb;display:flex;flex-direction:column;padding:22px 14px;overflow-y:auto}.brand{height:50px;display:flex;align-items:center;gap:9px;font-size:18px;font-weight:700;padding:0 10px;flex:none}.brand-mark{display:grid;place-items:center;width:28px;height:28px;background:#3ab4a7;border-radius:8px;color:#12313d}.brand small{font-size:10px;color:#77cfc5;border:1px solid #397d78;border-radius:4px;padding:2px 4px}nav{margin-top:24px;padding-bottom:18px}nav p{font-size:11px;color:#819ca8;margin:22px 10px 8px;letter-spacing:.08em}.nav-item{width:100%;border:0;background:transparent;color:#c5d4da;text-align:left;border-radius:8px;padding:11px 12px;font:inherit;cursor:pointer;display:flex;gap:12px;align-items:center}.nav-item span:first-child{width:16px;text-align:center;font-size:16px}.nav-parent span:nth-child(2){flex:1;text-align:left}.nav-parent b{font-size:13px;color:#88a5af;transition:transform .18s}.nav-parent.is-open b{transform:rotate(180deg)}.nav-item:hover,.nav-item.is-active{background:#1e4657;color:white}.nav-item.is-active{box-shadow:inset 3px 0 #5dd2c2}.nav-subnav{display:none;padding:4px 0 6px 34px}.nav-subnav.open{display:grid;gap:2px}.nav-subitem{width:100%;border:0;background:transparent;color:#9eb4bc;text-align:left;border-radius:6px;padding:8px 10px;font:inherit;font-size:12px;cursor:pointer}.nav-subitem:hover,.nav-subitem.active{background:#1a3d4d;color:#fff}.nav-subitem.active{box-shadow:inset 2px 0 #5dd2c2}.user{margin-top:auto;border-top:1px solid #285060;padding:18px 10px 4px;display:flex;gap:10px;align-items:center;flex:none}.user small{display:block;color:#8aa3ae;margin-top:4px;font-size:11px}.avatar{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:#d6a458;color:#fff}main{margin-left:244px;min-height:100vh}header{height:88px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 34px}.crumb{color:var(--muted);font-size:12px;margin:0 0 5px}h1{font-size:22px;margin:0;letter-spacing:-.02em}.header-actions{display:flex;align-items:center;gap:12px}.date{color:var(--muted);font-size:13px}.primary,.secondary,.icon-button{border-radius:8px;border:1px solid transparent;padding:9px 14px;font:inherit;font-weight:600;cursor:pointer;white-space:nowrap}.primary{background:var(--brand);color:#fff}.primary:hover{background:#0b625c}.primary:active,.secondary:active{transform:translateY(1px)}.secondary,.icon-button{background:#fff;border-color:#d5dde5;color:#314155}.icon-button{padding:8px 10px;font-size:17px}#app{padding:28px 34px}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.metric{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:18px;min-height:123px}.metric-label{color:var(--muted);font-size:13px}.metric-value{font-size:27px;font-weight:700;letter-spacing:-.04em;margin:14px 0 10px}.metric-note{font-size:12px;color:var(--brand)}.metric-note.warn{color:var(--warning)}.content-grid{display:grid;grid-template-columns:1.35fr .9fr;gap:18px;margin-top:18px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:20px}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}.panel h2{font-size:16px;margin:0}.panel-head button{font-size:12px}.bar-list{display:grid;gap:16px}.bar-row{display:grid;grid-template-columns:105px 1fr 40px;gap:12px;align-items:center}.bar-row span:first-child{font-size:13px}.bar{height:8px;background:#edf2f5;border-radius:8px;overflow:hidden}.bar i{display:block;height:100%;background:var(--brand);border-radius:inherit}.bar-row b{font-size:12px;text-align:right}.alert{display:flex;align-items:flex-start;gap:12px;border-bottom:1px solid var(--line);padding:14px 0}.alert:last-child{border:0}.alert-icon{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#fff4e5;color:var(--warning);font-weight:bold}.alert strong,.alert span{display:block}.alert span{font-size:12px;color:var(--muted);margin-top:4px}.section-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.section-head h2{margin:0;font-size:17px}.toolbar{display:flex;gap:10px}.table-wrap{overflow:auto;background:#fff;border:1px solid var(--line);border-radius:var(--radius)}table{border-collapse:collapse;width:100%;min-width:770px}th,td{text-align:left;padding:14px 16px;border-bottom:1px solid var(--line)}th{font-size:12px;color:var(--muted);font-weight:600;background:#fbfcfd}tr:last-child td{border-bottom:0}td{font-size:13px}.tag{display:inline-block;border-radius:99px;padding:4px 8px;font-size:12px;font-weight:600}.tag.green{color:#087269;background:#e6f6f3}.tag.yellow{color:#9a5b00;background:#fff5dd}.tag.gray{color:#59677a;background:#eef1f4}.status-dot{display:inline-block;width:7px;height:7px;background:#e0922f;border-radius:50%;margin-right:5px}.action-link{border:0;background:transparent;color:var(--brand);cursor:pointer;font:inherit;font-weight:600;padding:0}.empty{background:#fff;border:1px dashed #cbd5df;border-radius:var(--radius);padding:48px;text-align:center;color:var(--muted)}.custom-list{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.field-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:17px}.field-card small{display:block;color:var(--muted);margin-top:8px}.field-icon{display:grid;place-items:center;width:32px;height:32px;background:var(--brand-soft);color:var(--brand);font-weight:700;border-radius:8px;margin-bottom:14px}dialog{width:min(520px,calc(100% - 32px));border:0;border-radius:14px;padding:0;box-shadow:0 18px 60px #17304340}dialog::backdrop{background:#132c3a70}#modal-form{padding:22px}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.modal-header h2{font-size:18px;margin:0}.close{font-size:25px;line-height:1;border:0;background:transparent;cursor:pointer;color:var(--muted)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.form-grid label{display:grid;gap:7px;font-size:13px;font-weight:600}.form-grid label.full{grid-column:1/-1}input,select,textarea{border:1px solid #cbd5df;border-radius:8px;padding:10px;background:#fff;font:inherit;color:var(--ink)}input:focus,select:focus,textarea:focus{outline:3px solid #bce8e2;border-color:var(--brand)}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:24px}#toast{position:fixed;right:26px;bottom:25px;background:#173d4a;color:white;border-radius:8px;padding:12px 16px;box-shadow:0 8px 24px #17304330;opacity:0;transform:translateY(10px);pointer-events:none;transition:.2s}#toast.show{opacity:1;transform:translateY(0)}
@media(max-width:960px){.sidebar{width:64px;padding:18px 8px}.brand{padding:0;justify-content:center}.brand>span:not(.brand-mark),.brand small,.nav-item:not(.active)::after,.nav-item{font-size:0}.nav-item{justify-content:center;padding:12px}.nav-item span{font-size:17px}.nav-parent span:nth-child(2),.nav-parent b,.nav-subnav{display:none!important}.user{padding:12px 8px}.user>div:not(.avatar){display:none}main{margin-left:64px}header{padding:0 18px}.metric-grid{grid-template-columns:repeat(2,1fr)}.content-grid{grid-template-columns:1fr}#app{padding:20px}}
@media(max-width:620px){header{height:auto;padding:15px 18px;align-items:flex-start;gap:12px}.header-actions .date,.header-actions .icon-button{display:none}.metric-grid{grid-template-columns:1fr}.form-grid,.custom-list{grid-template-columns:1fr}#app{padding:16px}.primary{padding:9px 10px}.section-head{align-items:flex-start;gap:12px;flex-direction:column}}
.account{border:0;background:var(--brand-soft);color:#0e615a;border-radius:8px;padding:8px 10px;font:inherit;font-weight:600;cursor:pointer}.login-screen{position:fixed;inset:0;z-index:10;display:grid;place-items:center;background:#eef3f6}.login-screen.hidden{display:none}.login-card{width:min(400px,calc(100% - 32px));background:#fff;border:1px solid var(--line);border-radius:16px;padding:32px;box-shadow:0 18px 60px #1730431a;display:grid;gap:15px}.login-logo{display:flex;gap:10px;align-items:center}.login-logo small{display:block;color:var(--muted);font-size:12px;margin-top:3px}.login-card h2{margin:15px 0 -7px;font-size:22px}.login-card p{color:var(--muted);margin:0}.login-card label{display:grid;gap:7px;font-weight:600}.login-card .primary{margin-top:6px}.login-card>small{color:var(--muted);text-align:center}.login-error{color:var(--danger)!important;min-height:18px;font-size:12px}

/* Navigation refinement: a quiet, high-contrast tree for dense ERP work. */
:root{--sidebar:#102a36;--sidebar-deep:#0d222d;--sidebar-line:#285363;--sidebar-muted:#8ea9b3;--sidebar-text:#d9e6ea;--sidebar-accent:#5dd2c2;--sidebar-accent-soft:#173f4c}
body{background:#f2f5f7;color:#17212f}
.sidebar{width:272px;padding:20px 16px 14px;background:linear-gradient(180deg,var(--sidebar) 0%,var(--sidebar-deep) 100%);box-shadow:10px 0 28px rgba(18,45,58,.08)}
.brand{height:auto;min-height:60px;padding:0 10px 16px;margin-bottom:8px;border-bottom:1px solid rgba(104,170,180,.2);gap:10px;letter-spacing:.01em}
.brand-mark{width:30px;height:30px;border-radius:9px;background:var(--sidebar-accent);box-shadow:0 0 0 4px rgba(93,210,194,.1);font-size:15px}
nav{margin-top:8px;padding-bottom:18px;display:grid;gap:3px}
nav p{margin:20px 10px 7px;color:#76939e;font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.nav-parent{min-height:48px;padding:9px 10px;border:1px solid transparent;border-radius:10px;gap:10px;color:var(--sidebar-muted);transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease}
.nav-parent span:first-child{width:30px;height:30px;display:grid;place-items:center;border-radius:8px;background:rgba(111,174,184,.1);color:#a7c4cc;font-size:15px;transition:background .18s ease,color .18s ease}
.nav-parent span:nth-child(2){font-size:13px;font-weight:650;letter-spacing:.01em}
.nav-parent b{font-size:12px;color:#6f8d98}
.nav-parent:hover{background:rgba(52,105,119,.25);color:#eff8f8}
.nav-parent:hover span:first-child{background:rgba(93,210,194,.16);color:var(--sidebar-accent)}
.nav-parent.is-active{background:var(--sidebar-accent-soft);border-color:rgba(93,210,194,.24);color:#f4fbfa;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.nav-parent.is-active span:first-child{background:var(--sidebar-accent);color:#12313d;box-shadow:0 5px 14px rgba(93,210,194,.14)}
.nav-parent.is-active b{color:var(--sidebar-accent)}
.nav-subnav{display:grid;gap:2px;max-height:0;overflow:hidden;opacity:0;margin-left:18px;padding:0 0 0 22px;border-left:1px solid var(--sidebar-line);transition:max-height .22s ease,opacity .18s ease,padding .22s ease}
.nav-subnav.open{max-height:900px;opacity:1;padding-bottom:7px}
.nav-subitem{position:relative;padding:8px 11px;border-radius:7px;color:#96afb7;font-size:12px;line-height:1.25;transition:background .18s ease,color .18s ease,transform .18s ease}
.nav-subitem:hover{background:rgba(57,111,123,.2);color:#eef8f8;transform:translateX(2px)}
.nav-subitem.active{background:rgba(93,210,194,.12);color:#b8f1e9;font-weight:650}
.nav-subitem.active::before{content:"";position:absolute;left:-23px;top:8px;width:2px;height:17px;border-radius:2px;background:var(--sidebar-accent)}
.nav-item:focus-visible,.nav-subitem:focus-visible{outline:2px solid var(--sidebar-accent);outline-offset:2px}
.user{border-top-color:rgba(104,170,180,.2);padding:16px 10px 4px}
.user small{color:#88a7b1}
main{margin-left:272px}
header{height:82px;padding:0 40px;background:rgba(255,255,255,.94);box-shadow:0 1px 0 rgba(27,57,70,.03)}
h1{font-size:23px;font-weight:750;letter-spacing:-.035em}
#app{padding:32px 40px}
.section-head{align-items:flex-end;padding-bottom:19px;margin-bottom:22px;border-bottom:1px solid #dfe7eb}
.section-head h2{font-size:22px;font-weight:750;letter-spacing:-.03em}
.section-head .crumb{max-width:680px;line-height:1.55}
.panel,.metric{box-shadow:0 8px 24px rgba(27,57,70,.035)}
.panel{padding:22px}
.table-wrap{box-shadow:0 4px 14px rgba(27,57,70,.025)}
@keyframes page-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
#app>.section-head,#app>.metric-grid,#app>.content-grid,#app>.panel,#app>.custom-list{animation:page-in .24s ease-out both}
@media(prefers-reduced-motion:reduce){.nav-parent,.nav-subitem,.nav-subnav,#app>.section-head,#app>.metric-grid,#app>.content-grid,#app>.panel,#app>.custom-list{transition:none;animation:none}}
@media(max-width:960px){.sidebar{width:64px;padding:18px 8px;box-shadow:none}main{margin-left:64px}header{padding:0 18px}#app{padding:24px 20px}.brand{padding:0;min-height:40px;margin:0;border:0}.brand-mark{width:30px;height:30px}.user{padding:12px 8px}}
@media(max-width:620px){header{height:auto;padding:15px 18px}.section-head{align-items:flex-start;padding-bottom:16px}.section-head h2{font-size:20px}#app{padding:20px 16px}.panel{padding:17px}}

/* Company-wide theme tokens. The selected theme is stored server-side. */
:root{--brand-hover:#0b625c;--focus-ring:#bce8e2;--sidebar-accent-rgb:93,210,194;--sidebar-accent-contrast:#12313d;--sidebar-accent-text:#b8f1e9}
:root[data-theme="ocean"]{--brand:#0f766e;--brand-hover:#0b625c;--brand-soft:#e8f5f3;--focus-ring:#bce8e2;--sidebar:#102a36;--sidebar-deep:#0d222d;--sidebar-line:#285363;--sidebar-muted:#8ea9b3;--sidebar-text:#d9e6ea;--sidebar-accent:#5dd2c2;--sidebar-accent-soft:#173f4c;--sidebar-accent-rgb:93,210,194;--sidebar-accent-contrast:#12313d;--sidebar-accent-text:#b8f1e9}
:root[data-theme="blue"]{--brand:#2563eb;--brand-hover:#1d4ed8;--brand-soft:#eff6ff;--focus-ring:#bfdbfe;--sidebar:#172554;--sidebar-deep:#0f172a;--sidebar-line:#34457a;--sidebar-muted:#aebfe8;--sidebar-text:#e7efff;--sidebar-accent:#60a5fa;--sidebar-accent-soft:#1e3a8a;--sidebar-accent-rgb:96,165,250;--sidebar-accent-contrast:#172554;--sidebar-accent-text:#dbeafe}
:root[data-theme="navy"]{--brand:#0f4c81;--brand-hover:#0b3d68;--brand-soft:#e7f1f8;--focus-ring:#b8d8ed;--sidebar:#0d2b45;--sidebar-deep:#081c2d;--sidebar-line:#26506f;--sidebar-muted:#9eb9ca;--sidebar-text:#e3f0f8;--sidebar-accent:#58b7dd;--sidebar-accent-soft:#123d5b;--sidebar-accent-rgb:88,183,221;--sidebar-accent-contrast:#0d2b45;--sidebar-accent-text:#d7f2fc}
:root[data-theme="violet"]{--brand:#7c3aed;--brand-hover:#6d28d9;--brand-soft:#f3edff;--focus-ring:#ddd0fe;--sidebar:#2e1a4f;--sidebar-deep:#1d1034;--sidebar-line:#543779;--sidebar-muted:#c3b0de;--sidebar-text:#f0eaff;--sidebar-accent:#a78bfa;--sidebar-accent-soft:#4c2b78;--sidebar-accent-rgb:167,139,250;--sidebar-accent-contrast:#2e1a4f;--sidebar-accent-text:#ede9fe}
:root[data-theme="amber"]{--brand:#c2410c;--brand-hover:#9a3412;--brand-soft:#fff4e8;--focus-ring:#fed7aa;--sidebar:#3b2714;--sidebar-deep:#24170c;--sidebar-line:#644326;--sidebar-muted:#d4b793;--sidebar-text:#fff2df;--sidebar-accent:#fbbf24;--sidebar-accent-soft:#624415;--sidebar-accent-rgb:251,191,36;--sidebar-accent-contrast:#3b2714;--sidebar-accent-text:#fff1c2}
:root[data-theme="slate"]{--brand:#475569;--brand-hover:#334155;--brand-soft:#eef2f6;--focus-ring:#cbd5e1;--sidebar:#202936;--sidebar-deep:#151b24;--sidebar-line:#3c4858;--sidebar-muted:#b1bdca;--sidebar-text:#edf2f7;--sidebar-accent:#94a3b8;--sidebar-accent-soft:#334155;--sidebar-accent-rgb:148,163,184;--sidebar-accent-contrast:#202936;--sidebar-accent-text:#e2e8f0}
.primary:hover{background:var(--brand-hover)}input:focus,select:focus,textarea:focus{outline-color:var(--focus-ring)}.account{color:var(--brand)}.brand small{color:var(--sidebar-accent);border-color:rgba(var(--sidebar-accent-rgb),.45)}.brand-mark{box-shadow:0 0 0 4px rgba(var(--sidebar-accent-rgb),.1)}.nav-parent:hover span:first-child{background:rgba(var(--sidebar-accent-rgb),.16)}.nav-parent.is-active{border-color:rgba(var(--sidebar-accent-rgb),.24)}.nav-parent.is-active span:first-child{color:var(--sidebar-accent-contrast);box-shadow:0 5px 14px rgba(var(--sidebar-accent-rgb),.14)}.nav-subitem:hover{background:rgba(var(--sidebar-accent-rgb),.12)}.nav-subitem.active{background:rgba(var(--sidebar-accent-rgb),.12);color:var(--sidebar-accent-text)}
.theme-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.theme-card{border:1px solid var(--line);border-radius:var(--radius);padding:15px;background:var(--panel);display:grid;gap:12px}.theme-card.is-active{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}.theme-card strong,.theme-card span{display:block}.theme-card span{font-size:12px;color:var(--muted);line-height:1.55;margin-top:4px}.theme-card button{justify-self:start}.theme-swatch{height:82px;border-radius:9px;padding:13px;background:linear-gradient(135deg,#102a36,#0d222d);position:relative;overflow:hidden}.theme-swatch i{display:block;width:44%;height:8px;background:#5dd2c2;border-radius:99px}.theme-swatch b{display:block;width:72%;height:7px;background:#ffffffcc;border-radius:99px;margin-top:15px}.theme-swatch em{display:block;width:54%;height:7px;background:#ffffff80;border-radius:99px;margin-top:9px}.theme-swatch[data-theme-swatch="blue"]{background:linear-gradient(135deg,#172554,#0f172a)}.theme-swatch[data-theme-swatch="blue"] i{background:#60a5fa}.theme-swatch[data-theme-swatch="navy"]{background:linear-gradient(135deg,#0d2b45,#081c2d)}.theme-swatch[data-theme-swatch="navy"] i{background:#58b7dd}.theme-swatch[data-theme-swatch="violet"]{background:linear-gradient(135deg,#2e1a4f,#1d1034)}.theme-swatch[data-theme-swatch="violet"] i{background:#a78bfa}.theme-swatch[data-theme-swatch="amber"]{background:linear-gradient(135deg,#3b2714,#24170c)}.theme-swatch[data-theme-swatch="amber"] i{background:#fbbf24}.theme-swatch[data-theme-swatch="slate"]{background:linear-gradient(135deg,#202936,#151b24)}.theme-swatch[data-theme-swatch="slate"] i{background:#94a3b8}@media(max-width:900px){.theme-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.theme-grid{grid-template-columns:1fr}}

/* Quiet navigation rail: navigation supports the work, it does not compete with it. */
:root{--sidebar-surface:#f8fafc;--sidebar-ink:#253449;--sidebar-muted:#68778a;--sidebar-line:#e3e9f0;--sidebar-hover:#f0f4f7}
.sidebar{width:236px;padding:18px 12px 12px;background:var(--sidebar-surface);color:var(--sidebar-ink);border-right:1px solid var(--sidebar-line);box-shadow:none}.brand{min-height:54px;padding:0 10px 14px;margin-bottom:10px;border-bottom-color:var(--sidebar-line);color:var(--sidebar-ink)}.brand-mark{width:28px;height:28px;border-radius:8px;background:var(--brand-soft);color:var(--brand);box-shadow:none}.brand small{color:var(--muted);border-color:var(--sidebar-line);background:#fff}nav{gap:2px}nav p{color:#8794a4;margin:18px 10px 7px;font-size:10px;letter-spacing:.12em}.nav-parent{min-height:42px;padding:6px 9px;color:var(--sidebar-muted);border:0;border-radius:8px}.nav-parent span:first-child{width:28px;height:28px;background:transparent;color:#8291a1;font-size:14px}.nav-parent span:nth-child(2){font-size:13px;font-weight:620}.nav-parent b{color:#99a5b2}.nav-parent:hover{background:var(--sidebar-hover);color:var(--sidebar-ink);transform:none}.nav-parent:hover span:first-child{background:transparent;color:var(--brand)}.nav-parent.is-active{background:transparent;border:0;color:var(--sidebar-ink);box-shadow:none}.nav-parent.is-active span:first-child{background:var(--brand-soft);color:var(--brand);box-shadow:none}.nav-parent.is-active b{color:var(--brand)}.nav-subnav{margin-left:22px;padding-left:18px;border-left-color:#dce4ec}.nav-subitem{padding:7px 9px;color:#728194;font-size:12px}.nav-subitem:hover{background:var(--sidebar-hover);color:var(--sidebar-ink);transform:none}.nav-subitem.active{background:var(--brand-soft);color:var(--brand);font-weight:650}.nav-subitem.active::before{left:-19px;background:var(--brand)}.nav-item:focus-visible,.nav-subitem:focus-visible{outline-color:var(--brand)}.user{border-top-color:var(--sidebar-line);padding:14px 10px 4px}.user small{color:#8290a0}.avatar{background:var(--brand);box-shadow:none}main{margin-left:236px}header{box-shadow:0 1px 0 rgba(27,57,70,.05)}
@media(max-width:960px){.sidebar{width:64px;padding:18px 8px;border-right-color:var(--sidebar-line)}main{margin-left:64px}.brand{padding:0;min-height:40px;margin:0;border:0}.brand-mark{width:30px;height:30px}.nav-parent{padding:8px}.nav-parent span:first-child{width:30px;height:30px}.user{padding:12px 8px}}

/* Balanced navigation rail: clearer hierarchy without returning to a heavy sidebar. */
:root{--sidebar-surface:#eef2f5;--sidebar-ink:#1f2d3d;--sidebar-muted:#40566b;--sidebar-line:#d3dde6;--sidebar-hover:#e1e8ee}
.sidebar{--sidebar-muted:#40566b;--sidebar-line:#d3dde6;--sidebar-hover:#e1e8ee;width:244px;padding:18px 14px 12px;background:var(--sidebar-surface);border-right-color:var(--sidebar-line);box-shadow:4px 0 16px rgba(31,45,61,.035)}
.brand{color:var(--sidebar-ink);border-bottom-color:#cfd9e2}
.brand-mark{border:1px solid color-mix(in srgb,var(--brand) 18%,transparent);background:color-mix(in srgb,var(--brand-soft) 82%,#fff)}
nav p{margin:19px 10px 8px;color:#697b8e;font-size:10.5px;font-weight:750;letter-spacing:.13em}
.nav-parent{min-height:44px;padding:7px 9px;color:var(--sidebar-muted)}
.nav-parent span:first-child{background:#dfe7ed;color:#4f687f}
.nav-parent span:nth-child(2){font-weight:650}
.nav-parent b{color:#7e8d9d}
.nav-parent:hover{background:var(--sidebar-hover);color:var(--sidebar-ink)}
.nav-parent:hover span:first-child{background:#dbe4eb;color:var(--brand)}
.nav-parent.is-active{background:var(--brand-soft);color:var(--sidebar-ink);box-shadow:inset 3px 0 var(--brand)}
.nav-parent.is-active span:first-child{background:color-mix(in srgb,var(--brand) 14%,#fff);color:var(--brand)}
.nav-subnav{margin-left:23px;padding-left:18px;border-left-color:#c7d2dc}
.nav-subitem{padding:8px 10px;color:#4c6277;font-size:12.5px}
.nav-subitem:hover{background:#e3eaf0;color:var(--sidebar-ink)}
.nav-subitem.active{background:color-mix(in srgb,var(--brand-soft) 76%,#fff);color:var(--brand);font-weight:700;box-shadow:none}
.nav-subitem.active::before{width:3px;left:-20px}
.user{border-top-color:#ccd6df;background:rgba(255,255,255,.28)}
.user small{color:#68798a}
main{margin-left:244px}
@media(max-width:960px){.sidebar{width:64px;padding:18px 8px;box-shadow:none}main{margin-left:64px}.nav-parent{padding:8px}.nav-parent.is-active{box-shadow:none}}