:root{--lime:#c6ff33;--ink:#161616;--cream:#f7f1d8;--gray:#6a6a66}
*{box-sizing:border-box}
html,body{margin:0;width:100%;min-height:100%;background:var(--lime)}
body{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,'Liberation Mono',monospace;color:var(--ink);overflow-x:hidden}
.game-shell{width:100%;max-width:1280px;margin:0 auto;padding:clamp(8px,2vw,25px);background:var(--lime)}
.game-topbar{min-height:72px;background:var(--ink);color:var(--cream);padding:12px clamp(12px,2.5vw,30px);display:flex;justify-content:space-between;align-items:center;gap:12px;border:3px solid var(--ink)}
.brand{font-size:clamp(18px,3.6vw,42px);font-weight:1000;font-style:italic;letter-spacing:-.08em;line-height:1;white-space:nowrap;text-shadow:2px 2px #777}
.brand>span:first-child{color:var(--lime)}.brand-line{display:block;width:100%;height:5px;background:var(--lime);margin-top:7px}
.scoreboard{display:flex;gap:clamp(10px,2.8vw,37px);text-align:right}.scoreboard div{display:flex;flex-direction:column;gap:4px}.scoreboard small{font-size:clamp(9px,1.3vw,13px);font-weight:900;color:var(--cream)}.scoreboard strong{font-size:clamp(14px,2.5vw,27px);color:var(--lime);letter-spacing:.08em;font-variant-numeric:tabular-nums}
.game-window{position:relative;width:100%;overflow:hidden;aspect-ratio:16/9;background:#d8f366;border:3px solid var(--ink);border-top:0;touch-action:manipulation;cursor:pointer;isolation:isolate}
canvas{display:block;width:100%;height:100%;image-rendering:pixelated;image-rendering:crisp-edges}
.overlay{position:absolute;inset:0;z-index:3;display:grid;place-items:center;background:rgba(14,16,14,.42);padding:10px}.overlay[hidden]{display:none}
.overlay-panel{background:#161616;color:var(--cream);border:5px solid var(--lime);outline:3px solid #161616;box-shadow:9px 9px 0 rgba(0,0,0,.45);width:min(88%,460px);padding:clamp(16px,3vw,30px);text-align:center}
.eyebrow{color:var(--lime);font-weight:900;font-size:clamp(9px,1.3vw,13px);letter-spacing:.12em;margin:0 0 12px}
h1{margin:0;font-size:clamp(32px,7vw,78px);line-height:.91;letter-spacing:-.1em;font-style:italic;text-shadow:3px 3px #666}h1 span{color:var(--lime)}
.overlay-text{font-size:clamp(10px,1.6vw,15px);line-height:1.45;max-width:310px;margin:18px auto}
#play-button{font:900 clamp(15px,2vw,21px) ui-monospace,monospace;background:var(--lime);color:var(--ink);border:3px solid var(--cream);padding:12px 32px;cursor:pointer;box-shadow:5px 5px 0 #777}#play-button:hover,#play-button:focus-visible{background:var(--cream);transform:translateY(-2px)}.key-tip{font-size:clamp(9px,1.2vw,12px);margin:18px 0 0;opacity:.8}
.pause-indicator{position:absolute;z-index:2;left:50%;top:34%;transform:translate(-50%,-50%);background:var(--ink);color:var(--lime);font-size:clamp(18px,4vw,36px);font-weight:900;padding:12px 20px;border:3px solid var(--lime);pointer-events:none}.pause-indicator[hidden]{display:none}
.game-footer{background:var(--ink);color:var(--cream);min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:10px 16px;font-size:clamp(10px,1.4vw,13px);font-weight:800}.instructions{display:flex;align-items:center;gap:9px}.keycap{background:var(--cream);color:var(--ink);padding:4px 7px;box-shadow:2px 2px #888}.footer-mobile{display:none}.footer-actions{display:flex;align-items:center;gap:8px}.footer-actions button{color:var(--lime);border:1px solid #777;background:transparent;font:800 11px ui-monospace,monospace;padding:7px 8px;cursor:pointer}.footer-actions button:hover{background:#343434}
@media(max-width:610px){.game-shell{padding:0}.game-topbar{min-height:58px}.game-footer{min-height:44px;padding:9px}.instructions>.keycap,.footer-desktop,.instructions>.keycap~span:not(.footer-mobile){display:none}.footer-mobile{display:inline;font-size:10px}.footer-actions button{font-size:10px;padding:6px}.game-window{aspect-ratio:4/3}.overlay-panel{width:min(92%,350px)}.overlay-text{margin:10px auto}.key-tip{margin-top:10px}}

/* SPRV original logo, rendered in crisp retro pixel art. */
.brand{display:flex;position:relative;align-items:center;gap:clamp(5px,1.2vw,14px);min-width:0;font-style:normal;letter-spacing:0;text-shadow:none;padding-bottom:7px}
.brand-logo{display:block;height:clamp(39px,5vw,58px);width:auto;image-rendering:pixelated;image-rendering:crisp-edges;object-fit:contain}
.brand-run{font-size:clamp(20px,3vw,35px);font-weight:1000;font-style:italic;color:var(--cream);letter-spacing:-.08em;white-space:nowrap;text-shadow:2px 2px #666}
.brand-line{position:absolute;bottom:0;left:0;right:0;width:auto;margin:0;height:4px}
.overlay-title{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:0;line-height:.82}
.overlay-logo{display:block;width:min(52%,155px);max-height:100px;object-fit:contain;image-rendering:pixelated;image-rendering:crisp-edges;filter:drop-shadow(3px 3px 0 #666)}
.overlay-title>span{display:block;color:var(--lime);font-size:clamp(30px,6vw,65px);font-style:italic;line-height:1;letter-spacing:-.08em}
@media(max-width:610px){.brand-logo{height:37px}.brand-run{font-size:20px}.scoreboard{gap:8px}.scoreboard strong{font-size:clamp(11px,3.3vw,18px)}.scoreboard small{font-size:9px}.game-topbar{padding:7px 8px}.overlay-logo{width:125px}}

/* V4 — Tela inicial de arcade com identidade SPRV. */
.overlay.is-home { background:linear-gradient(180deg,rgba(12,14,12,.58),rgba(12,14,12,.82)); }
.overlay.is-home .overlay-panel { width:min(88%,530px);max-height:97%;overflow:auto;background:#151715;border:5px solid var(--lime);box-shadow:10px 10px 0 rgba(0,0,0,.6); }
.overlay.is-home .overlay-logo {width:min(58%,195px);max-height:114px;}
.overlay.is-home .overlay-title>span {font-size:clamp(40px,7vw,77px);font-weight:1000;text-shadow:4px 4px 0 #414a22;}
.overlay.is-home #play-button {font-size:clamp(18px,2.4vw,25px);padding:12px 45px;animation:pixel-pulse 1.35s steps(2,end) infinite;}
.overlay.is-home .eyebrow {letter-spacing:.18em;font-size:clamp(9px,1.15vw,12px);}
.menu-footer {font-size:clamp(8px,1.1vw,11px);letter-spacing:.09em;margin:12px 0 0;color:#c6ff33;}
@keyframes pixel-pulse {50%{box-shadow:5px 5px 0 #777,0 0 0 3px #c6ff33}}
@media(max-width:610px){.overlay.is-home .overlay-panel{width:92%;padding:12px}.overlay.is-home .overlay-logo{max-height:68px}.overlay.is-home .overlay-text{font-size:10px;margin:8px auto}.overlay.is-home #play-button{padding:8px 26px}.menu-footer{font-size:8px;margin:6px 0 0}.overlay.is-home .key-tip{font-size:9px;margin:8px 0 0}.overlay.is-home .eyebrow{margin-bottom:5px}}
