:root{color-scheme:dark;--ink:#101722;--yellow:#fed002;--muted:#9aaec7}*{box-sizing:border-box}body{margin:0;background:#090f1b;color:#fff;font-family:Arial,Helvetica,sans-serif;min-height:100svh;padding:0 4vw;display:flex;flex-direction:column;justify-content:center}button,a{-webkit-tap-highlight-color:transparent}button{font:700 11px Arial;letter-spacing:1px;cursor:pointer;color:inherit}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #fed002;outline-offset:4px}button{border:1px solid #34415b;background:transparent;border-radius:4px;padding:12px}button:hover{border-color:#fed002}button:disabled{opacity:.5;cursor:default}.topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 0;max-width:min(1440px,calc((100svh - 180px)*16/9));width:100%;margin:auto auto 0}.brand{width:165px;display:block}.brand img{width:100%;height:auto}.edition{font-size:11px;letter-spacing:2px;color:#d6e5fd}.edition i{display:block;font-style:normal;font-size:8px;color:var(--muted);letter-spacing:1.5px;margin-top:7px}.tools{display:flex;gap:8px}.tools button{min-width:38px}main{width:100%;max-width:min(1440px,calc((100svh - 180px)*16/9));margin:0 auto}.screen{position:relative;aspect-ratio:16/9;background:#0432e9;border:1px solid #32405d;overflow:hidden;box-shadow:0 25px 80px #0006}canvas{width:100%;height:100%;display:block;image-rendering:pixelated}.overlay{position:absolute;inset:0}.title-screen{display:flex;background:#032dde}.title-art{width:60%;position:relative;overflow:hidden}.title-art img{width:150%;height:100%;object-fit:cover;object-position:center;position:absolute;left:-25%;image-rendering:pixelated}.menu-content{background:#071732;width:40%;padding:5% 4%;display:flex;flex-direction:column;justify-content:center;border-left:1px solid #4566c3}.eyebrow{font-size:9px;letter-spacing:2px;color:var(--yellow);font-weight:700}h1{font-size:clamp(20px,3.1vw,46px);line-height:1.06;letter-spacing:-1px;margin:20px 0}p{font-size:clamp(11px,1.1vw,16px);line-height:1.65;color:#b7c8e1}.primary{background:var(--yellow);color:#101722;border:0;padding:17px 20px;display:flex;justify-content:space-between;align-items:center;letter-spacing:1.5px;font-size:12px;box-shadow:0 4px 0 #ab9000}.primary:hover{background:#ffdf45}.start-hint{font-size:8px;letter-spacing:1px;color:#8398bd;margin-top:15px}.zone-list{display:flex;flex-wrap:wrap;gap:8px 13px;font-size:8px;letter-spacing:.6px;line-height:1.6;color:#8196ba;border-top:1px solid #2b3a57;margin-top:24px;padding-top:18px}.zone-list b{color:#fff}.control-strip{display:flex;align-items:center;gap:28px;padding:18px 20px;background:#121e30;border:1px solid #32405d;border-top:0;font-size:9px;font-weight:bold;letter-spacing:.8px;color:#b1c2da}.control-strip span{white-space:nowrap}kbd{border:1px solid #45516a;border-bottom-width:2px;border-radius:3px;padding:4px 7px;margin-right:4px;color:#fff;font:9px Arial}.control-strip button{margin-left:auto;border:0;padding:0;font-size:9px;color:#fed002}.bottom{width:100%;max-width:min(1440px,calc((100svh - 180px)*16/9));display:flex;justify-content:space-between;margin:20px auto auto;color:#74839c;font-size:8px;letter-spacing:1px}.bottom b{color:#fed002;padding:0 8px}.result{background:#06142de8;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:25px}.result h2{font-size:clamp(24px,5vw,60px);font-style:italic;margin:15px 0}.result p{white-space:pre-line;margin:0 0 24px}.result .primary{min-width:230px}.secondary{margin-top:20px;border:0;color:#b7c8e1}.touch{display:none;position:absolute;bottom:14px;left:14px;right:14px;justify-content:space-between;align-items:end;pointer-events:none}.touch button{touch-action:none;pointer-events:auto;background:#071c5088;border:2px solid #ffffff66;width:46px;height:46px;font-size:18px;padding:0;border-radius:50%;user-select:none}.dpad{display:grid;grid-template-columns:46px 46px 46px;grid-template-rows:40px 46px;gap:3px}.dpad [data-key=up]{grid-column:2}.dpad [data-key=left]{grid-row:2;grid-column:1}.dpad [data-key=down]{grid-row:2;grid-column:2}.dpad [data-key=right]{grid-row:2;grid-column:3}.touch .jump{height:62px;width:62px;background:#074aceb0}.touch button.active{background:#fed002b0;color:#101722}#zone-toast{position:absolute;right:6%;top:35%;font-size:clamp(22px,4vw,56px);font-weight:900;font-style:italic;text-shadow:3px 3px #001c65;white-space:pre-line;text-align:right;pointer-events:none}#air{position:absolute;top:22%;left:48%;font-size:40px;color:#fff;text-shadow:3px 3px #a00;font-weight:bold}#orientation{display:none;position:fixed;inset:0;background:#071732;z-index:10;align-items:center;justify-content:center;text-align:center;flex-direction:column;padding:25px}#orientation span{font-size:90px;color:#fed002}dialog{max-width:620px;width:90%;background:#0d1e3b;color:#fff;border:1px solid #486399;padding:30px;border-radius:8px}dialog::backdrop{background:#000a}dialog p{font-size:14px}.audio-settings{display:flex;gap:15px;flex-wrap:wrap;margin:20px 0}.audio-settings label{font-size:11px;width:150px;display:flex;flex-direction:column;gap:8px}[hidden]{display:none!important}@media(pointer:coarse),(max-width:950px){body[data-state=playing] .touch{display:flex}}@media(max-height:600px) and (orientation:landscape){body{padding:0 2vw}.topbar{padding:5px 0}.brand{width:95px}.edition{font-size:8px}.edition i{font-size:6px}.tools button{padding:7px;white-space:nowrap}main,.topbar{max-width:calc((100svh - 90px)*16/9)}.control-strip{padding:9px;gap:10px}.bottom{display:none}.menu-content{padding:3%}.menu-content h1{margin:10px 0;font-size:25px}.menu-content p{margin:0 0 12px;font-size:10px}.primary{padding:12px;font-size:10px}.zone-list{margin-top:10px;padding-top:8px;font-size:6px}.start-hint{font-size:6px;margin-top:9px}.eyebrow{font-size:7px}}@media(orientation:portrait){body{overflow:hidden}#orientation{display:flex}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}

#asset-status{font-size:10px;color:#fed002;margin:0 0 12px}

/* A partida ocupa a janela; somente o menu usa a apresentação do site. */
#exit-game,#play-help{display:none}
body.play-mode{--touch-space:0px;padding:0;height:100dvh;min-height:0;overflow:hidden;background:#000;justify-content:flex-start}
.play-mode .topbar{width:100%;max-width:none;height:44px;min-height:44px;margin:0;padding:0 max(8px,env(safe-area-inset-right)) 0 max(8px,env(safe-area-inset-left));justify-content:flex-end}
.play-mode .brand,.play-mode .edition,.play-mode .bottom,.play-mode .control-strip{display:none}
.play-mode .tools{gap:6px;align-items:center;height:44px}
.play-mode .tools button{padding:0 10px;min-height:44px;white-space:nowrap}
.play-mode #exit-game,.play-mode #play-help{display:block}
.play-mode main{max-width:none;margin:0;width:100%;height:calc(100dvh - 44px);padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);display:flex;flex-direction:column;align-items:center;justify-content:center}
.play-mode .screen{flex:none;width:min(calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right)),calc((100dvh - 44px - var(--touch-space) - env(safe-area-inset-top) - env(safe-area-inset-bottom))*16/9));border:0;box-shadow:none}
.play-mode .touch{position:static;flex:none;height:94px;min-height:94px;width:100%;padding:0 12px;align-items:center}
@media(pointer:coarse),(max-width:950px){
  body.play-mode{--touch-space:94px}
  .play-mode .touch{display:flex}
  .play-mode:not([data-state=playing]) .touch{visibility:hidden}
}
@media(orientation:landscape) and (max-height:500px) and (pointer:coarse),(orientation:landscape) and (max-height:500px) and (max-width:950px){
  body.play-mode{--touch-space:0px}
  .play-mode main{padding-left:calc(158px + env(safe-area-inset-left));padding-right:calc(78px + env(safe-area-inset-right))}
  .play-mode .screen{width:min(calc(100vw - 236px - env(safe-area-inset-left) - env(safe-area-inset-right)),calc((100dvh - 44px - env(safe-area-inset-top) - env(safe-area-inset-bottom))*16/9))}
  .play-mode .touch{position:fixed;top:44px;bottom:0;left:0;right:0;height:auto;width:auto;padding-left:calc(12px + env(safe-area-inset-left));padding-right:calc(12px + env(safe-area-inset-right));align-items:center}
}
