:root {
  --bg: #07101b;
  --panel: rgba(8, 17, 30, .88);
  --line: rgba(255,255,255,.14);
  --text: #f6fbff;
  --muted: #93a7ba;
  --aqua: #39e6ff;
  --pink: #ff4ca8;
  --lime: #b9ff55;
  --danger: #ff3b51;
  --gold: #ffb23e;
}
* { box-sizing: border-box; }
html, body { margin: 0; width: 100%; height: 100%; overflow: hidden; background: var(--bg); color: var(--text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif; touch-action: none; }
button, input { font: inherit; }
button { cursor: pointer; }
#game, #game canvas { position: fixed; inset: 0; width: 100%; height: 100%; display: block; }
.hidden { display: none !important; }
.panel, .hud-panel { backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); background: var(--panel); border: 1px solid var(--line); box-shadow: 0 20px 70px rgba(0,0,0,.38); }
.start-card { position: fixed; z-index: 30; left: 50%; top: 50%; transform: translate(-50%,-50%); width: min(520px, calc(100vw - 32px)); padding: 34px; border-radius: 22px; }
.eyebrow { color: var(--aqua); letter-spacing: .18em; font-size: 11px; font-weight: 900; }
h1 { margin: 12px 0 10px; font-size: clamp(48px, 8vw, 82px); line-height: .78; letter-spacing: -.06em; }
h1 span { color: var(--pink); }
.lede { color: #c9d7e4; max-width: 42ch; margin: 18px 0 26px; line-height: 1.5; }
label { display: grid; gap: 8px; color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .12em; }
input { width: 100%; background: rgba(255,255,255,.065); color: white; border: 1px solid var(--line); border-radius: 10px; padding: 13px 14px; outline: none; }
input:focus { border-color: var(--aqua); box-shadow: 0 0 0 3px rgba(57,230,255,.08); }
.start-actions { display: grid; gap: 10px; margin-top: 12px; }
.join-row { display: grid; grid-template-columns: 1fr 120px; gap: 10px; }
button { border: 1px solid var(--line); background: rgba(255,255,255,.08); color: white; border-radius: 10px; padding: 12px 14px; font-weight: 850; letter-spacing: .04em; }
button:hover:not(:disabled) { background: rgba(255,255,255,.14); }
button:disabled { opacity: .35; cursor: default; }
button.primary { background: linear-gradient(135deg, #10b9dd, #3177ff); border-color: transparent; }
.status { margin-top: 14px; min-height: 22px; color: var(--lime); font-size: 13px; }
.status.error { color: #ff8e9d; }
.fineprint { margin-top: 14px; color: #6f8498; font-size: 11px; line-height: 1.45; }
#hud { position: fixed; z-index: 10; top: 16px; left: 16px; right: 16px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: start; pointer-events: none; }
.brand { font-weight: 950; letter-spacing: -.03em; font-size: 20px; text-shadow: 0 2px 12px #000; }
.brand span { color: var(--pink); }
.phase-card { justify-self: center; text-align: center; padding: 9px 20px; border: 1px solid var(--line); background: rgba(4,10,18,.66); border-radius: 13px; min-width: 180px; }
.phase { font-size: 12px; font-weight: 950; letter-spacing: .16em; color: var(--aqua); }
.timer { font-size: 26px; font-weight: 900; font-variant-numeric: tabular-nums; }
.room-card { justify-self: end; pointer-events: auto; color: #91a5b7; font-size: 11px; letter-spacing: .12em; font-weight: 900; }
.room-card strong { color: white; font-size: 14px; margin-left: 5px; }
.tiny { padding: 6px 8px; font-size: 9px; margin-left: 5px; }
.hud-panel { position: fixed; z-index: 10; top: 92px; left: 16px; width: 242px; padding: 15px; border-radius: 14px; pointer-events: auto; }
.hud-panel.right { left: auto; right: 16px; width: 205px; }
.hud-title { color: #8499ac; font-size: 10px; letter-spacing: .16em; font-weight: 950; margin-bottom: 8px; }
.separator { height: 1px; background: var(--line); margin: 13px 0; }
.meter-label { display: flex; justify-content: space-between; font-size: 11px; font-weight: 900; }
.meter-label span { color: var(--pink); }
.meter { height: 7px; background: rgba(255,255,255,.08); border-radius: 999px; overflow: hidden; margin: 8px 0 10px; }
#chaosFill { height: 100%; width: 0%; background: linear-gradient(90deg, var(--aqua), var(--pink)); transition: width .25s; }
.role { color: #d9e6ef; font-size: 12px; line-height: 1.4; }
.hide-status { margin-top: 9px; color: #90f0bd; font-size: 10px; font-weight: 900; letter-spacing: .07em; }
.monster-vision-status { margin-top: 8px; color:#ff607e; font-size:10px; font-weight:950; letter-spacing:.07em; text-shadow:0 0 12px rgba(255,23,63,.45); }
.monster-vision-meter { height:7px; margin:5px 0 8px; border-radius:999px; overflow:hidden; background:rgba(255,35,74,.12); border:1px solid rgba(255,67,100,.25); }
#monsterVisionFill { height:100%; width:0%; background:linear-gradient(90deg,#731126,#ff234b,#ff8aa0); box-shadow:0 0 10px rgba(255,35,75,.7); transition:width .12s linear; }
.player { display: grid; grid-template-columns: 10px 1fr auto; align-items: center; gap: 7px; font-size: 11px; padding: 5px 0; }
.player .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--aqua); box-shadow: 0 0 9px currentColor; }
.player .dot.bot-dot { background: #90f0bd; }
.player .dead { color: #708292; text-decoration: line-through; }
.player .score { color: #92a7b9; font-variant-numeric: tabular-nums; }
.wide { width: 100%; padding: 9px 10px; margin-bottom: 7px; font-size: 10px; }
.host-gap { margin-top: 10px; }
.small-status { font-size: 11px; color: #8fa4b6; line-height: 1.35; }
#crosshair { position: fixed; z-index: 8; left: 50%; top: 50%; width: 20px; height: 20px; transform: translate(-50%,-50%); pointer-events: none; }
#crosshair i { position: absolute; background: rgba(255,255,255,.88); box-shadow: 0 0 6px rgba(0,0,0,.8); }
#crosshair i:first-child { width: 14px; height: 2px; left: 3px; top: 9px; }
#crosshair i:last-child { width: 2px; height: 14px; left: 9px; top: 3px; }
#toast { position: fixed; z-index: 30; left: 50%; bottom: 70px; transform: translateX(-50%); background: rgba(0,0,0,.7); border: 1px solid var(--line); border-radius: 999px; padding: 9px 14px; opacity: 0; transition: opacity .2s; font-size: 12px; pointer-events: none; }
#toast.show { opacity: 1; }
#pointerHint { position: fixed; z-index: 12; bottom: 18px; left: 50%; transform: translateX(-50%); padding: 8px 12px; border-radius: 999px; background: rgba(0,0,0,.65); color: #b8c8d5; font-size: 10px; letter-spacing: .08em; font-weight: 800; white-space: nowrap; }
#dangerBanner { position: fixed; z-index: 40; inset: 0; display: grid; place-items: center; pointer-events: none; font-size: clamp(42px, 9vw, 110px); font-weight: 1000; letter-spacing: -.05em; color: var(--danger); text-shadow: 0 0 30px rgba(255,0,30,.55); background: radial-gradient(circle at center, rgba(60,0,8,.05), rgba(0,0,0,.65)); animation: dangerPulse .85s infinite alternate; }
@keyframes dangerPulse { from { opacity:.55; } to { opacity:1; } }
#audioMount { position:fixed; width:1px; height:1px; left:-10px; bottom:-10px; opacity:0; overflow:hidden; pointer-events:none; }
#audioMount audio { width:1px; height:1px; }
body.blackout .phase { color: var(--danger); }
body.blackout .brand span { color: var(--danger); }
.tag-status { color: #ffca67; font-size: 13px; font-weight: 950; letter-spacing: .04em; margin-bottom: 5px; }
.player .dot.it-dot { background: var(--gold); box-shadow: 0 0 12px var(--gold); }
body.tag-it::after { content:''; position:fixed; z-index:7; inset:7px; border:3px solid rgba(255,178,62,.58); border-radius:16px; pointer-events:none; box-shadow:inset 0 0 50px rgba(255,178,62,.12); }
body.tag-it::before { content:"YOU'RE IT"; position:fixed; z-index:38; left:50%; top:102px; transform:translateX(-50%); pointer-events:none; padding:7px 18px; border:1px solid rgba(255,204,112,.78); border-radius:999px; background:rgba(64,34,5,.82); color:#ffd174; box-shadow:0 8px 24px rgba(0,0,0,.32),0 0 24px rgba(255,178,62,.18); font-size:13px; font-weight:1000; letter-spacing:.12em; text-shadow:0 2px 8px #000; }
#dangerBanner.tag-flash { color: var(--gold); background: radial-gradient(circle at center, rgba(255,178,62,.10), rgba(0,0,0,.15)); animation: none; font-size: clamp(36px, 7vw, 90px); }
#hideOverlay { position: fixed; z-index: 9; inset: 0; pointer-events: none; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; padding-bottom: 100px; background: radial-gradient(circle at center, transparent 48%, rgba(10,70,48,.26)); box-shadow: inset 0 0 85px rgba(87,255,183,.18); }
#hideOverlay span { color: #baffdc; background: rgba(4,28,20,.72); border: 1px solid rgba(145,255,205,.35); padding: 8px 15px; border-radius: 999px; font-size: 12px; font-weight: 950; letter-spacing: .12em; }
#hideOverlay small { margin-top: 7px; color: #b8d7ca; text-shadow: 0 2px 5px #000; }

.mobile-controls { display: none; }
.move-pad, .look-pad, .mobile-buttons { touch-action: none; user-select: none; -webkit-user-select: none; }

@media (max-width: 760px) {
  .start-card { padding: 24px; }
  .hud-panel { top: 100px; left: 8px; width: 164px; padding: 10px; max-height: 40vh; overflow: hidden; }
  .hud-panel.right { top: 100px; right: 8px; width: 136px; }
  .hud-panel.right .separator, .hud-panel.right .small-status { display: none; }
  #hud { left: 8px; right: 8px; grid-template-columns: 1fr auto; }
  .brand { font-size: 15px; }
  .phase-card { grid-row: 2; grid-column: 1 / -1; margin-top: 6px; padding: 6px 15px; min-width: 150px; }
  .timer { font-size: 20px; }
  .room-card { font-size: 8px; }
  #pointerHint { display: none !important; }
}

body.touch-mode .mobile-controls:not(.hidden) { display: block; position: fixed; inset: 0; z-index: 14; pointer-events: none; }
body.touch-mode #crosshair { opacity: .7; }
body.touch-mode .move-pad { position: absolute; pointer-events: auto; left: max(18px, env(safe-area-inset-left)); bottom: max(22px, env(safe-area-inset-bottom)); width: 128px; height: 128px; border-radius: 50%; border: 2px solid rgba(255,255,255,.22); background: rgba(5,16,27,.27); box-shadow: inset 0 0 35px rgba(57,230,255,.08); }
body.touch-mode .move-stick { position: absolute; left: 50%; top: 50%; width: 54px; height: 54px; margin: -27px; border-radius: 50%; background: rgba(57,230,255,.34); border: 2px solid rgba(210,250,255,.55); box-shadow: 0 0 22px rgba(57,230,255,.22); transform: translate(0,0); }
body.touch-mode .look-pad { position: absolute; pointer-events: auto; right: 0; bottom: 0; width: 58vw; height: 72vh; background: transparent; }
body.touch-mode .mobile-buttons { position: absolute; right: max(15px, env(safe-area-inset-right)); bottom: max(18px, env(safe-area-inset-bottom)); width: 210px; height: 180px; pointer-events: none; }
body.touch-mode .touch-btn { position: absolute; pointer-events: auto; width: 72px; height: 72px; border-radius: 50%; padding: 0; font-size: 10px; background: rgba(7,18,30,.55); backdrop-filter: blur(9px); border: 2px solid rgba(255,255,255,.25); box-shadow: 0 8px 20px rgba(0,0,0,.28); }
body.touch-mode .touch-btn:active, body.touch-mode .touch-btn.held { transform: scale(.93); background: rgba(57,230,255,.28); }
body.touch-mode .touch-btn.hide.active { background: rgba(74,224,154,.34); border-color: rgba(145,255,205,.92); box-shadow: 0 0 0 2px rgba(145,255,205,.15) inset, 0 0 18px rgba(64,232,153,.18); }
body.touch-mode .touch-btn.throw { right: 0; bottom: 53px; border-color: rgba(57,230,255,.65); }
body.touch-mode .touch-btn.jump { right: 76px; bottom: 0; }
body.touch-mode .touch-btn.sprint { right: 76px; bottom: 80px; width: 64px; height: 64px; }
body.touch-mode .touch-btn.hide { right: 0; bottom: 132px; width: 60px; height: 60px; border-color: rgba(144,240,189,.65); }
@media (orientation: landscape) and (max-height: 540px) {
  body.touch-mode .move-pad { width: 108px; height: 108px; }
  body.touch-mode .mobile-buttons { transform: scale(.86); transform-origin: right bottom; }
  .hud-panel { max-height: 32vh; }
}

/* BUILD 0.5 — Haunted Midway additions */
.start-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.room-help { margin-top:10px; color:#8599ac; font-size:11px; line-height:1.4; }
.room-help strong { color:#fff; }
.room-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:12px; }
.ticket-status { margin-top:9px; color:#ffd86a; font-size:12px; font-weight:950; letter-spacing:.06em; }
.ability-status { margin-top:5px; color:#c8a7ff; font-size:10px; font-weight:900; letter-spacing:.07em; line-height:1.35; }
.interaction { position:fixed; z-index:20; left:50%; bottom:118px; transform:translateX(-50%); padding:9px 14px; border:1px solid rgba(255,216,106,.5); border-radius:999px; background:rgba(10,7,18,.78); color:#ffe59a; box-shadow:0 0 24px rgba(255,186,58,.16); font-size:11px; font-weight:950; letter-spacing:.1em; pointer-events:none; white-space:nowrap; }
.room-card strong { font-size:18px; letter-spacing:.08em; color:#fff4b2; text-shadow:0 0 15px rgba(255,218,91,.22); }
body.blackout { --panel: rgba(6,4,10,.82); }
body.blackout #hideOverlay span { color:#e9d4ff; border-color:rgba(195,128,255,.45); background:rgba(25,5,35,.78); }
body.blackout #hideOverlay { background:radial-gradient(circle at center, transparent 47%, rgba(42,4,52,.27)); box-shadow:inset 0 0 95px rgba(165,58,255,.13); }

body.touch-mode .touch-btn.use { right:145px; bottom:72px; width:61px; height:61px; border-color:rgba(255,216,106,.7); }
body.touch-mode .touch-btn.ability { right:144px; bottom:138px; width:61px; height:61px; border-color:rgba(196,139,255,.72); }
body.touch-mode .touch-btn.detach { right:144px; bottom:12px; width:66px; height:48px; border-radius:16px; border-color:rgba(255,159,84,.82); background:rgba(31,16,8,.70); color:#ffe1c2; font-size:8.5px; letter-spacing:.05em; box-shadow:0 8px 20px rgba(0,0,0,.28),0 0 18px rgba(255,139,60,.12); }

@media (max-width:760px) {
  .start-grid { grid-template-columns:1fr; }
  .start-card { max-height:94vh; overflow:auto; }
  .room-card strong { font-size:18px; }
  .interaction { bottom:205px; max-width:80vw; text-align:center; }
  .ticket-status, .ability-status { font-size:9px; }
}
@media (orientation:landscape) and (max-height:540px) {
  .start-card { top:50%; padding:16px 20px; width:min(720px,calc(100vw - 28px)); }
  .start-card h1 { font-size:38px; margin:8px 0; }
  .start-card .lede { margin:8px 0 12px; }
  .room-help, .fineprint { display:none; }
  .start-grid { grid-template-columns:1fr 1fr; }
}
#roomCodeInput { text-transform: uppercase; font-size: 19px; font-weight: 950; letter-spacing: .10em; }

/* BUILD 0.6 — Carnival Lab */
.creator-card { position:fixed; z-index:60; left:50%; top:50%; transform:translate(-50%,-50%); width:min(760px,calc(100vw - 24px)); max-height:94vh; overflow:auto; padding:22px; border-radius:20px; }
.creator-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.creator-head h2 { margin:6px 0 14px; font-size:26px; }
.creator-layout { display:grid; grid-template-columns:280px 1fr; gap:20px; align-items:start; }
#avatarPreview { width:100%; height:auto; border-radius:16px; border:1px solid var(--line); background:radial-gradient(circle at 50% 35%,#29344a,#0b0c15 72%); }
.creator-controls { display:grid; gap:10px; }
.creator-controls label { grid-template-columns:112px 1fr; align-items:center; letter-spacing:.06em; }
.creator-controls input[type="range"] { padding:0; accent-color:var(--pink); }
.creator-controls select { background:rgba(255,255,255,.07); color:white; border:1px solid var(--line); border-radius:9px; padding:9px; }
.color-row { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.color-row label { display:grid; grid-template-columns:1fr; }
.color-row input[type="color"] { padding:3px; height:38px; }
.creator-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.avatar-entry { display:grid; grid-template-columns:1fr auto; align-items:center; gap:10px; margin-top:12px; }
.avatar-summary { color:#9cb0c2; font-size:11px; }
.secondary { background:rgba(255,255,255,.055); }
.danger-btn { border-color:rgba(255,80,96,.42); color:#ff9da8; }
.control-guide { position:fixed; z-index:18; left:50%; bottom:20px; transform:translateX(-50%); max-width:min(850px,92vw); padding:8px 12px; border:1px solid rgba(255,255,255,.13); border-radius:999px; background:rgba(5,10,18,.72); backdrop-filter:blur(10px); color:#c8d7e2; font-size:10px; font-weight:850; letter-spacing:.045em; text-align:center; pointer-events:none; }
.blind-overlay { position:fixed; z-index:50; inset:0; display:grid; place-items:center; pointer-events:none; background:rgba(255,255,255,.88); animation:flashBlind .22s alternate infinite; }
.blind-overlay span { color:#111; font-size:clamp(36px,9vw,90px); font-weight:1000; letter-spacing:.08em; }
@keyframes flashBlind { from{opacity:.7} to{opacity:1} }

body.touch-mode .look-pad { z-index:1; }
body.touch-mode .move-pad, body.touch-mode .mobile-buttons { z-index:3; }
body.touch-mode .mobile-menu-toggle { position:absolute; z-index:8; pointer-events:auto; top:max(10px,env(safe-area-inset-top)); right:max(10px,env(safe-area-inset-right)); width:52px; height:52px; padding:0; border-radius:50%; background:rgba(5,13,24,.78); backdrop-filter:blur(12px); border:2px solid rgba(255,255,255,.28); font-size:22px; }
body.touch-mode .mobile-quick-menu { position:absolute; z-index:9; pointer-events:auto; top:70px; right:max(8px,env(safe-area-inset-right)); width:150px; display:grid; grid-template-columns:1fr 1fr; gap:6px; padding:8px; border:1px solid rgba(255,255,255,.18); border-radius:14px; background:rgba(4,12,22,.92); backdrop-filter:blur(15px); box-shadow:0 16px 40px rgba(0,0,0,.4); }
body.touch-mode .mobile-quick-menu.hidden { display:none !important; }
body.touch-mode .mobile-quick-menu button { padding:9px 5px; font-size:9px; min-height:40px; }
body.touch-mode .mobile-quick-menu .danger-btn { grid-column:1/-1; }
body.touch-mode .control-guide { bottom:205px; font-size:9px; max-width:70vw; }

@media (max-width:760px) {
  .creator-card { width:calc(100vw - 14px); padding:14px; }
  .creator-layout { grid-template-columns:150px 1fr; gap:10px; }
  .creator-head h2 { font-size:19px; }
  .creator-controls { gap:6px; }
  .creator-controls label { grid-template-columns:78px 1fr; font-size:8px; }
  .color-row { grid-template-columns:1fr; }
  .avatar-entry { grid-template-columns:1fr; }
  .avatar-summary { display:none; }
  .control-guide { display:none !important; }
  .hud-panel.right { pointer-events:none; opacity:.38; }
  .hud-panel.right button { pointer-events:none; }
}
@media (orientation:landscape) and (max-height:540px) {
  .creator-card { width:min(820px,calc(100vw - 16px)); max-height:96vh; padding:10px 14px; }
  .creator-layout { grid-template-columns:180px 1fr; }
  .creator-head h2 { font-size:18px; margin:2px 0 6px; }
  .creator-controls { grid-template-columns:1fr 1fr; gap:5px 10px; }
  .creator-controls .color-row,.creator-controls .creator-actions { grid-column:1/-1; }
}
body.touch-mode .hud-panel.right { display:none !important; }


/* BUILD 0.7.1 — startup hotfix / movement / physics / chase */
.hud-panel { max-height: calc(100vh - 190px); overflow:auto; scrollbar-width:thin; }
.interaction { bottom:76px; }
.control-guide { bottom:18px; white-space:normal; width:max-content; }
.mini-game-hud { position:fixed; z-index:44; left:50%; top:96px; transform:translateX(-50%); width:min(470px,calc(100vw - 24px)); padding:14px 16px; border:1px solid rgba(255,218,91,.38); border-radius:17px; background:rgba(7,10,18,.9); backdrop-filter:blur(16px); box-shadow:0 18px 55px rgba(0,0,0,.42),0 0 28px rgba(255,204,75,.09); pointer-events:auto; }
.mini-kicker { color:#ffd66b; letter-spacing:.18em; font-size:8px; font-weight:950; }
.mini-title { margin-top:3px; font-size:20px; font-weight:1000; letter-spacing:.04em; }
.mini-instruction { margin-top:4px; color:#c7d3dd; font-size:11px; line-height:1.4; }
.mini-row { display:flex; justify-content:space-between; gap:12px; margin-top:9px; color:#fff2bd; font-size:10px; font-weight:900; }
.mini-power { position:relative; height:13px; margin-top:8px; overflow:hidden; border-radius:999px; border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.06); }
.mini-power > div { width:0%; height:100%; background:linear-gradient(90deg,#44e7ff,#d9ff62,#ffb544,#ff506e); transition:width .03s linear; }
.mini-power > i { position:absolute; left:72%; top:-3px; bottom:-3px; width:14%; border-left:2px solid rgba(255,255,255,.7); border-right:2px solid rgba(255,255,255,.7); background:rgba(255,255,255,.08); }
.mini-timing { position:relative; height:18px; margin-top:9px; border-radius:999px; border:1px solid rgba(255,255,255,.18); background:linear-gradient(90deg,rgba(255,78,93,.18),rgba(255,225,94,.16),rgba(94,255,160,.2),rgba(255,225,94,.16),rgba(255,78,93,.18)); overflow:hidden; }
.mini-timing i { position:absolute; left:43%; width:14%; top:0; bottom:0; border-left:2px solid #b8ffca; border-right:2px solid #b8ffca; background:rgba(129,255,173,.11); }
.mini-timing b { position:absolute; top:1px; width:4px; height:14px; border-radius:3px; background:white; box-shadow:0 0 10px white; transform:translateX(-50%); }
#miniGameExit { margin-top:9px; width:100%; padding:7px; font-size:9px; }
body.minigame #interactionPrompt { display:none !important; }
body.minigame #controlGuide { color:#fff2bd; border-color:rgba(255,218,91,.35); }
body.minigame #crosshair { opacity:1; }
.gear-flash { animation:gearFlash .16s ease-out; }
@keyframes gearFlash { 0%{filter:brightness(2.5)} 100%{filter:none} }
@media (max-width:760px){
  .hud-panel { max-height:34vh; }
  .mini-game-hud { top:max(72px,env(safe-area-inset-top)); width:min(420px,calc(100vw - 110px)); left:50%; padding:9px 11px; }
  .mini-title{font-size:15px}.mini-instruction{font-size:9px}.mini-row{font-size:8px}.mini-game-hud #miniGameExit{font-size:8px;padding:5px}
  .interaction { bottom:194px; }
}
@media (orientation:landscape) and (max-height:540px){
  .mini-game-hud{top:8px; width:390px; padding:7px 10px}.mini-instruction{display:none}.mini-power,.mini-timing{margin-top:4px;height:10px}.mini-row{margin-top:4px}
  .hud-panel{max-height:calc(100vh - 150px)}
}

/* BUILD 0.8 — park expansion / responsive menu / richer creator */
select, select option { background:#151c28; color:#f6fbff; }
select option:checked { background:#295b9b; color:#fff; }
.score-status { margin-top:9px; color:#8fffd7; font-size:12px; font-weight:950; letter-spacing:.055em; }
.egg-status { margin-top:4px; color:#e4c8ff; font-size:10px; font-weight:900; letter-spacing:.05em; }
.menu-button { border-color:rgba(57,230,255,.35); color:#dffbff; }
.settings-drawer { z-index:55; width:285px !important; max-height:calc(100vh - 108px) !important; overflow:auto !important; box-shadow:0 24px 70px rgba(0,0,0,.55); }
.settings-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.settings-head h2 { margin:4px 0 8px; }
.settings-section { display:grid; gap:5px; }
.volume-row { grid-template-columns:1fr; gap:4px; letter-spacing:.05em; margin:2px 0 6px; }
.volume-row input[type="range"] { padding:0; accent-color:var(--aqua); }
.controls-card { position:fixed; z-index:70; left:50%; top:50%; transform:translate(-50%,-50%); width:min(650px,calc(100vw - 24px)); padding:20px; border-radius:18px; }
.controls-card p { margin:14px 0 0; color:#9bb0c1; font-size:11px; line-height:1.5; }
.controls-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.controls-grid > div { display:grid; grid-template-columns:120px 1fr; gap:10px; align-items:center; padding:9px 10px; border:1px solid rgba(255,255,255,.09); background:rgba(255,255,255,.035); border-radius:10px; }
.controls-grid strong { color:#dffbff; font-size:10px; letter-spacing:.08em; }
.controls-grid span { color:#a9bbca; font-size:11px; }
.shape-lab { border:1px solid rgba(57,230,255,.18); border-radius:12px; padding:8px 9px; background:rgba(57,230,255,.025); }
.shape-lab summary { cursor:pointer; color:#8eeeff; font-size:10px; font-weight:950; letter-spacing:.11em; }
.shape-grid { display:grid; grid-template-columns:1fr 1fr; gap:7px 10px; margin-top:8px; }
.shape-grid label { grid-template-columns:72px 1fr; font-size:8px; gap:6px; }
.shape-help { color:#7891a5; font-size:9px; line-height:1.4; margin-top:7px; }
#avatarPreview { cursor:grab; touch-action:none; }
#avatarPreview:active { cursor:grabbing; }
.control-guide { bottom:14px; max-width:min(720px,70vw); width:auto; padding:7px 12px; line-height:1.25; white-space:normal; }
#pointerHint { display:none !important; }
.interaction { bottom:54px; max-width:min(640px,78vw); overflow:hidden; text-overflow:ellipsis; }
.hud-panel.right.hidden { display:none !important; }
body.menu-open #crosshair { opacity:.25; }
body.menu-open .look-pad { pointer-events:none !important; }
body.menu-open .mobile-buttons { opacity:.3; pointer-events:none !important; }
body.menu-open .mobile-buttons button { pointer-events:none !important; }

@media (max-width:760px) {
  .settings-drawer { top:max(64px,env(safe-area-inset-top)) !important; right:7px !important; left:auto !important; width:min(310px,calc(100vw - 14px)) !important; max-height:calc(100vh - 75px) !important; opacity:1 !important; pointer-events:auto !important; }
  .controls-card { width:calc(100vw - 14px); max-height:88vh; overflow:auto; padding:14px; }
  .controls-grid { grid-template-columns:1fr; }
  .controls-grid > div { grid-template-columns:105px 1fr; }
  .creator-layout { grid-template-columns:140px 1fr; }
  .shape-grid { grid-template-columns:1fr; }
  .shape-grid label { grid-template-columns:60px 1fr; }
  .creator-controls { max-height:72vh; overflow:auto; padding-right:3px; }
  .interaction { bottom:193px; max-width:64vw; font-size:9px; }
  .control-guide { display:none !important; }
  .room-card { display:flex; align-items:center; gap:4px; }
  .room-card strong { max-width:90px; overflow:hidden; text-overflow:ellipsis; }
}
@media (orientation:landscape) and (max-height:540px) {
  .settings-drawer { top:7px !important; max-height:calc(100vh - 14px) !important; }
  .creator-layout { grid-template-columns:180px 1fr; }
  .shape-lab { grid-column:1/-1; }
  .shape-grid { grid-template-columns:repeat(2,1fr); }
}

/* BUILD 0.8 final usability pass */
:root { color-scheme: dark; }
select, select option, select optgroup { background-color:#151c28 !important; color:#f6fbff !important; }
body.touch-mode .hud-panel.right.settings-drawer:not(.hidden) { display:block !important; opacity:1 !important; pointer-events:auto !important; }
.settings-drawer input[type="range"] { width:100%; }
#menuBtn { min-width:52px; }
.control-guide { text-shadow:0 1px 2px #000; background:rgba(4,9,16,.82); }
.interaction { bottom:72px; background:rgba(4,9,16,.9); box-shadow:0 0 0 1px rgba(102,255,223,.06),0 0 26px rgba(102,255,223,.12); }
.mini-game-hud { color:#f7fbff; }
.mini-game-hud button { color:#f7fbff; }
.creator-card select { color-scheme:dark; background:#151c28 !important; color:#f6fbff !important; }
.creator-card select option { background:#151c28 !important; color:#f6fbff !important; }
#scoreStatus { text-shadow:0 0 10px rgba(91,255,207,.18); }
@media (max-width:760px){
  #leftHud { width:min(200px,46vw); }
  .interaction { bottom:190px; left:50%; max-width:58vw; }
  .settings-drawer .settings-section button { min-height:42px; }
  .settings-drawer { font-size:11px; }
}


/* BUILD 0.8.1 - mobile input, collapsible HUD, fullscreen, Clay-style direct manipulation */
#game canvas { filter:saturate(1.08) contrast(1.025); }
.match-panel-head { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
.match-toggle { min-width:30px; padding:5px 7px; line-height:1; }
.match-compact { display:none; margin-top:3px; color:#9fdff0; font-size:8px; font-weight:900; letter-spacing:.06em; white-space:nowrap; }
#leftHud.collapsed .match-hud-body { display:none; }
#leftHud.collapsed .match-compact { display:block; }
#leftHud.collapsed { max-height:none; overflow:visible; }
.creator-preview-column { display:grid; gap:7px; align-content:start; }
.creator-sculpt-tools { display:grid; grid-template-columns:repeat(3,1fr); gap:5px; }
.creator-sculpt-tools.secondary-row { grid-template-columns:1fr 1fr; }
.creator-sculpt-tools button { padding:8px 6px; font-size:9px; }
.creator-sculpt-tools button.active { border-color:rgba(57,230,255,.78); background:rgba(57,230,255,.18); color:#e8fdff; box-shadow:0 0 0 1px rgba(57,230,255,.12) inset; }
.sculpt-hint { min-height:34px; color:#92aabd; font-size:9px; line-height:1.35; }
#avatarPreview.sculpt-pull { cursor:crosshair; }
#avatarPreview.sculpt-carve { cursor:cell; }
.settings-head { position:sticky; top:-1px; z-index:4; padding:4px 0 8px; background:linear-gradient(#0c1725 84%,rgba(12,23,37,0)); }
.settings-drawer { overscroll-behavior:contain; touch-action:pan-y; -webkit-overflow-scrolling:touch; }
.settings-drawer input[type="range"] { touch-action:pan-x; }
#fullscreenBtn, #fullscreenStartBtn { border-color:rgba(124,226,255,.36); }

@media (max-width:760px) {
  body.touch-mode #game canvas { filter:saturate(1.24) contrast(1.055) brightness(1.01); }
  #leftHud { width:min(196px,45vw); z-index:16; pointer-events:auto; }
  #leftHud.collapsed { width:auto !important; min-width:118px; padding:9px 10px; max-height:none !important; }
  #leftHud.collapsed .match-toggle { font-size:12px; }
  body.touch-mode .settings-drawer:not(.hidden),
  body.touch-mode .settings-drawer:not(.hidden) *,
  body.touch-mode .settings-drawer:not(.hidden) button,
  body.touch-mode .settings-drawer:not(.hidden) input,
  body.touch-mode .settings-drawer:not(.hidden) label { pointer-events:auto !important; }
  body.touch-mode .settings-drawer:not(.hidden) button { touch-action:manipulation; }
  body.touch-mode .settings-drawer { z-index:90 !important; top:max(58px,env(safe-area-inset-top)) !important; right:6px !important; width:min(340px,calc(100vw - 12px)) !important; max-height:calc(100dvh - 68px) !important; padding-bottom:max(16px,env(safe-area-inset-bottom)); }
  body.touch-mode.menu-open .mobile-menu-toggle { z-index:92; }
  body.touch-mode.menu-open .move-pad,
  body.touch-mode.menu-open .mobile-buttons,
  body.touch-mode.menu-open .look-pad { pointer-events:none !important; }
  .creator-layout { grid-template-columns:1fr !important; }
  .creator-preview-column { width:min(270px,76vw); justify-self:center; }
  .creator-controls { max-height:none !important; overflow:visible !important; }
  .creator-card { max-height:96dvh; overflow:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; }
  .creator-sculpt-tools button { min-height:38px; }
}


/* BUILD 0.8.4 - compact match HUD + sprint toggle + Monster Vision */
#leftHud.collapsed {
  top:72px;
  padding:7px 9px;
  background:rgba(8,17,30,.58);
  border-color:rgba(255,255,255,.11);
  box-shadow:0 10px 30px rgba(0,0,0,.22);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
#leftHud.collapsed .match-panel-head { align-items:center; gap:6px; }
#leftHud.collapsed .hud-title { display:none; }
#leftHud.collapsed .match-compact { margin:0; font-size:8px; }
#leftHud.collapsed .match-toggle { margin:0; padding:4px 6px; min-width:25px; opacity:.82; }
body.touch-mode .touch-btn.sprint.active,
body.touch-mode .touch-btn.sprint.held {
  transform:none;
  color:#eaffff;
  background:rgba(34,207,239,.34);
  border-color:rgba(77,238,255,.9);
  box-shadow:0 0 0 2px rgba(57,230,255,.12) inset,0 0 22px rgba(57,230,255,.28);
}
@media (max-width:760px) {
  #leftHud.collapsed {
    top:max(68px,calc(env(safe-area-inset-top) + 54px));
    left:8px;
    width:auto !important;
    min-width:0 !important;
    max-width:156px;
    padding:6px 8px;
    background:rgba(8,17,30,.52);
  }
  #leftHud.collapsed .match-compact { font-size:7.5px; }
  #leftHud.collapsed .match-toggle { font-size:10px; }
}

/* BUILD 0.8.5 - collaborative Replicator Build Lab */
.hidden-file-input { position:fixed; width:1px; height:1px; opacity:0; pointer-events:none; left:-10000px; top:-10000px; }
.build-lab-hud {
  position:fixed;
  z-index:46;
  left:50%;
  bottom:78px;
  transform:translateX(-50%);
  width:min(650px,calc(100vw - 30px));
  padding:10px 12px;
  border:1px solid rgba(91,246,255,.28);
  border-radius:14px;
  background:rgba(5,17,28,.86);
  box-shadow:0 18px 55px rgba(0,0,0,.42),0 0 30px rgba(70,226,255,.08);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  color:#effcff;
}
.build-lab-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.build-lab-head strong { display:block; margin-top:2px; font-size:12px; letter-spacing:.07em; color:#b8f8ff; }
.build-lab-body { margin-top:8px; display:grid; gap:7px; }
.build-lab-status { color:#a8c4d3; font-size:10px; line-height:1.35; min-height:14px; }
.build-lab-grid { display:grid; gap:5px; }
.build-lab-grid.primary-grid { grid-template-columns:1.25fr 1fr 1fr 1fr; }
.build-lab-grid.adjust-grid { grid-template-columns:repeat(4,1fr); }
.build-lab-grid.lab-admin-grid { grid-template-columns:1fr 1fr; }
.build-lab-grid button { min-height:31px; padding:6px 7px; font-size:8px; letter-spacing:.055em; }
.build-lab-grid button:disabled { opacity:.32; cursor:default; }
.build-lab-sliders { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px 12px; padding:2px 0; }
.build-lab-slider { display:grid; grid-template-columns:1fr auto; align-items:center; gap:4px 10px; min-width:0; color:#9ab5c5; font-size:8px; font-weight:900; letter-spacing:.055em; }
.build-lab-slider > span { min-width:0; }
.build-lab-slider b { color:#d4fbff; font:900 9px/1 ui-monospace,SFMono-Regular,Consolas,monospace; letter-spacing:0; }
.build-lab-slider input[type=range] { grid-column:1 / -1; width:100%; min-height:22px; accent-color:#59e9f6; cursor:pointer; }
.build-lab-slider input[type=range]:disabled { opacity:.30; cursor:default; }
.build-lab-size-slider { grid-column:1 / -1; grid-template-columns:1fr auto; padding-top:3px; border-top:1px solid rgba(92,219,240,.12); }
.build-lab-grid.lab-admin-grid { grid-template-columns:repeat(3,1fr); }
.build-lab-help { color:#6f899b; font-size:8.5px; line-height:1.35; }
.build-lab-hud.collapsed { width:auto; min-width:220px; padding:7px 9px; bottom:70px; background:rgba(5,17,28,.66); }
.build-lab-hud.collapsed .build-lab-body { display:none; }
.build-lab-hud.collapsed .build-lab-head strong { font-size:9px; }
body.menu-open .build-lab-hud { opacity:.28; pointer-events:none; }

@media (max-width:760px) {
  .build-lab-hud {
    bottom:max(184px,calc(env(safe-area-inset-bottom) + 174px));
    width:min(420px,calc(100vw - 18px));
    max-height:44dvh;
    overflow:auto;
    padding:8px 9px;
  }
  .build-lab-hud.collapsed {
    left:50%;
    bottom:max(176px,calc(env(safe-area-inset-bottom) + 166px));
    min-width:170px;
    max-width:64vw;
  }
  .build-lab-grid.primary-grid { grid-template-columns:1fr 1fr; }
  .build-lab-sliders { grid-template-columns:1fr; }
  .build-lab-size-slider { grid-column:1; }
  .build-lab-grid.lab-admin-grid { grid-template-columns:1fr 1fr; }
  .build-lab-grid button { min-height:36px; font-size:7.5px; touch-action:manipulation; }
  .build-lab-help { display:none; }
}
@media (orientation:landscape) and (max-height:540px) {
  .build-lab-hud { left:50%; bottom:10px; width:min(620px,68vw); max-height:52vh; }
  .build-lab-hud.collapsed { bottom:9px; }
}


/* BUILD 0.8.6 - Workaround kiosk + character preview camera pan */
.creator-sculpt-tools { grid-template-columns:repeat(4,1fr) !important; }
.creator-sculpt-tools.secondary-row { grid-template-columns:repeat(3,1fr) !important; }
#avatarPreview.sculpt-pan { cursor:move; }
.workaround-modal { position:fixed; z-index:105; inset:0; display:grid; place-items:center; padding:14px; background:rgba(0,5,12,.72); backdrop-filter:blur(7px); -webkit-backdrop-filter:blur(7px); pointer-events:auto; }
.workaround-shell { width:min(650px,calc(100vw - 22px)); max-height:min(720px,calc(100dvh - 22px)); overflow:auto; padding:16px; border:1px solid rgba(63,222,255,.42); border-radius:16px; background:linear-gradient(180deg,rgba(8,29,47,.98),rgba(5,12,22,.98)); box-shadow:0 26px 90px rgba(0,0,0,.7),0 0 42px rgba(50,215,255,.10); }
.workaround-topbar { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; }
.workaround-topbar h2 { margin:3px 0 0; font-size:28px; letter-spacing:.04em; }
.workaround-topbar small { color:#82a7b9; font-weight:800; }
.workaround-log { min-height:190px; margin:14px 0; padding:14px; white-space:pre-wrap; overflow:auto; border:1px solid rgba(65,224,255,.25); border-radius:10px; background:#020a10; color:#69efff; box-shadow:inset 0 0 30px rgba(31,194,225,.08); font:700 12px/1.55 ui-monospace,SFMono-Regular,Consolas,monospace; }
.workaround-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:7px; }
.workaround-grid button { min-height:44px; font-size:9px; letter-spacing:.06em; }
.workaround-grid .workaround-primary { border-color:rgba(69,231,255,.65); color:#baf8ff; box-shadow:0 0 20px rgba(45,220,255,.08); }
.workaround-grid .workaround-emergency { border-color:rgba(255,49,88,.75); color:#ff9caf; background:rgba(93,8,27,.36); }
.workaround-safety { margin-top:11px; color:#71889a; font-size:8px; text-align:center; letter-spacing:.07em; line-height:1.45; }
body.workaround-open #mobileControls, body.workaround-open #buildLabHud { opacity:.18; pointer-events:none; }
@media (max-width:760px){ .workaround-modal{padding:7px}.workaround-shell{width:calc(100vw - 12px);max-height:calc(100dvh - 12px);padding:12px}.workaround-log{min-height:160px;font-size:10px}.workaround-grid button{min-height:48px;font-size:8px}.workaround-topbar h2{font-size:24px}.creator-sculpt-tools button{font-size:8px;padding:8px 4px} }


/* BUILD 0.8.7 - Replicator scale presets, mobile manipulation compactness */
.build-lab-scale-row { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:6px; }
.build-lab-scale-row > span { color:#7eeeff; font-size:8px; font-weight:900; letter-spacing:.08em; white-space:nowrap; }
.build-lab-grid.scale-grid { grid-template-columns:repeat(3,1fr); min-width:210px; }
.build-lab-scale-row .park-scale-button { min-height:31px; padding:6px 10px; border-color:rgba(255,68,105,.72); color:#ffadc0; background:linear-gradient(180deg,rgba(105,8,31,.46),rgba(49,3,15,.44)); font-size:7.5px; letter-spacing:.055em; }
.build-lab-grid button.active-scale, .park-scale-button.active-scale { border-color:#67f5ff; color:#d9fcff; box-shadow:0 0 0 1px rgba(84,236,255,.22) inset,0 0 18px rgba(68,229,255,.12); }
@media (max-width:760px) {
  .build-lab-scale-row { grid-template-columns:1fr; gap:4px; }
  .build-lab-scale-row > span { text-align:center; }
  .build-lab-grid.scale-grid { min-width:0; }
  .build-lab-scale-row .park-scale-button { min-height:34px; }
}
@media (orientation:landscape) and (max-height:540px) {
  .build-lab-hud { width:min(670px,64vw); max-height:46vh; padding:6px 8px; }
  .build-lab-body { margin-top:5px; gap:4px; }
  .build-lab-status { font-size:8.5px; min-height:10px; }
  .build-lab-grid { gap:4px; }
  .build-lab-grid button, .build-lab-scale-row .park-scale-button { min-height:29px; padding:4px 5px; font-size:7px; }
  .build-lab-scale-row { grid-template-columns:auto 1fr auto; gap:4px; }
  .build-lab-grid.scale-grid { min-width:180px; }
  .build-lab-hud.holding-part .build-lab-status,
  .build-lab-hud.holding-part .build-lab-scale-row,
  .build-lab-hud.holding-part .lab-admin-grid { display:none; }
  .build-lab-hud.holding-part { max-height:38vh; }
}


/* BUILD 0.8.9 — Predictive EBI: full product index, keyboard-safe mobile mode, richer generated geometry. */
.ebi-modal{--ebi-vvh:100vh;position:fixed;inset:0;z-index:93;display:grid;place-items:center;padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));background:rgba(0,5,2,.82);backdrop-filter:blur(7px)}
.ebi-modal.hidden{display:none}.ebi-shell{--eg:#00ff66;--eg2:#61ff9c;--em:#89a693;--eline:#195f31;position:relative;width:min(1180px,96vw);max-height:min(94vh,calc(var(--ebi-vvh) - 8px));overflow:auto;background:radial-gradient(circle at 40% -20%,rgba(0,255,102,.16),transparent 38%),linear-gradient(155deg,#041009 0%,#07150d 55%,#020805 100%);border:1px solid rgba(39,177,87,.58);border-radius:20px;padding:18px;box-shadow:0 25px 80px rgba(0,0,0,.65),0 0 65px rgba(0,255,102,.08);color:#eaffef;font-family:Inter,system-ui,sans-serif;isolation:isolate}
.ebi-wave{position:absolute;pointer-events:none;inset:auto -20% -35% -20%;height:55%;border-radius:50%;border-top:1px solid rgba(0,255,102,.16);filter:blur(.2px);z-index:-1;animation:ebiWave 8s ease-in-out infinite alternate}.ebi-wave-b{inset:auto -15% -29% -15%;border-color:rgba(96,255,159,.10);animation-duration:11s;animation-direction:alternate-reverse}@keyframes ebiWave{from{transform:translate3d(-2%,0,0) scaleY(.82)}to{transform:translate3d(3%,-10%,0) scaleY(1.08)}}
.ebi-topline{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:12px;padding-bottom:12px;border-bottom:1px solid rgba(25,96,49,.5)}.ebi-brand{display:flex;align-items:center;gap:10px;color:#dfffe9;font-weight:900;letter-spacing:.05em;font-size:13px}.ebi-mark{width:28px;height:28px;display:grid;place-items:center;border:1px solid var(--eg);border-radius:7px;color:#06120a;background:var(--eg);box-shadow:0 0 20px rgba(0,255,102,.3)}.ebi-live{font:11px ui-monospace,monospace;color:#89c99e;display:flex;align-items:center;gap:7px}.ebi-live-dot{width:8px;height:8px;border-radius:50%;background:var(--eg);box-shadow:0 0 15px var(--eg);animation:ebiBlink 1.1s infinite alternate}@keyframes ebiBlink{to{opacity:.35}}
.ebi-hero{padding:16px 0 12px}.ebi-kicker{color:var(--eg);font:700 11px ui-monospace,monospace;text-transform:uppercase;letter-spacing:.15em}.ebi-hero h2{font-size:clamp(22px,3vw,39px);margin:5px 0 4px;line-height:1.04}.ebi-hero p{margin:0 0 14px;color:#a7c6b1;font-size:13px}.ebi-query-wrap{max-width:940px;margin:auto}.ebi-query-label{display:flex;justify-content:space-between;color:#6e9c7b;font:10px ui-monospace,monospace;letter-spacing:.08em;padding:0 4px 5px}.ebi-query-box{position:relative}.ebi-search-icon{position:absolute;left:17px;top:50%;transform:translateY(-50%);color:var(--eg);font:25px ui-monospace,monospace;z-index:2}.ebi-query-box input{box-sizing:border-box;width:100%;padding:16px 78px 16px 58px;background:#031008;border:1px solid rgba(0,255,102,.58);border-radius:14px;color:white;font:800 30px ui-monospace,monospace;outline:none;box-shadow:0 0 0 1px rgba(0,255,102,.05) inset,0 0 26px rgba(0,255,102,.05)}.ebi-query-box input:focus{border-color:var(--eg);box-shadow:0 0 0 2px rgba(0,255,102,.09),0 0 32px rgba(0,255,102,.08)}.ebi-query-box button{position:absolute;right:9px;top:9px;bottom:9px;padding:0 13px;border:1px solid #205a32;background:#081b0f;color:#8fd4a4;border-radius:9px;font:700 10px ui-monospace,monospace}.ebi-examples{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}.ebi-examples button{border:1px solid #1b5c31;background:#07170d;color:#a1c9ad;border-radius:999px;padding:6px 10px;font:10px ui-monospace,monospace}.ebi-examples button:hover{border-color:var(--eg);color:white}
.ebi-metrics{display:grid;grid-template-columns:1fr .8fr 1.4fr .7fr;gap:7px;margin-top:12px}.ebi-metric,.ebi-strict{border:1px solid rgba(25,96,49,.68);border-radius:10px;background:rgba(4,20,10,.74);padding:8px 10px;min-height:42px}.ebi-metric span{display:block;color:#638f70;font:9px ui-monospace,monospace;letter-spacing:.07em}.ebi-metric strong{display:block;margin-top:3px;color:#eaffef;font:700 12px ui-monospace,monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ebi-strict{grid-column:1/-1;display:flex;align-items:center;gap:8px;color:#a4cfb0;font:10px ui-monospace,monospace;min-height:auto}.ebi-strict input{accent-color:var(--eg)}
.ebi-workspace{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr);gap:10px}.ebi-panel{background:rgba(3,14,7,.84);border:1px solid rgba(25,96,49,.58);border-radius:14px;overflow:hidden}.ebi-panel-head{display:flex;justify-content:space-between;align-items:center;padding:9px 11px;border-bottom:1px solid rgba(25,96,49,.5);color:#8fc9a0;font:10px ui-monospace,monospace}.ebi-panel-head strong{color:#dfffe8;letter-spacing:.08em}.ebi-results-wrap{max-height:330px;overflow:auto}.ebi-results-wrap table{width:100%;border-collapse:collapse;font-size:12px}.ebi-results-wrap th,.ebi-results-wrap td{padding:8px 7px;border-bottom:1px solid rgba(25,96,49,.43);text-align:left;vertical-align:top}.ebi-results-wrap th{position:sticky;top:0;background:#06120a;color:#6f997b;font:9px ui-monospace,monospace;z-index:2}.ebi-product{font:800 13px ui-monospace,monospace;color:#fff}.ebi-vendor,.ebi-small{font:9px ui-monospace,monospace;color:#6e987a;margin-top:2px}.ebi-score{font:700 11px ui-monospace,monospace}.ebi-scorebar{width:78px;height:6px;background:#10301a;border-radius:999px;overflow:hidden;margin-top:4px}.ebi-scorebar span{display:block;height:100%;background:linear-gradient(90deg,var(--eg),var(--eg2));border-radius:999px;transition:width .25s ease}.ebi-wrong{opacity:.48}.ebi-empty{padding:28px!important;text-align:center;color:#72947b;font:11px ui-monospace,monospace}.ebi-replicate{border:1px solid #00d85c;background:rgba(0,255,102,.10);color:#baffcc;border-radius:8px;padding:7px 9px;font:800 9px ui-monospace,monospace;white-space:nowrap}.ebi-replicate:hover{background:rgba(0,255,102,.18);color:white}.ebi-replicate:disabled{opacity:.35}.ebi-why{padding:9px 11px;color:#86ad91;font:10px ui-monospace,monospace;min-height:32px}.ebi-code{padding:8px 0;font:10px/1.55 ui-monospace,SFMono-Regular,Consolas,monospace;min-height:205px}.ebi-code-line{padding:3px 12px;color:#61866b;border-left:3px solid transparent;transition:all .16s ease}.ebi-code-line.ebi-passed{color:#85ad90}.ebi-code-line.ebi-active{color:#eaffef;background:linear-gradient(90deg,rgba(0,255,102,.16),transparent);border-left-color:var(--eg);text-shadow:0 0 8px rgba(0,255,102,.2)}.ebi-trace{border-top:1px solid rgba(25,96,49,.48);padding:9px 12px;min-height:82px;max-height:130px;overflow:auto;background:#020a05;color:#6e9d7b;font:9px/1.55 ui-monospace,monospace}.ebi-trace .pass{color:#65f195}.ebi-trace .info{color:#66d8ff}.ebi-trace .reject{color:#ff758c}.ebi-safety{margin-top:9px;color:#4e765a;text-align:center;font:8px ui-monospace,monospace;letter-spacing:.07em}
body.ebi-open #hud,body.ebi-open #leftHud,body.ebi-open #rightHud,body.ebi-open #mobileControls,body.ebi-open #buildLabHud{pointer-events:none}
@media(max-width:760px){.ebi-modal{padding:4px}.ebi-shell{width:98vw;max-height:98vh;border-radius:12px;padding:9px}.ebi-topline{grid-template-columns:1fr auto}.ebi-live{grid-column:1/-1;grid-row:2}.ebi-brand{font-size:9px}.ebi-hero{padding:8px 0}.ebi-hero h2{font-size:19px}.ebi-hero p{font-size:10px}.ebi-query-box input{font-size:22px;padding:12px 65px 12px 48px}.ebi-search-icon{left:13px}.ebi-examples{gap:4px}.ebi-examples button{font-size:8px;padding:5px 7px}.ebi-metrics{grid-template-columns:1fr 1fr;gap:4px;margin-top:7px}.ebi-metric{padding:5px 7px;min-height:34px}.ebi-metric strong{font-size:9px}.ebi-workspace{grid-template-columns:1fr}.ebi-results-wrap{max-height:235px}.ebi-code-panel{max-height:230px}.ebi-code{min-height:0;font-size:8px;line-height:1.25}.ebi-code-line{padding:2px 8px}.ebi-trace{display:none}.ebi-results-wrap th,.ebi-results-wrap td{padding:6px 4px;font-size:9px}.ebi-vendor,.ebi-small{font-size:7px}.ebi-scorebar{width:46px}.ebi-replicate{font-size:7px;padding:6px}.ebi-why{font-size:8px;padding:6px 8px}.ebi-safety{font-size:6px}}


/* 0.8.9 soft-keyboard mode: keep query + ranked results visible while the phone keyboard is open. */
body.ebi-keyboard .ebi-modal{place-items:start center;padding:2px;background:rgba(0,5,2,.94)}
body.ebi-keyboard .ebi-shell{width:100vw;height:calc(var(--ebi-vvh) - 2px);max-height:calc(var(--ebi-vvh) - 2px);overflow:hidden;border-radius:8px;padding:6px}
body.ebi-keyboard .ebi-wave,body.ebi-keyboard .ebi-hero>.ebi-kicker,body.ebi-keyboard .ebi-hero>h2,body.ebi-keyboard .ebi-hero>p,body.ebi-keyboard .ebi-examples,body.ebi-keyboard .ebi-metrics,body.ebi-keyboard .ebi-code-panel,body.ebi-keyboard .ebi-safety{display:none!important}
body.ebi-keyboard .ebi-topline{padding-bottom:4px;gap:4px;grid-template-columns:1fr auto}
body.ebi-keyboard .ebi-live{display:none}
body.ebi-keyboard .ebi-brand{font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.ebi-keyboard .ebi-mark{width:22px;height:22px}
body.ebi-keyboard .ebi-hero{padding:4px 0}
body.ebi-keyboard .ebi-query-wrap{max-width:none}
body.ebi-keyboard .ebi-query-label{padding-bottom:2px;font-size:8px}
body.ebi-keyboard .ebi-query-box input{font-size:20px;padding:9px 58px 9px 40px;border-radius:9px}
body.ebi-keyboard .ebi-search-icon{left:11px;font-size:20px}
body.ebi-keyboard .ebi-query-box button{top:5px;bottom:5px;right:5px}
body.ebi-keyboard .ebi-workspace{display:block;height:calc(var(--ebi-vvh) - 87px)}
body.ebi-keyboard .ebi-panel{height:100%;display:flex;flex-direction:column;border-radius:8px}
body.ebi-keyboard .ebi-panel-head{padding:5px 7px;flex:0 0 auto}
body.ebi-keyboard .ebi-results-wrap{max-height:none;overflow:auto;flex:1 1 auto}
body.ebi-keyboard .ebi-why{display:none}
body.ebi-keyboard .ebi-results-wrap th,body.ebi-keyboard .ebi-results-wrap td{padding:5px 3px;font-size:8px}
body.ebi-keyboard .ebi-results-wrap th:first-child,body.ebi-keyboard .ebi-results-wrap td:first-child{display:none}
body.ebi-keyboard .ebi-product{font-size:10px}.ebi-keyboard .ebi-vendor{font-size:6px;max-width:105px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ebi-keyboard .ebi-small{font-size:6px}
body.ebi-keyboard .ebi-score{font-size:8px}.ebi-keyboard .ebi-scorebar{width:34px;height:4px}.ebi-keyboard .ebi-replicate{font-size:7px;padding:7px 5px}


/* THE ARENA 0.1.0 — dedicated training fork */
body.arena-mode { --arena-cyan:#78ebff; --arena-steel:#45545e; }
body.arena-mode .start-card h1 span, body.arena-mode .brand span { color:#7fefff; }
body.arena-mode .start-card { border-color:rgba(120,235,255,.28); }
body.arena-mode .arena-hide { display:none !important; }
body.catch-training-open #crosshair, body.catch-training-open #interactionPrompt, body.catch-training-open #pointerHint { display:none !important; }
.catch-training-modal { position:fixed; inset:0; z-index:140; display:grid; place-items:center; padding:max(14px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left)); background:rgba(3,10,15,.82); backdrop-filter:blur(10px); }
.catch-training-modal.hidden { display:none; }
.catch-training-shell { width:min(1080px,96vw); max-height:92vh; overflow:auto; border:1px solid rgba(112,233,255,.45); border-radius:20px; background:linear-gradient(180deg,rgba(9,28,37,.98),rgba(5,15,21,.98)); box-shadow:0 30px 100px rgba(0,0,0,.48),0 0 42px rgba(90,226,255,.08) inset; color:#eefcff; padding:20px; }
.catch-training-head { display:flex; justify-content:space-between; gap:18px; align-items:flex-start; border-bottom:1px solid rgba(120,235,255,.14); padding-bottom:14px; }
.catch-training-head h2 { margin:5px 0 3px; font-size:clamp(22px,3vw,38px); letter-spacing:.015em; }
.catch-training-head p { margin:0; color:#b7d4dc; max-width:760px; line-height:1.45; }
.catch-training-grid { display:grid; grid-template-columns:minmax(0,1.18fr) minmax(300px,.82fr); gap:18px; padding-top:18px; }
.catch-case { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.catch-card { border:1px solid rgba(136,225,240,.16); border-radius:14px; padding:14px; background:rgba(255,255,255,.035); min-height:96px; }
.catch-card.wide { grid-column:1/-1; }
.catch-card span { display:block; color:#78ebff; font-size:10px; font-weight:900; letter-spacing:.13em; margin-bottom:8px; }
.catch-card strong,.catch-card p { margin:0; color:#f5fbfd; font-size:15px; line-height:1.48; }
.catch-answer-panel { display:flex; flex-direction:column; gap:12px; }
.catch-rule { border-left:3px solid #ffd979; padding:10px 12px; background:rgba(255,217,121,.06); color:#dce7ea; line-height:1.45; font-size:13px; }
.catch-choices { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.catch-choices button:last-child { grid-column:1/-1; }
.catch-choices button { min-height:48px; border-color:rgba(120,235,255,.32); font-size:11px; letter-spacing:.04em; }
.catch-choices button.correct { border-color:#6ff3a0; box-shadow:0 0 0 1px rgba(111,243,160,.45) inset; color:#baffcd; }
.catch-choices button.wrong { border-color:#ff718a; color:#ffc3cd; }
.catch-feedback { min-height:64px; border-radius:12px; padding:12px; background:rgba(255,255,255,.035); color:#c7d6da; line-height:1.45; }
.catch-feedback.good { background:rgba(59,190,105,.10); color:#c8ffd9; }
.catch-feedback.bad { background:rgba(220,75,97,.10); color:#ffd1d8; }
.catch-actions { display:flex; gap:8px; }
.catch-actions button { flex:1; }
.catch-actions .active { border-color:#ffd979; color:#ffe7a7; }
.catch-score { text-align:right; font:800 12px ui-monospace,monospace; color:#89eafa; }
.catch-training-foot { margin-top:16px; padding-top:12px; border-top:1px solid rgba(120,235,255,.13); color:#78939b; font-size:11px; line-height:1.4; }
@media (max-width:760px){ .catch-training-modal{padding:6px}.catch-training-shell{width:100%;max-height:96vh;border-radius:14px;padding:12px}.catch-training-grid{grid-template-columns:1fr}.catch-case{grid-template-columns:1fr}.catch-card.wide{grid-column:auto}.catch-choices{grid-template-columns:1fr 1fr}.catch-training-head h2{font-size:22px}.catch-training-head p{font-size:12px} }

/* THE ARENA 0.1.1 — Living Training Ground UX polish */
body.arena-mode #hud {
  grid-template-columns:minmax(150px,1fr) auto minmax(300px,1fr);
  gap:14px;
}
body.arena-mode .phase-card {
  min-width:150px;
  padding:7px 16px;
  background:rgba(17,35,42,.72);
}
body.arena-mode .phase { font-size:10px; }
body.arena-mode .timer { font-size:22px; }
body.arena-mode .arena-top-actions {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:5px;
  white-space:nowrap;
  font-size:9px;
  letter-spacing:.08em;
}
body.arena-mode .arena-top-actions .room-prefix { opacity:.62; }
body.arena-mode .arena-top-actions strong {
  margin:0 3px 0 0;
  font-size:13px;
  letter-spacing:.07em;
}
body.arena-mode .arena-top-actions .tiny {
  margin:0;
  padding:5px 7px;
  min-width:0;
  background:rgba(12,29,36,.58);
  border-color:rgba(199,247,255,.19);
}
body.arena-mode .arena-top-actions .tiny:hover { background:rgba(74,187,211,.22); }
body.arena-mode #leftHud { top:64px; width:230px; max-height:calc(100vh - 118px); overflow:auto; }
body.arena-mode #rightHud { z-index:80; top:64px; width:min(300px,calc(100vw - 32px)); max-height:calc(100vh - 80px); overflow:auto; }
body.arena-mode .interaction { bottom:88px; max-width:min(720px,78vw); overflow:hidden; text-overflow:ellipsis; }
body.arena-mode .control-guide { bottom:16px; max-width:min(960px,70vw); }
body.arena-mode #pointerHint {
  bottom:54px;
  z-index:22;
  color:#d8f7ff;
  border:1px solid rgba(120,235,255,.22);
  background:rgba(5,20,27,.78);
}
body.arena-mode.cursor-mode #pointerHint { color:#fff2ac; border-color:rgba(255,221,125,.34); }
body.arena-mode.cursor-mode #crosshair { opacity:.24; }
body.arena-mode.menu-open .arena-tool-hud,
body.catch-training-open .arena-tool-hud,
body.workaround-open .arena-tool-hud,
body.ebi-open .arena-tool-hud { opacity:.22; pointer-events:none; }

.arena-tool-hud {
  position:fixed;
  z-index:24;
  right:16px;
  bottom:16px;
  width:216px;
  padding:9px;
  border:1px solid rgba(125,233,255,.28);
  border-radius:13px;
  background:rgba(7,24,31,.78);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  box-shadow:0 12px 36px rgba(0,0,0,.24);
  pointer-events:auto;
}
.arena-tool-kicker { color:#7beeff; font-size:8px; font-weight:950; letter-spacing:.16em; margin:0 0 6px 2px; }
.arena-tool-buttons { display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.arena-tool-buttons button {
  min-height:38px;
  padding:6px 7px;
  font-size:8px;
  line-height:1.15;
  border-color:rgba(255,255,255,.14);
  background:rgba(255,255,255,.045);
}
.arena-tool-buttons button b { display:block; font-size:11px; color:#9feeff; margin-bottom:2px; }
.arena-tool-buttons button.active {
  border-color:rgba(112,239,255,.72);
  background:linear-gradient(180deg,rgba(54,181,211,.22),rgba(19,69,81,.26));
  box-shadow:0 0 0 1px rgba(112,239,255,.18) inset;
}
#toolLaserBtn.active { border-color:rgba(255,92,92,.8); box-shadow:0 0 0 1px rgba(255,84,84,.24) inset,0 0 18px rgba(255,40,40,.09); }
#toolLaserBtn.active b { color:#ff8c8c; }
.arena-tool-hint { margin-top:6px; color:#8ca9b1; font:700 7px ui-monospace,monospace; letter-spacing:.06em; text-align:center; }

/* The original noisy 48px material can shimmer on broad surfaces. Arena surfaces use flat materials in JS;
   these rules also keep translucent UI/labels from stacking visually. */
body.arena-mode .hud-panel, body.arena-mode .phase-card, body.arena-mode .arena-tool-hud { isolation:isolate; }
body.arena-mode #toast { bottom:106px; }

@media (max-width:980px) {
  body.arena-mode #hud { grid-template-columns:1fr auto; }
  body.arena-mode .phase-card { grid-column:1 / -1; grid-row:2; margin-top:4px; }
  body.arena-mode .arena-top-actions { max-width:64vw; overflow:hidden; }
  body.arena-mode .arena-top-actions .room-prefix,
  body.arena-mode #copyRoomBtn { display:none; }
  body.arena-mode #leftHud { top:112px; }
  body.arena-mode #rightHud { top:112px; }
}
@media (max-width:760px) {
  body.arena-mode #hud { grid-template-columns:1fr auto; gap:5px; }
  body.arena-mode .arena-top-actions { gap:3px; max-width:72vw; }
  body.arena-mode .arena-top-actions .tiny { padding:5px 6px; font-size:7px; }
  body.arena-mode .arena-top-actions strong { font-size:10px; }
  .arena-tool-hud { right:8px; bottom:204px; width:150px; padding:7px; }
  .arena-tool-buttons { grid-template-columns:1fr; }
  .arena-tool-buttons button { min-height:34px; }
  .arena-tool-hint { display:none; }
  body.arena-mode .control-guide { display:none !important; }
}

body.arena-mode #pointerHint:not(.hidden) { display:block !important; }
body.arena-mode .arena-top-actions { box-sizing:border-box; }


/* THE PARK 0.1.0 — unified mode selector + universal laser pointer */
:root { --player-laser:#ff3b3b; }
.park-start-card { width:min(690px,calc(100vw - 28px)); }
.selected-mode-title { margin:-2px 0 8px; color:#95f5ff; font:950 13px ui-monospace,monospace; letter-spacing:.18em; text-align:center; }
.park-mode-selector { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:14px 0; }
.park-mode-card { min-height:82px; padding:13px 14px; text-align:left; border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.035); }
.park-mode-card strong { display:block; font-size:12px; letter-spacing:.06em; }
.park-mode-card span { display:block; margin-top:6px; color:#8fa5b5; font-size:9px; line-height:1.35; }
.park-mode-card.active { border-color:rgba(101,234,255,.78); box-shadow:0 0 0 1px rgba(101,234,255,.18) inset,0 0 25px rgba(46,210,255,.08); background:linear-gradient(180deg,rgba(42,163,196,.16),rgba(17,50,65,.18)); }
body.afterdark-mode #modeAfterDark.active { border-color:rgba(255,91,170,.8); box-shadow:0 0 0 1px rgba(255,91,170,.15) inset,0 0 26px rgba(255,65,148,.08); }
.laser-color-picker { margin:9px 0 12px; padding:10px; border:1px solid rgba(255,255,255,.09); border-radius:12px; background:rgba(255,255,255,.025); }
.laser-color-picker>span { display:block; color:#90a6b5; font:800 9px ui-monospace,monospace; letter-spacing:.08em; margin-bottom:8px; }
.laser-swatches { display:grid; grid-template-columns:repeat(8,1fr); gap:6px; }
.laser-swatch { min-height:30px; padding:0; border-radius:9px; background:var(--swatch); border:2px solid rgba(255,255,255,.18); box-shadow:0 0 12px color-mix(in srgb,var(--swatch) 35%,transparent); }
.laser-swatch.active { outline:2px solid #fff; outline-offset:2px; }
#toolLaserBtn.active { border-color:var(--player-laser) !important; box-shadow:0 0 0 1px color-mix(in srgb,var(--player-laser) 35%,transparent) inset,0 0 18px color-mix(in srgb,var(--player-laser) 24%,transparent) !important; }
#toolLaserBtn.active b { color:var(--player-laser) !important; }
body.menu-open .arena-tool-hud, body.catch-training-open .arena-tool-hud, body.workaround-open .arena-tool-hud, body.ebi-open .arena-tool-hud, body.minigame .arena-tool-hud { opacity:.22; pointer-events:none; }
body.afterdark-mode .arena-tool-hud { border-color:rgba(255,255,255,.18); background:rgba(12,10,22,.78); }
body.afterdark-mode .arena-tool-kicker { color:#ff9ccb; }
@media(max-width:760px){
  .park-start-card { max-height:96vh; overflow:auto; }
  .park-mode-selector { grid-template-columns:1fr; gap:7px; }
  .park-mode-card { min-height:62px; }
  .laser-swatches { grid-template-columns:repeat(4,1fr); }
  body.afterdark-mode .arena-tool-hud { right:8px; bottom:204px; width:150px; padding:7px; }
}


/* THE PARK 0.1.0.12 — multiplayer attractions */
.multiplayer-game-hud{position:fixed;z-index:45;left:50%;top:96px;transform:translateX(-50%);width:min(500px,calc(100vw - 24px));padding:14px 16px;border:1px solid rgba(99,235,255,.42);border-radius:17px;background:linear-gradient(180deg,rgba(5,18,27,.94),rgba(8,11,20,.92));backdrop-filter:blur(16px);box-shadow:0 18px 55px rgba(0,0,0,.42),0 0 30px rgba(75,229,255,.10);pointer-events:auto;color:#f5fbff}
.multiplayer-score{margin:9px 0 6px;text-align:center;font:1000 29px/1 ui-monospace,SFMono-Regular,Consolas,monospace;color:#a9f8ff;letter-spacing:.10em;text-shadow:0 0 18px rgba(89,233,255,.28)}
.multiplayer-game-hud button{margin-top:9px;width:100%;padding:7px;font-size:9px;color:#f7fbff}
body.multiplayer-game #interactionPrompt{display:none!important}body.multiplayer-game #controlGuide{color:#bdf8ff;border-color:rgba(99,235,255,.42)}
@media(max-width:760px){.multiplayer-game-hud{top:max(72px,env(safe-area-inset-top));width:min(420px,calc(100vw - 110px));padding:9px 11px}.multiplayer-score{font-size:21px}.multiplayer-game-hud button{font-size:8px;padding:5px}}
@media(orientation:landscape) and (max-height:540px){.multiplayer-game-hud{top:8px;width:400px;padding:7px 10px}.multiplayer-score{margin:4px 0;font-size:19px}}


/* THE PARK 0.1.0.13 - compact mobile Park Tool toggle + safe-area pass */
.mobile-tool-toggle { display:none; }
body.touch-mode .arena-tool-hud { display:none !important; }
body.touch-mode .mobile-tool-toggle {
  position:absolute;
  z-index:8;
  pointer-events:auto;
  top:max(78px,calc(env(safe-area-inset-top) + 66px));
  right:max(12px,env(safe-area-inset-right));
  width:174px;
  height:44px;
  padding:3px;
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:3px;
  border:1px solid rgba(255,255,255,.24);
  border-radius:999px;
  background:rgba(6,14,25,.72);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  box-shadow:0 8px 24px rgba(0,0,0,.28);
}
body.touch-mode .mobile-tool-toggle button {
  min-width:0;
  height:38px;
  padding:2px 4px;
  border-radius:999px;
  border:1px solid transparent;
  background:transparent;
  color:#b8c7d3;
  font-size:7px;
  line-height:1;
  touch-action:manipulation;
}
body.touch-mode .mobile-tool-toggle button b {
  display:block;
  margin-bottom:2px;
  color:#d9f8ff;
  font-size:12px;
  line-height:1;
}
body.touch-mode .mobile-tool-toggle button span {
  display:block;
  font-size:6.5px;
  font-weight:950;
  letter-spacing:.05em;
}
body.touch-mode .mobile-tool-toggle button.active {
  border-color:rgba(91,231,255,.72);
  background:rgba(44,190,220,.22);
  color:#eaffff;
  box-shadow:0 0 0 1px rgba(91,231,255,.12) inset;
}
body.touch-mode #mobileToolLaser.active {
  border-color:var(--player-laser);
  background:color-mix(in srgb,var(--player-laser) 22%,rgba(20,12,24,.76));
  box-shadow:0 0 0 1px color-mix(in srgb,var(--player-laser) 22%,transparent) inset,0 0 14px color-mix(in srgb,var(--player-laser) 14%,transparent);
}
body.touch-mode #mobileToolLaser.active b { color:var(--player-laser); }
body.touch-mode.menu-open .mobile-tool-toggle,
body.touch-mode.minigame .mobile-tool-toggle,
body.touch-mode.multiplayer-game .mobile-tool-toggle,
body.touch-mode.workaround-open .mobile-tool-toggle,
body.touch-mode.ebi-open .mobile-tool-toggle,
body.touch-mode.catch-training-open .mobile-tool-toggle {
  opacity:0;
  pointer-events:none;
}
body.touch-mode #hud {
  left:max(8px,env(safe-area-inset-left));
  right:max(8px,env(safe-area-inset-right));
  top:max(8px,env(safe-area-inset-top));
}
body.touch-mode .mobile-quick-menu {
  top:max(70px,calc(env(safe-area-inset-top) + 62px));
}
@media (orientation:landscape) and (max-height:540px) {
  body.touch-mode .mobile-tool-toggle {
    top:max(66px,calc(env(safe-area-inset-top) + 56px));
    right:max(12px,env(safe-area-inset-right));
    width:162px;
    height:40px;
  }
  body.touch-mode .mobile-tool-toggle button { height:34px; }
}


/* THE PARK 0.1.0.14.1 - iPhone/iPad PWA install hotfix */
.pwa-install-modal {
  position:fixed; inset:0; z-index:220; display:grid; place-items:center;
  padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));
  background:rgba(2,7,14,.88); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  pointer-events:auto; touch-action:manipulation; overflow:auto;
}
.pwa-install-card {
  width:min(520px,calc(100vw - 28px)); max-height:min(660px,calc(var(--pwa-vh,100dvh) - 28px)); overflow:auto;
  padding:24px; border-radius:20px; border-color:rgba(57,230,255,.28);
}
.pwa-install-card h2 { margin:8px 0 10px; font-size:clamp(24px,5vw,38px); line-height:.98; }
.pwa-install-card p { margin:0 0 14px; color:#c9d7e4; line-height:1.45; font-size:13px; }
.pwa-install-steps { margin:12px 0 18px; padding-left:22px; color:#e9f6ff; font-size:13px; line-height:1.55; }
.pwa-install-steps li + li { margin-top:7px; }
.pwa-install-actions { display:grid; grid-template-columns:1fr; gap:8px; }
.pwa-install-note { margin-top:12px; color:#7f94a7; font-size:10px; line-height:1.4; }
#pwaInstallBtn { touch-action:manipulation; }
body.pwa-standalone { overscroll-behavior:none; -webkit-touch-callout:none; }
body.pwa-ios #fullscreenStartBtn, body.pwa-ios #quickFullscreenBtn, body.pwa-ios #mobileFullscreen { display:none !important; }
body.pwa-ios #pwaInstallBtn:not(.hidden) { border-color:rgba(57,230,255,.52); background:rgba(57,230,255,.11); }
@media (orientation:landscape) and (max-height:540px) {
  .pwa-install-card { width:min(620px,calc(100vw - 80px)); max-height:calc(var(--pwa-vh,100dvh) - 18px); padding:16px 18px; }
  .pwa-install-card h2 { font-size:24px; }
  .pwa-install-card p,.pwa-install-steps { font-size:11px; }
  .pwa-install-steps { display:grid; grid-template-columns:1fr 1fr; gap:5px 22px; margin:8px 0 12px; }
  .pwa-install-steps li + li { margin-top:0; }
}


/* THE PARK 0.1.0.14.2 - orientation-free mobile title + landscape gameplay gate */
html.pwa-title-open,
html.pwa-title-open body {
  height:auto;
  min-height:100%;
  overflow-x:hidden;
  overflow-y:auto;
  touch-action:pan-y;
  overscroll-behavior-y:auto;
  -webkit-overflow-scrolling:touch;
}
html.pwa-title-open body { min-height:var(--pwa-vh,100dvh); }
html.pwa-title-open body .park-start-card {
  position:relative;
  left:auto;
  top:auto;
  transform:none;
  width:min(690px,calc(100vw - max(28px,env(safe-area-inset-left) + env(safe-area-inset-right) + 16px)));
  max-height:none;
  overflow:visible;
  margin:max(14px,env(safe-area-inset-top)) auto max(22px,env(safe-area-inset-bottom));
  touch-action:pan-y;
}
html.pwa-title-open body.pwa-standalone { overscroll-behavior-y:auto; }

.pwa-rotate-gate {
  position:fixed; inset:0; z-index:215; display:grid; place-items:center;
  padding:max(18px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));
  background:radial-gradient(circle at 50% 42%,rgba(31,84,100,.70),rgba(5,9,17,.96) 62%);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  pointer-events:auto; touch-action:none; text-align:center;
}
.pwa-rotate-card { width:min(420px,calc(100vw - 36px)); padding:24px; border-radius:20px; border-color:rgba(57,230,255,.34); }
.pwa-rotate-card h2 { margin:9px 0 8px; font-size:clamp(25px,8vw,42px); line-height:.95; }
.pwa-rotate-card p { margin:0; color:#c8d8e4; font-size:13px; line-height:1.45; }
.pwa-phone-glyph { width:54px; height:88px; margin:0 auto 16px; border:4px solid #a9f8ff; border-radius:11px; position:relative; transform:rotate(90deg); box-shadow:0 0 26px rgba(57,230,255,.25); }
.pwa-phone-glyph i { position:absolute; width:18px; height:3px; left:50%; bottom:5px; transform:translateX(-50%); border-radius:999px; background:#a9f8ff; }

@media (max-width:760px) {
  html.pwa-title-open body .park-start-card { padding:20px; }
  html.pwa-title-open body .park-start-card h1 { font-size:clamp(42px,14vw,66px); }
}

/* Keep the title/setup usable even if an already-installed PWA temporarily retains the old landscape manifest. */
@media (orientation:landscape) and (max-height:600px) {
  html.pwa-title-open body .park-start-card {
    width:min(900px,calc(100vw - max(24px,env(safe-area-inset-left) + env(safe-area-inset-right) + 14px)));
    padding:12px 18px 16px;
    margin:max(8px,env(safe-area-inset-top)) auto max(12px,env(safe-area-inset-bottom));
  }
  html.pwa-title-open body .park-start-card h1 { display:block; margin:4px 0 5px; font-size:31px; line-height:1; letter-spacing:-.04em; }
  html.pwa-title-open body .park-start-card h1 br { display:none; }
  html.pwa-title-open body .park-start-card h1 span { margin-left:.18em; }
  html.pwa-title-open body .selected-mode-title { font-size:10px; margin:0 0 4px; }
  html.pwa-title-open body .park-start-card .lede { margin:4px auto 7px; max-width:72ch; font-size:11px; line-height:1.3; text-align:center; }
  html.pwa-title-open body .park-mode-selector { grid-template-columns:1fr 1fr; gap:7px; margin:7px 0; }
  html.pwa-title-open body .park-mode-card { min-height:50px; padding:8px 10px; }
  html.pwa-title-open body .park-mode-card strong { font-size:10px; }
  html.pwa-title-open body .park-mode-card span { margin-top:3px; font-size:8px; }
  html.pwa-title-open body .start-grid { grid-template-columns:1fr 1fr; gap:8px; }
  html.pwa-title-open body label { gap:4px; font-size:9px; }
  html.pwa-title-open body input { padding:9px 11px; }
  html.pwa-title-open body #roomCodeInput { font-size:15px; }
  html.pwa-title-open body .avatar-entry { margin-top:7px; }
  html.pwa-title-open body .avatar-entry .wide { margin-bottom:3px; padding:8px 10px; }
  html.pwa-title-open body .avatar-summary { font-size:9px; }
  html.pwa-title-open body .room-help,
  html.pwa-title-open body .fineprint { display:none; }
  html.pwa-title-open body .room-actions { grid-template-columns:minmax(190px,1.4fr) minmax(110px,.8fr) minmax(130px,.9fr); gap:7px; margin-top:7px; }
  html.pwa-title-open body .room-actions button { padding:9px 10px; font-size:10px; }
  html.pwa-title-open body .status { margin-top:7px; min-height:16px; font-size:10px; }
}

@media (orientation:portrait) and (max-width:760px) {
  html.pwa-title-open body .park-start-card { width:calc(100vw - 20px); padding:18px 16px 20px; }
  html.pwa-title-open body .park-start-card h1 { margin:8px 0 8px; font-size:50px; line-height:.82; }
  html.pwa-title-open body .park-mode-selector { grid-template-columns:1fr; }
  html.pwa-title-open body .start-grid { grid-template-columns:1fr; }
  html.pwa-title-open body .room-actions { grid-template-columns:1fr; }
}


/* 0.1.0.16 — Replicator viewport/scroll safety. */
.build-lab-hud:not(.collapsed) {
  display:flex;
  flex-direction:column;
  overflow:hidden;
  max-height:calc(var(--pwa-vh,100dvh) - 104px);
}
.build-lab-hud:not(.collapsed) .build-lab-head {
  flex:0 0 auto;
  position:sticky;
  top:0;
  z-index:3;
  padding-bottom:5px;
  background:linear-gradient(180deg,rgba(5,17,28,.98) 72%,rgba(5,17,28,.72));
}
.build-lab-hud:not(.collapsed) .build-lab-body {
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-gutter:stable;
  padding-right:3px;
  padding-bottom:max(16px,env(safe-area-inset-bottom));
}
@media (max-width:760px), (pointer:coarse) {
  body.touch-mode .build-lab-hud:not(.collapsed) {
    top:max(72px,calc(env(safe-area-inset-top) + 62px));
    bottom:max(136px,calc(env(safe-area-inset-bottom) + 126px));
    left:50%;
    width:min(700px,calc(100vw - 24px));
    height:auto;
    max-height:none;
    transform:translateX(-50%);
    padding:7px 8px 0;
  }
  body.touch-mode .build-lab-hud:not(.collapsed) .build-lab-body {
    padding-bottom:max(20px,calc(env(safe-area-inset-bottom) + 8px));
  }
  body.touch-mode .build-lab-grid.primary-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  body.touch-mode .build-lab-grid.adjust-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  body.touch-mode .build-lab-grid button,
  body.touch-mode .build-lab-scale-row .park-scale-button { min-height:34px; padding:5px 4px; }
}
@media (orientation:landscape) and (max-height:540px) {
  body.touch-mode .build-lab-hud:not(.collapsed) {
    top:max(58px,calc(env(safe-area-inset-top) + 50px));
    bottom:max(122px,calc(env(safe-area-inset-bottom) + 112px));
    width:min(720px,calc(100vw - 110px));
    max-height:none;
  }
  body.touch-mode .build-lab-hud:not(.collapsed) .build-lab-status { font-size:8px; line-height:1.2; }
  body.touch-mode .build-lab-hud:not(.collapsed) .build-lab-body { gap:3px; margin-top:3px; }
  body.touch-mode .build-lab-grid { gap:3px; }
  body.touch-mode .build-lab-grid button,
  body.touch-mode .build-lab-scale-row .park-scale-button { min-height:30px; padding:3px 4px; font-size:6.8px; }
  body.touch-mode .build-lab-scale-row { grid-template-columns:auto 1fr auto; gap:3px; }
  body.touch-mode .build-lab-grid.scale-grid { min-width:170px; }
}
.build-lab-hud:not(.collapsed) .build-lab-body > .build-lab-status {
  position:sticky;
  top:0;
  z-index:2;
  padding:3px 1px 5px;
  background:rgba(5,17,28,.96);
}


/* 0.1.0.17 - room event feed + After Dark results leaderboard. */
.park-feed { position:fixed; z-index:38; top:94px; left:50%; transform:translateX(-50%); width:min(680px,78vw); display:flex; flex-direction:column; align-items:center; gap:6px; pointer-events:none; }
.park-feed-item { max-width:100%; padding:8px 13px; border-radius:999px; border:1px solid rgba(255,255,255,.16); background:rgba(4,10,18,.82); color:#e9f5ff; font-size:11px; font-weight:900; letter-spacing:.045em; box-shadow:0 10px 28px rgba(0,0,0,.32); backdrop-filter:blur(10px); opacity:0; transform:translateY(-8px) scale(.98); transition:opacity .2s,transform .2s; text-align:center; }
.park-feed-item.show { opacity:1; transform:none; }
.park-feed-item.caught { color:#ffd8de; border-color:rgba(255,62,91,.55); background:rgba(47,5,16,.88); }
.park-feed-item.leave { color:#cbd5df; border-color:rgba(188,205,220,.26); }
.park-feed-item.join { color:#c8f7ff; border-color:rgba(57,230,255,.4); }
.park-feed-item.seeker { color:#ffe9a8; border-color:rgba(255,203,78,.5); background:rgba(40,25,4,.9); }
.park-feed-item.result { color:#e4d4ff; border-color:rgba(181,118,255,.45); background:rgba(25,8,43,.9); }
.round-results { position:fixed; z-index:46; inset:0; display:grid; place-items:center; padding:max(18px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left)); background:radial-gradient(circle at 50% 28%,rgba(76,18,101,.28),rgba(1,3,8,.82) 72%); pointer-events:none; }
.round-results.hidden { display:none; }
.round-results-card { width:min(920px,94vw); max-height:min(78vh,720px); overflow:auto; pointer-events:auto; overscroll-behavior:contain; padding:20px; border-radius:20px; border:1px solid rgba(210,170,255,.32); background:rgba(5,8,17,.94); box-shadow:0 28px 90px rgba(0,0,0,.58),0 0 44px rgba(151,60,255,.13); backdrop-filter:blur(18px); }
.round-results-card h2 { margin:4px 0 6px; font-size:clamp(28px,5vw,54px); letter-spacing:-.035em; color:#ff6381; }
.round-results-summary { color:#b9c8d6; font-size:12px; line-height:1.5; margin-bottom:14px; }
.round-results-head,.round-result-row { display:grid; grid-template-columns:42px minmax(120px,1.5fr) 100px minmax(130px,1.2fr) 78px 112px; align-items:center; gap:8px; }
.round-results-head { padding:6px 10px; color:#72889a; font-size:9px; font-weight:900; letter-spacing:.11em; }
.round-result-row { padding:10px; margin:5px 0; border-radius:12px; border:1px solid rgba(255,255,255,.09); background:rgba(255,255,255,.035); font-size:11px; }
.round-result-row.seeker { border-color:rgba(255,65,91,.35); background:rgba(60,8,20,.18); }
.round-result-row .rank { color:#73899b; } .round-result-row .name { font-weight:950; color:#f1f7fb; } .round-result-row .role { color:#83dcf1; font-size:9px; font-weight:950; letter-spacing:.08em; }
.round-result-row.seeker .role { color:#ff7189; } .round-result-row .result { color:#c9d4de; } .round-result-row .delta { text-align:right; color:#ffd66b; font-variant-numeric:tabular-nums; } .round-result-row .total { text-align:right; color:white; font-variant-numeric:tabular-nums; }
.round-results-countdown { margin-top:13px; text-align:center; color:#9bb0c1; font-size:10px; font-weight:900; letter-spacing:.12em; }
body.touch-mode .park-feed { top:max(82px,calc(env(safe-area-inset-top) + 62px)); width:min(84vw,620px); }
body.touch-mode .park-feed-item { font-size:9px; padding:7px 10px; }
@media (max-width:720px),(max-height:520px) { .round-results-card { width:94vw; max-height:84vh; padding:14px; } .round-results-head { display:none; } .round-result-row { grid-template-columns:34px minmax(110px,1fr) 76px 1fr; gap:5px 8px; } .round-result-row .result { grid-column:2 / span 2; } .round-result-row .delta { grid-column:4; grid-row:1; } .round-result-row .total { grid-column:4; grid-row:2; } }

/* 0.1.0.18 — shorter/funnier results + Seeker lunge polish. */
.round-results-roast{margin:-5px 0 12px;padding:10px 12px;border-left:3px solid #ffcf59;border-radius:8px;background:rgba(255,201,75,.065);color:#ffe8a4;font-size:12px;font-weight:850;line-height:1.4}
.round-result-row .result{display:flex;flex-direction:column;gap:3px}
.round-result-row .roast{display:block;color:#8ea0ae;font-size:9px;font-weight:700;line-height:1.25}
.round-results-actions{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:12px;flex-wrap:wrap}
.round-results-actions .round-results-countdown{margin:0}
#roundResultsDismiss{min-height:38px;padding:8px 14px;border-radius:10px;border:1px solid rgba(255,100,130,.42);background:rgba(255,72,112,.1);color:#ffd7df;font-weight:950;letter-spacing:.04em}
#roundResultsDismiss:hover{background:rgba(255,72,112,.18)}
body.blackout #game{filter:brightness(.93)}
@media (max-width:720px),(max-height:520px){.round-results-roast{font-size:10px;margin-bottom:8px}.round-results-actions{position:sticky;bottom:0;padding-top:8px;background:linear-gradient(180deg,rgba(5,8,17,0),rgba(5,8,17,.98) 35%)}#roundResultsDismiss{min-height:42px}}


/* 0.1.0.21: keep the default folded Replicator panel away from shared control/pointer strips. */
.build-lab-hud.collapsed .build-lab-head { gap:8px; }
.build-lab-hud.collapsed #buildLabToggle { min-width:42px; font-weight:950; letter-spacing:.04em; }
@media (min-width:761px) {
  body.arena-mode .build-lab-hud.collapsed {
    left:266px;
    top:72px;
    bottom:auto;
    transform:none;
    min-width:210px;
    max-width:min(330px,calc(100vw - 450px));
  }
  body.arena-mode .build-lab-hud:not(.collapsed) { bottom:118px; }
}
@media (min-width:761px) and (orientation:landscape) and (max-height:540px) {
  body.arena-mode .build-lab-hud.collapsed {
    left:254px;
    top:60px;
    bottom:auto;
    transform:none;
    min-width:190px;
    max-width:min(300px,calc(100vw - 390px));
  }
  body.arena-mode .build-lab-hud:not(.collapsed) { bottom:84px; }
}

/* 0.1.0.22 ride/sky/collision + Replicator slider polish */
@media (max-width:760px){body.tag-it::before{top:92px;font-size:11px;padding:6px 13px}.build-lab-slider input[type=range]{min-height:30px}}
@media (max-height:540px) and (min-width:761px){body.tag-it::before{top:64px;font-size:10px;padding:5px 11px}}


/* THE PARK 0.1.0.27 — True Drop Auto-Snap + Desktop Build Flow */
body.build-mode #crosshair i { background:#6dffd1 !important; box-shadow:0 0 8px rgba(71,255,205,.85); }
body.build-mode .build-lab-hud.collapsed { border-color:rgba(83,255,207,.62); box-shadow:0 10px 38px rgba(0,0,0,.38),0 0 24px rgba(66,255,202,.12); }
.build-lab-hud.build-mode-active .mini-kicker { color:#6dffd1; }
.build-lab-hud.build-mode-active #buildLabTitle { color:#d9fff4; }
body.touch-mode #mobileBuild.active { border-color:rgba(95,255,203,.86); background:rgba(34,190,141,.28); color:#eafff8; box-shadow:0 0 0 1px rgba(95,255,203,.18) inset,0 0 16px rgba(46,255,193,.14); }
body.touch-mode #mobileBuild.active b { color:#73ffd4; }
.build-lab-hud.snap-ready { border-color:rgba(101,255,159,.76); box-shadow:0 12px 44px rgba(0,0,0,.42),0 0 30px rgba(86,255,146,.16); }
@media (max-width:760px),(pointer:coarse){
  body.touch-mode .mobile-tool-toggle { width:174px; grid-template-columns:repeat(3,1fr); }
}
@media (orientation:landscape) and (max-height:540px){
  body.touch-mode .mobile-tool-toggle { width:162px; }
}