/* Quiet mine consoles. All hit targets, spacing and safe areas belong to style.css. */
#app {
  --console-accent: var(--mine-accent, #a6d9ce);
  --console-warm: var(--mine-paint, #c5a572);
}
#app #modal #modalCard {
  position:relative;
  border:1px solid #7eaaa05c;
  border-radius:7px;
  background:linear-gradient(135deg,#203941f5,#102730fa 65%);
  box-shadow:inset 0 1px #c9e0d918,0 24px 65px #0008;
}
#app #modal #modalCard::before {
  content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background:linear-gradient(90deg,var(--console-accent),transparent) 18px 0 / 64px 1px no-repeat;
}
#app #modalCard .modal-head h2 {color:#e4eee8;text-shadow:0 1px 2px #061c22;}
#app :is(#modalActions,#modalTabs,.system-dock)>button,
#app :is(.skin-card,.paint-card)>button,
#app #continue,#app .mine-arrow,#app .duel-option {
  position:relative;min-height:44px;clip-path:none;border-radius:5px;
  border:1px solid #7ea99e65;
  background:linear-gradient(160deg,#2b484c,#18333e);
  color:#dceae2;
  box-shadow:inset 0 1px #d4e9de15,inset 0 -1px #04171f60;
  transition:background 130ms ease,border-color 130ms ease,filter 130ms ease;
}
#app :is(#modalActions,#modalTabs,.system-dock)>button:not(:disabled):hover,
#app :is(.skin-card,.paint-card)>button:not(:disabled):hover,
#app #continue:not(:disabled):hover,#app .mine-arrow:not(:disabled):hover,
#app .duel-option:not(:disabled):hover {border-color:var(--console-accent);filter:brightness(1.12);}
#app :is(#modalActions,#modalTabs,.system-dock)>button:not(:disabled):active,
#app :is(.skin-card,.paint-card)>button:not(:disabled):active,
#app #continue:not(:disabled):active,#app .mine-arrow:not(:disabled):active,
#app .duel-option:not(:disabled):active {box-shadow:inset 0 2px 5px #04171f80;filter:brightness(1.06);}
#app #modalActions>button.primary,#app #continue.primary {
  border-color:#e9b786;
  background:linear-gradient(140deg,#edbe91,#cb925f);
  box-shadow:inset 0 1px #ffe8c759,inset 0 -1px #684d3340;
  color:#162e32;font-weight:750;
}
#app #modalActions>button.danger {border-color:#b2776b;background:linear-gradient(140deg,#61473f,#352b30);color:#f5c2b3;}
#app #supportToggle[aria-pressed=true] {border-color:#98c9aa;color:#d4efd9;background:linear-gradient(140deg,#30524b,#1b3939);}
#app .topbar .system-dock {border-radius:7px;border-color:#71929543;background:#0b2028c9;box-shadow:inset 0 1px #bddec510;}
#app .system-dock>.dock-icon,#app #modalCard .modal-head>.dock-icon {
  border-radius:4px;border:1px solid #688c8538;
  background:linear-gradient(150deg,#2c484a80,#112e3880);box-shadow:inset 0 1px #d0e8db0c;
}
#app :is(.mode-card,.mission-item,.slot-card,.mine-stop) {
  border-radius:5px;border-color:#668e8266;
  background-color:#112833;box-shadow:inset 0 1px #d1e5d512,0 3px 12px #020d1630;
}
#app .mode-card .mode-caption {background:linear-gradient(transparent,#0b2530ed 38%);text-shadow:0 1px #07151f;}
#app :is(.mission-item.complete,.slot-card.selected,.mine-stop.selected) {
  border-color:var(--console-warm);box-shadow:inset 0 -2px var(--console-warm);
}
#app .mine-feature {border-radius:5px;border-color:#78998a80;box-shadow:0 3px 12px #020b1433;}
#app .mine-stop>span {border-radius:0;background:#102630df;}
#app .mine-arrow {position:absolute;}
#app #modalCard :is(.skin-card,.paint-card) {
  position:relative;border-radius:5px;border-color:#6b948367;
  background:linear-gradient(125deg,#1d3740,#112832);box-shadow:inset 0 1px #c2dbca12;
}
#app #modalCard :is(.skin-card,.paint-card).equipped {border-color:var(--console-warm);box-shadow:inset 0 -2px var(--console-warm);}
#app #modalTabs>button.selected,#app #modalTabs>button[aria-pressed=true],#app .duel-option[aria-pressed=true] {
  border-color:var(--console-warm);color:#f0d6a8;background:linear-gradient(140deg,#4f5142,#293c39);box-shadow:inset 0 -2px var(--console-warm);
}
#app button:not(.brand):focus-visible,#app #modalCard button:focus-visible {
  outline:2px solid var(--console-accent);outline-offset:-4px;
  border-color:var(--console-accent);filter:brightness(1.08);
}
#app a:focus-visible {outline:2px solid var(--console-accent);outline-offset:-2px;}

/* A result remains recognizable after the brief screen effect has finished. */
#outcomeFeedback {position:absolute;inset:0;width:100%;height:var(--vh);z-index:12;pointer-events:none;}
#app #modal:is([data-kind=dead],[data-kind=won]) {background:#03131b88;backdrop-filter:blur(3px);}
#app #modal[data-kind=dead] {--result-color:#ed9d8c;--result-edge:#bb6153;--result-tint:#683a333f;}
#app #modal[data-kind=won] {--result-color:#a5e8c6;--result-edge:#69b99a;--result-tint:#2f69523f;}
#app #modal:is([data-kind=dead],[data-kind=won]) #modalCard {
  border-color:var(--result-edge);
  background:radial-gradient(ellipse at 0 0,var(--result-tint),transparent 75%),linear-gradient(135deg,#203941f5,#102730fa 65%);
  box-shadow:inset 0 1px #c9e0d918,0 24px 65px #0008,0 0 32px var(--result-tint);
}
#app #modal:is([data-kind=dead],[data-kind=won]) #modalCard::before {
  background:linear-gradient(90deg,var(--result-edge),transparent) 18px 0 / 110px 2px no-repeat;
}
#app #modal:is([data-kind=dead],[data-kind=won]) .modal-head h2 {color:var(--result-color);display:flex;align-items:center;gap:9px;}
#app .outcome-mark {display:inline-flex;flex:none;color:var(--result-color);}
#app .outcome-mark .ui-icon {width:25px;height:25px;}
#app #modal[data-kind=dead] .result-scene>canvas {filter:saturate(.55);}
#app #modal[data-kind=won] .result-stats>.stars .earned {color:#b1e6b5;}
@media(prefers-reduced-motion:reduce) {
  #app button,#app #modalCard {transition:none!important;animation:none!important;}
}
@media(forced-colors:active) {
  #app #modal #modalCard,#app button {border:1px solid ButtonText;}
  #app #modalCard::before {display:none;}
  #app button:focus-visible {outline:2px solid Highlight;outline-offset:-3px;}
}