*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;font-family:Arial,Helvetica,sans-serif;background:#ecc4a1;color:#fff}button,input{font:inherit;touch-action:none}button{cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible,input:focus-visible{outline:3px solid #fff;outline-offset:4px}[hidden]{display:none!important}main{position:relative;width:100%;height:100%;overflow:hidden}canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none}header{position:absolute;top:max(16px,env(safe-area-inset-top));left:2%;right:2%;height:46px;display:flex;gap:18px;align-items:center;pointer-events:none}.round{border:4px solid #493f43;box-shadow:inset 0 3px 0 #ffffff60,0 4px 0 #3d343843;background:linear-gradient(#c6e0ff,#72a8ea);color:#355276;display:grid;place-items:center;border-radius:50%;width:76px;height:76px}#pause{width:42px;height:42px;font-size:22px;border-width:3px;pointer-events:auto}.health{position:relative;display:flex;align-items:center;width:28%;max-width:380px;gap:0;filter:drop-shadow(0 3px 0 #77584c30)}.track{width:100%;height:26px;border:4px solid #5a4947;background:#483e41;border-radius:8px;overflow:hidden}.track i{display:block;height:100%;width:100%;background:linear-gradient(#72c7ff,#2995f2);transition:width .45s}.enemy .track i{background:linear-gradient(#ffb56b,#e06d42);float:right}.badge{position:relative;z-index:1;display:grid;place-items:center;flex:0 0 38px;width:38px;height:43px;background:#f0bd72;border:4px solid #6c5146;clip-path:polygon(0 0,100% 0,95% 75%,50% 100%,5% 75%);color:#9b613f;margin-right:-5px;font-size:18px}.enemy .badge{margin-right:0;margin-left:-5px}.health b{position:absolute;font-size:12px;top:17px;left:56%;text-shadow:0 1px 2px #294666}.enemy b{left:40%}#turn{flex:1;text-align:center;white-space:nowrap;font-size:11px;font-weight:900;letter-spacing:1.5px;color:#654c48;text-shadow:0 1px #fff7}#hint{position:absolute;left:0;right:0;top:81px;text-align:center;font-size:12px;color:#866154;font-weight:bold;pointer-events:none}#readouts{position:absolute;display:flex;z-index:2;background:#403b49de;border-radius:23px;overflow:hidden;pointer-events:none;transform:translate(-50%,-100%);box-shadow:0 3px 0 #4b3c3720}#readouts>div{padding:8px 13px;text-align:center;display:flex;flex-direction:column;gap:3px}#readouts>div+div{border-left:2px solid #ffffff1f}#readouts strong{font-size:19px}#readouts span{font-size:9px;letter-spacing:.5px;font-weight:bold}#fuel{position:absolute;transform:translateX(-50%);width:115px;height:16px;border:2px solid #604944;border-radius:10px;background:#644940;overflow:hidden;pointer-events:none}#fuel i{display:block;background:#edc973;height:100%;width:100%;transition:width .1s}#fuel span{position:absolute;inset:1px 0;text-align:center;font-size:9px;font-weight:900;color:#674c36}#controls{position:absolute;left:12%;right:10%;bottom:7%;display:flex;align-items:center;justify-content:space-between;gap:25px}.move-control,.aim-control{display:flex;flex-direction:column;gap:10px;align-items:center}.move-control>small,.aim-control>small{font-size:10px;letter-spacing:1.8px;font-weight:bold;color:#f7dfb8b0}#joystick{width:92px;height:92px;border-radius:50%;border:4px solid #56454a;background:#41516940;box-shadow:0 0 0 14px #7a51381a;position:relative;display:flex;align-items:center;justify-content:space-between;padding:4px 7px;touch-action:none;cursor:grab}#joystick span{font-size:32px;color:#dceafa85}#stick{position:absolute;left:13px;top:13px;width:58px;height:58px;border:3px solid #749cc4;background:linear-gradient(135deg,#cceaff,#74a6e6);box-shadow:inset 3px 4px 0 #e3f6ff80,0 3px 4px #223f5560;border-radius:50%;pointer-events:none}.adjust{display:grid;grid-template-columns:1fr;gap:5px;width:155px}.adjust label{display:flex;justify-content:space-between;font-size:10px;letter-spacing:1px;color:#ffe6bc;font-weight:900}.adjust b{color:white;font-size:11px}input[type=range]{width:100%;height:15px;margin:1px 0 5px;accent-color:#bcdcff;cursor:pointer}.weapons{display:flex;gap:12px;align-items:center}#special{position:relative;width:77px;height:80px;border:4px solid #584448;border-radius:15px;background:linear-gradient(135deg,#77c6f3,#3265a5);color:white;box-shadow:inset 0 3px 0 #ffffff60,0 4px 0 #5c3d3660}#special>span{position:absolute;left:4px;top:3px;font-size:21px}#special svg{width:44px;height:44px;fill:#d3f1ff;stroke:#fff;stroke-width:2;filter:drop-shadow(0 0 5px #ddf8ff)}#special small{display:block;font-size:8px;letter-spacing:1px;font-weight:bold}#special.active{background:linear-gradient(135deg,#ffde8f,#ec7f49)}#fire{background:linear-gradient(#ffed77,#ffc741);border:5px solid #674634;border-radius:17px;box-shadow:inset 0 5px 0 #fff8a4,0 5px 0 #72452b80;color:#925521;font-size:33px;font-weight:1000;padding:16px 30px;text-shadow:0 1px #fff2a0}#fire:active{transform:translateY(4px);box-shadow:inset 0 4px 0 #fff8a4,0 1px 0 #72452b80}button:disabled{cursor:default;filter:saturate(.4);opacity:.7}#aim svg{height:49px;width:49px;fill:none;stroke:#578bcb;stroke-width:5;stroke-linecap:round}#aim.off{opacity:.55}#celebration{position:absolute;z-index:8;top:27%;left:50%;transform:translateX(-50%) rotate(-5deg);text-align:center;pointer-events:none;color:#fff6c6;filter:drop-shadow(0 6px 0 #584439)}#celebration strong{display:block;font-size:clamp(34px,6vw,80px);font-weight:1000;line-height:.95;-webkit-text-stroke:2px #685043;text-shadow:3px 4px #594135;position:relative}#celebration small{position:relative;font-size:18px;font-weight:1000;letter-spacing:1px;display:block;margin-bottom:15px;color:#fff2a6}.reticle-art{position:absolute;left:50%;top:60%;width:230px;height:230px;border:12px solid #514250;border-radius:50%;transform:translate(-50%,-50%);background:#51425050}.reticle-art:before,.reticle-art:after{content:'';position:absolute;background:#514250;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:8px}.reticle-art:before{width:275px;height:10px}.reticle-art:after{height:275px;width:10px}#loading{position:absolute;inset:0;display:grid;place-items:center;background:#efd0b1;font-weight:bold;color:#715145;z-index:60}#modal{position:absolute;inset:0;background:#352e3b80;backdrop-filter:blur(5px);display:grid;place-items:center;padding:20px;z-index:30}#modal article{width:min(370px,100%);padding:32px;border:4px solid #674d46;border-radius:25px;background:#f7dfbd;text-align:center;box-shadow:0 8px 0 #382e3960;color:#674d46}#modal h1{font-size:31px;margin:16px 0}#modal small{font-weight:bold;letter-spacing:2px;font-size:11px}#modal p{font-size:13px;line-height:1.7}#modal button{display:block;margin:12px auto 0;border:3px solid #645048;border-radius:10px;background:#91beef;color:#294e75;font-weight:900;padding:12px;width:100%}#modal #restart{background:#ffc955;color:#76502e}#modal #sound{background:none;border:0;font-size:10px;letter-spacing:1px}@media(max-width:950px){header{gap:9px}.health{width:29%}#controls{left:7%;right:7%;gap:17px;bottom:6%}.adjust{width:125px}#fire{font-size:28px;padding:14px 25px}#joystick{height:78px;width:78px}#stick{left:10px;top:10px;width:50px;height:50px}.round{height:68px;width:68px}#special{width:67px;height:73px}#readouts>div{padding:6px 11px}#readouts strong{font-size:17px}#hint{top:73px;font-size:10px}}@media(max-aspect-ratio:4/5){header{top:18px;left:4%;right:4%;gap:7px;flex-wrap:wrap;justify-content:space-between}.health{width:39%;max-width:none}.track{height:23px;border-width:3px}.badge{width:27px;flex-basis:27px;height:34px;font-size:13px;border-width:3px}.health b{top:12px;font-size:10px}#pause{order:2;width:32px;height:32px;font-size:16px}.player{order:1}.enemy{order:3}#turn{position:absolute;top:58px;left:0;right:0;font-size:12px}#hint{top:106px;font-size:11px;padding:0 16px}#controls{left:6%;right:6%;bottom:max(5%,env(safe-area-inset-bottom));display:grid;grid-template-columns:80px 1fr 70px;gap:25px 12px}.adjust{grid-column:1 / 4;grid-row:1;width:100%;display:grid;grid-template-columns:65px 1fr;align-items:center;gap:10px 15px;background:#6f4b352b;border-radius:15px;padding:15px}.adjust label{font-size:9px}.adjust input{margin:0}.move-control{grid-column:1;grid-row:2}.weapons{grid-column:2;grid-row:2;gap:7px;justify-content:center}#special{position:absolute;right:0;top:-52px;width:47px;height:44px;border-width:3px;border-radius:11px}#special svg{width:24px;height:24px}#special small{font-size:6px}#special>span{font-size:13px;left:3px;top:1px}#fire{padding:14px 20px;font-size:29px;border-width:4px;min-width:110px}.aim-control{grid-column:3;grid-row:2}.round{height:65px;width:65px}.move-control,.aim-control{gap:9px}#joystick{width:72px;height:72px}#stick{left:9px;top:9px;height:46px;width:46px}#readouts>div{padding:5px 9px}#readouts strong{font-size:15px}#readouts span{font-size:7px}#fuel{width:87px;height:13px}#fuel span{font-size:7px}#celebration{top:26%}.reticle-art{width:160px;height:160px;border-width:8px}.reticle-art:before{width:195px}.reticle-art:after{height:195px}#celebration strong{font-size:44px}#celebration small{font-size:13px}}@media(max-height:500px) and (min-aspect-ratio:4/5){header{top:10px;height:36px}#pause{width:33px;height:33px;font-size:17px}.badge{height:34px;flex-basis:31px}.track{height:22px}.health b{top:12px;font-size:10px}#hint{top:55px}#controls{bottom:5%;left:13%;right:10%}#joystick{width:65px;height:65px}#stick{width:43px;height:43px;left:7px;top:7px}#fire{font-size:26px;padding:12px 25px}.round{height:61px;width:61px}#special{height:64px;width:59px}.move-control>small,.aim-control>small{font-size:8px}.adjust{width:120px;gap:3px}.adjust label{font-size:8px}.adjust b{font-size:9px}#readouts strong{font-size:15px}#readouts span{font-size:7px}#readouts>div{padding:4px 10px}#fuel{height:13px;width:90px}#fuel span{font-size:7px}#celebration{top:24%}.reticle-art{width:160px;height:160px}.reticle-art:before{width:200px}.reticle-art:after{height:200px}}@media(max-width:350px){#controls{left:5%;right:5%;grid-template-columns:67px 1fr 60px;gap:18px 5px}#fire{min-width:100px;font-size:25px;padding:12px 15px}.round{height:57px;width:57px}#joystick{width:62px;height:62px}#stick{width:40px;height:40px;left:7px;top:7px}#joystick span{font-size:23px}.adjust{padding:12px}#hint{font-size:9px}#readouts>div{padding:4px 7px}}#select{position:absolute;inset:0;background:#352e3b80;backdrop-filter:blur(5px);display:grid;place-items:center;padding:20px;z-index:30}
#select article{width:min(560px,100%);max-height:100%;overflow:auto;padding:32px;border:4px solid #674d46;border-radius:25px;background:#f7dfbd;text-align:center;box-shadow:0 8px 0 #382e3960;color:#674d46}
#select h1{font-size:31px;margin:16px 0 20px}
#select small{font-weight:bold;letter-spacing:2px;font-size:11px}
#select .tanks{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px}
#select .tank{display:flex;flex-direction:column;gap:8px;align-items:center;border:3px solid #645048;border-radius:14px;background:#fff0d2;padding:12px 6px;color:#674d46}
#select .tank img{width:100%;height:auto}
#select .tank b{font-size:11px;letter-spacing:1px}
#select .tank.sel{border-color:#e06d42;background:#ffe1a8;box-shadow:0 0 0 3px #e06d4255}
#select #start{display:block;margin:0 auto;border:3px solid #674634;border-radius:10px;background:#ffc955;color:#76502e;font-weight:900;padding:14px;width:100%}
@media(max-aspect-ratio:4/5){#select .tanks{grid-template-columns:repeat(2,1fr)}#select article{padding:22px}}
.online{margin-top:22px;border-top:2px dashed #d3b489;padding-top:16px}
.online>small{display:block;font-weight:bold;letter-spacing:2px;font-size:11px}
.online-row{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:10px}
.online-row button{flex:1 1 150px;border:3px solid #645048;border-radius:10px;background:#91beef;color:#294e75;font-weight:900;padding:13px 12px}
.online-row #mp-quick{background:#f0bd72;color:#76502e}
.online-row #mp-join{background:#ffc955;color:#76502e}
#net-status{position:absolute;top:10px;left:50%;transform:translateX(-50%);z-index:70;background:#403b49de;color:#fff3d8;font:bold 11px Arial;padding:8px 14px;border-radius:12px;max-width:80%;text-align:center}
#net-lobby{position:absolute;inset:0;background:#352e3b80;backdrop-filter:blur(5px);display:grid;place-items:center;padding:20px;z-index:40}
#net-lobby article{width:min(430px,100%);max-height:100%;overflow:auto;padding:30px;border:4px solid #674d46;border-radius:25px;background:#f7dfbd;text-align:center;box-shadow:0 8px 0 #382e3960;color:#674d46}
#net-lobby h1{font-size:27px;margin:14px 0}
#net-lobby small{font-weight:bold;letter-spacing:2px;font-size:11px}
#net-lobby p{font-size:13px;line-height:1.7;margin:0 0 6px}
#net-lobby .net-colors{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:18px 0}
.net-tank{border:3px solid #645048;border-radius:12px;background:#fff0d2;padding:8px 5px}
.net-tank img{width:100%;height:auto;display:block}
.net-tank.sel{border-color:#e06d42;background:#ffe1a8;box-shadow:0 0 0 3px #e06d4255}
#net-lobby .net-colors+.net-tank,#net-lobby button{display:block;width:100%;margin:10px auto 0;border:3px solid #645048;border-radius:10px;background:#91beef;color:#294e75;font-weight:900;padding:12px}
#net-lobby #net-copy{background:#ffc955;color:#76502e}
#net-lobby #net-close{background:#cfe3c0;color:#3f5a34}
#net-lobby #net-leave{background:#e8a08a;color:#6d3a2c}
/* Lobby waiting / joining is a screen of its own, never the arena behind it. */
#net-lobby.waiting{background:radial-gradient(120% 90% at 50% 0%,#f7d9b4 0%,#e6b892 55%,#c99a7d 100%);backdrop-filter:none}
#net-lobby .net-label{display:block;margin:16px 0 8px;color:#9b7458;font-weight:bold;letter-spacing:2px;font-size:11px}
#net-lobby .net-wait{display:flex;align-items:center;justify-content:center;gap:10px;margin:4px 0 12px;font-weight:bold;font-size:14px;color:#674d46}
#net-lobby .net-spin{width:16px;height:16px;border:3px solid #d3b489;border-top-color:#e06d42;border-radius:50%;animation:netSpin .8s linear infinite}
@keyframes netSpin{to{transform:rotate(360deg)}}
#net-lobby .net-room{display:flex;align-items:center;justify-content:center;gap:8px;margin:0 0 10px;font-size:12px;color:#9b7458}
#net-lobby .net-room span{font-weight:bold;letter-spacing:2px;font-size:10px}
#net-lobby .net-room b{font-size:14px;letter-spacing:1px;color:#674d46;word-break:break-all}
#net-lobby #net-link{display:block;width:100%;margin:0 0 10px;padding:10px 12px;border:3px solid #645048;border-radius:10px;background:#fff0d2;color:#674d46;font-size:12px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#net-lobby #net-retry{background:#f0bd72;color:#76502e}
#net-banner{position:absolute;z-index:14;top:29%;left:50%;transform:translateX(-50%) rotate(-4deg);pointer-events:none;color:#fff6c6;filter:drop-shadow(0 6px 0 #584439);text-align:center}
#net-banner strong{font-size:clamp(30px,6vw,74px);font-weight:1000;-webkit-text-stroke:2px #685043;text-shadow:3px 4px #594135}
#net-banner.lose{color:#ffd3c2}
#net-modal{position:absolute;inset:0;background:#352e3b80;backdrop-filter:blur(5px);display:grid;place-items:center;padding:20px;z-index:45}
#net-modal article{width:min(370px,100%);padding:32px;border:4px solid #674d46;border-radius:25px;background:#f7dfbd;text-align:center;box-shadow:0 8px 0 #382e3960;color:#674d46}
#net-modal h1{font-size:29px;margin:16px 0}
#net-modal small{font-weight:bold;letter-spacing:2px;font-size:11px}
#net-modal p{font-size:13px;line-height:1.7}
#net-modal button{display:block;margin:12px auto 0;border:3px solid #645048;border-radius:10px;background:#91beef;color:#294e75;font-weight:900;padding:12px;width:100%}
#net-modal #net-again{background:#ffc955;color:#76502e}
#net-modal #net-leave-3{background:#e8a08a;color:#6d3a2c}
@media(max-aspect-ratio:4/5){#net-lobby .net-colors{grid-template-columns:repeat(2,1fr)}#net-lobby article{padding:22px}}
#select article{padding:24px}
#select h1{margin:12px 0 15px}
#select .tanks{margin-bottom:14px}
.online{margin-top:14px;padding-top:12px}
.online-row{margin-top:8px}
.online-row button{padding:11px 10px}
@media(max-height:560px){#select article{padding:16px 20px}#select h1{font-size:24px;margin:8px 0 10px}#select .tanks{gap:8px;margin-bottom:10px}#select .tank{padding:8px 4px}#select #start{padding:11px}.online{margin-top:10px;padding-top:9px}.online>small{font-size:10px}.online-row button{padding:9px 8px;font-size:13px}}
#select #resume-battle{display:block;margin:0 auto 10px;border:3px solid #674634;border-radius:10px;background:#91beef;color:#294e75;font-weight:900;padding:13px;width:100%}

/* Start menu: mode, battle time, tank */
#menu{position:absolute;inset:0;z-index:32;display:grid;place-items:center;padding:20px;background:radial-gradient(120% 90% at 50% 0%,#f7d9b4 0%,#e6b892 55%,#c99a7d 100%)}
#menu article{width:min(560px,100%);max-height:100%;overflow:auto;padding:28px 30px;border:4px solid #674d46;border-radius:25px;background:#f7dfbd;text-align:center;box-shadow:0 8px 0 #382e3960;color:#674d46;animation:menuIn .32s ease-out}
@keyframes menuIn{from{transform:translateY(14px) scale(.97);opacity:0}to{transform:none;opacity:1}}
#menu h1{font-size:29px;margin:10px 0 18px}
#menu small{font-weight:bold;letter-spacing:2px;font-size:11px}
#menu .label{display:block;margin:18px 0 9px;color:#9b7458}
#menu .modes{display:grid;grid-template-columns:1fr 1fr;gap:12px}
#menu .mode{display:flex;flex-direction:column;gap:4px;align-items:center;padding:16px 10px;border:3px solid #645048;border-radius:16px;background:#fdeccb;color:#674d46;transition:transform .12s,background .12s}
#menu .mode b{font-size:16px;letter-spacing:1px}
#menu .mode em{font-style:normal;font-size:11px;color:#a07d61}
#menu .mode.sel{border-color:#e06d42;background:#ffe1a8;box-shadow:0 0 0 3px #e06d4255;transform:translateY(-2px)}
#menu .times{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}
#menu .times button{padding:12px 4px;border:3px solid #645048;border-radius:11px;background:#fdeccb;color:#674d46;font-weight:900;font-size:13px;letter-spacing:.5px;transition:background .12s,transform .12s}
#menu .times button.sel{border-color:#e06d42;background:#ffc955;color:#76502e;transform:translateY(-2px)}
#menu .tanks{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
#menu .tank{display:flex;flex-direction:column;gap:6px;align-items:center;border:3px solid #645048;border-radius:14px;background:#fff0d2;padding:10px 5px;color:#674d46;transition:transform .12s,background .12s}
#menu .tank img{width:100%;height:auto}
#menu .tank b{font-size:10px;letter-spacing:1px}
#menu .tank.sel{border-color:#e06d42;background:#ffe1a8;box-shadow:0 0 0 3px #e06d4255;transform:translateY(-2px)}
#menu #menu-start,#menu #mp-join{display:block;width:100%;margin-top:18px;border:3px solid #674634;border-radius:12px;background:#ffc955;color:#76502e;font-weight:900;padding:15px;font-size:16px;letter-spacing:1px}
#menu #mp-join{background:#91beef;color:#294e75;margin-top:10px}
#menu #menu-start:disabled{background:#d9c4a3;color:#9b8265;border-color:#9b8265}
#menu #menu-start:active,#menu .mode:active,#menu .times button:active,#menu .tank:active{transform:translateY(1px)}

/* Match clock */
#clock{position:absolute;left:50%;top:66px;transform:translateX(-50%);z-index:6;display:flex;align-items:center;gap:7px;padding:5px 15px;border:3px solid #5a4947;border-radius:20px;background:#403b49de;color:#ffe6bc;box-shadow:0 3px 0 #4b3c3720;pointer-events:none}
#clock::before{content:"";width:11px;height:11px;border:2.5px solid #ffd77a;border-radius:50%}
#clock b{font-size:14px;font-weight:900;letter-spacing:1px;font-variant-numeric:tabular-nums}
#clock.warn{border-color:#8a3b2a;background:#5c2f2ade;color:#ffd9c8;animation:clockPulse 1s infinite}
#clock.warn::before{border-color:#ff9d6b}
@keyframes clockPulse{50%{opacity:.62}}
body.clock-on #hint{top:120px}
@media(max-width:950px){#menu article{padding:22px}body.clock-on #hint{top:112px}}
@media(max-aspect-ratio:4/5){#menu article{padding:22px}#menu .modes{gap:9px}#menu h1{font-size:24px}#clock{top:80px}body.clock-on #hint{top:132px}}
@media(max-height:500px) and (min-aspect-ratio:4/5){#menu h1{font-size:22px;margin:6px 0 10px}#menu article{padding:16px 22px}#menu .modes .mode{padding:11px 8px}#menu .label{margin:10px 0 7px}#menu .tank.sel{transform:none}#clock{top:48px}body.clock-on #hint{top:92px}}

/* Short landscape: keep the whole menu on one screen */
@media(max-height:540px){
#menu{padding:8px}
#menu article{padding:12px 18px;border-width:3px;border-radius:18px}
#menu h1{font-size:19px;margin:4px 0 8px}
#menu small{font-size:10px}
#menu .label{margin:9px 0 5px;font-size:10px}
#menu .modes{gap:9px}
#menu .mode{padding:8px;border-width:2.5px;border-radius:12px;gap:2px}
#menu .mode b{font-size:14px}
#menu .mode em{font-size:10px}
#menu .times{gap:7px}
#menu .times button{padding:8px 3px;font-size:12px;border-width:2.5px}
#menu .tanks{gap:8px}
#menu .tank{padding:5px 4px;gap:3px;border-width:2.5px;border-radius:11px}
#menu .tank b{font-size:8px}
#menu .tank img{max-height:46px;width:auto}
#menu #menu-start{margin-top:11px;padding:11px;font-size:14px;border-width:2.5px}
#menu #mp-join{margin-top:7px;padding:9px;font-size:13px}
}

@media(max-height:400px){
#menu article{padding:9px 16px}
#menu h1{font-size:16px;margin:2px 0 6px}
#menu .label{margin:6px 0 4px}
#menu .mode{padding:6px}
#menu .mode em{display:none}
#menu .mode b{font-size:13px}
#menu .tank img{max-height:34px}
#menu .tank b{font-size:7px}
#menu .times button{padding:7px 2px;font-size:11px}
#menu #menu-start{margin-top:8px;padding:9px;font-size:13px}
}

/* Short landscape: keep the waiting/joining lobby on one screen */
@media(max-height:560px){
#net-status{top:auto;bottom:10px}
}
@media(max-height:560px) and (min-aspect-ratio:4/5){
#net-lobby{padding:8px}
#net-lobby article{padding:12px 20px;border-width:3px;border-radius:18px}
#net-lobby h1{font-size:20px;margin:5px 0 7px}
#net-lobby p{font-size:12px;line-height:1.5;margin-bottom:4px}
#net-lobby .net-wait{margin:2px 0 7px;font-size:13px}
#net-lobby .net-label{margin:8px 0 5px}
#net-lobby .net-colors{gap:8px;margin:8px 0}
#net-lobby #net-link{padding:7px 10px;margin-bottom:8px}
#net-lobby button{padding:9px;margin-top:7px}
#net-lobby .net-tank{padding:5px 4px}
#net-lobby .net-tank img{max-height:52px;max-width:100%;width:auto}
}
@media(max-height:420px) and (min-aspect-ratio:4/5){
#net-lobby h1{font-size:17px}
#net-lobby p{display:none}
#net-lobby .net-tank img{max-height:40px}
}