:root{
  --bg:#070b14;
  --bg2:#0b1020;
  --panel:rgba(15,20,36,.78);
  --panel2:rgba(20,26,46,.88);
  --stroke:rgba(255,255,255,.08);
  --text:#eef2ff;
  --muted:#9da8c8;
  --accent:#7c8cff;
  --accent2:#67e8f9;
  --success:#43d68a;
  --warn:#ffd166;
  --danger:#ff6b7a;
  --shadow:0 24px 80px rgba(0,0,0,.35);
  --radius:24px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 10% 10%, rgba(124,140,255,.20), transparent 28%),
    radial-gradient(circle at 90% 20%, rgba(103,232,249,.12), transparent 22%),
    linear-gradient(180deg, #050814 0%, var(--bg2) 42%, #060912 100%);
  min-height:100vh;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size:42px 42px;
  opacity:.18;
  mask-image:linear-gradient(180deg, rgba(0,0,0,.1), rgba(0,0,0,1) 22%, rgba(0,0,0,1) 80%, rgba(0,0,0,.18));
}
.noise{
  position:fixed; inset:0; pointer-events:none; opacity:.04;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E");
}

a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
code{
  background:rgba(255,255,255,.06);
  border:1px solid var(--stroke);
  border-radius:10px;
  padding:.08rem .38rem;
}

.topbar{
  width:min(1400px,calc(100% - 32px));
  margin:16px auto 0;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
}
.topbar-nav,.topbar-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}

.brand{
  display:flex; align-items:center; gap:12px;
  padding:10px 14px;
  border:1px solid var(--stroke);
  background:rgba(255,255,255,.03);
  border-radius:18px;
  box-shadow:var(--shadow);
}
.brand-mark{
  width:42px;height:42px;display:grid;place-items:center;
  border-radius:14px;
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#08101e;font-weight:900;
}
.brand strong,.brand small{display:block}
.brand small,.muted,.eyebrow,.panel-head span,.kpi-card span,.metric-card span{color:var(--muted)}

.shell,.admin-shell{
  width:min(1400px,calc(100% - 32px));
  margin:18px auto 40px;
}
.hero{
  display:grid;
  grid-template-columns:1.25fr .95fr;
  gap:24px;
  margin-top:24px;
}
.hero-copy,.hero-panel,.section,.form-card,.workspace-panel,.sidebar,.auth-card{
  background:linear-gradient(180deg, rgba(18,23,41,.88), rgba(13,18,31,.82));
  border:1px solid var(--stroke);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  backdrop-filter: blur(22px);
}
.hero-copy,.hero-panel{padding:28px}
.hero h1,.page-title,.section h2,.workspace-panel h2{margin:0}
.hero h1{
  font-size:clamp(2.3rem,4vw,4.8rem);
  line-height:1.02;
  letter-spacing:-.04em;
  max-width:12ch;
}
.hero p{
  color:var(--muted);
  font-size:1.04rem;
  line-height:1.75;
  max-width:68ch;
}
.hero-actions,.form-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.pill,.badge-soft{
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(124,140,255,.12);
  border:1px solid rgba(124,140,255,.28);
  color:#dbe2ff;
  font-size:.82rem;
}
.mini-metrics{
  margin-top:22px;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.mini-metrics .mini{
  padding:14px;
  border-radius:18px;
  border:1px solid var(--stroke);
  background:rgba(255,255,255,.03);
}
.mini strong,.stat-card strong,.metric-card strong,.kpi-card strong,.score-badge{
  display:block;
  font-size:1.4rem;
}
.mini span{color:var(--muted);font-size:.9rem}

.hero-panel .panel-head,.workspace-panel .panel-head{
  display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px
}
.panel-head{
  color:var(--muted);
}
.stat-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.stat-card,.metric-card,.kpi-card,.sidebar-card,.chart-box,.box,.form-card,.info-card,.auth-card{
  padding:18px;
  border-radius:22px;
  background:rgba(255,255,255,.03);
  border:1px solid var(--stroke);
}
.stat-card span,.stat-card strong{display:block}
.stat-card strong{font-size:1.7rem}
.snapshot-list,.simple-list{display:grid;gap:10px;margin-top:14px}
.snapshot-item,.list-item{
  padding:14px 15px;
  border-radius:18px;
  border:1px solid var(--stroke);
  background:rgba(255,255,255,.03);
}
.snapshot-item small,.list-item small,.small{color:var(--muted)}
.section{padding:22px;margin-top:24px}
.section-head,.kanban-toolbar{
  display:flex;justify-content:space-between;gap:18px;align-items:flex-end;flex-wrap:wrap;
  margin-bottom:16px;
}
.section h2,.workspace-panel h2{font-size:1.55rem}
.eyebrow{font-size:.76rem;text-transform:uppercase;letter-spacing:.18em;font-weight:700}
.filters-inline{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.filters-inline.wrap{justify-content:flex-start}
.input{
  width:100%;
  min-height:46px;
  padding:12px 14px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(8,12,24,.75);
  color:var(--text);
  outline:none;
}
label{display:grid;gap:8px;color:#d8e1ff}
textarea.input{resize:vertical}
.input:focus{border-color:rgba(124,140,255,.6);box-shadow:0 0 0 4px rgba(124,140,255,.12)}
.cards-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:14px;
}
.job-card,.cand-card,.notif-item{
  border:1px solid var(--stroke);
  background:rgba(255,255,255,.03);
  border-radius:22px;
  padding:16px;
}
.job-card h3,.cand-card h3{margin:.2rem 0 .4rem}
.meta-row{display:flex;flex-wrap:wrap;gap:8px;color:var(--muted);font-size:.92rem}
.tag{
  display:inline-flex;padding:6px 10px;border-radius:999px;
  background:rgba(255,255,255,.06); border:1px solid var(--stroke); font-size:.82rem;
}
.tag.good{background:rgba(67,214,138,.12);border-color:rgba(67,214,138,.22);color:#baf3d5}
.tag.warn{background:rgba(255,209,102,.12);border-color:rgba(255,209,102,.22);color:#ffe3a0}
.tag.bad{background:rgba(255,107,122,.12);border-color:rgba(255,107,122,.22);color:#ffb0b8}
.tag.primary{background:rgba(124,140,255,.12);border-color:rgba(124,140,255,.22);color:#cfd6ff}
.apply-layout{
  display:grid;grid-template-columns:1.15fr .7fr;gap:16px;
}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.form-card,.info-card{padding:22px}
.stack{display:grid;gap:12px}
.full{width:100%}
.timeline{margin:0;padding-left:18px;display:grid;gap:10px;color:var(--muted)}
.tip{
  margin-top:16px;
  padding:16px;
  border-radius:18px;
  background:linear-gradient(135deg, rgba(124,140,255,.12), rgba(103,232,249,.08));
  border:1px solid rgba(124,140,255,.18);
}

.admin-shell{display:grid;grid-template-columns:280px 1fr;gap:18px}
.sidebar{
  padding:18px;
  position:sticky;
  top:18px;
  height:calc(100vh - 36px);
  display:flex;
  flex-direction:column;
  gap:18px;
}
.side-nav{display:grid;gap:8px}
.side-link{
  padding:12px 14px;
  border-radius:14px;
  background:transparent;
  color:var(--text);
  border:1px solid transparent;
  text-align:left;
  cursor:pointer;
}
.side-link.active,.side-link:hover{
  border-color:var(--stroke);
  background:rgba(255,255,255,.04);
}
.sidebar-card{margin-top:auto}
.btn,.icon-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:46px;
  padding:0 16px;
  border-radius:14px;
  border:1px solid transparent;
  cursor:pointer;
  transition:.18s transform,.18s opacity,.18s background,.18s border-color;
  color:var(--text);
}
.btn:hover,.icon-btn:hover{transform:translateY(-1px)}
.btn-primary{background:linear-gradient(135deg,var(--accent),var(--accent2)); color:#051019; font-weight:800}
.btn-soft{background:rgba(124,140,255,.12); border-color:rgba(124,140,255,.18)}
.btn-ghost{background:rgba(255,255,255,.02); border-color:var(--stroke)}
.icon-btn{
  background:rgba(255,255,255,.04);
  border:1px solid var(--stroke);
  min-width:46px;
  padding:0 14px;
  border-radius:14px;
}
.icon-btn span{
  display:inline-grid;place-items:center;
  min-width:22px;height:22px;
  border-radius:999px;
  background:var(--danger);
  color:white;
  font-size:.8rem;
  margin-left:6px;
}
.admin-main{min-width:0}
.topbar-admin{
  width:100%;
  margin:0 0 18px;
  padding:4px 0 0;
}
.page-title{font-size:clamp(1.7rem,2.7vw,2.5rem)}
.search{min-width:min(380px,100%)}
.dashboard-grid{display:grid;gap:18px}
.metric-row{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:12px;
}
.metric-card span,.kpi-card span{display:block}
.metric-card strong,.kpi-card strong{font-size:1.9rem}
.filters-panel,.kanban,.workspace-grid,.analytics-grid{display:grid;gap:16px}
.kanban{
  grid-template-columns:repeat(4,minmax(240px,1fr));
  align-items:start;
}
.col{
  background:rgba(255,255,255,.03);
  border:1px solid var(--stroke);
  border-radius:22px;
  padding:14px;
  min-height:220px;
}
.col-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}
.col-body{display:grid;gap:10px;min-height:90px}
.count{
  min-width:28px;height:28px;border-radius:999px;
  display:grid;place-items:center;
  background:rgba(255,255,255,.06);
  border:1px solid var(--stroke);
}
.cand-card{cursor:grab}
.cand-card:active{cursor:grabbing}
.cand-card .top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.cand-card .name{font-weight:800}
.cand-card .sub{color:var(--muted);font-size:.92rem;margin-top:4px}
.cand-card .foot{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:12px}
.score-badge{
  width:66px;height:66px;border-radius:18px;
  display:grid;place-items:center;
  background:linear-gradient(135deg, rgba(124,140,255,.18), rgba(103,232,249,.18));
  border:1px solid rgba(124,140,255,.24);
}
.workspace-grid{
  grid-template-columns:1.25fr .75fr;
  margin-top:16px;
}
.workspace-panel{padding:20px}
.candidate-meta,.breakdown,.speed-stats{display:grid;gap:10px}
.meta-pill,.break-pill{
  display:flex;justify-content:space-between;gap:12px;align-items:center;
  padding:12px 14px;border-radius:16px;border:1px solid var(--stroke);background:rgba(255,255,255,.03);
}
.break-bar{
  height:10px;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.05);border:1px solid var(--stroke);
}
.break-bar > span{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2))}
.split{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}
.mt-12{margin-top:12px}
.mt-16{margin-top:16px}
.analytics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.chart-box h3,.box h3{margin-top:0}
.bars{display:grid;gap:10px}
.bar-row{display:grid;gap:6px}
.bar-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:.92rem}
.bar-track{
  height:12px;
  border-radius:999px;
  overflow:hidden;
  background:rgba(255,255,255,.05);
  border:1px solid var(--stroke);
}
.bar-fill{
  height:100%;
  background:linear-gradient(90deg,var(--accent),var(--accent2));
}
.speed-stats .meta-pill{font-size:.95rem}
.login-overlay{
  position:fixed;
  inset:0;
  display:none;
  place-items:center;
  background:rgba(2,6,12,.72);
  backdrop-filter:blur(16px);
  z-index:50;
  padding:18px;
}
.login-overlay.show{display:grid}
.auth-card{
  width:min(440px,100%);
  padding:26px;
}
.muted{color:var(--muted)}
.toast{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:60;
  min-width:260px;
  max-width:min(380px,calc(100vw - 36px));
}
.toast .t{
  margin-top:10px;
  padding:14px 16px;
  border-radius:16px;
  background:rgba(12,16,30,.95);
  border:1px solid var(--stroke);
  box-shadow:var(--shadow);
}
.toast .t.success{border-color:rgba(67,214,138,.26)}
.toast .t.error{border-color:rgba(255,107,122,.26)}
.toast .t.info{border-color:rgba(124,140,255,.26)}
.hidden{display:none !important}
.small{font-size:.9rem}
.mt-8{margin-top:8px}

@media (max-width:1180px){
  .hero,.apply-layout,.workspace-grid,.metric-row,.kanban,.analytics-grid,.admin-shell,.split{grid-template-columns:1fr}
  .sidebar{position:relative;height:auto}
  .search{min-width:220px}
}
@media (max-width:720px){
  .shell,.admin-shell,.topbar{width:min(100% - 20px,1400px)}
  .topbar,.topbar-nav{flex-direction:column;align-items:stretch}
  .grid-2,.stat-grid{grid-template-columns:1fr}
  .mini-metrics{grid-template-columns:1fr}
  .metric-row{grid-template-columns:repeat(2,minmax(0,1fr))}
}