*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#9bd6e4;font-family:Segoe UI,Arial,sans-serif;color:#153b35}canvas{display:block;width:100vw;height:100vh}header{position:absolute;top:22px;left:28px;right:28px;display:flex;justify-content:space-between;align-items:flex-start;pointer-events:none}.brand{font-size:19px;font-weight:900;letter-spacing:2px}.brand span{color:#377e58}.brand small{display:block;font-size:9px;letter-spacing:3px;margin-top:6px;color:#4c786a}#stats{width:285px;padding:16px 20px;background:#fffffff0;border:1px solid #fff;border-radius:18px;box-shadow:0 8px 35px #183e3112}.level{display:flex;justify-content:space-between;font-weight:700;margin-bottom:12px}.meter{display:grid;grid-template-columns:48px 1fr 35px;align-items:center;gap:8px;font-size:10px;margin:7px 0}.track{height:7px;background:#dfe9e2;border-radius:8px;overflow:hidden}.fill{height:100%;border-radius:8px}aside{position:absolute;top:115px;left:28px;width:245px;background:#ffffffce;padding:18px;border-radius:16px;font-size:12px;line-height:1.7}aside h3{margin:0;font-size:14px}aside small{font-size:10px;color:#527469}footer{position:absolute;bottom:16px;left:28px;right:28px;display:flex;justify-content:space-between;font-size:11px;color:#fff;text-shadow:0 1px 4px #143e30}#toast{position:absolute;top:24%;left:50%;transform:translateX(-50%);background:#183f35e8;color:white;border-radius:15px;padding:14px 26px;opacity:0;transition:opacity .3s;text-align:center;pointer-events:none}#welcome{position:absolute;inset:0;background:linear-gradient(90deg,#eaf8efeF,#eaf8ef70,transparent);display:flex;align-items:center;padding:8vw}#welcome section>small{font-size:10px;letter-spacing:3px;font-weight:700}h1{font-size:clamp(45px,6vw,85px);line-height:.98;letter-spacing:-4px;margin:25px 0}h1 em{font-style:normal;color:#428357}#welcome p{line-height:1.8;font-size:15px;color:#55766b}button{background:#214e3c;color:#fff;border:0;border-radius:12px;padding:18px 24px;font-size:16px;cursor:pointer;margin-top:15px;min-width:245px;text-align:left}button span{float:right}#welcome .hint{font-size:11px;margin-top:20px}

#stats{position:absolute;left:50%;transform:translateX(-50%);width:min(390px,48vw)}.meter{grid-template-columns:58px 1fr 80px}.meter>span:last-child{text-align:right}.xp-total{font-size:11px;text-align:center;margin-top:11px;color:#55766b}#toast{top:230px}@media(max-width:850px){.brand{font-size:12px}.brand small{display:none}aside{top:240px;width:190px}#stats{width:350px;max-width:65vw}.meter{grid-template-columns:50px 1fr 70px}}

#diet{position:absolute;top:228px;left:50%;transform:translateX(-50%);width:min(680px,68vw);padding:10px 14px;background:#ffffffe8;border-radius:14px;pointer-events:auto}.diet-title{font-size:10px;letter-spacing:1px;color:#587361;text-align:center;margin-bottom:6px}.diet-items{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px}.diet-item{flex:0 0 56px;text-align:center}.diet-item svg{width:40px;height:31px;display:block;margin:auto}.food-icon{font-size:24px;display:block;height:31px}.diet-item small{font-size:9px;display:block;line-height:1.2;color:#48624e}#toast{top:345px}#welcome~#diet{display:none}

/* Compact horizontal vital signs. */
header{left:20px;right:20px;top:16px}.brand{font-size:13px;width:170px}.brand small{font-size:8px;letter-spacing:1px}
#stats{width:min(880px,calc(100vw - 420px));max-width:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px 16px;padding:12px 18px}.level{grid-column:1/-1;margin:0;font-size:12px}.meter{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin:0;font-size:10px}.meter>span:first-child{grid-column:1;grid-row:1}.meter>.track{grid-column:1/-1;grid-row:2;height:8px}.meter>span:last-child{grid-column:2;grid-row:1;white-space:nowrap}.xp-total{grid-column:1/-1;margin:0;font-size:10px}
#diet{top:145px;width:min(760px,68vw)}#toast{top:260px}#sound{position:absolute;right:0;top:0;min-width:0;margin:0;padding:10px 12px;font-size:11px;pointer-events:auto;border-radius:10px}aside{top:145px;width:200px}
@media(max-width:1100px){.brand{display:none}#stats{width:calc(100vw - 190px);left:0;transform:none}#diet{top:145px;left:20px;transform:none;width:calc(100vw - 40px)}aside{top:265px;width:180px}.meter{font-size:9px}#stats{gap:7px;padding:10px}#toast{top:265px}}

[hidden]{display:none!important}#death-screen{position:absolute;inset:0;z-index:20;background:#172d3b9c;backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center}#death-screen section{width:min(440px,90vw);padding:35px;text-align:center;background:#f1f5eefa;border-radius:22px;box-shadow:0 15px 70px #112c4250}#death-screen h2{margin:0 0 14px;font-size:28px}#death-screen p{font-size:14px;line-height:1.6;color:#577164}#respawn{text-align:center;min-width:220px}#warnings{position:absolute;top:112px;left:50%;transform:translateX(-50%);padding:8px 16px;border-radius:10px;background:#9e2929ed;color:#fff4e6;font-size:12px;font-weight:700;max-width:90vw;text-align:center;pointer-events:none}#warnings:empty{display:none}.meter.critical{color:#bd3f3a;font-weight:700}.meter.critical .fill{background:#e0524d!important}.meter.critical .track{background:#f5d8d1;box-shadow:0 0 0 1px #e0524d66}

/* Keep the diet compact and below the play area on every screen size. */
#diet{top:auto;bottom:44px;left:50%;transform:translateX(-50%);width:min(600px,76vw);max-width:calc(100vw - 28px);padding:7px 10px;border-radius:11px;background:#ffffffe0}.diet-title{font-size:9px;letter-spacing:.6px;margin-bottom:4px}.diet-items{gap:3px;padding-bottom:2px;scrollbar-width:thin}.diet-item{flex:0 0 44px}.diet-item svg{width:30px;height:23px}.food-icon{font-size:19px;height:23px}.diet-item small{font-size:8px;line-height:1.15;max-height:19px;overflow:hidden}footer{bottom:12px}

/* One complete, centered row: expand with the diet, shrink cells to the viewport. */
#diet{width:max-content;max-width:calc(100vw - 28px);bottom:44px;top:auto;left:50%;transform:translateX(-50%)}.diet-items{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);width:calc(var(--diet-count)*47px - 3px);max-width:calc(100vw - 48px);gap:3px;overflow:visible;padding-bottom:0;scrollbar-width:none}.diet-item{width:auto;min-width:0;text-align:center}.diet-item svg{width:30px;max-width:100%;height:23px}.food-icon{font-size:min(19px,calc((100vw - 60px)/var(--diet-count)));height:23px}.diet-item small{overflow:hidden;overflow-wrap:anywhere}.diet-items::-webkit-scrollbar{display:none}

#leaderboard{position:absolute;left:20px;top:138px;bottom:150px;width:218px;max-height:540px;padding:13px 12px;background:#ffffffe8;border:1px solid #ffffffdb;border-radius:16px;box-shadow:0 6px 25px #183e3112;display:flex;flex-direction:column;font-size:11px;color:#254b3c}.ranking-heading{display:flex;justify-content:space-between;align-items:center;gap:8px}.ranking-heading h3{font-size:15px;margin:0}.ranking-heading>span{font-size:9px;color:#638072}.ranking-note{font-size:9px;color:#748c7f;margin:5px 0 10px}.ranking-columns,.ranking-row{display:grid;grid-template-columns:20px minmax(0,1fr) 54px;align-items:center;gap:5px}.ranking-columns{font-size:9px;color:#829588;padding:0 5px 6px}.ranking-columns>span:last-child{text-align:right}.ranking-rows{padding:0;margin:0;list-style:none;overflow-y:auto;min-height:0;scrollbar-width:thin;flex:1}.ranking-row{min-height:20px;padding:3px 5px;border-radius:6px;font-size:10px}.ranking-row:nth-child(even){background:#dde9df4d}.ranking-row.is-you{background:#d1e8c4;color:#27533b;font-weight:700}.ranking-row b{text-align:right;font-variant-numeric:tabular-nums;font-size:10px}.ranking-place{color:#72907d}.ranking-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ranking-you{display:flex;justify-content:space-between;align-items:center;gap:6px;flex-wrap:wrap;border-top:1px solid #dbe5da;margin-top:8px;padding-top:10px;font-size:10px}.ranking-you strong{color:#488052}#guide{left:auto;right:20px;top:145px;width:200px}@media(max-width:850px){#leaderboard{left:12px;width:182px;top:142px;padding:10px;bottom:150px}.ranking-heading h3{font-size:13px}.ranking-row{font-size:9px;grid-template-columns:17px minmax(0,1fr) 43px}}
/* Keep the world visible behind the ranking; outline text for light and dark biomes. */
#leaderboard{background:transparent;border:0;border-radius:0;box-shadow:none;color:#fff8e9;text-shadow:0 1px 2px #102c2f,1px 0 2px #102c2f,-1px 0 2px #102c2f,0 -1px 2px #102c2f}
#leaderboard .ranking-heading>span,#leaderboard .ranking-note,#leaderboard .ranking-columns,#leaderboard .ranking-place{color:#e4eee5}
#leaderboard .ranking-row,#leaderboard .ranking-row:nth-child(even),#leaderboard .ranking-row.is-you{background:transparent}
#leaderboard .ranking-row.is-you,#leaderboard .ranking-row.is-you .ranking-place,#leaderboard .ranking-you strong{color:#ffe28a}
#leaderboard .ranking-you{border-top:0}

#shop-toggle{position:absolute;right:0;top:44px;min-width:0;margin:0;padding:9px 12px;font-size:11px;pointer-events:auto;background:#604666;border-radius:10px}#welcome .welcome-shop{display:block;background:transparent;color:#395c4b;border:1px solid #a7c1ae;margin-top:12px;font-size:13px;padding:12px 24px}#shop-screen{position:absolute;inset:0;z-index:40;background:#183a3d99;backdrop-filter:blur(7px);display:flex;align-items:center;justify-content:center;padding:24px}.shop-dialog{width:min(1110px,100%);max-height:94vh;overflow:auto;background:#f1f5ed;border:1px solid #ffffffa0;border-radius:24px;padding:26px;color:#224638;box-shadow:0 20px 80px #102f3950}.shop-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.shop-heading small{font-size:9px;letter-spacing:2px;color:#7f9180}.shop-heading h2{font-size:28px;letter-spacing:-1px;margin:6px 0}.shop-heading-actions{display:flex;align-items:center;gap:20px}#shop-balance{color:#866080;font-size:17px}#shop-screen button{min-width:0;margin:0;cursor:pointer}#shop-close{background:#dde7dc;color:#527260;font-size:27px;line-height:1;padding:8px 13px;border-radius:12px}#shop-note{font-size:11px;color:#7d8c7a;margin:4px 0 22px}.shop-layout{display:grid;grid-template-columns:1fr 1.3fr;gap:22px}.shop-preview{background:#e8eee5;border-radius:17px;padding:15px;text-align:center;overflow:hidden}.shop-preview h3{margin:4px 0;font-size:20px}#skin-preview{width:100%;height:auto;display:block;border-radius:12px}.shop-form-controls{display:flex;justify-content:space-between;align-items:center;gap:8px}.shop-form-controls button{padding:8px 12px;background:#d8e3d5;color:#52715b}.shop-form-controls b{font-size:12px}#shop-preview-hint{font-size:10px;color:#7b8d79;line-height:1.5}#shop-default{font-size:11px;padding:8px 14px;background:transparent;color:#5e7e65;text-decoration:underline}#shop-cards{display:flex;flex-direction:column;gap:12px}.skin-card{background:#fbfcf7;border:1px solid #dde7d9;border-radius:16px;overflow:hidden}.skin-card.selected{border-color:#9c78a9;box-shadow:0 0 0 2px #b99fc029}.skin-preview-button{position:relative;width:100%;background:transparent;color:#365140;text-align:left;padding:14px 16px 10px 65px;border-radius:0}.skin-emblem{position:absolute;left:18px;top:15px;font-size:31px;color:#bd825d}.skin-ice .skin-emblem{color:#6aabc1}.skin-cosmic .skin-emblem{color:#a17fc6}.skin-preview-button h3{margin:0 0 5px;font-size:16px}.skin-preview-button p{margin:0 0 5px;font-size:11px;color:#7c8b77;line-height:1.4}.skin-coverage{font-size:9px;color:#9b9d8a}.skin-card-bottom{padding:0 14px 12px;display:flex;gap:8px;justify-content:flex-end}.skin-try{background:transparent;color:#70836e;font-size:11px;padding:8px 10px}.skin-buy{background:#496e55;font-size:11px;padding:9px 14px}.skin-buy:disabled{background:#dce8d8;color:#6c8a6a;cursor:default}.shop-footer{display:flex;justify-content:space-between;gap:15px;align-items:center;margin-top:20px;border-top:1px solid #dae5d6;padding-top:15px}#shop-message{font-size:12px;margin:0 0 5px;color:#876a8b}#shop-storage{font-size:10px;color:#8a9783}#shop-grant{background:#e1d7e7;color:#795d83;font-size:11px;padding:11px 14px;white-space:nowrap}@media(max-width:760px){#shop-screen{padding:10px}.shop-dialog{padding:18px}.shop-layout{grid-template-columns:1fr}.shop-preview{padding:10px}#skin-preview{max-height:210px;object-fit:contain}.shop-heading h2{font-size:23px}.shop-heading-actions{gap:10px}#shop-balance{font-size:12px}.shop-footer{flex-wrap:wrap}}

#abilities{position:absolute;bottom:40px;left:50%;transform:translateX(-50%);display:flex;gap:8px;z-index:22}#abilities .ability-slot{min-width:0;width:140px;margin:0;padding:9px 10px;display:grid;grid-template-columns:19px 1fr 26px;align-items:center;gap:3px 6px;background:#f4f7eced;color:#3c5e49;border:1px solid #fff;border-radius:12px;text-align:center;box-shadow:0 4px 20px #153b3520}#abilities .ability-slot:disabled{opacity:.6;cursor:default}#abilities .ability-active{border-color:#a8e8f5;background:#def5faed;opacity:1!important}.ability-slot kbd{font-size:10px;background:#dce7d7;padding:3px;border-radius:4px}.ability-symbol{font-size:22px}.ability-label{grid-column:1/-1;grid-row:2;font-size:10px}.ability-slot b{font-size:11px}.shop-tabs{display:flex;gap:8px;margin:0 0 18px}.shop-tabs button{font-size:12px;padding:9px 18px;background:#e0e8db;color:#5d775f}.shop-tabs button[aria-pressed="true"]{background:#496e55;color:white}#shop-consumables{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.supply-card{background:#fafcf5;border:1px solid #dae5d4;border-radius:17px;padding:22px;display:flex;flex-direction:column;align-items:flex-start}.supply-icon{font-size:36px;color:#8f779f;margin-bottom:15px}.supply-card>small{font-size:10px;color:#8b9a82}.supply-card h3{font-size:19px;margin:7px 0}.supply-card p{font-size:12px;line-height:1.6;color:#7a8b73;flex:1}.supply-card>b{font-size:11px;color:#6d8266;margin:10px 0 15px}.supply-card button{font-size:12px;padding:12px 18px;background:#56775c}#revive-same,#death-shop{display:block;margin:12px auto 0;min-width:220px;font-size:12px;text-align:center;padding:12px;background:#706083}#revive-same:disabled{opacity:.45;cursor:default}#death-shop{background:transparent;color:#60785f;text-decoration:underline}.shop-dialog[hidden]{display:none}@media(max-width:650px){#abilities .ability-slot{width:104px;padding:7px}#shop-consumables{grid-template-columns:1fr}.supply-card{padding:16px}.supply-icon{margin-bottom:5px}}
.shop-layout{align-items:start}.shop-preview{position:sticky;top:0}.skin-halloween .skin-emblem{color:#cf813b}.skin-skeleton .skin-emblem{color:#63756d}.skin-neon .skin-emblem{color:#9b66b4}.skin-royal .skin-emblem{color:#bc944b}@media(max-width:760px){.shop-preview{position:static}}
#abilities .ability-slot{width:clamp(70px,calc((100vw - 64px)/6),140px)}
#welcome{overflow:auto;padding:clamp(20px,4vw,64px)}#welcome section{margin:auto 0;max-width:560px}#welcome h1{font-size:clamp(42px,5vw,68px);margin:15px 0}#welcome p{margin:10px 0}#start-choice{width:min(430px,85vw);background:#f6fbf2e8;border:1px solid #ffffffb8;border-radius:16px;padding:16px;margin:16px 0 0}#start-level-label{font-size:12px;font-weight:700}.start-level-row{display:flex;align-items:center;gap:10px;margin:8px 0}#start-level-icon{width:55px;flex:none}#start-level-icon svg{width:55px;height:42px;display:block}#start-level{width:100%;min-width:0;border:1px solid #c5d7c3;background:#fffdf4;color:#31553d;font:inherit;font-size:13px;padding:10px;border-radius:9px}#start-presets{display:flex;gap:7px;margin:5px 0 12px}#start-presets button{min-width:0;margin:0;flex:1;padding:7px;font-size:12px;text-align:center;border-radius:7px;background:#dce9d7;color:#476947}#start-presets button[aria-pressed=true]{background:#4d7855;color:white}.start-cost{display:flex;justify-content:space-between;gap:10px;font-size:12px;margin:8px 0}#start-wallet{color:#7c6285}#start-note{font-size:10px;line-height:1.5;color:#6c8068;display:block}#welcome #start-error{font-size:11px;line-height:1.4;color:#b14e43;margin:8px 0 0}#start-error:empty{display:none}#start:disabled{opacity:.5;cursor:default}

.online-game #welcome{align-items:flex-start}.online-game #welcome>section{margin:0;max-width:510px}.online-game #welcome h1{font-size:44px;margin:12px 0}.online-game #welcome>section>p{font-size:12px;margin:7px 0}.online-game #welcome .hint{margin-top:10px}#online-account{background:#f4f9f0ed;border:1px solid #fff;border-radius:14px;padding:13px 16px;margin:12px 0!important}#online-account>b{font-size:13px}#online-account #online-status{font-size:11px;line-height:1.4;margin:7px 0}#online-fields{display:grid;grid-template-columns:1fr 1fr;gap:7px}#online-fields input{min-width:0;width:100%;font:inherit;font-size:12px;padding:10px;border:1px solid #bbd1b9;border-radius:8px;background:#fff;color:#31543c}#online-password{grid-column:1/-1}#online-fields>div{grid-column:1/-1;display:flex;gap:7px}#online-account button{min-width:0;padding:9px 14px;margin:0;font-size:12px;text-align:center}#online-signup{background:#758a65}#online-account #online-logout{padding:6px 0;color:#7b6384;text-decoration:underline;background:transparent;margin-top:6px}#online-live-status{position:absolute;bottom:4px;left:50%;transform:translateX(-50%);z-index:45;font-size:10px;background:#173c35c9;color:#eaf8e3;padding:4px 10px;border-radius:5px;pointer-events:none;white-space:nowrap}.network-lost #online-live-status{background:#a33e36;color:white;font-size:13px;padding:10px 20px;bottom:25%}
.online-game:not(.in-flight) #stats,.online-game:not(.in-flight) #leaderboard,.online-game:not(.in-flight) #abilities,.online-game:not(.in-flight) footer{visibility:hidden}
#shop-rate{font-size:12px;color:#795d83;line-height:1.5;margin:-10px 0 20px}
#game-chat{position:absolute;left:24px;bottom:48px;width:min(310px,calc(100vw - 48px));z-index:22;color:#fff9e9;text-shadow:0 1px 3px #123b32;font-size:12px}.chat-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}.chat-heading>b{font-size:11px}#chat-open{min-width:0;margin:0;padding:4px 8px;font-size:10px;background:#163f345e;color:#f4ffef;border-radius:6px;text-align:center}#chat-messages{max-height:145px;overflow-y:auto;scrollbar-width:thin;overflow-wrap:anywhere;line-height:1.6;padding-right:5px}.chat-message{margin:2px 0}.chat-message b{color:#d7efaa}.chat-message.chat-mine b{color:#a8eaf5}.chat-compose{display:flex;gap:5px;margin-top:7px}#chat-input{min-width:0;flex:1;width:100%;padding:9px 10px;background:#f3faefef;border:1px solid #91ba99;border-radius:8px;color:#284f3c;font:inherit;font-size:12px;text-shadow:none}#chat-send{min-width:0;width:36px;margin:0;padding:7px;font-size:18px;text-align:center;background:#376d4a;border-radius:8px}#chat-send:disabled{opacity:.5}#chat-feedback{display:block;font-size:10px;line-height:1.4;color:#ffe4bb;margin-top:4px}.chat-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.online-game:not(.in-flight) #game-chat{display:none}.online-game #leaderboard{max-height:calc(100vh - 400px);bottom:auto;height:540px}@media(max-width:850px){#game-chat{left:12px;width:250px;bottom:48px}#chat-messages{max-height:115px}}
@media(max-width:1000px){#game-chat{bottom:130px}.online-game #leaderboard{max-height:calc(100vh - 480px)}}
#leaderboard,.online-game #leaderboard{height:auto;max-height:none;bottom:auto}.ranking-rows{flex:0 0 auto;overflow:visible;scrollbar-width:none}.ranking-row{min-height:18px;padding:2px 5px}@media(max-height:800px){#leaderboard,.online-game #leaderboard{top:122px;padding:6px 10px}.ranking-row{min-height:16px;padding:1px 5px;font-size:9px}.ranking-note{margin:3px 0 6px}.ranking-you{padding-top:6px;margin-top:5px}}@media(max-width:1000px){#chat-messages{max-height:80px}}
/* Footer and connection status have separate rows at every desktop width. */
footer{bottom:30px;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:5px 16px;align-items:end;pointer-events:none;line-height:1.4}
footer>span{min-width:0;overflow-wrap:anywhere}footer>span:nth-child(2){text-align:center}footer>span:last-child{text-align:right}
#abilities{bottom:70px}#online-live-status{bottom:5px;max-width:calc(100vw - 24px);white-space:normal;text-align:center}
@media(max-width:850px){footer{grid-template-columns:1fr 1fr;font-size:10px}footer>span:nth-child(2){grid-column:1/-1;grid-row:2}#abilities{bottom:88px}}
#touch-controls,#touch-menu{display:none}
.touch-game #game{touch-action:none}.touch-game button{touch-action:manipulation}
.touch-game.mobile-playing #touch-controls{display:block;position:fixed;inset:0;z-index:24;pointer-events:none;user-select:none;-webkit-user-select:none}
#touch-controls button,#touch-aim{pointer-events:auto;touch-action:none;-webkit-touch-callout:none}
#touch-controls button{min-width:0;margin:0;text-align:center;color:#fff;background:#174b42b8;border:1px solid #d5f9e78c;box-shadow:0 3px 15px #102e3455;padding:8px;border-radius:18px;font-weight:bold;font-size:24px}
.touch-movement{position:absolute;left:max(12px,env(safe-area-inset-left));bottom:max(32px,env(safe-area-inset-bottom));width:190px;height:142px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:64px 64px;gap:10px}
.touch-movement .touch-lift{grid-column:1/-1;grid-row:1}.touch-lift small{display:inline;font-size:12px;margin-left:10px}
.touch-weapons{position:absolute;right:max(12px,env(safe-area-inset-right));bottom:max(32px,env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;gap:8px}
#touch-controls #touch-special{font-size:12px;width:130px;height:42px;border-radius:12px;background:#72505ac9}
#touch-aim{width:130px;height:130px;border-radius:50%;border:2px solid #d5f9e794;background:#193f4c8f;display:grid;place-items:center;position:relative;color:#fff}
#touch-aim-knob{width:55px;height:55px;display:grid;place-items:center;background:#e0f9ed4a;border-radius:50%;font-size:32px;pointer-events:none}
#touch-aim small{position:absolute;bottom:9px;font-size:10px;pointer-events:none}
.touch-game #touch-menu{display:flex;position:absolute;right:max(10px,env(safe-area-inset-right));top:90px;z-index:25;gap:4px}
#touch-menu button{min-width:38px;margin:0;padding:10px 7px;font-size:11px;text-align:center;background:#173f42c7;border-radius:9px}
.touch-game:not(.mobile-playing) #touch-menu{display:none}
.touch-game header{top:max(8px,env(safe-area-inset-top));left:max(10px,env(safe-area-inset-left));right:max(10px,env(safe-area-inset-right))}
.touch-game #stats{left:0;transform:none;width:calc(100% - 130px);padding:8px;gap:5px 8px;border-radius:12px}
.touch-game .brand{display:none}.touch-game #sound,.touch-game #shop-toggle{max-width:124px;padding:9px 7px;font-size:10px}.touch-game #shop-toggle{top:39px}
.touch-game .meter{font-size:9px}.touch-game .xp-total{font-size:9px}.touch-game .level{font-size:10px}
.touch-game #leaderboard{display:none;top:125px;left:12px;background:#153c40ed;border-radius:12px;padding:10px;width:210px;z-index:26}
.touch-game.mobile-ranking #leaderboard{display:flex}
.touch-game #game-chat{display:none;bottom:270px;left:12px;width:min(310px,calc(100vw - 24px));background:#153c40ed;padding:10px;border-radius:12px;z-index:26}
.touch-game.mobile-chat #game-chat{display:block}.touch-game #chat-messages{max-height:100px}
.touch-game #abilities{bottom:222px;width:calc(100vw - 24px);gap:4px;justify-content:center;z-index:23}
.touch-game #abilities .ability-slot{min-width:0;width:auto;flex:1;max-width:100px;padding:7px 3px;grid-template-columns:1fr 1fr;gap:2px;border-radius:9px}
.touch-game .ability-slot kbd{display:none}.touch-game .ability-label{font-size:9px}.touch-game .ability-symbol{font-size:19px}
.touch-game footer{left:12px;right:12px;bottom:194px;grid-template-columns:1fr;font-size:9px;text-align:center;gap:0}
.touch-game footer>span{text-align:center!important}.touch-game footer>span:nth-child(2){display:none}
.touch-game #online-live-status{bottom:174px;z-index:23;font-size:9px;padding:3px 8px}
.touch-game #warnings{top:130px;font-size:11px}.touch-game #toast{top:170px;padding:10px 14px;font-size:12px;max-width:90vw}
.touch-game #guide{top:130px;right:12px;z-index:26;background:#f3faefed}
.touch-game #welcome{padding:16px;padding-top:max(16px,env(safe-area-inset-top));z-index:30}
.touch-game #welcome section{width:100%;max-width:510px}.touch-game #welcome h1{font-size:35px}.touch-game #welcome section>small{font-size:9px;letter-spacing:1px}
.touch-game #shop-screen{padding:8px}.touch-game .shop-dialog{max-height:94dvh}.touch-game #death-screen section{max-height:90dvh;overflow:auto;padding:20px}
.touch-game #game{height:100dvh}
@media(orientation:landscape) and (max-height:600px){
 .touch-game .touch-movement{bottom:max(12px,env(safe-area-inset-bottom));width:176px;height:130px;grid-template-rows:58px 58px}
 .touch-game .touch-weapons{bottom:max(12px,env(safe-area-inset-bottom))} .touch-game #touch-aim{width:112px;height:112px}.touch-game #touch-special{height:36px;width:120px}
 .touch-game #abilities{left:205px;right:155px;transform:none;width:auto;bottom:52px;gap:3px}.touch-game #abilities .ability-slot{padding:5px 2px}.touch-game .ability-label{font-size:8px}
 .touch-game footer{left:205px;right:155px;bottom:10px}.touch-game #online-live-status{bottom:auto;top:88px;max-width:50vw}
 .touch-game #touch-menu{top:82px}.touch-game #leaderboard{top:112px;max-height:calc(100dvh - 130px);overflow:auto}
 .touch-game #game-chat{left:205px;bottom:120px;width:calc(100vw - 370px);max-width:400px}.touch-game #chat-messages{max-height:62px}
 .touch-game #warnings{top:110px}.touch-game #toast{top:145px}
}
#touch-chat-close{display:none}.touch-game #touch-chat-close{display:block;min-width:32px;margin:0;padding:5px 10px;font-size:18px;text-align:center}.touch-game #chat-open{font-size:0}.touch-game #chat-open::after{content:"✎";font-size:15px}
@media(orientation:portrait){
 .touch-game #stats{grid-template-columns:repeat(2,minmax(0,1fr))}
 .touch-game #touch-menu{top:140px}.touch-game #leaderboard{top:182px}.touch-game #warnings{top:184px}.touch-game #toast{top:218px}
 .touch-game footer{right:156px}.touch-game #online-live-status{left:12px;right:156px;transform:none;max-width:none;font-size:8px}
 .touch-game .touch-movement{width:clamp(140px,48vw,190px)}.touch-game #touch-aim{width:clamp(100px,33vw,130px);height:clamp(100px,33vw,130px)}
}