:root{--primary: #C2F03A;--primary-hover: #AFE026;--primary-active: #9CCC18;--primary-soft: #EAFAC1;--primary-softer: #F4FCDE;--primary-text-on: #1A2A05;--bg: #F5F5F0;--bg-elev: #FAFAF7;--surface: #FFFFFF;--sidebar-bg: #FFFFFF;--overlay: rgba(20, 22, 18, .42);--text: #18181B;--text-strong: #0B0B0E;--text-muted: #6B6B72;--text-soft: #9A9AA0;--text-faint: #C1C1C6;--border: #ECECE6;--border-strong: #DCDCD4;--border-input: #E0E0DA;--success: #22C55E;--success-bg: #E5F8EA;--success-text: #15803D;--warning: #F59E0B;--warning-bg: #FEF3C7;--warning-text: #B45309;--danger: #EF4444;--danger-bg: #FEE6E4;--danger-text: #B91C1C;--info: #3B82F6;--info-bg: #E0EAFB;--info-text: #1D4ED8;--purple: #8B5CF6;--purple-bg: #ECE7FE;--purple-text: #6D28D9;--orange: #FB923C;--orange-bg: #FEE7D2;--orange-text: #C2410C;--teal: #14B8A6;--teal-bg: #D5F5F0;--teal-text: #0F766E;--pink: #EC4899;--pink-bg: #FCE0EC;--c-lime: #C2F03A;--c-lime-dark: #95C619;--c-blue: #6BA3F5;--c-purple: #B89BF7;--c-orange: #FCB063;--c-pink: #F38AB0;--c-red: #F26B6B;--c-teal: #6BD8C9;--r-sm: 6px;--r-md: 10px;--r-lg: 14px;--r-xl: 18px;--r-2xl: 22px;--r-pill: 999px;--sh-1: 0 1px 2px rgba(20, 22, 18, .04);--sh-2: 0 2px 8px rgba(20, 22, 18, .06), 0 1px 2px rgba(20, 22, 18, .04);--sh-3: 0 10px 28px rgba(20, 22, 18, .1), 0 2px 6px rgba(20, 22, 18, .05);--sh-drawer: -20px 0 40px rgba(20, 22, 18, .08);--sidebar-w: 244px;--topbar-h: 72px;--pad-page: 32px}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:Plus Jakarta Sans,system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--text);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;font-feature-settings:"cv11","ss01","ss03"}button{font-family:inherit;cursor:pointer;border:0;background:none;color:inherit}input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}a{color:inherit;text-decoration:none}.app{display:grid;grid-template-columns:var(--sidebar-w) 1fr;min-height:100vh;background:var(--bg)}.sidebar{background:var(--sidebar-bg);border-right:1px solid var(--border);padding:22px 16px 18px;display:flex;flex-direction:column;gap:18px;position:sticky;top:0;height:100vh;overflow-y:auto}.sidebar::-webkit-scrollbar{width:6px}.sidebar::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:3px}.brand{display:flex;align-items:center;gap:10px;padding:4px 6px 0}.brand-logo{width:36px;height:36px;border-radius:9px;background:#0b0b0e;display:grid;place-items:center;position:relative;overflow:hidden}.brand-logo svg{width:22px;height:22px}.brand-name{font-size:19px;font-weight:700;letter-spacing:-.02em;color:var(--text-strong);line-height:1}.brand-sub{font-size:11px;color:var(--text-muted);letter-spacing:.04em;text-transform:uppercase;margin-top:3px;font-weight:500}.user-card{border:1px solid var(--border);border-radius:var(--r-lg);padding:14px 10px 12px;display:flex;flex-direction:column;align-items:center;gap:6px;background:var(--surface)}.user-card .avatar{width:56px;height:56px;border-radius:50%}.user-card .name{font-weight:600;font-size:13px;color:var(--text-strong);margin-top:4px}.user-card .role{font-size:11px;color:var(--text-muted)}.status-pill{display:inline-flex;align-items:center;gap:5px;background:var(--surface);border:1px solid var(--border);padding:3px 9px;font-size:11px;border-radius:var(--r-pill);color:var(--text);margin-top:4px}.status-pill:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--success);box-shadow:0 0 0 3px #22c55e26}.nav{display:flex;flex-direction:column;gap:1px;flex:1}.nav-item{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:9px;font-size:13.5px;color:var(--text-muted);font-weight:500;transition:background .15s ease,color .15s ease;position:relative}.nav-item:hover{background:var(--bg);color:var(--text)}.nav-item.active{background:var(--primary-soft);color:var(--text-strong);font-weight:600}.nav-item.active .nav-icon{color:var(--primary-active)}.nav-icon{width:18px;height:18px;flex:0 0 18px;color:var(--text-soft);transition:color .15s}.nav-item:hover .nav-icon{color:var(--text)}.nav-badge{margin-left:auto;background:var(--primary-soft);color:var(--primary-text-on);font-size:11px;font-weight:700;padding:1px 7px;border-radius:var(--r-pill)}.nav-divider{height:1px;background:var(--border);margin:6px 4px}.logout{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:9px;font-size:13.5px;color:var(--text-muted);font-weight:500;transition:background .15s}.logout:hover{background:var(--bg);color:var(--danger)}.main{display:flex;flex-direction:column;min-width:0}.topbar{display:flex;align-items:center;gap:16px;padding:18px var(--pad-page) 0 var(--pad-page);background:transparent}.search{flex:1;max-width:480px;display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--border);padding:10px 14px;border-radius:var(--r-pill);color:var(--text-muted);transition:border-color .15s,box-shadow .15s;cursor:text}.search:hover{border-color:var(--border-strong)}.search:focus-within{border-color:var(--primary-active);box-shadow:0 0 0 3px var(--primary-softer)}.search input{flex:1;border:0;outline:0;background:transparent;color:var(--text)}.search input::placeholder{color:var(--text-soft)}.kbd{font-size:11px;padding:2px 7px;border-radius:5px;background:var(--bg);border:1px solid var(--border);color:var(--text-muted);font-family:inherit;font-weight:600}.icon-btn{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--surface);border:1px solid var(--border);color:var(--text);position:relative;transition:background .15s,border-color .15s,transform .15s}.icon-btn:hover{background:var(--bg-elev);border-color:var(--border-strong)}.icon-btn:active{transform:scale(.96)}.icon-btn .dot{position:absolute;top:6px;right:7px;min-width:16px;height:16px;background:var(--primary);color:var(--primary-text-on);font-size:10px;font-weight:700;border-radius:var(--r-pill);display:grid;place-items:center;padding:0 3px;border:2px solid var(--surface)}.profile-btn{display:flex;align-items:center;gap:6px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-pill);padding:4px 10px 4px 4px;transition:background .15s,border-color .15s}.profile-btn:hover{background:var(--bg-elev);border-color:var(--border-strong)}.profile-btn .avatar{width:32px;height:32px;border-radius:50%}.profile-btn svg{color:var(--text-muted);width:16px;height:16px}.page{padding:14px var(--pad-page) 28px var(--pad-page);display:flex;flex-direction:column;gap:18px}.page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:24px}.page-title{font-size:34px;font-weight:700;letter-spacing:-.02em;color:var(--text-strong);line-height:1.1;margin:0}.page-sub{font-size:14px;color:var(--text-muted);margin-top:6px;max-width:720px}.page-actions{display:flex;gap:10px;align-items:center;flex-shrink:0;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:var(--r-md);font-size:13.5px;font-weight:600;background:var(--surface);border:1px solid var(--border);color:var(--text);transition:background .15s,border-color .15s,transform .12s,box-shadow .15s;white-space:nowrap}.btn:hover{background:var(--bg-elev);border-color:var(--border-strong)}.btn:active{transform:scale(.98)}.btn svg{width:15px;height:15px}.btn-primary{background:var(--primary);border-color:var(--primary);color:var(--primary-text-on)}.btn-primary:hover{background:var(--primary-hover);border-color:var(--primary-hover)}.btn-primary:active{background:var(--primary-active)}.btn-ghost{background:transparent;border-color:transparent}.btn-ghost:hover{background:var(--bg)}.btn-danger{color:var(--danger)}.btn-danger:hover{background:var(--danger-bg);border-color:var(--danger-bg);color:var(--danger-text)}.btn-sm{padding:6px 11px;font-size:12.5px;border-radius:8px}.btn-xs{padding:4px 9px;font-size:12px;border-radius:6px}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);padding:18px}.card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.card-title{font-size:15px;font-weight:600;color:var(--text-strong)}.card-sub{font-size:12.5px;color:var(--text-muted)}.kpi-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}@media (max-width: 1400px){.kpi-grid{grid-template-columns:repeat(3,1fr)}}.kpi{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:14px 16px 12px;transition:border-color .2s,transform .2s,box-shadow .2s;cursor:pointer}.kpi:hover{border-color:var(--border-strong);transform:translateY(-1px);box-shadow:var(--sh-2)}.kpi-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.kpi-label{font-size:12.5px;color:var(--text-muted)}.kpi-icon{width:32px;height:32px;border-radius:9px;display:grid;place-items:center}.kpi-icon svg{width:16px;height:16px}.kpi-value{font-size:26px;font-weight:700;letter-spacing:-.02em;color:var(--text-strong);margin-top:4px}.kpi-delta{display:flex;align-items:center;gap:4px;font-size:11.5px;color:var(--text-muted);margin-top:2px}.kpi-delta .up{color:var(--success-text)}.kpi-delta .down{color:var(--danger-text)}.kpi-spark{margin-top:6px;height:36px}.pill{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:var(--r-pill);font-size:11.5px;font-weight:600;background:var(--bg);color:var(--text-muted);white-space:nowrap}.pill:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.85}.pill-success{background:var(--success-bg);color:var(--success-text)}.pill-info{background:var(--info-bg);color:var(--info-text)}.pill-warning{background:var(--warning-bg);color:var(--warning-text)}.pill-danger{background:var(--danger-bg);color:var(--danger-text)}.pill-purple{background:var(--purple-bg);color:var(--purple-text)}.pill-orange{background:var(--orange-bg);color:var(--orange-text)}.pill-teal{background:var(--teal-bg);color:var(--teal-text)}.pill-plain{background:var(--bg);color:var(--text-muted)}.pill-plain:before{display:none}.pill-nodot:before{display:none}.tbl-wrap{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);overflow:hidden}.tbl-controls{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--border)}.tbl-controls .search-input{flex:1;max-width:320px;display:flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--border);padding:8px 12px;border-radius:var(--r-md);color:var(--text-muted)}.tbl-controls .search-input input{border:0;outline:0;background:transparent;color:var(--text);flex:1}.tbl-controls .search-input:focus-within{border-color:var(--primary-active)}.tbl{width:100%;border-collapse:collapse}.tbl th,.tbl td{padding:13px 16px;text-align:left;font-size:13px}.tbl thead th{font-weight:500;color:var(--text-muted);background:transparent;border-bottom:1px solid var(--border);font-size:12.5px}.tbl tbody tr{border-bottom:1px solid var(--border);transition:background .12s;cursor:pointer}.tbl tbody tr:last-child{border-bottom:0}.tbl tbody tr:hover{background:var(--bg-elev)}.tbl tbody tr.selected{background:var(--primary-softer)}.row-user{display:flex;align-items:center;gap:10px}.row-user .avatar{width:32px;height:32px;border-radius:50%}.row-user .meta{display:flex;flex-direction:column}.row-user .name{font-weight:600;color:var(--text-strong);font-size:13px}.row-user .sub{font-size:11.5px;color:var(--text-muted)}.cell-empty{color:var(--text-soft)}.actions-cell{display:flex;gap:4px;justify-content:flex-end}.row-action{width:28px;height:28px;border-radius:7px;display:grid;place-items:center;color:var(--text-muted);transition:background .12s,color .12s}.row-action:hover{background:var(--bg);color:var(--text)}.tbl-foot{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-top:1px solid var(--border);font-size:12.5px;color:var(--text-muted)}.pagination{display:flex;align-items:center;gap:4px}.page-num{min-width:30px;height:30px;padding:0 9px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;font-size:12.5px;color:var(--text-muted);transition:background .12s,color .12s}.page-num:hover{background:var(--bg);color:var(--text)}.page-num.active{background:var(--primary);color:var(--primary-text-on);font-weight:700}.avatar{display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:12px;color:#fff;border-radius:50%;position:relative;flex-shrink:0;letter-spacing:-.01em}.avatar.with-status:after{content:"";position:absolute;bottom:0;right:0;width:25%;height:25%;background:var(--success);border-radius:50%;border:2px solid var(--surface)}.filter-chip{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border-radius:var(--r-pill);font-size:12.5px;font-weight:600;background:var(--surface);border:1px solid var(--border);color:var(--text);transition:background .12s,border-color .12s}.filter-chip:hover{background:var(--bg-elev);border-color:var(--border-strong)}.filter-chip.active{background:var(--primary);border-color:var(--primary);color:var(--primary-text-on)}.filter-chip svg{width:14px;height:14px}.segmented{display:inline-flex;padding:3px;border:1px solid var(--border);border-radius:var(--r-pill);background:var(--surface)}.segmented button{padding:5px 12px;border-radius:var(--r-pill);font-size:12.5px;font-weight:600;color:var(--text-muted);transition:background .15s,color .15s}.segmented button.active{background:var(--primary);color:var(--primary-text-on)}.segmented button:not(.active):hover{color:var(--text)}.dd{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);font-size:12.5px;color:var(--text);transition:border-color .12s,background .12s}.dd:hover{background:var(--bg-elev);border-color:var(--border-strong)}.dd svg{width:14px;height:14px;color:var(--text-muted)}.drawer-mask{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:80;animation:fadeIn .25s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.drawer{position:fixed;top:0;right:0;bottom:0;width:440px;max-width:90vw;background:var(--surface);z-index:90;box-shadow:var(--sh-drawer);display:flex;flex-direction:column;animation:drawerSlide .35s cubic-bezier(.2,.7,.2,1)}@keyframes drawerSlide{0%{transform:translate(20px);opacity:0}to{transform:translate(0);opacity:1}}.drawer-head{padding:18px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:12px}.drawer-body{flex:1;overflow-y:auto;padding:20px}.drawer-body::-webkit-scrollbar{width:8px}.drawer-body::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:4px}.drawer-foot{padding:16px 20px;border-top:1px solid var(--border);display:flex;gap:10px}.modal-mask{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--overlay);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:100;display:grid;place-items:center;animation:fadeIn .2s ease;padding:20px}.modal{background:var(--surface);border-radius:var(--r-2xl);max-width:540px;width:100%;box-shadow:var(--sh-3);overflow:hidden;animation:modalRise .25s cubic-bezier(.2,.7,.2,1)}@keyframes modalRise{0%{transform:scale(.96) translateY(8px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}.modal-head{padding:18px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}.modal-body{padding:20px}.modal-foot{padding:14px 20px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:10px}.field{display:flex;flex-direction:column;gap:6px}.field label{font-size:12px;font-weight:500;color:var(--text-muted)}.field input,.field select,.field textarea{background:var(--surface);border:1px solid var(--border-input);padding:9px 12px;border-radius:var(--r-md);font-size:13px;outline:0;transition:border-color .15s,box-shadow .15s;color:var(--text)}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--primary-active);box-shadow:0 0 0 3px var(--primary-softer)}.field textarea{resize:vertical;min-height:72px;font-family:inherit}.tip{position:relative}.tip:after{content:attr(data-tip);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%) translateY(2px);background:var(--text-strong);color:#fff;font-size:11px;padding:4px 8px;border-radius:6px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .15s,transform .15s}.tip:hover:after{opacity:1;transform:translate(-50%) translateY(0)}.popover{position:absolute;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);box-shadow:var(--sh-3);z-index:60;overflow:hidden;animation:popoverIn .18s cubic-bezier(.2,.7,.2,1)}@keyframes popoverIn{0%{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.popover-head{padding:14px 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}.popover-body{max-height:420px;overflow-y:auto}.popover-foot{padding:10px 16px;border-top:1px solid var(--border)}.notif-row{display:flex;gap:12px;padding:12px 16px;border-bottom:1px solid var(--border);transition:background .12s;cursor:pointer}.notif-row:hover{background:var(--bg-elev)}.notif-row:last-child{border-bottom:0}.notif-icon{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;flex-shrink:0}.notif-icon svg{width:15px;height:15px}.notif-title{font-size:13px;font-weight:600;color:var(--text-strong)}.notif-desc{font-size:12px;color:var(--text-muted);margin-top:2px}.notif-time{font-size:11px;color:var(--text-soft);margin-top:4px}.cmd-mask{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--overlay);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:110;display:flex;justify-content:center;padding-top:12vh;animation:fadeIn .15s}.cmd{width:600px;max-width:90vw;background:var(--surface);border-radius:var(--r-2xl);box-shadow:var(--sh-3);overflow:hidden;height:fit-content;animation:modalRise .2s cubic-bezier(.2,.7,.2,1)}.cmd-input{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--border)}.cmd-input input{flex:1;border:0;outline:0;background:transparent;font-size:15px;color:var(--text)}.cmd-input input::placeholder{color:var(--text-soft)}.cmd-list{max-height:420px;overflow-y:auto;padding:8px}.cmd-section{font-size:11px;color:var(--text-soft);padding:8px 12px 4px;text-transform:uppercase;letter-spacing:.04em;font-weight:600}.cmd-item{display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:var(--r-md);font-size:13.5px;color:var(--text);cursor:pointer}.cmd-item:hover,.cmd-item.active{background:var(--bg)}.cmd-item.active{background:var(--primary-soft);color:var(--text-strong);font-weight:600}.cmd-item svg{width:16px;height:16px;color:var(--text-muted)}.cmd-item.active svg{color:var(--primary-active)}.cmd-item .arrow{margin-left:auto;color:var(--text-soft)}.chart-tooltip{position:absolute;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);box-shadow:var(--sh-2);padding:10px 12px;font-size:12px;pointer-events:none;transform:translate(-50%,-100%);white-space:nowrap}.chart-tooltip .tt-time{font-size:11px;color:var(--text-muted);font-weight:600}.chart-tooltip .tt-row{display:flex;align-items:center;gap:6px;margin-top:3px}.chart-tooltip .tt-dot{width:7px;height:7px;border-radius:50%}.chart-tooltip .tt-label{color:var(--text-muted)}.chart-tooltip .tt-val{color:var(--text-strong);font-weight:700;margin-left:8px}.row{display:flex;align-items:center;gap:8px}.col{display:flex;flex-direction:column;gap:8px}.gap-4{gap:4px}.gap-6{gap:6px}.gap-8{gap:8px}.gap-12{gap:12px}.gap-16{gap:16px}.flex-1{flex:1}.mt-1{margin-top:4px}.mt-2{margin-top:8px}.mt-3{margin-top:12px}.mt-4{margin-top:16px}.text-muted{color:var(--text-muted)}.text-soft{color:var(--text-soft)}.text-strong{color:var(--text-strong)}.text-success{color:var(--success-text)}.text-danger{color:var(--danger-text)}.text-warning{color:var(--warning-text)}.fw-600{font-weight:600}.fw-700{font-weight:700}.fz-11{font-size:11px}.fz-12{font-size:12px}.fz-13{font-size:13px}.fz-14{font-size:14px}.fz-18{font-size:18px}.fz-20{font-size:20px}.fz-24{font-size:24px}.fz-32{font-size:32px}.mono{font-feature-settings:"tnum" 1;font-variant-numeric:tabular-nums}.bar{width:64px;height:6px;border-radius:var(--r-pill);background:var(--bg);overflow:hidden}.bar>div{height:100%;background:var(--success);border-radius:inherit;transition:width .4s ease}.bar.low>div{background:var(--warning)}.bar.bad>div{background:var(--danger)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.pulse{animation:pulse 1.6s ease infinite}.mobile-nav-btn{display:none!important}@media (max-width: 900px){.mobile-nav-btn{display:flex!important}}