/* urcalculator.games — game-specific styles (loaded after main.css) */
.game-stage {
  background: linear-gradient(160deg, var(--green-50), #fff);
  border: 1px solid var(--green-100);
  border-radius: var(--radius);
  padding: clamp(24px, 4vw, 44px);
  text-align: center;
  min-height: 380px;
  display: flex; flex-direction: column; justify-content: center; align-items: center;
  position: relative;
}
.game-hud { display:flex; gap:20px; justify-content:center; margin-bottom:22px; flex-wrap:wrap; }
.hud-item { background:#fff; border:1px solid var(--line); border-radius:12px; padding:10px 18px; min-width:84px; }
.hud-item .lab { font-size:.68rem; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-mute); font-weight:700; }
.hud-item .val { font-family:var(--mono); font-size:1.4rem; font-weight:600; color:var(--green-800); }
.game-prompt { font-family:var(--display); font-size:clamp(2.2rem,7vw,3.4rem); font-weight:700; color:var(--green-900); margin:10px 0 26px; letter-spacing:-.02em; }
.game-q { font-family:var(--mono); }
.choice-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; width:100%; max-width:440px; }
.choice {
  font-family:var(--mono); font-size:1.5rem; font-weight:600; padding:22px; border-radius:14px;
  border:2px solid var(--line); background:#fff; color:var(--green-900); cursor:pointer;
  transition:transform .1s, border-color .15s, background .15s; min-height:72px;
}
.choice:hover { border-color:var(--green-500); background:var(--green-50); }
.choice:active { transform:scale(.97); }
.choice.correct { border-color:var(--green-600); background:var(--green-100); }
.choice.wrong { border-color:var(--danger); background:#fdeceb; }
.big-tap {
  font-family:var(--body); font-size:1.3rem; font-weight:700; padding:20px 40px; border-radius:16px;
  background:linear-gradient(135deg,var(--gold-500),var(--gold-600)); color:#3a2c05; border:none; cursor:pointer;
  min-height:64px; min-width:200px; box-shadow:var(--shadow-md); transition:transform .1s;
}
.big-tap:active { transform:scale(.97); }
.game-input { font-family:var(--mono); font-size:2rem; text-align:center; width:160px; padding:14px; border:2px solid var(--line); border-radius:14px; }
.game-input:focus { outline:none; border-color:var(--green-500); }
.feedback { font-size:1.2rem; font-weight:600; min-height:32px; margin-top:18px; }
.feedback.ok { color:var(--green-600); }
.feedback.no { color:var(--danger); }
.coin { display:inline-block; width:54px; height:54px; border-radius:999px; display:inline-grid; place-items:center; font-weight:700; font-family:var(--mono); margin:5px; border:3px solid; cursor:pointer; user-select:none; transition:transform .1s; }
.coin:active { transform:scale(.9); }
.coin.penny{background:#f3d9c4;border-color:#c8845a;color:#7a3f1d;}
.coin.nickel{background:#e2e2e2;border-color:#9a9a9a;color:#444;width:60px;height:60px;}
.coin.dime{background:#eaeaea;border-color:#a0a0a0;color:#444;width:46px;height:46px;font-size:.85rem;}
.coin.quarter{background:#dcdcdc;border-color:#909090;color:#333;width:66px;height:66px;}
.coin.loonie{background:#f0d28a;border-color:#bd901f;color:#6b4e07;width:60px;height:60px;}

/* COPPA-conscious interstitial overlay */
.interstitial { position:fixed; inset:0; background:rgba(15,42,29,.72); backdrop-filter:blur(4px); display:none; align-items:center; justify-content:center; z-index:300; padding:20px; }
.interstitial.show { display:flex; }
.inter-card { background:#fff; border-radius:18px; max-width:420px; width:100%; padding:26px; text-align:center; box-shadow:var(--shadow-lg); }
.inter-card .ad-box { background:var(--paper-tint); border:1px dashed var(--line); border-radius:12px; min-height:220px; display:grid; place-items:center; color:var(--ink-mute); font-size:.75rem; text-transform:uppercase; letter-spacing:.05em; margin-bottom:18px; }
.inter-close { font-family:var(--body); font-weight:700; font-size:1.05rem; padding:14px 30px; border-radius:12px; border:none; cursor:pointer; min-height:52px; min-width:160px; background:var(--green-700); color:#fff; }
.inter-close:disabled { background:var(--line); color:var(--ink-mute); cursor:not-allowed; }
.age-badge { display:inline-flex; align-items:center; gap:6px; font-size:.75rem; font-weight:700; padding:5px 12px; border-radius:999px; }
.age-kids{background:#e3f0e8;color:#1d5439;}
.age-teen{background:#fbf2d8;color:#9a7416;}
.age-adult{background:#eef1f5;color:#3a4a5a;}
.age-family{background:#fce8e6;color:#a23b2e;}
.game-card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
@media(max-width:820px){.game-card-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:520px){.game-card-grid{grid-template-columns:1fr;}.choice-grid{max-width:none;}}