/* Tintstorm · warmes Papier, satte Farben und eine klare Spiel-Lobby. */
*,*::before,*::after{box-sizing:border-box}
:root{--ink:#193e3d;--paper:#fffdf5;--team:#008d7f;--rival:#e65c40;--sun:#f9d55c;--muted:#617370;--veil:rgba(16,48,47,.45)}
.screen{padding-top:max(24px,env(safe-area-inset-top));padding-bottom:max(24px,env(safe-area-inset-bottom))}
.panel{border:1px solid rgba(25,62,61,.18);border-radius:24px;box-shadow:0 24px 80px #092d352b;padding:30px;max-width:450px;gap:20px}
h2{line-height:1.05;letter-spacing:-.025em}
.lede{color:var(--muted);font-size:14px;line-height:1.65}
.eyebrow{font-size:10px;letter-spacing:.13em;color:var(--muted)}
#menu{display:grid;grid-template-columns:minmax(0,1fr) 410px;grid-template-rows:auto 1fr auto;gap:30px 7%;padding:30px max(5vw,24px);background:linear-gradient(100deg,rgba(239,245,223,.97) 0%,rgba(228,239,214,.91) 40%,rgba(209,230,206,.72) 100%);backdrop-filter:blur(2px);align-items:center}
.lobby-brand{grid-column:1/-1;display:flex;align-items:center;gap:12px;font-size:12px;font-weight:800;letter-spacing:.14em}
.brand-mark{display:grid;place-items:center;width:38px;height:38px;background:var(--ink);color:var(--sun);border-radius:12px 12px 12px 3px;font:30px var(--font-display);letter-spacing:-2px;padding-right:3px;transform:rotate(-7deg)}
.brand-tag{margin-left:auto;font-size:10px;letter-spacing:.2em}
.lobby-hero{position:relative;max-width:720px;padding:25px 0 40px}
.hero-tag{display:flex;align-items:center;gap:9px;font-size:10px;letter-spacing:.16em;font-weight:800;margin-bottom:26px}
.hero-tag>span{width:8px;height:8px;background:var(--team);border-radius:50%;box-shadow:0 0 0 5px #008d7f13}
.lobby-hero h1{font-size:clamp(64px,7.9vw,122px);letter-spacing:-.045em;line-height:.93;position:relative;z-index:1}
.lobby-hero h1 span{color:var(--team);display:inline-block;transform:rotate(-4deg);position:relative}
.lobby-hero h1 span::after{content:"";position:absolute;height:10px;bottom:-9px;left:4px;right:0;background:var(--sun);border-radius:50%;transform:rotate(1deg)}
.lobby-hero>p{font-size:17px;line-height:1.7;margin:34px 0 35px;color:#42605a;font-weight:700}
.hero-sticker{display:grid;place-content:center;position:absolute;right:4%;top:50%;width:122px;height:122px;background:#ff795b;color:#243e36;transform:rotate(13deg);clip-path:polygon(50% 0,61% 8%,75% 7%,81% 20%,94% 25%,92% 40%,100% 50%,92% 62%,94% 75%,80% 81%,75% 94%,60% 92%,50% 100%,39% 92%,25% 94%,19% 81%,6% 75%,8% 60%,0 50%,8% 39%,6% 25%,20% 19%,25% 6%,40% 8%);font-size:12px;line-height:1.35;font-weight:800;text-align:center}
.hero-modes{display:flex;gap:25px;font-size:11px;font-weight:800}
.hero-modes span{display:flex;align-items:center;gap:9px}
.hero-modes b{font-size:10px;border:1px solid #193e3d40;border-radius:50%;padding:6px}
.lobby-panel{width:100%;max-width:none;gap:15px;position:relative;transform:rotate(1deg);box-shadow:9px 10px 0 #193e3d0c,0 24px 60px #193e3d20;border-radius:22px;padding:30px}
.lobby-panel>*{transform:rotate(-1deg)}
.lobby-panel h2{font-size:36px}
.lobby-heading{display:flex;justify-content:space-between;align-items:center;gap:6px}
.capacity{white-space:nowrap;font-size:9px;background:#e5f1eb;color:var(--team);padding:5px 7px;border-radius:5px;font-weight:800}
.lobby-panel .lede{margin-top:-7px;font-size:13px}
.server-status{border-radius:9px;padding:10px 12px;background:#f3efe4;font-size:11px;line-height:1.5;font-weight:800;color:#776344;display:flex;align-items:center;gap:8px}
.server-status::before{content:"";width:7px;height:7px;flex-shrink:0;border-radius:50%;background:#b59652}
.server-status.is-open{background:#e7f4eb;color:#26765b}
.server-status.is-open::before{background:#26865b}
.controls-details{border-top:1px solid #193e3d18;border-bottom:1px solid #193e3d18;padding:12px 0}
.controls-details summary{display:flex;align-items:center;justify-content:space-between;cursor:pointer;font-size:12px;font-weight:800;list-style:none}
.controls-details summary::-webkit-details-marker{display:none}
.controls-details summary span{font-size:19px;font-weight:500;color:var(--team)}
.controls-details[open] summary span{transform:rotate(45deg)}
.controls-content{padding-top:16px;display:grid;gap:20px}
.keys{font-size:11px;gap:8px}
kbd{font-size:10px;border-color:#193e3d38;background:#f2f4ec;border-width:1px 1px 3px;border-radius:5px;padding:2px 5px}
.settings{gap:14px;border-top:1px solid #193e3d18;padding-top:14px}
.seg{border:1px solid #193e3d30;border-radius:8px}
.seg label{font-size:11px;padding:7px 9px}
.seg input:not(:first-child)+label{border-left:1px solid #193e3d30}
input[type=range]{width:120px}
.actions{gap:10px}
.name{border:1px solid #193e3d30;border-radius:9px;padding:12px 13px;font-size:14px;background:#fff;transition:border-color .15s}
.name::placeholder{color:#8d9992;font-weight:500}
.go{display:flex;align-items:center;justify-content:space-between;border:0;background:var(--team);color:#fffdf5;border-radius:10px;box-shadow:0 4px 0 #00665c;font:800 15px var(--font-body);padding:15px 17px;transition:background .15s,transform .15s,box-shadow .15s}
.go:hover{background:#00766b;transform:translateY(-1px)}
.go:active{transform:translateY(3px)}
.go span,.ghost span{font-size:20px;line-height:1}
.ghost{border:1px solid #193e3d30;border-radius:10px;padding:12px 16px;font-size:12px;transition:background .15s}
.ghost:hover{background:#193e3d08}
#startBtn{display:flex;justify-content:space-between;align-items:center;background:#f9d55c;border-color:transparent}
#startBtn:hover{background:#f1c943}
#adminBtn{border:0;padding:2px;font-size:10px;color:var(--muted);text-decoration:underline;text-underline-offset:3px}
.lobby-panel .foot{font-size:10px;text-align:center;line-height:1.6;margin-top:2px}
.best{font-size:12px;color:var(--team)}
.best:empty{display:none}
.net-msg{font-size:12px;line-height:1.5}
.lobby-footer{grid-column:1/-1;display:flex;justify-content:space-between;gap:20px;border-top:1px solid #193e3d25;padding-top:17px;font-size:10px;font-weight:800;letter-spacing:.09em;color:#56736a}
.chip,.ammo{background:#fffdf5ed;border:1px solid #193e3d25;border-radius:12px;box-shadow:0 4px 16px #123a3720;backdrop-filter:blur(8px)}
.chip{padding:9px 16px;gap:4px;min-width:86px}
.chip b{font-size:1.65rem}
#pauseBtn{min-width:45px;padding:12px;font-size:1.3rem}
.hud-top{top:calc(20px + env(safe-area-inset-top,0px));left:max(20px,env(safe-area-inset-left,0px));right:max(20px,env(safe-area-inset-right,0px));gap:10px}
.hud-bottom{bottom:calc(22px + env(safe-area-inset-bottom,0px));left:max(22px,env(safe-area-inset-left,0px));right:max(22px,env(safe-area-inset-right,0px))}
.shield{padding:12px 15px;background:#fffdf5ed;border-radius:12px;box-shadow:0 4px 16px #123a3720;gap:8px}
.bar{height:10px;border:0;background:#193e3d18}
.bar i{border-radius:9px}
.ammo{padding:9px 17px;gap:9px}
#cross{width:18px;height:18px;margin:-9px 0 0 -9px;border-width:2px;box-shadow:0 0 0 1px #193e3d99,inset 0 0 0 1px #193e3d99}
#feed{top:calc(98px + env(safe-area-inset-top,0px))}
#feed div{border:0;padding:6px 12px;border-radius:7px;box-shadow:0 2px 10px #123a3720;font-size:12px}
#board{border:1px solid #193e3d30;border-radius:18px;box-shadow:0 20px 70px #123a3740;padding:20px}
#board td{padding:9px 6px}
.stat{border:1px solid #193e3d20;background:#edf3e9;padding:14px 10px;gap:8px}
@media(min-width:1500px){#menu{padding-left:calc((100vw - 1320px)/2);padding-right:calc((100vw - 1320px)/2)}}
@media(max-width:1050px){#menu{gap:24px 5%;grid-template-columns:minmax(0,1fr) 370px;padding:24px 4%}.lobby-panel{padding:24px}.hero-sticker{right:-10px;top:58%;width:95px;height:95px;font-size:10px}.hero-modes{flex-direction:column;gap:12px}.lobby-hero h1{font-size:clamp(60px,8.5vw,90px)}}
@media(max-width:760px){#menu{display:flex;flex-direction:column;justify-content:flex-start;padding:20px;gap:24px}.lobby-brand{width:100%}.brand-tag{font-size:8px}.lobby-hero{width:100%;max-width:430px;padding:8px 0 0}.hero-tag{font-size:9px;margin-bottom:18px}.lobby-hero h1{font-size:68px}.lobby-hero>p{font-size:14px;margin:24px 0 0}.hero-sticker{top:40%;right:0;width:104px;height:104px}.hero-modes{display:none}.lobby-panel{max-width:430px;transform:none;padding:25px;flex-shrink:0}.lobby-panel>*{transform:none}.lobby-footer{max-width:430px;width:100%;font-size:8px;margin-top:4px}.lobby-footer span:last-child{max-width:130px;text-align:right}.hud-top{gap:6px;left:12px;right:12px}.chip{min-width:62px;padding:7px 10px}.chip b{font-size:1.3rem}.lbl{font-size:9px}body.touch .hud-bottom{top:calc(88px + env(safe-area-inset-top,0px))}.panel{width:min(100%,450px)}}
@media(max-height:750px) and (min-width:761px){#menu{gap:15px 6%;padding-top:18px;padding-bottom:18px}.lobby-panel{gap:11px;padding:23px}.lobby-panel h2{font-size:30px}.lobby-brand{font-size:10px}.brand-mark{width:30px;height:30px;font-size:25px}.lobby-footer{padding-top:10px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}
@media(min-width:761px){.lobby-brand,.lobby-footer{width:100%}.lobby-hero{width:100%}.hero-sticker{top:65%;right:1%}}
@media(max-width:760px){.hero-sticker{display:none}}
/* Dezente Materialität und klarere Rückmeldung am Farbmixer. */
#game::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 42%,transparent 48%,rgba(20,47,43,.13) 100%)}
.ammo .lbl{max-width:120px;line-height:1.4}
.ammo.reloading{background:#fff4ce;border-color:#d5b35f}
.ammo.reloading .lbl{color:#85651e}
#cross{opacity:.85}
#banner{letter-spacing:-.025em}
@media(max-width:760px){.ammo .lbl{max-width:85px}.ammo{gap:6px}body.touch .hud-bottom{gap:8px}}
.match-choice{margin:0;padding:0;border:0;min-width:0}
.match-choice legend{font-size:10px;letter-spacing:.1em;color:var(--muted);font-weight:800;text-transform:uppercase;margin-bottom:7px}
.map-options,.mode-options{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.map-options label,.mode-options label{position:relative;cursor:pointer;min-width:0}
.match-choice input{position:absolute;opacity:0;inset:0;width:100%;height:100%;cursor:pointer;margin:0}
.match-choice label>span{border:1px solid #193e3d28;border-radius:9px;padding:10px;display:flex;flex-direction:column;gap:3px;transition:background .15s,border-color .15s}
.map-options b{font-size:12px}.map-options small{font-size:9px;color:var(--muted)}
.match-choice input:checked+span{border-color:var(--team);background:#e9f3e9;box-shadow:inset 0 0 0 1px var(--team)}
.match-choice input:focus-visible+span{outline:3px solid #f0c752;outline-offset:2px}
.mode-options label>span{flex-direction:row;justify-content:center;align-items:center;font-size:11px;font-weight:800;padding:9px 5px;gap:5px}
.blue-dot,.red-dot{width:7px;height:7px;background:#357cdb;border-radius:50%}.red-dot{background:#e46457}
.match-hint{font-size:10px;line-height:1.4;color:var(--muted);margin:-5px 0 0}
.match-hud{position:absolute;bottom:104px;left:max(22px,env(safe-area-inset-left));display:grid;gap:2px;background:#fffdf5ed;border-radius:9px;padding:7px 11px;font-size:10px;color:var(--muted);box-shadow:0 3px 12px #123a3718}
.match-hud #mapLabel{font-weight:800;color:var(--ink)}
.team-score{position:absolute;top:22px;left:50%;transform:translateX(-50%);background:#fffdf5ed;border:1px solid #193e3d20;border-radius:14px;display:flex;gap:15px;align-items:center;padding:9px 18px;box-shadow:0 4px 16px #123a3720;font-size:10px;font-weight:800}
.team-score>span{display:flex;align-items:center;gap:12px}.team-score b{font:28px var(--font-display);font-variant-numeric:tabular-nums}
.blue-score{color:#286ab9}.red-score{color:#c64e42}.team-score .versus{font-size:18px;color:#879893}
#board td small{font-size:8px;color:var(--muted)}
@media(min-width:761px){#menu{grid-template-columns:minmax(0,1fr) 430px}.lobby-panel{gap:12px;padding:25px}}
@media(max-width:1050px) and (min-width:761px){#menu{grid-template-columns:minmax(0,1fr) 380px}.lobby-panel{padding:22px}.lobby-hero h1{font-size:clamp(50px,7.4vw,80px)}}
@media(max-width:760px){.lobby-panel{gap:12px}.team-score{top:calc(160px + env(safe-area-inset-top,0px));padding:5px 12px;gap:12px}.team-score b{font-size:22px}.match-hud{left:auto;right:12px;bottom:calc(260px + env(safe-area-inset-bottom,0px));font-size:9px;max-width:130px}.match-hud #teamLabel{font-size:9px}}
#interactionHint{position:absolute;left:50%;bottom:100px;transform:translateX(-50%);background:#fffdf5ed;color:var(--ink);padding:9px 15px;border-radius:9px;box-shadow:0 3px 12px #123a3720;font-size:12px;font-weight:800;white-space:nowrap}
#climbBtn{right:calc(132px + env(safe-area-inset-right,0px));bottom:calc(112px + env(safe-area-inset-bottom,0px));width:72px;height:72px;background:var(--paper);font-size:11px}
body.touch #interactionHint{bottom:calc(220px + env(safe-area-inset-bottom,0px));font-size:10px;max-width:92vw;white-space:normal}
.name-tools{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:9px;color:var(--muted)}
.name-tools button{border:0;background:transparent;color:var(--team);font:800 10px var(--font-body);cursor:pointer;padding:2px 0}
.avatar-choice{display:flex;gap:7px}.avatar-choice label{position:relative;flex:1;cursor:pointer}.avatar-choice input{position:absolute;opacity:0}.avatar-choice span{display:block;padding:7px 8px;border:1px solid #193e3d25;border-radius:7px;text-align:center;font-size:10px;font-weight:800}.avatar-choice input:checked+span{box-shadow:inset 0 0 0 1px currentColor}.blue-avatar{color:#357cdb;background:#eaf2fc}.red-avatar{color:#c64e43;background:#fff0eb}
#climbBtn{right:calc(120px + env(safe-area-inset-right,0px));bottom:calc(118px + env(safe-area-inset-bottom,0px));width:68px;height:68px;font-size:11px}
#climbDownBtn{right:calc(198px + env(safe-area-inset-right,0px));bottom:calc(118px + env(safe-area-inset-bottom,0px));width:68px;height:68px;font-size:11px;background:var(--paper)}
@media(min-width:761px){.lobby-panel{gap:10px;padding:23px}.lobby-panel h2{font-size:32px}.lobby-panel .foot{font-size:9px}}
/* Lobby und Ergebnis: eine breite Karte im Look der Startseite. */
.room-panel{max-width:640px;width:100%;gap:16px;max-height:calc(100vh - 48px);overflow:auto}
.room-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px}
.room-head h2{font-size:32px}
.room-status{font-size:12px;font-weight:800;background:#f3efe4;color:#776344;border-radius:9px;padding:8px 12px;white-space:nowrap;font-variant-numeric:tabular-nums}
.room-status.hot{background:#f9d55c;color:var(--ink)}
.room-block{display:grid;gap:8px}
.room-label{font-size:10px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.room-label span{letter-spacing:.04em;text-transform:none}
.room-modes{display:flex;gap:8px}
.room-modes button,.team-pick button{flex:1;border:1px solid #193e3d30;background:#fff;border-radius:9px;padding:10px;font:800 12px var(--font-body);color:var(--ink);cursor:pointer}
.room-modes button.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.room-modes button:disabled{cursor:default}
.room-modes button:disabled:not(.on){opacity:.55}
.map-vote{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.map-vote button{position:relative;overflow:hidden;text-align:left;border:1px solid #193e3d30;background:#fff;border-radius:11px;padding:12px 13px;cursor:pointer;display:grid;gap:3px;color:var(--ink);font-family:var(--font-body)}
.map-vote button b{font-size:14px;position:relative;z-index:1}
.map-vote button small{font-size:11px;font-weight:800;color:var(--muted);position:relative;z-index:1}
.map-vote button i{position:absolute;left:0;bottom:0;height:4px;background:var(--team);transition:width .2s}
.map-vote button.on{border-color:var(--team);box-shadow:inset 0 0 0 1px var(--team);background:#eef7f3}
.map-vote button:disabled{cursor:default}
.team-pick{display:flex;gap:8px}
.team-pick .pick-blue{color:#286ab9}.team-pick .pick-red{color:#c64e42}
.team-pick .pick-blue.on{background:#357cdb;color:#fff;border-color:#357cdb}.team-pick .pick-red.on{background:#e46457;color:#fff;border-color:#e46457}
.room-players ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.room-players li{display:flex;align-items:center;gap:6px;padding:7px 10px;border-radius:8px;background:#f6f4ec;font-size:13px}
.room-players li.me{background:#e7f4eb}
.room-players li.empty{color:var(--muted);font-size:12px;font-weight:700;background:transparent}
.room-players li small{color:var(--muted);font-weight:700}
.room-players .tick{margin-left:auto;font-size:11px;font-weight:800;color:#8d9992;border-radius:6px;padding:2px 7px;background:#ece8dc}
.room-players .tick.ok{background:#26865b;color:#fff}
.room-players .move{border:1px solid #193e3d30;background:#fff;border-radius:6px;font:800 10px var(--font-body);padding:3px 7px;cursor:pointer;color:var(--ink)}
.room-players.teams{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.team-title{font-size:11px;font-weight:800;margin-bottom:6px;letter-spacing:.06em}
.team-col.blue .team-title{color:#286ab9}.team-col.red .team-title{color:#c64e42}
.room-hint{margin:0;font-size:12px;line-height:1.5;color:var(--muted);font-weight:700}
.room-actions{display:grid;gap:8px}
#readyBtn.is-ready{background:#26865b;box-shadow:0 4px 0 #1b6644}
#results h2{font-size:38px}
.team-final{display:flex;justify-content:center;gap:16px;align-items:center;font-size:12px;font-weight:800}
.team-final>span{display:flex;align-items:center;gap:10px}.team-final b{font:40px var(--font-display)}.team-final .versus{font-size:22px;color:#879893}
.master-card{display:flex;align-items:center;gap:14px;background:#fff6d6;border:1px solid #f1d46a;border-radius:14px;padding:12px 16px}
.master-card .medal{font-size:34px}
.master-card div{display:grid;gap:1px}
.master-card small{font-size:10px;font-weight:800;letter-spacing:.16em;color:#9a7a17}
.master-card b{font:24px var(--font-display)}
.master-card span{font-size:12px;font-weight:800;color:var(--muted)}
.result-table table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;font-size:13px}
.result-table th{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);text-align:right;padding:4px 6px}
.result-table th:nth-child(2),.result-table td:nth-child(2){text-align:left}
.result-table td{padding:7px 6px;font-weight:800;text-align:right;border-top:1px solid #193e3d14}
.result-table td:first-child{color:var(--muted)}
.result-table tr.me td{background:#e7f4eb}
.result-table tr.master td{background:#fff6d6}
@media(max-width:560px){.map-vote,.room-players.teams{grid-template-columns:1fr}.room-head{flex-direction:column;align-items:flex-start}}
/* FPS-Anzeige unter der Pausentaste */
.fps{position:absolute;top:calc(78px + env(safe-area-inset-top,0px));right:max(20px,env(safe-area-inset-right,0px));background:#fffdf5d9;border:1px solid #193e3d25;border-radius:8px;padding:3px 8px;font:800 11px var(--font-body);color:var(--muted);font-variant-numeric:tabular-nums;pointer-events:none}
.fps.low{color:#c64e42}
/* Kompakte Spielanzeige auf Smartphones (Querformat mit wenig Höhe oder schmale Hochkant-Ansicht) */
@media (max-height:520px), (max-width:560px){
  body.touch .hud-top{top:calc(6px + env(safe-area-inset-top,0px));left:max(8px,env(safe-area-inset-left,0px));right:max(8px,env(safe-area-inset-right,0px));gap:5px}
  body.touch .chip{min-width:0;padding:3px 8px;gap:0;border-radius:8px}
  body.touch .chip b{font-size:15px;line-height:1.1}
  body.touch .lbl{font-size:7px;letter-spacing:.06em}
  body.touch #pauseBtn{min-width:34px;padding:6px 9px;font-size:14px}
  body.touch .match-hud{display:none}
  body.touch .fps{top:calc(46px + env(safe-area-inset-top,0px));right:max(8px,env(safe-area-inset-right,0px));font-size:9px;padding:1px 6px}
  /* Schutzschirm und Pinsel als schmale Leiste oben in der Mitte */
  body.touch .hud-bottom{top:calc(8px + env(safe-area-inset-top,0px));bottom:auto;left:50%;right:auto;transform:translateX(-50%);gap:6px;align-items:center}
  body.touch .shield{padding:5px 8px;gap:0;border-radius:8px}
  body.touch .shield .lbl{display:none}
  body.touch .bar{width:min(130px,26vw);height:8px}
  body.touch .ammo{padding:2px 8px;gap:4px;border-radius:8px}
  body.touch .ammo .lbl{display:none}
  body.touch .ammo b{font-size:15px}
  body.touch .ammo small{font-size:10px}
  body.touch .team-score{top:calc(44px + env(safe-area-inset-top,0px));padding:3px 10px;gap:8px;font-size:8px}
  body.touch .team-score b{font-size:16px}
  body.touch #feed{top:calc(70px + env(safe-area-inset-top,0px));gap:2px}
  body.touch #feed div{font-size:10px;padding:2px 7px}
  body.touch #banner{font-size:clamp(1.4rem,6vw,2.2rem)}
  /* Steuerknöpfe etwas kleiner */
  body.touch #stick{width:104px;height:104px;left:calc(18px + env(safe-area-inset-left,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px))}
  body.touch #knob{width:44px;height:44px;margin:-22px 0 0 -22px}
  body.touch #fireBtn{width:80px;height:80px;right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(22px + env(safe-area-inset-bottom,0px));font-size:1rem}
  body.touch #jumpBtn{width:56px;height:56px;right:calc(108px + env(safe-area-inset-right,0px));bottom:calc(14px + env(safe-area-inset-bottom,0px));font-size:.75rem}
  body.touch #reloadBtn{width:56px;height:56px;right:calc(26px + env(safe-area-inset-right,0px));bottom:calc(116px + env(safe-area-inset-bottom,0px));font-size:.65rem}
  body.touch #climbBtn{width:56px;height:56px;right:calc(100px + env(safe-area-inset-right,0px));bottom:calc(86px + env(safe-area-inset-bottom,0px))}
  body.touch #climbDownBtn{width:56px;height:56px;right:calc(166px + env(safe-area-inset-right,0px));bottom:calc(86px + env(safe-area-inset-bottom,0px))}
  body.touch #interactionHint{bottom:calc(150px + env(safe-area-inset-bottom,0px))}
}
/* Auswahl der Grafikstufe */
.quality-select{font:800 12px var(--font-body);color:var(--ink);background:#fff;border:1px solid #193e3d30;border-radius:8px;padding:6px 8px}
.quality-row{display:flex;justify-content:space-between;align-items:center;gap:10px}
/* TESTFUNKTION Bots: Auswahl in der Lobby */
.bot-box{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:12px;font-weight:800;color:var(--muted);background:#f6f4ec;border-radius:8px;padding:6px 10px}