/* ================================================================
   V1 SKIN — Visual overrides for Multi 20/80 tool page
   Loaded AFTER polonia-multi.css. Only cosmetic overrides.
   v1 — 2026-02-26
   ================================================================ */

/* Hero / header — tighter, V1-style */
.pl-wrap > h1 { font-size: 1.1rem; margin-bottom: 4px; letter-spacing: -.2px; }
.pl-fresh { font-size: .62rem; padding: 4px 0 6px; }
.pl-bc { font-size: .6rem; padding: 6px 0; }

/* LIVE badge — pulsing red pill */
.pl-live-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    font-size: .56rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
    background: rgba(220,20,60,0.1);
    border: 1px solid rgba(220,20,60,0.25);
    border-radius: 10px;
    color: var(--pl-red);
    margin-left: 8px;
    vertical-align: middle;
}
.pl-live-badge .live-dot {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: var(--pl-red);
    animation: livePulse 1.5s infinite;
}
@keyframes livePulse {
    0%, 100% { opacity: 1; }
    50% { opacity: .3; }
}

/* Cards — V1 tighter radius + subtle shadow */
.pl-card {
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}

/* H2 sections — tighter spacing */
.pl-wrap h2 { font-size: .88rem; margin-top: 18px; margin-bottom: 4px; }
.pl-wrap h2 + p { margin-top: 0; margin-bottom: 6px; }

/* Tabs / variant bar — pill style V1 */
.pl-variant-bar { gap: 4px; padding: 6px 0; }
.pl-vt-btn { padding: 5px 12px; border-radius: 14px; font-size: .62rem; }

/* Window buttons — tighter pills */
.pl-win-bar { gap: 4px; padding: 4px 0; }
.pl-wbtn, .pl-zbtn, .pl-pbtn, .pl-cbtn { padding: 3px 8px; font-size: .6rem; border-radius: 10px; }

/* Grid tiles — tighter spacing, V1 look */
.pl-grid80 { gap: 2px; }
.pl-gcell { font-size: .52rem; border-radius: 3px; border-width: 1px; }

/* Bet circular grid — tighter */
.bet-grid-circ { gap: 4px; }
.bet-grid-circ .pl-gcell { border-width: 2px; font-size: .56rem; }

/* Balls / chips — tighter */
.pl-ball { font-size: .56rem; padding: 2px 5px; }

/* Info expand blocks — compact */
.pl-info-expand { margin: 4px 0 10px; }
.pl-info-toggle { font-size: .62rem; padding: 4px 0; }
.pl-info-body { font-size: .66rem; padding: 6px 10px; }

/* Stats rows compact */
.pl-stats-row { font-size: .58rem; gap: 8px; }

/* Archive compact */
.pl-arc-row { padding: 6px 8px; }

/* FAQ compact */
.pl-faq-q { font-size: .72rem; padding: 8px 0; }
.pl-faq-a { font-size: .68rem; }

/* Schedule compact */
.pl-sched-item { padding: 6px 10px; }

/* Footer compact */
.pl-footer { padding: 12px 0; font-size: .6rem; }
.pl-disclaimer { font-size: .6rem; padding: 8px 12px; }

/* Missing draw diagnostic banner */
.pl-draw-missing {
    display: none;
    font-size: .68rem;
    color: #fbbf24;
    background: rgba(251,191,36,0.06);
    border: 1px solid rgba(251,191,36,0.15);
    border-radius: 6px;
    padding: 6px 12px;
    margin-bottom: 8px;
    text-align: center;
}
.pl-draw-missing.visible { display: block; }

/* ================================================================
   GENERATOR: Segmented K + modes + slider + gen window
   ================================================================ */

.bet-k-row {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
    margin-bottom: 6px;
    font-size: .64rem;
    color: var(--pl-muted);
}
.bet-k-seg {
    display: flex;
    gap: 0;
    border: 1px solid var(--pl-border);
    border-radius: 8px;
    overflow: hidden;
}
.bet-k-btn {
    padding: 4px 7px;
    font-size: .56rem;
    font-weight: 700;
    font-family: 'JetBrains Mono', monospace;
    border: none;
    border-right: 1px solid var(--pl-border);
    background: var(--pl-card2);
    color: var(--pl-dim);
    cursor: pointer;
    transition: all .12s;
    min-width: 26px;
    text-align: center;
}
.bet-k-btn:last-child { border-right: none; }
.bet-k-btn:hover { color: var(--pl-text); background: rgba(255,255,255,0.04); }
.bet-k-btn.active {
    background: rgba(220,20,60,0.12);
    color: var(--pl-red);
    font-weight: 800;
}
.bet-k-inc {
    width: 26px; height: 26px;
    padding: 0;
    font-size: .72rem;
    font-weight: 700;
    line-height: 1;
    border-radius: 50%;
    border: 1px solid var(--pl-border);
    background: var(--pl-card2);
    color: var(--pl-dim);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .12s;
}
.bet-k-inc:hover { border-color: var(--pl-red-border); color: var(--pl-red); }

/* Mixed slider row */
.bet-mixed-row {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 0;
    font-size: .6rem;
}
.bet-mix-range {
    flex: 1;
    height: 4px;
    -webkit-appearance: none;
    appearance: none;
    background: linear-gradient(to right, #60a5fa, var(--pl-border), #ef4444);
    border-radius: 2px;
    outline: none;
    cursor: pointer;
}
.bet-mix-range::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 14px; height: 14px;
    border-radius: 50%;
    background: var(--pl-red);
    border: 2px solid #fff;
    cursor: pointer;
}
.bet-mix-range::-moz-range-thumb {
    width: 14px; height: 14px;
    border-radius: 50%;
    background: var(--pl-red);
    border: 2px solid #fff;
    cursor: pointer;
}
.mix-label { font-size: .54rem; color: var(--pl-dim); white-space: nowrap; }
.mix-val {
    font-size: .54rem;
    font-weight: 700;
    color: var(--pl-text);
    font-family: 'JetBrains Mono', monospace;
    min-width: 22px;
    text-align: right;
}

/* Gen window chips */
.bet-genw-row {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 4px;
    font-size: .58rem;
}
.bet-genw-label { color: var(--pl-dim); margin-right: 2px; }
.bet-genw-btn {
    padding: 2px 7px;
    font-size: .52rem;
    font-weight: 700;
    border-radius: 8px;
    border: 1px solid var(--pl-border);
    background: transparent;
    color: var(--pl-dim);
    cursor: pointer;
    transition: all .12s;
    font-family: 'JetBrains Mono', monospace;
}
.bet-genw-btn:hover { border-color: rgba(255,255,255,0.1); color: var(--pl-text); }
.bet-genw-btn.active { background: rgba(220,20,60,0.08); border-color: var(--pl-red-border); color: var(--pl-red); }

/* Method note */
.bet-method-note {
    font-size: .58rem;
    color: var(--pl-dim);
    margin: 4px 0 0;
    font-style: italic;
}

/* Generation mode bar */
.bet-mode-bar {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
    margin: 6px 0;
}
.bet-mode-btn {
    padding: 4px 10px;
    font-size: .6rem;
    font-weight: 600;
    border-radius: 10px;
    border: 1px solid var(--pl-border);
    background: var(--pl-card2);
    color: var(--pl-dim);
    cursor: pointer;
    transition: all .15s;
    font-family: 'Inter', sans-serif;
}
.bet-mode-btn:hover { border-color: rgba(255,255,255,0.12); color: var(--pl-text); }
.bet-mode-btn.active {
    background: rgba(220,20,60,0.08);
    border-color: var(--pl-red-border);
    color: var(--pl-red);
}

/* ================================================================
   Mobile-first above-the-fold
   ================================================================ */

/* System chips (replacing checkboxes) */
.bet-sys-wrap {
    max-height: none;
    overflow: visible;
}
.bet-sys-sub {
    font-size: .62rem;
    color: var(--pl-dim);
    margin: 0 0 8px;
    line-height: 1.4;
}
.bet-sys-chip {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 1px;
    padding: 4px 10px;
    font-family: 'JetBrains Mono', monospace;
    border-radius: 8px;
    border: 1px solid var(--pl-border);
    background: var(--pl-card2);
    color: var(--pl-dim);
    cursor: pointer;
    transition: all .15s;
    min-width: 48px;
}
.bet-sys-chip:hover { border-color: rgba(255,255,255,0.12); color: var(--pl-text); }
.bet-sys-chip .sys-label { font-size: .58rem; font-weight: 700; }
.bet-sys-chip .sys-count { font-size: .5rem; color: var(--pl-muted); }
.bet-sys-chip.rec {
    border-color: rgba(220,20,60,0.2);
    background: rgba(220,20,60,0.03);
}
.bet-sys-chip.rec .sys-label { color: var(--pl-red); }
.bet-sys-chip.active {
    background: rgba(220,20,60,0.12) !important;
    border-color: var(--pl-red) !important;
    color: #fff;
    box-shadow: 0 0 6px rgba(220,20,60,0.2);
}
.bet-sys-chip.active .sys-label { color: #fff; }
.bet-sys-chip.active .sys-count { color: rgba(255,255,255,0.7); }

/* Ticket export card */
.bet-ticket {
    margin-top: 8px;
    border-color: rgba(220,20,60,0.15);
    background: linear-gradient(135deg, rgba(220,20,60,0.03), rgba(15,23,42,0.5));
}
.bet-ticket-title {
    font-size: .78rem;
    font-weight: 700;
    color: var(--pl-text);
    margin-bottom: 8px;
}
.bet-ticket-rows { margin: 8px 0; }
.bet-ticket-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 3px 0;
    font-size: .68rem;
    color: var(--pl-muted);
    border-bottom: 1px solid rgba(255,255,255,0.03);
}
.bet-ticket-row:last-child { border-bottom: none; }
.bet-ticket-row strong { color: var(--pl-text); }
.bet-ticket-actions {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--pl-border);
}
.bet-ticket-note {
    font-size: .58rem;
    color: var(--pl-dim);
    margin: 6px 0 0;
    font-style: italic;
}

@media (max-width: 600px) {
    .pl-wrap > h1 { font-size: .95rem; }
    .pl-live-badge { font-size: .5rem; padding: 1px 6px; margin-left: 4px; }
    .pl-fresh { padding: 2px 0 4px; }
    .pl-variant-bar { padding: 4px 0; }
    .pl-vt-btn { padding: 4px 8px; font-size: .58rem; }
    .bet-k-row { gap: 3px; font-size: .58rem; }
    .bet-k-btn { padding: 3px 5px; font-size: .5rem; min-width: 22px; }
    .bet-k-inc { width: 22px; height: 22px; font-size: .62rem; }
    .bet-mode-btn { padding: 3px 7px; font-size: .52rem; }
    .bet-genw-row { font-size: .52rem; }
    .bet-genw-btn { padding: 2px 5px; font-size: .48rem; }
    .bet-mixed-row { gap: 4px; }
    .bet-mix-range { height: 3px; }
    .bet-ticket-row { font-size: .62rem; }
}

/* ================================================================
   TABS
   ================================================================ */
.pl-tabs {
    display: flex;
    gap: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-bottom: 2px solid var(--pl-border);
    margin: 0 0 12px;
    padding: 0;
    scrollbar-width: none;
}
.pl-tabs::-webkit-scrollbar { display: none; }
.pl-tab {
    flex: 0 0 auto;
    padding: 8px 14px;
    font-size: .68rem;
    font-weight: 700;
    color: var(--pl-dim);
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    cursor: pointer;
    white-space: nowrap;
    transition: color .15s, border-color .15s;
    font-family: inherit;
}
.pl-tab:hover { color: var(--pl-text); }
.pl-tab.is-active {
    color: var(--pl-red);
    border-bottom-color: var(--pl-red);
}

/* Panels: hide all, show active */
.pl-panel { display: none; }
.pl-panel.is-active { display: block; }

/* ================================================================
   FULLSCREEN TICKET OVERLAY
   ================================================================ */
.pl-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(0,0,0,0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}
.pl-overlay-card {
    background: var(--pl-card);
    border: 1px solid var(--pl-border);
    border-radius: 16px;
    padding: 24px 20px;
    max-width: 420px;
    width: 100%;
    text-align: center;
    box-shadow: 0 12px 40px rgba(0,0,0,0.5);
}
.pl-overlay-title {
    font-size: 1rem;
    font-weight: 800;
    color: var(--pl-text);
    margin-bottom: 16px;
}
.pl-overlay-nums {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-bottom: 20px;
}
.pl-overlay-ball {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px; height: 52px;
    border-radius: 50%;
    background: linear-gradient(135deg, #dc143c 0%, #a00020 100%);
    color: #fff;
    font-size: 1.2rem;
    font-weight: 800;
    font-family: 'JetBrains Mono', monospace;
    box-shadow: 0 3px 8px rgba(220,20,60,0.35), inset 0 1px 2px rgba(255,255,255,0.2);
}
.pl-overlay-actions {
    display: flex;
    gap: 8px;
    justify-content: center;
}

/* Accent button (Afișează mare) */
.bet-btn-accent {
    background: linear-gradient(135deg, #dc143c 0%, #a00020 100%) !important;
    color: #fff !important;
    border-color: transparent !important;
    font-weight: 700;
}
.bet-btn-accent:hover {
    opacity: .9;
}

/* ================================================================
   GLOSSY BALLS (Latest draw)
   ================================================================ */
.pl-ball {
    background: linear-gradient(135deg, #dc143c 0%, #b8001e 100%);
    box-shadow: 0 2px 6px rgba(220,20,60,0.3), inset 0 1px 2px rgba(255,255,255,0.15);
}
.pl-ball-plus {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    box-shadow: 0 2px 6px rgba(245,158,11,0.3), inset 0 1px 2px rgba(255,255,255,0.2);
}

@media (max-width: 600px) {
    .pl-tab { padding: 6px 10px; font-size: .6rem; }
    .pl-overlay-ball { width: 44px; height: 44px; font-size: 1rem; }
    .pl-overlay-card { padding: 16px 12px; }
}

/* ================================================================
   PHASE 9 — UI POLISH
   ================================================================ */

/* 9.1 — Calm balls palette (blue default, gold Plus) */
.pl-ball {
    background: linear-gradient(180deg, rgba(52,120,246,0.95), rgba(30,72,170,0.95));
    color: #eaf2ff;
    box-shadow: 0 3px 10px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.10);
    border: 1px solid rgba(255,255,255,0.08);
}
.pl-ball-plus {
    background: linear-gradient(180deg, rgba(245,158,11,0.95), rgba(217,119,6,0.95));
    color: #fff;
    box-shadow: 0 3px 10px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.10);
}

/* 9.2 — Variant filter buttons: bigger on desktop too */
.pl-variant-bar {
    gap: 8px;
    padding: 8px 0;
}
.pl-vt-btn {
    padding: 8px 16px;
    font-size: .72rem;
    border-radius: 14px;
    min-height: 36px;
}

/* 9.2 — Mobile: full-width stacked variant buttons */
@media (max-width: 640px) {
    .pl-variant-bar {
        display: flex;
        flex-direction: column;
        gap: 8px;
        padding: 8px 0;
    }
    .pl-vt-label {
        font-size: .68rem;
        margin-bottom: 2px;
    }
    .pl-vt-btn {
        width: 100%;
        min-height: 44px;
        padding: 12px 14px;
        font-size: .78rem;
        border-radius: 14px;
        text-align: center;
    }
}

/* ================================================================
   PHASE 10 — CALM ACCENT (blue replaces red on interactive states)
   ================================================================ */
:root {
    --pl-accent: #3b82f6;
    --pl-accent-bg: rgba(59,130,246,0.08);
    --pl-accent-border: rgba(59,130,246,0.25);
}

/* Tab bar active */
.pl-tab.is-active {
    color: #eaf2ff;
    border-bottom-color: var(--pl-accent);
}
.pl-tab:hover { color: #cbd5e1; }

/* Variant buttons active */
.pl-vt-btn.active {
    background: var(--pl-accent-bg);
    border-color: var(--pl-accent-border);
    color: #dbeafe;
    box-shadow: 0 0 0 1px rgba(59,130,246,0.10) inset;
}

/* Stats window buttons active */
.pl-wbtn.active,
.pl-zbtn.active,
.pl-pbtn.active,
.pl-cbtn.active {
    background: var(--pl-accent-bg);
    border-color: var(--pl-accent-border);
    color: #dbeafe;
}

/* Bet K buttons active */
.bet-k-btn.active {
    background: var(--pl-accent);
    color: #fff;
    border-color: var(--pl-accent);
}

/* Bet mode buttons active */
.bet-mode-btn.active {
    border-color: var(--pl-accent-border);
    color: #dbeafe;
    background: var(--pl-accent-bg);
}

/* Bet gen-window buttons active */
.bet-genw-btn.active {
    background: var(--pl-accent-bg);
    border-color: var(--pl-accent-border);
    color: #dbeafe;
}

/* System chips active */
.bet-sys-chip.active {
    background: var(--pl-accent);
    border-color: var(--pl-accent);
}

/* K stepper hover */
.bet-k-inc:hover {
    border-color: var(--pl-accent-border);
    color: var(--pl-accent);
}

/* LIVE badge stays RED (intentional) */
.pl-live-badge {
    background: rgba(239,68,68,0.12);
    border-color: rgba(239,68,68,0.30);
    color: #ffd1d1;
}

/* Balls: soften text to not-pure-white */
.pl-ball { color: #dbeafe; }
.pl-ball-plus { color: #fef3c7; }

/* ======================================================
   PHASE 10b — UI polish (calm archive, bigger chips/balls, overlay)
   ====================================================== */

/* 1) Archive balls — force calm blue (override main CSS red) */
#plArchiveList .ab {
    background: linear-gradient(180deg, rgba(52,120,246,0.95), rgba(30,72,170,0.95)) !important;
    color: #eaf2ff !important;
    box-shadow: 0 2px 6px rgba(0,0,0,0.25), inset 0 1px 0 rgba(255,255,255,0.10) !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
}
#plArchiveList .ab-plus {
    background: linear-gradient(180deg, rgba(245,158,11,0.95), rgba(217,119,6,0.95)) !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,0.10) !important;
}

/* 2) Bilet method chips — bigger desktop + mobile */
.bet-mode-btn {
    min-height: 40px;
    padding: 10px 14px;
    font-size: 0.82rem;
    border-radius: 14px;
    line-height: 1;
}
@media (max-width: 640px) {
    .bet-mode-row, .bet-modes, .bet-mode-wrap {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }
    .bet-mode-btn {
        width: 100%;
        min-height: 44px;
        font-size: 0.85rem;
        padding: 12px 12px;
        justify-content: center;
    }
}

/* 3) Ball numbers bigger everywhere */
.pl-ball {
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.2px;
}
#plArchiveList .ab {
    font-size: 0.62rem;
    font-weight: 800;
}
@media (max-width: 640px) {
    .pl-ball { font-size: 0.88rem; }
}

/* Bet grid buttons — bigger numbers */
#plBetGrid button {
    font-size: 0.78rem;
    font-weight: 800;
}
@media (max-width: 640px) {
    #plBetGrid button { font-size: 0.82rem; }
}

/* 4) Accent button — calm blue (not red) */
.bet-btn-accent {
    background: linear-gradient(180deg, rgba(52,120,246,0.95), rgba(30,72,170,0.95));
    color: #eaf2ff;
    border: 1px solid rgba(255,255,255,0.10);
}

/* 5) Fullscreen overlay — bigger balls + footer link */
.pl-overlay .pl-overlay-ball {
    width: 56px;
    height: 56px;
    font-size: 1.1rem;
    font-weight: 900;
}
@media (max-width: 640px) {
    .pl-overlay .pl-overlay-ball {
        width: 50px;
        height: 50px;
        font-size: 1rem;
    }
}
.pl-overlay .pl-ticket-foot {
    margin-top: 10px;
    font-size: 0.72rem;
    opacity: 0.75;
    text-align: center;
}
.pl-overlay .pl-ticket-foot a {
    color: rgba(170, 205, 255, 0.9);
    text-decoration: none;
    border-bottom: 1px dashed rgba(170, 205, 255, 0.3);
}

/* ======================================================================
   PHASE 12 — PROFESSIONAL COLOR SYSTEM
   Premium, calm, tech-dashboard palette. Red removed except LIVE badge.
   ====================================================================== */

/* 1) GLOBAL COLOR VARIABLES (overrides main CSS :root) */
:root {
    --pl-bg: #0b1220;
    --pl-card: rgba(255,255,255,0.03);
    --pl-border: rgba(255,255,255,0.06);
    --pl-text: #cbd5e1;
    --pl-text-strong: #f1f5f9;
    --pl-muted: #94a3b8;

    /* Redirect red vars → blue (kills red everywhere) */
    --pl-red: #3478f6;
    --pl-red-dark: #1e48aa;
    --pl-red-glow: rgba(52,120,246,0.15);
    --pl-red-border: rgba(52,120,246,0.25);

    --pl-accent: #3478f6;
    --pl-accent-soft: rgba(52,120,246,0.18);
    --pl-accent-bg: rgba(52,120,246,0.08);
    --pl-accent-border: rgba(52,120,246,0.35);

    --pl-gold: #f59e0b;
    --pl-gold-dark: #d97706;
    --pl-gold-soft: rgba(245,158,11,0.18);

    --pl-success: #10b981;
    --pl-cold: #38bdf8;

    --pl-neutral-cell: rgba(255,255,255,0.04);
}

/* 2) REMAINING HARDCODED RED → BLUE (in v1.css itself) */

/* bet-grid-wrap selected state */
.bet-grid-wrap .pl-gcell.bet-on {
    background: linear-gradient(180deg, var(--pl-accent), #1e48aa) !important;
    border-color: var(--pl-accent-border) !important;
    color: #fff !important;
}

/* bet grid hover */
.bet-grid-wrap .pl-gcell:hover,
.pl-gcell:hover {
    border-color: var(--pl-accent-border);
    color: var(--pl-text-strong);
}

/* Grid hit (matched number from draw) → green */
.pl-gcell.hit {
    background: linear-gradient(180deg, var(--pl-success), #059669) !important;
    border-color: rgba(16,185,129,0.35) !important;
    color: #fff !important;
}
.pl-gcell.bet-on.bet-hit {
    background: var(--pl-success) !important;
    border-color: var(--pl-success) !important;
}
.pl-gcell.bet-hit {
    box-shadow: 0 0 8px rgba(16,185,129,0.4);
    border-color: var(--pl-success) !important;
}

/* Grid selected number → blue */
.pl-gcell.pl-num-selected {
    background: rgba(52,120,246,0.25) !important;
    border-color: var(--pl-accent) !important;
    color: #fff !important;
    box-shadow: 0 0 0 2px rgba(52,120,246,0.12);
}

/* Neutral grid cell base */
.pl-gcell {
    background: var(--pl-neutral-cell);
    border: 1px solid var(--pl-border);
    color: var(--pl-text);
}

/* 3) PRIMARY & SECONDARY BUTTONS */

/* Generate button (primary CTA) */
.bet-btn-accent,
#plBetGen {
    background: linear-gradient(180deg, var(--pl-accent), #1e48aa) !important;
    border: 1px solid var(--pl-accent-border) !important;
    color: #fff !important;
    font-weight: 700;
}

/* Secondary button (Afișează mare) */
#plBetFullscreen {
    background: rgba(52,120,246,0.12);
    border: 1px solid rgba(52,120,246,0.25);
    color: #eaf2ff;
}

/* Neutral buttons (Șterge, Copiază) */
#plBetClear,
#plBetCopy {
    background: rgba(255,255,255,0.04);
    border: 1px solid var(--pl-border);
    color: var(--pl-text);
}

/* K stepper hover → blue */
.bet-k-inc:hover {
    border-color: var(--pl-accent-border);
    color: var(--pl-accent);
}

/* Active K button → blue */
.bet-k-btn.active {
    background: var(--pl-accent);
    color: #fff;
    border-color: var(--pl-accent);
}

/* Active bet mode → blue */
.bet-mode-btn.active {
    border-color: var(--pl-accent-border);
    color: #dbeafe;
    background: var(--pl-accent-soft);
}

/* Active stats window button → blue */
.bet-genw-btn.active {
    background: var(--pl-accent-bg);
    border-color: var(--pl-accent-border);
    color: #dbeafe;
}

/* System chips active → blue */
.bet-sys-chip.active {
    background: var(--pl-accent) !important;
    border-color: var(--pl-accent) !important;
    box-shadow: 0 0 6px rgba(52,120,246,0.2);
}
.bet-sys-chip.active .sys-label { color: #fff; }
.bet-sys-chip.active .sys-count { color: rgba(255,255,255,0.7); }

/* Recommended chip → blue accent */
.bet-sys-chip.rec {
    border-color: rgba(52,120,246,0.2);
    background: rgba(52,120,246,0.03);
}
.bet-sys-chip.rec .sys-label { color: var(--pl-accent); }

/* System chip base border */
.bet-sys-chip {
    border-color: var(--pl-border);
    background: transparent;
}

/* Bet score wrap */
.bet-score-wrap {
    border-color: rgba(52,120,246,0.15);
    background: linear-gradient(135deg, rgba(52,120,246,0.03), rgba(15,23,42,0.5));
}

/* 4) TABS — PREMIUM GOLD ACTIVE */
.pl-tab.is-active {
    background: linear-gradient(180deg, rgba(245,158,11,0.12), rgba(255,255,255,0.03));
    border: 1px solid rgba(245,158,11,0.55);
    box-shadow: 0 0 0 2px rgba(245,158,11,0.10);
    color: var(--pl-text-strong);
    border-bottom-color: rgba(245,158,11,0.55);
}

.pl-tab {
    background: rgba(255,255,255,0.03);
    border: 1px solid var(--pl-border);
    color: var(--pl-text);
}
.pl-tab:hover {
    color: var(--pl-text-strong);
    border-color: rgba(255,255,255,0.12);
}

/* Stats window buttons active → blue */
.pl-wbtn.active,
.pl-zbtn.active,
.pl-pbtn.active,
.pl-cbtn.active {
    background: var(--pl-accent-bg);
    border-color: var(--pl-accent-border);
    color: #dbeafe;
}

/* Variant buttons active → blue */
.pl-vt-btn.active {
    background: var(--pl-accent-bg);
    border-color: var(--pl-accent-border);
    color: #dbeafe;
    box-shadow: 0 0 0 1px rgba(52,120,246,0.10) inset;
}

/* 5) BALLS — consistent blue (latest + archive + overlay) */
.pl-ball {
    background: linear-gradient(180deg, var(--pl-accent), #1e48aa);
    color: #dbeafe;
    box-shadow: 0 3px 10px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.10);
    border: 1px solid rgba(255,255,255,0.08);
}
.pl-ball-plus {
    background: linear-gradient(180deg, var(--pl-gold), #d97706);
    color: #fef3c7;
    box-shadow: 0 3px 10px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.10);
}

/* Archive balls */
#plArchiveList .ab {
    background: linear-gradient(180deg, var(--pl-accent), #1e48aa) !important;
    color: #dbeafe !important;
    box-shadow: 0 2px 6px rgba(0,0,0,0.25), inset 0 1px 0 rgba(255,255,255,0.10) !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
}
#plArchiveList .ab-plus {
    background: linear-gradient(180deg, var(--pl-gold), #d97706) !important;
    color: #fef3c7 !important;
    border: 1px solid rgba(255,255,255,0.10) !important;
}

/* Overlay balls */
.pl-overlay .pl-overlay-ball,
.pl-overlay-ball {
    background: linear-gradient(180deg, var(--pl-accent), #1e48aa);
    color: #fff;
    box-shadow: 0 3px 10px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.10);
    border: 1px solid rgba(255,255,255,0.08);
}

/* 6) LIVE BADGE — remains RED (intentional) */
.pl-live-badge {
    background: rgba(239,68,68,0.12);
    border-color: rgba(239,68,68,0.30);
    color: #ffd1d1;
}

/* 7) HEATMAP / ZONE CELLS */
.zone-bar-fill {
    background: var(--pl-accent);
}

/* Cards & panels background */
.pl-card {
    background: var(--pl-card);
    border-color: var(--pl-border);
}

/* Variant chip label (M1/M2 badge) → blue */
.pl-lc-variant {
    background: var(--pl-accent-soft);
    border: 1px solid var(--pl-accent-border);
    color: var(--pl-accent);
}

/* Plus label */
.pl-lc-plus {
    background: var(--pl-gold-soft);
    border-color: rgba(245,158,11,0.30);
    color: var(--pl-gold);
}

/* ======================================================================
   PHASE 13 — VISUAL DEPTH & LIGHT ELEVATION
   Reduce "too dark" feeling, improve structural hierarchy.
   ====================================================================== */

/* 1) Background lift */
:root {
    --pl-bg: #0f172a;
}
body.pl-polonia {
    background: var(--pl-bg);
}

/* 2) Card elevation */
.pl-card,
.pl-module,
.pl-box,
.pl-panel {
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid rgba(255,255,255,0.08);
    box-shadow: 0 6px 18px rgba(0,0,0,0.35);
}

/* 3) Grid 1-80 light separation */
#plBetGrid button {
    background: rgba(255,255,255,0.06) !important;
    border: 1px solid rgba(255,255,255,0.08);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
    transition: all .15s ease;
}
#plBetGrid button:hover {
    background: rgba(255,255,255,0.10) !important;
}

/* 4) Primary CTA depth */
#plBetGen {
    box-shadow: 0 8px 24px rgba(52,120,246,0.28), inset 0 1px 0 rgba(255,255,255,0.15);
    transition: transform .15s ease, box-shadow .15s ease;
}
#plBetGen:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(52,120,246,0.35), inset 0 1px 0 rgba(255,255,255,0.15);
}

/* 5) Text clarity boost */
.pl-muted,
.pl-subtext,
.pl-note {
    color: #dbe5f5 !important;
}

/* 6) Result cards separation */
.pl-draw-card,
.pl-lc-header {
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.08);
    box-shadow: 0 4px 14px rgba(0,0,0,0.30);
    margin-bottom: 18px;
    padding: 18px;
    border-radius: 14px;
}
.pl-lc-header {
    margin-bottom: 8px;
    padding: 10px 12px;
    border-radius: 10px;
}

/* 7) Tab bar structural line */
.pl-tabs {
    border-bottom: 1px solid rgba(255,255,255,0.08);
    padding-bottom: 6px;
}

/* 8) Mobile breathing space */
@media (max-width: 640px) {
    .pl-card,
    .pl-module,
    .pl-box {
        padding: 16px !important;
    }
    #plBetGrid {
        gap: 10px !important;
    }
}

/* ============================================================
   PHASE 14 — LIGHT LIFT + RED LEAK OVERRIDES
   ============================================================ */

/* Ensure background lift applies even if body has no class */
body {
    background: #0f172a !important;
}

/* Override remaining hardcoded reds from main css (6 selectors) */
.pl-chip.hot {
    background: rgba(245,158,11,0.16) !important;
    border-color: rgba(245,158,11,0.28) !important;
    color: #f59e0b !important;
}

.pl-pairs-go {
    background: rgba(52,120,246,0.18) !important;
    border: 1px solid rgba(52,120,246,0.35) !important;
    color: #dbeafe !important;
}
.pl-pairs-go:hover {
    background: rgba(52,120,246,0.24) !important;
}

.bet-grid-circ .pl-gcell:hover {
    border-color: rgba(52,120,246,0.35) !important;
}
.bet-grid-circ .pl-gcell.bet-on {
    box-shadow: 0 0 8px rgba(52,120,246,0.30) !important;
}

/* bet summary (remove any red tint) */
.bet-sumar {
    border-color: rgba(52,120,246,0.18) !important;
    background: linear-gradient(135deg,
        rgba(52,120,246,0.04),
        rgba(15,23,42,0.55)
    ) !important;
}

/* Remove faint red tint from base bet buttons */
.bet-btn {
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
}

/* Make active tab easier to see (gold slightly stronger) */
.pl-tab.is-active {
    background: linear-gradient(180deg,
        rgba(245,158,11,0.18),
        rgba(255,255,255,0.04)
    ) !important;
    border-color: rgba(245,158,11,0.65) !important;
}

/* Slightly boost card elevation now that bg is lifted */
.pl-card,
.pl-module,
.pl-box,
.pl-panel {
    background: rgba(255,255,255,0.06) !important;
    border: 1px solid rgba(255,255,255,0.10) !important;
}

/* ============================================================
   PHASE 15.1 — UI POLISH + CTA BOOST + WHATSAPP SHARE
   ============================================================ */

/* 1) "Câte numere" label — bigger + legible */
.bet-k-row > span,
.pl-k-label,
.pl-count-label,
label[for="plKSelect"] {
    font-size: 1.05rem !important;
    font-weight: 600;
    color: #e2e8f0 !important;
    letter-spacing: 0.3px;
}

.bet-k-seg button,
.pl-k-options button {
    min-height: 40px;
    font-size: 0.9rem;
    font-weight: 600;
    padding: 8px 14px;
}

@media (max-width: 640px) {
    .bet-k-seg button,
    .pl-k-options button {
        min-height: 44px;
        font-size: 1rem;
    }
}

/* 2) "Generează bilet" CTA — dominant + centered */
#plBetGen {
    display: block;
    margin: 18px auto 10px auto !important;
    min-height: 52px;
    font-size: 1.05rem;
    font-weight: 700;
    padding: 14px 26px;
    border-radius: 16px;
    box-shadow: 0 12px 28px rgba(52,120,246,0.35);
}

@media (max-width: 640px) {
    #plBetGen {
        width: 100%;
        min-height: 56px;
        font-size: 1.1rem;
    }
}

/* 3) Grid 1-80 — bigger numbers + contrast */
#plBetGrid button {
    font-size: 1rem !important;
    font-weight: 600;
    color: #e2e8f0 !important;
}

#plBetGrid button.is-selected,
#plBetGrid button.bet-on {
    font-weight: 700;
    color: #ffffff !important;
}

@media (max-width: 640px) {
    #plBetGrid button {
        font-size: 1.05rem !important;
    }
}

/* 4) Biletul tău — softer blue + bigger balls */
.pl-ticket-ball,
.pl-overlay-ball {
    width: 48px;
    height: 48px;
    font-size: 1rem;
    font-weight: 700;
    background: linear-gradient(180deg, #5a92ff, #3d73dc) !important;
}

@media (max-width: 640px) {
    .pl-ticket-ball,
    .pl-overlay-ball {
        width: 50px;
        height: 50px;
        font-size: 1.05rem;
    }
}

/* 5) Copy buttons — visible but secondary */
.pl-copy-btn,
button.pl-copy,
.bet-btn {
    background: rgba(255,255,255,0.07) !important;
    border: 1px solid rgba(255,255,255,0.12) !important;
    font-weight: 600;
    transition: all .15s ease;
}

.pl-copy-btn:hover,
button.pl-copy:hover,
.bet-btn:hover {
    background: rgba(255,255,255,0.12) !important;
}

/* 7) WhatsApp share button */
.pl-wa-share {
    display: block;
    margin: 16px auto 0 auto;
    padding: 12px 18px;
    text-align: center;
    font-weight: 600;
    font-size: 0.85rem;
    border-radius: 14px;
    background: rgba(34,197,94,0.12);
    border: 1px solid rgba(34,197,94,0.35);
    color: #22c55e;
    text-decoration: none;
    transition: all .2s ease;
    max-width: 280px;
}

.pl-wa-share:hover {
    background: rgba(34,197,94,0.2);
}

/* ============================================================
   PHASE 15.2 — FOCUS & DOMINANCE TUNING
   ============================================================ */

/* 1) Vertical rhythm — more breathing space */
.pl-card,
.pl-module,
.pl-box,
.pl-panel {
    margin-bottom: 28px !important;
}

.pl-section + .pl-section {
    margin-top: 32px !important;
}

/* 2) Rezultate + Bilet panels — dominant */
.pl-panel[data-panel="rezultate"] .pl-card,
.pl-panel[data-panel="bilet"] .pl-card {
    background: rgba(255,255,255,0.08) !important;
    border: 1px solid rgba(255,255,255,0.14) !important;
    box-shadow: 0 12px 30px rgba(0,0,0,0.35);
}

/* 3) Secondary panels — softer */
.pl-panel[data-panel="analiza"],
.pl-panel[data-panel="asocieri"],
.pl-panel[data-panel="arhiva"],
.pl-panel[data-panel="info"],
.pl-panel[data-panel="analiza"] .pl-card,
.pl-panel[data-panel="asocieri"] .pl-card,
.pl-panel[data-panel="arhiva"] .pl-card,
.pl-panel[data-panel="info"] .pl-card {
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
}

/* 4) "Biletul tău" visual moment boost */
.bet-ticket,
#plBetTicket {
    padding: 20px 18px !important;
    border-radius: 18px;
    background: linear-gradient(180deg,
        rgba(52,120,246,0.08),
        rgba(255,255,255,0.04)
    ) !important;
    border: 1px solid rgba(52,120,246,0.25) !important;
    box-shadow: 0 14px 36px rgba(0,0,0,0.35);
}

/* 5) Tab hierarchy clarity */
.pl-tab {
    opacity: 0.85;
    transition: opacity .15s ease;
}
.pl-tab.is-active {
    opacity: 1;
}

/* 6) Generate CTA — refined shadow */
#plBetGen {
    box-shadow: 0 8px 20px rgba(52,120,246,0.28) !important;
}

/* ============================================================
   PHASE 15.2b — TICKET UX REFINEMENT
   ============================================================ */

/* Ticket actions button spacing */
.bet-ticket-actions .bet-btn {
    margin-top: 8px;
}

.bet-btn-secondary {
    background: rgba(52,120,246,0.10) !important;
    border: 1px solid rgba(52,120,246,0.25) !important;
    color: #dbeafe !important;
}
.bet-btn-secondary:hover {
    background: rgba(52,120,246,0.18) !important;
}

/* =========================================================
   PHASE 15.5 — OLD TAB MENU PARITY
   ========================================================= */

/* 1) Tabs wrapper: spacing + layout */
.pl-tabs {
    display: flex !important;
    gap: 10px !important;
    padding: 10px !important;
    background: rgba(255,255,255,0.03) !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    border-radius: 18px !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
}

/* hide scrollbar */
.pl-tabs::-webkit-scrollbar { height: 0; }

/* 2) Each tab: "old pill" size */
.pl-tab {
    flex: 0 0 auto !important;
    min-height: 44px !important;
    padding: 10px 14px !important;
    border-radius: 16px !important;
    border: 1px solid rgba(255,255,255,0.10) !important;
    background: rgba(255,255,255,0.04) !important;
    color: rgba(255,255,255,0.72) !important;
    font-weight: 700 !important;
    font-size: 0.82rem !important;
    letter-spacing: 0.1px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    white-space: nowrap !important;
    opacity: 1 !important;
    transition: all 0.15s ease !important;
    cursor: pointer !important;
}

/* 3) Hover/focus */
.pl-tab:hover {
    border-color: rgba(255,255,255,0.16) !important;
    background: rgba(255,255,255,0.06) !important;
    color: #cbd5e1 !important;
}

/* 4) Active tab: OLD VERSION style (gold frame + clear text) */
.pl-tab.is-active {
    background: linear-gradient(180deg, rgba(245,158,11,0.22), rgba(255,255,255,0.04)) !important;
    border-color: rgba(245,158,11,0.70) !important;
    color: #f8fafc !important;
    box-shadow: 0 6px 16px rgba(0,0,0,0.25) !important;
    opacity: 1 !important;
}

/* Ensure text inside active is not tinted */
.pl-tab.is-active * { color: #f8fafc !important; }

/* 5) Mobile: compact but tappable */
@media (max-width: 640px) {
    .pl-tabs {
        padding: 8px !important;
        gap: 8px !important;
    }
    .pl-tab {
        min-height: 42px !important;
        padding: 9px 12px !important;
        border-radius: 14px !important;
        font-size: 0.78rem !important;
    }
}

/* END PHASE 15.5 */

/* =========================================================
   PHASE 15.6 — Countdown Card (Live feel)
   ========================================================= */
.pl-countdown-card {
    margin: 14px 0 10px;
    padding: 16px 14px;
    border-radius: 18px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.10);
    box-shadow: 0 10px 24px rgba(0,0,0,0.22);
    text-align: center;
}
.pl-cd-label {
    font-weight: 800;
    letter-spacing: 0.14em;
    font-size: 0.78rem;
    opacity: 0.72;
}
.pl-cd-timer {
    margin: 10px 0 6px;
    font-weight: 900;
    font-size: 2.25rem;
    letter-spacing: 0.06em;
    color: var(--pl-gold);
    text-shadow: 0 6px 18px rgba(245,158,11,0.18);
}
.pl-cd-sub {
    font-size: 0.92rem;
    opacity: 0.78;
}
@media (max-width: 640px) {
    .pl-cd-timer { font-size: 2.05rem; }
}

/* END PHASE 15.6 */

/* =========================================================
   PHASE 15.7 — Countdown scale down + filter labels
   ========================================================= */
.pl-countdown-card {
    padding: 14px 12px !important;
}
.pl-cd-label {
    font-size: 0.74rem !important;
    letter-spacing: 0.12em !important;
}
.pl-cd-timer {
    font-size: 1.70rem !important;
    margin: 8px 0 6px !important;
    letter-spacing: 0.05em !important;
}
.pl-cd-sub {
    font-size: 0.88rem !important;
    opacity: 0.76 !important;
}
@media (max-width: 640px) {
    .pl-cd-timer { font-size: 1.55rem !important; }
    .pl-cd-sub { font-size: 0.84rem !important; }
}

/* END PHASE 15.7 */

/* =========================================================
   PHASE 15.8 — Filter single row + countdown subtext
   ========================================================= */

/* Filter: force single row */
.pl-variant-bar {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;
    justify-content: center !important;
    align-items: center !important;
}
.pl-vt-btn {
    flex: 1 1 auto !important;
    white-space: nowrap !important;
    padding: 10px 12px !important;
    font-size: 0.92rem !important;
}
.pl-vt-label {
    white-space: nowrap !important;
    flex-shrink: 0 !important;
}

/* Countdown subtext: smaller, single line */
.pl-cd-sub {
    font-size: 0.82rem !important;
    opacity: 0.75 !important;
    white-space: nowrap !important;
}

@media (max-width: 640px) {
    .pl-vt-btn {
        font-size: 0.88rem !important;
        padding: 8px 10px !important;
    }
    .pl-cd-sub {
        font-size: 0.74rem !important;
    }
}

/* END PHASE 15.8 */

/* =========================================================
   PHASE 15.9 — Filter inline segmented + text overflow fix
   ========================================================= */

/* Filter: force single row segmented control */
.pl-variant-bar {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
}
.pl-vt-btn {
    flex: 1 1 0 !important;
    width: auto !important;
    max-width: none !important;
    white-space: nowrap !important;
    text-align: center !important;
    padding: 12px 10px !important;
    border-radius: 14px !important;
    font-size: 0.92rem !important;
    line-height: 1.1 !important;
}
.pl-vt-label {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
}

@media (max-width: 420px) {
    .pl-vt-btn {
        padding: 10px 8px !important;
        font-size: 0.84rem !important;
        border-radius: 12px !important;
    }
    .pl-vt-label {
        font-size: 0.78rem !important;
    }
}

/* Text overflow safety */
.pl-card, .pl-panel, .pl-box, .pl-module,
.pl-countdown-card {
    overflow: hidden !important;
}

.pl-cd-sub {
    font-size: 0.78rem !important;
    opacity: 0.78 !important;
    line-height: 1.2 !important;
    padding: 0 10px !important;
    text-align: center !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
}

@media (max-width: 640px) {
    .pl-cd-sub {
        font-size: 0.74rem !important;
    }
}

/* END PHASE 15.9 */

/* =========================================================
   PHASE 16A — Highlight "Afișează pe ecran" (pulse + flame)
   ========================================================= */
#plBetFullscreen,
.bet-btn-fullscreen,
.pl-btn-fullscreen {
    position: relative !important;
    border: 1px solid rgba(245,158,11,0.40) !important;
    background: linear-gradient(180deg, rgba(245,158,11,0.18), rgba(52,120,246,0.10)) !important;
    color: #f1f5f9 !important;
    box-shadow: 0 10px 26px rgba(245,158,11,0.12), 0 0 0 1px rgba(245,158,11,0.10) inset !important;
    overflow: hidden !important;
}

#plBetFullscreen::after,
.bet-btn-fullscreen::after,
.pl-btn-fullscreen::after {
    content: "";
    position: absolute;
    inset: -6px;
    border-radius: 16px;
    border: 1px solid rgba(245,158,11,0.30);
    opacity: 0.0;
    animation: plPulse 2.2s ease-in-out infinite;
    pointer-events: none;
}

@keyframes plPulse {
    0%   { transform: scale(0.98); opacity: 0.00; }
    35%  { transform: scale(1.00); opacity: 0.32; }
    70%  { transform: scale(1.02); opacity: 0.10; }
    100% { transform: scale(0.98); opacity: 0.00; }
}

/* [removed: old pl-flame radial gradient — replaced by P1 unified block] */

@media (prefers-reduced-motion: reduce) {
    #plBetFullscreen::after,
    .bet-btn-fullscreen::after,
    .pl-btn-fullscreen::after {
        animation: none !important;
    }
}

/* =========================================================
   PHASE 16B — K selector stepper
   ========================================================= */
.pl-k-stepper, #plKStepper {
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255,255,255,0.10) !important;
    background: rgba(255,255,255,0.04) !important;
    flex-shrink: 0 !important;
}

.pl-k-stepper > button,
#plKStepper > button {
    border-radius: 0 !important;
    border: 0 !important;
    background: transparent !important;
    min-width: 44px !important;
    min-height: 44px !important;
    font-size: 1.15rem !important;
    font-weight: 700 !important;
    color: rgba(255,255,255,0.8) !important;
    cursor: pointer !important;
    transition: background 0.15s !important;
}

.pl-k-stepper > button:first-child,
#plKStepper > button:first-child {
    border-right: 1px solid rgba(255,255,255,0.10) !important;
}

.pl-k-stepper > button:hover,
#plKStepper > button:hover {
    background: rgba(255,255,255,0.08) !important;
}

.bet-k-row {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    flex-wrap: wrap !important;
}

.bet-k-seg {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
}

.bet-k-btn {
    min-width: 32px !important;
    min-height: 32px !important;
    padding: 4px 6px !important;
    font-size: 0.78rem !important;
    border-radius: 10px !important;
}

@media (max-width: 640px) {
    .bet-k-btn {
        min-width: 28px !important;
        min-height: 28px !important;
        padding: 3px 4px !important;
        font-size: 0.72rem !important;
        border-radius: 8px !important;
    }
}

/* =========================================================
   PHASE 16C — Odds styling in ticket card
   ========================================================= */
.pl-odds-row span {
    opacity: 0.85 !important;
}
.pl-odds-row strong {
    color: var(--pl-gold) !important;
}
.pl-odds-note {
    font-size: 0.78rem !important;
    opacity: 0.65 !important;
    margin-top: 8px !important;
    font-style: italic !important;
    text-align: center !important;
}

/* END PHASE 16 */

/* =========================================================
   PHASE 16.1 — Perfect circle balls
   ========================================================= */

/* Result balls: perfect circles */
.pl-ball {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    line-height: 1 !important;
    font-weight: 700 !important;
    font-size: 0.82rem !important;
    box-sizing: border-box !important;
}

.pl-ball-plus {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    line-height: 1 !important;
}

/* Balls container: centered flex wrap */
.pl-balls {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    align-items: center !important;
}

/* Grid cells (bet grid): responsive circles */
.pl-gcell {
    aspect-ratio: 1 / 1 !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
}

/* Archive balls */
#plArchiveList .ab {
    width: 26px !important;
    height: 26px !important;
    min-width: 26px !important;
    min-height: 26px !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
}

/* Ticket summary number pills */
.sn {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    min-height: 34px !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
}

@media (max-width: 640px) {
    .pl-ball, .pl-ball-plus {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        min-height: 34px !important;
        font-size: 0.78rem !important;
    }
    .pl-gcell {
        font-size: 0.72rem !important;
    }
}

/* =========================================================
   PHASE 16.2 — Dark UI readability fix
   ========================================================= */

/* Stats row: higher contrast */
.pl-stats-row {
    color: rgba(255,255,255,0.78) !important;
}
.pl-stats-row strong {
    color: #e2e8f0 !important;
}
.pl-stats-row span {
    opacity: 0.88 !important;
}

/* Generic text readability in dark cards */
.pl-card p,
.pl-panel p,
.bet-method-note,
.bet-ticket-note {
    color: rgba(255,255,255,0.72) !important;
}

/* Labels and secondary text */
.pl-lc-variant,
.pl-lc-plus,
.pl-lc-date {
    color: rgba(255,255,255,0.78) !important;
}

/* Ensure bet ticket rows readable */
.bet-ticket-row span {
    color: rgba(255,255,255,0.78) !important;
}
.bet-ticket-row strong {
    color: #e2e8f0 !important;
}

/* END PHASE 16.1 + 16.2 */

/* =========================================================
   PHASE 16P — Heatmap grid
   ========================================================= */
.pl-hm-filters {
    display: flex; gap: 8px; flex-wrap: wrap; margin: 8px 0;
}
.pl-hm-btn {
    padding: 8px 12px; border-radius: 12px; font-size: 0.78rem; font-weight: 700;
    border: 1px solid rgba(255,255,255,0.10); background: rgba(255,255,255,0.04);
    color: rgba(255,255,255,0.72); cursor: pointer; transition: all 0.15s;
}
.pl-hm-btn.active {
    background: linear-gradient(180deg, rgba(245,158,11,0.20), rgba(255,255,255,0.04));
    border-color: rgba(245,158,11,0.60); color: #f8fafc;
}
.pl-hm-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(28px, 1fr));
    gap: 4px; margin: 10px 0;
}
.pl-hm-cell {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    padding: 6px 2px; border-radius: 8px; border: 1px solid transparent;
    min-height: 44px; text-align: center; transition: transform 0.1s;
}
.pl-hm-cell:hover { transform: scale(1.08); z-index: 1; }
.pl-hm-num { font-weight: 800; font-size: 0.78rem; line-height: 1; }
.pl-hm-val { font-size: 0.62rem; opacity: 0.8; margin-top: 2px; }
.pl-hm-legend {
    display: flex; gap: 14px; justify-content: center; font-size: 0.74rem;
    opacity: 0.8; margin: 6px 0 10px;
}
@media (max-width: 640px) {
    .pl-hm-grid { grid-template-columns: repeat(8, 1fr); gap: 3px; }
    .pl-hm-cell { min-height: 38px; padding: 4px 1px; }
    .pl-hm-num { font-size: 0.70rem; }
    .pl-hm-val { font-size: 0.56rem; }
}

/* Top 10 hot/cold balls */
.pl-top-list { display: flex; flex-wrap: wrap; gap: 6px; }
.pl-top-ball {
    display: inline-flex; flex-direction: column; align-items: center;
    width: 42px; height: 42px; border-radius: 50%; font-weight: 800;
    font-size: 0.82rem; justify-content: center; position: relative;
}
.pl-top-ball small {
    font-size: 0.56rem; font-weight: 600; opacity: 0.8; margin-top: -2px;
}
.pl-top-hot {
    background: linear-gradient(180deg, rgba(239,68,68,0.85), rgba(185,28,28,0.85));
    color: #fff; box-shadow: 0 2px 8px rgba(239,68,68,0.25);
}
.pl-top-cold {
    background: linear-gradient(180deg, rgba(59,130,246,0.85), rgba(29,78,216,0.85));
    color: #fff; box-shadow: 0 2px 8px rgba(59,130,246,0.25);
}

/* =========================================================
   PHASE 16P — Streaks
   ========================================================= */
.pl-streak-cards { display: flex; flex-wrap: wrap; gap: 10px; margin: 10px 0; }
.pl-streak-card {
    display: flex; align-items: center; gap: 10px;
    padding: 10px 12px; border-radius: 14px;
    background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08);
    flex: 1 1 220px; min-width: 200px;
}
.pl-streak-icon { font-size: 1.3rem; flex-shrink: 0; }
.pl-streak-title { font-weight: 700; font-size: 0.82rem; }
.pl-streak-desc { font-size: 0.72rem; opacity: 0.72; margin-top: 2px; }
.pl-streak-value { font-weight: 900; font-size: 1.2rem; margin-left: auto; color: var(--pl-gold); }
.pl-streak-ball {
    display: inline-flex; align-items: center; justify-content: center;
    width: 26px; height: 26px; border-radius: 50%; font-size: 0.68rem;
    font-weight: 800; vertical-align: middle; margin-left: 4px;
}
.pl-streak-ball.hot {
    background: linear-gradient(180deg, rgba(239,68,68,0.85), rgba(185,28,28,0.85)); color: #fff;
}
.pl-streak-ball.cold {
    background: linear-gradient(180deg, rgba(59,130,246,0.85), rgba(29,78,216,0.85)); color: #fff;
}

/* Streak bar items */
.pl-streak-item {
    display: flex; align-items: center; gap: 8px; margin-bottom: 6px;
}
.pl-streak-bar-bg {
    flex: 1; height: 14px; background: rgba(255,255,255,0.06);
    border-radius: 7px; overflow: hidden;
}
.pl-streak-bar {
    height: 100%; border-radius: 7px; transition: width 0.3s;
}
.pl-streak-bar.hot { background: linear-gradient(90deg, #ef4444, #f97316); }
.pl-streak-bar.cold { background: linear-gradient(90deg, #3b82f6, #06b6d4); }
.pl-streak-bar-label { font-size: 0.72rem; font-weight: 700; min-width: 30px; text-align: right; }

/* Zone cards */
.pl-zone-grid { display: flex; flex-wrap: wrap; gap: 10px; }
.pl-zone-card {
    flex: 1 1 100px; min-width: 90px; padding: 10px;
    border-radius: 12px; border: 1px solid; text-align: center;
}
.pl-zone-label { font-weight: 700; font-size: 0.78rem; }
.pl-zone-pct { font-weight: 900; font-size: 1.2rem; margin: 4px 0; }
.pl-zone-avg { font-size: 0.68rem; opacity: 0.72; }

/* Remize bars */
.pl-remize-row {
    display: flex; align-items: center; gap: 8px; margin-bottom: 6px;
}
.pl-remize-match { font-weight: 700; font-size: 0.78rem; min-width: 80px; }
.pl-remize-bar-bg {
    flex: 1; height: 18px; background: rgba(255,255,255,0.06);
    border-radius: 9px; overflow: hidden;
}
.pl-remize-bar {
    height: 100%; border-radius: 9px; display: flex; align-items: center;
    justify-content: flex-end; padding-right: 6px; font-size: 0.62rem;
    font-weight: 700; color: #fff; transition: width 0.3s;
}
.pl-remize-pct { font-size: 0.72rem; font-weight: 700; min-width: 40px; text-align: right; }

/* END PHASE 16P */

/* =========================================================
   PHASE 17 — Mathematical Odds Module
   ========================================================= */
.pl-odds-module {
    margin: 12px 0;
    padding: 14px;
    border-radius: 16px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.08);
}
.pl-odds-title {
    font-size: 0.85rem;
    font-weight: 800;
    margin-bottom: 10px;
    color: rgba(255,255,255,0.88);
}
.pl-odds-body {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.pl-odds-line {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 10px;
    border-radius: 10px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.05);
}
.pl-odds-label {
    font-size: 0.82rem;
    color: rgba(255,255,255,0.72);
}
.pl-odds-val {
    font-size: 0.88rem;
    font-weight: 800;
    color: #e2e8f0;
    white-space: nowrap;
    margin-left: 10px;
}
.pl-odds-hard .pl-odds-val {
    color: rgba(239,68,68,0.85);
}
.pl-odds-med .pl-odds-val {
    color: rgba(245,158,11,0.90);
}
.pl-odds-exp {
    border-top: 1px solid rgba(255,255,255,0.06);
    margin-top: 4px;
    padding-top: 8px;
    background: transparent;
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
}
.pl-odds-exp .pl-odds-val {
    color: var(--pl-gold);
}
.pl-odds-disclaimer {
    font-size: 0.74rem;
    opacity: 0.60;
    margin-top: 8px;
    font-style: italic;
    text-align: center;
    line-height: 1.4;
}
.pl-odds-loading {
    font-size: 0.82rem;
    opacity: 0.55;
    text-align: center;
    padding: 8px 0;
}

@media (max-width: 640px) {
    .pl-odds-module { padding: 12px 10px; }
    .pl-odds-label { font-size: 0.76rem; }
    .pl-odds-val { font-size: 0.82rem; }
    .pl-odds-line { padding: 5px 8px; }
}

/* =========================================================
   PHASE 17 — Education Info Box (Accordion)
   ========================================================= */
.pl-info-box {
    margin-top: 10px;
    border-left: 3px solid rgba(245,158,11,0.35);
    border-radius: 0 12px 12px 0;
    background: rgba(255,255,255,0.02);
    overflow: hidden;
}
.pl-info-toggle {
    display: block;
    width: 100%;
    padding: 10px 14px;
    font-size: 0.82rem;
    font-weight: 700;
    color: rgba(255,255,255,0.72);
    background: transparent;
    border: none;
    cursor: pointer;
    text-align: left;
    transition: color 0.15s;
}
.pl-info-toggle:hover {
    color: rgba(255,255,255,0.92);
    text-decoration: underline;
}
.pl-info-toggle[aria-expanded="true"] {
    color: var(--pl-gold);
}
.pl-info-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease;
    padding: 0 14px;
}
.pl-info-content[aria-hidden="false"] {
    padding: 0 14px 12px;
}
.pl-info-content p {
    font-size: 0.82rem;
    line-height: 1.55;
    color: rgba(255,255,255,0.72);
    margin: 0 0 8px;
}
.pl-info-content p:last-child {
    margin-bottom: 0;
}
.pl-info-content strong {
    color: #e2e8f0;
}
.pl-info-content em {
    color: var(--pl-gold);
    font-style: normal;
    font-weight: 700;
}

@media (max-width: 640px) {
    .pl-info-toggle { font-size: 0.78rem; padding: 8px 12px; }
    .pl-info-content p { font-size: 0.78rem; }
}

/* END PHASE 17 */

/* =========================================================
   PHASE 18 — Scanner module
   ========================================================= */
.pl-scan-card {
    padding: 14px;
}
.pl-scan-input-wrap {
    margin-bottom: 12px;
}
.pl-scan-label {
    font-size: 0.82rem;
    font-weight: 700;
    color: rgba(255,255,255,0.82);
    margin-bottom: 6px;
    display: block;
}
.pl-scan-input {
    width: 100%;
    padding: 12px 14px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,0.12);
    background: rgba(255,255,255,0.05);
    color: #e2e8f0;
    font-size: 0.92rem;
    font-family: inherit;
    outline: none;
    transition: border-color 0.15s;
    box-sizing: border-box;
}
.pl-scan-input:focus {
    border-color: var(--pl-gold);
    box-shadow: 0 0 0 3px rgba(245,158,11,0.12);
}
.pl-scan-input::placeholder {
    color: rgba(255,255,255,0.35);
}
.pl-scan-helper {
    font-size: 0.72rem;
    opacity: 0.55;
    margin-top: 4px;
}
.pl-scan-range-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}
.pl-scan-range-label {
    font-size: 0.78rem;
    font-weight: 700;
    color: rgba(255,255,255,0.72);
    flex-shrink: 0;
}
.pl-scan-chips {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}
.pl-scan-chip {
    padding: 8px 14px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,0.10);
    background: rgba(255,255,255,0.04);
    color: rgba(255,255,255,0.72);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.15s;
}
.pl-scan-chip.active {
    background: linear-gradient(180deg, rgba(245,158,11,0.20), rgba(255,255,255,0.04));
    border-color: rgba(245,158,11,0.60);
    color: #f8fafc;
}
.pl-scan-chip:hover:not(.active) {
    border-color: rgba(255,255,255,0.18);
    background: rgba(255,255,255,0.06);
}
.pl-scan-btn {
    width: 100%;
    min-height: 48px;
    font-size: 0.92rem;
    font-weight: 800;
}

/* Results */
.pl-scan-results {
    margin-top: 14px;
}
.pl-scan-error {
    padding: 12px;
    border-radius: 12px;
    background: rgba(239,68,68,0.08);
    border: 1px solid rgba(239,68,68,0.20);
    color: rgba(239,68,68,0.90);
    font-size: 0.82rem;
    text-align: center;
}
.pl-scan-user-nums {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}
.pl-scan-nums-label {
    font-size: 0.78rem;
    font-weight: 700;
    color: rgba(255,255,255,0.65);
}
.pl-scan-num-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(180deg, rgba(52,120,246,0.85), rgba(30,72,170,0.85));
    color: #eaf2ff;
    font-weight: 800;
    font-size: 0.72rem;
}
.pl-scan-summary {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}
.pl-scan-stat-main {
    flex: 1 1 140px;
    padding: 12px;
    border-radius: 14px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    text-align: center;
}
.pl-scan-stat-label {
    display: block;
    font-size: 0.74rem;
    opacity: 0.68;
    margin-bottom: 4px;
}
.pl-scan-stat-main strong {
    font-size: 1.1rem;
    color: #e2e8f0;
}
.pl-scan-exact strong {
    color: var(--pl-gold);
}

/* Distribution bars */
.pl-scan-distrib {
    margin-bottom: 14px;
    padding: 12px;
    border-radius: 14px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.06);
}
.pl-scan-distrib-title {
    font-size: 0.82rem;
    font-weight: 800;
    margin-bottom: 10px;
    color: rgba(255,255,255,0.82);
}
.pl-scan-bar-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 5px;
}
.pl-scan-bar-label {
    font-size: 0.74rem;
    font-weight: 700;
    min-width: 36px;
    text-align: right;
    color: rgba(255,255,255,0.68);
}
.pl-scan-bar-bg {
    flex: 1;
    height: 16px;
    background: rgba(255,255,255,0.05);
    border-radius: 8px;
    overflow: hidden;
}
.pl-scan-bar {
    height: 100%;
    border-radius: 8px;
    background: linear-gradient(90deg, rgba(52,120,246,0.60), rgba(52,120,246,0.85));
    transition: width 0.3s;
}
.pl-scan-bar-exact {
    background: linear-gradient(90deg, rgba(245,158,11,0.70), rgba(245,158,11,0.95)) !important;
}
.pl-scan-bar-close {
    background: linear-gradient(90deg, rgba(52,120,246,0.70), rgba(59,130,246,0.90)) !important;
}
.pl-scan-bar-count {
    font-size: 0.74rem;
    font-weight: 700;
    min-width: 70px;
    text-align: left;
    color: rgba(255,255,255,0.78);
}
.pl-scan-bar-count small {
    opacity: 0.60;
    font-weight: 600;
}

/* Best matches */
.pl-scan-best {
    margin-bottom: 10px;
}
.pl-scan-best-title {
    font-size: 0.82rem;
    font-weight: 800;
    margin-bottom: 8px;
    color: rgba(255,255,255,0.82);
}
.pl-scan-best-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 10px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.06);
    margin-bottom: 4px;
}
.pl-scan-best-score {
    font-weight: 900;
    font-size: 0.88rem;
    color: var(--pl-gold);
    min-width: 44px;
}
.pl-scan-best-date {
    font-size: 0.78rem;
    color: rgba(255,255,255,0.72);
}
.pl-scan-best-draw {
    font-size: 0.72rem;
    opacity: 0.55;
    margin-left: auto;
}
.pl-scan-best-more {
    font-size: 0.74rem;
    opacity: 0.55;
    text-align: center;
    margin-top: 6px;
}
.pl-scan-disclaimer {
    font-size: 0.74rem;
    opacity: 0.55;
    font-style: italic;
    text-align: center;
    margin: 10px 0;
}

@media (max-width: 640px) {
    .pl-scan-input { font-size: 0.88rem; padding: 10px 12px; }
    .pl-scan-num-pill { width: 28px; height: 28px; font-size: 0.66rem; }
    .pl-scan-bar-label { font-size: 0.68rem; min-width: 30px; }
    .pl-scan-bar-count { font-size: 0.68rem; min-width: 60px; }
}

/* END PHASE 18 */

/* =========================================================
   PHASE 21 — Per-number reasoning tags
   ========================================================= */
.pl-reasons {
    margin: 10px 0;
    padding: 10px 12px;
    border-radius: 14px;
    background: rgba(255,255,255,0.02);
    border: 1px solid rgba(255,255,255,0.06);
}
.pl-reasons-title {
    font-size: 0.78rem;
    font-weight: 800;
    color: rgba(255,255,255,0.72);
    margin-bottom: 8px;
}
.pl-reason-list {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}
.pl-reason-tag {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border-radius: 999px;
    padding: 4px 10px;
    font-size: 0.72rem;
    border: 1px solid rgba(255,255,255,0.08);
    background: rgba(255,255,255,0.03);
}
.pl-reason-num {
    font-weight: 900;
    min-width: 18px;
    text-align: center;
    color: #e2e8f0;
}
.pl-reason-text {
    color: rgba(255,255,255,0.62);
    white-space: nowrap;
}
.pl-reason-hot { border-color: rgba(245,158,11,0.25); background: rgba(245,158,11,0.06); }
.pl-reason-hot .pl-reason-text { color: rgba(245,158,11,0.85); }
.pl-reason-cold { border-color: rgba(59,130,246,0.25); background: rgba(59,130,246,0.06); }
.pl-reason-cold .pl-reason-text { color: rgba(59,130,246,0.85); }
.pl-reason-ffg { border-color: rgba(16,185,129,0.25); background: rgba(16,185,129,0.06); }
.pl-reason-ffg .pl-reason-text { color: rgba(16,185,129,0.85); }
.pl-reason-rand { border-color: rgba(255,255,255,0.10); }
.pl-reason-rand .pl-reason-text { opacity: 0.55; }
.pl-reason-bal { border-color: rgba(139,92,246,0.20); background: rgba(139,92,246,0.04); }
.pl-reason-bal .pl-reason-text { color: rgba(139,92,246,0.80); }

@media (max-width: 640px) {
    .pl-reason-tag { font-size: 0.66rem; padding: 3px 8px; }
    .pl-reason-num { min-width: 16px; }
}

/* END PHASE 21 */

/* Phase 22e — Footer nav pills */
.pl-footer-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
    padding: 16px 0 8px;
    margin-bottom: 4px;
}
.pl-footer-pill {
    padding: 7px 14px;
    border-radius: 10px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.06);
    font-size: 0.78rem;
    font-weight: 700;
    color: rgba(255,255,255,0.60);
    text-decoration: none;
    transition: color 0.2s, border-color 0.2s;
}
.pl-footer-pill:hover {
    color: var(--pl-accent, #f59e0b);
    border-color: rgba(245,158,11,0.25);
    text-decoration: none;
}

/* Phase 23 — Article page styles (shared) */
.pl-hdr-sub {
    font-size: .78rem;
    color: var(--pl-muted);
    margin: 0 0 12px;
}
.pl-article-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 14px;
}
@media (min-width: 860px) {
    .pl-article-grid { grid-template-columns: 1.1fr .9fr; }
}
.pl-article-card {
    background: var(--pl-card);
    border: 1px solid var(--pl-border);
    border-radius: var(--pl-radius);
    padding: 14px;
}
.pl-article-card h2 {
    font-size: .95rem;
    font-weight: 800;
    margin: 0 0 8px;
    border-bottom: none;
    padding-bottom: 0;
    color: var(--pl-text);
}
.pl-article-card h2:not(:first-child) { margin-top: 16px; }
.pl-article-card p {
    font-size: .82rem;
    color: var(--pl-muted);
    margin: 0 0 10px;
}
.pl-article-card ul {
    margin: 0 0 10px;
    padding-left: 18px;
    font-size: .82rem;
    color: var(--pl-muted);
}
.pl-article-card strong { color: var(--pl-text); }
.pl-note {
    border-left: 4px solid var(--pl-gold);
    background: rgba(245,158,11,0.05);
    padding: 10px 12px;
    border-radius: 0 8px 8px 0;
    color: var(--pl-muted);
    font-size: .82rem;
    margin: 10px 0;
}
.pl-note strong { color: var(--pl-text); }
.pl-cta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}
.pl-cta-btn {
    display: inline-flex;
    align-items: center;
    padding: 8px 14px;
    border-radius: var(--pl-radius);
    border: 1px solid var(--pl-border);
    text-decoration: none;
    font-size: .78rem;
    font-weight: 700;
    color: var(--pl-text);
    background: rgba(255,255,255,0.03);
    transition: border-color 0.2s, color 0.2s;
}
.pl-cta-btn:hover {
    border-color: rgba(0,212,255,0.30);
    color: var(--pl-cyan);
    text-decoration: none;
}
.pl-cta-primary {
    background: linear-gradient(180deg, rgba(0,212,255,0.12), rgba(255,255,255,0.02));
    border-color: rgba(0,212,255,0.25);
}
.pl-article-footer {
    margin-top: 12px;
    font-size: .76rem;
    color: var(--pl-dim);
}

/* Phase 26.1 — Transparency micro-copy */
.pl-transparency {
    font-size: .78rem;
    color: var(--pl-dim);
    margin: 0 0 2px;
    padding: 0;
    letter-spacing: .01em;
}
.pl-stat-disclaimer {
    font-size: .72rem;
    color: var(--pl-dim);
    margin: 6px 0 2px;
    padding: 0;
    font-style: italic;
}


/* =========================
   FIX: Ultima extragere — bile perfect centrate + rotunde
   ========================= */

/* 1) Containerul de bile din "Ultima extragere" */
.last-draw .balls,
.last-draw .numbers,
.last-draw .balls-wrap,
.section-last-draw .balls,
.section-last-draw .numbers,
#lastDraw .balls,
#lastDraw .numbers {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

/* 2) Bilele din "Ultima extragere" */
.last-draw .ball,
.last-draw .pl-ball,
.last-draw .lotto-ball,
.section-last-draw .ball,
.section-last-draw .pl-ball,
.section-last-draw .lotto-ball,
#lastDraw .ball,
#lastDraw .pl-ball,
#lastDraw .lotto-ball {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  aspect-ratio: 1 / 1 !important;
  border-radius: 999px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 0 !important;
  box-sizing: border-box !important;

  line-height: 1 !important;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  text-align: center;
  vertical-align: middle;

  flex: 0 0 auto !important;
}

/* 3) Text fine-tune inside ball */
.last-draw .ball span,
.last-draw .pl-ball span,
.last-draw .lotto-ball span,
.section-last-draw .ball span,
.section-last-draw .pl-ball span,
.section-last-draw .lotto-ball span,
#lastDraw .ball span,
#lastDraw .pl-ball span,
#lastDraw .lotto-ball span {
  display: inline-block;
  transform: translateY(0.5px);
}


/* =========================
   Phase 27: Bilet UX Cleanup
   ========================= */

/* Hits badge (compact, under numbers) */
.bet-hits-badge {
    font-size: .72rem;
    color: rgba(16,185,129,0.9);
    padding: 6px 10px;
    margin: 8px 0;
    background: rgba(16,185,129,0.06);
    border: 1px solid rgba(16,185,129,0.15);
    border-radius: 10px;
}
.bet-hits-badge strong {
    color: #10b981;
}

/* Collapsible sections */
.bet-collapse-section {
    margin-top: 16px;
    border-top: 1px solid rgba(255,255,255,0.05);
    padding-top: 4px;
}
.bet-collapse-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    background: none;
    border: none;
    color: rgba(255,255,255,0.6);
    font-size: .74rem;
    font-weight: 600;
    padding: 8px 0;
    cursor: pointer;
    transition: color .2s;
}
.bet-collapse-toggle:hover {
    color: var(--pl-text);
}
.bet-collapse-icon {
    font-size: .68rem;
    transition: transform .2s;
    color: rgba(255,255,255,0.35);
}
.bet-collapse-section.open .bet-collapse-icon {
    transform: rotate(90deg);
}
.bet-collapse-body {
    display: none;
    padding: 6px 0 4px;
}
.bet-collapse-section.open .bet-collapse-body {
    display: block;
}

/* Global reason summary */
.bet-reasons-global {
    margin-bottom: 8px;
}
.bet-reason-global-item {
    font-size: .7rem;
    color: rgba(255,255,255,0.6);
    padding: 2px 0;
    line-height: 1.55;
}
.bet-reason-global-item strong {
    color: var(--pl-text);
    font-weight: 700;
}
.bet-rg-label {
    color: rgba(255,255,255,0.4);
    min-width: 62px;
    display: inline-block;
}

/* Detail toggle */
.bet-detail-toggle {
    background: none;
    border: none;
    color: var(--pl-cyan);
    font-size: .66rem;
    font-weight: 600;
    cursor: pointer;
    padding: 4px 0;
    margin-bottom: 6px;
}
.bet-detail-toggle:hover {
    text-decoration: underline;
}

/* Hidden helper */
.bet-hidden {
    display: none !important;
}

/* Spacing between ticket modules */
.bet-ticket-title {
    font-size: .82rem !important;
    font-weight: 800 !important;
    text-transform: none !important;
    letter-spacing: -.2px;
}
.bet-ticket-rows {
    margin: 10px 0 !important;
}
.bet-ticket-actions {
    margin-top: 12px !important;
    padding-top: 10px !important;
}
.bet-ticket-note {
    margin-top: 10px !important;
    font-size: .62rem !important;
}

/* Per-number reason tags — shorter labels */
.pl-reason-text {
    font-size: .64rem !important;
}

/* Subtitle contrast boost */
.bet-sys-sub,
.bet-method-note,
.pl-hdr-sub {
    color: rgba(255,255,255,0.55) !important;
}

/* Systems section: summary line */
.bet-sys-sum {
    font-size: .72rem;
    color: rgba(255,255,255,0.7);
    margin-top: 8px;
    padding: 6px 10px;
    background: rgba(52,120,246,0.04);
    border: 1px solid rgba(52,120,246,0.1);
    border-radius: 8px;
}
.bet-sys-sum strong {
    color: var(--pl-text);
}

@media (max-width: 600px) {
    .bet-collapse-toggle { font-size: .7rem; }
    .bet-reason-global-item { font-size: .66rem; }
    .bet-hits-badge { font-size: .68rem; }
}


/* =========================
   Phase 28: Generator Upgrade
   ========================= */

/* P0: Mode buttons — SINGLE ROW, horizontal scroll */
.bet-mode-bar {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 6px !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 4px;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.bet-mode-bar::-webkit-scrollbar { display: none; }
.bet-mode-btn {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    min-width: auto !important;
    padding: 6px 12px !important;
    font-size: .7rem !important;
}

/* Quick Presets row */
.bet-presets-row {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding: 0 0 10px;
    margin-bottom: 6px;
    scrollbar-width: none;
    border-bottom: 1px solid rgba(255,255,255,0.04);
}
.bet-presets-row::-webkit-scrollbar { display: none; }
.bet-preset {
    flex: 0 0 auto;
    padding: 7px 14px;
    border-radius: 20px;
    border: 1px solid var(--pl-border);
    background: rgba(255,255,255,0.03);
    color: var(--pl-dim);
    font-size: .68rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: all .15s;
}
.bet-preset:hover {
    border-color: rgba(255,255,255,0.15);
    color: var(--pl-text);
}
.bet-preset.active {
    background: rgba(52,120,246,0.1);
    border-color: rgba(52,120,246,0.3);
    color: var(--pl-accent);
}

/* Systems module — visible, not collapsed */
.bet-sys-module {
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid rgba(255,255,255,0.05);
}
.bet-sys-header {
    font-size: .78rem;
    font-weight: 700;
    color: var(--pl-text);
    margin-bottom: 2px;
}
.bet-sys-module .bet-sys-sub {
    font-size: .64rem !important;
    color: rgba(255,255,255,0.5) !important;
    margin-bottom: 8px !important;
}
.bet-sys-chips {
    display: flex;
    flex-wrap: nowrap;
    gap: 5px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 4px;
    scrollbar-width: none;
}
.bet-sys-chips::-webkit-scrollbar { display: none; }
.bet-sys-chip {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 1px !important;
    padding: 6px 10px !important;
    border-radius: 10px !important;
    cursor: pointer;
    min-width: 48px;
}
.sys-odds-mini {
    font-size: .48rem;
    color: rgba(255,255,255,0.35);
    font-family: 'JetBrains Mono', monospace;
}

/* Odds display */
.bet-sys-odds {
    margin-top: 10px;
    padding: 10px 12px;
    border-radius: 10px;
    background: rgba(255,255,255,0.02);
    border: 1px solid rgba(255,255,255,0.06);
}
.sys-odds-detail {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.sys-odds-line {
    font-size: .72rem;
    color: rgba(255,255,255,0.7);
    font-family: 'JetBrains Mono', monospace;
}
.sys-odds-line strong {
    font-weight: 800;
}
.sys-odds-line.odds-easy strong { color: #e2e8f0; }
.sys-odds-line.odds-mid strong { color: #fbbf24; }
.sys-odds-line.odds-hard strong { color: #ef4444; }
.sys-odds-ex {
    font-size: .64rem;
    color: rgba(255,255,255,0.4);
    margin-top: 2px;
}
.sys-odds-ex strong {
    color: rgba(255,255,255,0.65);
}

/* Sanity stats row */
.bet-sanity-row {
    display: flex;
    gap: 8px;
    margin-top: 12px;
    flex-wrap: wrap;
}
.sanity-chip {
    flex: 1;
    min-width: 80px;
    padding: 8px 10px;
    border-radius: 10px;
    background: rgba(255,255,255,0.025);
    border: 1px solid rgba(255,255,255,0.06);
    text-align: center;
}
.sanity-label {
    display: block;
    font-size: .58rem;
    color: rgba(255,255,255,0.4);
    margin-bottom: 2px;
    text-transform: uppercase;
    letter-spacing: .3px;
}
.sanity-chip strong {
    font-size: .82rem;
    font-weight: 800;
    color: var(--pl-text);
    font-family: 'JetBrains Mono', monospace;
}

@media (max-width: 600px) {
    .bet-preset { padding: 6px 11px; font-size: .64rem; }
    .bet-sys-chip { padding: 5px 8px !important; min-width: 42px; }
    .sys-odds-line { font-size: .68rem; }
    .sanity-chip { min-width: 70px; padding: 6px 8px; }
    .sanity-chip strong { font-size: .76rem; }
}


/* =========================
   Phase 29: Odds Strip + Presets Fix + Mode Force
   ========================= */

/* Compact odds strip */
.odds-strip {
    margin: 8px 0 12px;
    padding: 0;
}
.odds-strip-pills {
    display: flex;
    align-items: center;
    gap: 6px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 2px 0;
}
.odds-strip-pills::-webkit-scrollbar { display: none; }
.odds-strip-label {
    flex: 0 0 auto;
    font-size: .66rem;
    font-weight: 700;
    color: rgba(255,255,255,0.45);
    white-space: nowrap;
    padding-right: 4px;
}
.odds-pill {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 16px;
    font-size: .66rem;
    font-weight: 600;
    font-family: 'JetBrains Mono', monospace;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    color: #e2e8f0;
    white-space: nowrap;
}
.odds-pill.odds-mid { color: #fbbf24; border-color: rgba(251,191,36,0.15); }
.odds-pill.odds-hard { color: #ef4444; border-color: rgba(239,68,68,0.15); }
.odds-strip-detail {
    display: flex;
    gap: 12px;
    margin-top: 4px;
    flex-wrap: wrap;
}
.odds-detail-item {
    font-size: .6rem;
    color: rgba(255,255,255,0.4);
    font-family: 'JetBrains Mono', monospace;
}
.odds-detail-item.odds-mid { color: rgba(251,191,36,0.7); }
.odds-detail-item.odds-hard { color: rgba(239,68,68,0.7); }

/* Kill old odds module styles that might bleed through */
.pl-odds-module { display: none !important; }
.pl-info-box#plOddsInfo { display: none !important; }
.pl-info-box#plOddsWhy { display: none !important; }

/* Presets — dark chips matching dark UI */
.bet-presets-row {
    display: flex !important;
    gap: 6px !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    padding: 0 0 10px !important;
    margin-bottom: 6px !important;
    scrollbar-width: none !important;
    border-bottom: 1px solid rgba(255,255,255,0.04) !important;
}
.bet-presets-row::-webkit-scrollbar { display: none; }
.bet-preset {
    flex: 0 0 auto !important;
    padding: 7px 14px !important;
    border-radius: 20px !important;
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid rgba(255,255,255,0.10) !important;
    color: rgba(255,255,255,0.65) !important;
    font-size: .68rem !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    transition: all .15s !important;
}
.bet-preset:hover {
    border-color: rgba(255,255,255,0.18) !important;
    color: #e2e8f0 !important;
    background: rgba(255,255,255,0.08) !important;
}
.bet-preset.active {
    background: rgba(251,191,36,0.08) !important;
    border-color: rgba(251,191,36,0.3) !important;
    color: #fbbf24 !important;
    box-shadow: 0 0 8px rgba(251,191,36,0.1) !important;
}

/* MODE BUTTONS — FORCE ONE ROW (highest specificity) */
section[data-panel="bilet"] .bet-mode-bar,
.pl-card .bet-mode-bar,
.bet-mode-bar {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 6px !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    padding-bottom: 4px !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
}
section[data-panel="bilet"] .bet-mode-bar::-webkit-scrollbar,
.bet-mode-bar::-webkit-scrollbar { display: none !important; }
section[data-panel="bilet"] .bet-mode-btn,
.pl-card .bet-mode-btn,
.bet-mode-btn {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    padding: 6px 12px !important;
    font-size: .68rem !important;
    min-width: auto !important;
    width: auto !important;
}

/* Education section below generator */
.bet-edu-section {
    margin-top: 20px;
    border-top: 1px solid rgba(255,255,255,0.05);
    padding-top: 0;
}

@media (max-width: 600px) {
    .odds-pill { padding: 3px 8px; font-size: .62rem; }
    .odds-strip-label { font-size: .6rem; }
    .odds-detail-item { font-size: .56rem; }
    .bet-preset { padding: 6px 11px !important; font-size: .64rem !important; }
}


/* ================================================
   Phase 30: CONTRAST + READABILITY OVERRIDE
   CSS-only. No layout changes. Last block wins.
   ================================================ */

:root {
    /* Backgrounds — brighter base */
    --pl-bg: #0f1a2b;
    --pl-card: rgba(255,255,255,0.045);
    --pl-surface: #15233a;
    --pl-surface-2: #1a2a45;
    --pl-border: rgba(255,255,255,0.14);

    /* Text — more contrast */
    --pl-text: rgba(255,255,255,0.92);
    --pl-text-strong: #f1f5f9;
    --pl-muted: rgba(255,255,255,0.72);
    --pl-dim: rgba(255,255,255,0.58);

    /* Accent (keep blue) */
    --pl-accent: #4ea1ff;

    /* Gold */
    --pl-gold: #f6c35c;

    /* Card shadow — stronger separation */
    --pl-shadow: 0 10px 24px rgba(0,0,0,0.28);
}

/* Body + wrap */
body,
.pl-wrap {
    background: var(--pl-bg) !important;
    color: var(--pl-text) !important;
}

/* Cards / panels — gradient surface + visible border + shadow */
.pl-card,
.bet-ticket,
#plBetTicket,
.pl-panel,
.pl-box,
.odds-strip,
.bet-sys-module,
.bet-sanity-row .sanity-chip,
.bet-collapse-section {
    background: linear-gradient(180deg, var(--pl-surface), var(--pl-surface-2)) !important;
    border: 1px solid var(--pl-border) !important;
    box-shadow: var(--pl-shadow) !important;
    border-radius: 14px;
}

/* Inner sub-cards (don't double-shadow) */
.bet-sys-odds,
.bet-hits-badge,
.bet-reasons-global,
.odds-strip-detail {
    background: rgba(255,255,255,0.025) !important;
    border-color: rgba(255,255,255,0.08) !important;
    box-shadow: none !important;
}

/* Muted text */
.pl-muted,
.bet-method-note,
.bet-ticket-note,
.bet-sys-sub,
.odds-strip-label,
.odds-detail-item,
.mix-label,
.bet-genw-label,
.bet-counter,
.sys-odds-ex {
    color: var(--pl-muted) !important;
}

/* Dim text */
.pl-dim,
.pl-reason-text,
.bet-rg-label,
.sanity-label {
    color: var(--pl-dim) !important;
}

/* Headings */
h2, h3,
.bet-ticket-title,
.bet-sys-header,
.bet-collapse-toggle span:first-child {
    color: var(--pl-text) !important;
}

/* Buttons — more visible borders */
.bet-btn,
.bet-mode-btn,
.bet-preset,
.bet-k-btn,
.bet-genw-btn,
.bet-k-inc {
    background: rgba(255,255,255,0.06) !important;
    border: 1px solid rgba(255,255,255,0.18) !important;
    color: var(--pl-text) !important;
}

/* Primary CTA (Generate) */
#plBetGen {
    background: var(--pl-accent) !important;
    border-color: var(--pl-accent) !important;
    color: #fff !important;
    font-weight: 700 !important;
    box-shadow: 0 6px 18px rgba(78,161,255,0.25) !important;
}
#plBetGen:hover {
    box-shadow: 0 8px 24px rgba(78,161,255,0.35) !important;
}

/* Active states — gold glow */
.bet-mode-btn.active,
.bet-k-btn.active,
.bet-genw-btn.active,
.bet-preset.active {
    border-color: rgba(246,195,92,0.55) !important;
    box-shadow: 0 0 0 2px rgba(246,195,92,0.16) inset !important;
    color: #fff !important;
    background: rgba(246,195,92,0.08) !important;
}

/* Sys chips active — keep blue accent */
.bet-sys-chip.active {
    background: var(--pl-accent) !important;
    border-color: var(--pl-accent) !important;
    color: #fff !important;
}

/* Tabs */
.pl-tab {
    color: rgba(255,255,255,0.78) !important;
}
.pl-tab.active {
    color: #fff !important;
}

/* Number grid cells — brighter unselected */
.pl-gcell {
    background: rgba(255,255,255,0.06) !important;
    border: 1px solid rgba(255,255,255,0.14) !important;
    color: rgba(255,255,255,0.70) !important;
}
/* Selected — full contrast */
.pl-gcell.bet-on {
    color: #fff !important;
    border-color: rgba(255,255,255,0.22) !important;
}
/* Hit highlight */
.pl-gcell.bet-hit {
    color: #fff !important;
}

/* Odds pills */
.odds-pill {
    background: rgba(255,255,255,0.06) !important;
    border: 1px solid rgba(255,255,255,0.16) !important;
    color: #e2e8f0 !important;
}

/* Ticket number pills */
.bet-sumar-nums .sn {
    border-color: rgba(255,255,255,0.16) !important;
    color: var(--pl-text) !important;
}
.bet-sumar-nums .sn.hit {
    color: #fff !important;
}

/* Ticket info rows */
.bet-ticket-row span {
    color: var(--pl-muted) !important;
}
.bet-ticket-row strong {
    color: var(--pl-text) !important;
}

/* Hits badge */
.bet-hits-badge {
    color: rgba(16,185,129,0.95) !important;
}
.bet-hits-badge strong {
    color: #10b981 !important;
}

/* Collapse toggles */
.bet-collapse-toggle {
    color: rgba(255,255,255,0.72) !important;
}
.bet-collapse-toggle:hover {
    color: var(--pl-text) !important;
}

/* Reason tags */
.pl-reason-tag {
    border-color: rgba(255,255,255,0.12) !important;
}
.pl-reason-num {
    color: var(--pl-text) !important;
}

/* Sanity chips — pop */
.sanity-chip {
    background: linear-gradient(180deg, var(--pl-surface), var(--pl-surface-2)) !important;
    border: 1px solid var(--pl-border) !important;
}
.sanity-chip strong {
    color: var(--pl-text) !important;
}

/* Education section */
.bet-edu-section {
    border-top-color: rgba(255,255,255,0.08) !important;
}

/* Scrollbar (for mode/preset rows) — subtle but visible */
.bet-mode-bar,
.bet-presets-row,
.bet-sys-chips,
.odds-strip-pills {
    scrollbar-width: none;
}

/* ===== MOBILE FONT MINIMUMS ===== */
@media (max-width: 420px) {
    body { font-size: 15px !important; }
    .bet-method-note,
    .bet-ticket-note,
    .bet-sys-sub,
    .odds-detail-item,
    .mix-label,
    .sanity-label,
    .sys-odds-ex {
        font-size: 13px !important;
    }
    .pl-card p,
    .bet-collapse-body p {
        line-height: 1.45 !important;
    }
    .bet-btn { font-size: 13px !important; min-height: 40px; }
    .odds-pill { font-size: 12px !important; }
}


/* Phase 31b: Systems emphasis */
.pl-systems h3,
.pl-systems-title,
.bet-sys-header {
    font-size: 1.05rem !important;
    font-weight: 600 !important;
    color: rgba(255,255,255,.95) !important;
}
.pl-systems p,
.pl-systems .subtext,
.bet-sys-module .bet-sys-sub {
    color: rgba(255,255,255,.82) !important;
    line-height: 1.5 !important;
}
.pl-systems .chip,
.bet-sys-chip {
    border-color: rgba(255,255,255,.22) !important;
}

/* =========================================================
   PERMANENT — UI Stability + Typography Hardening
   Applied: 2026-03-01
   Scope: Layout containment, mobile performance, typography
   ========================================================= */

/* A — Grid stability (safe default) */
.bet-grid-circ {
    grid-template-columns: repeat(auto-fill, minmax(32px, 1fr)) !important;
    gap: 6px;
    max-width: 100%;
}

@media (max-width: 420px) {
    .bet-grid-circ {
        grid-template-columns: repeat(8, 1fr) !important;
        gap: 4px !important;
    }
}
@media (max-width: 360px) {
    .bet-grid-circ {
        grid-template-columns: repeat(6, 1fr) !important;
        gap: 3px !important;
    }
}

/* B — Kill heavy paint on mobile */
@media (max-width: 768px) {
    .pl-panel,
    .pl-card,
    .pl-module,
    .pl-box {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        box-shadow: 0 2px 10px rgba(0,0,0,.18) !important;
    }
}

/* C — Permanent overflow guardrails */
html, body {
    max-width: 100%;
    overflow-x: hidden;
}

*, *::before, *::after {
    box-sizing: border-box;
}

.pl-wrap,
.pl-panel,
.pl-card,
.bet-ticket,
.bet-grid-wrap,
.bet-toolbar,
.bet-ticket-actions {
    max-width: 100%;
    overflow-x: hidden;
}

.pl-wrap {
    word-break: break-word;
}

.bet-toolbar,
.bet-ticket-actions,
.bet-mode-bar,
.bet-presets-row,
.bet-genw-row,
.bet-mixed-row,
.bet-k-row,
.bet-sanity-row {
    flex-wrap: wrap;
    max-width: 100%;
}

.bet-toolbar > *,
.bet-ticket-actions > *,
.bet-mode-bar > * {
    min-width: 0;
}

/* Scrollable segments that should not overflow parent */
.bet-k-seg,
.bet-sumar-nums {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.bet-k-seg::-webkit-scrollbar,
.bet-sumar-nums::-webkit-scrollbar { display: none; }

/* D — Typography / spacing */
.pl-panel,
.pl-card {
    padding-left: 16px;
    padding-right: 16px;
}

@media (min-width: 768px) {
    .pl-panel,
    .pl-card {
        padding-left: 20px;
        padding-right: 20px;
    }
}

.pl-panel h1,
.pl-panel h2,
.pl-panel h3,
.pl-card h1,
.pl-card h2,
.pl-card h3 {
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
    line-height: 1.15;
    margin-left: 0;
    margin-right: 0;
}

@media (max-width: 420px) {
    .pl-panel h1, .pl-card h1 { font-size: 28px; }
    .pl-panel h2, .pl-card h2 { font-size: 22px; }
    .pl-panel h3, .pl-card h3 { font-size: 18px; }
}

@media (max-width: 768px) {
    .section-title,
    .block-title,
    .panel-title {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: auto !important;
    }
}

/* END PERMANENT STABILITY BLOCK */


/* =========================================================
   P1 UNIFIED — Fullscreen Button Style + Pulse
   Applied: 2026-03-01 (consolidated)
   Both #plBetFullscreen and #plTicketFullscreenBtn
   ========================================================= */

/* Pulse keyframes */
@keyframes softPulse {
    0%   { box-shadow: 0 0 0 0 rgba(255,122,24,0.42); }
    70%  { box-shadow: 0 0 0 11px rgba(255,122,24,0); }
    100% { box-shadow: 0 0 0 0 rgba(255,122,24,0); }
}

/* Unified button style (overrides bet-btn base) */
.fullscreen-btn {
    background: linear-gradient(135deg, #ff7a18, #ffb347) !important;
    color: #0b1220 !important;
    font-weight: 700 !important;
    border: 1px solid rgba(255, 180, 71, 0.55) !important;
    border-radius: 14px !important;
    box-shadow: 0 0 0 rgba(255,122,24, 0.6);
    transition: transform 0.2s ease, box-shadow 0.3s ease, filter 0.2s ease;
    animation: softPulse 3.2s infinite;
}

.fullscreen-btn:hover {
    transform: translateY(-2px);
    filter: brightness(1.03);
    box-shadow: 0 10px 26px rgba(255,122,24,0.35) !important;
    animation: none;
}

/* Flame icon alignment */
.pl-flame {
    display: inline-block;
    margin-right: 8px;
    transform: translateY(1px);
}

/* Accessibility: respect reduced motion */
@media (prefers-reduced-motion: reduce) {
    .fullscreen-btn { animation: none !important; }
}

/* Mobile tap target */
@media (max-width: 600px) {
    .fullscreen-btn {
        min-height: 48px;
        font-size: 15px !important;
    }
}

/* END P1 UNIFIED */