/* Original black-paper / halftone palette. No scene renderer or animation loop. */
*{box-sizing:border-box}
body.start-page{margin:0;background:var(--ink);color:var(--paper);font-family:var(--body);overflow-x:hidden;min-height:100svh}
.start-page a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
.start-page a:focus-visible{outline:3px solid var(--paper);outline-offset:5px}
body.boot-pending .start-shell{visibility:hidden}
.menu-dots{position:fixed;inset:-24px;z-index:0;pointer-events:none;opacity:.34;color:var(--paper);background:radial-gradient(circle,currentColor .9px,transparent 1.15px) 0 0/14px 14px;mask-image:linear-gradient(110deg,transparent 0%,#000 70%);animation:menu-drift 24s linear infinite}
.menu-dots::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 80% 70%,#86d3b80d,transparent 65%)}
@keyframes menu-drift{to{transform:translate3d(14px,-14px,0)}}
.start-shell{position:relative;z-index:2;max-width:1600px;min-height:100svh;margin:auto;padding:30px clamp(24px,5vw,84px) 22px;display:flex;flex-direction:column}
.start-shell[hidden]{display:none}
body.game-view-open{overflow:hidden}
.game-view-open .menu-dots{animation-play-state:paused}
#game-view{position:fixed;inset:0;width:100%;height:100%;border:0;z-index:5;background:var(--ink);display:block}
html.software-landscape #game-view{inset:auto;top:0;left:var(--display-width);width:var(--display-height);height:var(--display-width);transform-origin:0 0;transform:rotate(90deg)}
.start-shell header,.start-shell footer{display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{font:28px var(--display);letter-spacing:1px;white-space:nowrap}
.brand span{display:block;font:9px var(--body);letter-spacing:5px;margin-top:5px;color:var(--muted)}
.menu-mark{font:600 9px var(--body);letter-spacing:.2em;color:var(--muted)}
.start-content{flex:1;display:flex;align-items:center;padding:48px 0 52px;min-height:0}
.intro{position:relative;max-width:560px}
.eyebrow{margin:0;color:var(--mint);letter-spacing:.2em;font-size:10px;font-weight:700}
.intro h1{font:clamp(50px,5.8vw,84px)/1.12 var(--display);margin:20px 0 34px;letter-spacing:.01em;color:var(--paper);text-shadow:3px 3px 0 var(--ink)}
.intro h1 span{color:var(--mint)}
nav{display:grid;gap:12px;width:min(450px,100%)}
.mode{display:flex;gap:17px;align-items:center;border:1px solid var(--line);border-left:4px solid var(--mint);padding:19px 21px;transition:transform .15s,background .15s;position:relative;min-height:88px}
.mode:hover{transform:translateX(4px)}
.mode .number{font:700 11px var(--body);opacity:.55}
.mode strong{display:block;font:27px var(--display)}
.mode small{display:block;font-size:10px;margin-top:5px;opacity:.8;letter-spacing:.025em}
.mode b{margin-left:auto;font:24px var(--body)}
.solo{background:var(--paper);color:var(--ink)!important;border-color:var(--paper);box-shadow:4px 4px 0 var(--mint)}
.online{background:var(--ink-2);border-left-color:var(--red)}
.online:hover{background:var(--ink-3)}
.start-shell footer{padding-top:18px;border-top:1px solid var(--line);font-size:10px;letter-spacing:.04em;color:var(--muted)}
.footer-brand{font-size:9px;letter-spacing:.12em}
.footer-brand b{color:var(--mint);padding:0 8px;font-size:14px}
body.boot-pending .menu-dots{animation-play-state:paused}
@media(max-width:1000px){.intro{max-width:470px}.intro h1{font-size:clamp(45px,6.3vw,64px)}nav{max-width:390px}.mode{padding:17px 18px}.menu-mark{display:none}}
@media(max-height:540px) and (min-width:681px){.start-shell{padding:15px 5vw 12px}.brand{font-size:23px}.brand span{font-size:8px;letter-spacing:4px;margin-top:2px}.start-content{padding:18px 0 20px}.intro{max-width:390px}.eyebrow{font-size:8px}.intro h1{font-size:36px;line-height:1.08;margin:10px 0 18px}nav{width:340px;gap:8px}.mode{padding:10px 15px;min-height:57px;gap:12px}.mode strong{font-size:22px}.mode small{font-size:9px;margin-top:2px}.mode .number{font-size:9px}.start-shell footer{padding-top:10px;font-size:8px}.footer-brand{font-size:8px}}
@media(max-width:680px){.start-shell{padding:22px 22px 18px;min-height:100svh}.brand{font-size:25px}.brand span{font-size:8px;letter-spacing:4px}.start-content{align-items:flex-start;padding:52px 0}.intro{max-width:none;width:100%}.eyebrow{font-size:8px;letter-spacing:.18em}.intro h1{font-size:46px;line-height:1.13;margin:16px 0 28px}nav{width:100%;max-width:none;gap:12px}.mode{padding:17px 16px;min-height:85px;gap:13px}.mode strong{font-size:25px}.mode small{font-size:9px}.mode b{font-size:21px}.start-shell footer{font-size:9px;gap:8px}.footer-brand{font-size:8px;letter-spacing:.05em}.start-shell footer>span:last-child{font-size:8px;white-space:nowrap}}
@media(prefers-reduced-motion:reduce){.menu-dots{animation:none!important}.mode{transition:none}}

@media(max-height:540px) and (max-width:680px) and (orientation:landscape){.start-shell{padding:14px 24px 12px}.brand{font-size:22px}.start-content{padding:18px 0 20px}.intro{max-width:320px}.intro h1{font-size:34px;margin:9px 0 16px}.eyebrow{font-size:8px}nav{width:300px;gap:8px}.mode{padding:9px 13px;min-height:55px}.mode strong{font-size:21px}.mode small{font-size:8px}.start-shell footer{padding-top:9px;font-size:8px}}
.intro{width:100%} @media(max-height:540px) and (max-width:680px) and (orientation:landscape){.start-shell{padding-top:12px;padding-bottom:10px}.start-content{padding-top:14px;padding-bottom:14px}}