/* =========================================================
   ZOMBIE CATAPULT — GAME BRAND THEME
   Applies only inside elements with data-theme="zombie-catapult".
   A future game gets its own /assets/games/<slug>/theme.css
   with its own colors and fonts — the studio styles stay untouched.
   ========================================================= */

[data-theme="zombie-catapult"] {
  --game-primary: #8be22a;     /* toxic green */
  --game-secondary: #ff9a1f;   /* catapult orange */
  --game-alien: #b45cff;       /* alien purple */
  --game-bg: #0b0716;
  --game-play-bg: linear-gradient(180deg, #a4f53a 0%, #5fbf12 100%);
  --game-play-text: #10210a;
  --game-play-shadow: 0 6px 0 #2f6a07, 0 14px 34px rgba(139, 226, 42, .35);
  --game-font: "Bangers", "Impact", var(--font-display);
}

[data-theme="zombie-catapult"] .btn-play {
  font-family: var(--game-font);
  letter-spacing: .06em;
  font-weight: 400;
  text-shadow: 0 1px 0 rgba(255,255,255,.35);
}
[data-theme="zombie-catapult"] .btn-play.btn-xl { font-size: 28px; }
[data-theme="zombie-catapult"] .btn-play:active { box-shadow: 0 2px 0 #2f6a07, 0 8px 20px rgba(139,226,42,.3); transform: translateY(4px); }

[data-theme="zombie-catapult"] .zc-title {
  font-family: var(--game-font);
  font-weight: 400;
  letter-spacing: .03em;
  color: var(--game-primary);
  text-shadow: 0 3px 0 #2a4f08, 0 0 30px rgba(139, 226, 42, .25);
}
[data-theme="zombie-catapult"] .zc-title--orange { color: var(--game-secondary); text-shadow: 0 3px 0 #6b3500, 0 0 30px rgba(255,154,31,.25); }
[data-theme="zombie-catapult"] .zc-title--alien { color: var(--game-alien); text-shadow: 0 3px 0 #3a1460, 0 0 30px rgba(180,92,255,.3); }
[data-theme="zombie-catapult"] .eyebrow { color: var(--game-secondary); }
[data-theme="zombie-catapult"] .panel { background: linear-gradient(180deg, #160f29, #100b1e); border-color: #2c2147; }
[data-theme="zombie-catapult"] .steps li,
[data-theme="zombie-catapult"] .stat { background: #140d25; border-color: #2c2147; }

/* Game page hero */
.zc-hero { position: relative; isolation: isolate; overflow: hidden; padding: 56px 0 64px; min-height: min(88vh, 760px); display: flex; align-items: end; }
.zc-hero__bg { position: absolute; inset: 0; z-index: -1; }
.zc-hero__bg img { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
.zc-hero__bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,7,22,.2) 0%, rgba(11,7,22,.55) 50%, #0b0716 100%); }
.zc-hero .game-logo { width: min(82vw, 440px); box-shadow: 0 10px 40px rgba(0,0,0,.6); }
.zc-hero__tag { font: 400 clamp(22px, 5vw, 34px)/1.1 var(--game-font); letter-spacing: .04em; color: #fff; text-shadow: 0 2px 10px rgba(0,0,0,.8); margin-bottom: 22px; max-width: 22ch; }

.zc-band { background: var(--game-bg); }
.zc-band--alt { background: #100a1f; }

/* Boss cards */
.boss-grid { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); }
.boss { position: relative; }
.boss__num { font: 400 15px/1 var(--game-font); letter-spacing: .1em; color: var(--game-secondary); }
.boss h3 { font: 400 28px/1 var(--game-font); letter-spacing: .03em; margin: 6px 0 4px; }
.boss .sub { color: var(--muted); font-size: 13px; text-transform: uppercase; letter-spacing: .14em; margin-bottom: 12px; }
.phases { list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; font-size: 14px; }
.phases li { display: grid; grid-template-columns: 74px 1fr; gap: 8px; color: #cfcfe0; }
.phases b { font-family: var(--game-font); font-weight: 400; letter-spacing: .05em; }
.phases li:nth-child(1) b { color: #4ed6ff; }
.phases li:nth-child(2) b { color: #ffc93a; }
.phases li:nth-child(3) b { color: #ff4d5e; }

/* Daily chest track */
.chest-track { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(7, minmax(84px, 1fr)); gap: 8px; overflow-x: auto; padding-bottom: 6px; }
.chest-track li { background: #140d25; border: 1px solid #2c2147; border-radius: 12px; padding: 12px 8px; text-align: center; }
.chest-track b { display: block; font: 400 15px/1 var(--game-font); color: var(--game-secondary); letter-spacing: .06em; margin-bottom: 8px; }
.chest-track span { font-size: 13px; font-weight: 600; }
.chest-track li:last-child { border-color: var(--game-alien); box-shadow: 0 0 20px rgba(180,92,255,.3); }
