:root{--bg:#0e0e0e;--surface:#141414;--border:#212121;--control:#232323;--hover:#1d1d1d;--text:#fff;--muted:#686868;--accent:#3b82f6;--accent-rgb:59 130 246;--success:#34d399;--warning:#e8c547;--error:#f87171;--radius:8px;--radius-lg:10px;--font:'Montserrat',system-ui,sans-serif;--ease-out:cubic-bezier(.22,1,.36,1);--ease-std:cubic-bezier(.4,0,.2,1);--ease-spring:cubic-bezier(.3,1.4,.5,1)}@font-face{font-family:'Montserrat';src:url('fonts/Montserrat.ttf') format('truetype');font-weight:100 900;font-display:swap}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font);background:var(--bg);color:var(--text);min-height:100vh;user-select:none;-webkit-user-select:none;cursor:default;caret-color:transparent;-webkit-tap-highlight-color:transparent}input,textarea,[contenteditable="true"]{user-select:text;-webkit-user-select:text;cursor:text;caret-color:auto}button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}:focus{outline:none}*{scrollbar-width:thin;scrollbar-color:#2c2c2c transparent}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#2c2c2c;border-radius:8px;border:2px solid transparent;background-clip:padding-box}.app{display:flex;gap:24px;padding:16px}.sidebar{position:sticky;top:16px;align-self:flex-start;display:flex;flex-direction:column;gap:8px;width:240px;height:calc(100vh - 32px);flex-shrink:0;padding:8px;border-radius:12px;background:var(--surface);box-shadow:0 0 0 1px var(--border)}.content{flex:1;min-width:0}.page-title{font-size:28px;font-weight:700;text-transform:uppercase;line-height:1.2}.section-title{padding:0 4px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.stack{display:flex;flex-direction:column;gap:16px}.nav{position:relative;display:flex;flex-direction:column;gap:4px}.nav-indicator{position:absolute;top:0;left:0;width:100%;height:36px;border-radius:var(--radius);background:rgb(255 255 255 / .1);pointer-events:none;will-change:transform}.nav-indicator::before{content:'';position:absolute;top:8px;bottom:8px;left:0;width:3px;border-radius:9999px;background:var(--accent)}.nav-item{position:relative;display:flex;align-items:center;gap:10px;width:100%;height:36px;padding:0 12px;border-radius:var(--radius);text-align:left}.nav-item svg{width:16px;height:16px;flex-shrink:0;color:var(--muted);transition:color .15s var(--ease-std),transform .25s var(--ease-spring)}.nav-item span{font-size:14px;font-weight:500;color:rgb(255 255 255 / .8);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .15s var(--ease-std)}.nav-item:hover span,.nav-item.active span{color:var(--text)}.nav-item:hover svg{color:rgb(255 255 255 / .7);transform:translateX(2px) scale(1.08)}.nav-item.active svg{color:var(--accent)}.nav-item:focus-visible{box-shadow:inset 0 0 0 2px rgb(var(--accent-rgb) / .5)}.btn{height:36px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 16px;border-radius:var(--radius);font-size:13px;font-weight:700;color:inherit;text-decoration:none;transition:background-color .15s,color .15s,box-shadow .15s,transform .15s,opacity .15s}.btn:active:not(:disabled){transform:scale(.98)}.btn:disabled{cursor:not-allowed;opacity:.5}.btn:focus-visible{box-shadow:inset 0 0 0 2px rgb(var(--accent-rgb) / .5)}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover:not(:disabled){filter:brightness(1.12)}.btn-soft{background:rgb(255 255 255 / .05)}.btn-soft:hover{background:rgb(255 255 255 / .1)}.btn-ghost{color:var(--muted);box-shadow:inset 0 0 0 1px var(--border)}.btn-ghost:hover:not(:disabled){color:var(--text);background:var(--hover)}.btn-lg{height:44px;font-size:14px}.field{display:flex;flex-direction:column;gap:8px}.field-label{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.input{height:44px;display:flex;align-items:center;gap:8px;padding:0 12px;border-radius:var(--radius);background:var(--control);color:var(--muted);cursor:text;transition:box-shadow .15s}.input:focus-within{box-shadow:0 0 0 2px rgb(var(--accent-rgb) / .5)}.input input{flex:1;min-width:0;border:none;outline:none;background:transparent;font:inherit;font-size:14px;font-weight:600;color:var(--text)}.input input::placeholder{color:var(--muted)}.form-error{padding:10px 14px;border-radius:var(--radius);background:rgb(248 113 113 / .1);color:var(--error);font-size:13px;font-weight:600}.chips{position:relative;display:inline-flex;height:44px;border-radius:var(--radius);background:var(--control)}.chips-indicator{position:absolute;top:0;bottom:0;left:0;border-radius:var(--radius);background:var(--accent);pointer-events:none}.chip{position:relative;padding:0 18px;border-radius:var(--radius);font-size:14px;font-weight:500;color:var(--muted);transition:color .18s}.chip:hover{color:rgb(255 255 255 / .7)}.chip[aria-pressed="true"]{color:#fff}.pills{display:flex;flex-wrap:wrap;gap:4px;padding:4px;min-height:44px;align-items:center;border-radius:var(--radius);background:var(--control)}.pills button{height:36px;padding:0 14px;border-radius:6px;font-size:13px;font-weight:500;color:var(--muted);white-space:nowrap;transition:background-color .18s,color .18s}.pills button:hover{color:rgb(255 255 255 / .8)}.pills button[aria-pressed="true"]{background:rgb(255 255 255 / .1);color:var(--text)}.count{margin-left:6px;padding:1px 6px;border-radius:6px;background:var(--accent);color:#fff;font-size:11px;font-weight:700}.table{--cols:minmax(180px,1.4fr) minmax(140px,1fr) minmax(120px,.8fr) minmax(90px,.6fr)}.table-head,.row{display:grid;grid-template-columns:var(--cols);align-items:center;gap:12px;padding:0 16px}.table-head{padding-bottom:8px}.th{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.table-body{display:flex;flex-direction:column;gap:8px}.row{position:relative;min-height:56px;border-radius:var(--radius-lg);background:var(--surface);box-shadow:inset 0 0 0 1px var(--border);font-size:14px;transition:background-color .2s;animation:row-slide .5s cubic-bezier(.2,.8,.2,1) backwards;animation-delay:var(--delay,0s)}.row::before{content:'';position:absolute;left:0;top:22%;bottom:22%;width:3px;border-radius:0 3px 3px 0;background:var(--accent);transform:scaleY(0);transition:transform .25s var(--ease-spring)}.row:hover{background:#181818}.row:hover::before{transform:scaleY(1)}.cell{min-width:0;padding:12px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.empty{padding:28px 12px;text-align:center;font-size:13px;font-weight:600;color:var(--muted)}.avatar{position:relative;width:36px;height:36px;flex-shrink:0;border-radius:50%;background:var(--control);display:grid;place-items:center;font-size:13px;font-weight:700;color:rgb(255 255 255 / .7)}.avatar .dot{position:absolute;right:0;bottom:0;width:10px;height:10px;border-radius:50%;background:var(--muted);box-shadow:0 0 0 2px var(--bg)}.avatar .dot.online{background:var(--success);animation:online 2.4s ease-in-out infinite}.panel,.card,.stat{position:relative;border-radius:var(--radius-lg);background:var(--surface);box-shadow:inset 0 0 0 1px var(--border)}.panel{display:flex;flex-direction:column;gap:4px;padding:8px}.card{display:flex;flex-direction:column;gap:12px;padding:14px;transition:box-shadow .15s,transform .3s cubic-bezier(.2,.8,.2,1)}.card:hover{transform:translateY(-3px);box-shadow:inset 0 0 0 1px rgb(255 255 255 / .12)}.stat{display:flex;flex-direction:column;gap:8px;min-height:96px;padding:12px 16px;animation:stat-in .55s cubic-bezier(.2,.8,.2,1) backwards}.stat-value{font-size:24px;line-height:1;font-weight:700;font-variant-numeric:tabular-nums}.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;perspective:900px}.stats .stat:nth-child(2){animation-delay:.05s}.stats .stat:nth-child(3){animation-delay:.1s}.stats .stat:nth-child(4){animation-delay:.15s}.panel::after,.card::after,.stat::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(320px circle at var(--mx,50%) var(--my,50%),rgb(255 255 255 / .055),transparent 65%);opacity:0;transition:opacity .3s}.panel:hover::after,.card:hover::after,.stat:hover::after{opacity:1}.tag{display:inline-flex;align-self:flex-start;align-items:center;height:26px;padding:0 10px;border-radius:6px;font-size:12px;font-weight:700;white-space:nowrap;color:var(--c,var(--accent));background:color-mix(in srgb,var(--c,var(--accent)) 14%,transparent)}.tone-muted{--c:#8a8a8a}.tone-blue{--c:#60a5fa}.tone-green{--c:#4ade80}.tone-yellow{--c:var(--warning)}.tone-orange{--c:#fb923c}.dd-trigger{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 10px 0 12px;border-radius:var(--radius);background:var(--control);text-align:left;transition:box-shadow .2s var(--ease-std),background-color .2s,transform .12s}.dd-trigger:active{transform:scale(.98)}.dd-trigger:focus-visible,.dd-trigger[aria-expanded="true"]{box-shadow:0 0 0 2px rgb(var(--accent-rgb) / .5)}.dd-trigger .dd-value{font-size:13px;font-weight:600;color:rgb(255 255 255 / .8);white-space:nowrap}.dd-chevron{width:14px;height:14px;color:var(--muted);transition:transform .2s var(--ease-std),color .15s}.dd-trigger[aria-expanded="true"] .dd-chevron{transform:rotate(180deg);color:var(--text)}.dd-trigger.tinted{background:color-mix(in srgb,var(--c) 14%,transparent)}.dd-trigger.tinted:hover{background:color-mix(in srgb,var(--c) 22%,transparent)}.dd-trigger.tinted .dd-value{color:var(--c);font-weight:700}.dd-trigger.tinted[aria-expanded="true"]{box-shadow:0 0 0 2px color-mix(in srgb,var(--c) 55%,transparent)}.dd-menu{position:fixed;z-index:45;display:flex;flex-direction:column;gap:2px;padding:4px;min-width:200px;border-radius:var(--radius-lg);background:var(--surface);box-shadow:0 0 0 1px var(--border),0 10px 30px rgb(0 0 0 / .5)}.dd-menu[hidden]{display:none}.dd-menu.in{animation:dd-in .2s var(--ease-out)}.dd-menu.out{animation:dd-out .14s cubic-bezier(.4,0,1,1) forwards;pointer-events:none}.dd-opt{position:relative;width:100%;height:32px;padding:0 12px;border-radius:var(--radius);text-align:left;font-size:13px;font-weight:500;color:rgb(255 255 255 / .7);white-space:nowrap;transition:background-color .2s var(--ease-std),color .2s var(--ease-std),transform .12s}.dd-opt:active{transform:scale(.985)}.dd-opt:hover{background:var(--hover);color:var(--text)}.dd-opt.on{background:rgb(255 255 255 / .1);color:var(--text)}.dd-opt::before{content:'';position:absolute;top:8px;bottom:8px;left:0;width:3px;border-radius:9999px;background:var(--accent);opacity:0;transform:scaleY(.2);transition:opacity .18s var(--ease-std),transform .3s var(--ease-spring)}.dd-opt.on::before{opacity:1;transform:none}.dd-opt[class*="tone-"]{color:color-mix(in srgb,var(--c) 80%,transparent)}.dd-opt[class*="tone-"]:hover{background:color-mix(in srgb,var(--c) 10%,transparent);color:var(--c)}.dd-opt[class*="tone-"].on{background:color-mix(in srgb,var(--c) 16%,transparent);color:var(--c)}.dd-opt[class*="tone-"]::before{background:var(--c)}.dd-sep{height:1px;margin:2px 8px;border:none;background:var(--border)}.popover{position:fixed;z-index:40;width:380px;max-height:min(580px,calc(100vh - 120px));display:flex;flex-direction:column;border-radius:14px;background:var(--surface);box-shadow:0 0 0 1px var(--border),0 24px 60px rgb(0 0 0 / .6);animation:pop-in .25s cubic-bezier(.2,.9,.3,1.1)}.popover[hidden]{display:none}.toast{position:fixed;left:50%;bottom:24px;z-index:100;padding:12px 18px;border-radius:var(--radius-lg);background:var(--control);box-shadow:0 0 0 1px var(--border),0 10px 30px rgb(0 0 0 / .5);font-size:14px;font-weight:600;opacity:0;transform:translate(-50%,12px);pointer-events:none;transition:opacity .2s,transform .2s cubic-bezier(0,0,.2,1)}.toast.show{opacity:1;transform:translate(-50%,0)}.page:not([hidden]){animation:page-in .5s cubic-bezier(.2,.7,.2,1)}@keyframes page-in{from{opacity:0;transform:translateY(12px);filter:blur(8px)}}@keyframes row-slide{from{opacity:0;transform:translateX(-18px);filter:blur(5px);clip-path:inset(0 100% 0 0 round 10px)}60%{clip-path:inset(0 0 0 0 round 10px)}to{opacity:1;transform:none;filter:none;clip-path:inset(0 0 0 0 round 10px)}}@keyframes stat-in{from{opacity:0;transform:translateY(16px) rotateX(18deg) scale(.96);filter:blur(6px)}}@keyframes online{0%,100%{box-shadow:0 0 0 2px var(--bg),0 0 0 2px rgb(52 211 153 / 0)}50%{box-shadow:0 0 0 2px var(--bg),0 0 0 6px rgb(52 211 153 / .25)}}@keyframes pop-in{from{opacity:0;transform:translateY(8px) scale(.96);filter:blur(4px)}}@keyframes dd-in{from{opacity:0;transform:translateY(-6px) scale(.98)}}@keyframes dd-out{to{opacity:0;transform:translateY(-4px) scale(.98)}}@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media (max-width:767px){.app{flex-direction:column}.sidebar{position:static;width:100%;height:auto}.table-head{display:none}.row{grid-template-columns:1fr auto;gap:0 12px;padding:4px 14px}.row .cell:first-child{grid-column:1 / -1}}