/* Worldwide Secret - static pages (about, faq, press, pl). Same night-glass look as the game. */
:root{ --bg:#070c11; --panel:#0d151d; --line:#1d2b37; --ink:#e7f0f5; --dim:#8fa6b4; --acc:#4fd1c5; --acc2:#ffd23f; }
*{ box-sizing:border-box }
html{ background:var(--bg) }
body{ margin:0; background:var(--bg); color:var(--ink); font:16px/1.65 "Segoe UI",system-ui,-apple-system,Roboto,sans-serif; }
a{ color:var(--acc) } a:hover{ color:#8ff0e6 }
.wrap{ max-width:780px; margin:0 auto; padding:0 16px }
header.top{ border-bottom:1px solid var(--line); background:rgba(7,12,17,.9); position:sticky; top:0; backdrop-filter:blur(6px); z-index:2 }
header.top .wrap{ display:flex; align-items:center; justify-content:space-between; gap:12px; height:58px }
.brand{ font-weight:900; letter-spacing:.06em; color:var(--ink); text-decoration:none; white-space:nowrap }
.brand span{ color:var(--acc2) }
nav.links{ display:flex; gap:14px; flex-wrap:wrap; font-size:14px }
nav.links a{ color:var(--dim); text-decoration:none } nav.links a:hover,nav.links a[aria-current]{ color:var(--ink) }
.play{ display:inline-block; background:linear-gradient(180deg,#ffd23f,#f0a800); color:#241a00; font-weight:800;
  padding:12px 22px; border-radius:10px; text-decoration:none; box-shadow:0 6px 24px rgba(255,200,40,.25) }
.play:hover{ color:#241a00; filter:brightness(1.06) }
main{ padding:36px 0 60px }
h1{ font-size:clamp(30px,6vw,46px); line-height:1.1; margin:0 0 14px; letter-spacing:-.01em }
h2{ font-size:24px; margin:42px 0 10px } h3{ font-size:18px; margin:26px 0 6px }
.lead{ font-size:19px; color:#c9d8e0 }
.kicker{ color:var(--acc); font-size:12px; font-weight:800; letter-spacing:.2em; text-transform:uppercase }
.card{ background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:18px 20px; margin:18px 0 }
.quote{ border-left:3px solid var(--acc); padding:4px 0 4px 16px; color:#d8e6ec; font-style:italic; margin:18px 0 }
.grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px }
.grid .card{ margin:0 }
img.shot{ width:100%; height:auto; border-radius:12px; border:1px solid var(--line); display:block }
figure{ margin:18px 0 } figcaption{ color:var(--dim); font-size:13px; margin-top:6px }
details{ background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:14px 18px; margin:10px 0 }
details summary{ cursor:pointer; font-weight:700 } details[open] summary{ margin-bottom:8px }
code{ background:#0f1a22; padding:1px 6px; border-radius:6px; font-size:14px }
footer.foot{ border-top:1px solid var(--line); color:var(--dim); font-size:13px; padding:26px 0 40px }
footer.foot p{ margin:6px 0 }
@media (max-width:600px){ nav.links{ display:none } .lead{ font-size:17px } }
