.roof-world{max-width:900px;margin:auto;color:#eae6d9}.roof-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.roof-heading small{color:#a7c3c5;font-size:9px;letter-spacing:.15em}.roof-heading h2{font-size:52px;margin:0}.roof-world button{border:1px solid #6b9296;background:#183139;color:#e9e7d9;border-radius:9px;min-height:44px;padding:10px 16px;touch-action:manipulation}.roof-heading button{font-size:12px}.roof-hud{display:flex;justify-content:space-between;gap:18px;background:#0a1922;padding:12px;font-size:10px;color:#a7c3c5}.roof-hud b{display:block;font-size:21px;color:#eee9dc}.roof-hud progress{display:block;width:110px;margin-top:10px}.roof-world progress{accent-color:#b9dfd0}#roof-stage{font-size:10px;letter-spacing:.18em;margin:9px 0;color:#e0bb81}#roof-canvas{width:100%;height:auto;display:block;touch-action:none;border:1px solid #3d5e64;border-radius:8px}#roof-progress{width:100%;height:6px;display:block;margin:8px 0}.roof-controls{display:flex;gap:10px}.roof-controls button{flex:1;min-height:72px;font-weight:bold;font-size:18px}.roof-controls button:active{background:#497575}.roof-actions{display:flex;gap:10px;margin:8px 0}.roof-actions button{flex:1}#roof-start{background:#b7d6ce;color:#10232b}.roof-world [hidden]{display:none!important}.roof-world p,.roof-world details{font-size:13px;line-height:1.6}.roof-world details{margin-top:20px;color:#b3c7c8}.roof-world summary{cursor:pointer}.roof-world h3{font-size:36px}.roof-world #roof-results button{width:100%;border-color:#d5b783}.roof-world #roof-results .game-claim{display:block;margin:12px 0;padding:15px;border:1px solid #e4b572;border-radius:9px;background:#e4b572;color:#081419;text-align:center;text-decoration:none;font-weight:900;letter-spacing:.08em}.roof-world #roof-results .game-claim[hidden]{display:none}@media(max-width:600px){.roof-heading h2{font-size:34px}.roof-heading{margin-bottom:4px}.roof-heading small{font-size:7px}.roof-hud{padding:8px;font-size:9px}.roof-hud b{font-size:17px}.roof-hud progress{width:85px}.roof-controls button{font-size:13px;min-height:72px;padding:10px 5px}.roof-world p{font-size:12px}#roof-canvas{height:clamp(260px,calc(100svh - 340px),450px);object-fit:fill}}

.roof-controls,.roof-controls button,.drive-steer,.drive-steer button{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:none}.roof-controls button{ -webkit-tap-highlight-color:transparent; }
.arcade-world{max-width:900px;margin:0 auto;padding:10px 0 28px;color:#eae7d9}.arcade-world>small{font-size:10px;letter-spacing:.18em;color:#aac9ca}.arcade-world h2{font-size:clamp(44px,7vw,76px);line-height:1;margin:12px 0}.arcade-world>p{color:#b5ccca;margin:0 0 22px}.arcade-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.arcade-card{padding:0;text-align:left;border:1px solid #526d73;border-radius:14px;overflow:hidden;background:#0c1b23;color:#eee9db;cursor:pointer}.arcade-art{height:190px;position:relative;display:block;overflow:hidden;background:linear-gradient(#07142277,#09192355),url('assets/rooftop.jpg') center/cover}.arcade-card.runner-card .arcade-art{background-image:linear-gradient(#08152955,#17293655),url('assets/rooftop-skyline.jpg')}.arcade-art svg{width:100%;height:100%;filter:drop-shadow(0 0 9px #afd9d366)}.arcade-copy{display:block;padding:18px}.arcade-copy small{font-size:10px;letter-spacing:.14em;color:#d8b680}.arcade-copy strong{display:block;font:40px 'Bebas Neue',sans-serif;line-height:1.1;margin:9px 0}.arcade-copy p{font-size:13px;line-height:1.5;color:#adc7c8;margin:0 0 14px}.arcade-play{display:inline-block;border:1px solid #aac9c6;border-radius:6px;padding:9px 16px;font-size:13px}.arcade-card:hover,.arcade-card:focus-visible{border-color:#dfba7d;background:#152a33}.arcade-card:hover .arcade-play{background:#b8d4cc;color:#092027}@media(max-width:600px){.arcade-grid{grid-template-columns:1fr;gap:14px}.arcade-art{height:120px}.arcade-copy{padding:13px 16px}.arcade-copy strong{font-size:34px}.arcade-world h2{font-size:48px}.arcade-world>p{font-size:13px}.arcade-copy p{margin-bottom:10px}}
.arcade-card.world-card{grid-column:1/-1;display:grid;grid-template-columns:minmax(280px,.85fr) 1.15fr;border-color:#d8b66f;background:linear-gradient(115deg,#171b1d,#2d1f17)}.world-card .world-art{height:100%;min-height:215px;background:radial-gradient(circle at 50% 42%,#67431a,#101c21 58%,#071117)}.world-card .arcade-copy{display:flex;flex-direction:column;justify-content:center;padding:clamp(22px,4vw,42px)}.world-card .arcade-copy strong{font-size:clamp(42px,7vw,74px)}@media(max-width:600px){.arcade-card.world-card{display:block}.world-card .world-art{min-height:150px;height:150px}}

#roof-canvas{object-fit:contain;aspect-ratio:390 / 440}
@media(max-width:600px){#roof-canvas{width:min(100%,calc((100svh - 290px) * .8864));min-width:195px;height:auto;margin-inline:auto}}