/* extracted verbatim 2026-08-28 estate speed sweep. New content = new filename. */

        /* ============================================================
           AFL BETTING GUIDE — world-class content/sport-hub layout.
           Tokens (--void/--panel/--ink*/--line*/--accent-grad/--model/
           --book/--mono/--ui/--card-edge/--accent-glow) are LOCKED in
           Site.Master. We only alias + compose here, never redefine.
           Ambient-lift on .prop-card is applied globally by the master.
           ============================================================ */
        :root {
            --c-bg:        var(--void);
            --c-surface:   var(--panel);
            --c-surface2:  var(--panel-2);
            --c-border:    var(--line);
            --c-border2:   var(--line-strong);
            --c-accent:    var(--action);
            --c-accent-h:  var(--action-hi);
            --c-green:     var(--model);
            --c-red:       var(--book);
            --c-amber:     var(--gold);
            --c-text:      var(--ink);
            --c-muted:     var(--ink-dim);
            --c-dim:       var(--ink-faint);
            --font-body:   var(--mono);
            --font-ui:     var(--ui);
            --radius:      12px;
            --radius-lg:   16px;
        }

        /* --- BASE --- */
        .aflg *, .aflg *::before, .aflg *::after { box-sizing: border-box; }
        .aflg { color: var(--c-text); font-family: var(--font-ui); }

        .wrapper {
            width: 100%;
            max-width: 1100px;
            margin: 0 auto;
            padding: 1.5em 5% 4em;
        }

        /* --- TYPOGRAPHY ENFORCER --- */
        .aflg h1, .aflg h2, .aflg h3, .aflg h4, .aflg strong, .aflg b, .aflg dt { color: var(--ink); }
        .aflg p, .aflg li, .aflg dd { color: var(--c-text); }
        .aflg a { color: var(--c-accent-h); text-decoration: none; transition: color .15s; }
        .aflg a:hover { color: var(--ink); }
        .aflg em { color: var(--c-amber); font-style: normal; }
        .aflg .num, .aflg .mono { font-family: var(--font-body); font-variant-numeric: tabular-nums; }

        /* --- BREADCRUMB --- */
        .breadcrumb {
            display: flex; flex-wrap: wrap; gap: .4em; align-items: center;
            margin-bottom: 1.5em;
            font-family: var(--font-body); font-size: .78em; color: var(--c-dim);
        }
        .breadcrumb a { color: var(--c-muted); }
        .breadcrumb a:hover { color: var(--c-accent-h); }
        .breadcrumb .sep { color: var(--c-border2); }

        /* --- POPULARITY WIDGET --- */
        .popularity-wrapper {
            margin-bottom: 2em; padding: 1em 1.25em;
            background: var(--c-surface); border: 1px solid var(--c-border);
            border-radius: var(--radius-lg); contain: content; min-height: 140px;
        }
        .popularity-wrapper .widget-label {
            font-size: .7em; font-weight: 600; text-transform: uppercase;
            letter-spacing: .08em; color: var(--c-dim); margin-bottom: .75em;
            font-family: var(--font-body);
        }
        .popularity-wrapper a, .popularity-wrapper span, .popularity-wrapper div { color: var(--ink); }

        /* --- HERO --- */
        .hero { margin-bottom: 2.25em; }
        .eyebrow {
            display: inline-flex; align-items: center; gap: .5em;
            font-family: var(--font-body); font-size: .7rem; font-weight: 700;
            letter-spacing: .12em; text-transform: uppercase; color: var(--c-accent-h);
            background: rgba(70,140,255,.1); border: 1px solid var(--card-edge);
            padding: .4em .8em; border-radius: 2em; margin-bottom: 1em;
        }
        .eyebrow .dot {
            width: 6px; height: 6px; border-radius: 50%;
            background: var(--c-accent-h); box-shadow: 0 0 8px var(--c-accent-h);
            animation: pulse 2s ease-in-out infinite;
        }
        @keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: .4; } }

        .page-title {
            font-size: clamp(1.9rem, 5vw, 2.9rem); font-weight: 800;
            line-height: 1.1; letter-spacing: -.025em; margin-bottom: .4em;
        }
        .page-title .accent {
            background: var(--accent-grad);
            -webkit-background-clip: text; background-clip: text;
            -webkit-text-fill-color: transparent; color: var(--c-accent-h);
        }
        .hero-sub {
            font-size: clamp(1rem, 2vw, 1.15rem); line-height: 1.6;
            color: var(--c-muted); max-width: 60ch;
        }
        .page-meta {
            display: flex; flex-wrap: wrap; gap: .9em; align-items: center;
            margin-top: 1.25em; font-size: .76em; font-family: var(--font-body);
            color: var(--c-dim);
        }
        .page-meta .tag {
            background: rgba(70,140,255,.12); border: 1px solid var(--card-edge);
            color: var(--c-accent-h); padding: .3em .75em; border-radius: 2em;
        }
        .page-meta .dot {
            width: 6px; height: 6px; border-radius: 50%; background: var(--c-green);
            box-shadow: 0 0 8px var(--c-green); display: inline-block; margin-right: .4em;
        }

        /* --- ACTION HUB (the forward CTAs — what the user actually came for) --- */
        .action-hub {
            position: relative; overflow: hidden;
            background: var(--c-surface); border: 1px solid var(--card-edge);
            border-radius: var(--radius-lg); padding: 1.5em 1.5em 1.65em;
            box-shadow: 0 20px 42px -24px var(--accent-glow); margin-bottom: 1em;
        }
        .action-hub::after {
            content: ''; position: absolute; inset: 0 0 auto 0; height: 120px;
            background: radial-gradient(120% 100% at 50% 0, rgba(70,140,255,.16), transparent 70%);
            pointer-events: none;
        }
        .action-hub .hub-head {
            position: relative; display: flex; flex-wrap: wrap; align-items: baseline;
            justify-content: space-between; gap: .5em; margin-bottom: 1.1em;
        }
        .action-hub .hub-title { font-size: 1.05rem; font-weight: 700; color: var(--ink); }
        .action-hub .hub-note { font-size: .8em; color: var(--c-muted); }
        .action-grid {
            position: relative; display: grid; grid-template-columns: 1fr; gap: .7em;
        }
        @media (min-width: 560px) { .action-grid { grid-template-columns: 1fr 1fr; } }
        @media (min-width: 900px) { .action-grid { grid-template-columns: repeat(3, 1fr); } }

        .action-tile {
            display: flex; align-items: center; gap: .85em;
            background: var(--c-surface2); border: 1px solid var(--c-border);
            border-radius: var(--radius); padding: .95em 1.05em;
            min-height: 44px; transition: border-color .15s, transform .1s, background .15s;
        }
        .action-tile:hover { border-color: var(--c-accent); transform: translateY(-1px); background: rgba(70,140,255,.06); }
        .action-tile .ico {
            flex: 0 0 38px; height: 38px; border-radius: 10px;
            display: flex; align-items: center; justify-content: center;
            background: rgba(70,140,255,.12); border: 1px solid var(--card-edge);
            color: var(--c-accent-h); font-size: 1rem;
        }
        .action-tile.is-money .ico { background: var(--model-dim); border-color: rgba(52,211,153,.3); color: var(--c-green); }
        .action-tile .copy { display: flex; flex-direction: column; line-height: 1.25; }
        .action-tile .copy b { font-size: .95em; color: var(--ink); }
        .action-tile .copy small { font-size: .78em; color: var(--c-muted); }
        .action-tile .arr { margin-left: auto; color: var(--c-dim); transition: transform .15s, color .15s; }
        .action-tile:hover .arr { color: var(--c-accent-h); transform: translateX(3px); }

        /* primary forward CTA + proof row */
        .hub-foot {
            position: relative; display: flex; flex-wrap: wrap; align-items: center;
            gap: .9em; margin-top: 1.25em;
        }
        .hub-foot .btn-grad { flex: 1 1 auto; min-height: 48px; }
        .bb-proof { white-space: nowrap; }

        /* --- ANSWER CAPSULE (AEO featured-snippet source) --- */
        .answer-capsule {
            background: rgba(70,140,255,.06); border: 1px solid var(--card-edge);
            border-left: 4px solid var(--c-accent); border-radius: 0 var(--radius) var(--radius) 0;
            padding: 1.5em 1.75em; margin-bottom: 2.5em;
        }
        .answer-capsule .capsule-label {
            font-family: var(--font-body); font-size: .7em; font-weight: 700;
            text-transform: uppercase; letter-spacing: .1em; color: var(--c-accent-h);
            margin-bottom: 1.25em;
        }
        .answer-capsule dl { display: grid; grid-template-columns: 1fr; gap: 1.25em; }
        .answer-capsule dt { font-weight: 700; font-size: .9em; color: var(--ink); margin-bottom: .3em; }
        .answer-capsule dd { font-size: .93em; line-height: 1.7; color: var(--c-text); }
        @media (min-width: 640px) { .answer-capsule dl { grid-template-columns: 1fr 1fr; } }
        @media (min-width: 960px) { .answer-capsule dl { grid-template-columns: 1fr 1fr 1fr; } }

        /* --- TOC --- */
        .toc-card {
            background: var(--c-surface); border: 1px solid var(--c-border);
            border-radius: var(--radius-lg); padding: 1.25em 1.5em; margin-bottom: 2.5em;
        }
        .toc-card .toc-title {
            font-family: var(--font-body); font-size: .72em; font-weight: 700;
            text-transform: uppercase; letter-spacing: .1em; color: var(--c-dim); margin-bottom: 1em;
        }
        .toc-card ol { list-style: none; counter-reset: toc; display: grid; grid-template-columns: 1fr; gap: .4em; margin: 0; padding: 0; }
        @media (min-width: 640px) { .toc-card ol { grid-template-columns: 1fr 1fr; } }
        .toc-card li { counter-increment: toc; display: flex; align-items: center; gap: .65em; font-size: .88em; }
        .toc-card li::before {
            content: counter(toc, decimal-leading-zero);
            font-family: var(--font-body); font-size: .75em; color: var(--c-dim); min-width: 1.8em;
        }
        .toc-card a { color: var(--c-muted); }
        .toc-card a:hover { color: var(--c-accent-h); }

        /* --- SECTION INTRO --- */
        .section-intro { margin: 3em 0 1.5em; }
        .section-intro .kicker {
            font-family: var(--font-body); font-size: .72rem; font-weight: 700;
            letter-spacing: .14em; text-transform: uppercase; color: var(--c-accent-h);
            margin-bottom: .5em;
        }
        .section-intro h2 { font-size: clamp(1.4rem, 3vw, 1.85rem); line-height: 1.2; }
        .section-intro p { color: var(--c-muted); margin-top: .5em; max-width: 65ch; line-height: 1.6; font-size: .95em; }

        /* --- GUIDE CARDS (ambient-lift) --- */
        .guide-card {
            position: relative; overflow: hidden;
            background: var(--c-surface); border: 1px solid var(--card-edge);
            border-radius: var(--radius-lg); padding: 1.75em 2em; margin-bottom: 1.5em;
            box-shadow: 0 20px 42px -24px var(--accent-glow); scroll-margin-top: 90px;
        }
        .guide-card::after {
            content: ''; position: absolute; inset: 0 0 auto 0; height: 100px;
            background: radial-gradient(120% 100% at 50% 0, rgba(70,140,255,.12), transparent 70%);
            pointer-events: none;
        }
        .guide-card > * { position: relative; }
        .section-header {
            display: flex; align-items: center; gap: .75em;
            margin-bottom: 1.25em; padding-bottom: 1em; border-bottom: 1px solid var(--c-border);
        }
        .section-badge {
            font-family: var(--font-body); font-size: .65em; font-weight: 700;
            text-transform: uppercase; letter-spacing: .1em;
            padding: .35em .8em; border-radius: 2em; border: 1px solid;
        }
        .badge-blue  { color: var(--c-accent-h); border-color: var(--card-edge); background: rgba(70,140,255,.1); }
        .badge-green { color: var(--c-accent-h); border-color: var(--card-edge); background: rgba(70,140,255,.1); }
        .badge-amber { color: var(--c-amber); border-color: rgba(245,179,1,.4); background: rgba(245,179,1,.1); }
        .badge-red   { color: var(--c-red); border-color: rgba(248,113,113,.4); background: rgba(248,113,113,.1); }

        .guide-card h2 { font-size: 1.3rem; }
        .guide-card h3 { font-size: 1.15rem; }
        .guide-card p  { line-height: 1.75; margin-bottom: 1em; font-size: .95em; }
        .guide-card p:last-child { margin-bottom: 0; }
        .guide-card ul { list-style: none; padding: 0; margin: 1em 0; }
        .guide-card ul li { padding: .4em 0 .4em 1.5em; position: relative; font-size: .93em; line-height: 1.6; color: var(--c-text); }
        .guide-card ul li::before { content: '▸'; position: absolute; left: 0; color: var(--c-accent-h); }

        /* --- TERMINAL EXAMPLE BLOCKS --- */
        .terminal {
            background: var(--void); border-left: 3px solid var(--c-accent-h);
            border-radius: 0 var(--radius) var(--radius) 0; padding: 1.1em 1.25em; margin: 1.25em 0;
            font-family: var(--font-body); font-size: .875em; line-height: 1.9;
            color: var(--ink); overflow-x: auto;
        }
        .terminal .prompt { color: var(--c-dim); user-select: none; }
        .terminal .val  { color: var(--c-green); font-weight: 700; }
        .terminal .neg  { color: var(--c-red);   font-weight: 700; }
        .terminal .note { color: var(--c-dim);   font-style: italic; }
        .terminal .label { color: var(--c-amber); }

        /* --- STRATEGY CALLOUT --- */
        .strategy-callout {
            background: rgba(245,179,1,.06); border: 1px solid rgba(245,179,1,.25);
            border-left: 4px solid var(--c-amber); border-radius: 0 var(--radius) var(--radius) 0;
            padding: 1em 1.25em; margin: 1.25em 0; font-size: .9em; line-height: 1.7;
        }
        .strategy-callout .callout-label {
            font-family: var(--font-body); font-size: .65em; font-weight: 700;
            text-transform: uppercase; letter-spacing: .1em; color: var(--c-amber);
            display: block; margin-bottom: .4em;
        }
        .strategy-callout p { color: var(--c-text); margin: 0; }

        /* --- DATA TABLE --- */
        .data-table { width: 100%; border-collapse: collapse; font-size: .875em; margin: 1.25em 0; }
        .data-table th {
            background: var(--c-surface2); padding: .65em 1em; text-align: left;
            font-family: var(--font-body); font-size: .75em; text-transform: uppercase;
            letter-spacing: .06em; color: var(--c-dim); border-bottom: 1px solid var(--c-border2);
        }
        .data-table td { padding: .65em 1em; border-bottom: 1px solid var(--line); vertical-align: top; color: var(--c-text); }
        .data-table tr:last-child td { border-bottom: none; }
        .data-table tr:hover td { background: rgba(70,140,255,.04); }
        .data-table .mono { font-family: var(--font-body); font-size: .9em; }

        /* --- GRID LAYOUTS --- */
        .grid-2 { display: grid; grid-template-columns: 1fr; gap: 1.5em; margin-bottom: 1.5em; }
        .props-grid { display: grid; grid-template-columns: 1fr; gap: .9em; margin-top: 1.25em; }
        @media (min-width: 700px) {
            .grid-2 { grid-template-columns: 1fr 1fr; }
            .props-grid { grid-template-columns: repeat(3, 1fr); }
        }

        /* .prop-card receives ambient-lift from the master CSS (global rule). */
        .prop-card { background: var(--c-surface2); padding: 1em 1.1em; border-radius: var(--radius); transition: border-color .15s, transform .1s; }
        .prop-card strong { display: block; margin-bottom: .3em; font-size: .95em; }
        .prop-card span { color: var(--c-muted); font-size: .82em; line-height: 1.5; display: block; }

        /* --- STATS ROW --- */
        .stats-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1em; margin: 1.5em 0; }
        @media (min-width: 640px) { .stats-row { grid-template-columns: repeat(4, 1fr); } }
        .stat-cell { background: var(--c-surface2); border: 1px solid var(--c-border); border-radius: var(--radius); padding: 1em; text-align: center; }
        .stat-cell .num { font-family: var(--font-body); font-size: 1.4em; font-weight: 700; color: var(--c-accent-h); line-height: 1.2; }
        .stat-cell .lbl { font-size: .75em; color: var(--c-dim); margin-top: .25em; }

        /* --- FAQ --- */
        .faq-section { max-width: 820px; margin: 3.5em auto 0; }
        .faq-section h2 { font-size: clamp(1.4rem, 3vw, 1.7rem); margin-bottom: 1.5em; text-align: center; }
        .faq-item {
            background: var(--panel-2); border: 1px solid var(--c-border);
            border-radius: var(--radius); margin-bottom: .6em; overflow: hidden; transition: border-color .15s;
        }
        .faq-item:hover { border-color: var(--c-border2); }
        .faq-item[open] { border-color: var(--card-edge); }
        .faq-item summary {
            padding: 1em 1.25em; cursor: pointer; font-weight: 600; font-size: .95em; color: var(--ink);
            display: flex; justify-content: space-between; align-items: center; list-style: none; gap: 1em; min-height: 44px;
        }
        .faq-item summary::-webkit-details-marker { display: none; }
        .faq-item summary::after { content: '+'; font-family: var(--font-body); font-size: 1.1em; color: var(--c-accent-h); flex-shrink: 0; }
        .faq-item[open] summary::after { content: '\2212'; }
        .faq-answer { padding: 0 1.25em 1.1em; font-size: .9em; line-height: 1.75; color: var(--c-text); border-top: 1px solid var(--c-border); }
        .faq-answer p { margin-top: .9em; margin-bottom: 0; }

        /* --- CLOSING CTA (no dead end) --- */
        .closing-cta {
            position: relative; overflow: hidden; text-align: center;
            background: var(--c-surface); border: 1px solid var(--card-edge);
            border-radius: var(--radius-lg); padding: 2.5em 1.5em; margin: 3.5em auto 0; max-width: 820px;
            box-shadow: 0 20px 42px -24px var(--accent-glow);
        }
        .closing-cta::after {
            content: ''; position: absolute; inset: 0 0 auto 0; height: 140px;
            background: radial-gradient(120% 100% at 50% 0, rgba(70,140,255,.18), transparent 70%); pointer-events: none;
        }
        .closing-cta > * { position: relative; }
        .closing-cta h2 { font-size: clamp(1.4rem, 3vw, 1.8rem); margin-bottom: .5em; }
        .closing-cta p { color: var(--c-muted); max-width: 52ch; margin: 0 auto 1.5em; line-height: 1.6; }
        .closing-cta .cta-row { display: flex; flex-wrap: wrap; gap: .8em; justify-content: center; }
        .closing-cta .btn-grad, .closing-cta .btn-ghost { min-height: 48px; }
        .btn-ghost {
            display: inline-flex; align-items: center; justify-content: center; gap: 8px;
            background: transparent; border: 1px solid var(--c-accent); color: var(--c-accent-h);
            border-radius: var(--radius); padding: 13px 20px; font-family: var(--font-ui);
            font-weight: 600; font-size: .95rem; transition: .18s;
        }
        .btn-ghost:hover { background: rgba(70,140,255,.08); color: var(--ink); }

        /* responsible-gambling compliance line */
        .rg-line { font-size: .72em; color: var(--c-dim); font-family: var(--font-body); margin-top: 1.5em; line-height: 1.6; }