:root{
  --ink:#14243B; --paper:#F3F6F9; --panel:#FFFFFF; --line:#C9D4E0;
  --sonar:#0B7285; --sonar-bright:#5CC8D8; --night:#0E1F33; --night-text:#F3F6F9;
  --amber-bg:#FFF1D6; --amber-line:#9A5B00; --muted:#46566B;
  --font:"Atkinson Hyperlegible","Segoe UI",Verdana,system-ui,sans-serif;
}
@media (prefers-color-scheme:dark){
  :root{
    --ink:#E6EDF5; --paper:#0A1521; --panel:#11202F; --line:#2A3E54;
    --sonar:#6FD0DF; --night:#0E1F33; --muted:#A9B8C9;
    --amber-bg:#2B2210; --amber-line:#E0A23A;
  }
}
*{box-sizing:border-box}
html{scroll-padding-top:5rem}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);font-size:1.125rem;line-height:1.65}
a{color:var(--sonar);text-underline-offset:.2em}
a:hover{text-decoration-thickness:.18em}
:focus-visible{outline:3px solid var(--sonar);outline-offset:3px;border-radius:2px}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:var(--paper);padding:.75rem 1rem;z-index:10}
.skip:focus{left:0}
.wrap{max-width:68rem;margin:0 auto;padding:0 1.25rem}
.prose{max-width:44rem}

/* header */
.site-head{background:var(--night);color:var(--night-text)}
.site-head .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem 1.5rem;padding-top:.75rem;padding-bottom:.75rem}
.brand{display:flex;align-items:center;gap:.6rem;font-weight:700;font-size:1.25rem;color:var(--night-text);text-decoration:none}
.site-head nav ul{display:flex;flex-wrap:wrap;gap:.25rem 1.25rem;list-style:none;margin:0;padding:0}
.site-head nav a{color:var(--night-text);display:inline-block;padding:.4rem 0}
.site-head a:focus-visible{outline-color:var(--sonar-bright)}

/* hero */
.hero{background:var(--night);color:var(--night-text);overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:2rem;align-items:center;padding-top:3.5rem;padding-bottom:4rem}
.hero h1{font-size:clamp(2rem,5vw,3.25rem);line-height:1.1;margin:0 0 1rem;letter-spacing:-.01em}
.hero p{margin:0 0 1.5rem;max-width:34rem;color:#D5DFEA}
.hero .rings{width:100%;height:auto;max-width:26rem;justify-self:center}
.btns{display:flex;flex-wrap:wrap;gap:.75rem;margin-bottom:1.25rem}
.btn{display:inline-block;padding:.8rem 1.4rem;font:inherit;font-weight:700;border-radius:.4rem;text-decoration:none;border:2px solid var(--sonar-bright)}
.btn.primary{background:var(--sonar-bright);color:#06202A}
.btn.primary:hover{background:#8EDCE8}
.btn.ghost{color:var(--night-text)}
.btn.ghost:hover{background:rgba(255,255,255,.1)}
.hero .fine{font-size:1rem;color:#B9C7D6;margin:0}
.hero .fine a{color:var(--sonar-bright)}
.hero a:focus-visible{outline-color:var(--sonar-bright)}

/* sections */
section{padding:3.25rem 0;border-bottom:1px solid var(--line)}
section:last-of-type{border-bottom:0}
h1,h2,h3{line-height:1.2}
h2{font-size:clamp(1.55rem,3vw,2rem);margin:0 0 1rem}
h3{font-size:1.2rem;margin:1.75rem 0 .35rem}
p{margin:0 0 1rem}
ul.plain{padding-left:1.25rem}
ul.plain li{margin-bottom:.4rem}

/* feature list: two columns, no cards */
.features{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 3rem;margin-top:1.5rem}
.features h3{margin-top:1.5rem;padding-top:.75rem;border-top:3px solid var(--sonar)}
.features p{margin:0}

/* facts */
dl.facts{display:grid;grid-template-columns:max-content 1fr;gap:.5rem 1.5rem;margin:1.5rem 0;padding:1.25rem 1.5rem;background:var(--panel);border-left:5px solid var(--sonar)}
dl.facts dt{font-weight:700}
dl.facts dd{margin:0}

/* the notice */
.notice{background:var(--amber-bg);border:2px solid var(--amber-line);border-radius:.4rem;padding:1.5rem 1.75rem;margin:1.5rem 0}
.notice h3{margin-top:0}
.notice p:last-child{margin-bottom:0}

/* steps */
ol.steps{padding-left:1.4rem}
ol.steps li{margin-bottom:.6rem}
details{background:var(--panel);border:1px solid var(--line);border-radius:.4rem;padding:.25rem 1.1rem;margin-bottom:.6rem}
details summary{cursor:pointer;font-weight:700;padding:.6rem 0}
details[open] summary{margin-bottom:.25rem}

/* legal pages */
.legal{padding:3rem 0 4rem}
.legal h1{font-size:clamp(1.9rem,4vw,2.5rem);margin:0 0 .5rem}
.legal .updated{color:var(--muted);margin-bottom:2rem}
.legal h2{font-size:1.4rem;margin:2.25rem 0 .6rem}

/* footer */
.site-foot{background:var(--night);color:#C7D4E2;font-size:1rem;padding:2.25rem 0}
.site-foot a{color:var(--sonar-bright)}
.site-foot ul{display:flex;flex-wrap:wrap;gap:.25rem 1.25rem;list-style:none;padding:0;margin:0 0 1rem}
.site-foot p{margin:0 0 .6rem;max-width:52rem}

@media (max-width:760px){
  .hero .wrap{grid-template-columns:1fr;padding-top:2.25rem;padding-bottom:2.5rem}
  .hero .rings{max-width:12rem;order:-1;justify-self:start}
  .features{grid-template-columns:1fr}
  dl.facts{grid-template-columns:1fr;gap:.1rem}
  dl.facts dd{margin-bottom:.75rem}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
