#activity-panel {
  margin: 0;
  min-height: 0;
  padding: clamp(16px, 2.6vw, 30px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: clamp(8px, 1.5vh, 15px);
  border: 1px solid #4d674c;
  border-radius: 16px;
  background: linear-gradient(145deg, #17251b, #111b15);
  color: #e8ebf2;
  overflow: hidden;
}

.activity-label {
  margin: 0;
  color: #a1ba86;
  font-size: .7rem;
  letter-spacing: .12em;
  font-weight: 750;
}

#activity-panel h2 {
  margin: 0;
  color: #f1f4eb;
  font-size: clamp(1.35rem, 2.6vw, 2rem);
  line-height: 1.15;
}

#activity-status {
  margin: 0;
  color: #b9c7b8;
  font-size: clamp(.95rem, 1.5vw, 1.1rem);
  line-height: 1.4;
  font-weight: 500;
}

#activity-status.failed { color: #ffc2ad; }
#activity-players { margin: 0; color: #a8d1ac; }
#activity-invite { align-self: flex-start; min-width: 150px; }
.activity-note, .activity-legal { margin: 0; color: #a8b1bd; font-size: .82rem; }
.activity-legal { opacity: .8; }
.activity-details { margin-top: 2px; color: #a8b1bd; font-size: .82rem; }
.activity-details summary, .fatal-details summary { min-height: 30px; cursor: pointer; }
#activity-debug { margin: 6px 0; overflow-wrap: anywhere; }
#activity-checks { margin: 6px 0 0; padding: 0; list-style: none; line-height: 1.45; }
#activity-checks li { margin: 4px 0; overflow-wrap: anywhere; }
.passed { color: #a8d1ac; }
.failed { color: #ffc2ad; }

/* Show the Activity as one calm, fixed-height screen. Hide setup controls that
   belong to the standalone web build; diagnostics stay available on demand. */
body.discord-activity {
  height: 100%;
  overflow: hidden;
  background: #0b0d12;
  color: #e8ebf2;
}

body.discord-activity #launcher {
  width: 100%;
  height: 100%;
  height: 100dvh;
  min-height: 0;
  max-height: 100dvh;
  overflow: hidden;
  padding: max(8px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right))
    max(8px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));
  align-items: stretch;
}

body.discord-activity #launcher > .panel {
  width: min(100%, 900px);
  height: 100%;
  max-width: 900px;
  max-height: 100%;
  margin: auto;
  padding: clamp(12px, 2.3vw, 26px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: clamp(8px, 1.7vh, 16px);
  overflow: hidden;
}

body.discord-activity #launcher header { min-width: 0; }
body.discord-activity #launcher h1 { font-size: clamp(1.25rem, 2.3vw, 1.8rem); line-height: 1.15; }
body.discord-activity #launcher .subtitle { margin: 4px 0 0; font-size: clamp(.82rem, 1.1vw, .98rem); }
body.discord-activity #checks,
body.discord-activity #install-hint,
body.discord-activity #install-android,
body.discord-activity #iphone-tips,
body.discord-activity #step-data,
body.discord-activity #step-play,
body.discord-activity #launcher > .panel > .settings,
body.discord-activity #launcher > .panel > .legal { display: none !important; }

body.discord-activity #activity-panel { gap: clamp(7px, 1.4vh, 13px); }
body.discord-activity #activity-panel .download-panel {
  margin: 0;
  padding: clamp(10px, 1.6vh, 15px);
  border-radius: 12px;
}
body.discord-activity #activity-panel .download-heading { font-size: .95rem; }
body.discord-activity #activity-panel #download-progress { height: 14px; margin-top: 8px; }
body.discord-activity #activity-panel #download-detail { margin: 4px 0 0; font-size: .8rem; }
body.discord-activity #activity-panel #download-cancel,
body.discord-activity #activity-panel #download-retry { min-height: 36px; }

body.discord-activity .overlay { padding: max(10px, env(safe-area-inset-top)) 12px max(10px, env(safe-area-inset-bottom)); }
body.discord-activity .fatal .panel {
  width: min(100%, 560px);
  max-height: calc(100dvh - 24px);
  padding: clamp(16px, 3vh, 26px);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  overflow: hidden;
  text-align: left;
}
body.discord-activity .fatal .panel h2 { margin: 0; font-size: clamp(1.25rem, 2.4vh, 1.65rem); }
body.discord-activity .fatal-summary { margin: 0; color: #b9c2cf; }
body.discord-activity .fatal-details { color: #a8b1bd; font-size: .82rem; }
body.discord-activity .fatal-details pre { max-height: 20dvh; margin: 6px 0; }
body.discord-activity .fatal .row.buttons { margin: 4px 0 0; }

@media (max-height: 620px) {
  body.discord-activity #launcher > .panel { padding: 10px 14px; gap: 8px; }
  body.discord-activity #launcher .subtitle { font-size: .78rem; }
  body.discord-activity #activity-panel { padding: 12px 16px; gap: 7px; }
  body.discord-activity #activity-panel h2 { font-size: clamp(1.15rem, 3vh, 1.5rem); }
  body.discord-activity .activity-note,
  body.discord-activity .activity-legal { display: none; }
}

@media (max-height: 440px) {
  body.discord-activity #launcher .subtitle,
  body.discord-activity .activity-details { display: none; }
  body.discord-activity #activity-panel { padding: 10px 14px; }
  body.discord-activity #activity-invite { min-height: 38px; }
}

[hidden] { display: none !important; }

#desktop-controls {
  position: fixed;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 30;
  width: min(620px, calc(100vw - 32px));
  box-sizing: border-box;
  padding: 12px 40px 12px 16px;
  background: #11161de8;
  border: 1px solid #56616c;
  border-radius: 12px;
  color: #e9eef4;
}
#desktop-controls[hidden] { display: none; }
#desktop-controls p { margin: 4px 0 10px; font-size: 15px; }
#desktop-controls .small { font-size: 12px; margin-bottom: 0; }
#desktop-controls button { margin: 0 0 8px; }
#desktop-controls .dismiss-controls {
  position: absolute;
  top: 6px;
  right: 8px;
  margin: 0;
  padding: 4px 8px;
  border: 0;
  background: transparent;
  color: inherit;
  font-size: 22px;
  cursor: pointer;
}
#match-info, #match-loading { display: none; }
.playing #match-loading {
  display: grid;
  position: fixed;
  inset: 0;
  place-content: center;
  background: #0b0d12;
  color: #edf5ff;
  text-align: center;
  z-index: 19;
}
#match-loading p { margin: 8px; }

/* Touch is enabled only after a Discord mobile SDK handshake. */
body:not(.discord-mobile) #touch { display: none !important; }
.discord-mobile #touch { -webkit-user-select: none; user-select: none; }
.discord-mobile .touch-button { min-width: 44px; min-height: 44px; }
.discord-mobile .touch-button .caption { white-space: nowrap; }

/* Compact two-thumb HUD, independent of the legacy controller artwork. */
.discord-mobile #touch .touch-button {
  width: 46px; height: 46px; min-width: 44px; min-height: 44px;
  border: 1px solid #ffffff70; border-radius: 50%;
  background: #14202d55; box-shadow: none;
  color: #fff; opacity: .78; display: flex; align-items: center; justify-content: center;
  font-family: system-ui, sans-serif;
}
.discord-mobile #touch .touch-button.pressed { background: #d5ecff55; opacity: 1; }
.discord-mobile #touch .glyph { font-size: 23px; font-weight: 500; }
.discord-mobile #touch .caption { position: absolute; top: auto; bottom: 4px; margin: 0; font: 600 7px/1 system-ui; letter-spacing: 0; }
.discord-mobile #touch .glyph { transform: translateY(-4px); }
.discord-mobile #touch .fps-fire { width: 64px; height: 64px; right: calc(82px + env(safe-area-inset-right)); bottom: calc(126px + env(safe-area-inset-bottom)); }
.discord-mobile #touch .fps-fire .glyph { font-size: 36px; }
.discord-mobile #touch .fps-jump { right: calc(18px + env(safe-area-inset-right)); bottom: calc(78px + env(safe-area-inset-bottom)); }
.discord-mobile #touch.touch-firing .fps-jump { right: auto; bottom: auto; }
.discord-mobile #touch .fps-crouch { right: calc(74px + env(safe-area-inset-right)); bottom: calc(22px + env(safe-area-inset-bottom)); }
.discord-mobile #touch .fps-melee { right: calc(18px + env(safe-area-inset-right)); bottom: calc(22px + env(safe-area-inset-bottom)); }
.discord-mobile #touch .fps-reload { right: calc(134px + env(safe-area-inset-right)); bottom: calc(22px + env(safe-area-inset-bottom)); }
/* Keep the ammo HUD tappable; show the action beside it without covering it. */
.discord-mobile #touch .fps-weapon-hud,
.discord-mobile #touch .fps-weapon-hud.pressed {
  left: max(6vw, env(safe-area-inset-left)); top: max(4vh, env(safe-area-inset-top));
  width: 16vw; height: 16vh; opacity: 1; border: 0; background: transparent;
}
.discord-mobile #touch .weapon-swap-badge {
  position: absolute; left: calc(100% + 8px); top: calc(50% - 22px);
  width: 44px; height: 44px; box-sizing: border-box;
  display: flex; align-items: center; justify-content: center;
  border: 1px solid #ffffff70; border-radius: 50%;
  background: #14202d99; color: #fff; opacity: .9;
}
.discord-mobile #touch .fps-weapon-hud.pressed .weapon-swap-badge { background: #d5ecff55; opacity: 1; }
.discord-mobile #touch .fps-zoom { right: calc(18px + env(safe-area-inset-right)); bottom: calc(142px + env(safe-area-inset-bottom)); }
.discord-mobile #touch .fps-grenade { left: calc(148px + env(safe-area-inset-left)); bottom: calc(34px + env(safe-area-inset-bottom)); }
.discord-mobile #touch .fps-grenade-type { left: calc(204px + env(safe-area-inset-left)); bottom: calc(34px + env(safe-area-inset-bottom)); }
.discord-mobile #touch .touch-stick { opacity: 0; width: 96px; height: 96px; left: calc(28px + env(safe-area-inset-left)); bottom: calc(28px + env(safe-area-inset-bottom)); border: 1px solid #ffffff50; background: #14202d22; box-shadow: none; }
.discord-mobile #touch .touch-knob { left: 50%; top: 50%; width: 40px; height: 40px; margin: -20px 0 0 -20px; border: 1px solid #ffffff80; background: #d2e9fa33; box-shadow: none; }
.discord-mobile #touch .touch-stick.active { opacity: 1; }

/* A DOM pause menu keeps controls readable and tappable in the mobile client. */
#controls-open {
  display: none; position: fixed; z-index: 20;
  top: max(8px, env(safe-area-inset-top)); right: max(8px, env(safe-area-inset-right));
  min-width: 44px; min-height: 44px; padding: 6px 10px;
  border: 1px solid #ffffff70; border-radius: 10px;
  background: #10182288; color: #fff; font: 600 10px/1.2 system-ui;
  touch-action: manipulation;
}
#controls-open span { display: block; }
#controls-open span:first-child { font-size: 22px; }
.discord-mobile.playing #controls-open { display: block; }
.controls-open #controls-open, .controls-open #touch { display: none !important; }
#control-settings:where(body:not(.playing) *) {
  position: fixed; inset: 0; z-index: 40; display: grid; place-items: center;
  padding: max(8px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right))
    max(8px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
  background: #05080bba; color: #f1f5fa; font-family: system-ui, sans-serif;
  box-sizing: border-box; touch-action: manipulation;
}
#control-settings:where(body:not(.playing) *) .controls-panel {
  width: min(100%, 520px); box-sizing: border-box; padding: clamp(12px, 3vh, 24px);
  border: 1px solid #455466; border-radius: 16px; background: #141c27;
  box-shadow: 0 16px 64px #0008;
}
#control-settings:where(body:not(.playing) *) h2 { margin: 0; font-size: 22px; line-height: 1.2; }
#control-settings:where(body:not(.playing) *) header p { margin: 6px 0 14px; color: #b8c5d6; font-size: 13px; }
#control-settings:where(body:not(.playing) *) .sensitivity-options { display: grid; gap: 8px; }
#control-settings:where(body:not(.playing) *) .sensitivity-row { display: grid; grid-template-columns: 1fr auto; gap: 0 16px; color: #f1f5fa; font-size: 14px; }
#control-settings:where(body:not(.playing) *) output { color: #7dd3ff; font-variant-numeric: tabular-nums; }
#control-settings:where(body:not(.playing) *) .graphics-option { display: grid; gap: 4px; margin-top: 8px; font-size: 14px; }
#control-settings:where(body:not(.playing) *) .graphics-option select { width: 100%; min-height: 40px; padding: 6px 10px; border: 1px solid #485971; border-radius: 8px; background: #202c3c; color: #edf5ff; font: inherit; }
#control-settings:where(body:not(.playing) *) .graphics-option output { font-size: 12px; }
#control-settings:where(body:not(.playing) *) input[type="range"] { grid-column: 1 / -1; width: 100%; min-height: 44px; margin: 0; padding: 0; accent-color: #3cb6ee; touch-action: auto; }
#control-settings:where(body:not(.playing) *) .controls-note { margin: 10px 0 14px; color: #aab8ca; font-size: 12px; }
#control-settings:where(body:not(.playing) *) footer { display: flex; gap: 12px; }
#control-settings:where(body:not(.playing) *) button { flex: 1; min-height: 44px; padding: 8px 12px; margin: 0; border: 1px solid #485971; border-radius: 10px; background: #202c3c; color: #edf5ff; font: 600 14px/1.2 system-ui; cursor: pointer; touch-action: manipulation; }
#control-settings:where(body:not(.playing) *) button.primary { background: #3cb6ee; border-color: #3cb6ee; color: #092333; }
#control-settings:where(body:not(.playing) *) :focus-visible { outline: 3px solid #b3e5ff; outline-offset: 2px; }
@media (max-height: 440px) {
  #control-settings:where(body:not(.playing) *) .controls-panel { padding: 10px 16px; }
  #control-settings:where(body:not(.playing) *) header p, #control-settings:where(body:not(.playing) *) .controls-note { display: none; }
  #control-settings:where(body:not(.playing) *) h2 { margin-bottom: 6px; font-size: 20px; }
  #control-settings:where(body:not(.playing) *) .sensitivity-options { gap: 2px; }
  #control-settings:where(body:not(.playing) *) input[type="range"] { min-height: 32px; }
  #control-settings:where(body:not(.playing) *) .graphics-option { gap: 2px; margin-top: 2px; }
  #control-settings:where(body:not(.playing) *) .graphics-option select { min-height: 36px; }
  #control-settings:where(body:not(.playing) *) footer { margin-top: 8px; }
  #control-settings:where(body:not(.playing) *) button { min-height: 38px; }
}
@media (max-height: 350px) {
  #control-settings:where(body:not(.playing) *) .controls-panel { padding: 10px 16px; }
  #control-settings:where(body:not(.playing) *) header p { margin: 4px 0 8px; }
  #control-settings:where(body:not(.playing) *) .controls-note { margin: 4px 0 8px; }
  #control-settings:where(body:not(.playing) *) .sensitivity-options { gap: 2px; }
}

#control-settings:where(body.playing *) {
  position: fixed; inset: 0; z-index: 40; display: grid; place-items: center;
  padding: max(24px, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right))
    max(24px, env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left));
  background: #02081355; color: #e6f5ff; font-family: Arial,Helvetica,sans-serif;
  box-sizing: border-box; touch-action: manipulation;
}
#control-settings:where(body.playing *) .controls-panel {
  width: min(100%, 520px); box-sizing: border-box; padding: clamp(12px, 3vh, 24px);
  max-height:100%; overflow:auto; border:1px solid #3989c5; border-radius:3px; background:#021027b3;
}
#control-settings:where(body.playing *) h2 { margin:0; font-size:24px; font-weight:400; line-height:1.2; text-transform:none; letter-spacing:.05em; }
.controls-title-art { display:none; width:180px; height:28px; background:var(--halo-settings) left center/contain no-repeat; }
.halo-menu-assets.playing .controls-title-art { display:block; }
#control-settings:where(body.playing *) header p { margin:10px 0 18px; color:#a9c4de; font-size:14px; }
#control-settings:where(body.playing *) .sensitivity-options { display: grid; gap: 8px; }
#control-settings:where(body.playing *) .sensitivity-row { display: grid; grid-template-columns: 1fr auto; gap: 0 16px; color: #e6f5ff; font-size: 15px; }
#control-settings:where(body.playing *) output { color: #7dd3ff; font-variant-numeric: tabular-nums; }
#control-settings:where(body.playing *) .graphics-option { display: grid; gap: 4px; margin-top: 8px; font-size: 14px; }
#control-settings:where(body.playing *) .graphics-option select { width: 100%; min-height: 40px; padding: 6px 10px; border: 1px solid #3989c5; border-radius: 3px; background: #071d36; color: #e6f5ff; font: inherit; }
#control-settings:where(body.playing *) .graphics-option output { font-size: 12px; }
#control-settings:where(body.playing *) input[type="range"] { grid-column: 1 / -1; width: 100%; min-height: 44px; margin: 0; padding: 0; accent-color: #3cb6ee; touch-action: auto; }
#control-settings:where(body.playing *) .controls-note { margin: 10px 0 14px; color: #aab8ca; font-size: 12px; }
#control-settings:where(body.playing *) footer { display: flex; gap: 12px; }
#control-settings:where(body.playing *) button { flex:1; display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:8px 12px; margin:0; border:1px solid #3989c5; border-radius:3px; background:#071d36; color:#e6f5ff; font:16px/1.2 Arial,Helvetica,sans-serif; cursor:pointer; touch-action:manipulation; }
#control-settings:where(body.playing *) :focus-visible { outline: 3px solid #b3e5ff; outline-offset: 2px; }
@media (max-height: 440px) {
  #control-settings:where(body.playing *) .controls-panel { padding: 10px 16px; }
  #control-settings:where(body.playing *) header p, #control-settings:where(body.playing *) .controls-note { display: none; }
  #control-settings:where(body.playing *) h2 { margin-bottom: 6px; font-size: 20px; }
  #control-settings:where(body.playing *) .sensitivity-options { gap: 2px; }
  #control-settings:where(body.playing *) input[type="range"] { min-height: 32px; }
  #control-settings:where(body.playing *) .graphics-option { gap: 2px; margin-top: 2px; }
  #control-settings:where(body.playing *) .graphics-option select { min-height: 36px; }
  #control-settings:where(body.playing *) footer { margin-top: 8px; }
  #control-settings:where(body.playing *) button { min-height: 44px; }
}
@media (max-height: 350px) {
  #control-settings:where(body.playing *) .controls-panel { padding: 10px 16px; }
  #control-settings:where(body.playing *) header p { margin: 4px 0 8px; }
  #control-settings:where(body.playing *) .controls-note { margin: 4px 0 8px; }
  #control-settings:where(body.playing *) .sensitivity-options { gap: 2px; }
}

/* Original Coop gesture controls for Mario; no gameplay explanation overlay. */
.mario-move-stick,.mario-touch-crouch,.mario-touch-center,.mario-touch-camera{display:none}
.discord-mobile #touch.mario-touch .touch-button,.discord-mobile #touch.mario-touch .touch-stick{display:none}
.discord-mobile #touch.mario-touch .mario-move-stick{display:block;position:absolute;width:116px;height:116px;margin:-58px;border:1px solid #ffffff55;border-radius:50%;background:#15344433;pointer-events:none}
.discord-mobile #touch.mario-touch .mario-move-stick[hidden]{display:none}
.mario-move-stick span{position:absolute;left:34px;top:34px;width:48px;height:48px;border:2px solid #ffffff99;background:#ffffff29;border-radius:50%}
.discord-mobile #touch.mario-touch .mario-touch-crouch,.discord-mobile #touch.mario-touch .mario-touch-center{display:block;position:absolute;width:58px;height:58px;border-radius:50%;border:1px solid #ffffff6b;color:#fff;background:#15344480;touch-action:none;padding:0;text-shadow:0 1px 2px #0005;backdrop-filter:blur(4px)}
.mario-touch-crouch{right:max(22px,env(safe-area-inset-right));bottom:calc(30px + env(safe-area-inset-bottom));font-size:22px}
.discord-mobile #touch.mario-touch .mario-touch-center{left:max(22px,env(safe-area-inset-left));bottom:calc(30px + env(safe-area-inset-bottom));width:44px;height:44px}
@media(max-height:520px){.discord-mobile #touch.mario-touch .mario-touch-center{bottom:165px}}



/* CE menu art and bitmap type are read from the local, verified ui.map. */
.ce-text > .sr-only, .sr-only, .halo-menu-assets.playing .controls-title-text { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.ce-word { white-space:nowrap; }
.ce-text span { color:inherit; }
.ce-glyph { position:relative; display:inline-block; height:1em; vertical-align:-.19em; }
.ce-glyph::before { content:""; position:absolute; top:0; left:var(--ce-overhang); width:var(--ce-cell); height:1em; background:currentColor; mask-image:var(--ce-atlas); mask-size:var(--ce-atlas-size); mask-position:var(--ce-position); mask-repeat:no-repeat; }
#match-menu-open { position:fixed; z-index:20; top:max(8px,env(safe-area-inset-top)); right:max(8px,env(safe-area-inset-right)); display:none; width:44px; height:44px; padding:0; border:0; background:transparent; color:#fff; font:24px Arial,sans-serif; text-shadow:0 1px 3px #000; cursor:pointer; }
.discord-mobile.playing.match-menu-ready #match-menu-open, .playing.match-menu-ready #match-menu-open:focus-visible { display:block; }
.match-menu-ready #controls-open, .match-menu-open #match-menu-open, .controls-open #match-menu-open, .match-menu-open #touch { display:none !important; }
#match-menu { position:fixed; inset:0; z-index:40; color:#fff; font:24px/1.3 Arial,sans-serif; background:#02081844; display:grid; place-items:center; box-sizing:border-box; padding:32px; overflow:hidden; }
.mm { box-sizing:border-box; width:min(100%,480px); max-height:min(80dvh,680px); min-height:0; display:flex; flex-direction:column; gap:14px; padding:20px 24px; background:#061631ba; border:1px solid #2896ff88; border-radius:0; }
.mm.mm-detail { width:min(100%,680px); height:min(80dvh,680px); }
.halo-menu-assets :is(.mm,#control-settings:where(body.playing *) .controls-panel) { border:14px solid transparent; border-image:var(--halo-panel) 14 stretch; }
.mm header { display:grid; flex:none; gap:6px; }
.mm h2 { margin:0 0 4px; font:inherit; color:#2896ff; }
.mm-status { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; margin:0; font-size:20px; }
.mm-status > .mm-value { color:#2896ff; }
.mm-content { overflow:auto; scrollbar-width:thin; scrollbar-color:#2896ff transparent; min-height:0; }
.mm-list { display:grid; }
#match-menu .mm-choice, #control-settings:where(body.playing *) button { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; box-sizing:border-box; min-height:44px; padding:6px 16px; border:0; border-radius:0; background:transparent; color:#2896ff; font:inherit; text-align:left; cursor:pointer; touch-action:manipulation; }
#match-menu .mm-choice:focus, #match-menu .mm-choice.on, #control-settings:where(body.playing *) button:focus-visible { background-color:#153c7455; color:#fff; outline:1px solid #2896ff; outline-offset:-1px; }
.halo-menu-assets #match-menu .mm-choice:focus, .halo-menu-assets #match-menu .mm-choice.on, .halo-menu-assets #control-settings:where(body.playing *) button:focus-visible { background-image:var(--halo-selection); background-size:100% 100%; color:#fff; }
#match-menu button:disabled { opacity:.45; cursor:default; }
.mm-description { margin-top:16px; font-size:20px; line-height:1.5; }
.mm-description p { margin:0 0 6px; }
.mm-note { margin:8px 0; color:#a9c8ec; font-size:20px; }
.mm-game-code { display:block; color:#fff; font:600 30px/1.4 monospace; letter-spacing:.12em; user-select:text; }
[data-game-settings] fieldset { display:grid; gap:12px; padding:0; margin:16px 0 0; border:0; }
[data-game-settings] label { display:grid; gap:6px; color:#a9c8ec; font-size:20px; }
[data-game-settings] :is(select,input) { width:100%; min-height:40px; box-sizing:border-box; padding:6px 10px; background:#07182c; color:#fff; border:1px solid #2896ff88; font:18px Arial,sans-serif; }
.mm-headline { margin:0 0 16px; font-size:22px; }
.mm-prompts { display:flex; flex:none; flex-wrap:wrap; justify-content:space-between; gap:12px; font-size:20px; color:#fff; }
.mm-prompts > span { display:flex; align-items:center; gap:8px; }
.mm-pad { display:inline-block; flex:none; width:24px; height:24px; background-position:center; background-size:contain; background-repeat:no-repeat; }
.mm-pad-a { background-image:var(--halo-a); }
.mm-pad-b { background-image:var(--halo-b); }
.mm-back { flex:none; max-width:256px; margin-top:auto; }
.mm-pair { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.mm-team-head { display:flex; justify-content:space-between; color:#2896ff; margin-bottom:8px; }
.mm-table { width:100%; border-collapse:collapse; font-size:22px; }
.mm-table th { color:#2896ff; font-size:20px; font-weight:normal; text-align:right; padding:4px 8px; }
.mm-table td { height:32px; padding:2px 8px; text-align:right; }
.mm-table th:first-child, .mm-table th:nth-last-child(2), .mm-table td.mm-rank + td, .mm-table td:first-child { text-align:left; }
.mm-table tr.mm-me { background:#1d569155; color:#fff; }
.mm-rank { width:1%; color:#2896ff; }
.mm-name { display:flex; align-items:center; flex-wrap:wrap; gap:10px; overflow-wrap:anywhere; }
.mm-tag { font-size:18px; color:#2896ff; }
.mm-free { font-style:normal; }
.mm-cells { display:flex; gap:4px; margin:0 0 16px; }
.mm-cells i { flex:1; height:4px; background:#163b68; }
.mm-cells i.on { background:#2896ff; }
#control-settings:where(body.playing *) { font:24px/1.4 Arial,sans-serif; background:#02081844; }
#control-settings:where(body.playing *) .controls-panel { width:min(100%,520px); padding:28px; background:#061631ba; border-radius:0; }
#control-settings:where(body.playing *) header p { font-size:20px; color:#a9c8ec; margin:12px 0 24px; }
#control-settings:where(body.playing *) h2 { color:#2896ff; letter-spacing:0; font-size:28px; }
#control-settings:where(body.playing *) .sensitivity-options { gap:18px; }
#control-settings:where(body.playing *) .sensitivity-row, #control-settings:where(body.playing *) .graphics-option { font-size:22px; color:#2896ff; }
#control-settings:where(body.playing *) .graphics-option { margin-top:20px; }
#control-settings:where(body.playing *) .graphics-option select { border:1px solid #2896ff; border-radius:0; background:#061631; color:#fff; font:18px Arial,sans-serif; min-height:44px; }
#control-settings:where(body.playing *) output { color:#fff; }
#control-settings:where(body.playing *) .graphics-option output, #control-settings:where(body.playing *) .controls-note { font-size:18px; }
#control-settings:where(body.playing *) input[type="range"] { appearance:none; background:transparent; cursor:pointer; }
#control-settings:where(body.playing *) input[type="range"]::-webkit-slider-runnable-track { height:2px; background:#2896ff80; }
#control-settings:where(body.playing *) input[type="range"]::-webkit-slider-thumb { appearance:none; width:16px; height:20px; margin-top:-9px; border:0; border-radius:0; background:#fff; }
.halo-menu-assets #control-settings:where(body.playing *) input[type="range"]::-webkit-slider-thumb { background:var(--halo-arrow-right) center/contain no-repeat; }
#control-settings:where(body.playing *) input[type="range"]::-moz-range-track { height:2px; background:#2896ff80; }
#control-settings:where(body.playing *) input[type="range"]::-moz-range-thumb { width:16px; height:20px; border:0; border-radius:0; background:#fff; }
.halo-menu-assets #control-settings:where(body.playing *) input[type="range"]::-moz-range-thumb { background:var(--halo-arrow-right) center/contain no-repeat; }
#control-settings:where(body.playing *) footer { display:grid; gap:0; margin-top:20px; }
#control-settings:where(body.playing *) button { font-size:24px; }
#control-settings:where(body.playing *) :is(input,select):focus-visible { outline:1px solid #fff; outline-offset:3px; }
@media (hover:hover) {
 #match-menu .mm-choice:not(:disabled):hover, #control-settings:where(body.playing *) button:hover { color:#fff; background-color:#153c7455; }
 .halo-menu-assets #match-menu .mm-choice:not(:disabled):hover, .halo-menu-assets #control-settings:where(body.playing *) button:hover { background-image:var(--halo-selection); background-size:100% 100%; }
}
@media(max-width:700px) {
 #match-menu { padding:24px; font-size:22px; }
 .mm { padding:16px; }
 .mm-pair { grid-template-columns:1fr; }
 .mm-table { font-size:20px; }
}
@media(max-height:650px) {
 .mm { gap:12px; padding:16px 24px; }
 .mm h2 { margin-bottom:4px; }
 .mm-description { margin-top:12px; }
 .mm-description p { margin-bottom:4px; }
 #control-settings:where(body.playing *) .controls-panel { padding:16px; }
 #control-settings:where(body.playing *) header p { margin:8px 0; }
 #control-settings:where(body.playing *) .sensitivity-options { gap:4px; }
 #control-settings:where(body.playing *) .graphics-option { margin-top:8px; }
}

/* CE pause widgets use pausebox2 and menu_bkds, not the shell's list_field. */
@media (min-width:768px) and (pointer:fine) {
 #match-menu, #match-menu *, #match-menu-open, #control-settings:where(body.playing *), #control-settings:where(body.playing *) * { text-transform:none!important; }
 #match-menu, #control-settings:where(body.playing *) { background:#0002; }
 #match-menu { font-size:27px; }
 .mm, #control-settings:where(body.playing *) .controls-panel { position:relative; isolation:isolate; border:0!important; border-image:none!important; background:transparent; box-shadow:none; }
 .mm::before, #control-settings:where(body.playing *) .controls-panel::before { content:""; position:absolute; z-index:-1; inset:0; pointer-events:none; border:solid transparent; border-width:24px 24px 44px; border-image:var(--halo-pause-panel) 16 16 29 fill stretch; opacity:.86; }
 .mm { width:380px; max-height:calc(100dvh - 96px); gap:0; padding:30px 24px 0; }
 .mm.mm-detail { width:min(760px,100%); height:min(680px,calc(100dvh - 96px)); }
 .mm.mm-sheet { padding-top:26px; }
 .mm-pause .mm-content { flex:none; padding:0 0 24px; }
 .mm-list { gap:8px; }
 #match-menu .mm-choice { min-height:44px; padding:4px 14px; text-transform:none; }
 .halo-menu-assets #match-menu .mm-choice:is(:focus,:hover,.on), .halo-menu-assets #control-settings:where(body.playing *) button:is(:focus-visible,:hover) { color:#fff; background-color:transparent; background-image:var(--halo-pause-selection); background-size:100% 100%; outline:0; }
 .mm-prompts { min-height:44px; align-items:center; font-size:21px; color:#2896ff; text-transform:none; gap:16px; }
 .mm-prompts > span { gap:3px; }
 .mm header { gap:4px; padding:0 8px 16px; }
 .mm h2 { text-transform:none; }
 .mm-status { font-size:21px; }
 .mm-sheet .mm-content { flex:1; padding:0 8px; }
 .mm-sheet .mm-back { margin:12px 0; max-width:220px; }
 #control-settings:where(body.playing *) .controls-panel { width:590px; padding:28px 32px 0; overflow:auto; }
 #control-settings:where(body.playing *) h2 { font-size:30px; text-transform:none; }
 .halo-menu-assets #control-settings:where(body.playing *) .controls-title-art { display:none; }
 .halo-menu-assets #control-settings:where(body.playing *) .controls-title-text { position:static; width:auto; height:auto; clip:auto; clip-path:none; overflow:visible; white-space:normal; }
 #control-settings:where(body.playing *) header p { font-size:18px; margin:10px 0 20px; }
 #control-settings:where(body.playing *) .sensitivity-row { grid-template-columns:1fr auto; gap:0 12px; font-size:24px; text-transform:none; }
 #control-settings:where(body.playing *) .sensitivity-options { gap:8px; }
 #control-settings:where(body.playing *) input[type="range"] { min-height:32px; }
 #control-settings:where(body.playing *) .graphics-option { margin-top:14px; font-size:24px; text-transform:none; }
 #control-settings:where(body.playing *) .graphics-option select { background:transparent; border:0; border-bottom:1px solid #2896ff; font-size:18px; }
 #control-settings:where(body.playing *) .graphics-option output { text-transform:none; font-size:18px; }
 #control-settings:where(body.playing *) .controls-note { font-size:16px; margin:12px 0; }
 #control-settings:where(body.playing *) footer { grid-template-columns:1fr auto; gap:12px; min-height:44px; align-items:center; margin:16px -8px 0; }
 #control-settings:where(body.playing *) button { font-size:21px; width:auto; text-transform:none; }
}
#match-menu:has(.mm-held-scores) { pointer-events:none; background:transparent; }
.mm-held-scores .mm-table { font-size:20px; }
.mm-held-scores .mm-table td { height:24px; }
.mm-held-scores .mm-note, .mm-held-scores .mm-headline { display:none; }
@media (min-width:768px) and (pointer:fine) {
 .mm.mm-held-scores { height:auto; max-height:calc(100dvh - 48px); }
 .mm-held-scores h2 { display:none; }
 .mm-held-scores .mm-table, .mm-held-scores .mm-table th { font-size:18px; line-height:1; }
 .mm-held-scores .mm-table td { height:20px; padding:1px 8px; }
}

body:not(.playing) #control-settings .mm-pad { display:none; }

/* Only the in-game map loader uses Halo artwork. */
.match-loading-art, .match-loading-light { display:none; }
@media (min-width:768px) and (pointer:fine) {
 .playing #match-loading { background:#000; padding:32px; box-sizing:border-box; gap:26px; }
 #match-loading, #match-loading * { text-transform:none; }
 .halo-menu-assets .match-loading-art { display:grid; justify-items:center; gap:22px; }
 .match-loading-logo { width:min(380px,44vw); aspect-ratio:640/251; background:var(--halo-logo) center/contain no-repeat; }
 .match-loading-map { width:min(480px,52vw); aspect-ratio:2/1; background:var(--halo-map-bloodgulch) center/contain no-repeat; }
 #match-loading .match-loading-caption { width:min(480px,70vw); justify-self:center; }
 #match-loading-map { color:#a9c8ec; font:24px/1.2 Arial,sans-serif; }
 #match-loading-text { color:#5da9ed; font:20px/1.3 Arial,sans-serif; }
 #match-loading .match-loading-light { display:block; position:relative; height:2px; margin:22px 0 0; overflow:hidden; background:#12283e; }
 .match-loading-light::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent,#69baff,transparent); transform:translateX(-100%); animation:halo-loading-light 2.8s ease-in-out infinite; }
 @keyframes halo-loading-light { to { transform:translateX(100%); } }
 @media (max-height:650px) { .playing #match-loading { gap:16px; } .match-loading-logo { width:280px; } .match-loading-map { width:360px; } .halo-menu-assets .match-loading-art { gap:12px; } }
 @media (prefers-reduced-motion:reduce) { .match-loading-light::after { animation:none; transform:none; } }
}

/* Brief CE-font messages leave the native health, weapon and motion HUD clear. */
#match-notice { display:none; position:fixed; z-index:19; top:max(12%,calc(env(safe-area-inset-top) + 12px)); left:max(24px,env(safe-area-inset-left)); right:max(24px,env(safe-area-inset-right)); pointer-events:none; text-align:center; color:#bdd9ff; font:clamp(24px,3.5vw,32px)/1.2 Arial,sans-serif; text-shadow:1px 1px 2px #000; }
.playing.match-menu-ready #match-notice:not([hidden]) { display:block; }
.match-menu-open #match-notice:not([data-waiting="true"]), .controls-open #match-notice:not([data-waiting="true"]) { visibility:hidden; }
#match-notice[data-waiting="true"] { z-index:45; top:max(24px,env(safe-area-inset-top)); right:auto; width:max-content; max-width:35vw; margin:0; box-sizing:border-box; padding:8px 20px; font-size:24px; text-align:left; isolation:isolate; }
.halo-menu-assets #match-notice[data-waiting="true"] { border:14px solid transparent; }
.halo-menu-assets #match-notice[data-waiting="true"]::before { content:""; position:absolute; z-index:-1; inset:-14px; border:solid transparent; border-width:16px 16px 29px; border-image:var(--halo-pause-panel) 16 16 29 fill stretch; opacity:.86; }
#match-notice [data-halo-font] { font-size:clamp(20px,2.8vw,26px); margin-top:6px; }
@media (max-height:450px) {
 #match-menu { padding:12px; }
 .mm.mm-detail { height:calc(100dvh - 24px); max-height:calc(100dvh - 24px); gap:6px; padding:10px 16px; }
 .mm-detail header { gap:2px; }
 .mm-detail .mm-note, .mm-detail .mm-headline { display:none; }
 .mm-detail .mm-status { margin:0; }
}

/* Post-game results keep the room active while the host prepares the next match. */
.mm.mm-results { width:min(960px,88vw); height:auto; max-height:80dvh; padding:24px 32px; gap:18px; border:1px solid #7f9fbb60; background:linear-gradient(135deg,#253d54e8,#102136ed); box-shadow:0 16px 60px #0008; font:18px/1.4 Arial,sans-serif; }
#match-menu .mm-results { border-image:none; }
.mm-results .mm-table { color:#edf3f8; }
.mm-results h2 { color:#edf3f8; font-size:26px; letter-spacing:.04em; }
.mm-results .mm-status,.mm-results .mm-note,.mm-results .mm-table,.mm-results .mm-table th { font-size:16px; }
.mm-results .mm-table th,.mm-results .mm-tag,.mm-results .mm-rank,.mm-results .mm-value { color:#adc5da; }
.mm-results .mm-headline { font-size:18px; }
.mm-results .mm-table tr.mm-me { background:#dce7ed; color:#172637; }
.mm-result-actions { display:flex; justify-content:space-between; gap:24px; }
#match-menu .mm-results .mm-choice { color:#edf3f8; border:1px solid #7f9fbb60; width:auto; min-width:180px; }
#match-menu .mm-results .mm-choice:focus { color:#172637; background:#dce7ed; background-image:none; outline-color:#fff; }

/* Diagnostic reports stay outside gameplay. */
.playing #log-view, .playing #show-log, .playing #log-text { display:none !important; }

.discord-mobile #touch.mario-touch .mario-touch-camera { display:block; position:absolute; right:min(5.625vw,7.5vh); bottom:calc(min(10vw,13.3333vh) - 22px); width:max(44px,min(10vw,13.3333vh)); height:44px; border:0; background:transparent; padding:0; }
.discord-mobile #touch.mario-touch .mario-touch-camera:focus-visible { outline:2px solid white; }

/* Keep crouch above the tappable camera indicator. */
.discord-mobile #touch.mario-touch .mario-touch-crouch { bottom:calc(90px + env(safe-area-inset-bottom)); }

#restart-notice { position:fixed; z-index:100; top:20px; left:50%; transform:translateX(-50%); width:max-content; max-width:calc(100vw - 40px); box-sizing:border-box; padding:12px 24px; color:#fff; text-align:center; font:24px/1.4 Arial,sans-serif; text-shadow:0 2px 3px #000; background:#061631ed; border:1px solid #2896ff; pointer-events:none; }
.halo-menu-assets #restart-notice { border:14px solid transparent; border-image:var(--halo-panel) 14 fill stretch; background:none; }
#restart-notice [data-halo-font] { font-size:18px; }
/* The result card keeps its board at natural height; it scrolls only when the card reaches its limit. */
.mm.mm-results .mm-content { flex:0 1 auto; }
