@import url('https://fonts.googleapis.com/css2?family=Fredoka:wght@400;500;600;700&family=Nunito:wght@600;700;800;900&display=swap');
:root{font-family:Nunito,Arial,sans-serif;color:#fff;background:#7fc8ed;font-synthesis:none}
*{box-sizing:border-box}
body{min-width:320px;min-height:100vh;margin:0;overflow-x:hidden;background:linear-gradient(#61b7eb 0%,#a8ddf4 62%,#e7d1a3 62%,#c39c69 100%)}
body:before{content:"";position:fixed;z-index:0;left:0;right:0;bottom:0;height:35%;pointer-events:none;background:linear-gradient(transparent 0 35%,rgba(103,69,42,.18) 35% 36%,transparent 36% 70%,rgba(103,69,42,.14) 70% 71%,transparent 71%),repeating-linear-gradient(90deg,transparent 0 110px,rgba(99,65,39,.13) 111px 113px,transparent 114px 220px)}
button{font:inherit;cursor:pointer}
.sky{position:fixed;inset:0;overflow:hidden;pointer-events:none}.sky i{position:absolute;width:180px;height:55px;background:#fff;border-radius:60px;opacity:.9;filter:drop-shadow(0 5px 0 #dceef7)}.sky i:before,.sky i:after{content:"";position:absolute;bottom:14px;background:#fff;border-radius:50%}.sky i:before{left:24px;width:85px;height:80px}.sky i:after{left:91px;width:62px;height:65px}.sky i:nth-child(1){top:16%;left:-60px;transform:scale(.9)}.sky i:nth-child(2){top:33%;right:-70px;transform:scale(1.3)}.sky i:nth-child(3){top:68%;left:7%;transform:scale(.5);opacity:.7}
.game-shell{position:relative;z-index:1;max-width:920px;margin:0 auto;padding:24px 22px 20px}
.masthead{min-height:138px;padding:0 8px 18px}.eyebrow{margin:0 0 3px;font-size:13px;font-weight:900;letter-spacing:.18em;text-transform:uppercase;text-shadow:0 2px 0 #396c88}.masthead h1{position:relative;display:inline-block;margin:0;color:#fff;font-family:Fredoka,'Arial Rounded MT Bold',sans-serif;font-size:clamp(62px,10vw,112px);font-weight:700;letter-spacing:-.065em;line-height:.92;-webkit-text-stroke:3px #152333;text-shadow:0 4px 0 #152333,0 9px 0 #101c28,5px 13px 0 rgba(21,35,51,.25);transform:rotate(-2deg)}.beak{position:absolute;right:-26px;top:35%;width:39px;height:24px;border:3px solid #1b2836;border-radius:13px 70% 65% 13px;background:#ffc527;transform:rotate(8deg)}.tagline{max-width:580px;margin:14px 0 0;color:#123c5a;font-size:15px;font-weight:900}
.cabinet{display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:10px;padding:13px;border:4px solid #102033;border-radius:24px;background:#304d6d;box-shadow:inset 0 4px 0 #6a89a7,inset 0 -6px 0 #182b42,0 16px 0 #18283c,0 25px 30px rgba(31,48,52,.28)}
.board-frame{min-width:0;padding:10px;border:3px solid #11263b;border-radius:15px;background:#203852;box-shadow:inset 0 0 0 2px #57718c}.board-top{display:flex;justify-content:space-between;align-items:center;height:28px;padding:0 8px;color:#eaf6fa;font-size:13px;font-weight:900;letter-spacing:.18em}.board-light{width:9px;height:9px;border-radius:50%;background:#a4e65c;box-shadow:0 0 9px #a4e65c}
.board-wrap{position:relative;width:min(100%,420px);margin:auto;overflow:hidden;border:4px solid #0d1c2b;border-radius:8px;background:#162c42;box-shadow:inset 0 0 20px #0d1825,0 2px 0 #7087a1;aspect-ratio:1/2}.board-wrap canvas{display:block;width:100%;height:100%}.board-foot{padding:10px 3px 1px;text-align:center;color:#b8ccda;font-size:10px;font-weight:900;letter-spacing:.13em}
.sidebar{display:flex;flex-direction:column;gap:10px}.info-card,.controls-card{border:3px solid #112336;border-radius:14px;background:linear-gradient(145deg,#1c3149,#152639);box-shadow:inset 0 2px 0 #516b83,0 3px 0 #102133}.info-card h2,.controls-card h2{margin:0;padding:9px 8px;border-bottom:2px solid #0b1e30;text-align:center;font-family:Fredoka,Arial,sans-serif;font-size:20px;font-weight:600;letter-spacing:.04em}.next-card canvas{display:block;width:160px;height:128px;margin:10px auto}.stat-card{padding-bottom:11px}.stat-card output{display:block;margin:9px 12px 0;color:#abeb65;font-family:'Courier New',monospace;font-size:29px;font-weight:700;line-height:1.2;text-align:center;text-shadow:0 0 8px #76cc4e}.lines-value{display:flex;align-items:baseline;justify-content:center;gap:6px}.lines-value output{margin:9px 0 0}.lines-value span{color:#b5c8d5;font-weight:800}.progress{height:8px;margin:8px 19px 0;border-radius:10px;background:#0e1c2c;overflow:hidden}.progress span{display:block;width:0;height:100%;border-radius:10px;background:#a4e65c;transition:width .25s}.level-card{display:flex;flex-direction:column;align-items:center;gap:2px;padding:9px}.level-card span{font-size:12px;font-weight:900;letter-spacing:.15em}.level-card strong{color:#a4e65c;font-family:'Courier New',monospace;font-size:20px;letter-spacing:.04em}.controls-card{padding-bottom:11px}.controls-card h2{font-size:16px}.controls-card>div{display:flex;align-items:center;gap:5px;padding:5px 11px;color:#d9e6eb;font-size:12px;font-weight:800}.controls-card>div:first-of-type{padding-top:11px}.controls-card span{margin-left:auto;text-align:right}kbd{display:inline-flex;align-items:center;justify-content:center;min-width:25px;height:25px;padding:0 4px;border:1px solid #73879b;border-bottom:3px solid #657588;border-radius:5px;background:#e5edf0;color:#24384a;font-family:inherit;font-weight:900}.wide{min-width:63px;font-size:11px}
.game-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:15px;background:rgba(9,24,40,.73);backdrop-filter:blur(2px)}.game-overlay.hidden{display:none}.overlay-card{width:100%;max-width:290px;padding:25px 19px 22px;border:3px solid #17283a;border-radius:18px;background:#f8f5e9;color:#18344a;text-align:center;box-shadow:0 9px 0 #101c2a,0 18px 30px rgba(0,0,0,.25)}.overlay-gull{display:block;width:64px;height:64px;margin:auto;object-fit:contain}.overlay-kicker{margin:8px 0;color:#357394;font-size:11px;font-weight:900;letter-spacing:.15em}.overlay-card h2{margin:0;font-family:Fredoka,Arial,sans-serif;font-size:30px;line-height:1.05}.overlay-card p:not(.overlay-kicker){margin:10px 0 17px;font-size:13px;font-weight:800;line-height:1.4}.overlay-card button{min-width:160px;padding:9px 18px;border:3px solid #17283a;border-radius:11px;background:#ffca35;color:#182b40;font-family:Fredoka,Arial,sans-serif;font-size:20px;font-weight:700;box-shadow:0 4px 0 #ad7420}.overlay-card button:hover{background:#ffe075;transform:translateY(-1px)}.overlay-card button:active{transform:translateY(3px);box-shadow:0 1px 0 #ad7420}.overlay-hint{display:block;margin-top:12px;color:#698093;font-size:11px;font-weight:800}.footer-note{margin:28px 0 0;color:#3a352c;text-align:center;font-size:12px;font-weight:900}.footer-note span{color:#fff}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:700px){.game-shell{max-width:540px;padding:15px 10px 24px}.masthead{min-height:115px;padding-bottom:15px}.masthead h1{font-size:clamp(56px,14vw,82px)}.tagline{font-size:12px}.cabinet{grid-template-columns:minmax(0,1fr) 155px;gap:6px;padding:7px;border-width:3px}.board-frame{padding:5px}.sidebar{gap:6px}.info-card h2{font-size:14px;padding:5px}.next-card canvas{width:115px;height:92px;margin:3px auto}.stat-card{padding-bottom:7px}.stat-card output{font-size:18px;margin:5px 3px 0}.progress{margin:5px 10px 0}.level-card{padding:6px}.level-card strong{font-size:12px}.controls-card h2{font-size:12px;padding:6px}.controls-card>div{padding:3px 5px;font-size:10px}kbd{min-width:18px;height:20px;font-size:10px}.wide{min-width:43px;font-size:9px}.board-foot{font-size:8px}}
@media(max-width:430px){.cabinet{grid-template-columns:minmax(0,1fr) 112px}.eyebrow{font-size:10px}.masthead h1{font-size:58px}.tagline{font-size:11px}.board-top{font-size:9px}.info-card h2{font-size:11px}.next-card canvas{width:100px;height:80px}.stat-card output{font-size:14px}.level-card strong{font-size:10px}.controls-card>div{flex-wrap:wrap;justify-content:center}.controls-card span{width:100%;margin-left:0;text-align:center}.controls-card h2{font-size:10px}}