:root{--yellow: #ffc21a;--ink: #1d2433;--panel: rgba(22, 27, 38, .92);--panel2: #252d3d;--text: #f4f6fb;--muted: #a9b2c4;--green: #3ddc84;--red: #ff5d5d;--font: "Arial Rounded MT Bold", "Trebuchet MS", "Segoe UI", system-ui, sans-serif;--sat: env(safe-area-inset-top, 0px);--sab: env(safe-area-inset-bottom, 0px);--sal: env(safe-area-inset-left, 0px);--sar: env(safe-area-inset-right, 0px)}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--ink);color:var(--text);font-family:var(--font);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:none;overscroll-behavior:none}#app{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden}#sky{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(#4b5568,#7d889c);transition:background .4s}#view{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}#ui{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}#ui button,#ui input,#ui select,#ui label{pointer-events:auto;font-family:inherit}.screen{position:absolute;top:0;right:0;bottom:0;left:0;display:none}.screen.on{display:block}.modal.on{display:flex;align-items:center;justify-content:center;background:#0a0e168c;pointer-events:auto;padding:16px}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;border-radius:14px;background:var(--panel2);color:var(--text);font-size:18px;font-weight:800;padding:12px 22px;cursor:pointer;box-shadow:0 4px #00000059;transition:transform .08s,filter .15s;letter-spacing:.02em}.btn:hover{filter:brightness(1.15)}.btn:active{transform:translateY(3px);box-shadow:0 1px #00000059}.btn.big{background:var(--yellow);color:var(--ink);font-size:22px;padding:14px 30px}.btn.icon{width:46px;height:46px;padding:0;font-size:18px;border-radius:12px}.btn:focus-visible{outline:3px solid #fff;outline-offset:2px}#title{pointer-events:none}#title.on{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:calc(16px + var(--sat)) 16px calc(16px + var(--sab))}.logo{text-align:center;transform:rotate(-3deg);filter:drop-shadow(0 8px 0 rgba(0,0,0,.35))}.logo .l1{font-size:clamp(46px,11vw,120px);font-weight:900;color:var(--yellow);line-height:.9;-webkit-text-stroke:clamp(4px,.9vw,9px) var(--ink);paint-order:stroke fill;letter-spacing:.02em}.logo .l2{margin-top:6px}.logo .l2 span{display:inline-block;font-size:clamp(26px,6vw,64px);font-weight:900;color:#fff;padding:2px 22px 6px;background:repeating-linear-gradient(-45deg,var(--ink) 0 18px,#2b3446 18px 36px);border:4px solid var(--yellow);border-radius:14px;letter-spacing:.18em}.tag{margin:8px 0 6px;font-size:clamp(15px,2.4vw,20px);color:#fff;text-shadow:0 2px 0 rgba(0,0,0,.5)}.menu{display:flex;flex-direction:column;gap:10px;align-items:stretch;min-width:240px;pointer-events:auto}.foot{margin-top:10px;font-size:16px;color:#fff;text-shadow:0 2px 0 rgba(0,0,0,.5)}#levels.on{background:linear-gradient(180deg,#0e121ce0,#0e121cb3);pointer-events:auto;overflow-y:auto;padding:calc(12px + var(--sat)) calc(16px + var(--sar)) calc(24px + var(--sab)) calc(16px + var(--sal))}#levels header{display:flex;align-items:center;gap:14px;max-width:1100px;margin:0 auto 8px}#levels header h2{margin:0;flex:1;font-size:26px}.total{font-weight:800;color:var(--yellow)}.biomes{max-width:1100px;margin:0 auto;display:flex;flex-direction:column;gap:14px}.biome h3{margin:6px 0 8px;font-size:19px;display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}.biome h3 small{color:var(--muted);font-size:14px;font-weight:600}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.lcard{position:relative;text-align:left;border:0;border-radius:14px;padding:12px 14px 10px 54px;background:var(--panel2);color:var(--text);cursor:pointer;display:flex;flex-direction:column;gap:2px;min-height:92px;box-shadow:0 4px #00000059;border-left:6px solid var(--yellow)}.biome.docks .lcard{border-left-color:#4aa8ff}.biome.site .lcard{border-left-color:#ff8a3d}.biome.port .lcard{border-left-color:#2fd3c8}.biome.mountain .lcard{border-left-color:#b983ff}.lcard:hover{filter:brightness(1.15)}.lcard .num{position:absolute;left:12px;top:12px;width:32px;height:32px;border-radius:50%;background:#ffffff1a;display:grid;place-items:center;font-weight:900}.lcard b{font-size:17px}.lcard small{color:var(--muted);font-size:13px}.lcard .stars{font-size:18px;margin-top:2px}.lcard .best{position:absolute;right:12px;bottom:10px;color:var(--muted);font-size:12px}.lcard.locked{opacity:.45;cursor:not-allowed}.star{color:#ffffff38}.star.on{color:var(--yellow)}#hud .bar{position:absolute;top:calc(10px + var(--sat));left:calc(10px + var(--sal));right:calc(10px + var(--sar));display:flex;align-items:center;gap:12px;pointer-events:none}#hud .bar>*{background:var(--panel);border-radius:12px;padding:6px 12px;min-height:46px;display:flex;flex-direction:column;justify-content:center}#hud .bar .btn.icon{padding:0;background:var(--panel)}#hud .lvl{flex:0 1 auto;min-width:0}#hud .lvl b,#hud .lvl small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#hud .lvl small,#hud .timer small,#hud .cond small{color:var(--muted);font-size:11px;letter-spacing:.06em}#hud .timer{margin-left:auto;text-align:center}#hud .timer b{font-size:20px;font-variant-numeric:tabular-nums}#hud .timer b.over{color:#ffb0a0}#hud .cond{width:180px;display:grid!important;grid-template-columns:auto 1fr auto;align-items:center;gap:8px}#hud .cond .meter{height:12px;background:#ffffff1f;border-radius:6px;overflow:hidden}#hud .cond .meter i{display:block;height:100%;width:100%;background:var(--green);transition:width .2s}#hud .cond b{font-variant-numeric:tabular-nums;min-width:42px;text-align:right}#hud .cond.hit{animation:hit .35s}@keyframes hit{30%{transform:scale(1.08);background:#a01e1ef2}}#hud .progress{position:absolute;top:calc(64px + var(--sat));left:calc(70px + var(--sal));right:calc(30px + var(--sar));height:6px;background:#00000059;border-radius:3px}#hud .progress i{display:block;height:100%;width:0;background:var(--yellow);border-radius:3px}#hud .progress .flag{position:absolute;right:-14px;top:-11px;color:var(--green);font-size:18px}#hud .gauges{position:absolute;left:calc(10px + var(--sal));top:calc(82px + var(--sat));display:flex;flex-direction:column;gap:8px}#hud .g{background:var(--panel);border-radius:12px;padding:6px 8px;width:64px;display:flex;flex-direction:column;align-items:center;gap:4px}#hud .g small{font-size:10px;color:var(--muted);letter-spacing:.06em}#hud .g b{font-size:12px;font-variant-numeric:tabular-nums;white-space:nowrap}#hud .col{width:14px;height:64px;background:#ffffff1f;border-radius:7px;display:flex;align-items:flex-end;overflow:hidden}#hud .col i{display:block;width:100%;background:var(--yellow);border-radius:7px}#hud .dial{width:40px;height:40px;border-radius:50%;background:#ffffff1a;position:relative}#hud .dial i{position:absolute;left:50%;bottom:50%;width:4px;height:18px;margin-left:-2px;background:var(--yellow);border-radius:2px;transform-origin:50% 100%}#hud .bubble{width:48px;height:14px;border-radius:7px;background:#ffffff1f;position:relative}#hud .bubble:after{content:"";position:absolute;left:50%;top:2px;bottom:2px;width:2px;background:#fff6}#hud .bubble i{position:absolute;top:2px;width:10px;height:10px;margin-left:-5px;border-radius:50%;background:var(--green);left:50%}#hud .hint{position:absolute;top:calc(80px + var(--sat));left:50%;transform:translate(-50%,-10px);width:min(560px,calc(100% - 180px));background:#fffffff0;color:var(--ink);border-radius:14px;padding:10px 16px;font-size:16px;line-height:1.3;text-align:center;opacity:0;transition:opacity .3s,transform .3s;box-shadow:0 6px #00000040;border-bottom:4px solid var(--yellow)}#hud .hint.on{opacity:1;transform:translate(-50%)}#hud .warn{position:absolute;top:calc(138px + var(--sat));left:50%;transform:translate(-50%);font-size:clamp(20px,3.4vw,30px);font-weight:900;color:#fff;background:#c82828e0;border-radius:12px;padding:6px 16px;opacity:0;white-space:nowrap;transition:opacity .15s}#hud .warn.on{opacity:1;animation:pulse .6s infinite alternate}#hud .warn.good{background:#1e8c50e6;animation:none}@keyframes pulse{to{transform:translate(-50%) scale(1.06)}}#hud .banner{position:absolute;top:24%;left:0;right:0;text-align:center;opacity:0;pointer-events:none}#hud .banner b{display:block;font-size:clamp(30px,6vw,60px);font-weight:900;color:var(--yellow);-webkit-text-stroke:6px var(--ink);paint-order:stroke fill}#hud .banner small{display:inline-block;margin-top:6px;font-size:18px;background:var(--panel);padding:4px 14px;border-radius:10px}#hud .banner.on{animation:banner 2.2s forwards}@keyframes banner{0%{opacity:0;transform:scale(.7)}12%{opacity:1;transform:scale(1.05)}20%{transform:scale(1)}80%{opacity:1}to{opacity:0}}.card{background:var(--panel);border-radius:20px;padding:22px 24px;width:min(420px,100%);display:flex;flex-direction:column;gap:10px;box-shadow:0 10px #0000004d;max-height:100%;overflow-y:auto;border-top:6px solid var(--yellow)}.card.wide{width:min(720px,100%)}.card h2{margin:0 0 4px;text-align:center;font-size:28px}.card h3{margin:8px 0 2px;color:var(--yellow);font-size:16px}.card p{margin:4px 0;line-height:1.4;color:#dfe4ee;font-size:15px}.card .cols{display:grid;grid-template-columns:1fr 1fr;gap:18px}kbd{display:inline-block;background:#3a4458;border-radius:6px;padding:1px 7px;font-family:inherit;font-size:13px;box-shadow:0 2px #11151d}.row{display:flex;align-items:center;justify-content:space-between;gap:14px;font-size:16px;padding:4px 0}.row input[type=range]{width:52%;accent-color:var(--yellow)}.row input[type=checkbox]{width:22px;height:22px;accent-color:var(--yellow)}.row select{background:var(--panel2);color:var(--text);border:0;border-radius:8px;padding:6px 10px;font-size:15px}#result .card.won{border-top-color:var(--green)}#result .card.lost{border-top-color:var(--red)}#result .card.lost h2{color:#ffb0a0}.rstars{text-align:center;font-size:54px;line-height:1;min-height:4px}.rstars .star.pop{animation:pop .45s}@keyframes pop{0%{transform:scale(.2)}60%{transform:scale(1.35)}to{transform:scale(1)}}.rstars .star{display:inline-block;text-shadow:0 3px 0 rgba(0,0,0,.35)}.rows{display:flex;flex-direction:column;gap:4px}.rows .r{display:flex;justify-content:space-between;background:#ffffff0f;border-radius:10px;padding:8px 12px}.rows .r.ok span{color:var(--yellow)}.rows .r.no span{color:var(--muted)}.rows .r.nb{justify-content:center;color:var(--green);font-weight:900}.tip{text-align:center}.acts{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:4px}.acts .btn{flex:1 1 auto}#fade{position:absolute;top:0;right:0;bottom:0;left:0;background:#0d1018;opacity:0;pointer-events:none;transition:opacity .2s}#fade.on{opacity:1}#rotate{position:absolute;left:50%;bottom:calc(14px + var(--sab));transform:translate(-50%);background:var(--panel);border-radius:12px;padding:8px 10px 8px 14px;font-size:14px;display:none;align-items:center;gap:8px;pointer-events:auto;white-space:nowrap;z-index:5}body.playing #rotate.show{display:flex}#rotate.gone{display:none}#rotate button{background:none;border:0;color:var(--muted);font-size:16px}#touch{position:absolute;top:0;right:0;bottom:0;left:0;display:none;pointer-events:none}#touch.show{display:block}#touch .pedal,#touch .stick,#touch button{pointer-events:auto;touch-action:none}#touch .pedal{position:absolute;left:calc(18px + var(--sal));bottom:calc(18px + var(--sab));width:min(44vw,300px);height:78px;border-radius:39px;background:#1419248c;border:2px solid rgba(255,255,255,.18)}#touch .pedal .track{position:absolute;left:30px;right:30px;top:50%;height:4px;margin-top:-2px;background:#ffffff26;border-radius:2px}#touch .pedal .pl,#touch .pedal .pr{position:absolute;top:50%;transform:translateY(-50%);font-size:12px;font-weight:900;color:#fff9}#touch .pedal .pl{left:14px}#touch .pedal .pr{right:16px;color:#3ddc84e6}#touch .knob{position:absolute;left:50%;top:50%;width:58px;height:58px;border-radius:50%;background:var(--yellow);box-shadow:0 4px #00000059;transform:translate(-50%,-50%)}#touch .on .knob{filter:brightness(1.1)}#touch .stick{position:absolute;right:calc(22px + var(--sar));bottom:calc(18px + var(--sab));width:156px;height:156px;border-radius:50%;background:#1419248c;border:2px solid rgba(255,255,255,.18)}#touch .stick span{position:absolute;font-size:10px;font-weight:900;color:#fff9;text-align:center;line-height:1.05}#touch .stick .su{top:8px;left:50%;transform:translate(-50%)}#touch .stick .sd{bottom:8px;left:50%;transform:translate(-50%)}#touch .stick .sl{left:6px;top:50%;transform:translateY(-50%)}#touch .stick .sr{right:6px;top:50%;transform:translateY(-50%)}#touch .stick .knob{width:62px;height:62px;background:#e8ecf4}#touch .brake{position:absolute;left:calc(min(44vw,300px) + 30px + var(--sal));bottom:calc(22px + var(--sab));width:76px;height:70px;border-radius:18px;border:0;background:#dc3232d9;color:#fff;font-weight:900;font-size:13px;box-shadow:0 4px #00000059}#touch .brake.on{transform:translateY(3px);background:#ff3b3b}#touch .horn{position:absolute;right:calc(190px + var(--sar));bottom:calc(30px + var(--sab));width:58px;height:46px;border-radius:14px;border:0;background:#14192499;color:#fff;font-weight:900;font-size:11px}body.touchui #hud .hint{font-size:15px}@media (max-width: 760px){.cards{grid-template-columns:1fr}#hud .cond{width:130px}#hud .lvl small{display:none}.card .cols{grid-template-columns:1fr}}@media (max-height: 520px){#hud .bar>*{min-height:40px;padding:4px 10px}#hud .bar .btn.icon{width:40px;height:40px}#hud .progress{top:calc(56px + var(--sat))}#hud .gauges{top:calc(70px + var(--sat));flex-direction:row}#hud .g{width:58px;padding:4px 6px}#hud .col{height:40px}#hud .dial{width:32px;height:32px}#hud .dial i{height:14px}#hud .hint{top:calc(70px + var(--sat));left:calc(50% + 110px);width:min(440px,calc(100% - 250px));font-size:13px;padding:6px 12px}#hud .warn{top:calc(150px + var(--sat));font-size:20px}.card.wide{width:min(760px,100%)}.card.wide p{font-size:13px;margin:2px 0}.card.wide h3{margin:4px 0 0}#touch .pedal{height:66px}#touch .knob{width:50px;height:50px}#touch .stick{width:132px;height:132px}#touch .stick .knob{width:54px;height:54px}#touch .horn{right:calc(166px + var(--sar))}.logo .l1{font-size:clamp(40px,9vw,86px)}.card{padding:14px 18px;gap:6px}.card h2{font-size:22px}.rstars{font-size:40px}#levels header h2{font-size:20px}}@media (max-width: 760px) and (max-height: 520px){.cards{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width: 480px){#hud .timer small{display:none}#hud .hint{width:calc(100% - 100px);left:calc(50% + 40px)}}@media (max-aspect-ratio: 4/5){#touch .pedal{width:calc(100% - 210px - var(--sal) - var(--sar));min-width:150px;left:calc(14px + var(--sal))}#touch .brake{left:calc(14px + var(--sal));bottom:calc(110px + var(--sab));width:92px;height:58px}#touch .horn{right:calc(34px + var(--sar));bottom:calc(190px + var(--sab))}#rotate{bottom:auto;top:calc(96px + var(--sat));left:calc(50% + 42px);white-space:normal;width:calc(100% - 110px);font-size:13px}#hud .hint{top:calc(150px + var(--sat));width:calc(100% - 110px);left:calc(50% + 42px)}#hud .warn{top:calc(250px + var(--sat));left:calc(50% + 40px)}}.home-link{position:absolute;left:calc(16px + var(--sal));bottom:calc(14px + var(--sab));color:#fff;text-decoration:none;font-weight:800;font-size:15px;background:var(--panel);padding:8px 14px;border-radius:12px;pointer-events:auto}.home-link:hover{background:var(--panel2)}body.touchui #howto .keys-only{display:none}body:not(.touchui) #howto .touch-only{display:none}#howto .card{padding-bottom:0}#howto .card>.btn{position:sticky;bottom:0;margin:8px -4px 14px;box-shadow:0 -8px 16px #161b26f2,0 4px #00000059}#howto .cols{grid-template-columns:1fr}@media (max-height: 520px){#result .tip{display:none}#result .acts{display:grid;grid-template-columns:1fr 1fr}#result .acts .btn{padding:9px 12px;font-size:16px}.rows .r{padding:5px 12px}}