/* The website: the game's palette and pixel type (see docs/style-guide.md) */
:root{--ink:#0e1124;--panel:#171b38;--panel2:#20264d;--line:#363f7a;--chalk:#f3efe0;--muted:#a3abd6;--gold:#f2c14e;--leather:#c8472e;color-scheme:dark}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--ink);color:var(--chalk);font-family:'VT323',ui-monospace,Menlo,Consolas,monospace;font-size:22px;line-height:1.3}
a{color:var(--gold)}
a:focus-visible,.btn:focus-visible,input:focus-visible{outline:3px solid var(--chalk);outline-offset:2px}
h1,h2,.btn,.mark,.pagetitle{font-family:'Press Start 2P',ui-monospace,monospace;font-weight:normal}
h1{font-size:clamp(40px,9vw,72px);line-height:1.05;margin:0}
h1 span,.mark span{color:var(--gold);text-shadow:5px 5px 0 var(--leather)}
.mark span{text-shadow:2px 2px 0 var(--leather)}
h2{font-size:14px;line-height:1.5;margin:0 0 10px}
p{margin:0 0 12px}
.wrap{max-width:960px;margin:0 auto;padding-inline:16px}
main.wrap{padding-block:24px 32px;display:grid;gap:28px}
.muted{color:var(--muted)}
.stack{display:grid;gap:14px;align-content:center}
.row{display:flex;gap:10px;flex-wrap:wrap}
.panel{background:var(--panel);border:3px solid var(--line);box-shadow:6px 6px 0 #070914;padding:18px;min-width:0}
.panel p:last-child{margin-bottom:0}
.btn{display:inline-block;font-size:11px;line-height:1.4;padding:13px 16px;background:var(--gold);color:#1a1300;border:3px solid #1a1300;box-shadow:4px 4px 0 #05060f;cursor:pointer;text-decoration:none;letter-spacing:.04em}
.btn:active{transform:translate(2px,2px);box-shadow:2px 2px 0 #05060f}
/* home */
.hero{display:grid;grid-template-columns:1fr 1.15fr;gap:28px;align-items:center;padding-top:16px}
.tag{font-size:26px;color:var(--muted);margin:0}
.launch{margin:0}
.shot{margin:0}
.shot img{display:block;width:100%;height:auto;image-rendering:pixelated;border:3px solid var(--line);box-shadow:6px 6px 0 #070914}
.intro{font-size:26px;max-width:46ch;margin:0}
.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.features h2{color:var(--gold)}
/* sign-up */
.signup form{display:grid;gap:10px;margin-top:6px}
.signup input[type=email]{flex:1 1 240px;min-width:0;font:inherit;font-size:22px;background:var(--panel2);color:var(--chalk);border:2px solid var(--line);padding:8px 10px}
.chk{display:flex;gap:10px;align-items:flex-start;cursor:pointer}
.chk input{width:20px;height:20px;margin-top:4px;flex:none;accent-color:var(--gold)}
.fine{font-size:19px;color:var(--muted);margin:0}
/* devlog and pages */
.posts{list-style:none;padding:0;margin:0 0 12px;display:grid;gap:14px}
.top{padding-top:18px}
.mark{font-size:14px;color:var(--chalk);text-decoration:none}
.pagetitle{font-size:clamp(18px,4vw,26px);line-height:1.4;margin:0 0 16px}
.prose{max-width:68ch;font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;font-size:17px;line-height:1.6}
.prose h2{font-size:13px;margin-top:28px;color:var(--gold)}
.prose h3{font-size:17px;margin:20px 0 8px}
.prose ul,.prose ol{padding-left:22px;margin:0 0 14px}
.prose li{margin-bottom:6px}
.prose blockquote{margin:0 0 14px;padding:8px 14px;border-left:4px solid var(--gold);background:var(--panel)}
.prose code{background:var(--panel2);padding:1px 5px}
.center{text-align:center;max-width:620px;margin:24px auto 0}
.draft{margin:0;padding:8px 16px;background:var(--leather);color:#fff;text-align:center;font-family:'Press Start 2P',monospace;font-size:10px}
.foot{padding-block:20px 36px;border-top:3px solid var(--line);font-size:20px}
.foot p{margin:0 0 6px}
@media (max-width:720px){.hero{grid-template-columns:1fr}.intro,.tag{font-size:23px}}
.btn[disabled]{opacity:.45;cursor:not-allowed;box-shadow:none}
.btn.alt{background:var(--panel2);color:var(--chalk);border-color:var(--line)}
