/*
 * UI revision 2 — gameplay signal rail, pause signal and expedition dossier.
 * Presentation only: HUD values and gameplay state continue to be owned by app.js/game.js.
 */

.app-shell[data-ui-revision="2"] .game-frame {
  border-color: rgba(135, 229, 247, 0.3);
  border-radius: 5px 24px 5px 24px;
  background: var(--ui-deep);
  box-shadow:
    0 30px 90px rgba(0, 5, 22, 0.5),
    inset 0 1px rgba(255, 255, 255, 0.045);
}

.app-shell[data-ui-revision="2"] .game-frame::before {
  border-radius: inherit;
  box-shadow:
    inset 0 0 86px rgba(0, 8, 30, 0.28),
    inset 0 1px rgba(209, 250, 255, 0.04);
}

/* HUD: three stable regions — run data, route, survival. */
.app-shell[data-ui-revision="2"] .game-hud[data-ui-layout="signal-rail"] {
  grid-template-columns: minmax(238px, 0.8fr) minmax(320px, 1.2fr) minmax(300px, 0.9fr);
  gap: 9px;
  padding: clamp(10px, 1.25vw, 17px);
}

.app-shell[data-ui-revision="2"] .hud-left,
.app-shell[data-ui-revision="2"] .hud-right,
.app-shell[data-ui-revision="2"] .stage-progress {
  position: relative;
  min-height: 54px;
  border: 1px solid rgba(135, 226, 244, 0.16);
  background:
    linear-gradient(100deg, rgba(4, 16, 38, 0.88), rgba(7, 28, 56, 0.6)),
    rgba(3, 13, 31, 0.7);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.035), 0 12px 28px rgba(0, 7, 27, 0.17);
  backdrop-filter: blur(13px);
}

.app-shell[data-ui-revision="2"] .hud-left,
.app-shell[data-ui-revision="2"] .hud-right {
  display: flex;
  align-items: stretch;
}

.app-shell[data-ui-revision="2"] .hud-left {
  gap: 0;
  padding-left: 8px;
  border-radius: 3px 13px 3px 13px;
  clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 0 100%);
}

.app-shell[data-ui-revision="2"] .hud-left::before,
.app-shell[data-ui-revision="2"] .hud-right::before,
.app-shell[data-ui-revision="2"] .stage-progress::before {
  content: "";
  position: absolute;
  z-index: 2;
  pointer-events: none;
  background: var(--ui-cyan);
  box-shadow: 0 0 11px rgba(82, 222, 244, 0.38);
}

.app-shell[data-ui-revision="2"] .hud-left::before {
  left: -1px;
  top: 11px;
  width: 2px;
  height: 28px;
}

.app-shell[data-ui-revision="2"] .score-block,
.app-shell[data-ui-revision="2"] .distance-block,
.app-shell[data-ui-revision="2"] .combo-block,
.app-shell[data-ui-revision="2"] .life-block,
.app-shell[data-ui-revision="2"] .shield-block,
.app-shell[data-ui-revision="2"] .hud-button {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

.app-shell[data-ui-revision="2"] .score-block,
.app-shell[data-ui-revision="2"] .distance-block {
  min-width: 0;
  flex: 1 1 0;
  padding: 9px 12px;
}

.app-shell[data-ui-revision="2"] .distance-block {
  border-left: 1px solid rgba(135, 226, 244, 0.11);
}

.app-shell[data-ui-revision="2"] .score-block small,
.app-shell[data-ui-revision="2"] .distance-block small,
.app-shell[data-ui-revision="2"] .combo-block small {
  margin-bottom: 5px;
  color: rgba(203, 239, 247, 0.43);
  font-size: 6px;
  letter-spacing: 0.22em;
}

.app-shell[data-ui-revision="2"] .score-block strong,
.app-shell[data-ui-revision="2"] .distance-block strong {
  color: var(--ui-text);
  font-size: clamp(15px, 1.4vw, 20px);
  letter-spacing: 0.07em;
}

.app-shell[data-ui-revision="2"] .distance-block strong {
  color: rgba(225, 248, 252, 0.78);
  font-size: clamp(12px, 1.15vw, 17px);
}

.app-shell[data-ui-revision="2"] .stage-progress {
  align-self: stretch;
  min-width: 0;
  padding: 10px 16px 9px;
  border-radius: 12px 3px 12px 3px;
  clip-path: polygon(12px 0, 100% 0, 100% calc(100% - 12px), calc(100% - 12px) 100%, 0 100%, 0 12px);
}

.app-shell[data-ui-revision="2"] .stage-progress::before {
  top: -1px;
  left: 24px;
  width: 48px;
  height: 1px;
}

.app-shell[data-ui-revision="2"] .stage-meta {
  display: grid;
  grid-template-columns: 30px minmax(0, 0.7fr) minmax(0, 1.3fr);
  align-items: center;
  gap: 8px;
  margin-bottom: 7px;
}

.app-shell[data-ui-revision="2"] .stage-meta span {
  color: var(--ui-cyan);
  font-size: 7px;
  letter-spacing: 0.18em;
}

.app-shell[data-ui-revision="2"] .stage-meta strong {
  min-width: 0;
  overflow: hidden;
  color: var(--ui-text);
  font-size: 9px;
  letter-spacing: 0.08em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.app-shell[data-ui-revision="2"] .stage-meta em {
  min-width: 0;
  overflow: hidden;
  color: rgba(210, 240, 247, 0.55);
  font-size: 7px;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.app-shell[data-ui-revision="2"] .progress-track,
.app-shell[data-ui-revision="2"] .boss-track {
  height: 3px;
  border-radius: 0;
  background: rgba(103, 183, 206, 0.13);
  box-shadow: none;
}

.app-shell[data-ui-revision="2"] .progress-track span {
  background: linear-gradient(90deg, #35b8d6, #8eeeff);
  box-shadow: 0 0 10px rgba(79, 220, 242, 0.32);
}

.app-shell[data-ui-revision="2"] .boss-track {
  margin-top: 4px;
}

.app-shell[data-ui-revision="2"] .hud-right {
  justify-content: flex-end;
  gap: 0;
  padding: 0 5px 0 8px;
  border-radius: 13px 3px 13px 3px;
  clip-path: polygon(13px 0, 100% 0, 100% 100%, 0 100%, 0 13px);
}

.app-shell[data-ui-revision="2"] .hud-right::before {
  right: 47px;
  bottom: -1px;
  width: 40px;
  height: 1px;
}

.app-shell[data-ui-revision="2"] .combo-block {
  min-width: 112px;
  padding: 9px 12px 7px;
  border-right: 1px solid rgba(135, 226, 244, 0.11);
}

.app-shell[data-ui-revision="2"] .combo-block strong {
  color: var(--ui-gold);
  font-size: clamp(13px, 1.25vw, 18px);
}

.app-shell[data-ui-revision="2"] .flow-track {
  height: 2px;
  margin-top: 6px;
  border-radius: 0;
}

.app-shell[data-ui-revision="2"] .life-block,
.app-shell[data-ui-revision="2"] .shield-block {
  align-self: stretch;
  min-width: 54px;
  padding-inline: 9px;
}

.app-shell[data-ui-revision="2"] .life-block {
  gap: 5px;
  border-right: 1px solid rgba(135, 226, 244, 0.11);
}

.app-shell[data-ui-revision="2"] .life-gem {
  width: 13px;
  height: 19px;
  border-radius: 50% 50% 45% 45%;
  box-shadow: 0 0 8px rgba(255, 139, 185, 0.24), inset 0 1px rgba(255, 255, 255, 0.5);
}

.app-shell[data-ui-revision="2"] .shield-block {
  gap: 4px;
  color: var(--ui-gold);
  font-size: 12px;
}

.app-shell[data-ui-revision="2"] .shield-block span { color: var(--ui-text); }

.app-shell[data-ui-revision="2"] .hud-button {
  align-self: center;
  width: 38px;
  height: 38px;
  margin-left: 2px;
  border: 1px solid rgba(135, 226, 244, 0.14);
  border-radius: 2px 10px 2px 10px;
  background: rgba(79, 194, 220, 0.045);
}

.app-shell[data-ui-revision="2"] .hud-button:hover,
.app-shell[data-ui-revision="2"] .hud-button:focus-visible {
  border-color: rgba(124, 230, 249, 0.52);
  background: rgba(80, 205, 229, 0.12);
  color: var(--ui-text);
  transform: none;
}

.app-shell[data-ui-revision="2"] .hud-button:active { transform: scale(0.94); }

/* Secondary gameplay feedback uses the same signal language. */
.app-shell[data-ui-revision="2"] .build-resonance-chip,
.app-shell[data-ui-revision="2"] .seal-ride-chip {
  border-radius: 3px 13px 3px 13px;
  background: linear-gradient(100deg, rgba(4, 17, 40, 0.9), rgba(7, 31, 59, 0.72));
  box-shadow: 0 12px 28px rgba(0, 6, 24, 0.2), inset 0 1px rgba(255, 255, 255, 0.04);
}

.app-shell[data-ui-revision="2"] .game-toast {
  min-width: min(430px, calc(100% - 32px));
  border-radius: 3px 15px 3px 15px;
  background: linear-gradient(96deg, rgba(5, 19, 43, 0.95), rgba(9, 35, 66, 0.88));
  clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 14px 100%, 0 calc(100% - 14px));
}

.app-shell[data-ui-revision="2"] .touch-controls button {
  border-radius: 3px 15px 3px 15px;
  background: linear-gradient(145deg, rgba(6, 25, 54, 0.9), rgba(10, 42, 76, 0.74));
  clip-path: polygon(0 0, calc(100% - 13px) 0, 100% 13px, 100% 100%, 13px 100%, 0 calc(100% - 13px));
  box-shadow: 0 10px 28px rgba(0, 8, 29, 0.26), inset 0 1px rgba(255, 255, 255, 0.05);
}

.app-shell[data-ui-revision="2"] .touch-controls button:active {
  transform: scale(0.95);
  background: linear-gradient(145deg, rgba(18, 83, 116, 0.9), rgba(18, 59, 93, 0.86));
}

/* Pause: a compact suspended-signal panel, not a generic modal card. */
.app-shell[data-ui-revision="2"] .pause-overlay {
  background:
    linear-gradient(90deg, rgba(2, 8, 23, 0.86), rgba(3, 15, 34, 0.7)),
    radial-gradient(circle at 58% 42%, rgba(74, 214, 239, 0.09), transparent 28%);
}

.app-shell[data-ui-revision="2"] .compact-dialog[data-ui-panel="pause-signal"] {
  position: relative;
  width: min(440px, 100%);
  padding: clamp(28px, 4vw, 44px);
  overflow: hidden;
  border-color: rgba(135, 226, 244, 0.24);
  border-radius: 5px 24px 5px 24px;
  background:
    linear-gradient(120deg, rgba(7, 27, 57, 0.98), rgba(3, 14, 34, 0.98)),
    var(--ui-surface-solid);
  box-shadow: 0 34px 90px rgba(0, 4, 21, 0.66), inset 0 1px rgba(255, 255, 255, 0.045);
  text-align: left;
}

.app-shell[data-ui-revision="2"] .compact-dialog[data-ui-panel="pause-signal"]::before {
  content: "PAUSE / 00";
  position: absolute;
  top: 0;
  right: 0;
  padding: 9px 14px;
  border-left: 1px solid rgba(128, 226, 245, 0.14);
  border-bottom: 1px solid rgba(128, 226, 245, 0.14);
  color: rgba(143, 232, 248, 0.34);
  font-size: 6px;
  font-weight: 900;
  letter-spacing: 0.2em;
}

.app-shell[data-ui-revision="2"] .compact-dialog[data-ui-panel="pause-signal"]::after {
  content: "";
  position: absolute;
  top: 36px;
  bottom: 36px;
  left: 0;
  width: 2px;
  background: linear-gradient(180deg, transparent, var(--ui-cyan), transparent);
  box-shadow: 0 0 14px rgba(86, 226, 247, 0.34);
}

.app-shell[data-ui-revision="2"] .compact-dialog[data-ui-panel="pause-signal"] .overlay-kicker {
  margin-bottom: 10px;
  letter-spacing: 0.28em;
}

.app-shell[data-ui-revision="2"] .compact-dialog[data-ui-panel="pause-signal"] h2 {
  font-size: clamp(28px, 4vw, 42px);
  letter-spacing: 0.02em;
}

.app-shell[data-ui-revision="2"] .compact-dialog[data-ui-panel="pause-signal"] > p:not(.overlay-kicker) {
  margin: 10px 0 24px;
  color: rgba(210, 239, 246, 0.54);
  font-size: 10px;
  line-height: 1.7;
}

.app-shell[data-ui-revision="2"] .compact-dialog[data-ui-panel="pause-signal"] .primary-button {
  min-height: 48px;
  margin: 0 0 8px;
  border-radius: 3px 13px 3px 13px;
  background: linear-gradient(105deg, #2aaacb, #207eb5 68%, #7457c8);
  clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 0 100%);
}

.app-shell[data-ui-revision="2"] .compact-dialog[data-ui-panel="pause-signal"] .text-button {
  width: 100%;
  min-height: 36px;
  margin-top: 3px;
  border-top: 1px solid rgba(137, 225, 243, 0.1);
  color: rgba(218, 243, 248, 0.62);
  text-align: left;
}

.app-shell[data-ui-revision="2"] .compact-dialog[data-ui-panel="pause-signal"] .text-button.danger {
  color: rgba(255, 133, 172, 0.72);
}

/* Result: expedition dossier with a clear score and route report hierarchy. */
.app-shell[data-ui-revision="2"] .result-overlay {
  padding: clamp(10px, 2vw, 28px);
  background:
    linear-gradient(100deg, rgba(1, 8, 23, 0.87), rgba(4, 17, 39, 0.72)),
    radial-gradient(ellipse at 28% 50%, rgba(85, 219, 242, 0.08), transparent 28%);
}

.app-shell[data-ui-revision="2"] .result-dialog[data-ui-panel="expedition-result"] {
  position: relative;
  width: min(1060px, 100%);
  max-height: calc(100% - 4px);
  grid-template-columns: minmax(190px, 0.28fr) minmax(0, 0.72fr);
  border-color: rgba(135, 226, 244, 0.24);
  border-radius: 5px 26px 5px 26px;
  background: linear-gradient(118deg, rgba(7, 28, 58, 0.98), rgba(3, 14, 34, 0.985));
  box-shadow: 0 36px 100px rgba(0, 4, 21, 0.68), inset 0 1px rgba(255, 255, 255, 0.045);
}

.app-shell[data-ui-revision="2"] .result-dialog[data-ui-panel="expedition-result"]::after {
  content: "EXPEDITION DOSSIER / ARCHIVED";
  position: absolute;
  top: 12px;
  right: 18px;
  color: rgba(132, 226, 244, 0.26);
  font-size: 6px;
  font-weight: 900;
  letter-spacing: 0.22em;
}

.app-shell[data-ui-revision="2"] .result-grade {
  position: relative;
  min-height: 0;
  border-right-color: rgba(136, 225, 243, 0.13);
  background:
    radial-gradient(circle at 50% 48%, rgba(83, 218, 240, 0.13), transparent 32%),
    linear-gradient(150deg, rgba(14, 56, 89, 0.28), rgba(3, 15, 36, 0.72));
  font-size: clamp(104px, 12vw, 168px);
  -webkit-text-stroke: 1px rgba(157, 240, 253, 0.82);
  text-shadow: 0 0 30px rgba(83, 223, 246, 0.16);
}

.app-shell[data-ui-revision="2"] .result-grade::before,
.app-shell[data-ui-revision="2"] .result-grade::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  pointer-events: none;
  border: 1px solid rgba(134, 229, 246, 0.12);
  border-radius: 50%;
  transform: translate(-50%, -50%);
}

.app-shell[data-ui-revision="2"] .result-grade::before { width: 72%; aspect-ratio: 1; }
.app-shell[data-ui-revision="2"] .result-grade::after { width: 92%; aspect-ratio: 1; border-style: dashed; }

.app-shell[data-ui-revision="2"] .result-copy {
  padding: clamp(24px, 3.2vw, 42px);
  scrollbar-color: rgba(115, 218, 238, 0.28) transparent;
}

.app-shell[data-ui-revision="2"] .result-dialog:has(.result-expedition.is-hidden) .result-copy {
  display: grid;
  align-content: center;
}

.app-shell[data-ui-revision="2"] .result-copy h2 {
  max-width: calc(100% - 120px);
  font-size: clamp(27px, 3vw, 42px);
  letter-spacing: 0.01em;
}

.app-shell[data-ui-revision="2"] .result-challenge-note {
  margin: 7px 0 -5px;
  color: rgba(152, 235, 248, 0.64);
}

.app-shell[data-ui-revision="2"] .result-score {
  position: relative;
  gap: 10px;
  margin: 16px 0;
  padding-bottom: 13px;
  border-bottom: 1px solid rgba(136, 225, 243, 0.12);
}

.app-shell[data-ui-revision="2"] .result-score::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 88px;
  height: 1px;
  background: var(--ui-gold);
  box-shadow: 0 0 10px rgba(245, 216, 143, 0.26);
}

.app-shell[data-ui-revision="2"] .result-score strong {
  font-size: clamp(36px, 4.6vw, 64px);
}

.app-shell[data-ui-revision="2"] .result-stats {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  border-color: rgba(136, 225, 243, 0.14);
  border-radius: 3px 13px 3px 13px;
  background: transparent;
}

.app-shell[data-ui-revision="2"] .result-stats div {
  padding: 11px 12px;
  border-left: 1px solid rgba(136, 225, 243, 0.1);
  background: rgba(7, 28, 56, 0.46);
}

.app-shell[data-ui-revision="2"] .result-stats div:first-child { border-left: 0; }

.app-shell[data-ui-revision="2"] .result-expedition-summary,
.app-shell[data-ui-revision="2"] .result-boss-reports,
.app-shell[data-ui-revision="2"] .result-perk-build {
  border-color: rgba(136, 225, 243, 0.12);
  border-radius: 0;
}

.app-shell[data-ui-revision="2"] .result-expedition-summary {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  background: transparent;
}

.app-shell[data-ui-revision="2"] .result-expedition-summary > div {
  border-left: 1px solid rgba(136, 225, 243, 0.09);
  background: rgba(5, 21, 46, 0.6);
}

.app-shell[data-ui-revision="2"] .result-expedition-summary > div:first-child { border-left: 0; }

.app-shell[data-ui-revision="2"] .result-boss-report,
.app-shell[data-ui-revision="2"] .result-perk-build {
  background: rgba(4, 18, 41, 0.66);
}

.app-shell[data-ui-revision="2"] .result-perk-chip {
  border-radius: 2px 8px 2px 8px;
}

.app-shell[data-ui-revision="2"] .result-actions {
  justify-content: flex-end;
  margin-top: 15px;
}

.app-shell[data-ui-revision="2"] .result-actions .primary-button,
.app-shell[data-ui-revision="2"] .result-actions .secondary-button {
  min-height: 44px;
  border-radius: 3px 12px 3px 12px;
}

.app-shell[data-ui-revision="2"] .result-actions .primary-button {
  background: linear-gradient(105deg, #2aaacb, #207eb5 68%, #7457c8);
  clip-path: polygon(0 0, calc(100% - 13px) 0, 100% 13px, 100% 100%, 0 100%);
}

.app-shell[data-ui-revision="2"] .result-actions .secondary-button {
  background: rgba(7, 29, 57, 0.56);
}

.app-shell[data-ui-revision="2"] .game-overlay:not(.is-hidden) .compact-dialog[data-ui-panel="pause-signal"] {
  animation: ui-signal-panel-in var(--ui-slow) cubic-bezier(0.22, 1, 0.36, 1) both;
}

.app-shell[data-ui-revision="2"] .game-overlay:not(.is-hidden) .result-dialog[data-ui-panel="expedition-result"] {
  animation: ui-dossier-in 360ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes ui-signal-panel-in {
  from { opacity: 0; transform: translateY(12px) scale(0.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes ui-dossier-in {
  from { opacity: 0; transform: translateY(16px); clip-path: inset(0 48% 0 48%); }
  to { opacity: 1; transform: translateY(0); clip-path: inset(0 0 0 0); }
}

@media (max-width: 1120px) {
  .app-shell[data-ui-revision="2"] .game-hud[data-ui-layout="signal-rail"] {
    grid-template-columns: minmax(190px, 0.72fr) minmax(250px, 1.15fr) minmax(250px, 0.9fr);
  }

  .app-shell[data-ui-revision="2"] .score-block,
  .app-shell[data-ui-revision="2"] .distance-block,
  .app-shell[data-ui-revision="2"] .combo-block { padding-inline: 9px; }

  .app-shell[data-ui-revision="2"] .life-block,
  .app-shell[data-ui-revision="2"] .shield-block { min-width: 45px; padding-inline: 6px; }
}

@media (pointer: coarse), (max-width: 780px) {
  .app-shell[data-ui-revision="2"] .game-hud[data-ui-layout="signal-rail"] {
    grid-template-columns: minmax(150px, 0.78fr) minmax(210px, 1.18fr) minmax(190px, 0.96fr);
    gap: 4px;
    padding: 6px;
  }

  .app-shell[data-ui-revision="2"] .hud-left,
  .app-shell[data-ui-revision="2"] .hud-right,
  .app-shell[data-ui-revision="2"] .stage-progress { min-height: 43px; }

  .app-shell[data-ui-revision="2"] .score-block,
  .app-shell[data-ui-revision="2"] .distance-block { padding: 6px 7px; }

  .app-shell[data-ui-revision="2"] .score-block small,
  .app-shell[data-ui-revision="2"] .distance-block small,
  .app-shell[data-ui-revision="2"] .combo-block small { margin-bottom: 3px; font-size: 5px; }

  .app-shell[data-ui-revision="2"] .score-block strong,
  .app-shell[data-ui-revision="2"] .distance-block strong { font-size: 11px; }

  .app-shell[data-ui-revision="2"] .stage-progress { padding: 7px 9px 6px; }
  .app-shell[data-ui-revision="2"] .stage-meta { grid-template-columns: 20px minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 4px; margin-bottom: 5px; }
  .app-shell[data-ui-revision="2"] .stage-meta span,
  .app-shell[data-ui-revision="2"] .stage-meta strong,
  .app-shell[data-ui-revision="2"] .stage-meta em { font-size: 5px; }

  .app-shell[data-ui-revision="2"] .combo-block { min-width: 74px; padding: 6px 7px 4px; }
  .app-shell[data-ui-revision="2"] .combo-block strong { font-size: 10px; }
  .app-shell[data-ui-revision="2"] .life-block { min-width: 48px; gap: 3px; padding-inline: 5px; }
  .app-shell[data-ui-revision="2"] .life-gem { width: 9px; height: 14px; }
  .app-shell[data-ui-revision="2"] .shield-block { min-width: 34px; padding-inline: 4px; font-size: 8px; }
  .app-shell[data-ui-revision="2"] .hud-button { width: 31px; height: 31px; }

  .app-shell[data-ui-revision="2"] .result-overlay { padding: 3px; }
  .app-shell[data-ui-revision="2"] .result-dialog[data-ui-panel="expedition-result"] {
    width: calc(100% - 2px);
    height: calc(100% - 2px);
    grid-template-columns: minmax(118px, 0.22fr) minmax(0, 0.78fr);
    border-radius: 3px 14px 3px 14px;
  }

  .app-shell[data-ui-revision="2"] .result-grade { font-size: clamp(72px, 15vw, 118px); }
  .app-shell[data-ui-revision="2"] .result-copy { padding: 14px 18px; }
  .app-shell[data-ui-revision="2"] .result-copy h2 { max-width: calc(100% - 100px); font-size: 22px; }
  .app-shell[data-ui-revision="2"] .result-score { margin: 8px 0; padding-bottom: 8px; }
  .app-shell[data-ui-revision="2"] .result-score strong { font-size: 31px; }
  .app-shell[data-ui-revision="2"] .result-stats div { padding: 6px 8px; }
  .app-shell[data-ui-revision="2"] .result-expedition { margin-top: 8px; }
  .app-shell[data-ui-revision="2"] .result-actions { margin-top: 8px; }
  .app-shell[data-ui-revision="2"] .result-actions .primary-button,
  .app-shell[data-ui-revision="2"] .result-actions .secondary-button { min-height: 34px; padding-block: 6px; }
}

@media (pointer: coarse) and (orientation: landscape) and (max-height: 600px),
       (max-height: 520px) and (orientation: landscape) {
  .app-shell[data-ui-revision="2"] .game-hud[data-ui-layout="signal-rail"] {
    grid-template-columns: minmax(138px, 0.74fr) minmax(205px, 1.2fr) minmax(176px, 0.9fr);
    gap: 3px;
    padding: 4px;
  }

  .app-shell[data-ui-revision="2"] .hud-left,
  .app-shell[data-ui-revision="2"] .hud-right,
  .app-shell[data-ui-revision="2"] .stage-progress { min-height: 38px; height: 38px; }

  .app-shell[data-ui-revision="2"] .hud-left { padding-left: 3px; }
  .app-shell[data-ui-revision="2"] .score-block,
  .app-shell[data-ui-revision="2"] .distance-block { padding: 5px 6px; }
  .app-shell[data-ui-revision="2"] .score-block small,
  .app-shell[data-ui-revision="2"] .distance-block small { display: none; }
  .app-shell[data-ui-revision="2"] .score-block strong,
  .app-shell[data-ui-revision="2"] .distance-block strong { font-size: 9px; }

  .app-shell[data-ui-revision="2"] .stage-progress { padding: 5px 7px 4px; }
  .app-shell[data-ui-revision="2"] .stage-meta { margin-bottom: 4px; }
  .app-shell[data-ui-revision="2"] .stage-meta strong { font-size: 5px; }
  .app-shell[data-ui-revision="2"] .stage-meta em { font-size: 4.5px; }
  .app-shell[data-ui-revision="2"] .progress-track,
  .app-shell[data-ui-revision="2"] .boss-track { height: 2px; }

  .app-shell[data-ui-revision="2"] .combo-block { min-width: 68px; padding: 5px 5px 3px; }
  .app-shell[data-ui-revision="2"] .combo-block small { display: none; }
  .app-shell[data-ui-revision="2"] .combo-block strong { font-size: 8px; }
  .app-shell[data-ui-revision="2"] .flow-track { margin-top: 4px; }
  .app-shell[data-ui-revision="2"] .life-block { min-width: 42px; }
  .app-shell[data-ui-revision="2"] .life-gem { width: 8px; height: 12px; }
  .app-shell[data-ui-revision="2"] .shield-block { min-width: 29px; }
  .app-shell[data-ui-revision="2"] .hud-button { width: 28px; height: 28px; }

  .app-shell[data-ui-revision="2"] .compact-dialog[data-ui-panel="pause-signal"] {
    width: min(380px, calc(100% - 8px));
    padding: 20px 28px;
  }

  .app-shell[data-ui-revision="2"] .compact-dialog[data-ui-panel="pause-signal"] h2 { font-size: 24px; }
  .app-shell[data-ui-revision="2"] .compact-dialog[data-ui-panel="pause-signal"] > p:not(.overlay-kicker) { margin: 5px 0 12px; font-size: 7px; }
  .app-shell[data-ui-revision="2"] .compact-dialog[data-ui-panel="pause-signal"] .primary-button { min-height: 34px; }
  .app-shell[data-ui-revision="2"] .compact-dialog[data-ui-panel="pause-signal"] .text-button { min-height: 26px; font-size: 7px; }

  .app-shell[data-ui-revision="2"] .result-dialog[data-ui-panel="expedition-result"] {
    grid-template-columns: 110px minmax(0, 1fr);
  }

  .app-shell[data-ui-revision="2"] .result-dialog[data-ui-panel="expedition-result"]::after { top: 7px; right: 10px; font-size: 4px; }
  .app-shell[data-ui-revision="2"] .result-grade { font-size: 72px; }
  .app-shell[data-ui-revision="2"] .result-copy { padding: 10px 14px; }
  .app-shell[data-ui-revision="2"] .result-copy .overlay-kicker { margin-bottom: 2px; font-size: 5px; }
  .app-shell[data-ui-revision="2"] .result-copy h2 { max-width: calc(100% - 85px); font-size: 17px; }
  .app-shell[data-ui-revision="2"] .result-challenge-note { margin: 2px 0 -2px; font-size: 5px; }
  .app-shell[data-ui-revision="2"] .result-score { margin: 5px 0; padding-bottom: 5px; }
  .app-shell[data-ui-revision="2"] .result-score strong { font-size: 24px; }
  .app-shell[data-ui-revision="2"] .result-score span { margin-bottom: 1px; font-size: 5px; }
  .app-shell[data-ui-revision="2"] .result-stats div { padding: 4px 6px; }
  .app-shell[data-ui-revision="2"] .result-stats small { margin-bottom: 1px; font-size: 4px; }
  .app-shell[data-ui-revision="2"] .result-stats strong { font-size: 7px; }
  .app-shell[data-ui-revision="2"] .result-expedition { margin-top: 4px; }
  .app-shell[data-ui-revision="2"] .result-expedition-summary > div { padding: 4px; }
  .app-shell[data-ui-revision="2"] .result-expedition-summary small { font-size: 4px; }
  .app-shell[data-ui-revision="2"] .result-expedition-summary strong { margin-top: 1px; font-size: 6px; }
  .app-shell[data-ui-revision="2"] .result-expedition-summary > p { padding: 3px 5px; font-size: 4px; }
  .app-shell[data-ui-revision="2"] .result-perk-build { gap: 4px; padding: 4px 5px; }
  .app-shell[data-ui-revision="2"] .result-boss-report { gap: 4px; padding: 4px 5px; }
  .app-shell[data-ui-revision="2"] .result-boss-report > span { width: 16px; height: 16px; }
  .app-shell[data-ui-revision="2"] .result-actions { gap: 6px; margin-top: 5px; }
  .app-shell[data-ui-revision="2"] .result-actions .primary-button,
  .app-shell[data-ui-revision="2"] .result-actions .secondary-button { min-width: 112px; min-height: 28px; padding: 4px 8px; font-size: 6px; }
}

@media (prefers-reduced-motion: reduce) {
  .app-shell[data-ui-revision="2"] .game-overlay:not(.is-hidden) .compact-dialog[data-ui-panel="pause-signal"],
  .app-shell[data-ui-revision="2"] .game-overlay:not(.is-hidden) .result-dialog[data-ui-panel="expedition-result"] {
    animation: none;
  }

  .app-shell[data-ui-revision="2"] .hud-button,
  .app-shell[data-ui-revision="2"] .touch-controls button { transition: none; }
}