:root {
            --primary: #6d28d9;
            --primary-dark: #4c1d95;
            --primary-soft: #ede9fe;
            --secondary: #047857;
            --secondary-soft: #d1fae5;
            --info: #0369a1;
            --info-soft: #e0f2fe;
            --warning: #b45309;
            --warning-soft: #fff7ed;
            --danger: #b91c1c;
            --danger-soft: #fef2f2;
            --neutral: #475569;
            --neutral-soft: #f1f5f9;
            --background: #f5f6fa;
            --surface: #ffffff;
            --surface-soft: #fafafa;
            --text: #1f2937;
            --muted: #6b7280;
            --border: #e5e7eb;
            --shadow-sm: 0 8px 22px rgba(17,24,39,.06);
            --shadow-md: 0 18px 44px rgba(17,24,39,.09);
            --radius-md: 18px;
        }

        * { box-sizing: border-box; }

        html { scroll-behavior: smooth; }

        body {
            margin: 0;
            min-height: 100vh;
            font-family:
                Inter,
                ui-sans-serif,
                system-ui,
                -apple-system,
                BlinkMacSystemFont,
                "Segoe UI",
                sans-serif;
            color: var(--text);
            background:
                radial-gradient(circle at top left, rgba(109,40,217,.08), transparent 26rem),
                var(--background);
        }

        a {
            color: inherit;
            text-decoration: none;
        }

        button,
        input,
        select {
            font: inherit;
        }

        .site-header {
            position: sticky;
            top: 0;
            z-index: 50;
            border-bottom: 1px solid rgba(229,231,235,.9);
            background: rgba(255,255,255,.9);
            backdrop-filter: blur(16px);
        }

        .header-inner {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 20px;
            width: min(1220px, calc(100% - 32px));
            min-height: 72px;
            margin: 0 auto;
        }

        .brand {
            display: flex;
            align-items: center;
            gap: 12px;
        }

        .brand-mark {
            display: grid;
            place-items: center;
            width: 44px;
            height: 44px;
            border-radius: 14px;
            color: #fff;
            background:
                linear-gradient(
                    135deg,
                    var(--primary),
                    var(--primary-dark)
                );
            font-weight: 950;
        }

        .brand-text {
            display: grid;
            line-height: 1.05;
        }

        .brand-text strong { font-size: .98rem; }

        .brand-text span {
            margin-top: 4px;
            color: var(--muted);
            font-size: .72rem;
            font-weight: 700;
        }

        .header-actions {
            display: flex;
            align-items: center;
            gap: 9px;
        }

        .button {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 42px;
            padding: 0 14px;
            border: 1px solid var(--border);
            border-radius: 10px;
            color: var(--text);
            background: #fff;
            cursor: pointer;
            font-size: .82rem;
            font-weight: 850;
        }

        .button-primary {
            border-color: var(--primary);
            color: #fff;
            background:
                linear-gradient(
                    135deg,
                    var(--primary),
                    var(--primary-dark)
                );
        }

        .button-secondary {
            border-color: #ddd6fe;
            color: var(--primary-dark);
            background: var(--primary-soft);
        }

        .hero {
            width: min(1220px, calc(100% - 32px));
            margin: 0 auto;
            padding: 44px 0 28px;
        }

        .hero h1 {
            margin: 0;
            font-size: clamp(2rem, 5vw, 3.25rem);
            letter-spacing: -.055em;
        }

        .hero p {
            max-width: 780px;
            margin: 12px 0 0;
            color: var(--muted);
            font-size: 1rem;
            line-height: 1.7;
        }

        .main {
            width: min(1220px, calc(100% - 32px));
            margin: 0 auto;
            padding-bottom: 50px;
        }

        .message {
            margin-bottom: 20px;
            padding: 14px 16px;
            border: 1px solid #fecaca;
            border-radius: 13px;
            color: var(--danger);
            background: var(--danger-soft);
            font-size: .88rem;
            font-weight: 750;
            line-height: 1.5;
        }

        .filter-panel {
            margin-bottom: 22px;
            padding: 20px;
            border: 1px solid var(--border);
            border-radius: var(--radius-md);
            background: var(--surface);
            box-shadow: var(--shadow-sm);
        }

        .contest-range-field {
            flex: 0 0 auto;
            width: auto;
            min-width: 0;
        }

        .contest-range-controls {
            display: flex;
            align-items: center;
            flex-wrap: nowrap;
            gap: 8px;
            width: auto;
        }

        .contest-range-controls select {
            flex: 0 0 112px;
            width: 112px;
            min-width: 112px;
            max-width: 112px;
        }

        @media (max-width: 820px) {
            .contest-range-field {
                width: 100%;
                min-width: 0;
            }

            .contest-range-controls {
                flex-wrap: wrap;
            }
        }

        .contest-range-separator {
            color: var(--muted);
            font-size: .78rem;
            font-weight: 850;
        }

        .contest-range-count {
            color: var(--text);
            font-size: .72rem;
            font-weight: 850;
            white-space: nowrap;
        }
.filter-grid {
            display: grid;
            grid-template-columns:
                minmax(220px, .9fr)
                minmax(220px, .9fr)
                auto;
            gap: 14px;
            align-items: end;
        }

        .field {
            display: grid;
            gap: 7px;
        }

        .field label {
            font-size: .77rem;
            font-weight: 850;
        }

        .field select {
            width: 100%;
            height: 44px;
            padding: 0 12px;
            border: 1px solid var(--border);
            border-radius: 10px;
            color: var(--text);
            background: #fff;
        }

        .summary-grid {
            display: grid;
            grid-template-columns: repeat(6, minmax(0, 1fr));
            gap: 14px;
            margin-bottom: 22px;
        }

        .summary-card {
            min-height: 126px;
            padding: 18px;
            border: 1px solid var(--border);
            border-radius: 16px;
            background: var(--surface);
            box-shadow: var(--shadow-sm);
        }

        .summary-card span,
        .summary-card strong {
            display: block;
        }

        .summary-card span {
            margin-bottom: 10px;
            color: var(--muted);
            font-size: .7rem;
            font-weight: 850;
            text-transform: uppercase;
            letter-spacing: .055em;
        }

        .summary-card strong {
            font-size: 1.5rem;
            font-weight: 950;
            letter-spacing: -.04em;
        }

        .summary-card small {
            display: block;
            margin-top: 8px;
            color: var(--muted);
            font-size: .68rem;
        }

        .panel {
            overflow: hidden;
            border: 1px solid var(--border);
            border-radius: var(--radius-md);
            background: var(--surface);
            box-shadow: var(--shadow-sm);
        }

        .panel + .panel {
            margin-top: 20px;
        }

        .panel-header {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 18px;
            padding: 19px 20px;
            border-bottom: 1px solid var(--border);
        }

        .panel-header h2,
        .panel-header h3 {
            margin: 0 0 5px;
        }

        .panel-header h2 { font-size: 1.12rem; }
        .panel-header h3 { font-size: 1rem; }

        .panel-header p {
            margin: 0;
            color: var(--muted);
            font-size: .76rem;
            line-height: 1.5;
        }

        .panel-body { padding: 20px; }

        .dashboard-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 20px;
            margin-bottom: 20px;
        }

        .ranking-list {
            display: grid;
            gap: 9px;
        }

        .ranking-item {
            display: grid;
            grid-template-columns: 48px minmax(0, 1fr) auto;
            gap: 12px;
            align-items: center;
            padding: 11px 12px;
            border: 1px solid var(--border);
            border-radius: 11px;
            background: var(--surface-soft);
        }

        .ball {
            display: grid;
            place-items: center;
            width: 38px;
            height: 38px;
            border-radius: 50%;
            color: var(--primary-dark);
            background: var(--primary-soft);
            font-size: .78rem;
            font-weight: 950;
        }

        .ball.cold {
            color: var(--info);
            background: var(--info-soft);
        }

        .ball.delayed {
            color: var(--warning);
            background: var(--warning-soft);
        }

        .ranking-info {
            min-width: 0;
        }

        .ranking-info strong,
        .ranking-info span {
            display: block;
        }

        .ranking-info strong {
            font-size: .8rem;
        }

        .ranking-info span {
            margin-top: 3px;
            color: var(--muted);
            font-size: .69rem;
        }

        .ranking-value {
            font-size: .78rem;
            font-weight: 900;
            white-space: nowrap;
        }

        .ranking-metric {
            display: grid;
            justify-items: end;
            gap: 5px;
        }

        .ranking-percent {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: 52px;
            padding: 4px 7px;
            border-radius: 999px;
            color: var(--primary-dark);
            background: var(--primary-soft);
            font-size: .64rem;
            font-weight: 950;
        }

        .delay-progress {
            width: min(230px, 100%);
            height: 6px;
            margin-top: 8px;
            overflow: hidden;
            border-radius: 999px;
            background: #e5e7eb;
        }

        .delay-progress > span {
            display: block;
            height: 100%;
            border-radius: inherit;
            background: var(--warning);
        }

        .period-panel {
            display: grid;
            grid-template-columns: auto minmax(0, 1fr);
            gap: 14px;
            align-items: center;
            margin-bottom: 20px;
            padding: 14px 17px;
            border: 1px solid var(--border);
            border-radius: 14px;
            background: var(--surface);
            box-shadow: var(--shadow-sm);
        }

        .period-icon {
            display: grid;
            place-items: center;
            width: 40px;
            height: 40px;
            border-radius: 11px;
            color: var(--primary-dark);
            background: var(--primary-soft);
            font-size: 1rem;
            font-weight: 950;
        }

        .period-info strong,
        .period-info span {
            display: block;
        }

        .period-info strong {
            font-size: .78rem;
        }

        .period-info span {
            margin-top: 4px;
            color: var(--muted);
            font-size: .7rem;
            line-height: 1.45;
        }

        .header-metric {
            flex: 0 0 auto;
            padding: 7px 10px;
            border-radius: 999px;
            color: var(--primary-dark);
            background: var(--primary-soft);
            font-size: .67rem;
            font-weight: 900;
            white-space: nowrap;
        }

        .pattern-count {
            margin-top: 5px;
            color: var(--primary-dark) !important;
            font-size: .65rem !important;
            font-weight: 850;
        }

        .chart-wrap {
            min-height: 290px;
        }

        canvas {
            display: block;
            width: 100%;
            height: 250px;
        }

        .frequency-grid {
            display: grid;
            grid-template-columns: repeat(10, minmax(0, 1fr));
            gap: 9px;
        }

        .frequency-item {
            position: relative;
            overflow: hidden;
            min-height: 80px;
            padding: 10px;
            border: 1px solid var(--border);
            border-radius: 12px;
            background: var(--surface-soft);
            text-align: center;
        }

        .frequency-item strong,
        .frequency-item span,
        .frequency-item small {
            position: relative;
            z-index: 1;
            display: block;
        }

        .frequency-item strong {
            font-size: .82rem;
        }

        .frequency-item span {
            margin-top: 5px;
            font-size: .9rem;
            font-weight: 950;
        }

        .frequency-item small {
            margin-top: 3px;
            color: var(--muted);
            font-size: .64rem;
        }

        .frequency-bar {
            position: absolute;
            right: 0;
            bottom: 0;
            left: 0;
            background: rgba(109,40,217,.09);
        }

        .data-grid {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 12px;
        }

        .data-card {
            padding: 14px;
            border: 1px solid var(--border);
            border-radius: 12px;
            background: var(--surface-soft);
        }

        .data-card span,
        .data-card strong {
            display: block;
        }

        .data-card span {
            margin-bottom: 6px;
            color: var(--muted);
            font-size: .67rem;
            font-weight: 850;
            text-transform: uppercase;
        }

        .data-card strong {
            font-size: .92rem;
        }

        .distribution-list {
            display: grid;
            gap: 9px;
        }

        .distribution-item {
            display: grid;
            grid-template-columns: minmax(100px, 140px) minmax(0, 1fr) 58px;
            gap: 12px;
            align-items: center;
        }

        .distribution-label {
            font-size: .74rem;
            font-weight: 850;
        }

        .distribution-track {
            height: 10px;
            overflow: hidden;
            border-radius: 999px;
            background: var(--neutral-soft);
        }

        .distribution-fill {
            height: 100%;
            border-radius: inherit;
            background: var(--primary);
        }

        .distribution-value {
            color: var(--muted);
            font-size: .7rem;
            font-weight: 850;
            text-align: right;
        }

        .latest-result {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
        }

        .latest-ball {
            display: inline-grid;
            place-items: center;
            width: 36px;
            height: 36px;
            border-radius: 50%;
            color: #fff;
            background: var(--primary);
            font-size: .75rem;
            font-weight: 950;
        }

        .pattern-box {
            padding: 14px;
            border: 1px solid var(--border);
            border-radius: 12px;
            background: var(--surface-soft);
        }

        .pattern-box strong,
        .pattern-box span {
            display: block;
        }

        .pattern-box strong {
            margin-bottom: 5px;
            font-size: .84rem;
        }

        .pattern-box span {
            color: var(--muted);
            font-size: .72rem;
            line-height: 1.45;
        }

        .specific-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 14px;
        }

        .contest-history-panel {
            margin-top: 20px;
        }

        .contest-history-note {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            gap: 8px 14px;
            color: var(--muted);
            font-size: .7rem;
            line-height: 1.5;
        }

        .contest-history-legend {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            font-weight: 750;
        }

        .contest-history-legend-dot {
            width: 10px;
            height: 10px;
            border-radius: 999px;
            background: var(--primary);
        }

        .contest-history-scroll {
            width: 100%;
            overflow: visible;
        }

        @media (max-width: 900px) {
            .contest-history-scroll {
                overflow-x: auto;
            }
        }

        .contest-history-table {
            width: 100%;
            table-layout: auto;
            border-collapse: separate;
            border-spacing: 2px 0;
        }

        .contest-history-table th,
        .contest-history-table td {
            padding: 8px 7px;
            border-bottom: 1px solid var(--border);
            vertical-align: middle;
        }

        .contest-history-table th {
            position: sticky;
            top: 0;
            z-index: 4;
            color: var(--muted);
            background: #f8fafc;
            font-size: .65rem;
            font-weight: 900;
            text-align: left;
            text-transform: uppercase;
            letter-spacing: .055em;
        }

        .contest-history-table th.metric-heading {
            text-align: center;
        }

        .duplasena-cell-stack {
            display: grid;
            gap: 7px;
        }

        .duplasena-cell-row {
            min-height: 30px;
            display: flex;
            align-items: center;
            gap: 8px;
        }

        .duplasena-cell-label {
            flex: 0 0 58px;
            color: var(--muted);
            font-size: .57rem;
            font-weight: 900;
            white-space: nowrap;
        }

        .duplasena-metric-stack {
            display: grid;
            gap: 7px;
            text-align: center;
        }

        .duplasena-metric-row {
            min-height: 30px;
            display: flex;
            align-items: center;
            justify-content: center;
            white-space: nowrap;
        }

        .contest-history-table th:first-child,
        .contest-history-table td:first-child {
            position: sticky;
            left: 0;
        }

        .contest-history-table th:first-child {
            z-index: 5;
        }

        .contest-history-table td:first-child {
            z-index: 2;
            background: #fff;
        }

        .contest-history-table tbody tr:last-child td {
            border-bottom: 0;
        }

        .contest-history-table tbody tr.series-start td {
            border-top: 2px solid var(--primary);
        }

        /*
         * Linhas alternadas apenas nos concursos.
         * As linhas-resumo permanecem com o visual original.
         */
        .contest-history-table tbody
        tr.contest-history-row.contest-row-tinted {
            background: #f8f5ff;
        }

        .contest-history-table tbody
        tr.contest-history-row.contest-row-white {
            background: #ffffff;
        }

        .contest-history-table tbody
        tr.contest-history-row.contest-row-tinted td {
            background: #f8f5ff;
        }

        .contest-history-table tbody
        tr.contest-history-row.contest-row-white td {
            background: #ffffff;
        }

        .contest-history-table tbody
        tr.contest-history-row.contest-row-tinted td:first-child {
            background: #f8f5ff;
        }

        .contest-history-table tbody
        tr.contest-history-row.contest-row-white td:first-child {
            background: #ffffff;
        }

        .contest-id {
            display: grid;
            gap: 2px;
            min-width: 72px;
        }

        .contest-id strong {
            color: var(--primary-dark);
            font-size: .78rem;
        }

        .contest-id small {
            color: var(--muted);
            font-size: .56rem;
        }

        .lotofacil-number-heading,
        .lotofacil-number-cell {
            width: 31px;
            min-width: 31px;
            max-width: 31px;
            padding: 3px !important;
            text-align: center !important;
            white-space: nowrap;
            background: transparent !important;
        }

        .lotofacil-number-heading {
            color: var(--primary-dark) !important;
            font-size: .56rem !important;
            font-weight: 900;
            letter-spacing: 0 !important;
        }

        .lotofacil-number-cell span {
            display: inline-grid;
            place-items: center;
            width: 27px;
            height: 27px;
            border: 1px solid #e5e7eb;
            border-radius: 5px;
            color: #64748b;
            background: #f8fafc;
            font-size: .58rem;
            font-weight: 850;
            line-height: 1;
        }

        .contest-history-table tbody
        tr.contest-history-row.contest-row-tinted
        td.lotofacil-number-cell {
            background: #f8f5ff !important;
        }

        .contest-history-table tbody
        tr.contest-history-row.contest-row-white
        td.lotofacil-number-cell {
            background: #ffffff !important;
        }

        .lotofacil-number-cell.is-drawn span {
            border-color: #6d28d9;
            color: #fff;
            background:
                linear-gradient(
                    135deg,
                    var(--primary),
                    var(--primary-dark)
                );
            box-shadow: 0 1px 3px rgba(91, 33, 182, .14);
        }

        .result-draw-numbers {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            gap: 7px;
            min-width: 250px;
        }

        .result-draw-numbers .contest-draw-number {
            display: inline-grid;
            place-items: center;
            width: 34px;
            height: 34px;
            padding: 0;
            border: 1px solid #ddd6fe;
            border-radius: 8px;
            color: #fff;
            background:
                linear-gradient(
                    135deg,
                    var(--primary),
                    var(--primary-dark)
                );
            box-shadow: 0 2px 5px rgba(91, 33, 182, .14);
            font-size: .68rem;
            font-weight: 900;
            line-height: 1;
        }

        .contest-history-metric {
            white-space: nowrap;
            font-size: .7rem;
            font-weight: 900;
            text-align: center;
        }

        .contest-history-metric small {
            display: block;
            margin-top: 3px;
            color: var(--muted);
            font-size: .61rem;
            font-weight: 700;
        }

        .contest-history-empty {
            padding: 24px;
            color: var(--muted);
            text-align: center;
            font-size: .82rem;
        }

        .contest-summary-row th,
        .contest-summary-row td {
            border-top: 1px solid var(--border);
            background: #fbfbfd;
        }

        .contest-summary-label {
            position: sticky;
            left: 0;
            z-index: 3;
            min-width: 72px;
            color: var(--primary-dark);
            background: #f7f5ff !important;
            font-size: .64rem;
            font-weight: 900;
            text-align: left !important;
            white-space: nowrap;
        }

        .contest-summary-number {
            padding: 7px 2px !important;
            color: var(--text);
            background: #fbfbfd !important;
            font-size: .59rem;
            font-weight: 850;
            text-align: center;
        }

        .contest-summary-number.is-empty {
            color: #94a3b8;
        }

        .contest-temperature {
            color: #111827 !important;
            font-weight: 950 !important;
        }

        .contest-temperature.temp-hot {
            background: #fecaca !important;
        }

        .contest-temperature.temp-warm {
            background: #fed7aa !important;
        }

        .contest-temperature.temp-cold {
            background: #bae6fd !important;
        }

        .contest-summary-metric {
            color: var(--text);
            background: #fbfbfd !important;
            font-size: .66rem;
            font-weight: 900;
            text-align: center;
            white-space: nowrap;
        }

        .temperature-legend {
            display: flex;
            justify-content: center;
            flex-wrap: wrap;
            gap: 8px 18px;
            padding: 10px 14px 14px;
            border-top: 1px solid var(--border);
            color: var(--muted);
            font-size: .63rem;
            font-weight: 750;
        }

        .temperature-legend-item {
            display: inline-flex;
            align-items: center;
            gap: 5px;
        }

        .temperature-legend-badge {
            display: inline-grid;
            place-items: center;
            width: 20px;
            height: 20px;
            border-radius: 6px;
            color: #111827;
            font-size: .6rem;
            font-weight: 950;
        }

        .temperature-legend-badge.hot {
            background: #fecaca;
        }

        .temperature-legend-badge.warm {
            background: #fed7aa;
        }

        .temperature-legend-badge.cold {
            background: #bae6fd;
        }

        /*
         * Dá mais respiro entre a tabela detalhada e o primeiro bloco
         * em duas colunas (Dezenas quentes / Dezenas frias).
         */
        .contest-history-panel + .dashboard-grid {
            margin-top: 34px;
        }

        .dynamic-controls {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            gap: 12px;
            align-items: end;
            margin-bottom: 18px;
        }

        .dynamic-controls .field input {
            width: 100%;
            height: 44px;
            padding: 0 12px;
            border: 1px solid var(--border);
            border-radius: 10px;
            color: var(--text);
            background: #fff;
        }

        .dynamic-status {
            min-height: 20px;
            margin: 10px 0 0;
            color: var(--muted);
            font-size: .72rem;
            font-weight: 700;
        }

        .dynamic-status.error {
            color: var(--danger);
        }

        .dynamic-chart-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 20px;
        }

        .dynamic-chart-card {
            min-width: 0;
            padding: 15px;
            border: 1px solid var(--border);
            border-radius: 13px;
            background: var(--surface-soft);
        }

        .dynamic-chart-card h3 {
            margin: 0 0 4px;
            font-size: .9rem;
        }

        .dynamic-chart-card p {
            margin: 0 0 12px;
            color: var(--muted);
            font-size: .7rem;
            line-height: 1.45;
        }

        .dynamic-chart-card canvas {
            height: 280px;
            background: #fff;
            border-radius: 9px;
        }

        .site-footer {
            padding: 28px 16px 40px;
            color: var(--muted);
            text-align: center;
            font-size: .72rem;
        }

        @media (max-width: 1380px) {
            .summary-grid {
                grid-template-columns: repeat(3, minmax(0, 1fr));
            }
        }

        @media (max-width: 980px) {
            .dashboard-grid {
                grid-template-columns: 1fr;
            }

            .specific-grid {
                grid-template-columns: 1fr;
            }

            .frequency-grid {
                grid-template-columns: repeat(5, minmax(0, 1fr));
            }
        }

        @media (max-width: 760px) {
            .filter-grid,
            .dynamic-controls,
            .dynamic-chart-grid {
                grid-template-columns: 1fr;
            }

            .contest-history-table th,
            .contest-history-table td {
                padding: 9px 10px;
            }

            .summary-grid,
            .data-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        }

        @media (max-width: 620px) {
            .header-actions .button:first-child {
                display: none;
            }

            .summary-grid,
            .data-grid {
                grid-template-columns: 1fr;
            }

            .frequency-grid {
                grid-template-columns: repeat(5, minmax(0, 1fr));
            }

            .panel-header {
                align-items: stretch;
                flex-direction: column;
            }

            .distribution-item {
                grid-template-columns: 90px minmax(0, 1fr) 46px;
            }
        }

        .statistics-subnav {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            margin: 0 0 18px;
            padding: 8px;
            background: #fff;
            border: 1px solid var(--border);
            border-radius: 16px;
        }

        .statistics-subnav a {
            padding: 10px 14px;
            border-radius: 11px;
            color: var(--text);
            font-size: .82rem;
            font-weight: 800;
            text-decoration: none;
        }

        .statistics-subnav a:hover,
        .statistics-subnav a.is-active {
            background: var(--purple-soft);
            color: var(--purple-dark);
        }


/* =========================================================
   SMART LOTERIAS — ESTATÍSTICAS
   Refinamento visual alinhado ao novo design aprovado.
   Mantém a estrutura e todas as funcionalidades atuais.
   ========================================================= */

:root {
    --lottery-primary: #6d28d9;
    --lottery-primary-2: #8b5cf6;
    --lottery-dark: #4c1d95;
    --lottery-soft: #f5f3ff;
    --lottery-border: #ddd6fe;
    --lottery-shadow: rgba(109,40,217,.18);
}

body.lottery-lotofacil {
    --lottery-primary: #6d28d9;
    --lottery-primary-2: #8b5cf6;
    --lottery-dark: #4c1d95;
    --lottery-soft: #f5f3ff;
    --lottery-border: #ddd6fe;
    --lottery-shadow: rgba(109,40,217,.18);
}

body.lottery-megasena {
    --lottery-primary: #059669;
    --lottery-primary-2: #10b981;
    --lottery-dark: #047857;
    --lottery-soft: #ecfdf5;
    --lottery-border: #a7f3d0;
    --lottery-shadow: rgba(5,150,105,.17);
}

body.lottery-quina {
    --lottery-primary: #2563eb;
    --lottery-primary-2: #3b82f6;
    --lottery-dark: #1d4ed8;
    --lottery-soft: #eff6ff;
    --lottery-border: #bfdbfe;
    --lottery-shadow: rgba(37,99,235,.17);
}

body.lottery-lotomania {
    --lottery-primary: #ea580c;
    --lottery-primary-2: #f97316;
    --lottery-dark: #c2410c;
    --lottery-soft: #fff7ed;
    --lottery-border: #fed7aa;
    --lottery-shadow: rgba(234,88,12,.17);
}

body.lottery-timemania {
    --lottery-primary: #65a30d;
    --lottery-primary-2: #84cc16;
    --lottery-dark: #4d7c0f;
    --lottery-soft: #f7fee7;
    --lottery-border: #d9f99d;
    --lottery-shadow: rgba(101,163,13,.17);
}

body.lottery-duplasena {
    --lottery-primary: #dc2626;
    --lottery-primary-2: #ef4444;
    --lottery-dark: #b91c1c;
    --lottery-soft: #fef2f2;
    --lottery-border: #fecaca;
    --lottery-shadow: rgba(220,38,38,.16);
}

body {
    background:
        radial-gradient(
            circle at 8% 0,
            color-mix(in srgb, var(--lottery-primary) 7%, transparent),
            transparent 27rem
        ),
        #f6f7fb;
}

/* Cabeçalho da página no mesmo padrão visual do Gerador Inteligente. */
.hero {
    width: min(1220px, calc(100% - 32px));
    margin: 22px auto 20px;
    padding: 28px 30px;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(
            circle at 88% 12%,
            rgba(255,255,255,.16),
            transparent 20rem
        ),
        linear-gradient(
            135deg,
            var(--lottery-dark),
            var(--lottery-primary) 58%,
            var(--lottery-primary-2)
        );
    box-shadow: 0 18px 40px var(--lottery-shadow);
}

.hero h1 {
    color: #fff;
    font-size: clamp(2rem, 5vw, 3rem);
}

.hero p {
    max-width: 820px;
    color: rgba(255,255,255,.84);
    font-size: .94rem;
    line-height: 1.6;
}

/* Filtros e período */
.filter-panel,
.period-panel,
.summary-card,
.panel {
    border-color: #e3e7ee;
    box-shadow:
        0 8px 24px rgba(15,23,42,.045),
        0 1px 2px rgba(15,23,42,.025);
}

.filter-panel {
    border-radius: 16px;
    background: #fff;
}

.field select,
.dynamic-controls .field input {
    border-color: #dce2ea;
    background: #fff;
    transition:
        border-color .15s ease,
        box-shadow .15s ease;
}

.field select:hover,
.dynamic-controls .field input:hover {
    border-color: var(--lottery-border);
}

.field select:focus,
.dynamic-controls .field input:focus {
    outline: none;
    border-color: var(--lottery-primary);
    box-shadow:
        0 0 0 3px
        color-mix(in srgb, var(--lottery-primary) 12%, transparent);
}

.button-primary {
    border-color: var(--lottery-primary);
    background:
        linear-gradient(
            135deg,
            var(--lottery-primary-2),
            var(--lottery-dark)
        );
    box-shadow: 0 8px 18px var(--lottery-shadow);
}

.button-secondary {
    border-color: var(--lottery-border);
    color: var(--lottery-dark);
    background: var(--lottery-soft);
}

.period-icon,
.header-metric,
.ranking-percent,
.ball,
.counter {
    color: var(--lottery-dark);
    background: var(--lottery-soft);
}

/* Cards-resumo */
.summary-grid {
    gap: 12px;
}

.summary-card {
    min-height: 118px;
    border-radius: 14px;
    background:
        linear-gradient(
            180deg,
            #fff,
            #fcfcfd
        );
}

.summary-card strong {
    color: #172033;
}

/* Painéis */
.panel {
    border-radius: 16px;
    background: #fff;
}

.panel-header {
    padding: 17px 19px;
    background:
        linear-gradient(
            180deg,
            #fff,
            #fdfdfe
        );
}

.panel-header h2,
.panel-header h3 {
    color: #172033;
}

.panel-body {
    padding: 18px 19px;
}

/* Elementos de dezenas respeitam a modalidade ativa */
.latest-ball,
.distribution-fill,
.contest-history-legend-dot {
    background: var(--lottery-primary);
}

.lotofacil-number-cell.is-drawn span,
.result-draw-numbers .contest-draw-number {
    border-color: var(--lottery-primary);
    background:
        linear-gradient(
            135deg,
            var(--lottery-primary-2),
            var(--lottery-dark)
        );
    box-shadow: 0 2px 5px var(--lottery-shadow);
}

.contest-id strong,
.lotofacil-number-heading,
.contest-summary-label {
    color: var(--lottery-dark) !important;
}

.contest-history-table tbody tr.series-start td {
    border-top-color: var(--lottery-primary);
}

/* Mantém a melhoria aprovada de alternância das linhas de concursos. */
.contest-history-table tbody
tr.contest-history-row.contest-row-tinted,
.contest-history-table tbody
tr.contest-history-row.contest-row-tinted td,
.contest-history-table tbody
tr.contest-history-row.contest-row-tinted td:first-child,
.contest-history-table tbody
tr.contest-history-row.contest-row-tinted td.lotofacil-number-cell {
    background: #f8f5ff !important;
}

body:not(.lottery-lotofacil)
.contest-history-table tbody
tr.contest-history-row.contest-row-tinted,
body:not(.lottery-lotofacil)
.contest-history-table tbody
tr.contest-history-row.contest-row-tinted td,
body:not(.lottery-lotofacil)
.contest-history-table tbody
tr.contest-history-row.contest-row-tinted td:first-child {
    background:
        color-mix(
            in srgb,
            var(--lottery-soft) 66%,
            #ffffff
        ) !important;
}

.contest-history-table tbody
tr.contest-history-row.contest-row-white,
.contest-history-table tbody
tr.contest-history-row.contest-row-white td,
.contest-history-table tbody
tr.contest-history-row.contest-row-white td:first-child,
.contest-history-table tbody
tr.contest-history-row.contest-row-white td.lotofacil-number-cell {
    background: #fff !important;
}

.contest-history-table tbody tr.contest-history-row:hover td {
    box-shadow: inset 0 0 0 999px rgba(15,23,42,.018);
}

/* Gráficos e cards auxiliares */
.frequency-item,
.data-card,
.pattern-box,
.dynamic-chart-card,
.ranking-item {
    border-color: #e3e7ee;
    background: #fbfcfe;
}

.frequency-bar {
    background:
        color-mix(
            in srgb,
            var(--lottery-primary) 10%,
            transparent
        );
}

.dynamic-chart-card canvas {
    border: 1px solid #edf0f4;
}

.statistics-beta-badge {
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    margin-left: 5px;
    padding: 3px 7px;
    border: 1px solid #fcd34d;
    border-radius: 999px;
    color: #78350f;
    background: #fef3c7;
    font-size: .6rem;
    font-weight: 900;
    line-height: 1.2;
    letter-spacing: .02em;
    white-space: nowrap;
}

.ranking-beta-badge {
    margin-left: 8px;
    font-size: .68rem;
    letter-spacing: 0;
}

/* Responsividade */
@media (max-width: 760px) {
    .hero {
        width: min(100% - 20px, 1220px);
        margin-top: 12px;
        padding: 24px 20px;
        border-radius: 18px;
    }

    .main {
        width: min(100% - 20px, 1220px);
    }
}