/* =========================================================
   DUNGEON MASTER HANGMAN — READABLE FONT UPGRADE

   Enlarges important desktop and mobile text while preserving:
   - Premium dungeon artwork
   - Existing layout
   - Cage positioning
   - Lava animation
   - Responsive panel order
   ========================================================= */

/* ---------------------------------------------------------
   GENERAL READABILITY
   --------------------------------------------------------- */

body {
    font-size: 17px;
    line-height: 1.38;
}

button,
input,
select {
    font-size: 16px;
}

button {
    line-height: 1.2;
}

input,
select {
    line-height: 1.25;
}

.tagline {
    font-size: 17px;
}

.word-count-badge {
    font-size: 15px;
}

.field-label {
    font-size: 15px;
}

.status {
    font-size: 15px;
}

/* ---------------------------------------------------------
   TOP BAR
   --------------------------------------------------------- */

.game-title span {
    font-size: clamp(23px, 2.6vw, 39px);
}

.game-title b {
    font-size: 14px;
}

.leave-button {
    font-size: 15px;
}

.room-chip small,
.round-chip small {
    font-size: 11px;
}

.room-chip strong,
.round-chip strong {
    font-size: 15px;
}

.room-chip button {
    font-size: 14px;
}

.sound-button {
    font-size: 21px;
}

/* ---------------------------------------------------------
   PRIVATE ROOM LOBBY
   --------------------------------------------------------- */

.lobby-heading small,
.lobby-room-card > span,
.mission-card small,
.category-banner small,
.clue-inline small,
.turn-strip small {
    font-size: 12px;
}

.lobby-heading h1 {
    font-size: clamp(28px, 4vw, 41px);
}

.lobby-heading p {
    font-size: 16px;
    line-height: 1.45;
}

.lobby-captain {
    font-size: 14px;
}

.lobby-room-card > strong {
    font-size: clamp(25px, 4vw, 38px);
}

.lobby-notice,
.lobby-status {
    font-size: 14px;
    line-height: 1.4;
}

.lobby-player {
    font-size: 15px;
}

.lobby-player small {
    font-size: 12px;
}

.lobby-footer label {
    font-size: 13px;
}

.lobby-share-buttons button,
.lobby-actions-main button {
    font-size: 15px;
}

/* ---------------------------------------------------------
   LEFT PLAYER SCOREBOARD
   --------------------------------------------------------- */

.panel-heading h2 {
    font-size: 21px;
}

.panel-heading span {
    font-size: 23px;
}

.hr-score-player__identity strong {
    font-size: 16px;
}

.hr-score-player__identity small {
    font-size: 12px;
}

.hr-score-player__points {
    font-size: 18px;
}

.hr-score-player__points small {
    font-size: 10px;
}

.hr-match-progress {
    font-size: 12px;
}

.hr-score-player__stats {
    font-size: 11px;
    line-height: 1.35;
}

/* ---------------------------------------------------------
   LIVE DUNGEON SCENE
   --------------------------------------------------------- */

.danger-ladder small {
    font-size: 11px;
}

.danger-step {
    font-size: 16px;
}

.danger-title {
    font-size: 15px;
}

.skulls {
    font-size: 23px;
}

.wrong-card b {
    font-size: 24px;
}

.scene-message {
    font-size: 14px;
    line-height: 1.35;
}

/* ---------------------------------------------------------
   CATEGORY, CLUE AND WORD
   --------------------------------------------------------- */

.category-banner strong,
.clue-inline strong {
    font-size: 18px;
    line-height: 1.3;
}

.masked-word {
    font-size: clamp(28px, 4.4vw, 49px);
    line-height: 1.25;
}

.turn-strip strong {
    font-size: 17px;
}

#timerText {
    font-size: 17px;
}

/* ---------------------------------------------------------
   KEYBOARD AND SOLVE CONTROLS
   --------------------------------------------------------- */

.key {
    font-size: clamp(20px, 2.2vw, 29px);
}

.solve-row input,
.solve-row button {
    font-size: 16px;
}

.result {
    font-size: 16px;
    line-height: 1.4;
}

.championship-setup {
    font-size: 15px;
}

.hidden-game-controls button {
    font-size: 15px;
}

/* ---------------------------------------------------------
   QUEST / MISSION PANEL
   --------------------------------------------------------- */

.mission-card strong {
    font-size: 20px;
    line-height: 1.3;
}

.mission-card p {
    font-size: 14px;
    line-height: 1.55;
}

/* ---------------------------------------------------------
   OVERLAYS
   --------------------------------------------------------- */

.round-banner-message {
    font-size: 17px;
}

.round-transition-card small {
    font-size: 13px;
}

.round-transition-card span {
    font-size: 20px;
}

/* ---------------------------------------------------------
   PWA CONTROLS
   --------------------------------------------------------- */

.hr-pwa-install {
    font-size: 15px !important;
}

.hr-pwa-update,
.hr-pwa-toast {
    font-size: 14px !important;
}

/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1180px) and (min-width: 781px) {
    body {
        font-size: 16px;
    }

    .game-title span {
        font-size: clamp(23px, 2.9vw, 34px);
    }

    .room-chip strong,
    .round-chip strong {
        font-size: 14px;
    }

    .category-banner strong,
    .clue-inline strong {
        font-size: 17px;
    }

    .mission-card p {
        font-size: 14px;
    }
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 780px) {
    body {
        font-size: 16px;
        line-height: 1.4;
    }

    button,
    input,
    select {
        /*
          Sixteen pixels also prevents browsers from zooming into
          text fields when they receive focus.
        */
        font-size: 16px;
    }

    /* HOME SCREEN */

    .home-logo span {
        font-size: clamp(31px, 9vw, 45px);
    }

    .home-logo b {
        font-size: 13px;
    }

    .tagline {
        font-size: 16px;
    }

    .word-count-badge,
    .field-label,
    .status {
        font-size: 14px;
    }

    .join-divider {
        font-size: 12px;
    }

    /* MOBILE TOP BAR */

    .game-title span {
        font-size: 19px;
    }

    .game-title b {
        font-size: 10px;
    }

    .room-chip strong {
        max-width: 82px;
        font-size: 11px;
    }

    .room-chip button {
        font-size: 12px;
    }

    .sound-button {
        font-size: 18px;
    }

    /* MOBILE LOBBY */

    .lobby-heading small,
    .lobby-room-card > span {
        font-size: 11px;
    }

    .lobby-heading h1 {
        font-size: clamp(24px, 7vw, 32px);
    }

    .lobby-heading p {
        font-size: 15px;
    }

    .lobby-captain {
        font-size: 13px;
    }

    .lobby-room-card > strong {
        font-size: clamp(25px, 8vw, 35px);
    }

    .lobby-notice,
    .lobby-status {
        font-size: 14px;
    }

    .lobby-player {
        font-size: 15px;
    }

    .lobby-player small {
        font-size: 12px;
    }

    .lobby-share-buttons button,
    .lobby-actions-main button {
        font-size: 14px;
    }

    /* MOBILE SCOREBOARD */

    .panel-heading h2 {
        font-size: 20px;
    }

    .hr-score-player__identity strong {
        font-size: 16px;
    }

    .hr-score-player__identity small {
        font-size: 12px;
    }

    .hr-score-player__points {
        font-size: 17px;
    }

    .hr-score-player__points small {
        font-size: 10px;
    }

    .hr-match-progress {
        font-size: 12px;
    }

    .hr-score-player__stats {
        font-size: 11px;
    }

    /* MOBILE SCENE */

    .danger-title {
        font-size: 12px;
    }

    .skulls {
        font-size: 16px;
    }

    .wrong-card b {
        font-size: 18px;
    }

    .danger-ladder small {
        font-size: 10px;
    }

    .danger-step {
        font-size: 15px;
    }

    .scene-message {
        font-size: 12px;
        line-height: 1.35;
    }

    /* MOBILE PUZZLE */

    .category-banner small,
    .clue-inline small,
    .turn-strip small,
    .mission-card small {
        font-size: 11px;
    }

    .category-banner strong,
    .clue-inline strong {
        font-size: 15px;
        line-height: 1.35;
    }

    .masked-word {
        font-size: clamp(23px, 6vw, 35px);
        letter-spacing: 0.1em;
    }

    .turn-strip strong {
        font-size: 15px;
    }

    #timerText {
        min-width: 58px;
        font-size: 16px;
    }

    .key {
        min-height: 44px;
        font-size: 19px;
    }

    .solve-row input,
    .solve-row button {
        font-size: 16px;
    }

    .result {
        font-size: 15px;
    }

    /* MOBILE QUEST PANEL */

    .mission-card strong {
        font-size: 18px;
    }

    .mission-card p {
        font-size: 14px;
        line-height: 1.55;
    }

    .round-transition-card small {
        font-size: 12px;
    }

    .round-transition-card span {
        font-size: 18px;
    }

    .hr-pwa-install {
        font-size: 14px !important;
    }
}

/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 430px) {
    .game-title span {
        font-size: 18px;
    }

    .room-chip strong {
        max-width: 72px;
        font-size: 10px;
    }

    .category-banner strong,
    .clue-inline strong {
        font-size: 15px;
    }

    .masked-word {
        font-size: clamp(22px, 6.4vw, 31px);
    }

    .keyboard {
        gap: 5px;
    }

    .key {
        min-height: 43px;
        font-size: 18px;
    }

    .mission-card p {
        font-size: 14px;
    }
}