/* Screen styling only: the printed protocol retains its established layout. */
@media screen {
    :root {
        --kl-amber: #e5b74c;
        --kl-amber-dark: #d4a12c;
        --kl-amber-light: #fcf4df;
        --kl-dark: #19372d;
        --kl-card-shadow: none;
        --kl-radius: 14px;
        --kl-navbar-h: 72px;
    }
    html, body { background: #f4f6f3; color: #19372d; }
    body, button, input, select, textarea { font-family: 'Inter', system-ui, sans-serif; }
    button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
    button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
        outline: 3px solid #a96900;
        outline-offset: 3px;
    }
    .kl-navbar { background: #fff; min-height: 72px; box-shadow: none; border-bottom: 1px solid #dce3dd; }
    .kl-navbar .kl-navbar-brand { color: #19372d !important; font-size: 24px; letter-spacing: -1px; font-weight: 600; }
    .kl-brand-dot { color: #a86e09; }
    .kl-navbar-home { color: #19372d; font-size: 13px; background: #f4f6f3; border-radius: 7px; }
    .kl-navbar-home:hover { color: #19372d; background: #e6ebe5; }
    .kl-content { padding-top: 24px; }
    .kl-footer { background: transparent; color: #5f6c66; border-top: 1px solid #dce3dd; padding-block: 20px; }
    .kl-container-narrow { max-width: 650px; }
    .kl-hero { text-align: left; padding: 28px 0 24px; }
    .kl-menu-label { color: #5f6c66; font-size: 13px; margin-bottom: 16px; }
    .kl-hero-title { font-size: clamp(34px, 6vw, 48px); font-weight: 600; line-height: 1.12; letter-spacing: -.045em; margin: 0 0 20px; }
    .kl-hero-sub { color: #5f6c66; font-size: 15px; line-height: 1.7; max-width: 42ch; }
    .kl-menu-empty { padding: 28px 0; border-top: 1px solid #dce3dd; }
    .kl-menu-empty h2 { font-size: 18px; font-weight: 600; margin: 0 0 12px; }
    .kl-menu-empty p { color: #5f6c66; font-size: 14px; line-height: 1.7; }
    .kl-card { border: 1px solid #dce3dd; box-shadow: none; }
    .kl-card-header { background: #fff; color: #19372d; text-transform: none; letter-spacing: 0; font-size: 14px; font-weight: 600; padding: 16px 18px; border-bottom: 1px solid #e5eae4; }
    .kl-card-header.amber, .kl-card-header.warning { background: #fcf4df; color: #704b08; }
    .kl-card-header.success { background: #eef5ef; color: #28533d; }
    .kl-card-header.danger { background: #fbefec; color: #8a3a30; }
    .kl-card-header.info { background: #eff3f8; color: #355577; }
    .kl-hdr-icon { filter: none; width: 16px; height: 16px; margin-right: 8px; }
    .kl-card-body { padding: 18px; }
    .kl-card-footer { background: #f9faf8; color: #5f6c66; border-color: #dce3dd; }
    .btn-kl-primary { background: #19372d; color: #fff; font-weight: 600; border-radius: 8px; min-height: 46px; }
    .btn-kl-primary:hover { background: #2c5143; color: white; transform: none; }
    .btn-kl-secondary { border: 1px solid #cbd6cd; background: white; color: #19372d; border-radius: 8px; min-height: 44px; }
    .btn-kl-secondary:hover { background: #edf2ec; color: #19372d; }
    .btn-kl-success { background: #e7f0e8; color: #28533d; border: 1px solid #c7dacb; min-height: 44px; font-weight: 600; }
    .btn-kl-success:hover { background: #d6e7da; color: #19372d; }
    .btn-kl-danger { background: #fff; color: #9a392f; border: 1px solid #e9d0cc; min-height: 44px; }
    .btn-kl-danger:hover { background: #fbefec; color: #7f2b22; }
    .kl-back-link { color: #5f6c66; min-height: 44px; padding: 10px 0; }
    .form-control, .form-select { background-color: #fff; border-color: #cbd6cd; border-radius: 8px; min-height: 46px; font-size: 15px; }
    .form-control:focus, .form-select:focus { border-color: #6d8977; box-shadow: 0 0 0 3px #e1eae2; }
    .current-player-banner { background: #19372d; color: #fff; animation: none; box-shadow: none; text-align: left; font-size: 20px; font-weight: 600; letter-spacing: -.02em; padding: 20px; }
    .kl-submit-bar { background: #f4f6f3; border-top: 1px solid #dce3dd; }
    .kl-submit-btn { box-shadow: none; }
    .bet-player-btn, .fv-preset-btn { min-height: 44px; background: #fff; border-color: #dce3dd; border-width: 1px; }
    .saved-game-item, .player-item { padding: 18px; border-color: #e5eae4; }
    .saved-game-meta { color: #5f6c66; line-height: 1.7; }
    .score-table th { background: #f4f6f3; color: #5f6c66; font-weight: 600; text-transform: none; letter-spacing: 0; border-bottom: 1px solid #dce3dd; }
    .score-table td { border-color: #e5eae4; }
    .score-table tr.current-player td { background: #f1f6ef; }
    .score-table tr.current-player td:first-child { border-left-color: #55795c; }
    .drink-overlay-card { background: #19372d; color: #fff; }
    .drink-overlay-header { background: #19372d; color: #efd28c; border-bottom-color: #426051; }
    .drink-confirm-btn { background: #efd28c; color: #19372d; }
    .drink-confirm-btn:hover { background: #f5dfa9; color: #19372d; }
    .drink-undo-link { color: #d5e0d9; }
    /* Restore vivid game cues without changing the new menu or layout. */
    .kl-container-game {
        --game-green: #087f48;
        --game-red: #bd2938;
        --game-gold: #f5b800;
        --game-blue: #235bc0;
    }
    .kl-container-game .current-player-banner { background: var(--game-green); }
    .kl-container-game .kl-card-header.success { background: var(--game-green); color: #fff; }
    .kl-container-game .kl-card-header.danger { background: var(--game-red); color: #fff; }
    .kl-container-game .kl-card-header.info { background: var(--game-blue); color: #fff; }
    .kl-container-game .kl-card-header.amber,
    .kl-container-game .kl-card-header.warning { background: #a76700; color: #fff; }
    .kl-container-game .kl-card-header.success .kl-hdr-icon,
    .kl-container-game .kl-card-header.danger .kl-hdr-icon,
    .kl-container-game .kl-card-header.info .kl-hdr-icon,
    .kl-container-game .kl-card-header.warning .kl-hdr-icon,
    .kl-container-game .throw-heading-icon { filter: brightness(0) invert(1); }
    .kl-container-game .kl-submit-btn,
    .kl-container-game .drink-confirm-btn { background: var(--game-gold); color: #392700; }
    .kl-container-game .kl-submit-btn:hover,
    .kl-container-game .drink-confirm-btn:hover { background: #ffc929; color: #392700; }
    .kl-container-game .btn-kl-success { background: var(--game-green); color: #fff; border-color: var(--game-green); }
    .kl-container-game .btn-kl-success:hover { background: #066637; }
    .kl-container-game .bet-player-btn.active.green { background: var(--game-green); color: #fff; border-color: var(--game-green); }
    .kl-container-game .bet-player-btn.active.red { background: var(--game-red); color: #fff; border-color: var(--game-red); }
    .kl-container-game .bet-player-btn.active.amber,
    .kl-container-game .fv-preset-btn.active { background: var(--game-gold); color: #392700; border-color: #ac7900; }
    /* Original throw picker from before the redesign; button rules stay in app.css. */
    .throw-card { font-family: 'Nunito', 'Helvetica Neue', Helvetica, Arial, sans-serif; color: #1c1a17; }
    .kl-container-game .throw-card > .kl-card-header {
        background: #a76700; color: #fff; font-size: .82rem;
        font-weight: 800; padding: .7rem 1rem; letter-spacing: .06em; text-transform: uppercase;
    }
    .throw-card > .kl-card-body { padding: 1rem; }
    .kl-container-game .throw-btn-wrap:focus-visible { outline: 3px solid #19372d; outline-offset: 4px; }
    .kl-container-game .score-table tr.current-player td { background: #d5f5df; }
    .kl-container-game .score-table tr.current-player td:first-child { border-left-color: var(--game-green); }
    @media (max-width: 420px) {
        .kl-navbar { padding-inline: 16px; gap: 12px; }
        .kl-navbar .kl-navbar-brand { font-size: 22px; }
        .kl-navbar-home { font-size: 12px; }
        .saved-game-item > .d-flex { flex-wrap: wrap; }
    }
    @media (min-width: 992px) { .kl-submit-bar { border: 0; } }
    @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }
}