:root{
  --stone:#ECEEEA; --ink:#17232B; --violet:#6B4EFF; --violet-soft:#8B6CFF; --amber:#FFB020; --mist:#C9D3D6; --paper:#F7F8F5;
  --bs-body-font-family:'Instrument Sans',system-ui,sans-serif; --bs-body-bg:var(--stone); --bs-body-color:var(--ink);
  --bs-primary:var(--violet); --bs-link-color:var(--violet);
}
body{font-size:1.0625rem;line-height:1.6}
h1,h2,h3,.navbar-brand{font-weight:500;font-family:'Fraunces',Georgia,serif;letter-spacing: -0.1px;line-height:1.08}
h1{font-size:clamp(2.8rem,7vw,5.6rem)}
h2{font-size:clamp(2rem,4.2vw,3.2rem);font-weight: 100!important;}
.lead{max-width:34rem}
:focus-visible{outline:3px solid var(--amber);outline-offset:3px}
.navbar{background:rgba(236,238,234,.85);backdrop-filter:blur(8px);margin-top: 16px;}
.navbar-brand{font-weight:800;font-size:1.5rem}
.navbar-brand span{color:var(--violet)}
.nav-link{font-weight:500}
.btn{border-radius:.6rem;font-weight:600;padding:.75rem 1.4rem}
.btn-carve{background:var(--ink);color:var(--stone);border:2px solid var(--ink)}
.btn-carve:hover{background:var(--violet);border-color:var(--violet);color:#fff}
.btn-line{border:2px solid var(--ink);color:var(--ink)}
.btn-line:hover{background:var(--ink);color:var(--stone)}
.hero{padding:7rem 0 3rem;position:relative;overflow:hidden;margin-top: 16px;}
.hero-stage{position:relative;border-radius:1.5rem;background:var(--ink);aspect-ratio:1/1.05;overflow:hidden;box-shadow:0 30px 60px -30px rgba(23,35,43,.6)}
.hero-stage canvas{position:absolute;inset:0;width:100%;height:100%}
.hero-stage .tag{position:absolute;left:1rem;bottom:1rem;right:1rem;background:rgba(247,248,245,.96);border-radius:.8rem;padding:.8rem 1rem;font-size:.9rem;display:flex;justify-content:space-between;gap:1rem;align-items:center}
.tag b{font-family:'Fraunces',Georgia,serif;font-size:1.4rem;color:var(--violet);white-space:nowrap}
.hero mark{background:linear-gradient(transparent 60%,var(--amber) 60%);color:inherit;padding:0}
section{padding:5.5rem 0}
.band{background:var(--ink);color:var(--stone)}
.band .text-muted{color:var(--mist)!important}
.stat{border-left:3px solid var(--violet);padding-left:1rem}
.stat strong{display:block;font-family:'Fraunces',Georgia,serif;font-size:2.6rem;line-height:1}
.brief{background:var(--paper);border-radius:1rem;padding:1.5rem;border:1px solid var(--mist)}
.chip{display:inline-block;padding:.2rem .7rem;border-radius:2rem;background:var(--stone);border:1px solid var(--mist);font-size:.85rem;margin:0 .25rem .4rem 0}
.cand{display:flex;gap:1rem;align-items:center;background:var(--paper);border:1px solid var(--mist);border-radius:1rem;padding:1rem 1.25rem;margin-bottom:.9rem}
.cand:first-child{border-color:var(--violet);box-shadow:0 0 0 3px rgba(107,78,255,.15)}
.avatar{flex:none;width:3.4rem;height:3.4rem;border-radius:50% 50% 50% 12%;display:grid;place-items:center;font-family:'Fraunces',Georgia,serif;font-weight:800;color:#fff}
.meter{height:.45rem;border-radius:1rem;background:var(--mist);overflow:hidden;margin-top:.4rem}
.meter i{display:block;height:100%;width:0;background:var(--violet);transition:width 1.2s cubic-bezier(.2,.8,.2,1)}
.revealed .meter i{width:var(--v)}
.score{font-family:'Fraunces',Georgia,serif;font-weight:800;font-size:1.6rem;min-width:3.5rem;text-align:right}
.step{border-top:2px solid var(--violet-soft);padding-top:1rem;height:100%}
.step .n{font-family:'Fraunces',Georgia,serif;font-size:1.1rem;color:#B87400;font-weight:700}
.portrait{border-radius:1.5rem;width:100%;max-width:26rem;display:block}
.split-card{background:var(--paper);border:1px solid var(--mist);border-radius:1.25rem;padding:2.2rem;height:100%}
.split-card.alt{background:var(--violet);color:#fff;border-color:var(--violet)}
.split-card.alt .btn-line{border-color:#fff;color:#fff}
.split-card.alt .btn-line:hover{background:#fff;color:var(--violet)}
.form-control,.form-select{border-radius:.6rem;padding:.75rem 1rem;border:1px solid var(--mist)}
footer{background:var(--ink);color:var(--mist);padding:3rem 0;border-top:1px solid rgba(201,211,214,.2)}
footer a{color:var(--stone)}
@media (prefers-reduced-motion:reduce){.meter i{transition:none}html{scroll-behavior:auto}}
.navbar-brand img{display:block;height:28px;width:auto}
.hero-stage svg{position:absolute;inset:0;width:100%;height:100%}
.scan{animation:scan 3.4s ease-in-out infinite alternate}
@keyframes scan{to{transform:translateY(160px)}}
@media (prefers-reduced-motion:reduce){.scan{animation:none;transform:translateY(80px)}}