/* Sol & the UV Shield Quest — styles from github.com/Wenxin-Wan/sun-safety-adventure (app/globals.css), Tailwind preflight replaced by a minimal reset */
*,*::before,*::after{box-sizing:border-box;border:0 solid}h1,h2,p{margin:0}button{background:none;cursor:pointer}

:root{--ink:#172333;--cream:#fff9e8;--gold:#f7c948;--teal:#176b69;--touch-scale:1;--touch-opacity:.78}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#0b2430;color:var(--ink);font-family:ui-rounded,"Arial Rounded MT Bold",system-ui,sans-serif}button,select,input{font:inherit}body{overflow:hidden}main{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 50% 15%,#246a72,#09212d 72%);padding:18px}.game-shell{width:min(1180px,100%);position:relative;background:#1a3141;border:1px solid rgba(255,255,255,.17);border-radius:22px;box-shadow:0 32px 90px #020b10cc,0 0 0 7px #0c1d28;overflow:hidden}.game-hud{height:74px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:8px 18px;background:linear-gradient(180deg,#fffdf2,#f6ebc9);border-bottom:4px solid #d3a944}.brand{display:flex;align-items:center;gap:10px}.sun-mark{display:grid;place-items:center;width:42px;height:42px;background:#f8ca45;border-radius:50%;font-size:25px;box-shadow:inset 0 -5px #e6a52d}.brand b{display:block;font-size:13px;letter-spacing:.08em}.brand small{display:block;color:#517174;font-weight:800;margin-top:3px}.uv{display:flex;align-items:center;gap:9px;background:#152c3a;color:#fff;border-radius:13px;padding:7px 12px;box-shadow:inset 0 0 0 2px #ffffff1f}.uv span{font-size:9px;font-weight:900;letter-spacing:.12em}.uv strong{font-size:29px;color:#ffd452;line-height:1}.uv i{font-style:normal;font-size:9px;font-weight:900;background:#e86e38;padding:4px 6px;border-radius:5px}.stats{display:flex;align-items:center;justify-content:flex-end;gap:9px;font-size:12px;font-weight:900}.stats strong{font-size:17px;color:#9e5b18}.stats button{border:0;background:#e6dab9;border-radius:9px;width:36px;height:36px;cursor:pointer;font-size:18px}.protection{position:absolute;z-index:2;top:82px;left:14px;display:flex;gap:6px;align-items:center}.protection span,.protection b{background:#163846d9;color:#fff;padding:6px 8px;border-radius:7px;font-size:9px;letter-spacing:.06em}.protection b{background:#176b69dd;color:#e9ffca}canvas{display:block;width:100%;aspect-ratio:16/9;max-height:calc(100vh - 150px);background:#8bd8ec;image-rendering:auto}footer{min-height:38px;display:flex;align-items:center;justify-content:center;gap:28px;color:#dbe7eb;font-size:10px;letter-spacing:.06em;padding:7px 12px}kbd{background:#f7f0d8;color:#20303a;border-radius:4px;padding:3px 6px;margin-left:4px;box-shadow:0 2px #9c8f71;font-weight:900}.touch-controls{position:absolute;left:max(16px,env(safe-area-inset-left));right:max(16px,env(safe-area-inset-right));bottom:calc(49px + env(safe-area-inset-bottom));display:none;justify-content:space-between;align-items:flex-end;pointer-events:none}.touch-controls>div{display:flex;gap:8px;transform:scale(var(--touch-scale));transform-origin:bottom left}.touch-controls button{pointer-events:auto;border:2px solid #fff8;background:rgba(17,44,61,var(--touch-opacity));color:white;width:58px;height:58px;border-radius:50%;font-weight:900;font-size:22px;touch-action:none;user-select:none}.touch-controls .jump{width:86px;font-size:12px;background:rgba(199,104,54,var(--touch-opacity));transform:scale(var(--touch-scale));transform-origin:bottom right}.touch-controls .joystick{pointer-events:auto;width:112px;height:72px;border:2px solid #ffffff99;border-radius:40px;background:rgba(17,44,61,var(--touch-opacity));display:grid;place-items:center;color:#fff;font-size:27px;touch-action:none;user-select:none}.touch-controls .joystick i{font-style:normal}.modal{position:fixed;z-index:10;inset:0;background:#07141cdc;display:grid;place-items:center;padding:max(22px,env(safe-area-inset-top)) max(22px,env(safe-area-inset-right)) max(22px,env(safe-area-inset-bottom)) max(22px,env(safe-area-inset-left));backdrop-filter:blur(8px)}.settings,.finish-card{width:min(480px,100%);max-height:92dvh;background:var(--cream);border-radius:24px;padding:30px;box-shadow:0 24px 80px #0008;position:relative;border:5px solid #f3cc59}.settings-scroll{overflow:auto;max-height:60dvh;padding-right:5px}.close{position:absolute;right:15px;top:12px;border:0;background:transparent;font-size:30px;cursor:pointer}.eyebrow{color:#b26026;font-size:11px;font-weight:1000;letter-spacing:.2em;margin:0 0 5px}.settings h2,.finish-card h1{margin:0 0 18px;font-size:30px}.settings label{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid #ded4b8;font-weight:750}.settings input[type="checkbox"]{width:19px;height:19px;accent-color:#16706a}.settings input[type="range"]{width:150px;accent-color:#16706a}.settings select{padding:5px;border-radius:7px;max-width:190px}.safe-note{font-size:11px;color:#536267;margin-bottom:0}.finish-card{text-align:center;width:min(610px,100%);overflow:hidden;padding:38px}.rays{font-size:65px;filter:drop-shadow(0 8px 0 #e89c2b);animation:pulse 1.6s infinite}.finish-card h1{font-size:39px;color:#196e66}.finish-card>p:not(.eyebrow){max-width:470px;margin:10px auto 22px}.score-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.score-grid div{background:#173343;color:#fff;border-radius:14px;padding:15px 7px}.score-grid strong,.score-grid span{display:block}.score-grid strong{font-size:24px;color:#ffd75a}.score-grid span{font-size:9px;font-weight:900;letter-spacing:.1em;margin-top:4px}.closing{font-weight:800;color:#53615a}.replay{border:0;border-radius:12px;background:#e66f34;color:#fff;padding:14px 22px;font-weight:1000;box-shadow:0 5px #a94825;cursor:pointer}.contrast .game-shell{filter:contrast(1.22) saturate(.9)}.dyslexia{font-family:Verdana,Tahoma,sans-serif}.large footer,.large .brand b,.large .stats{font-size:14px}.large .protection span,.large .protection b{font-size:12px}.quality-battery .game-shell{box-shadow:0 15px 35px #020b1088}.quality-battery .rays{animation:none}@keyframes pulse{50%{transform:scale(1.1) rotate(8deg)}}
@media(pointer:coarse),(max-width:760px){main{padding:0}.game-shell{border-radius:0;border:0;width:100%;height:100dvh}.game-hud{height:64px;grid-template-columns:auto 1fr;padding:6px max(9px,env(safe-area-inset-right)) 6px max(9px,env(safe-area-inset-left))}.brand{display:none}.uv{justify-self:start;padding:5px 7px}.uv i{display:none}.stats{justify-self:end}.stats span{display:inline;font-size:10px}.stats strong{font-size:11px}.stats button{width:32px;height:32px}.protection{top:68px;left:max(8px,env(safe-area-inset-left))}.protection b{display:none}canvas{width:100%;height:calc(100dvh - 95px);aspect-ratio:auto;max-height:none}.touch-controls{display:flex}footer{height:31px;min-height:31px}footer span{display:none}footer span:last-child{display:block}.score-grid{grid-template-columns:1fr}.finish-card{padding:25px}.finish-card h1{font-size:28px}}
@media(max-height:620px){main{padding:0}.game-shell{border-radius:0}footer{display:none}.touch-controls{bottom:12px}canvas{max-height:calc(100vh - 74px)}}
@media(max-width:760px) and (orientation:portrait){canvas{height:min(calc(100dvh - 210px),135vw)}.touch-controls{bottom:calc(42px + env(safe-area-inset-bottom))}.protection{max-width:42vw;overflow:hidden}}