.room-panel{width:min(860px,calc(100vw - 40px));min-width:0;max-height:none;overflow:visible}.room-panel input{width:230px;max-width:60%;background:#203940;border:1px solid #789995;color:white;padding:11px;font-size:14px}.room-panel input::placeholder{color:#9db1b3}.room-code{padding:16px;background:#0c2028}.room-code>b{display:block;font:32px monospace;letter-spacing:4px;margin:10px 0 14px;-webkit-user-select:all;user-select:all}@media(pointer:coarse){.room-code>b{-webkit-user-select:none;user-select:none}}.code-actions{display:flex;flex-wrap:wrap;gap:10px}.room-code .secondary{width:auto;margin:0;font-size:12px;padding:12px 16px}.room-code p{font-size:13px;margin:14px 0 0}#connection{color:var(--cyan)}#roomError{color:var(--orange);margin:12px 0}#roster{margin-top:20px}.roster-row{display:grid;grid-template-columns:minmax(0,1fr) auto 60px;gap:20px;align-items:center;padding:12px 0;border-bottom:1px solid #78999555;font:14px monospace}.roster-row span:first-child{overflow-wrap:anywhere}#multiHud{position:fixed;inset:0;padding:25px 30px;pointer-events:none;text-shadow:0 2px 5px #000}#multiHud #ping{margin-top:8px}#liveScore{font:14px monospace;line-height:1.8;min-width:230px}#liveScore div{display:flex;justify-content:space-between;gap:24px}#liveScore .me{color:var(--cyan)}.scoreboard>small{display:flex;justify-content:space-between;gap:24px;color:#c9d8d8;margin-bottom:4px}#multiNotice{position:absolute;top:22%;left:0;right:0;width:fit-content;max-width:90vw;margin:0 auto;text-align:center;font:bold 16px monospace;letter-spacing:1px;color:var(--cyan)}#multiNotice:not(:empty){background:#10222ac7;padding:8px 16px}#multiShield{color:var(--cyan)}#multiHud .hud-bottom>div:nth-child(2){max-width:50%;text-align:center}#multiHud small{line-height:1.7}.room-panel>small{line-height:1.7;color:var(--muted)}
/* Touch targets sit below the sight line and respect phone cutouts. */
#roomMenu{overflow:auto;padding:20px;align-items:start}.room-panel{margin:auto}.touch-room #desktopHelp{display:none}#roomTouch{position:fixed;inset:0;pointer-events:none;z-index:3;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}#roomLook{position:absolute;left:38%;right:0;top:0;bottom:0;pointer-events:auto;touch-action:none}#roomStick{position:absolute;left:max(22px,env(safe-area-inset-left));bottom:max(22px,env(safe-area-inset-bottom));width:132px;height:132px;border-radius:50%;border:2px solid #b0eee866;background:#142e3888;pointer-events:auto;touch-action:none;display:grid;place-items:center}#roomThumb{display:block;width:48px;height:48px;border-radius:50%;background:#a9f2eaaa;border:2px solid #d8fff5;pointer-events:none}.touch-actions{position:absolute;right:max(16px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(4,60px);gap:7px;pointer-events:none}.touch-actions button,#touchMenu{min-height:48px;border:1px solid #b0eee888;background:#102b36cc;color:#edf1e9;font:bold 12px Arial;pointer-events:auto;touch-action:none;border-radius:8px;padding:5px}.touch-actions [aria-pressed=true]{background:#84efdb;color:#10232c}.touch-actions .room-fire{grid-column:4;grid-row:1/3;background:#b75226cc;border-color:#ffc691;min-height:103px}#touchMenu{position:fixed;z-index:4;top:max(12px,env(safe-area-inset-top));right:max(14px,env(safe-area-inset-right));padding:10px 16px}.touch-room #multiHud{padding:12px max(18px,env(safe-area-inset-right))}.touch-room .hud-right{margin-right:85px}.touch-room #liveScore{font-size:11px;min-width:150px}.touch-room .matchclock{padding:4px 15px}.touch-room .matchclock strong{font-size:24px}.touch-room #multiHud .hud-bottom{left:max(22px,env(safe-area-inset-left));right:max(16px,env(safe-area-inset-right));bottom:185px}.touch-room .vitals strong,.touch-room .ammo strong{font-size:30px}.touch-room #multiHud .hud-bottom small{font-size:11px}.touch-room #multiNotice{top:30%;font-size:13px}.touch-room #multiHud #multiShield{margin-top:0}.touch-room #multiHud #multiGrenade{font-size:10px}@media(max-width:600px) and (orientation:portrait){.touch-actions{grid-template-columns:repeat(3,58px);gap:6px}.touch-actions .room-fire{grid-column:3;grid-row:1/3}#roomStick{width:116px;height:116px;left:14px}.touch-room #multiHud .hud-bottom{bottom:245px}.touch-room .scoreboard{display:none}.touch-room #multiHud .hud-top{padding-right:85px}.touch-room #roomInfo{font-size:11px}.touch-room .matchclock{padding:4px 8px}.touch-room #multiHud .hud-bottom>div:nth-child(2){max-width:38%}}

.room-choices{display:grid;grid-template-columns:1.2fr 1fr;gap:16px;align-items:start}.room-choice{padding:18px;background:#0e232bcc;border:1px solid #78999533;border-top:2px solid var(--orange)}.room-choice.quick-play{background:#102c34;border-top-color:var(--cyan)}.room-choice p{font-size:13px;line-height:1.6;margin:0 0 14px;color:var(--muted)}.room-choice label{margin:12px 0}.room-choice .primary{margin-top:6px}.room-choice .secondary{margin-top:0}.code-field{margin-top:22px!important;padding-top:18px;border-top:1px solid #78999544}.private-heading{font:bold 13px monospace;color:var(--orange);letter-spacing:1px;margin:0 0 8px}.quick-play .private-heading{color:var(--cyan)}.name-field{margin-top:8px!important;justify-content:flex-start!important;gap:20px!important}#hostHint{font-size:14px;line-height:1.7;color:var(--cyan)}#matchResult{margin:0 0 18px;padding:12px 16px;background:#0c2028;border-left:3px solid var(--cyan);font-size:18px;font-weight:700;color:var(--paper)}.room-links{display:flex;flex-wrap:wrap;gap:4px 30px;margin-bottom:14px}.room-links .text-button{width:auto;padding:14px 0 0}@media(max-width:760px){.room-choices{grid-template-columns:1fr}}@media(max-height:760px) and (min-width:761px){.room-panel{padding:20px 28px}.room-panel .eyebrow{margin-bottom:10px}.room-panel h2{font-size:26px;margin-bottom:8px}.room-panel>p{margin:0 0 8px}.room-panel label{margin:8px 0}.room-choice{padding:14px 16px}.room-choice p{margin-bottom:8px}.room-choice .primary,.room-choice .secondary{padding:13px 18px}.code-field{margin-top:12px!important;padding-top:10px}.room-links .text-button{padding-top:8px}.room-links{margin-bottom:8px}}#roomForm button:disabled{opacity:.6;cursor:wait}

/* v0.13: player reports */
.roster-row .report-button{width:auto;font-size:12px;padding:2px 0;color:var(--muted)}.roster-row .report-button:hover,.roster-row .report-button:focus-visible{color:var(--orange)}#reportOverlay{z-index:30}#reportStatus{color:var(--cyan);min-height:1.4em}

/* v0.17: readable match HUD, kill feed, death card and match menu */
#roomInfo{font-size:14px;letter-spacing:.5px}#multiHud #ping{margin-top:5px;color:#c9d8d8}
.hud-right{display:flex;flex-direction:column;align-items:flex-end}
.kill-row{display:flex;gap:10px;align-items:baseline;margin-top:6px;padding:5px 10px;background:#10222ad9;border-right:3px solid transparent;font:13px monospace}.kill-row b{font-weight:400}.kill-row span{font-size:11px;letter-spacing:1px;color:#a9bcc0}.kill-row.mine{border-right-color:var(--cyan)}.kill-row.mine b:first-child{color:var(--cyan)}.kill-row.dead{border-right-color:var(--orange)}.kill-row.dead b:last-child{color:var(--orange)}
#multiHud .vitals small,#multiHud .ammo small{font-size:12px}
.hud-status{display:flex;flex-direction:column;align-items:center;gap:8px}#desktopHelp,.status-chips small{background:#10222ac7;padding:5px 12px;font-size:12px;letter-spacing:1px}#desktopHelp{color:#d9eae4}.status-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}.status-chips small:empty{display:none}#multiGrenade{color:#d9eae4}
.capture-panel{width:min(600px,calc(100vw - 40px))}.capture-panel .controls{margin:24px 0 6px;padding-top:20px;border-top:1px solid #ffffff22}.touch-room #captureControls{display:none}
.touch-room .kill-row{font-size:11px;padding:3px 8px}.touch-room #multiHud .vitals small,.touch-room #multiHud .ammo small{font-size:10px}.touch-room .status-chips small{font-size:10px;padding:3px 8px}.touch-room .hud-plate{padding:6px 9px}

/* v0.19: room page on phones (touch screen at most 540px tall). Everything fits a 664x390 screen without scrolling. */
.touch-actions button,#roomStick{opacity:var(--touch-opacity,1)}#roomTouch.dead .touch-actions button,#roomTouch.dead #roomStick{opacity:.18}
@media(pointer:coarse) and (max-height:540px){
 #roomMenu{padding:6px}.room-panel{padding:10px 16px;width:min(700px,calc(100vw - 16px))}.room-panel .eyebrow,#roomIntro{display:none}
 .room-panel h2{font-size:20px;margin:0 0 2px}.room-panel>p{margin:0 0 2px;font-size:12px}.room-panel label{margin:2px 0;font-size:12px}.room-panel input{width:200px;padding:7px 9px;font-size:13px}
 .room-choices{grid-template-columns:1fr;gap:6px}.room-choice{padding:7px 12px}.room-choice p{margin:0 0 2px;font-size:12px;line-height:1.35}.private-heading{font-size:12px;margin:0 0 4px}
 .room-choice:first-child{display:grid;grid-template-columns:1fr 1fr;column-gap:14px;align-items:center}.room-choice:first-child>h3,.room-choice:first-child>p{grid-column:1/-1}
 .room-choice:first-child>label{grid-row:3;margin:2px 0!important;padding-top:0;border-top:0}.room-choice:first-child>button{grid-row:4;margin-top:4px}
 .room-choice.quick-play{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:14px;align-items:center}.quick-play>h3{grid-column:1;grid-row:1}.quick-play>p{grid-column:1;grid-row:2;margin:0}.quick-play>button{grid-column:2;grid-row:1/3;width:auto;margin:0;white-space:nowrap}
 .room-links .text-button{padding-top:4px}.room-links{margin-bottom:1px}.room-panel>small{font-size:10px;line-height:1.4}#roomError:empty,#careerReward:empty{display:none}#roomError{margin:6px 0 0;font-size:12px}
 .room-code{display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:14px;padding:8px 12px}.room-code>small{grid-column:1;grid-row:1}.room-code>b{grid-column:1;grid-row:2;font-size:22px;letter-spacing:3px;margin:2px 0 0}
 .room-code .code-actions{grid-column:2;grid-row:1/3;justify-content:flex-end}.room-code .secondary{padding:8px 12px;font-size:11px}.room-code p{display:none}
 #roster{margin-top:4px}.roster-row{padding:6px 0;font-size:12px}.roster-row .report-button{font-size:11px}#matchResult{margin:0 0 6px;padding:7px 12px;font-size:14px}#hostHint{font-size:12px;margin:6px 0 0}.room-panel .primary{margin-top:8px}
 .capture-panel{width:min(620px,calc(100vw - 16px))}.capture-panel .primary{margin-top:0}.capture-panel .touch-settings{margin-top:8px}
 /* match HUD and controls */
 .touch-room #multiHud{padding:8px 12px}.touch-room .hud-plate{padding:4px 8px}#roomInfo{font-size:12px}#multiHud #ping{margin-top:2px;font-size:10px}
 .touch-room .matchclock{padding:4px 10px}.touch-room .matchclock strong{font-size:18px}.touch-room .hud-right{margin-right:74px}.touch-room #liveScore{font-size:11px;line-height:1.5;min-width:130px}.scoreboard>small{font-size:10px;margin-bottom:2px}
 .touch-room .kill-row{font-size:10px;padding:2px 6px;margin-top:4px}.kill-row span{font-size:10px}
 #touchMenu{top:8px;right:10px;min-height:34px;padding:6px 12px;font-size:11px}
 .touch-actions{grid-template-columns:repeat(4,52px);gap:6px;right:12px;bottom:10px}.touch-actions button{min-height:42px;font-size:11px;padding:3px}.touch-actions .room-fire{min-height:90px}
 #roomStick{left:14px;bottom:14px;width:104px;height:104px}#roomThumb{width:40px;height:40px}
 .touch-room #multiHud .hud-bottom{left:12px;right:12px;bottom:150px}.touch-room .vitals strong,.touch-room .ammo strong{font-size:22px}.touch-room #multiHud .hud-bottom small{font-size:10px}
 .touch-room #multiDeath{top:112px}.touch-room #multiNotice{top:24%;font-size:12px}.touch-room #multiNotice:not(:empty){padding:5px 10px}
}

/* v0.20: name and weapon choice on one row; icon buttons */
.player-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px 22px;margin-top:6px}.player-row label{margin:8px 0;gap:10px;justify-content:flex-start}.player-row .name-field{margin-top:8px!important;gap:10px!important}.player-row select{min-width:128px}.player-row input{max-width:none}
.touch-actions button{display:grid;place-items:center;padding:0}
@media(pointer:coarse) and (max-height:540px){.player-row{gap:2px 12px;margin-top:2px}.player-row label{margin:2px 0;gap:6px;font-size:11px}.player-row .name-field{margin-top:2px!important;gap:6px!important}.room-panel .player-row input{width:132px}.player-row select{min-width:0;max-width:128px;padding:5px 4px;font-size:12px}#touchMenu{display:grid;place-items:center;width:44px;padding:0}.touch-room .hud-right{margin-right:58px}}
/* The shortest phones (about 320px tall): drop the explanatory lines so both ways to play stay on screen. */
@media(pointer:coarse) and (max-height:340px){.room-choice p{display:none}.room-panel h2{font-size:18px}.room-choice{padding:6px 12px}}

/* v0.22: scope zoom button, left of the control grid */
#multiScope{margin-top:4px;color:#d5e3e2}
.room-scope{position:absolute;right:calc(max(16px,env(safe-area-inset-right)) + 4*60px + 4*7px);bottom:max(18px,env(safe-area-inset-bottom));width:60px;min-height:48px;border:1px solid #b0eee888;border-radius:8px;background:#102b36cc;color:#edf1e9;font:bold 13px Arial,Helvetica,sans-serif;pointer-events:auto;touch-action:none;opacity:var(--touch-opacity,1)}#roomTouch.dead .room-scope{opacity:.18}
@media(pointer:coarse) and (max-height:540px){.room-scope{right:244px;bottom:10px;width:52px;min-height:42px}}
@media(max-width:600px) and (orientation:portrait){.room-scope{right:auto;left:14px;bottom:150px;width:58px}}