.snf-af,
.snf-af * {
    box-sizing: border-box;
}

.snf-af {
    --snf-red: #b5121b;
    --snf-red-dark: #65070d;
    --snf-gold: #d6a84b;
    --snf-cream: #f7ebc7;
    --snf-ink: #110b0b;
    width: min(100%, 1040px);
    margin: 20px auto;
    font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
    -webkit-tap-highlight-color: transparent;
}

.snf-af button {
    font: inherit;
    touch-action: manipulation;
    -webkit-user-select: none;
    user-select: none;
}

.snf-af [hidden] {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

.snf-af__cabinet {
    position: relative;
    padding: clamp(14px, 2vw, 24px);
    border: 4px solid #4b070a;
    border-radius: 34px 34px 22px 22px;
    background:
        linear-gradient(135deg, rgba(255,255,255,.11), transparent 28%),
        linear-gradient(180deg, #d71d27 0%, var(--snf-red) 48%, #790b12 100%);
    box-shadow:
        0 28px 60px rgba(0,0,0,.38),
        inset 0 0 0 4px rgba(255,255,255,.07),
        inset 0 -20px 30px rgba(0,0,0,.18);
    overflow: hidden;
}

.snf-af__cabinet::before,
.snf-af__cabinet::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 16px;
    background: repeating-linear-gradient(180deg, rgba(255,255,255,.15) 0 7px, transparent 7px 18px);
    opacity: .22;
    pointer-events: none;
}

.snf-af__cabinet::before { left: 5px; }
.snf-af__cabinet::after { right: 5px; }

.snf-af__marquee {
    position: relative;
    z-index: 2;
    margin: 0 auto 14px;
    padding: 12px 18px 14px;
    max-width: 84%;
    text-align: center;
    color: #fff5d8;
    border: 3px solid #f1d485;
    border-radius: 18px 18px 10px 10px;
    background:
        radial-gradient(circle at 50% 15%, rgba(255,244,186,.28), transparent 55%),
        linear-gradient(180deg, #3c0407, #160204);
    box-shadow: 0 0 24px rgba(255,207,88,.25), inset 0 0 18px rgba(255,203,88,.12);
    letter-spacing: .06em;
    text-shadow: 0 2px 0 #5b070c, 0 0 12px rgba(255,224,145,.45);
}

.snf-af__marquee strong {
    display: block;
    font-size: clamp(25px, 5vw, 58px);
    line-height: .95;
}

.snf-af__marquee-kicker {
    display: block;
    margin-bottom: 5px;
    color: var(--snf-gold);
    font: 700 clamp(10px, 1.5vw, 15px)/1.1 Arial, sans-serif;
    letter-spacing: .18em;
}

.snf-af__screen-shell {
    position: relative;
    z-index: 2;
    padding: clamp(10px, 1.8vw, 19px);
    border: 5px solid #170607;
    border-radius: 32px;
    background: linear-gradient(145deg, #3b3030, #0a0808 70%);
    box-shadow: inset 0 0 0 2px #625354, inset 0 12px 22px rgba(255,255,255,.08), 0 10px 26px rgba(0,0,0,.35);
}

.snf-af__screen {
    position: relative;
    overflow: hidden;
    border: 3px solid #020202;
    border-radius: 38px / 30px;
    background: #06130b;
    box-shadow:
        inset 0 0 48px rgba(0,0,0,.95),
        inset 0 0 9px rgba(153,255,179,.12),
        0 0 0 2px #2a2d29;
    isolation: isolate;
}

.snf-af__hud {
    position: relative;
    z-index: 5;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2px;
    padding: 8px 10px;
    color: #fff1c8;
    background: linear-gradient(180deg, rgba(10,5,4,.98), rgba(18,7,7,.9));
    border-bottom: 2px solid rgba(214,168,75,.45);
    text-align: center;
}

.snf-af__hud div {
    min-width: 0;
    padding: 3px 5px;
}

.snf-af__hud span {
    display: block;
    margin-bottom: 2px;
    color: var(--snf-gold);
    font: 700 clamp(8px, 1.5vw, 12px)/1 Arial, sans-serif;
    letter-spacing: .14em;
}

.snf-af__hud strong {
    display: block;
    overflow: hidden;
    font-size: clamp(16px, 3.1vw, 31px);
    line-height: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.snf-af__field-wrap {
    position: relative;
    aspect-ratio: 16 / 9;
    background: #0b5b28;
}

.snf-af__field {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    cursor: crosshair;
    touch-action: none;
    pointer-events: auto;
}

.snf-af__message {
    position: absolute;
    z-index: 8;
    top: 17%;
    left: 50%;
    max-width: 92%;
    transform: translate(-50%, -50%) scale(.94);
    color: #fff5d7;
    font-size: clamp(22px, 4.8vw, 50px);
    line-height: .95;
    letter-spacing: .04em;
    text-align: center;
    text-shadow: 0 4px 0 rgba(62,0,0,.8), 0 0 12px rgba(0,0,0,.8);
    pointer-events: none;
    opacity: 0;
    transition: opacity .13s ease, transform .13s ease;
}

.snf-af__message.is-visible {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
}

.snf-af__pressure {
    position: absolute;
    z-index: 7;
    right: 2.5%;
    bottom: 3%;
    width: min(29%, 190px);
    padding: 5px 7px 7px;
    border: 1px solid rgba(255,238,190,.65);
    border-radius: 7px;
    color: #fff4d1;
    background: rgba(10,3,3,.72);
    font: 800 clamp(8px, 1.3vw, 11px)/1 Arial, sans-serif;
    letter-spacing: .13em;
    pointer-events: none;
    opacity: 0;
    transition: opacity .15s ease;
}

.snf-af__pressure.is-visible {
    opacity: 1;
}

.snf-af__pressure span {
    display: block;
    margin-bottom: 4px;
}

.snf-af__pressure::after {
    content: "";
    display: block;
    height: 7px;
    border-radius: 4px;
    background: rgba(255,255,255,.13);
}

.snf-af__pressure i {
    position: absolute;
    right: 7px;
    bottom: 7px;
    left: 7px;
    display: block;
    width: 0;
    height: 7px;
    border-radius: 4px;
    background: linear-gradient(90deg, #d7b14e, #df242d 75%, #ff4a22);
    box-shadow: 0 0 8px rgba(238,50,40,.45);
    transition: width .08s linear;
}

.snf-af__playbook {
    position: relative;
    z-index: 6;
    background: linear-gradient(180deg, #120707, #050303);
    border-top: 1px solid rgba(214,168,75,.25);
}

.snf-af__play-modes {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    padding: 8px 10px 0;
}

.snf-af__play-modes button {
    min-height: 34px;
    border: 1px solid rgba(240,209,140,.72);
    border-radius: 8px 8px 4px 4px;
    color: #dccda8;
    background: linear-gradient(180deg, #2e1717, #140909);
    cursor: pointer;
    font-size: clamp(14px, 2.4vw, 21px);
    letter-spacing: .08em;
    opacity: .74;
}

.snf-af__play-modes button.is-active {
    color: #fff4d1;
    background: linear-gradient(180deg, #d01c25, #7f0a11);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 2px 0 #4a060a;
    opacity: 1;
}

.snf-af__play-modes button:disabled {
    cursor: default;
    opacity: .35;
}

.snf-af__play-controls {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    padding: 8px 10px 11px;
}

.snf-af__play-controls button,
.snf-af__panel button {
    position: relative;
    z-index: 1;
    pointer-events: auto;
    min-height: 54px;
    border: 2px solid #f0d18c;
    border-radius: 10px;
    color: #fff4d1;
    background: linear-gradient(180deg, #d01c25, #7f0a11);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 5px 0 #4a060a;
    cursor: pointer;
    text-shadow: 0 2px 0 rgba(54,0,0,.75);
    transition: transform .08s ease, filter .08s ease, opacity .2s ease;
}

.snf-af__play-controls button:hover,
.snf-af__panel button:hover,
.snf-af__play-modes button:hover {
    filter: brightness(1.08);
}

.snf-af__play-controls button:active,
.snf-af__panel button:active {
    transform: translateY(3px);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 2px 0 #4a060a;
}

.snf-af__play-controls button:disabled {
    cursor: default;
    opacity: .38;
    filter: grayscale(.5);
}

.snf-af__play-controls span {
    display: block;
    font-size: clamp(16px, 2.8vw, 27px);
    line-height: 1;
}

.snf-af__play-controls small {
    display: block;
    margin-top: 3px;
    font: 700 clamp(8px, 1.3vw, 12px)/1 Arial, sans-serif;
    letter-spacing: .04em;
}

.snf-af__start,
.snf-af__gameover {
    position: absolute;
    z-index: 20;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 22px;
    background: radial-gradient(circle at center, rgba(78,10,13,.65), rgba(0,0,0,.88));
    backdrop-filter: blur(3px);
}

.snf-af__panel {
    width: min(92%, 590px);
    padding: clamp(22px, 4vw, 38px);
    border: 3px solid #dcb45e;
    border-radius: 18px;
    color: #fff2cf;
    background: linear-gradient(180deg, rgba(35,8,9,.97), rgba(11,3,4,.97));
    box-shadow: 0 22px 50px rgba(0,0,0,.55), inset 0 0 22px rgba(214,168,75,.08);
    text-align: center;
}

.snf-af__panel h2 {
    margin: 8px 0 10px;
    font-size: clamp(30px, 6vw, 60px);
    line-height: .95;
}

.snf-af__panel p {
    margin: 0 auto 20px;
    max-width: 500px;
    font: 700 clamp(13px, 2vw, 17px)/1.45 Arial, sans-serif;
    color: #e8dcc0;
}

.snf-af__panel button {
    padding: 10px 26px;
    font-size: clamp(21px, 4vw, 34px);
}

.snf-af__eyebrow {
    color: var(--snf-gold);
    font: 800 12px/1 Arial, sans-serif;
    letter-spacing: .18em;
}

.snf-af__final-score {
    margin: 8px 0 14px;
    color: #ffe9a8;
    font-size: clamp(48px, 10vw, 92px);
    line-height: .9;
    text-shadow: 0 4px 0 #7f0b12;
}

.snf-af__glass,
.snf-af__scanlines {
    position: absolute;
    z-index: 30;
    inset: 0;
    border-radius: inherit;
    pointer-events: none !important;
}

.snf-af__glass {
    background:
        linear-gradient(118deg, rgba(255,255,255,.15) 0%, rgba(255,255,255,.04) 18%, transparent 31%),
        radial-gradient(ellipse at 25% 5%, rgba(255,255,255,.16), transparent 28%),
        radial-gradient(ellipse at center, transparent 50%, rgba(0,0,0,.42) 100%);
    mix-blend-mode: screen;
    opacity: .75;
}

.snf-af__scanlines {
    background: repeating-linear-gradient(180deg, rgba(255,255,255,.025) 0 1px, rgba(0,0,0,.035) 1px 3px);
    opacity: .48;
}

.snf-af__control-deck {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 78px 1fr 90px;
    align-items: center;
    gap: 14px;
    margin: 14px auto 0;
    padding: 14px 20px;
    max-width: 90%;
    min-height: 76px;
    border: 3px solid #4b070a;
    border-radius: 12px 12px 22px 22px;
    color: #fce8b6;
    background: linear-gradient(180deg, #e3222d, #8b0c14);
    box-shadow: inset 0 4px 0 rgba(255,255,255,.12), 0 9px 0 #4b070a;
}

.snf-af__speaker {
    width: 72px;
    height: 46px;
    border-radius: 8px;
    background: radial-gradient(circle, #1d1112 0 2px, transparent 2.5px) 0 0 / 9px 9px;
    opacity: .85;
}

.snf-af__deck-copy {
    font: 800 clamp(11px, 2vw, 16px)/1.1 Arial, sans-serif;
    letter-spacing: .14em;
    text-align: center;
    text-shadow: 0 2px 0 #65070d;
}

.snf-af__buttons {
    display: flex;
    justify-content: flex-end;
    gap: 11px;
}

.snf-af__buttons i {
    display: block;
    width: 28px;
    height: 28px;
    border: 3px solid #3e0609;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 28%, #fff2bb, #d7a840 45%, #755116 100%);
    box-shadow: 0 4px 0 #3e0609;
}

@media (max-width: 620px) {
    .snf-af {
        margin: 8px auto;
    }

    .snf-af__cabinet {
        padding: 10px;
        border-width: 3px;
        border-radius: 22px 22px 15px 15px;
    }

    .snf-af__marquee {
        max-width: 94%;
        margin-bottom: 8px;
        padding: 9px 10px 10px;
        border-radius: 12px 12px 7px 7px;
    }

    .snf-af__screen-shell {
        padding: 7px;
        border-width: 3px;
        border-radius: 21px;
    }

    .snf-af__screen {
        border-radius: 22px / 18px;
    }

    .snf-af__hud {
        padding: 6px 4px;
    }

    .snf-af__play-modes {
        gap: 4px;
        padding: 6px 7px 0;
    }

    .snf-af__play-modes button {
        min-height: 29px;
    }

    .snf-af__play-controls {
        gap: 5px;
        padding: 6px 7px 8px;
    }

    .snf-af__play-controls button {
        min-height: 48px;
        padding: 5px 3px;
        border-radius: 7px;
    }

    .snf-af__pressure {
        width: 31%;
        padding: 4px 5px 6px;
    }

    .snf-af__pressure i {
        right: 5px;
        bottom: 6px;
        left: 5px;
        height: 6px;
    }

    .snf-af__pressure::after {
        height: 6px;
    }

    .snf-af__control-deck {
        grid-template-columns: 1fr;
        margin-top: 8px;
        padding: 9px 12px;
        min-height: 44px;
    }

    .snf-af__speaker,
    .snf-af__buttons {
        display: none;
    }

    .snf-af__panel {
        padding: 20px 16px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .snf-af *,
    .snf-af *::before,
    .snf-af *::after {
        scroll-behavior: auto !important;
        transition: none !important;
    }
}

/* v0.4.0 compact overlays and arcade leaderboard */
.snf-af__start,
.snf-af__gameover {
    padding: clamp(7px, 2vw, 18px);
    overflow: hidden;
}

.snf-af__panel {
    max-height: calc(100% - 2px);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: var(--snf-gold) rgba(255,255,255,.08);
}

.snf-af__panel--intro {
    width: min(92%, 560px);
    padding: clamp(12px, 2.7vw, 26px);
}

.snf-af__panel--intro h2,
.snf-af__panel--results h2 {
    margin: 5px 0 8px;
    font-size: clamp(27px, 5vw, 50px);
}

.snf-af__intro-copy {
    margin: 0 auto 12px;
    max-width: 490px;
}

.snf-af__intro-copy p {
    margin: 0 0 6px;
    font: 700 clamp(11px, 1.7vw, 15px)/1.24 Arial, sans-serif;
    color: #e8dcc0;
}

.snf-af__intro-copy strong {
    color: #f0cf7b;
    letter-spacing: .04em;
}

.snf-af__panel--results {
    width: min(94%, 620px);
    padding: clamp(12px, 2.5vw, 24px);
}

.snf-af__panel--results > div > p {
    margin-bottom: 10px;
    font-size: clamp(10px, 1.6vw, 14px);
    line-height: 1.28;
}

.snf-af__panel--results .snf-af__final-score {
    margin: 4px 0 8px;
    font-size: clamp(40px, 8vw, 76px);
}

.snf-af__initials {
    display: flex;
    justify-content: center;
    gap: clamp(8px, 2vw, 14px);
    margin: 10px auto 8px;
}

.snf-af__initials input {
    width: clamp(48px, 10vw, 72px);
    height: clamp(54px, 11vw, 78px);
    padding: 0;
    border: 3px solid #edcf84;
    border-radius: 8px;
    outline: none;
    color: #fff1bc;
    background: #120606;
    box-shadow: inset 0 0 14px rgba(214,168,75,.13), 0 4px 0 #5e080d;
    font: 900 clamp(30px, 7vw, 52px)/1 Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
    text-align: center;
    text-transform: uppercase;
    caret-color: #f4c85e;
}

.snf-af__initials input:focus {
    border-color: #fff0b8;
    box-shadow: inset 0 0 18px rgba(255,218,121,.20), 0 0 12px rgba(245,198,83,.35), 0 4px 0 #5e080d;
}

.snf-af__entry-status {
    min-height: 1.2em;
    margin: 0 0 8px !important;
    color: #f0cf7b !important;
    font: 800 11px/1.2 Arial, sans-serif !important;
    letter-spacing: .12em;
}

.snf-af__panel button:disabled {
    cursor: default;
    filter: grayscale(.6);
    opacity: .55;
}

.snf-af__leaderboard {
    margin: 8px auto 11px;
    padding: 7px 9px 9px;
    max-width: 500px;
    border: 2px solid rgba(220,180,94,.72);
    border-radius: 10px;
    background: rgba(4,1,2,.68);
    box-shadow: inset 0 0 14px rgba(214,168,75,.06);
}

.snf-af__leaderboard h3 {
    margin: 0 0 5px;
    color: #f4d37f;
    font-size: clamp(15px, 2.6vw, 22px);
    line-height: 1;
    letter-spacing: .14em;
}

.snf-af__leaderboard ol {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2px 13px;
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: none;
}

.snf-af__leaderboard li {
    display: grid;
    grid-template-columns: 24px 1fr auto;
    align-items: center;
    gap: 5px;
    min-width: 0;
    padding: 2px 3px;
    color: #fff0c4;
    font: 800 clamp(10px, 1.5vw, 13px)/1.15 "Courier New", monospace;
    letter-spacing: .05em;
}

.snf-af__leaderboard li span {
    color: #bba773;
}

.snf-af__leaderboard li strong {
    overflow: hidden;
    color: #fff6d8;
    text-overflow: ellipsis;
}

.snf-af__leaderboard li b {
    color: #f0c65f;
    font-weight: 900;
}

.snf-af__leaderboard li.is-empty {
    display: block;
    grid-column: 1 / -1;
    padding: 5px;
    color: #bba773;
    text-align: center;
}

@media (max-width: 620px) {
    .snf-af__start,
    .snf-af__gameover {
        padding: 5px;
    }

    .snf-af__panel,
    .snf-af__panel--intro,
    .snf-af__panel--results {
        width: 96%;
        max-height: calc(100% - 2px);
        padding: 10px 11px;
        border-width: 2px;
        border-radius: 12px;
    }

    .snf-af__panel--intro h2,
    .snf-af__panel--results h2 {
        margin: 3px 0 6px;
        font-size: clamp(24px, 7vw, 34px);
    }

    .snf-af__eyebrow {
        font-size: 9px;
        letter-spacing: .12em;
    }

    .snf-af__intro-copy {
        margin-bottom: 8px;
    }

    .snf-af__intro-copy p {
        margin-bottom: 4px;
        font-size: clamp(9px, 2.7vw, 12px);
        line-height: 1.18;
    }

    .snf-af__panel button {
        min-height: 42px;
        padding: 6px 17px;
        font-size: clamp(18px, 5vw, 25px);
    }

    .snf-af__panel--results .snf-af__final-score {
        margin: 2px 0 5px;
        font-size: clamp(36px, 11vw, 52px);
    }

    .snf-af__panel--results > div > p {
        margin-bottom: 6px;
        font-size: 9px;
    }

    .snf-af__initials {
        margin: 7px auto 6px;
    }

    .snf-af__initials input {
        width: clamp(42px, 13vw, 56px);
        height: clamp(46px, 14vw, 61px);
        border-width: 2px;
        font-size: clamp(27px, 9vw, 40px);
    }

    .snf-af__leaderboard {
        margin: 5px auto 7px;
        padding: 5px 6px 6px;
    }

    .snf-af__leaderboard h3 {
        margin-bottom: 3px;
        font-size: 14px;
    }

    .snf-af__leaderboard ol {
        gap: 1px 7px;
    }

    .snf-af__leaderboard li {
        grid-template-columns: 19px 1fr auto;
        gap: 3px;
        padding: 1px 2px;
        font-size: 9px;
    }
}

/* Exact embedded midfield source; retained in the DOM only for canvas rendering. */
.snf-af__midfield-source{position:absolute!important;width:1px!important;height:1px!important;left:-9999px!important;top:-9999px!important;opacity:0!important;pointer-events:none!important;}


/* v0.9.8 member leaderboard */
.snf-af__member-status {
    margin: 9px auto 0 !important;
    max-width: 560px;
    color: #f0cf7b !important;
    font: 800 clamp(9px, 1.45vw, 12px)/1.25 Arial, sans-serif !important;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.snf-af__login-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 170px;
    margin-top: 8px;
    padding: 10px 18px;
    border: 2px solid #edcf84;
    border-radius: 8px;
    color: #fff1bc;
    background: #8f0b16;
    box-shadow: 0 4px 0 #4e060b;
    font: 900 13px/1 Arial, sans-serif;
    letter-spacing: .1em;
    text-decoration: none;
}

.snf-af__login-button[hidden] { display: none !important; }


/* v0.10.5 fullscreen shelf layout matching Hawk Hunt cabinet treatment */
.snf-af {
    --snf-af-hud-height: 42px;
    --snf-af-playbook-height: 186px;
    width: 100%;
    max-width: none;
    margin: 0;
    min-height: 100dvh;
    background: #030303;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
}

.snf-af__cabinet,
.snf-af__screen-shell {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    overflow: visible;
}

.snf-af__cabinet::before,
.snf-af__cabinet::after,
.snf-af__marquee,
.snf-af__control-deck {
    display: none !important;
}

.snf-af__screen {
    display: grid;
    grid-template-rows: var(--snf-af-hud-height) auto minmax(var(--snf-af-playbook-height), 1fr);
    min-height: 100dvh;
    border: 0;
    border-radius: 0;
    background: radial-gradient(ellipse at center, rgba(181,18,27,.16), transparent 58%), #030303;
    box-shadow: none;
}

.snf-af__hud {
    grid-row: 1;
    align-self: stretch;
    width: 100%;
    height: var(--snf-af-hud-height);
    min-height: var(--snf-af-hud-height);
    padding: 6px 6px 7px;
}

.snf-af__hud div { padding: 2px 3px; }
.snf-af__hud span { font-size: clamp(7px, 1.8vw, 10px); }
.snf-af__hud strong { font-size: clamp(14px, 3.2vw, 26px); }

.snf-af__field-wrap {
    grid-row: 2;
    place-self: center;
    width: min(100%, calc((100dvh - var(--snf-af-hud-height) - var(--snf-af-playbook-height)) * 1.7777778));
    height: auto;
    max-width: 100%;
    max-height: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: #07120e;
    box-shadow: 0 0 0 1px rgba(214,168,75,.28), 0 0 30px rgba(0,0,0,.55);
}

.snf-af__field {
    width: 100%;
    height: 100%;
}

.snf-af__playbook {
    position: relative;
    z-index: 6;
    grid-row: 3;
    overflow: hidden;
    min-height: var(--snf-af-playbook-height);
    padding: 14px clamp(12px, 2vw, 18px) 86px;
    background: linear-gradient(180deg, #120405 0%, #050102 100%);
    border-top: 1px solid rgba(214,168,75,.34);
    display: grid;
    align-content: start;
    gap: 8px;
}

.snf-af__cabinet-playbook-art {
    position: absolute;
    z-index: 0;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: fill;
    pointer-events: none;
    user-select: none;
}

.snf-af__play-modes {
    display: none !important;
}

.snf-af__play-controls {
    position: relative;
    z-index: 1;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    padding: 0;
}

.snf-af__play-controls::before {
    display: block;
    grid-column: 1 / -1;
    margin: 0 0 2px;
    color: rgba(247,235,199,.82);
    font: 800 9px/1 Arial, sans-serif;
    letter-spacing: .16em;
    text-align: center;
    text-shadow: 0 1px 0 rgba(0,0,0,.45);
    content: '';
}

.snf-af__play-controls[data-play-group="pass"]::before { content: 'PASS PLAYS'; }
.snf-af__play-controls[data-play-group="run"]::before { content: 'RUN PLAYS'; }

.snf-af__play-controls button {
    min-height: 46px;
    padding: 4px 3px 5px;
    border-width: 2px;
    border-radius: 9px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 4px 0 #4a060a;
}

.snf-af__play-controls span {
    font-size: clamp(14px, 2.8vw, 22px);
}

.snf-af__play-controls small {
    margin-top: 2px;
    font-size: clamp(7px, 1.25vw, 10px);
}

.snf-af [hidden].snf-af__play-controls {
    display: grid !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

@media (orientation: portrait), (max-width: 620px) {
    .snf-af {
        --snf-af-hud-height: 40px;
        --snf-af-playbook-height: 196px;
    }

    .snf-af__screen {
        grid-template-rows: var(--snf-af-hud-height) auto minmax(var(--snf-af-playbook-height), 1fr);
    }

    .snf-af__field-wrap {
        place-self: start center;
        width: 100%;
        max-height: none;
    }

    .snf-af__playbook {
        padding: 14px 10px 84px;
    }

    .snf-af__play-controls {
        gap: 6px;
    }

    .snf-af__play-controls button {
        min-height: 44px;
        padding: 4px 2px 5px;
        border-radius: 8px;
    }

    .snf-af__play-controls span { font-size: clamp(13px, 4vw, 18px); }
    .snf-af__play-controls small { font-size: clamp(6px, 1.9vw, 9px); }
}

@media (orientation: landscape) and (max-height: 540px) {
    .snf-af {
        --snf-af-hud-height: 34px;
        --snf-af-playbook-height: 132px;
    }

    .snf-af__hud {
        padding: 3px 4px 4px;
    }

    .snf-af__hud span { font-size: 6px; }
    .snf-af__hud strong { font-size: clamp(11px, 2.1vw, 18px); }

    .snf-af__playbook {
        padding: 8px 10px 48px;
    }

    .snf-af__play-controls::before {
        margin-bottom: 1px;
        font-size: 7px;
    }

    .snf-af__play-controls {
        gap: 5px;
    }

    .snf-af__play-controls button {
        min-height: 34px;
        padding: 2px;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 2px 0 #4a060a;
    }

    .snf-af__play-controls span { font-size: clamp(11px, 2vw, 15px); }
    .snf-af__play-controls small { font-size: 6px; margin-top: 1px; }
}


/* v0.10.6: actual Hawk Hunt-style fullscreen app shell. */
html.snf-af-fullscreen,
body.snf-af-fullscreen {
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
    overscroll-behavior: none !important;
}

body.snf-af-fullscreen {
    touch-action: none;
}

.snf-af {
    --snf-af-appbar-height: 40px;
    --snf-af-hud-height: 42px;
    position: fixed !important;
    z-index: 2147483000 !important;
    inset: 0 !important;
    display: grid !important;
    grid-template-rows: var(--snf-af-appbar-height) minmax(0, 1fr) !important;
    width: 100vw !important;
    max-width: none !important;
    height: 100vh !important;
    height: 100dvh !important;
    min-height: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    background:
        radial-gradient(circle at 50% 42%, rgba(181,18,27,.20), transparent 44%),
        linear-gradient(180deg, #140507, #020101 72%) !important;
}

.snf-af__appbar {
    position: relative !important;
    z-index: 80 !important;
    grid-row: 1 !important;
    display: grid !important;
    grid-template-columns: 76px minmax(0, 1fr) 76px !important;
    align-items: center !important;
    gap: 7px !important;
    width: 100% !important;
    height: var(--snf-af-appbar-height) !important;
    min-height: var(--snf-af-appbar-height) !important;
    padding: 4px max(8px, env(safe-area-inset-right)) 4px max(8px, env(safe-area-inset-left)) !important;
    border-bottom: 1px solid rgba(214,168,75,.70) !important;
    color: #fff1c8 !important;
    background: linear-gradient(180deg, rgba(33,6,8,.94), rgba(7,2,3,.84)) !important;
    box-shadow: 0 4px 18px rgba(0,0,0,.38) !important;
    backdrop-filter: blur(8px);
}

.snf-af__appbar strong {
    min-width: 0;
    overflow: hidden;
    color: #fff1c8;
    font: 900 18px/1 Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
    letter-spacing: .08em;
    text-align: center;
    text-overflow: ellipsis;
    text-shadow: 0 2px 0 #65070d;
    white-space: nowrap;
}

.snf-af__appbar button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 3px 8px;
    border: 1px solid #e1bd6c;
    border-radius: 7px;
    color: #fff3cf;
    background: linear-gradient(180deg, #b5121b, #69080e);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 2px 0 #390407;
    font: 900 11px/1 Arial, sans-serif;
    letter-spacing: .05em;
    cursor: pointer;
}

.snf-af__appbar button:hover,
.snf-af__appbar button:focus-visible {
    filter: brightness(1.12);
}

.snf-af__appbar button:active {
    transform: translateY(1px);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 1px 0 #390407;
}

.snf-af__appbar-spacer {
    display: block;
    width: 76px;
    height: 1px;
}

.snf-af__cabinet {
    position: relative !important;
    z-index: 1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
}

.snf-af__screen-shell {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
}

.snf-af__screen {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    grid-template-rows: var(--snf-af-hud-height) auto minmax(var(--snf-af-playbook-height), 1fr) !important;
}

.snf-af__start,
.snf-af__gameover,
.snf-af-po__round-complete {
    z-index: 40 !important;
}

@media (max-width: 620px) {
    .snf-af {
        --snf-af-appbar-height: 40px;
        --snf-af-hud-height: 40px;
    }

    .snf-af__appbar {
        grid-template-columns: 72px minmax(0, 1fr) 72px !important;
        padding-top: 4px !important;
        padding-bottom: 4px !important;
    }

    .snf-af__appbar strong {
        font-size: 16px;
    }

    .snf-af__appbar button {
        min-height: 31px;
        font-size: 10px;
    }

    .snf-af__appbar-spacer {
        width: 72px;
    }
}


/* v0.10.8: reordered arcade-button shelf — smaller run buttons on top, larger pass buttons below. */
.snf-af__playbook {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto !important;
    align-content: start !important;
    justify-items: center !important;
    row-gap: clamp(6px, 1.3vh, 12px) !important;
    padding-top: clamp(24px, 4vh, 34px) !important;
}

.snf-af__play-controls {
    grid-template-columns: repeat(3, auto) !important;
    justify-content: center !important;
    justify-items: center !important;
    align-items: start !important;
    column-gap: clamp(10px, 3vw, 20px) !important;
    row-gap: 0 !important;
    width: 100% !important;
    padding: 0 clamp(8px, 3vw, 24px) !important;
}

.snf-af__play-controls[data-play-group="run"] {
    grid-row: 1 !important;
    transform: none !important;
    margin: 0 !important;
}

.snf-af__play-controls[data-play-group="pass"] {
    grid-row: 2 !important;
    transform: none !important;
    margin: 0 !important;
}

.snf-af__play-controls::before {
    margin-bottom: 5px !important;
    color: rgba(247,235,199,.78) !important;
    font-size: 8px !important;
    letter-spacing: .22em !important;
}

.snf-af__play-controls[data-play-group="pass"]::before { content: 'PASS' !important; }
.snf-af__play-controls[data-play-group="run"]::before { content: 'RUN' !important; }

.snf-af__play-controls button {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 8px 5px !important;
    border: 3px solid #e4bd70 !important;
    border-radius: 50% !important;
    background:
        radial-gradient(circle at 34% 26%, rgba(255,255,255,.30) 0 5%, transparent 6% 100%),
        radial-gradient(circle at 40% 32%, #e92b35 0%, #c81520 42%, #850b13 72%, #51060b 100%) !important;
    box-shadow:
        0 0 0 5px #090203,
        0 0 0 8px #7b111a,
        inset 0 3px 2px rgba(255,255,255,.20),
        inset 0 -7px 12px rgba(48,0,4,.36),
        0 7px 0 #310305,
        0 13px 20px rgba(0,0,0,.34) !important;
    text-align: center !important;
}

.snf-af__play-controls[data-play-group="run"] button {
    width: clamp(60px, 16vw, 78px) !important;
    height: clamp(60px, 16vw, 78px) !important;
    padding: 6px 3px !important;
    box-shadow:
        0 0 0 4px #090203,
        0 0 0 7px #7b111a,
        inset 0 2px 2px rgba(255,255,255,.18),
        inset 0 -5px 10px rgba(48,0,4,.32),
        0 5px 0 #310305,
        0 10px 16px rgba(0,0,0,.30) !important;
}

.snf-af__play-controls[data-play-group="pass"] button {
    width: clamp(78px, 19vw, 98px) !important;
    height: clamp(78px, 19vw, 98px) !important;
}

.snf-af__play-controls button:hover:not(:disabled) {
    filter: brightness(1.08) !important;
}

.snf-af__play-controls button:active:not(:disabled) {
    transform: translateY(4px) !important;
    box-shadow:
        0 0 0 5px #090203,
        0 0 0 8px #7b111a,
        inset 0 3px 2px rgba(255,255,255,.16),
        inset 0 -5px 10px rgba(48,0,4,.30),
        0 3px 0 #310305,
        0 7px 12px rgba(0,0,0,.28) !important;
}

.snf-af__play-controls[data-play-group="run"] button:active:not(:disabled) {
    box-shadow:
        0 0 0 4px #090203,
        0 0 0 7px #7b111a,
        inset 0 2px 1px rgba(255,255,255,.15),
        inset 0 -4px 8px rgba(48,0,4,.26),
        0 2px 0 #310305,
        0 5px 10px rgba(0,0,0,.24) !important;
}

.snf-af__play-controls button:disabled {
    opacity: .42 !important;
    filter: grayscale(.35) !important;
}

.snf-af__play-controls span {
    display: block !important;
    max-width: 90% !important;
    line-height: .92 !important;
    letter-spacing: .015em !important;
}

.snf-af__play-controls[data-play-group="run"] span {
    font-size: clamp(11px, 2.8vw, 15px) !important;
}

.snf-af__play-controls[data-play-group="pass"] span {
    font-size: clamp(14px, 3.6vw, 20px) !important;
}

.snf-af__play-controls small {
    display: block !important;
    max-width: 82% !important;
    line-height: 1.05 !important;
    letter-spacing: .025em !important;
}

.snf-af__play-controls[data-play-group="run"] small {
    margin: 3px auto 0 !important;
    font-size: clamp(5px, 1.2vw, 7px) !important;
}

.snf-af__play-controls[data-play-group="pass"] small {
    margin: 4px auto 0 !important;
    font-size: clamp(6px, 1.55vw, 8px) !important;
}

@media (orientation: portrait), (max-width: 620px) {
    .snf-af__playbook {
        padding: 22px 8px 82px !important;
        row-gap: 7px !important;
    }

    .snf-af__play-controls {
        column-gap: 10px !important;
        padding-left: 4px !important;
        padding-right: 4px !important;
    }

    .snf-af__play-controls::before {
        margin-bottom: 4px !important;
        font-size: 8px !important;
    }

    .snf-af__play-controls[data-play-group="run"] button {
        width: 58px !important;
        height: 58px !important;
        padding: 5px 2px !important;
        box-shadow:
            0 0 0 3px #090203,
            0 0 0 6px #7b111a,
            inset 0 2px 2px rgba(255,255,255,.18),
            inset 0 -4px 8px rgba(48,0,4,.32),
            0 4px 0 #310305,
            0 8px 12px rgba(0,0,0,.28) !important;
    }

    .snf-af__play-controls[data-play-group="pass"] button {
        width: 74px !important;
        height: 74px !important;
        padding: 6px 3px !important;
        box-shadow:
            0 0 0 4px #090203,
            0 0 0 7px #7b111a,
            inset 0 3px 2px rgba(255,255,255,.20),
            inset 0 -6px 10px rgba(48,0,4,.34),
            0 5px 0 #310305,
            0 10px 15px rgba(0,0,0,.30) !important;
    }

    .snf-af__play-controls[data-play-group="run"] span {
        font-size: 11px !important;
    }

    .snf-af__play-controls[data-play-group="pass"] span {
        font-size: 15px !important;
    }

    .snf-af__play-controls[data-play-group="run"] small {
        margin-top: 2px !important;
        font-size: 5px !important;
    }

    .snf-af__play-controls[data-play-group="pass"] small {
        margin-top: 3px !important;
        font-size: 6px !important;
    }
}

@media (orientation: landscape) and (max-height: 540px) {
    .snf-af__playbook {
        padding: 8px 8px 42px !important;
        row-gap: 5px !important;
    }

    .snf-af__play-controls {
        column-gap: 8px !important;
    }

    .snf-af__play-controls::before {
        display: none !important;
    }

    .snf-af__play-controls[data-play-group="run"] button {
        width: 44px !important;
        height: 44px !important;
        padding: 3px 2px !important;
        box-shadow:
            0 0 0 2px #090203,
            0 0 0 4px #7b111a,
            inset 0 1px 1px rgba(255,255,255,.18),
            0 3px 0 #310305 !important;
    }

    .snf-af__play-controls[data-play-group="pass"] button {
        width: 56px !important;
        height: 56px !important;
        padding: 4px 2px !important;
        box-shadow:
            0 0 0 3px #090203,
            0 0 0 5px #7b111a,
            inset 0 2px 1px rgba(255,255,255,.18),
            0 4px 0 #310305 !important;
    }

    .snf-af__play-controls[data-play-group="run"] span {
        font-size: 8px !important;
    }

    .snf-af__play-controls[data-play-group="pass"] span {
        font-size: 10px !important;
    }

    .snf-af__play-controls small {
        display: none !important;
    }
}

/* v0.10.11 Hawk Hunt-style title card + start-screen Top 10 */
.snf-af__panel--attract {
    width: min(94%, 600px);
    padding: clamp(12px, 2.4vw, 22px);
}

.snf-af__panel--attract > [data-title-panel],
.snf-af__how-panel,
.snf-af__start-leaderboard-panel {
    width: 100%;
}

.snf-af__panel--attract h2,
.snf-af__how-panel h2,
.snf-af__start-leaderboard-panel h2 {
    margin: 8px 0 8px;
    font-size: clamp(30px, 5.6vw, 50px);
    line-height: .95;
    letter-spacing: .015em;
}

.snf-af__attract-stage {
    position: relative;
    height: clamp(105px, 18vh, 150px);
    margin: 10px auto 8px;
    overflow: hidden;
    border: 2px solid rgba(220, 180, 94, .78);
    border-radius: 13px;
    background:
        linear-gradient(90deg, transparent 49.5%, rgba(255,255,255,.4) 49.5%, rgba(255,255,255,.4) 50.5%, transparent 50.5%),
        repeating-linear-gradient(90deg, rgba(255,255,255,.11) 0 1px, transparent 1px 14.2%),
        linear-gradient(180deg, #10161a 0 16%, #173722 16% 84%, #19070a 84% 100%);
    box-shadow: inset 0 0 28px rgba(0,0,0,.4), 0 5px 14px rgba(0,0,0,.24);
}

.snf-af__attract-stage::before,
.snf-af__attract-stage::after {
    content: "";
    position: absolute;
    z-index: 1;
    left: 0;
    right: 0;
    pointer-events: none;
}

.snf-af__attract-stage::before {
    top: 50%;
    height: 2px;
    background: rgba(255,255,255,.4);
    box-shadow: 0 -31px 0 rgba(255,255,255,.18), 0 31px 0 rgba(255,255,255,.18);
}

.snf-af__attract-stage::after {
    bottom: 12%;
    height: 3px;
    background: linear-gradient(90deg, #7c1017, #bc0c1c 35%, #bc0c1c 65%, #7c1017);
    box-shadow: 0 4px 0 rgba(0,0,0,.25);
}

.snf-af__attract-logo {
    position: absolute;
    z-index: 4;
    top: 50%;
    left: 50%;
    width: clamp(64px, 15vw, 98px);
    height: clamp(64px, 15vw, 98px);
    object-fit: contain;
    transform: translate(-50%, -50%);
    filter: drop-shadow(0 5px 8px rgba(0,0,0,.5));
}

.snf-af__route {
    position: absolute;
    z-index: 3;
    top: 39%;
    width: 25%;
    height: 25%;
    border-top: 4px solid #e19c72;
    pointer-events: none;
}

.snf-af__route::after {
    content: "";
    position: absolute;
    top: -7px;
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
}

.snf-af__route--left {
    left: 11%;
    border-left: 4px solid #e19c72;
    border-radius: 13px 0 0 0;
    transform: rotate(-8deg);
}
.snf-af__route--left::after {
    right: -2px;
    border-left: 9px solid #e19c72;
}

.snf-af__route--right {
    right: 11%;
    border-right: 4px solid #e19c72;
    border-radius: 0 13px 0 0;
    transform: rotate(8deg);
}
.snf-af__route--right::after {
    left: -2px;
    border-right: 9px solid #e19c72;
}

.snf-af__player-dot {
    position: absolute;
    z-index: 3;
    top: 58%;
    width: clamp(16px, 3vw, 23px);
    aspect-ratio: 1;
    border: 2px solid #f4d37f;
    border-radius: 50%;
    background: #bc0c1c;
    box-shadow: 0 3px 0 rgba(0,0,0,.4), inset 0 0 0 3px rgba(255,255,255,.08);
}
.snf-af__player-dot--one { left: 18%; }
.snf-af__player-dot--two { right: 18%; }

.snf-af__attract-football {
    position: absolute;
    z-index: 5;
    top: 25%;
    left: 50%;
    color: #fff0bc;
    font-size: clamp(13px, 3vw, 20px);
    transform: translateX(-50%) rotate(45deg) scaleX(.72);
    text-shadow: 0 2px 0 rgba(0,0,0,.55);
}

.snf-af__playoff-path {
    position: absolute;
    z-index: 6;
    left: 50%;
    bottom: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(4px, 1.5vw, 10px);
    width: min(94%, 460px);
    transform: translateX(-50%);
}

.snf-af__playoff-path span {
    min-width: clamp(36px, 10vw, 58px);
    padding: 5px 7px;
    border: 1px solid rgba(240,209,140,.8);
    border-radius: 7px;
    color: #fff2cf;
    background: linear-gradient(180deg, rgba(188,12,28,.95), rgba(89,6,12,.96));
    box-shadow: 0 3px 0 rgba(36,2,5,.75);
    font: 900 clamp(9px, 2.2vw, 13px)/1 Arial, sans-serif;
    letter-spacing: .08em;
}

.snf-af__playoff-path i {
    color: #e19c72;
    font: 900 clamp(15px, 4vw, 25px)/1 Arial, sans-serif;
    font-style: normal;
}

.snf-af__attract-stage--playoffs .snf-af__attract-logo {
    top: 39%;
    width: clamp(58px, 13vw, 86px);
    height: clamp(58px, 13vw, 86px);
}

.snf-af__title-actions {
    display: flex;
    align-items: stretch;
    justify-content: center;
    gap: clamp(7px, 1.6vw, 12px);
    margin: 9px auto 8px;
}

.snf-af__title-actions button {
    min-width: 0;
    min-height: 50px;
    padding: 8px clamp(10px, 2.2vw, 19px);
    font-size: clamp(16px, 3.5vw, 27px);
    white-space: nowrap;
}

.snf-af__panel .snf-af__secondary-button {
    color: #f5dfad;
    background: linear-gradient(180deg, #4b2729, #241113);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 5px 0 #120607;
    text-shadow: 0 2px 0 rgba(0,0,0,.7);
}

.snf-af__title-flash {
    display: block;
    min-height: 1em;
    color: #8f7b61;
    font: 900 clamp(9px, 1.7vw, 12px)/1 "Courier New", monospace;
    letter-spacing: .15em;
    animation: snf-af-title-blink 1s steps(2, end) infinite;
}

@keyframes snf-af-title-blink {
    0%, 48% { opacity: .8; }
    49%, 100% { opacity: .22; }
}

.snf-af__how-panel,
.snf-af__start-leaderboard-panel {
    padding: clamp(5px, 1vw, 9px) 0;
}

.snf-af__how-panel .snf-af__intro-copy {
    margin: 14px auto 16px;
}

.snf-af__start-leaderboard-panel .snf-af__leaderboard--start {
    margin: 14px auto 16px;
    padding: 10px 12px 12px;
}

.snf-af__leaderboard--start ol {
    grid-template-columns: 1fr;
    gap: 2px;
}

.snf-af__leaderboard--start li {
    grid-template-columns: 30px minmax(0, 1fr) auto;
    padding: 4px 6px;
    font-size: clamp(11px, 2vw, 14px);
}

@media (max-width: 620px) {
    .snf-af__panel--attract {
        width: 96%;
        padding: 9px 10px 10px;
    }

    .snf-af__panel--attract h2,
    .snf-af__how-panel h2,
    .snf-af__start-leaderboard-panel h2 {
        margin: 5px 0 5px;
        font-size: clamp(27px, 7.7vw, 38px);
    }

    .snf-af__attract-stage {
        height: clamp(100px, 16vh, 132px);
        margin: 7px auto 6px;
        border-radius: 10px;
    }

    .snf-af__member-status {
        margin-top: 5px !important;
        font-size: clamp(8px, 2.15vw, 10px) !important;
        line-height: 1.15 !important;
    }

    .snf-af__title-actions {
        gap: 5px;
        margin: 7px auto 7px;
    }

    .snf-af__title-actions button {
        min-height: 42px;
        padding: 5px 8px;
        border-width: 2px;
        font-size: clamp(14px, 3.7vw, 19px);
    }

    .snf-af__title-actions button:first-child {
        flex: 1.16 1 0;
    }
    .snf-af__title-actions button:not(:first-child) {
        flex: 1 1 0;
    }

    .snf-af__how-panel .snf-af__intro-copy {
        margin: 10px auto 11px;
    }

    .snf-af__start-leaderboard-panel .snf-af__leaderboard--start {
        margin: 9px auto 10px;
        padding: 6px 8px 8px;
    }

    .snf-af__leaderboard--start li {
        grid-template-columns: 23px minmax(0, 1fr) auto;
        padding: 2px 4px;
        font-size: clamp(9px, 2.6vw, 11px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .snf-af__title-flash { animation: none !important; }
}


/* v0.10.12: six-pass cabinet + shelf-measured responsive controls. */
.snf-af__playbook {
    --snf-af-play-button-size: 74px;
    --snf-af-play-button-gap: 10px;
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: minmax(0, 1fr) !important;
    align-content: stretch !important;
    justify-items: stretch !important;
    padding: clamp(16px, 2.4vh, 26px) clamp(14px, 3vw, 28px) clamp(70px, 9vh, 92px) !important;
}

.snf-af__play-controls--six-pass {
    grid-row: 1 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-template-rows: auto repeat(2, minmax(0, 1fr)) !important;
    place-items: center !important;
    align-content: center !important;
    justify-content: center !important;
    column-gap: var(--snf-af-play-button-gap) !important;
    row-gap: var(--snf-af-play-button-gap) !important;
    padding: 0 !important;
    margin: 0 !important;
}

.snf-af__play-controls--six-pass::before {
    content: 'PASS PLAYS' !important;
    grid-column: 1 / -1 !important;
    align-self: end !important;
    margin: 0 0 clamp(2px, .5vh, 6px) !important;
    font-size: clamp(7px, 1.8vw, 10px) !important;
}

.snf-af__play-controls--six-pass button,
.snf-af__play-controls[data-play-group="pass"].snf-af__play-controls--six-pass button {
    width: var(--snf-af-play-button-size) !important;
    height: var(--snf-af-play-button-size) !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: none !important;
    max-height: none !important;
    padding: clamp(4px, 1vw, 7px) clamp(2px, .6vw, 4px) !important;
}

.snf-af__play-controls--six-pass span,
.snf-af__play-controls[data-play-group="pass"].snf-af__play-controls--six-pass span {
    font-size: clamp(10px, 3.2vw, 18px) !important;
    line-height: .92 !important;
}

.snf-af__play-controls--six-pass small,
.snf-af__play-controls[data-play-group="pass"].snf-af__play-controls--six-pass small {
    display: block !important;
    margin-top: clamp(2px, .7vw, 4px) !important;
    max-width: 86% !important;
    font-size: clamp(5px, 1.35vw, 7px) !important;
    line-height: 1.02 !important;
}

@media (orientation: portrait), (max-width: 620px) {
    .snf-af__playbook {
        padding: clamp(14px, 2vh, 22px) clamp(10px, 2.5vw, 18px) clamp(70px, 8.5vh, 86px) !important;
    }

    .snf-af__play-controls--six-pass {
        column-gap: var(--snf-af-play-button-gap) !important;
        row-gap: var(--snf-af-play-button-gap) !important;
    }
}

@media (orientation: landscape) and (max-height: 540px) {
    .snf-af__playbook {
        padding: 6px 12px 38px !important;
    }

    .snf-af__play-controls--six-pass::before {
        display: none !important;
    }

    .snf-af__play-controls--six-pass {
        grid-template-rows: repeat(2, minmax(0, 1fr)) !important;
    }

    .snf-af__play-controls--six-pass small {
        display: none !important;
    }
}


/* Extra-tight shelves: preserve tap targets/labels by sacrificing helper copy first. */
.snf-af__playbook.is-tight-playbook .snf-af__play-controls--six-pass small {
    display: none !important;
}

.snf-af__playbook.is-tight-playbook .snf-af__play-controls--six-pass span {
    font-size: clamp(9px, 3vw, 13px) !important;
}

.snf-af__playbook.is-tight-playbook .snf-af__play-controls--six-pass::before {
    margin-bottom: 0 !important;
    font-size: 7px !important;
}


/* v0.10.13: constrain the six-pass bank to the actual sloped shelf in the cabinet SVG.
   cabinet-playbook-bay.svg uses y≈16–307 for the deck and y≈307+ for the lip/body,
   so the controls intentionally occupy only the safe upper portion of this element. */
.snf-af__playbook {
    padding: 0 !important;
}


.snf-af__playbook > .snf-af__play-controls.snf-af__play-controls--six-pass {
    position: absolute !important;
    z-index: 2 !important;
    top: 6.5% !important;
    left: 7% !important;
    width: 86% !important;
    height: 42% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-template-rows: auto repeat(2, minmax(0, 1fr)) !important;
    align-content: stretch !important;
    justify-content: stretch !important;
    place-items: center !important;
    column-gap: var(--snf-af-play-button-gap) !important;
    row-gap: var(--snf-af-play-button-gap) !important;
}

.snf-af__playbook > .snf-af__play-controls.snf-af__play-controls--six-pass::before {
    grid-column: 1 / -1 !important;
    align-self: center !important;
    margin: 0 !important;
    line-height: 1 !important;
}

.snf-af__playbook > .snf-af__play-controls.snf-af__play-controls--six-pass button {
    align-self: center !important;
    justify-self: center !important;
}

@media (orientation: landscape) and (max-height: 540px) {
    .snf-af__playbook > .snf-af__play-controls.snf-af__play-controls--six-pass {
        top: 5.5% !important;
        height: 46% !important;
        grid-template-rows: repeat(2, minmax(0, 1fr)) !important;
    }
}


/* v0.10.14: hard-lock the six-pass controls to the upper sloped deck.
   IMPORTANT: the older pass group rule assigns grid-row:2. Absolutely positioned
   grid children still honor that grid placement, which pushed the entire bank down
   to the cabinet body. This selector deliberately outranks that legacy rule. */
.snf-af__playbook > .snf-af__play-controls[data-play-group="pass"].snf-af__play-controls--six-pass {
    grid-row: 1 !important;
    grid-column: 1 !important;
    position: absolute !important;
    z-index: 3 !important;
    top: 4.5% !important;
    left: 7% !important;
    width: 86% !important;
    height: 48% !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 8px 8px 12px !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-template-rows: auto auto auto !important;
    align-content: center !important;
    justify-content: stretch !important;
    justify-items: center !important;
    align-items: center !important;
    column-gap: var(--snf-af-play-button-gap) !important;
    row-gap: var(--snf-af-play-button-gap) !important;
    transform: none !important;
}

.snf-af__playbook > .snf-af__play-controls[data-play-group="pass"].snf-af__play-controls--six-pass::before {
    content: 'PASS' !important;
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
    position: static !important;
    align-self: center !important;
    justify-self: center !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
}

.snf-af__playbook > .snf-af__play-controls[data-play-group="pass"].snf-af__play-controls--six-pass button {
    position: static !important;
    width: var(--snf-af-play-button-size) !important;
    height: var(--snf-af-play-button-size) !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    transform: none;
}

.snf-af__playbook.is-tight-playbook > .snf-af__play-controls[data-play-group="pass"].snf-af__play-controls--six-pass {
    padding-top: 5px !important;
    padding-bottom: 8px !important;
}

@media (orientation: landscape) and (max-height: 540px) {
    .snf-af__playbook > .snf-af__play-controls[data-play-group="pass"].snf-af__play-controls--six-pass {
        top: 3.5% !important;
        height: 51% !important;
        padding: 4px 8px 8px !important;
        grid-template-rows: auto auto !important;
    }
    .snf-af__playbook > .snf-af__play-controls[data-play-group="pass"].snf-af__play-controls--six-pass::before {
        display: none !important;
    }
}

/* v0.10.18: move Pocket pressure out of the lower receiver/juke lane.
   Keep it on-field for peripheral visibility, but collapse it to a narrow
   right-edge rail so it no longer masks routes or catch/YAC interaction. */
.snf-af__field-wrap > .snf-af__pressure {
    position: absolute !important;
    z-index: 7 !important;
    top: 50% !important;
    right: 4px !important;
    bottom: auto !important;
    left: auto !important;
    width: 10px !important;
    height: 42% !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: translateY(-50%) !important;
    color: #fff4d1 !important;
    pointer-events: none !important;
    opacity: 0;
    transition: opacity .15s ease !important;
}

.snf-af__field-wrap > .snf-af__pressure.is-visible {
    opacity: 1;
}

.snf-af__field-wrap > .snf-af__pressure span {
    position: absolute !important;
    top: 50% !important;
    right: 13px !important;
    display: block !important;
    margin: 0 !important;
    padding: 4px 3px !important;
    border: 1px solid rgba(255,238,190,.48) !important;
    border-radius: 5px !important;
    background: rgba(10,3,3,.60) !important;
    color: rgba(255,244,209,.92) !important;
    font: 800 clamp(6px, .9vw, 8px)/1 Arial, sans-serif !important;
    letter-spacing: .10em !important;
    writing-mode: vertical-rl !important;
    text-orientation: mixed !important;
    transform: translateY(-50%) rotate(180deg) !important;
    white-space: nowrap !important;
    text-shadow: 0 1px 2px rgba(0,0,0,.7) !important;
}

.snf-af__field-wrap > .snf-af__pressure::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 10px !important;
    height: 100% !important;
    border: 1px solid rgba(255,238,190,.56) !important;
    border-radius: 999px !important;
    box-sizing: border-box !important;
    background: rgba(8,3,3,.58) !important;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.05), 0 1px 5px rgba(0,0,0,.38) !important;
}

.snf-af__field-wrap > .snf-af__pressure i {
    position: absolute !important;
    z-index: 1 !important;
    right: auto !important;
    bottom: 2px !important;
    left: 2px !important;
    display: block !important;
    width: 6px !important;
    height: 0;
    max-height: calc(100% - 4px) !important;
    border-radius: 999px !important;
    background: linear-gradient(0deg, #d7b14e 0%, #df242d 75%, #ff4a22 100%) !important;
    box-shadow: 0 0 7px rgba(238,50,40,.42) !important;
    transition: height .08s linear !important;
}

@media (orientation: portrait), (max-width: 620px) {
    .snf-af__field-wrap > .snf-af__pressure {
        right: 3px !important;
        width: 9px !important;
        height: 38% !important;
    }

    .snf-af__field-wrap > .snf-af__pressure span {
        right: 12px !important;
        padding: 3px 2px !important;
        font-size: 6px !important;
    }

    .snf-af__field-wrap > .snf-af__pressure::after {
        width: 9px !important;
    }

    .snf-af__field-wrap > .snf-af__pressure i {
        left: 2px !important;
        width: 5px !important;
    }
}

/* v0.11.1: true pre-snap presentation. After a play call, the offense breaks
   the huddle and both teams animate into formation before the user snaps it. */
.snf-af__playbook.is-awaiting-snap > .snf-af__play-controls {
    opacity: .16 !important;
    filter: saturate(.45) brightness(.72) !important;
    pointer-events: none !important;
    transition: opacity .16s ease, filter .16s ease !important;
}

.snf-af__hike-button {
    position: absolute !important;
    z-index: 8 !important;
    left: 50% !important;
    top: 27% !important;
    width: clamp(118px, 34%, 176px) !important;
    min-height: clamp(58px, 14vw, 76px) !important;
    transform: translate(-50%, -50%) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 8px 14px !important;
    border: 3px solid #e4bd70 !important;
    border-radius: 999px !important;
    color: #fff6dc !important;
    background:
        radial-gradient(circle at 34% 24%, rgba(255,255,255,.26) 0 5%, transparent 6% 100%),
        linear-gradient(180deg, #d51a25 0%, #a30e17 58%, #68070c 100%) !important;
    box-shadow:
        0 0 0 5px #090203,
        0 0 0 8px #7b111a,
        inset 0 3px 2px rgba(255,255,255,.18),
        inset 0 -7px 12px rgba(48,0,4,.34),
        0 7px 0 #310305,
        0 13px 20px rgba(0,0,0,.34) !important;
    text-align: center !important;
    cursor: pointer !important;
    touch-action: manipulation !important;
}

.snf-af__hike-button[hidden] {
    display: none !important;
}

.snf-af__hike-button:disabled {
    opacity: .58 !important;
    filter: grayscale(.18) brightness(.82) !important;
    cursor: default !important;
}

.snf-af__hike-button:not(:disabled):active {
    transform: translate(-50%, calc(-50% + 4px)) !important;
    box-shadow:
        0 0 0 5px #090203,
        0 0 0 8px #7b111a,
        inset 0 3px 2px rgba(255,255,255,.15),
        inset 0 -5px 10px rgba(48,0,4,.28),
        0 3px 0 #310305,
        0 7px 12px rgba(0,0,0,.28) !important;
}

.snf-af__hike-button > span {
    display: block !important;
    font-size: clamp(18px, 4.7vw, 27px) !important;
    line-height: .95 !important;
    font-weight: 1000 !important;
    letter-spacing: .08em !important;
}

.snf-af__hike-button > small {
    display: block !important;
    max-width: 150px !important;
    margin-top: 5px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: rgba(255,244,208,.82) !important;
    font-size: clamp(6px, 1.55vw, 9px) !important;
    font-weight: 900 !important;
    letter-spacing: .05em !important;
    text-transform: uppercase !important;
}

@media (orientation: landscape) and (max-height: 540px) {
    .snf-af__hike-button {
        top: 28% !important;
        width: clamp(112px, 26%, 160px) !important;
        min-height: 54px !important;
    }
}

/* v0.11.3: pre-snap route teaching aid. ROUTES sits beside HIKE and never
   pauses the drive clock; it only toggles a canvas route diagram while set. */
.snf-af__snap-actions {
    position: absolute !important;
    z-index: 8 !important;
    left: 50% !important;
    top: 27% !important;
    width: min(88%, 330px) !important;
    transform: translate(-50%, -50%) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: clamp(11px, 3vw, 20px) !important;
    pointer-events: none !important;
}

.snf-af__snap-actions > button {
    pointer-events: auto !important;
}

.snf-af__snap-actions .snf-af__hike-button {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    flex: 0 1 176px !important;
}

.snf-af__snap-actions .snf-af__hike-button:not(:disabled):active {
    transform: translateY(4px) !important;
}

.snf-af__routes-button {
    position: relative !important;
    display: flex !important;
    flex: 0 0 clamp(78px, 22vw, 104px) !important;
    min-height: clamp(48px, 12vw, 62px) !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 7px 9px !important;
    border: 2px solid #e4bd70 !important;
    border-radius: 14px !important;
    color: #fff6dc !important;
    background: linear-gradient(180deg, #30220d 0%, #171009 100%) !important;
    box-shadow: 0 0 0 3px #090203, inset 0 1px 0 rgba(255,255,255,.14), 0 5px 0 #080402 !important;
    text-align: center !important;
    cursor: pointer !important;
    touch-action: manipulation !important;
}

.snf-af__routes-button[hidden] { display: none !important; }
.snf-af__routes-button:disabled { opacity: .50 !important; cursor: default !important; }
.snf-af__routes-button:not(:disabled):active { transform: translateY(3px) !important; box-shadow: 0 0 0 3px #090203, inset 0 1px 0 rgba(255,255,255,.12), 0 2px 0 #080402 !important; }
.snf-af__routes-button.is-active {
    color: #1b1003 !important;
    background: linear-gradient(180deg, #f0d18b 0%, #c8963f 100%) !important;
    border-color: #fff1bf !important;
}
.snf-af__routes-button > span { font-size: clamp(12px, 3.1vw, 17px) !important; line-height: 1 !important; font-weight: 1000 !important; letter-spacing: .055em !important; }
.snf-af__routes-button > small { margin-top: 4px !important; font-size: clamp(6px, 1.55vw, 9px) !important; font-weight: 900 !important; letter-spacing: .06em !important; color: rgba(255,244,208,.78) !important; }
.snf-af__routes-button.is-active > small { color: rgba(35,20,3,.72) !important; }

@media (orientation: landscape) and (max-height: 540px) {
    .snf-af__snap-actions { top: 28% !important; width: min(72%, 300px) !important; }
    .snf-af__routes-button { min-height: 46px !important; }
}

/* v0.12.0 unified Arcade Football mode menu + Season Mode */
.snf-af__appbar-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 3px 8px;
    border: 1px solid #e1bd6c;
    border-radius: 7px;
    color: #fff3cf !important;
    background: linear-gradient(180deg, #b5121b, #69080e);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 2px 0 #390407;
    font: 900 10px/1 Arial, sans-serif;
    letter-spacing: .05em;
    text-decoration: none !important;
}
.snf-af__appbar-link:active { transform: translateY(1px); }

.snf-af--mode-menu .snf-af__screen { display: flex !important; align-items: center; justify-content: center; padding: 14px; }
.snf-af__mode-screen { background: radial-gradient(circle at 50% 22%, rgba(196,12,29,.23), transparent 42%), linear-gradient(180deg,#16080a,#040202 72%) !important; }
.snf-af__mode-menu-inner { position: relative; z-index: 3; width: min(96%, 760px); max-height: 100%; overflow-y: auto; text-align: center; color: #f8edcf; padding: clamp(12px,3vw,28px); }
.snf-af__mode-menu-inner h2 { margin: 4px 0 2px; color: #fff4d5; font: 1000 clamp(34px,7vw,70px)/.95 Impact,Haettenschweiler,"Arial Narrow Bold",sans-serif; letter-spacing:.035em; text-shadow:0 3px 0 #71070e; }
.snf-af__mode-menu-inner > p { margin: 7px 0 18px; color:#d9c9a7; font:700 clamp(11px,2vw,15px)/1.3 Arial,sans-serif; }
.snf-af__mode-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(9px,2vw,16px); }
.snf-af__mode-card { display:flex; min-width:0; min-height:190px; flex-direction:column; align-items:flex-start; padding:clamp(13px,2.3vw,20px); border:2px solid rgba(224,181,92,.74); border-radius:17px; color:#fff1c9 !important; background:linear-gradient(180deg,rgba(52,17,17,.95),rgba(16,6,7,.97)); box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 8px 22px rgba(0,0,0,.28); text-align:left; text-decoration:none !important; }
.snf-af__mode-card small { color:#d7a84f; font:900 10px/1 Arial,sans-serif; letter-spacing:.12em; }
.snf-af__mode-card strong { margin:7px 0 8px; font:1000 clamp(22px,3.4vw,34px)/.96 Impact,Haettenschweiler,"Arial Narrow Bold",sans-serif; letter-spacing:.035em; }
.snf-af__mode-card span { flex:1; color:#d9cfb9; font:700 clamp(10px,1.5vw,13px)/1.34 Arial,sans-serif; }
.snf-af__mode-card b { display:inline-flex; margin-top:13px; min-height:36px; align-items:center; padding:0 12px; border-radius:9px; color:#1c0d02; background:linear-gradient(180deg,#f1d28c,#c6953d); font:1000 10px/1 Arial,sans-serif; letter-spacing:.06em; }
.snf-af__mode-card--season { border-color:#e4bd70; background:linear-gradient(180deg,rgba(91,12,17,.96),rgba(22,6,7,.98)); }
@media (max-width:680px) { .snf-af__mode-grid { grid-template-columns:1fr; } .snf-af__mode-card { min-height:120px; } .snf-af__mode-menu-inner { padding:10px 5px; } }

.snf-af--season .snf-af__panel--intro { width:min(96%,760px); }
.snf-af-season { width:100%; color:#f7ebcc; }
.snf-af-season h2 { margin:5px 0 9px; }
.snf-af-season__headline { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; text-align:left; }
.snf-af-season__headline h2 { margin-bottom:0; }
.snf-af-season__headline > strong { flex:0 0 auto; color:#f0cf7b; font:1000 clamp(34px,7vw,60px)/.9 Impact,Haettenschweiler,"Arial Narrow Bold",sans-serif; }
.snf-af-season__matchup { margin:13px 0 11px; padding:13px 15px; border:1px solid rgba(224,181,92,.65); border-radius:14px; background:linear-gradient(180deg,rgba(95,10,17,.72),rgba(30,7,9,.72)); text-align:left; }
.snf-af-season__matchup small { display:block; color:#d8a64d; font:900 10px/1 Arial,sans-serif; letter-spacing:.1em; }
.snf-af-season__matchup strong { display:block; margin:5px 0 4px; color:#fff4d4; font:1000 clamp(24px,5vw,42px)/1 Impact,Haettenschweiler,"Arial Narrow Bold",sans-serif; letter-spacing:.035em; }
.snf-af-season__matchup span { color:#d9ccb0; font:700 11px/1.25 Arial,sans-serif; }
.snf-af-season__division { margin:10px 0; padding:9px 11px; border-radius:12px; background:rgba(0,0,0,.24); }
.snf-af-season__division h3,.snf-af-season__standings h3,.snf-af-season__history h3 { margin:0 0 6px; color:#d8a64d; font:900 10px/1 Arial,sans-serif; letter-spacing:.1em; }
.snf-af-season__standing-row { display:grid; grid-template-columns:22px minmax(0,1fr) auto; gap:8px; align-items:center; min-height:24px; padding:3px 5px; border-top:1px solid rgba(255,255,255,.06); color:#dcd2bd; font:800 11px/1 Arial,sans-serif; }
.snf-af-season__standing-row.is-sf { color:#fff4d4; background:rgba(181,18,27,.24); border-radius:5px; }
.snf-af-season__standing-row > span { opacity:.55; } .snf-af-season__standing-row > b { color:#f0cf7b; }
.snf-af-season__actions { margin-top:10px !important; }
.snf-af-season__standings { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; max-height:min(52vh,430px); overflow-y:auto; margin:8px 0 12px; text-align:left; }
.snf-af-season__standings section { padding:9px; border-radius:10px; background:rgba(0,0,0,.25); }
.snf-af-season__schedule { max-height:min(52vh,430px); overflow-y:auto; margin:8px 0 11px; text-align:left; }
.snf-af-season__schedule-row { display:grid; grid-template-columns:38px minmax(0,1fr) 42px; gap:8px; align-items:center; min-height:30px; padding:4px 8px; border-bottom:1px solid rgba(255,255,255,.07); color:#d8ceb8; font:800 11px/1 Arial,sans-serif; }
.snf-af-season__schedule-row.is-current { color:#fff2cb; background:rgba(181,18,27,.25); }
.snf-af-season__schedule-row b { text-align:right; color:#f0cf7b; }
.snf-af-season__schedule-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; }
.snf-af__danger-button { color:#fff !important; border-color:#d66 !important; background:linear-gradient(180deg,#801117,#43070a) !important; }
.snf-af-season__history { margin:12px auto; max-width:430px; padding:10px; border-radius:11px; background:rgba(0,0,0,.25); text-align:left; }
.snf-af-season__history-row { display:flex; justify-content:space-between; gap:12px; padding:5px 3px; border-top:1px solid rgba(255,255,255,.06); color:#d9cfb9; font:800 11px/1.2 Arial,sans-serif; }
.snf-af-season__history-row strong { color:#f0cf7b; }
.snf-af-season__postgame { z-index:45 !important; }
@media (max-width:560px) { .snf-af-season__standings { grid-template-columns:1fr; } .snf-af-season__headline { align-items:center; } .snf-af-season__headline > strong { font-size:34px; } }

/* v0.12.1 — Season hub / leaderboard polish */
.snf-af-season__headline-stats {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 5px;
}
.snf-af-season__headline-stats > strong {
    color: #f0cf7b;
    font: 1000 clamp(34px,7vw,60px)/.9 Impact,Haettenschweiler,"Arial Narrow Bold",sans-serif;
}
.snf-af-season__headline-stats > span {
    color: #cfa95a;
    font: 900 8px/1 Arial,sans-serif;
    letter-spacing: .09em;
    white-space: nowrap;
}
.snf-af-season__headline-stats > span b { color:#fff0c4; font-size:10px; }

.snf-af-season__actions {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:11px;
}
.snf-af-season__actions button {
    width:100%;
    min-width:0;
    min-height:46px;
    padding:7px 8px;
    font-size:clamp(15px,3.7vw,21px);
    white-space:normal;
    line-height:1;
}
.snf-af-season__actions .snf-af-season__play-button { grid-column:1 / -1; }
.snf-af-season__actions .snf-af-season__top10-button { grid-column:1 / -1; min-height:40px; font-size:clamp(13px,3.2vw,18px); }

.snf-af-season__score-rule {
    max-width:520px;
    margin:7px auto 11px;
    color:#d6c8aa;
    font:700 clamp(10px,2.4vw,13px)/1.35 Arial,sans-serif;
}
.snf-af-season__leaderboard { margin:10px auto 13px; max-width:520px; }
.snf-af-season__leaderboard ol { grid-template-columns:1fr; gap:2px; }
.snf-af-season__leaderboard li {
    display:grid;
    grid-template-columns:28px minmax(0,1fr) auto;
    align-items:center;
    gap:8px;
    padding:5px 7px;
}
.snf-af-season__leaderboard li > div { min-width:0; display:flex; flex-direction:column; gap:2px; text-align:left; }
.snf-af-season__leaderboard li > div strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.snf-af-season__leaderboard li > div small { color:#a9997c; font:800 8px/1.1 Arial,sans-serif; letter-spacing:.035em; }
.snf-af-season__leaderboard li > b { color:#f0cf7b; }
.snf-af-season__leaderboard-empty { display:block !important; color:#bbaa8d; text-align:center !important; padding:13px !important; }

.snf-af-season__complete-score {
    display:inline-flex;
    align-items:baseline;
    gap:8px;
    margin:3px auto 5px;
    padding:7px 11px;
    border:1px solid rgba(224,181,92,.32);
    border-radius:10px;
    background:rgba(0,0,0,.2);
}
.snf-af-season__complete-score span { color:#cda557; font:900 8px/1 Arial,sans-serif; letter-spacing:.1em; }
.snf-af-season__complete-score strong { color:#fff0c5; font:1000 18px/1 Impact,Haettenschweiler,"Arial Narrow Bold",sans-serif; }
.snf-af-season__complete-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:10px; }
.snf-af-season__complete-actions button { min-height:45px; }

.snf-af__mode-leaderboards,
.snf-af__menu-back-button {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:42px;
    margin:14px auto 0;
    padding:8px 16px;
    border:2px solid #deb65f;
    border-radius:10px;
    color:#f7e4b5 !important;
    background:linear-gradient(180deg,#4a2426,#211012);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 4px 0 #100506;
    font:1000 clamp(14px,3vw,20px)/1 Impact,Haettenschweiler,"Arial Narrow Bold",sans-serif;
    letter-spacing:.045em;
    text-decoration:none !important;
}
.snf-af__leaderboard-hub { width:min(94%,620px); margin:auto; padding:clamp(12px,2.4vw,22px); text-align:center; }
.snf-af__leaderboard-hub h2 { margin:5px 0 10px; }
.snf-af__leaderboard-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; margin:9px auto 10px; }
.snf-af__leaderboard-tabs a {
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:38px;
    padding:6px 5px;
    border:1px solid rgba(224,181,92,.55);
    border-radius:8px;
    color:#c9b78f !important;
    background:rgba(20,8,9,.72);
    font:900 clamp(10px,2.4vw,13px)/1 Arial,sans-serif;
    text-decoration:none !important;
}
.snf-af__leaderboard-tabs a.is-active { color:#fff0bf !important; background:rgba(145,15,23,.66); border-color:#e1bb69; }
.snf-af__leaderboard-note { margin:6px auto 10px; max-width:500px; color:#cbbda0; font:700 clamp(9px,2.2vw,12px)/1.35 Arial,sans-serif; }
.snf-af__leaderboard--hub { margin:7px auto 10px; max-width:520px; }
.snf-af__leaderboard--hub ol { grid-template-columns:1fr; gap:2px; }
.snf-af__leaderboard--hub li { grid-template-columns:28px minmax(0,1fr) auto; padding:5px 7px; }
.snf-af__leaderboard--hub li > div { min-width:0; display:flex; flex-direction:column; gap:2px; text-align:left; }
.snf-af__leaderboard--hub li > div strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.snf-af__leaderboard--hub li > div small { color:#9f927b; font:800 8px/1.1 Arial,sans-serif; }
.snf-af__leaderboard--hub li > b { color:#f0cf7b; }
.snf-af__leaderboard--hub .snf-af__leaderboard-empty { display:block; text-align:center; color:#aa9d83; }

@media (max-width:560px) {
    .snf-af-season__headline { align-items:flex-start; }
    .snf-af-season__headline-stats > strong { font-size:34px; }
    .snf-af-season__actions { gap:6px; }
    .snf-af-season__actions button { min-height:42px; }
    .snf-af-season__complete-actions { display:grid; grid-template-columns:1fr; }
    .snf-af__mode-leaderboards { width:min(88%,310px); }
}


/* v0.12.2 — keep the playable field completely clear of informational HUD.
   Transient play/result copy temporarily takes over the scoreboard strip instead
   of covering deep routes, and the Pocket rail has been retired. */
.snf-af__hud > .snf-af__message {
    position: absolute !important;
    z-index: 20 !important;
    inset: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: none !important;
    padding: 3px 10px !important;
    transform: none !important;
    color: #fff3cf !important;
    background: linear-gradient(180deg, rgba(68,7,11,.98), rgba(19,3,4,.98)) !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(214,168,75,.72) !important;
    font-size: clamp(11px, 2.7vw, 20px) !important;
    line-height: 1.05 !important;
    letter-spacing: .045em !important;
    text-align: center !important;
    text-shadow: 0 2px 0 rgba(62,0,0,.8) !important;
    white-space: normal !important;
    pointer-events: none !important;
    opacity: 0;
    transition: opacity .10s ease !important;
}

.snf-af__hud > .snf-af__message.is-visible {
    opacity: 1 !important;
    transform: none !important;
}

.snf-af__field-wrap > .snf-af__pressure,
.snf-af__field-wrap > .snf-af-po__round-badge {
    display: none !important;
}

@media (max-width: 620px) {
    .snf-af__hud > .snf-af__message {
        padding-inline: 7px !important;
        font-size: clamp(10px, 3vw, 14px) !important;
        letter-spacing: .025em !important;
    }
}