:root{--bg:#121418;--panel:#1b1e26;--ink:#f1ede4;--muted:#a9a49a;--gold:#ffd35c;--calme:#4cb5e3;--chaos:#ef5340;--line:rgba(255,255,255,.1)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.6 Barlow,system-ui,sans-serif}
a{color:var(--gold)}
a:hover{color:#fff}
header{border-bottom:1px solid var(--line);background:var(--panel)}
.bar{max-width:880px;margin:0 auto;padding:14px 16px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.logo{font:400 26px/1 'Permanent Marker',cursive;color:var(--gold);text-decoration:none}
.play{margin-left:auto;background:var(--gold);color:#121418;font:800 17px 'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:.04em;padding:9px 16px;border-radius:10px;text-decoration:none}
.play:hover{background:#fff;color:#121418}
main{max-width:880px;margin:0 auto;padding:28px 16px 40px}
h1{font:400 clamp(32px,6vw,48px)/1.1 'Permanent Marker',cursive;margin:0 0 12px;color:var(--gold)}
h2{font:800 clamp(22px,3.4vw,28px)/1.2 'Barlow Condensed',sans-serif;margin:36px 0 10px;text-transform:uppercase;letter-spacing:.03em}
h3{font:700 20px/1.3 'Barlow Condensed',sans-serif;margin:22px 0 6px}
p,li{max-width:72ch}
.lede{font-size:19px;color:#ddd8cd}
.roles{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin:14px 0}
.role{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px 16px;border-top:4px solid var(--c)}
.role h3{margin:0 0 4px}
.role p{margin:0;font-size:15.5px;color:#d6d1c7}
.tag{display:inline-block;font:700 12px 'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:.08em;color:var(--c);margin-bottom:4px}
table{border-collapse:collapse;width:100%;max-width:640px;font-size:15.5px}
td,th{text-align:left;padding:6px 10px;border-bottom:1px solid var(--line);vertical-align:top}
th{font:700 15px 'Barlow Condensed',sans-serif;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
kbd{font:600 13px ui-monospace,monospace;background:#2a2e38;border:1px solid #3a3f4b;border-bottom-width:2px;border-radius:5px;padding:1px 6px}
details{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:10px 14px;margin:8px 0}
summary{cursor:pointer;font-weight:600}
details p{margin:8px 0 2px}
.box{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px 18px;margin:16px 0}
footer{border-top:1px solid var(--line);color:var(--muted);font-size:14px}
footer .bar{justify-content:center;gap:8px 18px}
footer a{color:var(--muted)}
.upd{color:var(--muted);font-size:14px}
@media (max-width:520px){body{font-size:16px}.play{margin-left:0}}