:root{--ink:#294b51;--muted:#748b8d;--teal:#32696c;--red:#bd626b;--blue:#4e87b6;--paper:#fcfcf5;--line:rgba(54,93,96,.14)}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html,body{width:100%;height:100%;overflow:hidden;background:#dfeaed;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;user-select:none;-webkit-user-select:none}
button,input,select{font:inherit}button{cursor:pointer;border:none;color:inherit}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #75afb5;outline-offset:3px}button:active{transform:translateY(1px)}button{transition:background .18s,transform .18s,box-shadow .18s}input{user-select:text;-webkit-user-select:text}
#cv{position:fixed;inset:0;width:100%;height:100%;touch-action:none;cursor:crosshair}#menu{position:fixed;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;padding:26px;background:linear-gradient(105deg,rgba(236,244,239,.88),rgba(226,237,235,.77));backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);overflow:auto;touch-action:pan-y}
.lobby{display:grid;grid-template-columns:1.12fr .88fr;max-width:1160px;width:100%;gap:60px;align-items:center}.welcome{position:relative;min-height:714px}.brand{display:flex;gap:13px;align-items:center;letter-spacing:3px;font-size:16px;font-weight:800}.brand-symbol{display:grid;place-items:center;background:var(--teal);border-radius:14px;color:#f8fbef;font-size:34px;width:49px;height:49px}.brand small{display:block;font-size:10px;font-weight:500;letter-spacing:5px;margin-top:6px;color:#6d888b}.intro{position:relative;z-index:2;margin-top:44px}.eyebrow{font-size:10px;font-weight:750;letter-spacing:2.4px;color:#7d9391}.intro h1{font-size:57px;line-height:1.2;letter-spacing:-1.8px;margin:13px 0 18px;font-weight:850}.intro h1 span{color:var(--teal)}.intro p{font-size:14px;line-height:1.9;color:#6f8786}
.hero-stage{position:absolute;left:0;right:0;bottom:42px;height:420px}.hero-glow{position:absolute;width:370px;height:370px;left:120px;top:20px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.86),rgba(236,247,243,.15) 70%)}#heroArt{position:absolute;height:436px;right:0;bottom:0;z-index:2;filter:drop-shadow(0 17px 14px rgba(57,89,96,.16));transform:rotate(3deg)}.hero-ground{position:absolute;bottom:-9px;left:150px;right:0;height:50px;background:radial-gradient(ellipse,rgba(103,146,151,.22),transparent 70%)}.winter-stamp{position:absolute;left:31px;bottom:144px;border:1px solid rgba(74,110,111,.35);border-radius:50%;width:105px;height:105px;text-align:center;display:flex;flex-direction:column;justify-content:center;line-height:1.6;font-size:9px;letter-spacing:1.5px;transform:rotate(-14deg);color:#74918f}.winter-stamp strong{font-size:12px}.hero-caption{position:absolute;left:18px;bottom:38px;font-size:11px;letter-spacing:2px;color:#829790}.live-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#71a589;margin-right:7px;vertical-align:middle}.edition{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:14px;font-size:10px;letter-spacing:1px;color:#7d9290}.edition span{font-size:9px}
.setup-card{padding:29px 29px 23px;border-radius:27px;border:1px solid rgba(255,255,255,.9);background:rgba(255,255,248,.92);box-shadow:0 24px 70px rgba(70,106,102,.11),0 2px 3px rgba(42,75,78,.03);max-width:465px}.card-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.card-heading h2{font-size:25px;letter-spacing:-.5px;margin-top:7px}.snow-mark{font-size:40px;color:#a2bfba;font-weight:300}.field-label{display:block;font-size:11px;font-weight:650;color:#698280;margin-bottom:8px;letter-spacing:.5px}#nameInput{width:100%;border:1px solid var(--line);background:#f0f4ee;color:var(--ink);border-radius:11px;padding:12px 14px;font-size:14px;margin-bottom:19px;outline-color:#88a7a1}.modeRow{display:flex;flex-direction:column;gap:8px;margin-bottom:18px}.modeBtn{display:flex;align-items:center;position:relative;width:100%;padding:13px 12px;text-align:left;border-radius:12px;border:1px solid var(--line);background:#fffefa;gap:10px}.modeBtn:hover{background:#f1f5ef}.modeBtn.sel{background:#eaf1e9;border-color:#729c91;box-shadow:inset 0 0 0 .5px #729c91}.mode-icon{display:grid;place-items:center;font-size:27px;width:31px;color:#6b9892;flex-shrink:0}.mode-copy{flex:1}.mode-copy b{font-size:13px}.mode-copy small{display:block;margin-top:5px;font-size:10px;color:#80918a}.mode-size{font-size:10px;color:#8b9b92;white-space:nowrap;margin-right:5px}.checkmark{display:none;font-size:11px;color:var(--teal);position:absolute;right:7px;top:5px}.sel .checkmark{display:block}.option-row{display:flex;gap:10px;margin-bottom:15px}.option-row label{flex:1;font-size:10px;color:#80928c}.option-row select{display:block;background:transparent;padding:7px 1px;width:100%;border:0;border-bottom:1px solid var(--line);font-size:11px;color:var(--ink);outline-color:#8db4a9}.online-switch{display:flex;align-items:center;gap:8px;font-size:11px;margin:14px 0 15px}.online-switch input{accent-color:var(--teal);width:14px;height:14px}.online-switch small{color:#95a19b;font-size:9px;margin-left:5px}#roomRow{display:none;align-items:center;gap:10px;font-size:11px;margin-bottom:12px}#roomCode{letter-spacing:3px;font-family:monospace;font-weight:700;flex:1}#btnCopy{background:#e5eee6;border-radius:7px;padding:7px 9px;font-size:10px}#joinHint{display:none;font-size:11px;line-height:1.7;color:#b07a47;margin-bottom:10px}#btnStart,.primary{width:100%;padding:17px 19px;border-radius:12px;background:var(--teal);color:#fffaf0;font-size:15px;font-weight:700;display:flex;align-items:center;justify-content:space-between;box-shadow:0 8px 18px rgba(47,98,96,.13)}#btnStart:hover,.primary:hover{background:#245758;transform:translateY(-1px)}.start-arrow{font-size:23px;font-weight:400;line-height:.8}.start-note{text-align:center;font-size:10px;color:#94a199;margin:10px 0 18px}.controls{border-top:1px solid var(--line);padding-top:14px;font-size:10px;line-height:2;color:#748985}.controls p{margin-top:6px;font-size:10px;line-height:1.7;color:#98a79c}kbd{display:inline-block;font:9px inherit;background:#eef1e9;border:1px solid #e0e7df;padding:0 5px;border-radius:4px;line-height:18px;color:#4d6a63}.sep{padding:0 5px;color:#adbab0}
.glass{background:rgba(255,255,248,.89);border:1px solid rgba(255,255,255,.95);box-shadow:0 6px 24px rgba(54,93,108,.1);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}#hud{display:none;position:fixed;inset:0;pointer-events:none;z-index:3}#identity{position:absolute;left:22px;top:calc(20px + env(safe-area-inset-top));height:65px;border-radius:16px;display:flex;align-items:center;padding:0 17px 0 6px;gap:8px;min-width:173px}#avatarArt{width:45px;height:57px;object-fit:cover;object-position:top;margin-top:3px}#playerName{font-size:12px;font-weight:800;display:block;margin-bottom:8px}.you-label{font-size:8px;letter-spacing:1px;color:#8ea6a0;margin:0 0 17px 15px}#healthPips{display:flex;gap:4px}.hp-pip{width:20px;height:5px;border-radius:5px;background:#719c9b}.hp-pip.empty{background:#e0e6e1}.hp-pip.protect{background:#b9a876}#topbar{position:absolute;top:calc(20px + env(safe-area-inset-top));left:50%;transform:translateX(-50%)}#score{min-width:305px;border-radius:18px;padding:11px 22px;display:flex;align-items:center;justify-content:center;gap:22px}.team-score{display:flex;gap:10px;align-items:center;min-width:56px}.team-score strong{font-size:28px;font-weight:800;line-height:1.1;font-variant-numeric:tabular-nums}.team-score small{font-size:9px;white-space:nowrap}.team-score.red{color:var(--red)}.team-score.blue{color:var(--blue)}.round-center{text-align:center}.round-center b{display:block;font-size:10px;letter-spacing:1px;color:#637e7b;white-space:nowrap}.round-center small{display:block;margin-top:5px;font-size:8px;color:#95a59f;white-space:nowrap}#btns{position:absolute;right:22px;top:calc(25px + env(safe-area-inset-top));display:flex;gap:7px;pointer-events:auto}#btns button{display:grid;place-items:center;width:37px;height:37px;background:rgba(255,255,248,.86);border:1px solid rgba(255,255,255,.9);border-radius:11px;font-size:19px;box-shadow:0 3px 10px rgba(73,115,124,.06)}#btns button:hover{background:white}#btnInvite{display:none!important}#statusWrap{position:absolute;top:calc(94px + env(safe-area-inset-top));left:27px;font-size:9px;color:#748e90;letter-spacing:.7px}#feed{position:absolute;top:121px;left:24px;max-width:225px;display:flex;flex-direction:column;gap:5px}.feed-item{font-size:10px;line-height:1.4;padding:7px 11px;background:rgba(249,253,245,.82);border-radius:8px;border-left:3px solid #b8cdbf;animation:feedIn .2s ease-out}.feed-item.red{border-color:#c87980}.feed-item.blue{border-color:#79a8d1}@keyframes feedIn{from{opacity:0;transform:translateX(-7px)}to{opacity:1;transform:translateX(0)}}
#ballsHud{position:absolute;bottom:calc(22px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);border-radius:18px;padding:12px 19px;min-width:310px;text-align:center}.ammo-top{display:flex;align-items:center;justify-content:space-between;gap:20px}.ammo-label{font-size:9px;letter-spacing:1px;color:#89a099;text-align:left}.ammo-label b{display:block;font-size:12px;color:#486b6b;letter-spacing:0;margin-top:4px}.ammo-slots{display:flex;gap:6px}.ammo-dot{width:24px;height:24px;background:radial-gradient(circle at 32% 26%,white 25%,#f4f8fa 55%,#c8dce7);border-radius:50%;border:1px solid #b8cbd1;box-shadow:0 2px 3px rgba(64,111,135,.1)}.ammo-dot.empty{background:#e6ece7;border:1px dashed #b7c9bf;box-shadow:none}.coin{font-size:12px;color:#aa8856;font-weight:700;white-space:nowrap}.charge-track{height:5px;border-radius:8px;background:#e1e8df;margin:10px 0 7px;overflow:hidden}.charge-fill{height:100%;border-radius:8px;background:#6b9f9b;transition:width .06s linear}.charge-fill.full{background:#b3a572}.ammo-hint{font-size:9px;color:#92a39b}.ammo-hint strong{color:#577e77;font-weight:600}#crosshairHint{position:absolute;left:50%;bottom:132px;transform:translateX(-50%);font-size:10px;color:#638584;text-align:center;white-space:nowrap;letter-spacing:.5px}
#toast{position:fixed;top:110px;left:50%;transform:translateX(-50%);z-index:40;background:rgba(40,74,78,.93);color:#f9fff4;padding:11px 19px;font-size:12px;border-radius:12px;max-width:90vw;text-align:center;pointer-events:none;opacity:0;transition:opacity .2s;box-shadow:0 6px 22px rgba(40,74,78,.12)}#freezeNotice{display:none;position:fixed;left:50%;top:42%;transform:translateX(-50%);z-index:7;background:rgba(245,252,254,.95);border:1px solid white;border-radius:18px;padding:16px 26px;text-align:center;box-shadow:0 10px 30px rgba(91,131,151,.15);pointer-events:none;font-size:13px;color:#58859c}#freezeNotice b{display:block;font-size:27px;margin:6px 0}#freezeNotice small{font-size:10px;color:#8aa0a9}
#joy{display:none;position:fixed;width:120px;height:120px;border-radius:50%;border:1px solid rgba(255,255,255,.9);background:rgba(237,246,242,.34);z-index:5;pointer-events:none;box-shadow:inset 0 0 0 12px rgba(255,255,255,.12)}#stick{position:absolute;left:50%;top:50%;width:48px;height:48px;margin:-24px;border-radius:50%;background:rgba(84,133,132,.45);border:2px solid rgba(255,255,255,.8)}#btnSkill{display:none;position:fixed;right:28px;bottom:calc(27px + env(safe-area-inset-bottom));z-index:7;width:86px;height:86px;border-radius:50%;background:radial-gradient(circle at 30% 20%,#faffef,#deeae2);color:#548780;border:3px solid rgba(255,255,255,.9);box-shadow:0 6px 22px rgba(64,112,119,.17);touch-action:none}#btnSkill span{display:block;font-size:35px;line-height:1}#btnSkill small{font-size:9px;letter-spacing:2px;display:block;margin-top:5px}#btnSkill.charging{box-shadow:0 0 0 9px rgba(170,190,155,.22);border-color:#9db995;background:#f7ffe4}body.playing.touch #btnSkill{display:block}#btnShop{display:none;position:fixed;right:41px;bottom:132px;width:51px;height:51px;border-radius:50%;z-index:7;background:#e8dfb9;color:#887552;border:2px solid white;font-size:24px}#mobileMoveHint{display:none}#shop{display:none;position:fixed;right:23px;top:90px;z-index:10;width:298px;padding:22px;border-radius:20px;color:var(--ink)}#shop h3{font-size:21px;margin:6px 0 17px}#shopClose{position:absolute;right:14px;top:10px;background:none;font-size:22px;color:#9aa79b}.shop-points{font-size:11px;color:#8c9c8e;margin-bottom:12px}.pts{font-size:17px;color:#a38451;margin-left:6px;font-weight:700}.shopRow{display:flex;gap:8px;align-items:center;justify-content:space-between;padding:11px 0;border-top:1px solid var(--line)}.shopRow .nm{font-size:12px;font-weight:650}.shopRow .ds{font-size:9px;color:#8b9c91;margin-top:5px}.shopRow button{background:#e0e9d9;border:1px solid #d7e2ce;border-radius:7px;font-size:11px;padding:8px 9px;min-width:46px}.shopRow button:disabled{opacity:.42;cursor:default}.shopHint{font-size:10px;color:#96a298;line-height:1.8;margin-top:14px}
.modal{position:fixed;inset:0;z-index:30;display:none;align-items:center;justify-content:center;background:rgba(208,226,225,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);padding:20px}.modal-card{width:365px;background:#fffff6;border:1px solid white;box-shadow:0 30px 100px rgba(72,114,119,.13);border-radius:26px;padding:32px;text-align:center}.modal-symbol{font-size:48px;line-height:1;display:block;color:#8cb0a0;margin-bottom:17px}.modal-card h2{font-size:24px;margin:12px 0}.modal-card p{font-size:12px;color:#8b9f96;line-height:1.8}.primary{margin-top:22px;display:block;font-size:14px;padding:14px}.secondary{width:100%;background:#edf1e6;padding:12px;border-radius:10px;margin-top:9px;font-size:12px}.pause-keys{font-size:10px;color:#95a499;line-height:1.9;margin-top:23px}#resultScore{font-size:42px;letter-spacing:9px;font-weight:800;color:#6f96a1;margin:18px 0}#resultStats{display:flex;justify-content:center;gap:25px;margin:20px 0 25px}#resultStats strong{display:block;font-size:22px}#resultStats small{display:block;font-size:10px;color:#97a59c;margin-top:5px}#roundScreen{pointer-events:none}#rotateHint{display:none!important}
@media(min-width:1500px){.lobby{gap:85px;max-width:1230px}.welcome{min-height:748px}.intro h1{font-size:66px}.hero-stage{height:440px}#heroArt{height:458px}.setup-card{padding:33px;max-width:480px}}
@media(max-width:1100px){.lobby{gap:28px;max-width:950px}.intro h1{font-size:48px}.welcome{min-height:675px}.intro{margin-top:30px}.hero-stage{height:350px}#heroArt{height:360px}.winter-stamp{left:7px;bottom:160px;width:87px;height:87px}.hero-caption{left:5px;bottom:27px;font-size:10px}.setup-card{padding:24px}.online-switch small{font-size:8px}.mode-copy small{font-size:9px}.edition{font-size:8px}}
@media(max-width:820px){#identity{min-width:145px;padding-right:10px;left:12px;top:12px;height:56px}.you-label{display:none}#topbar{top:12px}#score{padding:10px 14px;min-width:249px;gap:15px}.team-score{min-width:42px;gap:7px}.team-score strong{font-size:24px}.team-score small{font-size:8px}#btns{right:12px;top:21px;gap:5px}#btns button{width:30px;height:30px;font-size:16px}#btnRestart{display:none}#statusWrap{top:77px;left:17px;font-size:8px}#feed{top:100px;left:15px;max-width:185px}.feed-item{font-size:9px;padding:6px 8px}#toast{top:86px;font-size:11px}#ballsHud{min-width:260px;bottom:14px;padding:10px 14px}.ammo-dot{width:20px;height:20px}.ammo-label{font-size:8px}.ammo-label b{font-size:10px}.ammo-hint{font-size:8px}#crosshairHint{bottom:115px;font-size:9px}}
@media(max-height:730px) and (min-width:821px){#menu{padding:15px}.lobby{max-width:980px;gap:55px}.welcome{min-height:595px}.brand{font-size:13px}.brand-symbol{width:40px;height:40px}.intro{margin-top:22px}.intro h1{font-size:45px;margin-bottom:10px}.intro p{font-size:12px}.hero-stage{height:305px;bottom:25px}#heroArt{height:335px}.winter-stamp{bottom:110px}.hero-caption{bottom:30px}.edition{font-size:8px}.setup-card{padding:19px 24px}.card-heading{margin-bottom:15px}.card-heading h2{font-size:21px}#nameInput{padding:9px 12px;margin-bottom:13px}.modeRow{gap:6px;margin-bottom:12px}.modeBtn{padding:9px 10px}.option-row{margin-bottom:9px}.online-switch{margin:10px 0}.start-note{margin-bottom:12px}.controls{padding-top:9px}#btnStart{padding:14px 17px}}
@media(max-width:690px){#menu{display:block;padding:22px 17px;overflow:auto}.lobby{display:flex;flex-direction:column;gap:20px;max-width:445px;margin:auto}.welcome{min-height:173px;width:100%}.brand{font-size:12px;letter-spacing:2px}.brand small{font-size:8px;letter-spacing:3px}.brand-symbol{width:37px;height:37px;font-size:28px}.intro{margin-top:23px}.intro .eyebrow{font-size:8px}.intro h1{font-size:31px;margin-top:8px;line-height:1.15;letter-spacing:-.8px}.intro p,.winter-stamp,.hero-caption,.edition{display:none}.hero-stage{left:auto;width:147px;height:190px;right:4px;bottom:0}#heroArt{height:186px;right:0}.hero-glow{width:150px;height:150px;left:0}.hero-ground{left:0}.setup-card{width:100%;max-width:none;padding:23px;border-radius:21px}.card-heading h2{font-size:23px}.mode-copy small{font-size:10px}.online-switch small{font-size:8px}#identity{left:9px;top:calc(9px + env(safe-area-inset-top));min-width:97px;height:50px;padding:0 9px 0 0;gap:0;border-radius:12px}#avatarArt{width:33px;height:43px}#playerName{font-size:10px;max-width:61px;overflow:hidden;white-space:nowrap;margin-bottom:7px}.hp-pip{width:14px;height:4px}#topbar{top:calc(9px + env(safe-area-inset-top));left:auto;right:9px;transform:none}#score{min-width:213px;gap:11px;padding:9px 11px;border-radius:12px}.team-score{min-width:38px}.team-score strong{font-size:23px}.round-center b{font-size:9px}.round-center small{font-size:8px}#btns{top:calc(68px + env(safe-area-inset-top));right:10px}#btns button{height:30px;width:30px;background:rgba(255,255,250,.78)}#statusWrap{top:calc(74px + env(safe-area-inset-top));left:12px;letter-spacing:0;font-size:8px}#feed{top:110px;max-width:165px;left:11px}#ballsHud{bottom:calc(25px + env(safe-area-inset-bottom));left:14px;transform:none;min-width:0;width:calc(100% - 146px);padding:10px 12px;border-radius:14px}.ammo-top{gap:7px}.ammo-label{display:none}.ammo-dot{width:18px;height:18px}.ammo-slots{gap:4px}.coin{font-size:10px}.ammo-hint{line-height:1.4;font-size:8px}.charge-track{margin:7px 0 6px;height:4px}#crosshairHint{bottom:132px;font-size:9px;max-width:90vw;white-space:normal}#btnSkill{width:83px;height:83px;bottom:calc(29px + env(safe-area-inset-bottom));right:22px}#mobileMoveHint{display:block;position:absolute;bottom:130px;left:24px;font-size:9px;color:#8aa49f;letter-spacing:1px}#toast{top:110px;max-width:82vw;line-height:1.5}#shop{top:113px;right:14px;max-height:calc(100vh - 145px);overflow-y:auto}#freezeNotice{top:36%;min-width:180px;font-size:12px}}
@media(pointer:coarse) and (orientation:landscape){#menu{padding:16px;align-items:flex-start}.lobby{max-width:790px;gap:28px;align-items:start}.welcome{min-height:345px}.brand{font-size:11px}.brand-symbol{width:35px;height:35px}.intro{margin-top:22px}.intro .eyebrow{font-size:8px}.intro h1{font-size:34px}.intro p{display:none}.hero-stage{height:205px;bottom:13px}#heroArt{height:211px;right:0}.winter-stamp,.hero-caption,.edition{display:none}.setup-card{padding:19px;width:365px;max-width:100%}.card-heading{margin-bottom:15px}.card-heading h2{font-size:21px}.modeBtn{padding:9px}.modeRow{gap:6px}.controls{font-size:9px}#ballsHud{bottom:15px;min-width:260px;max-width:310px}#crosshairHint{bottom:112px}#btnSkill{width:80px;height:80px;right:30px;bottom:24px}#mobileMoveHint{display:block;position:absolute;bottom:23px;left:50px;font-size:9px;color:#86a2a0;letter-spacing:1px}#feed{top:106px;max-width:165px}#shop{top:76px;max-height:calc(100vh - 95px);overflow:auto}#btnShop{right:47px;bottom:118px;width:43px;height:43px}#toast{top:81px}.modal-card{padding:19px 25px}.modal-symbol{font-size:32px;margin-bottom:10px}.pause-keys{margin-top:12px}.modal-card h2{font-size:20px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* A landscape phone should reach Play without a tall desktop settings form. */
@media(pointer:coarse) and (orientation:landscape) and (max-height:500px){
  #menu{padding:13px 22px}.lobby{gap:30px;max-width:790px}.welcome{min-height:337px}.setup-card{padding:14px 18px;width:365px;border-radius:18px}.card-heading{margin-bottom:9px}.card-heading .eyebrow{font-size:8px}.card-heading h2{font-size:19px;margin-top:4px}.snow-mark{font-size:29px}.field-label{font-size:9px;margin-bottom:5px}#nameInput{padding:7px 10px;font-size:12px;margin-bottom:9px}.modeRow{gap:4px;margin-bottom:9px}.modeBtn{padding:6px 9px;min-height:34px}.mode-icon{font-size:20px;width:25px}.mode-copy b{font-size:11px}.mode-copy small{display:none}.mode-size{font-size:9px}.option-row{margin-bottom:7px}.option-row label{font-size:8px}.option-row select{font-size:10px;padding:5px 1px}.online-switch{font-size:9px;margin:9px 0}.online-switch small{font-size:7px}.online-switch input{height:12px;width:12px}#btnStart{padding:11px 14px;font-size:12px}.start-note{font-size:8px;margin:7px 0 0}.controls{display:none}.intro{margin-top:21px}.intro h1{font-size:31px}.hero-stage{height:192px;bottom:0}#heroArt{height:202px}
}
@media(max-width:820px){#btnRestart{display:grid}}

/* v3: portable startup feedback and exactly two selectable characters. */
[hidden]{display:none!important}
#menu{align-items:flex-start;padding:28px 24px}
.lobby{margin:auto;min-height:min(800px,calc(100vh - 56px));align-items:center}
.setup-card{padding:24px 26px;max-width:480px}
.welcome{min-height:740px}
.hero-stage{height:350px;bottom:43px}
#heroArt,#heroGirl{position:absolute;bottom:20px;height:330px;width:auto;object-fit:contain;filter:drop-shadow(0 12px 9px rgba(67,104,119,.17));transform:none;z-index:2}
#heroArt{right:18px}#heroGirl{left:75px;height:302px;bottom:30px}
.winter-stamp{left:6px;bottom:280px;width:82px;height:82px}
.hero-caption{left:110px;bottom:0}.hero-glow{left:60px}
.card-heading{margin-bottom:16px}#nameInput{margin-bottom:13px;padding:10px 12px}
.character-row{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:6px}
.character-card{display:flex;align-items:center;gap:8px;position:relative;min-width:0;height:82px;padding:6px 9px;background:#f5f5ef;border:1px solid var(--line);border-radius:12px;text-align:left;touch-action:manipulation}
.character-card img{height:68px;width:43px;object-fit:contain;flex-shrink:0}
.character-card b{display:block;font-size:13px;margin-bottom:5px}.character-card small{display:block;font-size:9px;color:#859493;line-height:1.4}
.character-card i{position:absolute;right:6px;top:5px;display:none;color:var(--teal);font-size:10px;font-style:normal}
.character-card.selected{border-color:#548b87;background:#e8f0eb;box-shadow:inset 0 0 0 1px #548b87}.character-card.selected i{display:block}
.character-note{font-size:9px;color:#90a09c;margin:0 0 13px;line-height:1.4}
.modeBtn{padding:10px}.modeRow{gap:6px;margin-bottom:12px}.option-row{margin-bottom:13px}
#btnStart{touch-action:manipulation}#btnStart:disabled{opacity:.52;cursor:wait;transform:none}
.start-note{margin:9px 0;font-size:10px}.boot-status{font-size:10px;line-height:1.7;padding:9px 11px;border-radius:9px;background:#fff0d5;color:#84623c;margin:9px 0;user-select:text;-webkit-user-select:text}
.boot-status.ready{background:#e7f0e9;color:#477569}.boot-status.bad{background:#fff0ed;color:#9d4c48}
.open-help{font-size:10px;line-height:1.8;color:#778f89;margin:7px 0 11px}.open-help summary{cursor:pointer}.open-help p{padding:7px;background:#edf3ed;border-radius:8px}
.controls{padding-top:10px}.controls p{margin-top:3px}
.startup-problem{position:fixed;inset:15% max(16px,calc((100vw - 480px)/2)) auto;z-index:100;background:#fffaf3;padding:25px;border:2px solid #e3a7a1;border-radius:18px;box-shadow:0 10px 90px #537d8a66;color:#6e514c;max-height:75vh;overflow:auto;user-select:text;-webkit-user-select:text}
.startup-problem h2{font-size:20px;margin-bottom:13px}.startup-problem p{font-size:12px;line-height:1.8;margin:9px 0;overflow-wrap:anywhere}.startup-problem button{margin:8px 5px 0 0;border-radius:8px;background:#426d71;color:white;padding:10px 14px;font-size:12px}
#avatarArt{object-fit:contain;object-position:center}
@media(max-width:1100px){#heroGirl{left:10px;height:265px}#heroArt{height:287px;right:0}.hero-caption{left:35px}.welcome{min-height:720px}.hero-stage{bottom:52px}}
@media(max-width:690px){#menu{padding:19px 15px}.lobby{min-height:0;gap:15px}.welcome{min-height:170px}.hero-stage{height:177px;width:172px;right:0;bottom:0}#heroArt{height:136px;right:0;bottom:8px}#heroGirl{height:127px;left:0;bottom:6px}.intro h1{font-size:28px}.intro{z-index:3}.setup-card{padding:21px}.character-card{height:80px}.boot-status{font-size:10px}.card-heading h2{font-size:22px}.controls{font-size:10px}}
@media(pointer:coarse) and (orientation:landscape){.lobby{align-items:start;min-height:0}.welcome{min-height:350px}#heroArt{height:175px}#heroGirl{height:165px;left:4px}.hero-stage{bottom:10px;height:190px}.setup-card{padding:16px 18px}.character-card{height:58px;padding:4px 6px;gap:5px}.character-card img{height:49px;width:32px}.character-card small{font-size:8px}.character-note{font-size:8px;margin-bottom:9px}.boot-status{padding:6px 8px;font-size:9px}.open-help{font-size:9px}.controls{display:none}}

/* Public room controls remain separate from the original game HUD. */
#publicBar{position:fixed;z-index:60;top:0;left:0;right:0;min-height:48px;background:#152c32;color:#f3fbf9;display:flex;align-items:center;gap:12px;padding:8px 16px;font:14px system-ui,sans-serif;box-shadow:0 2px 10px #10282b20}#publicBar select,#publicBar button,#connectionOverlay button{font:inherit;background:#eff8f5;color:#173d44;border:0;border-radius:8px;padding:8px 12px;cursor:pointer}#publicBar label{white-space:nowrap}#connectionNote{flex:1}#connectionOverlay{position:fixed;inset:48px 0 0;z-index:55;display:grid;place-items:center;background:#17333ac2;backdrop-filter:blur(5px);color:white;text-align:center;padding:24px}#connectionOverlay[hidden]{display:none}#connectionOverlay p{font:16px/1.8 system-ui,sans-serif}#connectionOverlay h2{font:600 22px system-ui,sans-serif}#menu{padding-top:76px}#identity,#btns{top:70px}#topbar{top:68px}#statusWrap{top:145px}#onlineSettings{white-space:nowrap}@media(max-width:700px){#publicBar{gap:8px;padding:6px 8px;flex-wrap:wrap}#publicBar label{display:none}#connectionNote{order:3;flex-basis:100%;font-size:12px}#onlineSettings{margin-left:auto}#identity,#btns{top:90px}#topbar{top:146px}#statusWrap{top:206px}#connectionOverlay{top:76px}#menu{padding-top:100px}}

#publicBar select{min-width:156px;font-size:14px;line-height:1.4;-webkit-text-fill-color:#173d44}#identity{height:82px;min-width:170px}#playerName{font-size:14px;margin-bottom:6px}#teamBadge{display:block;font-size:12px;font-weight:700;margin-top:5px;color:#a94450}#teamBadge[data-team="1"]{color:#286399}#statusWrap{display:none}#feed{top:172px;max-width:210px}.feed-item{font-size:12px;background:#f9fff3e6}.team-score small,.round-center b{font-size:12px}.round-center small{font-size:11px}.ammo-label b{font-size:14px}.ammo-hint{font-size:12px}.coin{font-size:16px}#btns{gap:5px}#btns button{width:34px;height:38px}#btnPause,#btnRestart{display:none}#playHelp{position:fixed;right:22px;top:126px;width:265px;padding:16px 18px;border:1px solid #d5e4df;border-radius:14px;background:#f7fff8ed;color:#284f56;z-index:8;box-shadow:0 8px 26px #143c4920;font:14px/1.7 system-ui,sans-serif}#playHelp[hidden]{display:none}#playHelp p{margin:8px 0}#playHelp small{display:block;font-size:12px;color:#517276}#closeHelp{float:right;background:transparent;color:#284f56;font-size:24px;line-height:1}#toast{top:165px}#shop{top:125px;max-height:calc(100dvh - 155px);overflow:auto}.online-switch[hidden]{display:none}.field-label,.option-row label,.start-note,.character-note{font-size:14px}.controls,.controls p,.boot-status,.mode-copy small{font-size:12px}
@media(max-width:700px){#publicBar select{min-width:150px}#identity{height:62px;min-width:140px}#avatarArt{height:48px;width:38px}#teamBadge{font-size:12px}#topbar{top:160px}#score{padding:8px 16px;min-width:235px}#feed{display:none}#btns{right:10px;max-width:150px;flex-wrap:wrap;justify-content:flex-end}#btns button{height:34px;width:32px}#playHelp{left:14px;right:14px;top:230px;width:auto;max-width:330px;font-size:14px}#ballsHud{bottom:16px;min-width:215px;max-width:calc(100% - 30px)}.ammo-hint{font-size:11px}#toast{top:218px;max-width:90%}#shop{top:140px}.touch #ballsHud{left:14px;transform:none;bottom:18px;max-width:calc(100% - 130px);min-width:170px}.touch .ammo-hint{display:none}.touch .ammo-top{gap:8px}.touch .ammo-label{display:none}}
@media(max-height:520px) and (min-width:701px){#playHelp{top:112px;right:16px;font-size:12px;padding:10px 14px}#identity{height:65px}#feed{display:none}#ballsHud{bottom:10px;padding:8px 12px}.ammo-hint{display:none}}

#btns #btnPause,#btns #btnRestart{display:none}
body:not(.playing) #playHelp{display:none}

/* Persistent language choice and shared five-minute match clock. */
#publicBar #languageSelect{flex:none;min-width:0;width:96px;padding:9px 7px;border:1px solid #adc8ca;border-radius:9px;background:#eef7f5;color:#20494e;font:600 13px system-ui,sans-serif}
.round-timer{font-variant-numeric:tabular-nums;font-size:19px!important;letter-spacing:.04em;font-weight:800!important;color:#315e65!important}.round-timer.urgent{color:#b7404e!important}
html[lang=en] .round-center b{font-size:12px}html[lang=en] .ammo-hint{font-size:11px}html[lang=en] #connectionNote{font-size:12px}
@media(max-width:700px){#publicBar{gap:5px}#publicBar>label{display:none}#publicBar #languageSelect{width:78px;font-size:12px}#onlineSettings{max-width:100px;font-size:11px;white-space:normal;line-height:1.2}#publicBar #roomSelect{min-width:0;width:140px}}