/* Rough demolition-site skin: heavy display font, hard black outlines, tape and grit.
   Black Han Sans (OFL 1.1, public/fonts/BlackHanSans-OFL.txt) for shouting text; Wanted Sans stays for reading text. */
@font-face { font-family: 'Black Han Sans'; src: url('../public/fonts/BlackHanSans-Regular.woff2') format('woff2'); font-weight: 400; font-display: swap; }
:root { --font-rough: 'Black Han Sans', 'Wanted Sans', sans-serif; --rough-ink: #16110a; --rough-yellow: #ffc93c; }

/* Shouting text */
.arcade-game #modal .modal-top h2, .arcade-game .letter-title, .arcade-game .result h2, .arcade-game .home-play b,
.arcade-game .primary-button, .arcade-game .home-mode b, .arcade-game .home-next b, .arcade-game .chapter-tabs button,
.arcade-game #score, .arcade-game .goal-value b, .arcade-game .fire-button, .arcade-game .impact-big, .impact-big, .impact-word,
.cut-name, .cut-title, .cut-ep, .arcade-game .home-kicker, .arcade-game .home-resource b, .arcade-game .brief-goals b,
.arcade-game .contract-card b, .arcade-game .map-world-banner b, .coach-card .coach-face b, .arcade-game .home-crew-rank, .arcade-game .letter-stamp {
  font-family: var(--font-rough) !important; font-weight: 400 !important; font-synthesis: none; letter-spacing: 0 !important;
}

/* Screen titles: yellow with a fat black stroke */
.arcade-game #modal .modal-top h2 { color: var(--rough-yellow); -webkit-text-stroke: 5px var(--rough-ink); paint-order: stroke fill; text-shadow: 0 4px 0 var(--rough-ink); font-size: 27px; }
.arcade-game .letter-title { -webkit-text-stroke: 4px var(--rough-ink); paint-order: stroke fill; color: var(--game-white); }

/* Buttons: hard edges, heavy offset shadow, a slight crooked tilt */
.arcade-game .primary-button { border: 3px solid var(--rough-ink) !important; border-radius: 6px !important; box-shadow: 0 6px 0 var(--rough-ink) !important; }
.arcade-game .primary-button:active { transform: translateY(4px); box-shadow: 0 2px 0 var(--rough-ink) !important; }
.arcade-game #modal .home-play { border-radius: 6px; transform: rotate(-1deg); }
.arcade-game #modal .home-play b { font-size: 30px; -webkit-text-stroke: 1px var(--rough-ink); }

/* Lobby menu tiles: taped-on cards with grit */
.arcade-game .home-mode { position: relative; border-radius: 6px !important; border: 3px solid var(--rough-ink) !important; box-shadow: 0 5px 0 var(--rough-ink) !important; }
.arcade-game .home-mode:nth-child(3n+1) { transform: rotate(-1.2deg); }
.arcade-game .home-mode:nth-child(3n+3) { transform: rotate(1deg); }
.arcade-game .home-mode::before { content: ''; position: absolute; top: -7px; left: 50%; width: 38px; height: 12px; margin-left: -19px; background: rgba(245, 232, 196, .85); box-shadow: 0 1px 2px rgba(0, 0, 0, .35); transform: rotate(-4deg); clip-path: polygon(0 10%, 6% 0, 12% 12%, 20% 0, 28% 10%, 100% 0, 96% 50%, 100% 100%, 90% 88%, 80% 100%, 0 100%, 4% 50%); pointer-events: none; z-index: 2; }
.arcade-game .home-mode b { font-size: 16px; }
.arcade-game .home-next, .arcade-game .episode-strip, .arcade-game .home-episode { border-radius: 6px !important; border: 3px solid var(--rough-ink) !important; box-shadow: 0 5px 0 var(--rough-ink) !important; }
.arcade-game .home-next b { font-size: 22px; }

/* Map chapter tabs and contract cards */
.arcade-game .chapter-tabs button { border-radius: 4px !important; border: 3px solid var(--rough-ink) !important; }
.arcade-game .chapter-tabs button[aria-pressed="true"] { background: var(--rough-yellow) !important; color: var(--rough-ink) !important; }
.arcade-game .contract-card { border-radius: 6px !important; border: 3px solid var(--rough-ink) !important; box-shadow: 0 5px 0 var(--rough-ink) !important; }
.arcade-game .letter-stamp { display: inline-block; padding: 4px 9px; background: var(--rough-ink); color: var(--rough-yellow) !important; transform: rotate(-2deg); border-radius: 2px; }

/* HUD numbers */
.arcade-game #score { font-size: 34px; -webkit-text-stroke: 3px var(--rough-ink); paint-order: stroke fill; }
.arcade-game .goal-value b { font-size: 28px; }
.arcade-game .fire-button { font-size: 22px; }

/* Hit text in the rough face */
.impact-word { -webkit-text-stroke: 5px var(--rough-ink); color: #fff1c9; }
.impact-big, .arcade-game .impact-big { -webkit-text-stroke: 7px var(--rough-ink); paint-order: stroke fill; }

/* Cutscene */
.cut-name { font-size: 18px; padding-top: 6px; }
.cut-title, .cut-ep { letter-spacing: 0; }

/* Keep the hit word above the score/count popups and hide HUD numbers behind cutscenes. */
.impact-word { top: calc(var(--wy, 45%) - 64px); }
.arcade-game[data-modal="story"] #score, .arcade-game[data-modal="story"] .combo-banner { visibility: hidden; }