/* Theme layer: dark violet fintech look. Loaded after app.css. */
:root{
  --bg:#080a17; --bg-soft:#0c1022; --panel:#0f1428; --panel-2:#141a33;
  --line:rgba(255,255,255,.07); --line-soft:rgba(255,255,255,.05);
  --text:#eef0fb; --muted:#8d93b3;
  --violet:#7c5cf5; --violet-2:#a78bfa; --cyan:#22d3ee;
  --grad:linear-gradient(135deg,#7c5cf5 0%,#9b7bf7 55%,#6d83f5 100%);
  --radius:18px; --radius-sm:12px; --sidebar:268px;
  --shadow:0 24px 50px -28px rgba(0,0,0,.95);
}
body{
  font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background:
    radial-gradient(900px 520px at 15% -10%,rgba(124,92,245,.16),transparent 60%),
    radial-gradient(800px 460px at 95% 0%,rgba(34,211,238,.07),transparent 55%),
    var(--bg);
}
.mono,.eyebrow{font-family:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}

/* Sidebar */
.sidebar{background:linear-gradient(180deg,#0b0f22,#0a0d1d);border-right:1px solid var(--line)}
.sidebar-brand{padding:22px 20px;border-bottom:1px solid var(--line)}
.sidebar-brand b{font-size:22px;letter-spacing:.01em;font-weight:700}
.sidebar-brand small{display:none}
.mark{background:var(--grad)!important;color:#fff!important;border-radius:12px!important;box-shadow:0 8px 22px -8px rgba(124,92,245,.8)}
.nav-group h6{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:11px;letter-spacing:.18em;color:#6f7599;margin:22px 0 8px}
.nav-link{border-radius:14px;padding:12px 14px;color:#aab0cf;font-weight:500;transition:.15s}
.nav-link:hover{background:rgba(255,255,255,.04);color:#fff}
.nav-link.active{background:var(--grad);color:#fff;box-shadow:0 10px 26px -10px rgba(124,92,245,.9)}
.nav-badge{background:#ef4444;color:#fff;border-radius:999px}
.sidebar-foot{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:16px}
.avatar{background:var(--grad);color:#fff;border-radius:50%}

/* Top bar */
.topbar{background:rgba(8,10,23,.72);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);padding:16px 28px}
.topbar h1{font-size:24px;margin:0}
.topbar .breadcrumb{color:var(--muted);font-size:14px}
.clock-pill{display:flex;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.03);overflow:hidden}
.clock-pill div{padding:7px 18px;line-height:1.25}
.clock-pill div+div{border-left:1px solid var(--line)}
.clock-pill span{display:block;font:600 10px "JetBrains Mono",monospace;letter-spacing:.16em;color:var(--violet-2)}
.clock-pill b{font:600 13px "JetBrains Mono",monospace}
.user-pill{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:999px;padding:6px 8px 6px 18px;background:rgba(255,255,255,.03)}
.user-pill div{text-align:right;line-height:1.2}
.user-pill b{display:block;font-size:14px}
.user-pill small{font-size:12px}
.bell{position:relative;color:#cfd3ea;padding:8px 10px;border-radius:12px}
.bell i{position:absolute;top:-2px;right:-2px;background:#ef4444;color:#fff;font:700 10px Inter,sans-serif;border-radius:999px;padding:2px 6px;font-style:normal}

/* Page hero */
.page-hero{margin:6px 0 26px}
.page-hero h2{font-size:clamp(34px,5vw,54px);letter-spacing:-.035em;font-weight:800;margin:0 0 8px}
.page-hero h2 em{font-style:normal;background:linear-gradient(90deg,#8b7cf8,#5ea8ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.eyebrow{font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}

/* Cards and stats */
.card,.stat,.feature,.market-card,.side-box,.ticket{
  background:linear-gradient(160deg,rgba(26,32,64,.72),rgba(14,18,38,.86));
  border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.stat{padding:22px}
.stat .label{font:600 11px "JetBrains Mono",monospace;letter-spacing:.18em;color:var(--violet-2)}
.stat .value{font-size:30px;font-weight:800;letter-spacing:-.03em}
.stat .glow{background:radial-gradient(circle,rgba(124,92,245,.28),transparent 70%)}
.card-head h2,.card h2{font-weight:700}
.badge{border-radius:999px;font:600 11px "JetBrains Mono",monospace;letter-spacing:.12em;text-transform:uppercase}

/* Buttons and fields */
.btn{background:var(--grad);color:#fff;border:0;border-radius:14px;font-weight:600;box-shadow:0 10px 26px -10px rgba(124,92,245,.8)}
.btn.ghost{background:rgba(255,255,255,.03);border:1px solid var(--line);box-shadow:none;color:var(--text)}
.btn.ghost:hover{border-color:var(--violet);background:rgba(124,92,245,.12)}
input,select,textarea{background:rgba(255,255,255,.04)!important;border:1px solid var(--line)!important;border-radius:12px!important;color:var(--text)}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--violet)!important;box-shadow:0 0 0 3px rgba(124,92,245,.22)}
table th{font:600 11px "JetBrains Mono",monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--violet-2)}
.tabs a.active,.tabs .active{background:var(--grad);color:#fff}

/* Public site */
.site-head{background:rgba(8,10,23,.7);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.hero{padding:96px 20px 56px}
.hero h1{font-size:clamp(40px,7vw,76px);line-height:1.04;letter-spacing:-.04em;font-weight:800;background:none;color:#fff}
.hero h1 em{font-style:normal;background:linear-gradient(90deg,#8b7cf8,#5ea8ff,#7ee7f5);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p{font-size:18px;color:#9aa0c2}
.hero-stats{display:grid;grid-template-columns:repeat(4,1fr);max-width:980px;margin:40px auto 0;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.02)}
.hero-stats div{padding:26px 10px;text-align:center}
.hero-stats div+div{border-left:1px solid var(--line)}
.hero-stats b{display:block;font-size:30px;font-weight:800}
.hero-stats span{font:600 11px "JetBrains Mono",monospace;letter-spacing:.18em;color:var(--muted)}

/* Auth */
.auth-card{background:linear-gradient(160deg,rgba(26,32,64,.8),rgba(12,16,34,.92));border:1px solid var(--line);border-radius:22px}

@media(max-width:900px){.clock-pill,.user-pill div{display:none}.hero-stats{grid-template-columns:repeat(2,1fr)}}
