:root{--bg:#06101d;--panel:#0d1b2e;--panel2:#10243d;--text:#eaf2ff;--muted:#9db1cc;--line:rgba(255,255,255,.12);--line2:rgba(255,255,255,.18);--accent:#67e8f9;--accent2:#a78bfa;--good:#86efac;--warn:#fde68a;--danger:#fca5a5;--blue:#93c5fd;--shadow:0 24px 80px rgba(0,0,0,.35);--card:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035))}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:radial-gradient(circle at 18% 0%,rgba(103,232,249,.22),transparent 33%),radial-gradient(circle at 82% 8%,rgba(167,139,250,.21),transparent 32%),var(--bg);color:var(--text)}a{color:inherit;text-decoration:none}.wrap{max-width:1240px;margin:0 auto;padding:0 22px}
header{position:sticky;top:0;z-index:20;background:rgba(6,16,29,.80);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.nav{height:74px;display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{display:flex;align-items:center;gap:12px;font-weight:950;letter-spacing:-.04em}.logo{width:40px;height:40px;border-radius:15px;background:linear-gradient(135deg,var(--accent),var(--accent2));display:grid;place-items:center;color:#06101d;font-weight:1000;box-shadow:0 10px 30px rgba(103,232,249,.22)}.navlinks{display:flex;gap:16px;color:var(--muted);font-size:14px;align-items:center}.navlinks a:hover{color:var(--text)}.navCta{border:1px solid var(--line2);border-radius:999px;padding:9px 13px;background:rgba(255,255,255,.05);color:var(--text)!important;font-weight:800}
.hero{padding:84px 0 38px}.heroGrid{display:grid;grid-template-columns:1.02fr .98fr;gap:34px;align-items:center}.badge{display:inline-flex;gap:8px;align-items:center;border:1px solid var(--line);background:rgba(255,255,255,.06);border-radius:999px;padding:8px 12px;color:var(--muted);font-size:13px}.customerBadge{color:#07111f;background:linear-gradient(135deg,var(--accent),var(--accent2));border:0;font-weight:950}
h1{font-size:clamp(38px,6vw,72px);line-height:1.03;margin:20px 0 18px;letter-spacing:-.075em}.lead{font-size:18px;line-height:1.76;color:#c8d7ec;max-width:720px;margin:0 0 28px}.cta{display:flex;gap:12px;flex-wrap:wrap}.btn{border:1px solid var(--line);border-radius:16px;padding:13px 18px;font-weight:850;background:rgba(255,255,255,.06);display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer}.btn.primary{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#06101d;border:0}.btn.small{padding:9px 12px;border-radius:13px;font-size:13px}.btn:hover{transform:translateY(-1px);transition:.18s ease}
.heroPanel{border:1px solid var(--line);background:rgba(13,27,46,.74);border-radius:30px;padding:24px;box-shadow:var(--shadow)}.heroPanel h2{font-size:28px;margin:0 0 8px}.quickGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:18px}.quick{border:1px solid var(--line);background:rgba(255,255,255,.045);border-radius:20px;padding:16px}.quick b{display:block;margin-bottom:6px}.quick span{color:var(--muted);font-size:13px;line-height:1.55}
section{padding:42px 0}.secHead{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:18px}h2{margin:0;font-size:31px;letter-spacing:-.045em}.desc{color:var(--muted);line-height:1.65;margin:8px 0 0}
.filters{display:flex;gap:8px;flex-wrap:wrap}.chip{font-size:13px;border:1px solid var(--line);border-radius:999px;padding:8px 11px;color:#c8d7ec;background:rgba(255,255,255,.045);cursor:pointer}.chip.active{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#06101d;border:0;font-weight:900}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.card{position:relative;overflow:hidden;border:1px solid var(--line);background:var(--card);border-radius:28px;padding:22px;min-height:480px;box-shadow:var(--shadow);isolation:isolate}.card:before{content:"";position:absolute;inset:-80px -80px auto auto;width:180px;height:180px;border-radius:50%;background:rgba(103,232,249,.14);z-index:-1}.card:hover{transform:translateY(-4px);border-color:rgba(103,232,249,.38);transition:.2s ease}.icon{width:48px;height:48px;border-radius:18px;display:grid;place-items:center;background:rgba(255,255,255,.09);font-size:24px;margin-bottom:16px}.cardTop{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.tag{display:inline-block;font-size:12px;color:#07111f;background:var(--good);padding:5px 9px;border-radius:999px;font-weight:950;margin-bottom:10px}.tag.beta{background:var(--warn)}.tag.ai{background:var(--accent)}.tag.stock{background:var(--blue)}.status{font-size:11px;color:var(--good);border:1px solid rgba(134,239,172,.35);padding:5px 8px;border-radius:999px;background:rgba(134,239,172,.08);white-space:nowrap}.card h3{font-size:22px;margin:0 0 8px;letter-spacing:-.04em}.card p{color:#c6d3e6;line-height:1.62;margin:0 0 14px;font-size:14px}.target{border-top:1px solid var(--line);padding-top:11px;color:#e5f3ff;font-size:13px;line-height:1.5}.target b{color:var(--accent)}.features{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0 16px}.features span,.monetizeBadge{font-size:12px;color:var(--muted);border:1px solid var(--line);padding:6px 8px;border-radius:999px;background:rgba(255,255,255,.04)}.popularity{margin:14px 0 12px}.popularity .line{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;margin-bottom:6px}.meter{height:8px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}.meter i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--accent),var(--accent2));width:50%}.cardActions{position:absolute;left:22px;right:22px;bottom:20px;display:grid;grid-template-columns:1fr 1fr;gap:8px}.cardActions a,.cardActions button{text-align:center;border-radius:14px;padding:11px 10px;background:rgba(255,255,255,.09);font-weight:900;border:1px solid var(--line);color:var(--text);cursor:pointer}.cardActions .primaryAction{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#06101d;border:0}
.platform,.boardGrid,.adminGrid,.detailPanel{display:grid;grid-template-columns:1.05fr .95fr;gap:16px}.box,.detailHero{border:1px solid var(--line);background:rgba(13,27,46,.72);border-radius:28px;padding:24px;box-shadow:var(--shadow)}.box ul{margin:14px 0 0;padding-left:18px;color:#c8d7ec;line-height:1.9}.detailHero{background:linear-gradient(135deg,rgba(103,232,249,.10),rgba(167,139,250,.08))}.detailHero h3{font-size:34px;letter-spacing:-.05em;margin:8px 0 10px}.detailHero p,.box li{color:#c8d7ec;line-height:1.72}.detailMetrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}.metric{border:1px solid var(--line);border-radius:18px;padding:14px;background:rgba(255,255,255,.045)}.metric strong{font-size:24px;display:block}.metric span{font-size:12px;color:var(--muted)}
.rankList,.timeline,.boardList,.formGrid,.adminMock,.realChart{display:grid;gap:10px;margin-top:16px}.rank{display:grid;grid-template-columns:30px 1fr auto;align-items:center;gap:10px;border:1px solid var(--line);border-radius:18px;padding:13px 15px;background:rgba(255,255,255,.04)}.rank em{font-style:normal;color:var(--muted);font-size:13px}.rank small{color:var(--accent);font-weight:900}.event{display:grid;grid-template-columns:86px 1fr;gap:13px;border:1px solid var(--line);border-radius:18px;padding:14px 16px;background:rgba(255,255,255,.04)}.event time{color:var(--accent);font-size:12px;font-weight:900}.event span{color:var(--muted);font-size:13px;line-height:1.55}
.adminRow{display:grid;grid-template-columns:1.2fr .7fr .7fr .7fr .7fr;gap:10px;align-items:center;border:1px solid var(--line);border-radius:18px;padding:13px;background:rgba(255,255,255,.04);font-size:13px}.adminRow.header{color:var(--muted);background:rgba(255,255,255,.025)}.health{display:inline-flex;align-items:center;gap:6px}.dot{width:8px;height:8px;border-radius:50%;background:var(--good);box-shadow:0 0 0 4px rgba(134,239,172,.10)}.dot.warn{background:var(--warn);box-shadow:0 0 0 4px rgba(253,230,138,.10)}.field{display:grid;grid-template-columns:150px 1fr;gap:10px;align-items:center;border:1px solid var(--line);border-radius:16px;padding:11px 13px;background:rgba(255,255,255,.04);font-size:13px}.field span{color:var(--muted)}
.input{width:100%;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.06);color:var(--text);padding:13px 14px;font-size:14px}.input::placeholder{color:var(--muted)}textarea.input{min-height:132px;resize:vertical}.checkLine{display:flex;gap:8px;align-items:center;color:var(--muted);font-size:13px;line-height:1.5}.inquiryCard{border:1px solid var(--line);background:rgba(255,255,255,.045);border-radius:22px;padding:16px}.inquiryTop{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px}.authorCode{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--accent);background:rgba(103,232,249,.10);border:1px solid rgba(103,232,249,.28);border-radius:999px;padding:5px 9px;font-size:12px;font-weight:900}.pill{border:1px solid var(--line);border-radius:999px;padding:5px 9px;color:var(--muted);font-size:12px}.pill.done{color:var(--good);border-color:rgba(134,239,172,.32);background:rgba(134,239,172,.08)}.pill.warn{color:var(--warn);border-color:rgba(253,230,138,.32);background:rgba(253,230,138,.08)}.answer{margin-top:12px;border-left:3px solid var(--accent);padding:11px 13px;background:rgba(103,232,249,.08);border-radius:14px;color:#e8fbff;font-size:14px;line-height:1.6}.meta{color:var(--muted);font-size:12px;margin-top:9px}
.realBarRow{display:grid;grid-template-columns:120px 1fr 56px;gap:10px;align-items:center}.realBarTrack{height:12px;background:rgba(255,255,255,.08);border-radius:999px;overflow:hidden}.realBarTrack i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2));border-radius:999px}.hidden{display:none!important}.loginBox{max-width:520px;margin:0 auto}.serviceRow{display:grid;grid-template-columns:1fr .7fr .7fr auto;gap:10px;align-items:center;border:1px solid var(--line);border-radius:18px;padding:13px;background:rgba(255,255,255,.04);font-size:13px}.iconBtn{border:1px solid var(--line);border-radius:12px;padding:8px 10px;background:rgba(255,255,255,.06);color:var(--text);cursor:pointer}.iconBtn.danger{color:var(--danger)}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.tab{border:1px solid var(--line);border-radius:999px;padding:9px 12px;background:rgba(255,255,255,.05);cursor:pointer;color:var(--muted)}.tab.active{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#06101d;border:0;font-weight:900}.adminPanel{display:none}.adminPanel.active{display:block}
footer{border-top:1px solid var(--line);padding:34px 0 46px;color:var(--muted)}
@media(max-width:1060px){.heroGrid,.platform,.detailPanel,.adminGrid,.boardGrid{grid-template-columns:1fr}.grid{grid-template-columns:repeat(2,1fr)}.navlinks{display:none}.adminRow{grid-template-columns:1fr 1fr}.adminRow.header{display:none}}
@media(max-width:700px){.grid,.quickGrid,.detailMetrics{grid-template-columns:1fr}.hero{padding-top:54px}.card{min-height:500px}.field{grid-template-columns:1fr}.secHead{display:block}.filters{margin-top:14px}.cardActions{grid-template-columns:1fr}.event{grid-template-columns:1fr}}


/* v2.3 customer form readability fix */
select.input{
  color:var(--text);
  background-color:#12243a;
  border-color:rgba(255,255,255,.20);
  color-scheme:dark;
}
select.input option,
select.input optgroup{
  background:#10243d;
  color:#eaf2ff;
}
select.input option:checked,
select.input option:hover{
  background:#2563eb;
  color:#ffffff;
}
select.input:focus,
.input:focus{
  outline:2px solid rgba(103,232,249,.42);
  outline-offset:2px;
  border-color:rgba(103,232,249,.65);
  box-shadow:0 0 0 4px rgba(103,232,249,.08);
}
.customerHelpGrid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin-top:16px;
}
.helpCard{
  border:1px solid var(--line);
  border-radius:18px;
  padding:14px;
  background:rgba(255,255,255,.045);
}
.helpCard b{
  display:block;
  margin-bottom:6px;
  color:#eaf2ff;
  font-size:14px;
}
.helpCard span{
  display:block;
  color:var(--muted);
  font-size:12px;
  line-height:1.55;
}
.formHint{
  color:var(--muted);
  font-size:12px;
  line-height:1.55;
  margin-top:-2px;
}
.privacyNotice{
  border:1px solid rgba(103,232,249,.22);
  background:rgba(103,232,249,.07);
  color:#dffaff;
  border-radius:16px;
  padding:12px 14px;
  font-size:13px;
  line-height:1.6;
}
.responseFlow{
  display:grid;
  gap:10px;
  margin-top:16px;
}
.responseStep{
  display:grid;
  grid-template-columns:32px 1fr;
  gap:10px;
  align-items:start;
  border:1px solid var(--line);
  border-radius:18px;
  padding:13px;
  background:rgba(255,255,255,.04);
}
.responseStep em{
  width:28px;
  height:28px;
  border-radius:10px;
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#06101d;
  display:grid;
  place-items:center;
  font-style:normal;
  font-weight:1000;
}
.responseStep b{
  display:block;
  margin-bottom:4px;
  font-size:14px;
}
.responseStep span{
  color:var(--muted);
  font-size:13px;
  line-height:1.55;
}
.selectLabel{
  display:block;
  color:#dbeafe;
  font-size:13px;
  font-weight:800;
  margin-bottom:6px;
}
.inputGroup{
  display:grid;
  gap:6px;
}
@media(max-width:900px){
  .customerHelpGrid{grid-template-columns:1fr}
}

/* v2.4 HSTB service tag */
.tag.stb{background:#f0abfc;color:#07111f}