/* Peak Nina — brand v0. Bebas Neue display / Inter body, self-hosted.
   No @import, no third-party origin: CSP is default-src 'self'. */
@font-face{font-family:"Bebas Neue";src:url("/fonts/bebas-neue-latin.woff2")format("woff2");
  font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url("/fonts/inter-latin-var.woff2")format("woff2");
  font-weight:100 900;font-style:normal;font-display:swap}

:root{
  --bg:#0D0D0D; --fg:#FFFFFF; --gold:#C9A84C;
  /* #888888 is 5.48:1 on --bg and passes AA for body text.
     #666666 is only 3.38:1, so it is used for hairlines, never for text. */
  --muted:#888888; --line:#666666;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);
  font-family:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:17px;line-height:1.6;
  display:flex;flex-direction:column;align-items:center;
  min-height:100vh;padding:56px 20px 40px}
main{width:100%;max-width:400px;text-align:center;flex:1}

.mark{font-family:"Bebas Neue",Impact,sans-serif;font-size:56px;line-height:.95;
  letter-spacing:.055em;margin:0 0 6px;color:var(--fg)}
.mark span{color:var(--gold)}
.tagline{color:var(--muted);font-size:15px;margin:0 0 34px}

.links{list-style:none;padding:0;margin:0 0 30px}
.links li{margin:0 0 10px}
.links a{display:block;padding:14px 18px;border:1px solid var(--line);border-radius:10px;
  color:var(--fg);text-decoration:none;font-weight:600;font-size:16px;
  transition:border-color .15s,color .15s,background-color .15s}
.links a:hover,.links a:focus-visible{border-color:var(--gold);color:var(--gold);
  background:rgba(201,168,76,.06)}
.links .handle{display:block;font-weight:400;font-size:13px;color:var(--muted);margin-top:2px}
.links a:hover .handle,.links a:focus-visible .handle{color:var(--gold)}

.adult{margin:0 0 8px}
.adult a{color:var(--muted);font-size:13px;text-decoration:none;
  border-bottom:1px solid var(--line);padding-bottom:1px}
.adult a:hover,.adult a:focus-visible{color:var(--gold);border-color:var(--gold)}

footer{color:var(--muted);font-size:12px;margin-top:30px;text-align:center}
footer a{color:var(--muted)}
footer a:hover,footer a:focus-visible{color:var(--gold)}

h1.page{font-family:"Bebas Neue",Impact,sans-serif;font-size:38px;letter-spacing:.05em;
  margin:0 0 14px}
.prose{text-align:left;color:var(--muted);font-size:15px}
.prose h2{font-family:"Inter",sans-serif;font-size:15px;color:var(--fg);
  margin:26px 0 6px;font-weight:600}
.prose a{color:var(--gold)}

/* age gate */
.gate p{color:var(--muted);font-size:15px}
.gate .warn{color:var(--fg);font-weight:600}
.btnrow{display:flex;gap:10px;justify-content:center;margin-top:24px;flex-wrap:wrap}
.btn{font:inherit;font-weight:600;font-size:15px;padding:13px 22px;border-radius:10px;
  cursor:pointer;border:1px solid var(--line);background:transparent;color:var(--fg)}
.btn-primary{background:var(--gold);border-color:var(--gold);color:#0D0D0D}
.btn:hover,.btn:focus-visible{border-color:var(--gold);color:var(--gold)}
.btn-primary:hover,.btn-primary:focus-visible{background:#d9bb66;border-color:#d9bb66;color:#0D0D0D}
[hidden]{display:none !important}

@media (max-width:420px){ body{padding-top:40px} .mark{font-size:46px} }
@media (prefers-reduced-motion:reduce){ *{transition:none !important} }
