:root{--bg:#0b0b0f;--panel:#121219;--panel2:#181822;--p:#9b4dff;--b:#2f8cff;--t:#ececf2;--m:#8c8c9c;--line:rgba(255,255,255,.08);--good:#3ddc97;--warn:#ffb547;--bad:#ff5c7a;--glow:rgba(122,100,255,.35)}
[data-theme=light]{--bg:#f5f4fa;--panel:#fff;--panel2:#f0eef8;--t:#16161f;--m:#6b6b7c;--line:rgba(20,10,60,.1);--glow:rgba(122,100,255,.18)}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--t);font:300 15px/1.6 Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}button,input,select{font:inherit;color:inherit}
h1,h2,h3,h4,.mont,.btn,.nav a,.tab{font-family:Montserrat,Inter,sans-serif}
.grad{background:linear-gradient(90deg,var(--p),var(--b));-webkit-background-clip:text;background-clip:text;color:transparent}
.shell{display:grid;grid-template-columns:250px 1fr;min-height:100vh}
.side{position:sticky;top:0;height:100vh;overflow:auto;border-right:1px solid var(--line);background:var(--panel);padding:22px 14px;display:flex;flex-direction:column;gap:4px}
.brand{display:flex;align-items:center;gap:10px;padding:4px 10px 22px;text-transform:uppercase;letter-spacing:.28em;font-size:10px;font-weight:500;font-family:Montserrat}
.brand img{width:34px;height:34px;border-radius:8px}
.nav a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--m);font-weight:500}
.nav a:hover{background:var(--panel2);color:var(--t)}
.nav a.on{background:linear-gradient(90deg,rgba(155,77,255,.22),rgba(47,140,255,.1));color:var(--t);box-shadow:inset 2px 0 0 var(--p)}
.nav .ic{width:18px;text-align:center;font-size:14px}
.nav .sec{font-size:9px;letter-spacing:.3em;color:var(--m);opacity:.6;padding:16px 12px 6px;text-transform:uppercase}
.main{min-width:0}
.top{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:16px 32px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--bg) 85%,transparent);backdrop-filter:blur(10px)}
.top h1{font-weight:300;font-size:20px;letter-spacing:.12em;text-transform:uppercase}.top .sub{color:var(--m);font-size:12px}
.tools{display:flex;gap:10px;align-items:center}
.pill{border:1px solid var(--line);background:var(--panel);border-radius:999px;padding:7px 12px;font-size:11px;letter-spacing:.12em;cursor:pointer}
.pill.on{background:linear-gradient(90deg,var(--p),var(--b));color:#fff;border-color:transparent}
.seg{display:flex;border:1px solid var(--line);border-radius:999px;overflow:hidden}.seg .pill{border:0;border-radius:0}
.avatar{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--p),var(--b));display:grid;place-items:center;color:#fff;font-weight:600;font-size:12px}
.demo-banner{background:linear-gradient(90deg,rgba(155,77,255,.18),rgba(47,140,255,.12));border-bottom:1px solid var(--line);text-align:center;font-size:11px;letter-spacing:.2em;text-transform:uppercase;padding:7px;color:var(--t)}
.page{padding:28px 32px 60px;max-width:1320px}
.grid{display:grid;gap:18px}.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
@media(max-width:1100px){.g3,.g4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:800px){.shell{grid-template-columns:1fr}.side{display:none}.g2,.g3,.g4{grid-template-columns:1fr}}
.card{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:22px;position:relative}
.card h3{font-size:12px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;margin-bottom:4px}
.card .hint{color:var(--m);font-size:12px;margin-bottom:14px}
.hero{display:grid;grid-template-columns:320px 1fr;gap:24px;overflow:hidden;background:radial-gradient(60% 90% at 10% 0%,rgba(155,77,255,.22),transparent 60%),radial-gradient(50% 80% at 90% 100%,rgba(47,140,255,.14),transparent 60%),var(--panel)}
@media(max-width:1000px){.hero{grid-template-columns:1fr}}
.big{font-family:Montserrat;font-weight:200;font-size:88px;line-height:1;letter-spacing:.02em}
.eyebrow{text-transform:uppercase;letter-spacing:.34em;font-size:10px;color:var(--m);font-weight:500;margin-bottom:10px;font-family:Montserrat}
.chip{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:999px;font-size:11px;font-weight:500}
.chip.up{background:rgba(61,220,151,.12);color:var(--good)}.chip.down{background:rgba(255,92,122,.12);color:var(--bad)}
.badge{display:inline-block;padding:3px 10px;border-radius:999px;font-size:10px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;border:1px solid currentColor;white-space:nowrap}
.b-neg,.b-bad{color:var(--bad)}.b-pos,.b-good,.b-deleted{color:var(--good)}.b-inq,.b-warn{color:var(--warn)}.b-repaired{color:var(--b)}.b-in_dispute{color:var(--p)}.b-dnd{color:var(--bad)}.b-mine{color:var(--m)}.b-info{color:var(--b)}
.btn{display:inline-flex;align-items:center;gap:8px;padding:11px 20px;border-radius:999px;text-transform:uppercase;letter-spacing:.2em;font-size:10px;font-weight:600;border:1px solid var(--line);background:var(--panel2);cursor:pointer;transition:transform .2s,box-shadow .2s}
.btn.primary{background:linear-gradient(90deg,var(--p),var(--b));color:#fff;border:0;box-shadow:0 10px 30px -12px var(--glow)}
.btn:hover{transform:translateY(-1px)}.btn.sm{padding:7px 12px;font-size:9px}
.gauge{text-align:center}.gauge svg{width:100%;max-width:220px}
.gauge .bn{font-family:Montserrat;letter-spacing:.24em;text-transform:uppercase;font-size:11px;font-weight:500;display:flex;justify-content:space-between;align-items:center}
.tile{background:var(--panel2);border-radius:14px;padding:16px;text-align:center}
.tile .n{font-family:Montserrat;font-weight:200;font-size:36px}.tile .l{font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--m)}
.bar{height:6px;border-radius:9px;background:var(--panel2);overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--p),var(--b));border-radius:9px}
.row{display:flex;align-items:center;gap:12px}.between{justify-content:space-between}.wrap{flex-wrap:wrap}
.muted{color:var(--m)}.small{font-size:12px}.mt{margin-top:18px}.mb{margin-bottom:18px}
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.tab{padding:8px 14px;border-radius:999px;font-size:10px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;cursor:pointer;border:1px solid var(--line);background:transparent;color:var(--m)}
.tab.on{color:var(--t);background:linear-gradient(90deg,rgba(155,77,255,.25),rgba(47,140,255,.15));border-color:rgba(155,77,255,.5)}
.search{width:100%;padding:12px 16px;border-radius:12px;border:1px solid var(--line);background:var(--panel2);outline:none}
.search:focus,.field input:focus,.field select:focus{border-color:var(--p)}
table{width:100%;border-collapse:collapse;font-size:13px}th{text-align:left;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--m);font-weight:500;padding:10px 12px;border-bottom:1px solid var(--line)}
td{padding:14px 12px;border-bottom:1px solid var(--line);vertical-align:top}tr.dnd td{background:rgba(255,92,122,.09)}tr.dnd td:first-child{box-shadow:inset 3px 0 0 var(--bad)}
.name{font-weight:500}.mono{font-family:ui-monospace,monospace;font-size:12px;color:var(--m)}
.timeline{display:flex;align-items:center;gap:0;margin-top:10px;flex-wrap:wrap}
.tl{display:flex;align-items:center}.tl .dot{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:10px;font-weight:600;border:1px solid var(--line);background:var(--panel2)}
.tl .lbl{font-size:10px;color:var(--m);margin:0 8px 0 6px;white-space:nowrap}.tl .ln{width:24px;height:1px;background:var(--line)}
.dot.Deleted{background:var(--good);color:#06140d;border:0}.dot.Updated{background:var(--b);color:#fff;border:0}.dot.Verified{background:var(--warn);color:#1b1200;border:0}.dot.In{background:var(--p);color:#fff;border:0}
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}.field label{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--m)}
.field input,.field select{padding:11px 14px;border-radius:10px;border:1px solid var(--line);background:var(--panel2);outline:none}
.result{background:linear-gradient(135deg,rgba(155,77,255,.16),rgba(47,140,255,.1));border-radius:14px;padding:16px;margin-top:6px}
.result .n{font-family:Montserrat;font-size:30px;font-weight:300}
.drop{border:1.5px dashed rgba(155,77,255,.5);border-radius:16px;padding:34px;text-align:center;background:rgba(155,77,255,.05);cursor:pointer;transition:.2s}.drop.over{background:rgba(155,77,255,.15)}
.check{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}.check .ck{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:11px}
.ck.y{background:var(--good);color:#06140d}.ck.n{border:1px dashed var(--warn);color:var(--warn)}
.pdf{background:#fff;color:#1a1a22;border-radius:10px;padding:44px 48px;min-height:640px;font:13px/1.7 Georgia,serif;box-shadow:0 20px 60px -20px rgba(0,0,0,.6)}
.pdf h4{font-family:Montserrat;letter-spacing:.2em;font-size:12px;text-transform:uppercase;margin-bottom:18px}
.list-item{padding:14px;border-radius:12px;border:1px solid var(--line);margin-bottom:10px;cursor:pointer}.list-item.on{border-color:var(--p);background:rgba(155,77,255,.08)}
.alert{display:flex;gap:14px;padding:16px;border-bottom:1px solid var(--line)}.alert .ai{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;flex:none}
.ai.good{background:rgba(61,220,151,.15);color:var(--good)}.ai.bad{background:rgba(255,92,122,.15);color:var(--bad)}.ai.warn{background:rgba(255,181,71,.15);color:var(--warn)}.ai.info{background:rgba(47,140,255,.15);color:var(--b)}
details{border-bottom:1px solid var(--line);padding:14px 0}summary{cursor:pointer;font-family:Montserrat;font-weight:500;font-size:14px}details p{color:var(--m);margin-top:8px}
.toggle{width:42px;height:24px;border-radius:99px;background:var(--panel2);border:1px solid var(--line);position:relative;cursor:pointer;flex:none}.toggle::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:var(--m);transition:.2s}.toggle.on{background:linear-gradient(90deg,var(--p),var(--b))}.toggle.on::after{left:21px;background:#fff}
.login{min-height:100vh;display:grid;place-items:center;background:radial-gradient(50% 40% at 50% 30%,rgba(155,77,255,.2),transparent 70%),radial-gradient(40% 35% at 60% 70%,rgba(47,140,255,.14),transparent 70%),var(--bg);padding:20px}
.login .box{width:min(420px,100%);text-align:center}.login .star{width:130px;margin:0 auto 20px;filter:drop-shadow(0 0 30px rgba(155,77,255,.6));mix-blend-mode:screen;animation:float 7s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-10px)}}
.login h2{font-family:Montserrat;font-weight:200;letter-spacing:.14em;text-transform:uppercase;font-size:26px;margin-bottom:6px}
.perk{overflow:hidden}.perk .glow{position:absolute;inset:auto -40px -60px auto;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(155,77,255,.3),transparent 70%)}
.ring{position:relative;width:170px;height:170px}.ring svg{transform:rotate(-90deg)}.ring .c{position:absolute;inset:0;display:grid;place-items:center;text-align:center}
.foot{color:var(--m);font-size:11px;text-align:center;padding:30px;border-top:1px solid var(--line);margin-top:30px}
.kv{display:grid;grid-template-columns:1fr 1fr;gap:10px 20px}.kv div span{display:block;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--m)}
.toast{position:fixed;bottom:24px;right:24px;background:var(--panel);border:1px solid var(--p);padding:12px 18px;border-radius:12px;z-index:50;box-shadow:0 10px 30px -10px var(--glow)}
.shell{background:linear-gradient(90deg,var(--panel) 250px,var(--bg) 250px)}@media(max-width:800px){.shell{background:var(--bg)}}
