:root{--m:clamp(12px,2.6vw,36px);--r:clamp(20px,3vw,36px);--ink:#fff;--soft:rgba(255,255,255,.78)}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:#04060c radial-gradient(120% 90% at 20% 10%,#0b2a3a 0,#04060c 55%);color:var(--ink);
 font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
 -webkit-font-smoothing:antialiased;overflow:hidden}
#bg{position:fixed;inset:0;width:100%;height:100%;z-index:0;display:block}
a{color:inherit}
a:focus-visible{outline:3px solid #fff;outline-offset:4px;border-radius:4px}
.frame{position:fixed;inset:var(--m);z-index:1;border:1.5px solid rgba(255,255,255,.92);border-radius:var(--r);
 display:flex;flex-direction:column;overflow:hidden;box-shadow:0 0 60px rgba(120,200,255,.08) inset}
.inner .frame{background:rgba(4,6,12,.5);-webkit-backdrop-filter:blur(22px) saturate(1.2);backdrop-filter:blur(22px) saturate(1.2)}
.top{display:flex;justify-content:space-between;align-items:center;padding:clamp(16px,2.4vw,28px) clamp(18px,3vw,36px) 0;font-size:.95rem;color:var(--soft)}
.top a{text-decoration:none}.top a:hover{text-decoration:underline}
.top [aria-current]{color:#fff;font-weight:600}
main{flex:1;overflow:auto;display:flex;flex-direction:column;padding:0 clamp(18px,4vw,56px)}
.home main{justify-content:center;align-items:flex-start;text-align:left;padding:0 clamp(24px,6vw,96px)}
h1{margin:0;font-weight:600;letter-spacing:-.03em;line-height:1.04;font-size:clamp(2.3rem,7.2vw,5.8rem);text-shadow:0 2px 40px rgba(0,0,0,.55)}
.tag{margin:clamp(14px,2.4vw,28px) 0 0;max-width:30em;font-weight:400;line-height:1.35;font-size:clamp(1.05rem,2.4vw,1.75rem);color:var(--soft);text-shadow:0 1px 24px rgba(0,0,0,.6)}
.foot{display:flex;flex-wrap:wrap;justify-content:center;gap:10px clamp(20px,4vw,44px);padding:clamp(16px,2.4vw,26px) 16px clamp(18px,2.8vw,30px);font-size:.98rem}
.foot a{text-decoration:none;color:var(--soft)}.foot a:hover,.foot a[aria-current]{color:#fff;text-decoration:underline;text-underline-offset:5px}
.doc{width:100%;max-width:44rem;margin:0 auto;padding:clamp(20px,4vw,48px) 0 24px;line-height:1.65;font-size:1.02rem}
.doc h1{font-size:clamp(2rem,5vw,3.2rem);margin-bottom:.4em}
.doc h2{font-size:1.15rem;margin:2em 0 .4em;font-weight:600}
.doc p,.doc dd{color:rgba(255,255,255,.88);margin:.4em 0}
.doc dt{font-weight:600;margin-top:1.1em}.doc dd{margin-left:0}
.doc address{font-style:normal;color:rgba(255,255,255,.9)}
.doc a{text-underline-offset:3px}
.todo{background:#fff3b0;color:#222;padding:0 5px;border-radius:3px}
@media (max-height:520px){h1{font-size:clamp(2rem,7vw,3.4rem)}}
.logo{display:block;line-height:0}.logo img{height:clamp(19px,2.4vw,29px);width:auto;display:block}
.home .top{padding-left:clamp(24px,6vw,96px);padding-right:clamp(24px,6vw,96px)}
.top3{display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
.top3 .logo{justify-self:start}.top3 nav{justify-self:center}
.close{justify-self:end;display:grid;place-items:center;width:34px;height:34px;border:1.5px solid rgba(255,255,255,.7);border-radius:50%;color:#fff;text-decoration:none;line-height:0}
.close:hover{background:rgba(255,255,255,.16)}
