/* Standalone guest games share the original Mine page's styles and typography.
   This sheet adds only the two games' stages, records and control layouts. */
.arc-game-page .arc-hud { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 30px; }
.arc-metric { display: flex; flex-direction: column; gap: 3px; }
.arc-metric > span { color: var(--muted); font-size: 12px; font-weight: bold; letter-spacing: .13em; }
.arc-metric > strong { color: var(--gold); font-size: 25px; line-height: 1.3; font-variant-numeric: tabular-nums; }
.arc-metric:nth-child(2) { text-align: center; }
.arc-metric:nth-child(3) { text-align: right; }
.arc-game-page .arc-stage { cursor: default; }
.arc-rush-canvas { display: block; width: 100%; height: 100%; touch-action: none; image-rendering: pixelated; }
.arc-rush-canvas:focus-visible { outline: 3px solid var(--cream); outline-offset: -5px; }
.arc-overlay { position: absolute; inset: 0; z-index: 5; display: flex; align-items: flex-start; justify-content: center; padding: 56px 20px 0; background: linear-gradient(#080f16d9, #080f1644); }
.arc-overlay-copy { position: relative; z-index: 1; max-width: 660px; text-align: center; text-shadow: 0 2px #101817; }
.arc-eyebrow { color: #d1c699; letter-spacing: .2em; }
.arc-overlay h2 { color: #f6d983; font-size: 30px; line-height: 1.4; margin: 13px 0 16px; text-shadow: 3px 3px #5a3d18, 5px 5px #080e15; }
.arc-overlay p { color: #d3d3bc; font-size: 16px; max-width: 540px; line-height: 1.6; margin: 0 auto 24px; }
.arc-poster { position: absolute; width: 19%; max-height: 215px; height: auto; object-fit: contain; right: 6%; bottom: 3%; image-rendering: pixelated; }
.arc-game-page .arc-controls { display: flex; align-items: center; justify-content: flex-end; gap: 12px; padding: 18px 30px; min-height: 96px; }
.arc-steering { display: flex; gap: 12px; margin-right: auto; }
.arc-game-page .arc-steer { min-width: 90px; min-height: 54px; padding: 8px 24px; display: flex; justify-content: center; color: var(--gold); font-size: 26px; border: 1px solid #77734c; background: #22291f; touch-action: none; }
.arc-game-page .arc-steer:hover { background: #333a27; }
.arc-game-page .arc-small { min-height: 44px; }
.arc-instructions { color: #a7ad9f; font-size: 13px; line-height: 1.7; margin: 17px 0 7px; }
.arc-best { color: var(--gold); font-size: 12px; margin: 0; }
.arc-status { color: #b9c9a8; font-size: 13px; min-height: 20px; margin: 6px 0 0; }
.arc-stage-memory { background: radial-gradient(ellipse at center, #39432b, #141d1a); }
.arc-card-grid { height: 100%; display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(3, 1fr); gap: 15px; padding: 30px 10%; }
.arc-button.arc-card { position: relative; width: 100%; min-width: 0; min-height: 0; padding: 0; overflow: hidden; color: var(--gold); background: repeating-linear-gradient(135deg, #252e22 0, #252e22 9px, #22291f 9px, #22291f 11px); border: 2px solid #86784a; border-radius: 0; box-shadow: 4px 4px #0b110f; touch-action: manipulation; }
.arc-card:hover { border-color: var(--gold); }
.arc-card:disabled { cursor: default; }
.arc-card-back { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; }
.arc-card-back > span { color: #efd176; font: 26px/1.3 var(--pixel); }
.arc-card-back > small { color: #a8a17f; font: 10px/1.5 var(--mono); letter-spacing: .13em; }
.arc-card-face { display: none; width: 100%; height: 100%; object-fit: contain; position: absolute; inset: 0; }
.arc-card-check { display: none; position: absolute; right: 7px; bottom: 5px; color: #c8e1a4; font-size: 18px; }
.arc-button.arc-card.arc-flipped { background: radial-gradient(ellipse, #5a4c2e, #242b20); border-color: var(--gold); }
.arc-card.arc-flipped .arc-card-back { display: none; }
.arc-card.arc-flipped .arc-card-face { display: block; }
.arc-button.arc-card.arc-matched { background: #2b3b29; border-color: #9caf79; }
.arc-card.arc-matched .arc-card-check { display: block; }
.arc-card.arc-concealed .arc-card-face, .arc-card.arc-concealed .arc-card-check { visibility: hidden; }
.arc-stage:has(.arc-overlay:not([hidden])) .arc-card-grid { opacity: .16; }
.arc-stage-memory{background:radial-gradient(ellipse at 50% 35%,#50553a,#17231f 80%)}
.arc-button.arc-card{border-color:#aa955a;background:repeating-linear-gradient(135deg,#2d3829 0,#2d3829 7px,#293225 7px,#293225 9px);box-shadow:inset 0 0 0 3px #171f1b,inset 0 0 0 4px #a28c4e44,0 4px 0 #070f0c,0 8px 16px #0003;transition:border-color .15s,background .15s}
.arc-card-back>span{color:#e6c276;text-shadow:1px 2px #0007}
.arc-card-back>small{color:#c0b081;letter-spacing:.14em}
.arc-button.arc-card.arc-flipped{background:radial-gradient(ellipse,#6f6138,#303e2b);border-color:#f0d289;box-shadow:inset 0 0 0 3px #2d3622,inset 0 0 0 4px #e3c37444,0 4px 0 #09110c,0 8px 18px #0003}
.arc-button.arc-card.arc-matched{background:radial-gradient(ellipse,#475537,#263a2d);border-color:#b4cb88}
.arc-overlay{background:linear-gradient(#0b171bee,#0c1d22a1 70%,#13232252)}
.arc-overlay p{font-family:'Trebuchet MS',sans-serif;font-size:17px;line-height:1.75;color:#c7cfba}
.arc-overlay h2{font-size:29px}
.arc-eyebrow{font-family:'Trebuchet MS',sans-serif;color:#adbda1;font-size:11px;letter-spacing:.12em}
.arc-instructions,.arc-best,.arc-status{font-family:'Trebuchet MS',sans-serif;line-height:1.8}
.arc-game-page .arc-steer{border-color:#a9ac7666;background:linear-gradient(#364431,#233325);border-bottom:3px solid #0b160d}
.arc-game-page .arc-small{background:#d4c98609;border-color:#b7b28252;font-family:'Trebuchet MS',sans-serif;font-size:12px}
@media (max-width: 850px) {
  .arc-overlay { padding-top: 38px; }
  .arc-overlay h2 { font-size: 25px; }
  .arc-overlay p { font-size: 14px; max-width: 480px; margin-bottom: 18px; }
  .arc-game-page .arc-controls { padding: 16px 22px; }
  .arc-poster { width: 15%; max-height: 130px; right: 3%; bottom: 2%; }
  .arc-card-grid { padding: 20px 7%; gap: 12px; }
}
@media (max-width: 560px) {
  .arc-game-page .arc-hud { gap: 12px; padding: 12px 16px; }
  .arc-metric > span { font-size: 10px; letter-spacing: .06em; }
  .arc-metric > strong { font-size: 19px; }
  .arc-overlay { padding: 28px 17px 0; }
  .arc-eyebrow { display: none; }
  .arc-overlay h2 { font-size: 22px; margin: 12px 0 18px; }
  .arc-overlay p { font-size: 13px; max-width: 290px; margin-bottom: 24px; }
  .arc-poster { width: 27%; max-height: 140px; right: 5%; bottom: 3%; }
  .arc-game-page .arc-controls { padding: 13px 12px; gap: 8px; flex-wrap: wrap; min-height: 97px; }
  .arc-steering { gap: 8px; }
  .arc-game-page .arc-steer { min-width: 46px; min-height: 48px; padding: 8px 12px; font-size: 20px; }
  .arc-game-page .arc-small { font-size: 11px; padding: 10px; }
  .arc-card-grid { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(4, 1fr); padding: 20px 16px; gap: 10px; }
  .arc-card-back > span { font-size: 22px; }
  .arc-card-back > small { font-size: 7px; }
  .arc-instructions, .arc-best, .arc-status { font-size: 12px; }
}
@media(prefers-reduced-motion:reduce){.arc-button.arc-card{transition:none}}
@media(orientation:landscape) and (max-height:550px){
  .arc-game-page .arc-hud{gap:12px;padding:7px 18px}.arc-metric>span{font-size:9px}.arc-metric>strong{font-size:18px}
  .arc-game-page .arc-controls{min-height:64px;padding:7px 18px}.arc-game-page .arc-steer{min-width:64px;min-height:44px;padding:4px 16px;font-size:20px}.arc-game-page .arc-small{padding:9px 15px}
  .arc-overlay{padding:13px 20px 0}.arc-eyebrow{display:none}.arc-overlay h2{font-size:22px;margin:3px 0 10px}.arc-overlay p{font-size:13px;margin-bottom:13px;line-height:1.55;max-width:460px}.arc-poster{max-height:112px;width:14%}
  .arc-card-grid{grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(3,1fr);gap:7px;padding:10px 8%}.arc-card-back{gap:2px}.arc-card-back>span{font-size:18px}.arc-card-back>small{font-size:7px}
}