:root{--bg:#fff;--page:#f7f8fa;--side:#f7f7f8;--text:#1f2328;--muted:#6b7280;--faint:#9ca3af;--border:#e3e5e8;--blue:#2953b2;--blue-soft:#ebf0fa;--green:#0b7a3b;--green-soft:#e5f4eb;--red:#c2362f;--red-soft:#fbeae9;--amber:#a35f00;--amber-soft:#fff3dc;--purple:#6a3fc4;--purple-soft:#f0eafb;--gray:#4b5563;--gray-soft:#f1f2f4;--wa:#1a9e55;--wa-soft:#e7f6ee;--navy:#13204a;--radius:8px}*{box-sizing:border-box}html,body{margin:0;padding:0}body{color:var(--text);background:var(--page);-webkit-font-smoothing:antialiased;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:14px}a{color:var(--blue);text-decoration:none}button,input,select,textarea{font:inherit;color:inherit}h1,h2,h3,p{margin:0}.topbar{z-index:20;background:var(--bg);border-bottom:1px solid var(--border);align-items:center;gap:16px;height:60px;padding:0 24px;display:flex;position:sticky;top:0}.brand{color:var(--navy);align-items:center;gap:10px;font-size:16px;font-weight:700;display:flex}.brand-mark{background:var(--navy);color:#fff;border-radius:7px;place-items:center;width:28px;height:28px;font-size:15px;display:grid}.topbar .spacer{flex:1}.avatar{background:var(--blue-soft);width:30px;height:30px;color:var(--blue);border-radius:999px;place-items:center;font-size:13px;font-weight:600;display:grid}.menu-btn{cursor:pointer;background:0 0;border:0;padding:6px;display:none}.layout{min-height:calc(100vh - 60px);display:flex}.sidebar{background:var(--side);border-right:1px solid var(--border);flex-direction:column;flex-shrink:0;gap:2px;width:248px;padding:20px 14px;display:flex}.sidebar .section{color:var(--faint);text-transform:uppercase;letter-spacing:.05em;padding:14px 12px 6px;font-size:11px;font-weight:700}.nav{color:var(--text);border-radius:6px;align-items:center;gap:12px;padding:9px 12px;font-weight:500;display:flex}.nav:hover{background:#eef0f3}.nav.active{background:var(--blue-soft);color:var(--blue);font-weight:600}.nav svg{flex-shrink:0}.content{flex-direction:column;flex:1;gap:24px;min-width:0;padding:28px 40px 56px;display:flex}.store-switch{border:1px solid var(--border);background:var(--bg);cursor:pointer;text-align:left;border-radius:8px;align-items:center;gap:8px;width:100%;margin-bottom:8px;padding:10px 12px;display:flex}.store-switch small{color:var(--muted);font-size:12px;display:block}.page-header{flex-wrap:wrap;align-items:flex-end;gap:12px;display:flex}.page-header .titles{flex-direction:column;flex:1;gap:4px;min-width:260px;display:flex}.crumb{color:var(--muted);font-size:12px}.title{flex-wrap:wrap;align-items:center;gap:12px;font-size:24px;font-weight:600;display:flex}.subtitle{color:var(--muted)}.actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.card{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;gap:16px;min-width:0;padding:24px;display:flex}.card.flush{gap:0;padding:0;overflow:hidden}.card-head{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.card-head h3{font-size:16px;font-weight:600}.card-head .tag{color:var(--faint);font-size:12px}.card-head .right{align-items:center;gap:12px;margin-left:auto;display:flex}.row{align-items:stretch;gap:24px;display:flex}.row>.grow{flex:1;min-width:0}.side-col{flex-shrink:0;width:400px}.grid-kpi{grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;display:grid}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;display:grid}.stack{flex-direction:column;gap:24px;display:flex}.muted{color:var(--muted)}.faint{color:var(--faint)}.small{font-size:12px}.strong{font-weight:600}.right-align{text-align:right}.divider{background:var(--border);height:1px}.kpi{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;gap:6px;min-width:0;padding:20px;display:flex}.kpi .label{color:var(--muted);font-size:13px}.kpi .value{white-space:nowrap;text-overflow:ellipsis;font-size:26px;font-weight:600;overflow:hidden}.kpi .delta{flex-wrap:wrap;align-items:baseline;gap:6px;font-size:13px;font-weight:600;display:flex}.kpi .delta .note{color:var(--faint);font-size:12px;font-weight:400}.up{color:var(--green)}.down{color:var(--red)}.flat{color:var(--muted)}.chip{white-space:nowrap;border-radius:999px;align-items:center;gap:6px;padding:3px 9px;font-size:12px;font-weight:600;display:inline-flex}.chip .dot{background:currentColor;border-radius:99px;width:6px;height:6px}.c-gray{color:var(--gray);background:var(--gray-soft)}.c-blue{color:var(--blue);background:var(--blue-soft)}.c-green{color:var(--green);background:var(--green-soft)}.c-red{color:var(--red);background:var(--red-soft)}.c-amber{color:var(--amber);background:var(--amber-soft)}.c-purple{color:var(--purple);background:var(--purple-soft)}.btn{border:1px solid var(--border);background:var(--bg);cursor:pointer;white-space:nowrap;border-radius:6px;justify-content:center;align-items:center;gap:8px;height:36px;padding:0 16px;font-weight:600;display:inline-flex}.btn:hover{background:#f4f5f7}.btn.primary{background:var(--blue);border-color:var(--blue);color:#fff}.btn.primary:hover{background:#22479a}.btn.ghost{color:var(--blue);background:0 0;border-color:#0000}.btn.danger{color:var(--red)}.btn.sm{height:30px;padding:0 12px;font-size:13px}.btn:disabled{opacity:.55;cursor:not-allowed}.icon-btn{border:1px solid var(--border);background:var(--bg);cursor:pointer;border-radius:6px;place-items:center;width:32px;height:32px;display:grid}.icon-btn:hover{background:#f4f5f7}.icon-btn:disabled{opacity:.4;cursor:not-allowed}.input,.select{border:1px solid var(--border);background:var(--bg);border-radius:6px;min-width:0;height:36px;padding:0 12px}.input:focus,.select:focus,textarea:focus{outline:2px solid var(--blue-soft);border-color:var(--blue)}textarea.input{resize:vertical;height:auto;padding:10px 12px}.field{flex-direction:column;gap:6px;display:flex}.field label{font-size:13px;font-weight:500}.field .hint{color:var(--muted);font-size:12px}.search{border:1px solid var(--border);background:var(--bg);border-radius:6px;align-items:center;gap:8px;height:36px;padding:0 12px;display:flex}.search input{background:0 0;border:0;outline:0;flex:1;min-width:0}.toggle{cursor:pointer;background:#c9cdd2;border:0;border-radius:10px;flex-shrink:0;width:36px;height:20px;padding:2px;transition:background .15s;display:flex}.toggle:after{content:"";background:#fff;border-radius:99px;width:16px;height:16px;transition:transform .15s}.toggle.on{background:var(--blue)}.toggle.on:after{transform:translate(16px)}.toggle:disabled{opacity:.5;cursor:not-allowed}.checkbox{width:18px;height:18px;accent-color:var(--blue);cursor:pointer}.tabs{border-bottom:1px solid var(--border);gap:28px;display:flex;overflow-x:auto}.tab{color:var(--gray);cursor:pointer;white-space:nowrap;background:0 0;border:0;border-bottom:2px solid #0000;align-items:center;gap:8px;padding:10px 0 12px;font-weight:500;display:flex}.tab.active{color:var(--blue);border-bottom-color:var(--blue);font-weight:600}.table{border-collapse:collapse;width:100%}.table th{text-align:left;color:var(--muted);border-bottom:1px solid var(--border);white-space:nowrap;background:#fafafb;padding:12px 16px;font-size:12px;font-weight:600}.table td{border-bottom:1px solid var(--border);vertical-align:middle;padding:12px 16px}.table tr:last-child td{border-bottom:0}.table tr.selected td{background:#f7f9fe}.table tr.clickable{cursor:pointer}.table tr.clickable:hover td{background:#fafbfc}.table .num{text-align:right;white-space:nowrap}.table-wrap{overflow-x:auto}.thumbs{align-items:center;display:flex}.thumb{background:#e9e4de 50%/cover;border:2px solid #fff;border-radius:6px;width:28px;height:28px;margin-left:-8px}.thumb:first-child{margin-left:0}.banner{border-radius:var(--radius);flex-wrap:wrap;align-items:center;gap:10px;padding:12px 16px;display:flex}.banner.ok{background:var(--green-soft)}.banner.warn{background:var(--amber-soft)}.banner.info{background:var(--blue-soft)}.banner.err{background:var(--red-soft)}.pulse{background:var(--green);border-radius:4px;flex:none;width:8px;height:8px;position:relative}.pulse:after{content:"";background:inherit;border-radius:50%;animation:1.6s ease-out infinite pulse;position:absolute;inset:0}@keyframes pulse{0%{opacity:.6;transform:scale(1)}to{opacity:0;transform:scale(2.6)}}.row-fresh td{animation:2.4s ease-out fresh}@keyframes fresh{0%{background:#e8f1ff}to{background:0 0}}@media (prefers-reduced-motion:reduce){.pulse:after,.row-fresh td{animation:none}}.bar-track{background:var(--gray-soft);border-radius:3px;height:6px;overflow:hidden}.bar-fill{border-radius:3px;height:100%}.empty{text-align:center;color:var(--muted);padding:40px 16px}.skeleton{background:linear-gradient(90deg,#eef0f3,#f6f7f9,#eef0f3) 0 0/200% 100%;border-radius:6px;animation:1.2s infinite sk}@keyframes sk{to{background-position:-200% 0}}.code{color:#e2e8f0;white-space:pre;background:#0f172a;border-radius:8px;padding:14px 16px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;overflow-x:auto}.kbd{background:var(--gray-soft);word-break:break-all;border-radius:4px;padding:2px 6px;font-family:ui-monospace,Menlo,monospace;font-size:12px}.toast{background:var(--text);color:#fff;z-index:100;border-radius:8px;max-width:calc(100vw - 32px);padding:12px 18px;position:fixed;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 8px 24px #0000002e}.toast.err{background:var(--red)}.modal-bg{z-index:50;background:#0f172a66;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal{background:var(--bg);border-radius:12px;flex-direction:column;gap:16px;width:520px;max-width:100%;max-height:calc(100vh - 32px);padding:24px;display:flex;overflow-y:auto}.auth-wrap{place-items:center;min-height:100vh;padding:16px;display:grid}.auth-card{background:var(--bg);border:1px solid var(--border);border-radius:12px;flex-direction:column;gap:16px;width:400px;max-width:100%;padding:32px;display:flex}@media (max-width:1200px){.grid-kpi{grid-template-columns:repeat(3,minmax(0,1fr))}.row{flex-direction:column}.side-col{width:auto}}@media (max-width:860px){.menu-btn{display:block}.sidebar{z-index:30;transition:transform .2s;position:fixed;top:60px;bottom:0;left:0;overflow-y:auto;transform:translate(-100%)}.sidebar.open{transform:none;box-shadow:8px 0 24px #0000001f}.content{padding:20px 16px 40px}.grid-kpi{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-2{grid-template-columns:1fr}.topbar{padding:0 16px}.hide-sm{display:none!important}}
