@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@600;700;800;900&display=swap');
:root{font-family:Nunito,system-ui,sans-serif;color:#244e4c;background:#f5f1e5;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 0 0,#dfead9,transparent 55%),#f5f1e5;min-height:100vh}button,input{font:inherit}button{cursor:pointer;border:0;touch-action:none;user-select:none}button:focus-visible,input:focus-visible{outline:3px solid #e7a64b;outline-offset:4px}button:disabled{opacity:.6;cursor:wait}.shell{max-width:1120px;margin:auto;padding:24px 28px}header{display:flex;align-items:center;gap:12px;margin-bottom:22px}.logo{width:48px;height:48px;display:grid;place-items:center;background:#285e56;color:white;border-radius:17px;font-size:26px;box-shadow:0 4px 0 #1d4844}.eyebrow{font-size:9px;font-weight:900;letter-spacing:2px;margin:0;color:#739083}h1{font-size:25px;font-weight:900;letter-spacing:-1px;margin:0}.online{margin-left:auto;display:flex;align-items:center;gap:8px;font-size:11px;font-weight:800;color:#6d8475}.online i{width:7px;height:7px;border-radius:50%;background:#c7ad82}.online i.live{background:#64a67c;box-shadow:0 0 0 4px #64a67c18}.hidden{display:none!important}.welcome{max-width:760px;margin:30px auto 0;position:relative;border-radius:32px;background:#fffdf6;overflow:hidden;text-align:center;padding:0 36px 30px;box-shadow:0 18px 60px #31534712;border:1px solid #deded0}.welcome-art{margin:0 -36px 24px;height:220px;background:#c0e2d2;overflow:hidden}.welcome-art img{width:100%;height:100%;object-fit:cover}.welcome .kicker{font-size:10px;letter-spacing:2.5px;font-weight:900;color:#ad7f41;margin:0 0 10px}h2{font-size:42px;line-height:1.02;letter-spacing:-1.8px;margin:0 0 18px;font-weight:900}.welcome p{max-width:400px;margin:0 auto 22px;color:#798779;font-size:14px;line-height:1.6}.welcome form{display:flex;gap:10px;max-width:440px;margin:auto}input{min-width:0;flex:1;background:#f7f5eb;border:1px solid #dedfce;border-radius:14px;padding:15px;color:#34594f;font-weight:800;font-size:14px}.welcome button{background:#e97d58;color:#fffaf0;border-radius:14px;padding:12px 22px;font-weight:900;box-shadow:0 4px 0 #c56343}.welcome button span{margin-left:10px}.welcome small{display:block;font-size:11px;color:#8d9986;margin-top:18px}.error{color:#c0574e!important;font-size:12px!important;margin:12px auto 0!important}.game{background:#fffdf6;border:1px solid #dfdfcf;padding:14px;border-radius:28px;box-shadow:0 18px 60px #31534715}.hud{display:flex;align-items:center;padding:3px 8px 13px;gap:18px}.hud>div:first-child{display:flex;flex-direction:column;gap:3px}.hud b{font-size:11px;letter-spacing:1.4px}.hud span{font-size:10px;color:#869081}.meter{display:flex;align-items:center;gap:10px;margin-left:auto}.meter>span{font-size:20px}.meter>div{width:100px;height:9px;border-radius:10px;background:#e6e8d7;overflow:hidden}.meter i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#69a881,#b4ce80);border-radius:10px;transition:width .15s}.hud button{width:30px;height:30px;border-radius:50%;background:#eeeee2;color:#819181;font-size:21px}.route-track{height:3px;background:#e6eadd;margin:0 10px 9px;border-radius:4px;overflow:hidden}.route-track i{display:block;height:100%;background:#d79752;width:0;transition:width .2s}.scene{height:clamp(340px,58vh,620px);min-height:320px;background:#38b9c6;position:relative;border-radius:18px;overflow:hidden;touch-action:none}.scene:after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 80px #165f5e15}canvas{display:block;width:100%;height:100%}.hint{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);width:max-content;max-width:92%;text-align:center;border:1px solid #ffffff22;border-radius:12px;background:#205b6066;padding:7px 12px;color:#edfff3;font-size:10px;font-weight:800;pointer-events:none}.toast{position:absolute;top:16px;left:50%;transform:translateX(-50%);color:#fffef0;text-shadow:0 2px 8px #174b53;font-size:13px;font-weight:900;white-space:nowrap;pointer-events:none}.controls{display:flex;align-items:center;justify-content:center;gap:12px;padding:16px 8px 12px}.controls>div:first-child{display:flex;flex-direction:column;margin-right:auto;min-width:85px}.controls strong{font-size:14px}.controls span{font-size:10px;color:#8c987f}.controls button{height:52px;min-width:54px;border-radius:16px;font-weight:900;transition:transform .1s}.controls .turn{background:#e4eadb;color:#4b7462;font-size:25px;box-shadow:0 4px 0 #c9d5bc}.controls #fart{background:#e97e59;color:#fff9e8;padding:0 25px;box-shadow:0 4px 0 #bf6042;font-size:16px}.controls #fart span{font-size:21px;margin-right:8px}.controls button:active{transform:translateY(3px);box-shadow:none}.controls button.pop{animation:pop .2s}@keyframes pop{50%{transform:scale(.94)}}.keytip{margin-left:auto;font-size:10px;color:#8a9582}kbd{font:800 9px Nunito,system-ui;background:#edf0e4;border:1px solid #d9dfcf;border-radius:5px;padding:4px 6px;color:#6d7f68}.crew{display:flex;flex-wrap:wrap;gap:7px;padding:2px 8px 5px}.crew span{background:#f0f2e8;border-radius:20px;padding:6px 12px;font-size:11px;font-weight:800;color:#60745d}.finish{display:flex;align-items:center;justify-content:center;gap:15px;background:#e6efda;border-radius:15px;padding:15px;font-size:14px}.finish button{padding:10px;border-radius:10px;background:#438767;color:#fff}.finish strong{color:#3d6d51}footer{text-align:center;margin:22px auto 0;font-size:10px;font-weight:700;letter-spacing:.4px;color:#9ba48f}@media(max-width:700px){.shell{padding:14px 12px}.keytip{display:none}.controls>div:first-child{min-width:74px}.controls{gap:10px}.welcome{margin:18px auto 0}.scene{height:59svh;min-height:330px}.game{padding:10px;border-radius:23px}.hud{gap:10px}.hint{font-size:9px}.welcome-art{height:180px}h2{font-size:36px}}@media(max-width:390px){.controls{gap:8px;padding:14px 0}.controls button{min-width:44px;height:48px}.controls #fart{padding:0 13px;font-size:14px}.controls #fart span{display:none}.controls>div:first-child{min-width:64px}.meter>div{width:65px}.welcome{padding-left:22px;padding-right:22px}.welcome form{flex-direction:column}.welcome-art{margin-left:-22px;margin-right:-22px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.level-preview{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:24px}.level-preview span{font-size:10px;padding:8px 12px;border-radius:20px;background:#eff2e5;color:#718564;font-weight:900}.level-preview span:nth-child(2){background:#f6e5d5;color:#aa7853}.level-preview span:nth-child(3){background:#e4e9f0;color:#60748d}.hud .level-steps{font-size:11px;font-weight:900;border-radius:12px;background:#eef0e5;padding:6px 9px;margin-left:auto}.meter{margin-left:0}.hud #levelDetail{font-size:9px}.finish{position:relative}@media(max-width:390px){.hud #levelDetail{display:none}.hud{gap:7px}.meter>div{width:50px}.hud b{font-size:9px;letter-spacing:.5px}}

.welcome .room-form{flex-wrap:wrap}.room-form>input{flex-basis:50%}.join-room{display:flex;gap:10px;width:100%}.join-room input{width:0}.join-room button{background:#438767;box-shadow:0 4px 0 #31674d}.room-bar{display:flex;align-items:center;gap:12px;padding:6px 8px 14px;font-size:12px;color:#52776a}.room-bar strong{color:#285e56}.room-bar #roomLabel{font-size:22px;letter-spacing:3px}.room-bar #latency{margin-left:auto;font-size:10px}.lobby{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px;background:#e6efda;border-radius:14px;margin-bottom:12px;font-size:12px}.lobby button{background:#438767;color:white;padding:12px;border-radius:10px;white-space:nowrap}.controls button:disabled{opacity:.45;cursor:default}

/* iOS long presses must remain gameplay input, not text selection. */
.controls,.controls button,.controls button *{ -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; -webkit-tap-highlight-color:transparent; }
.controls button{touch-action:none;-webkit-user-drag:none;}
.controls button *{pointer-events:none;}
.controls button::selection,.controls button *::selection{background:transparent;}

.crew .kick-player{margin-left:8px;min-height:36px;padding:5px 10px;border-radius:12px;background:#f9ddd5;color:#913e31;font-size:11px;font-weight:800;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;}
.crew .kick-player:active{background:#efc2b7;}