:root{--bg:#0d100e;--sidebar:#111512;--panel:#151a17;--panel-2:#1b211d;--panel-3:#202820;--line:#2b342e;--text:#eff4ef;--muted:#a1aca4;--soft:#78827b;--green:#02c73a;--mint:#80f49a;--green-wash:rgba(2,199,58,.13);--amber:#ffbf5c;--amber-wash:rgba(255,191,92,.12);--red:#ff7474;--red-wash:rgba(255,116,116,.12);--blue:#89b5ff;--radius:15px;--shadow:0 16px 46px rgba(0,0,0,.18)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.5 Inter,"Segoe UI","Microsoft YaHei",Arial,sans-serif;min-width:320px}button,select,input{font:inherit}button{color:inherit;cursor:pointer}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--mint);outline-offset:2px}button:disabled{opacity:.5;cursor:not-allowed}.app-shell{min-height:100vh;display:grid;grid-template-columns:242px minmax(0,1fr)}.sidebar{background:var(--sidebar);border-right:1px solid var(--line);padding:22px 15px 15px;display:flex;flex-direction:column;gap:22px;min-height:100vh}.brand{display:flex;align-items:center;gap:11px;padding:0 7px 19px;border-bottom:1px solid var(--line)}.brand-mark{width:37px;height:37px;display:grid;place-items:center;border-radius:11px;background:linear-gradient(145deg,#b1ffbf 0%,var(--green) 53%,#138f37 100%);color:#07110a;font-size:23px;font-weight:900;transform:skew(-7deg)}.brand-text strong{display:block;font-size:16px;letter-spacing:.08em}.brand-text i{font-style:normal;color:var(--green)}.brand-text small{display:block;margin-top:2px;color:var(--soft);font-size:9px;letter-spacing:.12em}.demo-banner{border:1px solid #29452f;background:#122017;color:#bdf9c8;border-radius:9px;padding:8px 10px;font-size:10px;letter-spacing:.02em}.pulse{display:inline-block;width:7px;height:7px;background:var(--green);border-radius:50%;margin-right:7px;box-shadow:0 0 0 3px rgba(2,199,58,.12)}.nav-group{margin-bottom:21px}.nav-label{padding:0 10px 8px;color:#748077;font-size:9px;font-weight:800;letter-spacing:.15em;text-transform:uppercase}.nav{display:grid;gap:4px}.nav-btn{width:100%;border:0;background:transparent;color:#9eaaa1;border-radius:9px;display:flex;align-items:center;gap:11px;padding:10px 11px;text-align:left;font-size:12px;transition:background .15s,color .15s}.nav-btn:hover{background:#1a211c;color:#edf7ef}.nav-btn.active{background:var(--green-wash);color:var(--mint);box-shadow:inset 2px 0 var(--green)}.nav-icon{width:18px;text-align:center;font-size:15px}.nav-count{margin-left:auto;background:#27332a;color:#c9d5cc;border-radius:99px;padding:1px 7px;font-size:9px}.sidebar-bottom{margin-top:auto}.upload-shortcut{width:100%;border:1px solid #2d5738;background:#14241a;color:var(--mint);border-radius:11px;padding:11px;text-align:left;display:flex;align-items:center;gap:10px}.shortcut-icon{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:rgba(2,199,58,.13);font-size:19px}.upload-shortcut b{display:block;font-size:11px}.upload-shortcut small{display:block;margin-top:1px;color:#9db0a2;font-size:9px}.account-card{display:flex;align-items:center;gap:9px;margin-top:14px;padding:13px 5px 0;border-top:1px solid var(--line)}.avatar{width:33px;height:33px;border-radius:50%;display:grid;place-items:center;background:#294832;color:#baffc5;font-size:10px;font-weight:800}.account-copy{min-width:0}.account-copy b{display:block;font-size:11px}.account-copy small{color:var(--muted);font-size:9px}.dots{margin-left:auto;border:0;background:transparent;color:var(--muted);letter-spacing:2px}.main-area{min-width:0}.topbar{height:66px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 31px;position:sticky;top:0;background:rgba(13,16,14,.93);backdrop-filter:blur(14px);z-index:5}.crumbs{display:flex;align-items:center;gap:9px;color:var(--soft);font-size:11px}.crumbs b{color:#4b554d;font-weight:400}.crumbs strong{color:#e8eee9;font-weight:600}.top-actions{display:flex;align-items:center;gap:9px}.role-switch,.period-switch{display:flex;align-items:center;gap:8px;color:var(--muted);border:1px solid var(--line);background:var(--panel);border-radius:9px;padding:0 10px;height:34px;font-size:10px}.role-switch select,.period-switch select{color:#e2e9e3;background:transparent;border:0;outline:0;max-width:145px;font-size:10px}.role-switch option,.period-switch option{background:#19201b}.icon-btn{position:relative;border:1px solid var(--line);background:var(--panel);border-radius:9px;width:35px;height:34px;font-size:17px}.notice-dot{position:absolute;width:5px;height:5px;border-radius:50%;background:var(--amber);right:7px;top:7px}.content-wrap{max-width:1580px;padding:24px 31px 29px;margin:0 auto}.demo-warning{display:flex;align-items:center;gap:10px;background:#171d18;border:1px solid #354238;border-radius:11px;padding:10px 13px;margin-bottom:24px}.demo-warning>span{width:19px;height:19px;display:grid;place-items:center;border-radius:50%;background:#26352a;color:var(--mint);font-size:11px;font-weight:800}.demo-warning div{flex:1}.demo-warning b{display:block;color:#d9f5dd;font-size:10px}.demo-warning small{display:block;color:#9ca99f;font-size:9px;margin-top:2px}.demo-warning button{border:0;background:transparent;color:#849087;font-size:19px}.page-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin:0 0 20px}.eyebrow{color:var(--mint);font-size:9px;font-weight:800;letter-spacing:.15em;text-transform:uppercase}.page-heading h1{font-size:25px;letter-spacing:-.035em;margin:4px 0 4px}.page-heading p{margin:0;color:var(--muted);font-size:11px}.heading-actions{display:flex;gap:8px;align-items:center}.btn{border:1px solid var(--line);background:var(--panel);color:#dbe4dd;border-radius:9px;padding:8px 11px;font-size:10px}.btn:hover{border-color:#536357;background:#1a211c}.btn-primary{border:0;background:var(--green);color:#061109;border-radius:9px;padding:9px 13px;font-size:10px;font-weight:800;box-shadow:0 7px 18px rgba(2,199,58,.12)}.btn-primary:hover{background:#43df66}.tag{display:inline-flex;align-items:center;gap:5px;padding:3px 8px;border-radius:99px;background:#202820;color:#cbd5cc;font-size:9px;white-space:nowrap}.tag.green{background:var(--green-wash);color:var(--mint)}.tag.amber{background:var(--amber-wash);color:var(--amber)}.tag.red{background:var(--red-wash);color:var(--red)}.tag.blue{background:rgba(137,181,255,.12);color:#a8c8ff}.metrics-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:15px}.metric-card,.panel{background:linear-gradient(145deg,var(--panel),#141915);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.metric-card{position:relative;padding:15px 16px;min-height:120px;overflow:hidden}.metric-label{display:flex;align-items:center;justify-content:space-between;color:#b1bcb3;font-size:10px}.metric-icon{display:grid;place-items:center;width:25px;height:25px;border-radius:8px;background:#212b23;color:var(--mint);font-size:13px}.metric-value{font-size:25px;font-weight:750;letter-spacing:-.04em;margin-top:10px}.metric-value small{font-size:11px;color:#b2bcb4;font-weight:500;letter-spacing:0;margin-left:4px}.metric-foot{display:flex;gap:7px;align-items:center;margin-top:7px;color:#8d9a90;font-size:9px}.metric-foot strong{color:var(--mint);font-weight:600}.metric-foot .attention{color:var(--amber)}.grid-two{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.9fr);gap:14px;margin-bottom:14px}.grid-equal{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:14px}.panel{padding:17px 18px;min-width:0}.panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:15px}.panel-title{font-size:12px;font-weight:700}.panel-sub{margin-top:3px;color:var(--muted);font-size:9px}.link-btn{border:0;background:transparent;color:var(--mint);font-size:9px;padding:3px}.chart-wrap{height:190px;position:relative}.chart-wrap svg{width:100%;height:100%;overflow:visible}.chart-grid{stroke:#2a332c;stroke-width:1;stroke-dasharray:3 5}.chart-line{fill:none;stroke:var(--green);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.chart-fill{fill:url(#chartFill)}.chart-dot{fill:#111a13;stroke:var(--mint);stroke-width:2}.chart-labels{display:flex;justify-content:space-between;color:#77837a;font-size:8px;margin-top:-2px}.legend{display:flex;gap:13px;color:#a2ada4;font-size:9px}.legend i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);margin-right:5px}.legend i.blue{background:var(--blue)}.bar-list{display:grid;gap:14px}.bar-row{display:grid;grid-template-columns:100px minmax(70px,1fr) 55px;align-items:center;gap:9px;font-size:9px}.bar-name{color:#cbd4cc;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bar-track{height:7px;background:#283129;border-radius:99px;overflow:hidden}.bar-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,#129d39,var(--green))}.bar-fill.warn{background:linear-gradient(90deg,#ad7830,var(--amber))}.bar-value{text-align:right;color:#c7d0c8;font-variant-numeric:tabular-nums}.table-wrap{width:100%;overflow:auto}table{width:100%;border-collapse:collapse;white-space:nowrap}th{color:#829087;font-size:8px;letter-spacing:.03em;text-align:left;font-weight:700;padding:8px 9px;border-bottom:1px solid var(--line)}td{padding:10px 9px;border-bottom:1px solid rgba(43,52,46,.72);font-size:9px;color:#d4ddd5}tbody tr:last-child td{border-bottom:0}tbody tr:hover{background:rgba(255,255,255,.018)}.warehouse-name{display:flex;align-items:center;gap:8px;font-weight:600}.warehouse-icon{display:grid;place-items:center;width:23px;height:23px;border-radius:7px;background:#222b24;color:#b7f5c2;font-size:11px}.subtle{color:#87948a}.num{font-variant-numeric:tabular-nums}.table-note{margin-top:9px;color:#87948a;font-size:8px}.person-cell{display:flex;align-items:center;gap:7px}.mini-avatar{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#304735;color:#c9f4d0;font-size:8px;font-weight:700}.mini-avatar.blue{background:#2c3848;color:#bdd8ff}.mini-avatar.amber{background:#443b2d;color:#ffe0a9}.dual-metric{display:flex;align-items:center;gap:6px;color:#dce6dd}.dual-metric strong{font-size:10px;color:#f2f6f2}.unit{color:#829087;font-size:8px}.todo-list{display:grid;gap:0}.todo-item{display:flex;align-items:flex-start;gap:9px;padding:11px 0;border-bottom:1px solid rgba(43,52,46,.72)}.todo-item:last-child{border-bottom:0}.todo-dot{width:7px;height:7px;border-radius:50%;background:#76837a;margin-top:5px;flex:none}.todo-dot.red{background:var(--red)}.todo-dot.green{background:var(--green)}.todo-body{min-width:0;flex:1}.todo-title{font-size:9px;color:#e0e8e1;font-weight:600}.todo-meta{margin-top:3px;color:#8c998f;font-size:8px}.todo-due{color:#a8b3aa;font-size:8px;white-space:nowrap}.todo-due.red{color:var(--red)}.todo-due.amber{color:var(--amber)}.shift-list{display:grid;gap:9px}.shift-row{display:grid;grid-template-columns:1fr auto;gap:5px;padding:10px 0;border-bottom:1px solid rgba(43,52,46,.72)}.shift-row:last-child{border-bottom:0}.shift-info{display:flex;align-items:center;gap:8px;color:#dfe7e1;font-size:9px}.shift-right{text-align:right;color:#b7c1b9;font-size:9px}.shift-right strong{color:#eef4ef}.capacity{grid-column:1/-1;height:5px;background:#283129;border-radius:99px;overflow:hidden}.capacity span{display:block;height:100%;background:var(--green);border-radius:99px}.capacity span.warn{background:var(--amber)}.section-spacer{height:2px}.filter-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:#121713;border:1px solid var(--line);border-radius:11px;padding:10px 11px;margin-bottom:14px}.filter-chip{display:flex;align-items:center;gap:7px;border:1px solid #303b32;background:#1a211c;color:#b7c2b8;border-radius:8px;padding:7px 9px;font-size:9px}.filter-chip select{max-width:150px;border:0;background:transparent;color:#e1e8e2;outline:0;font-size:9px}.filter-chip option{background:#18201a}.filter-spacer{flex:1}.content-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:14px}.stat-inline{display:flex;gap:18px;flex-wrap:wrap;color:#99a49b;font-size:9px}.stat-inline strong{color:#e7eee8;font-size:12px;margin-left:5px}.profile-row{display:flex;align-items:center;gap:10px}.profile-row .mini-avatar{width:30px;height:30px}.staff-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:14px}.summary-chip{border:1px solid var(--line);background:#121713;border-radius:10px;padding:11px 12px}.summary-chip small{display:block;color:#8a968c;font-size:8px}.summary-chip b{display:block;margin-top:5px;font-size:15px}.summary-chip span{font-size:8px;color:var(--muted);font-weight:400;margin-left:3px}.switch-list{display:grid;gap:0}.switch-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid rgba(43,52,46,.72)}.switch-row:last-child{border:0}.switch-copy strong{display:block;font-size:9px;color:#dde5de}.switch-copy small{display:block;color:#829087;font-size:8px;margin-top:2px}.toggle{position:relative;width:35px;height:20px;border:0;border-radius:99px;background:#39433b;padding:0;flex:none;transition:.18s}.toggle::after{content:"";position:absolute;width:14px;height:14px;border-radius:50%;background:#d8e1d9;left:3px;top:3px;transition:.18s}.toggle.on{background:#168f37}.toggle.on::after{left:18px;background:white}.scope-list{display:flex;flex-wrap:wrap;gap:7px}.scope-chip{border:1px solid #354037;background:#19201b;color:#d1dbd2;border-radius:8px;padding:6px 9px;font-size:8px}.scope-chip.active{border-color:#3e7049;background:#14241a;color:#b9f7c5}.scope-chip:disabled{opacity:.35;cursor:not-allowed}.upload-drop{border:1px dashed #45614a;background:#131b15;border-radius:14px;padding:29px 17px;text-align:center}.upload-symbol{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#1d2d21;color:var(--mint);font-size:22px;margin:0 auto 10px}.upload-drop h3{margin:0;font-size:12px}.upload-drop p{color:#8e9c91;font-size:9px;margin:5px 0 13px}.upload-meta{display:flex;justify-content:center;gap:7px;flex-wrap:wrap;color:#86948a;font-size:8px}.upload-result{display:none;margin-top:13px}.upload-result.show{display:block}.notice-box{border:1px solid #3e4c40;background:#171f18;border-radius:10px;padding:11px 12px;color:#c9d6cb;font-size:9px}.notice-box strong{color:var(--mint)}.placeholder-card{display:flex;align-items:center;justify-content:center;min-height:175px;border:1px dashed #374239;border-radius:12px;color:#96a198;font-size:10px;text-align:center;padding:20px}.empty-state{text-align:center;padding:30px 15px;color:#96a198;font-size:10px}.permission-label{display:flex;align-items:center;gap:7px;color:#a9b4ab;font-size:9px}.readonly{color:#758177;font-size:8px}.toast{position:fixed;right:22px;bottom:20px;z-index:20;max-width:min(420px,calc(100vw - 30px));padding:11px 14px;background:#1e2921;border:1px solid #395340;border-radius:11px;color:#e4f9e8;font-size:10px;box-shadow:0 15px 45px #0008;opacity:0;transform:translateY(7px);transition:.2s;pointer-events:none}.toast.show{opacity:1;transform:translateY(0)}footer{display:flex;justify-content:space-between;gap:10px;color:#69746c;font-size:8px;padding:18px 2px 0}footer span{color:#8c988e}
@media(max-width:1120px){.app-shell{grid-template-columns:215px minmax(0,1fr)}.content-wrap{padding:21px}.topbar{padding:0 21px}.metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-two{grid-template-columns:minmax(0,1.2fr) minmax(250px,.8fr)}.content-grid{grid-template-columns:minmax(0,1fr) 260px}}
@media(max-width:820px){.app-shell{grid-template-columns:66px minmax(0,1fr)}.sidebar{padding:15px 8px}.brand{justify-content:center;padding:0 0 15px}.brand-text,.demo-banner,.nav-label,.nav-btn .nav-copy,.nav-count,.upload-shortcut span:not(.shortcut-icon),.account-copy,.dots{display:none}.nav-btn{justify-content:center;padding:11px 4px}.nav-icon{font-size:17px}.upload-shortcut{justify-content:center;padding:9px 4px}.account-card{justify-content:center}.topbar{padding:0 13px}.content-wrap{padding:17px 14px}.grid-two,.content-grid{grid-template-columns:1fr}.content-grid aside{order:-1}.grid-equal{grid-template-columns:1fr}.role-switch{gap:4px;padding:0 6px}.role-switch select{max-width:110px}.period-switch{gap:4px;padding:0 7px}.period-switch select{max-width:80px}}
@media(max-width:540px){.topbar{height:auto;min-height:60px;align-items:flex-start;padding:10px 12px;gap:8px;flex-direction:column}.top-actions{width:100%;justify-content:space-between}.role-switch,.period-switch{height:31px}.crumbs{padding-top:3px}.demo-warning{align-items:flex-start}.demo-warning small{line-height:1.5}.page-heading{display:block}.heading-actions{margin-top:12px}.page-heading h1{font-size:21px}.metrics-grid{gap:8px}.metric-card{padding:12px;min-height:112px}.metric-value{font-size:21px}.metric-foot{flex-wrap:wrap;font-size:8px}.panel{padding:14px 12px}.staff-summary{grid-template-columns:1fr}.bar-row{grid-template-columns:77px minmax(50px,1fr) 45px}.chart-wrap{height:160px}.filter-spacer{display:none}.filter-bar{align-items:stretch}.filter-chip{flex:1;justify-content:space-between}footer{display:block}footer span{display:block;margin-top:3px}}

/* v0.2.0 navigation and supplied KNETGROUP logo */
.sidebar{padding-top:16px;gap:14px}.brand{display:flex;align-items:center;padding:0 0 13px;border-bottom:1px solid var(--line)}.brand-logo{display:block;width:100%;height:auto;background:#fff;border-radius:4px}.nav-group{margin-bottom:10px}.nav-label{padding:0 8px 5px;color:#849188;font-size:9px;font-weight:800;letter-spacing:.02em;text-transform:none}.nav{gap:2px}.nav-btn{gap:9px;padding:7px 9px;font-size:11px}.export-card .panel-sub{margin:0 0 16px;line-height:1.7}.export-card .btn-primary{margin-top:2px}
@media(max-width:820px){.app-shell{grid-template-columns:102px minmax(0,1fr)}.sidebar{padding:12px 8px;gap:12px}.brand{justify-content:center;padding:0 0 10px}.brand-logo{width:82px}.nav-label{display:block;padding:2px 0 4px;font-size:7px;text-align:center;line-height:1.3;letter-spacing:0;word-break:break-all}.nav-group{margin-bottom:8px}.nav-btn{justify-content:center;padding:8px 3px}.nav-btn .nav-copy,.nav-count,.demo-banner,.upload-shortcut span:not(.shortcut-icon),.account-copy,.dots{display:none}.upload-shortcut{justify-content:center;padding:8px 3px}.account-card{justify-content:center}}
/* v0.2.2 data management menu */
.data-management-parent{font-weight:700;color:var(--text)}.data-management-parent:hover{color:var(--mint)}.data-menu-chevron{margin-left:auto;color:var(--muted);font-size:13px}.data-management-submenu{margin:5px 0 0 17px;padding-left:8px;border-left:1px solid var(--line)}.data-management-submenu[hidden]{display:none}
@media(max-width:820px){.data-management-parent{flex-wrap:wrap;gap:4px}.data-management-parent .nav-copy{display:block;font-size:9px}.data-menu-chevron{margin-left:0}.data-management-submenu{margin-left:0;padding-left:0;border:0}.data-management-submenu .nav-copy{display:block;font-size:8px}.data-management-submenu .nav-btn{gap:4px}}
