/* Neverstill — the palette is the game's own, taken from src/styles.css and
   GameViewController.swift so the site and the app are the same object. */
:root{
  --void:#2a1a10; --ground:#3c2718; --grade:#3a2617; --ridge:#4d3421;
  --steel:#f6e7c9; --steel-dim:#d3b78c; --dust:#8a6f52;
  --amber:#ffa72c; --amber-hot:#ffd48a; --cyan:#38cdf2;
  --sp:clamp(20px,4vw,34px);
}
*{margin:0;padding:0;box-sizing:border-box}
body{
  background:var(--void); color:var(--steel-dim);
  font:400 16px/1.68 ui-sans-serif,system-ui,-apple-system,"Helvetica Neue",sans-serif;
  -webkit-font-smoothing:antialiased;
  background-image:radial-gradient(ellipse 110% 60% at 50% -8%,rgba(255,167,44,.09),transparent 62%);
  background-attachment:fixed;
}
.wrap{max-width:720px;margin:0 auto;padding:var(--sp) var(--sp) 80px}

/* the game's display type is a licensed embedded face; the site uses a
   condensed system stack rather than shipping the font again */
h1,h2,.disp{
  font-family:"Helvetica Neue Condensed","Arial Narrow",ui-sans-serif,sans-serif;
  font-stretch:condensed; color:var(--steel); text-wrap:balance;
  letter-spacing:.06em; text-transform:uppercase;
}
h1{font-size:clamp(34px,8vw,60px);font-weight:800;letter-spacing:.16em;line-height:1}
h2{font-size:clamp(19px,3.4vw,23px);font-weight:700;margin:44px 0 14px}
p{margin:0 0 15px;max-width:64ch}
a{color:var(--cyan);text-decoration:none;border-bottom:1px solid rgba(56,205,242,.35)}
a:hover{border-bottom-color:var(--cyan)}
a:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
strong{color:var(--steel);font-weight:600}
ul{margin:0 0 15px 20px;max-width:64ch}
li{margin-bottom:8px}

header{border-bottom:2px solid var(--ridge);padding-bottom:22px;margin-bottom:8px}
.eyebrow{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;
  letter-spacing:.24em;text-transform:uppercase;color:var(--dust);margin-bottom:11px;
}
.tagline{
  font-family:"Helvetica Neue Condensed","Arial Narrow",sans-serif;font-stretch:condensed;
  font-weight:600;font-size:clamp(13px,2.6vw,15px);letter-spacing:.18em;
  text-transform:uppercase;color:var(--amber);margin-top:10px;
}
.updated{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;
  letter-spacing:.1em;color:var(--dust);margin-top:14px;
}
nav{display:flex;gap:22px;flex-wrap:wrap;margin-top:26px}
nav a{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--steel-dim);border-bottom:0;
}
nav a:hover,nav a[aria-current="page"]{color:var(--amber)}

.lede{font-size:clamp(17px,2.6vw,19px);color:var(--steel);margin-top:26px}
.note{
  border-left:3px solid var(--amber);background:rgba(255,167,44,.07);
  padding:15px 18px;margin:22px 0;
}
.note p:last-child{margin-bottom:0}
.rule{height:1px;background:var(--grade);margin:44px 0 0}

footer{
  margin-top:52px;padding-top:22px;border-top:1px solid var(--grade);
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;
  color:var(--dust);line-height:2;
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
