@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";
:root{--bg-app:#f7f8fc;--bg-sidebar:#eef2fb;--bg-card:#fff;--bg-subtle:#f4f6fa;--bg-hover:#edf1f9;--border:#e4e8f0;--border-strong:#d2d9e6;--text:#1a1f2e;--text-body:#3f4759;--text-muted:#7a8394;--text-faint:#a5adbc;--brand:#2563eb;--brand-hover:#1d4ed8;--brand-soft:#e8effe;--brand-ring:#2563eb47;--gold:#c9962f;--gold-soft:#fbf3e2;--success:#0e9f6e;--success-soft:#e3f5ee;--warning:#c2721b;--warning-soft:#fdf1e1;--danger:#d64545;--danger-soft:#fceaea;--info:#2563eb;--info-soft:#e8effe;--s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:20px;--s-6:24px;--s-8:32px;--s-10:40px;--s-12:48px;--r-sm:6px;--r-md:10px;--r-lg:14px;--r-full:999px;--t-metric:30px;--t-h1:22px;--t-h2:16px;--t-body:14px;--t-sm:13px;--t-label:11px;--shadow-card:0 1px 2px #1018280a, 0 1px 3px #1018280f;--shadow-pop:0 8px 24px #1018281a, 0 2px 6px #1018280f;--font:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--color-bg:var(--bg-app);--color-surface:var(--bg-card);--color-surface-raised:var(--bg-subtle);--color-border:var(--border);--color-border-strong:var(--border-strong);--color-border-hover:var(--border-strong);--color-divider:var(--border);--color-text:var(--text);--color-text-muted:var(--text-muted);--color-text-dim:var(--text-faint);--color-danger:var(--danger);--color-gold:var(--gold);--color-gold-hover:#b3862a;--color-avatar-bg:var(--brand);--sidebar-width-full:236px;--sidebar-width-mobile:260px}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg-app);font-family:var(--font);color:var(--text-body);font-size:var(--t-body);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}input::placeholder{color:var(--text-faint)}button,input,select{color:inherit;font-family:inherit}.tabular-nums,.num{font-variant-numeric:tabular-nums}:focus-visible{outline:2px solid var(--brand-ring);outline-offset:2px}@keyframes pulse{0%,to{opacity:1}50%{opacity:.45}}.skeleton{background:var(--bg-subtle);border-radius:var(--r-sm);animation:1.5s ease-in-out infinite pulse}.shell{min-height:100vh;display:flex}.sidebar{width:var(--sidebar-width-full);background:var(--bg-sidebar);border-right:1px solid var(--border);z-index:30;flex-direction:column;flex:none;height:100vh;display:flex;position:sticky;top:0}.brand{align-items:center;gap:var(--s-3);padding:var(--s-5);border-bottom:1px solid var(--border);display:flex}.brand .name{font-size:var(--t-body);color:var(--text);font-weight:650;line-height:1.2}.brand .sub{font-size:var(--t-label);color:var(--text-muted);letter-spacing:.04em}.nav{padding:var(--s-4) 0;flex:1;overflow-y:auto}.nav-group{font-size:var(--t-label);text-transform:uppercase;letter-spacing:.09em;color:var(--text-muted);padding:var(--s-4) var(--s-5) var(--s-2);font-weight:600}.nav-item{align-items:center;gap:var(--s-3);padding:9px var(--s-5);color:var(--text-body);font-size:var(--t-body);cursor:pointer;border-left:2px solid #0000;display:flex}.nav-item:hover{background:var(--bg-hover)}.nav-item.active{background:var(--brand-soft);color:var(--brand);border-left-color:var(--brand);font-weight:600}.nav-item.disabled{color:var(--text-faint);cursor:default}.nav-item.disabled:hover{background:0 0}.nav-item .ico{opacity:.8;flex:none;width:16px}.nav-item.active .ico{opacity:1}.sidebar-foot{border-top:1px solid var(--border);padding:var(--s-4) var(--s-5);color:var(--text-faint);font-size:12px}.main{flex-direction:column;flex:1;min-width:0;display:flex}.topbar{align-items:center;gap:var(--s-4);padding:var(--s-4) var(--s-6);background:var(--bg-card);border-bottom:1px solid var(--border);z-index:20;display:flex;position:sticky;top:0}.crumb{font-size:var(--t-sm);color:var(--text-muted)}.crumb b{color:var(--text);font-weight:600}.topbar .spacer{flex:1}.menu-button{border-radius:var(--r-sm);border:1px solid var(--border);background:var(--bg-card);cursor:pointer;justify-content:center;align-items:center;width:34px;height:34px;display:none}@media (max-width:900px){.sidebar{transition:left .2s;position:fixed;left:-100%}.sidebar.open{width:var(--sidebar-width-mobile);left:0}.menu-button{display:flex}.backdrop{z-index:25;background:#10182859;border:none;position:fixed;inset:0}}.icon-btn{border-radius:var(--r-sm);border:1px solid var(--border);background:var(--bg-card);width:34px;height:34px;color:var(--text-muted);cursor:pointer;justify-content:center;align-items:center;display:flex;position:relative}.icon-btn:hover{background:var(--bg-subtle);color:var(--text)}.icon-btn .dot{background:var(--danger);border:2px solid var(--bg-card);border-radius:50%;width:7px;height:7px;position:absolute;top:6px;right:6px}.avatar{border-radius:var(--r-sm);background:var(--brand);color:#fff;width:34px;height:34px;font-weight:600;font-size:var(--t-sm);cursor:pointer;border:none;justify-content:center;align-items:center;display:flex}.menu-wrap{position:relative}.menu,.notif{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r-md);box-shadow:var(--shadow-pop);z-index:40;position:absolute;top:42px;right:0;overflow:hidden}.menu{width:266px}.menu-head{gap:var(--s-3);padding:var(--s-4);border-bottom:1px solid var(--border);align-items:center;display:flex}.menu-head .av{background:var(--brand);color:#fff;border-radius:50%;flex:none;justify-content:center;align-items:center;width:40px;height:40px;font-weight:600;display:flex}.menu-head .who{color:var(--text);font-weight:650;font-size:var(--t-body)}.menu-head .role{color:var(--text-muted);font-size:12px}.menu-item{align-items:center;gap:var(--s-3);width:100%;padding:11px var(--s-4);color:var(--text-body);cursor:pointer;font-size:var(--t-body);text-align:left;background:0 0;border:none;display:flex}.menu-item:hover{background:var(--bg-subtle)}.menu-item.danger{color:var(--danger);border-top:1px solid var(--border)}.notif{width:330px}.notif-head{padding:var(--s-4);border-bottom:1px solid var(--border);color:var(--text);font-weight:650;font-size:var(--t-body);align-items:center;display:flex}.notif-head .spacer{flex:1}.notif-head button{color:var(--brand);cursor:pointer;background:0 0;border:none;font-size:12px;font-weight:600}.notif-head button:disabled{color:var(--text-faint);cursor:default}.notif-list{max-height:360px;overflow-y:auto}.notif-item{gap:var(--s-3);padding:var(--s-3) var(--s-4);border-bottom:1px solid var(--border);display:flex}.notif-item:hover{background:var(--bg-subtle)}.notif-item .dot{background:var(--brand);border-radius:50%;flex:none;width:8px;height:8px;margin-top:6px}.notif-item .dot.read{background:var(--border-strong)}.notif-item .txt{font-size:var(--t-sm);color:var(--text-body);line-height:1.45}.notif-item .txt b{color:var(--text)}.notif-item .when{color:var(--text-faint);margin-top:3px;font-size:11px}.notif-empty{padding:var(--s-6) var(--s-4);text-align:center;font-size:var(--t-sm);color:var(--text-muted)}.notif-compose{padding:var(--s-3) var(--s-4);border-top:1px solid var(--border);gap:var(--s-2);flex-direction:column;display:flex}.notif-compose select,.notif-compose input{border:1px solid var(--border-strong);border-radius:var(--r-sm);padding:6px var(--s-2);font-size:var(--t-sm);background:var(--bg-card);color:var(--text)}.page{padding:var(--s-6);gap:var(--s-5);flex-direction:column;width:100%;max-width:1560px;display:flex}.page-head{align-items:flex-end;gap:var(--s-4);flex-wrap:wrap;display:flex}h1{font-size:var(--t-h1);color:var(--text);margin:0;font-weight:650}.page-head .sub{font-size:var(--t-sm);color:var(--text-muted);margin-top:2px}.page-head .spacer{flex:1}.select{align-items:center;gap:var(--s-2);background:var(--bg-card);border:1px solid var(--border-strong);border-radius:var(--r-sm);padding:7px var(--s-3);font-size:var(--t-sm);color:var(--text-body);cursor:pointer;appearance:none;display:inline-flex}.select:hover{background:var(--bg-subtle)}.btn{align-items:center;gap:var(--s-2);background:var(--brand);color:#fff;border-radius:var(--r-sm);padding:9px var(--s-4);font-size:var(--t-sm);cursor:pointer;border:none;font-family:inherit;font-weight:600;display:inline-flex}.btn:hover{background:var(--brand-hover)}.btn:disabled{opacity:.6;cursor:default}.btn.ghost{background:var(--bg-card);color:var(--text-body);border:1px solid var(--border-strong)}.btn.ghost:hover{background:var(--bg-subtle)}.btn.danger{background:var(--danger)}.btn.danger:hover{background:#b93838}.stats{gap:var(--s-4);grid-template-columns:repeat(auto-fit,minmax(228px,1fr));display:grid}.stat{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--s-5);box-shadow:var(--shadow-card);gap:var(--s-3);flex-direction:column;display:flex}.stat .top{align-items:flex-start;gap:var(--s-3);display:flex}.stat .ico{border-radius:var(--r-md);background:var(--brand-soft);width:38px;height:38px;color:var(--brand);flex:none;justify-content:center;align-items:center;display:flex}.stat .val{font-size:var(--t-metric);color:var(--text);font-weight:650;line-height:1}.stat .delta{font-size:12px;font-weight:600}.stat .delta.up{color:var(--success)}.stat .delta.down{color:var(--danger)}.stat .label{font-size:var(--t-sm);color:var(--text-muted)}.grid-2{gap:var(--s-4);grid-template-columns:2fr 1fr;align-items:stretch;display:grid}@media (max-width:1100px){.grid-2{grid-template-columns:1fr}}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-card)}.card-head{align-items:center;gap:var(--s-3);padding:var(--s-5) var(--s-5) var(--s-3);display:flex}.card-head h2{font-size:var(--t-h2);color:var(--text);margin:0;font-weight:650}.card-head .sub{color:var(--text-muted);margin-top:1px;font-size:12px}.card-head .spacer{flex:1}.card-body{padding:0 var(--s-5) var(--s-5)}.funnel{gap:var(--s-2);flex-direction:column;display:flex}.fstage{align-items:center;gap:var(--s-4);display:flex}.fstage .fname{width:96px;font-size:var(--t-label);text-transform:uppercase;letter-spacing:.07em;color:var(--text-muted);flex:none;font-weight:600}.fstage .ftrack{background:var(--bg-subtle);border-radius:var(--r-sm);flex:1;height:30px;overflow:hidden}.fstage .fbar{background:var(--brand);border-radius:var(--r-sm);opacity:.85;height:100%}.fstage .fbar.win{background:var(--success)}.fstage .fcount{text-align:right;width:44px;color:var(--text);font-weight:650}.fconv{color:var(--text-muted);align-items:center;height:18px;padding-left:112px;font-size:12px;display:flex}.rep{align-items:center;gap:var(--s-3);padding:var(--s-3) 0;display:flex}.rep+.rep{border-top:1px solid var(--border)}.rep .av{background:var(--brand-soft);width:30px;height:30px;color:var(--brand);border-radius:50%;flex:none;justify-content:center;align-items:center;font-size:12px;font-weight:600;display:flex}.rep .nm{font-size:var(--t-body);color:var(--text);flex:1}.rep .track{background:var(--bg-subtle);border-radius:var(--r-full);flex:none;width:96px;height:6px;overflow:hidden}.rep .fill{background:var(--brand);border-radius:var(--r-full);height:100%}.rep .n{text-align:right;width:28px;color:var(--text);font-weight:600}table{border-collapse:collapse;width:100%}thead th{font-size:var(--t-label);text-transform:uppercase;letter-spacing:.07em;color:var(--text-muted);text-align:left;padding:var(--s-3) var(--s-5);background:var(--bg-subtle);border-bottom:1px solid var(--border);white-space:nowrap;font-weight:600}thead th button{cursor:pointer;font:inherit;color:inherit;text-transform:inherit;letter-spacing:inherit;background:0 0;border:none;padding:0}tbody td{padding:13px var(--s-5);border-bottom:1px solid var(--border);font-size:var(--t-body);color:var(--text-body)}tbody tr[tabindex],tbody tr.clickable{cursor:pointer}tbody tr:hover{background:var(--bg-hover)}tbody tr:last-child td{border-bottom:none}td .strong{color:var(--text);font-weight:600}.badge{border-radius:var(--r-full);white-space:nowrap;align-items:center;gap:5px;padding:3px 9px;font-size:12px;font-weight:600;display:inline-flex}.badge.neutral{background:var(--bg-subtle);color:var(--text-muted)}.badge.info{background:var(--info-soft);color:var(--info)}.badge.success{background:var(--success-soft);color:var(--success)}.badge.warning{background:var(--warning-soft);color:var(--warning)}.badge.danger{background:var(--danger-soft);color:var(--danger)}.empty{padding:var(--s-12) var(--s-6);text-align:center}.empty h3{font-size:var(--t-h2);color:var(--text);margin:0 0 6px}.empty p{font-size:var(--t-sm);color:var(--text-muted);margin:0 0 var(--s-4)}.drawer-backdrop{z-index:45;background:#10182859;border:none;position:fixed;inset:0}.drawer{background:var(--bg-card);border-left:1px solid var(--border);width:400px;max-width:92vw;height:100vh;box-shadow:var(--shadow-pop);z-index:46;flex-direction:column;display:flex;position:fixed;top:0;right:0}.drawer-header{align-items:center;gap:var(--s-3);padding:var(--s-5);border-bottom:1px solid var(--border);display:flex}.drawer-header h2{font-size:var(--t-h2);flex:1;margin:0}.drawer-close{border-radius:var(--r-sm);border:1px solid var(--border);background:var(--bg-card);cursor:pointer;width:30px;height:30px}.drawer-body{padding:var(--s-5);gap:var(--s-4);flex-direction:column;flex:1;display:flex;overflow-y:auto}.drawer-fields{gap:var(--s-2) var(--s-4);font-size:var(--t-sm);grid-template-columns:auto 1fr;display:grid}.drawer-fields span:nth-child(odd){color:var(--text-muted)}.drawer-footer{padding:var(--s-4) var(--s-5);border-top:1px solid var(--border);gap:var(--s-3);display:flex}.field{margin-bottom:var(--s-4)}.field label{font-size:var(--t-label);text-transform:uppercase;letter-spacing:.07em;color:var(--text-muted);margin-bottom:6px;font-weight:600;display:block}.field input,.field select,.field textarea{width:100%;padding:10px var(--s-3);border:1px solid var(--border-strong);border-radius:var(--r-sm);font-size:var(--t-body);color:var(--text);background:var(--bg-card);font-family:inherit}.field input:disabled{color:var(--text-muted);background:var(--bg-subtle)}.field-hint{color:var(--text-muted);margin-top:-var(--s-2);margin-bottom:var(--s-4);font-size:12px}.error-text{font-size:var(--t-sm);color:var(--danger);margin-bottom:var(--s-3)}.success-text{font-size:var(--t-sm);color:var(--success);margin-bottom:var(--s-3)}.btn-full{justify-content:center;width:100%;padding:11px}.login-page{background:var(--bg-app);min-height:100vh;padding:var(--s-6);justify-content:center;align-items:center;display:flex}.login-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r-lg);width:380px;max-width:100%;box-shadow:var(--shadow-pop);padding:var(--s-8)}.login-card .lbrand{align-items:center;gap:var(--s-3);margin-bottom:var(--s-6);flex-direction:column;display:flex}.login-card .lbrand .nm{color:var(--text);font-size:18px;font-weight:650}.login-card .lbrand .sb{font-size:var(--t-label);letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted)}
