.btn {
    position: relative; overflow: hidden;
    transition: transform .18s var(--ease), filter .18s, box-shadow .25s, background .18s;
}
.btn-acc, .btn-green, .btn-gold {
    box-shadow: var(--acc-sh), inset 0 1px 0 rgba(255,255,255,.22), inset 0 -1px 0 rgba(0,0,0,.18);
}
.btn-green { box-shadow: 0 16px 34px -14px rgba(54,216,154,.9), inset 0 1px 0 rgba(255,255,255,.3), inset 0 -1px 0 rgba(0,0,0,.14); }
.btn-gold  { box-shadow: 0 16px 34px -14px rgba(247,201,75,.9), inset 0 1px 0 rgba(255,255,255,.4), inset 0 -1px 0 rgba(0,0,0,.14); }
.btn-acc:hover, .btn-green:hover, .btn-gold:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(1px) scale(.985); }

.btn-acc::after, .btn-green::after, .btn-gold::after {
    content: ''; position: absolute; top: 0; bottom: 0; width: 36%; pointer-events: none;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.22), transparent);
    transform: translateX(-160%); transition: transform .7s var(--ease);
}
.btn-acc:hover::after, .btn-green:hover::after, .btn-gold:hover::after { transform: translateX(320%); }

.btn-soft, .btn-ghost { transition: transform .18s var(--ease), background .18s, border-color .18s; }
.btn-soft:hover, .btn-ghost:hover { transform: translateY(-1px); }

.ibtn { transition: transform .18s var(--ease), background .18s, color .18s; }
.ibtn:active { transform: scale(.94); }

.quick-row, .risk-row, .target-grid, .format-row {
    padding: 4px; border-radius: var(--r-sm);
    background: rgba(255,255,255,.03); border: 1px solid var(--line);
    gap: 4px;
}
.quick-row button, .risk-row button, .target-grid button {
    border: 0; background: transparent; color: var(--muted);
    border-radius: var(--r-2xs); min-height: 38px;
    transition: color .18s, background .18s, transform .18s var(--ease), box-shadow .25s;
}
.quick-row button:hover, .risk-row button:hover, .target-grid button:hover { color: var(--text); background: rgba(255,255,255,.05); }
.quick-row button:active, .risk-row button:active, .target-grid button:active { transform: scale(.96); }
.quick-row button.on, .risk-row button.on, .target-grid button.on {
    color: #fff; background: var(--acc-grad); border: 0;
    box-shadow: 0 8px 18px -10px rgba(77,141,255,.95), inset 0 1px 0 rgba(255,255,255,.22);
}
.risk-row button.on { background: var(--gold-grad); color: var(--gold-ink); box-shadow: 0 8px 18px -10px rgba(247,201,75,.9), inset 0 1px 0 rgba(255,255,255,.35); }
.format-row .f { border: 0; background: transparent; transition: background .18s, transform .18s var(--ease); }
.format-row .f:hover { background: rgba(255,255,255,.05); }
.format-row .f.on {
    background: linear-gradient(160deg, rgba(111,134,255,.3), rgba(111,134,255,.14));
    border: 0; box-shadow: inset 0 0 0 1px rgba(111,134,255,.45);
}

.field { transition: border-color .18s, background .18s; }
.field:focus-within { border-color: var(--acc-line-2); background: var(--surface-3); }
.field .step { transition: transform .18s var(--ease), background .18s, color .18s; }
.field .step:hover { color: #fff; background: rgba(255,255,255,.1); }
.field .step:active { transform: scale(.9); }
.field .step.plus:hover { background: rgba(77,141,255,.36); }

.range-wrap { padding: 2px 0 0; }
.range {
    -webkit-appearance: none; appearance: none; width: 100%; height: 34px; background: none; cursor: pointer;
}
.range::-webkit-slider-runnable-track {
    height: 8px; border-radius: 999px;
    background: linear-gradient(90deg, var(--acc) 0 var(--p, 50%), rgba(255,255,255,.08) var(--p, 50%) 100%);
}
.range::-moz-range-track { height: 8px; border-radius: 999px; background: rgba(255,255,255,.08); }
.range::-moz-range-progress { height: 8px; border-radius: 999px; background: var(--acc); }
.range::-webkit-slider-thumb {
    -webkit-appearance: none; width: 24px; height: 24px; margin-top: -8px; border-radius: 50%;
    background: #fff; border: 5px solid var(--acc);
    box-shadow: 0 6px 16px -4px rgba(77,141,255,.9); transition: transform .15s var(--ease);
}
.range::-moz-range-thumb {
    width: 24px; height: 24px; border-radius: 50%; background: #fff; border: 5px solid var(--acc);
    box-shadow: 0 6px 16px -4px rgba(77,141,255,.9);
}
.range:active::-webkit-slider-thumb { transform: scale(1.15); }
.range-marks { display: flex; justify-content: space-between; color: var(--faint-2); font-size: 10px; font-weight: 800; margin-top: -2px; }

.mult-strip {
    display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none;

    padding: 9px 2px 15px;
}
.mult-strip::-webkit-scrollbar { display: none; }
.mult-strip span {
    flex: none; min-width: 52px; padding: 7px 10px; border-radius: var(--r-2xs); text-align: center;
    font-size: 11px; font-weight: 800; font-variant-numeric: tabular-nums;
    color: var(--faint); background: rgba(255,255,255,.035); border: 1px solid var(--line);
    transition: .25s var(--ease);
}
.mult-strip span.done { color: var(--mint); background: rgba(54,216,154,.12); border-color: rgba(54,216,154,.26); }
.mult-strip span.next {
    color: #fff; background: var(--acc-soft-2); border-color: var(--acc-line-2);
}

.mines-grid .cell { position: relative; will-change: transform; }
.mines-grid .cell::before {
    content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
    background: radial-gradient(circle at 50% 30%, rgba(255,255,255,.14), transparent 60%);
    opacity: 0; transition: opacity .2s;
}
.mines-grid .cell:hover::before { opacity: 1; }
.mines-grid .cell:active { transform: scale(.94); }
.mines-grid .cell.open { animation: cellPop .38s var(--ease); }
@keyframes cellPop {
    0%   { transform: scale(.86); }
    55%  { transform: scale(1.06); }
    100% { transform: scale(1); }
}

.metric b.bump, .dock .v.bump { animation: bump .4s var(--ease); }
@keyframes bump { 0% { transform: scale(1); } 40% { transform: scale(1.09); } 100% { transform: scale(1); } }

.fish-fields .f { position: relative; overflow: hidden; }
.fish-fields .f:active { transform: scale(.97); }
.fish-fields .f.placed::after {
    content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
    background: radial-gradient(circle at 50% 50%, rgba(255,255,255,.55), transparent 62%);
    animation: placePulse .5s var(--ease) forwards;
}
@keyframes placePulse { from { opacity: .9; transform: scale(.4); } to { opacity: 0; transform: scale(1.3); } }

.keno-grid button:active { transform: scale(.93); }
.keno-grid button.on { animation: cellPop .32s var(--ease); }
.case-cards .c:active, .chips .c:active { transform: scale(.95); }
.bubble-field .cur { transition: transform .2s var(--ease); }
.dice-face .roll { transition: color .25s; }

.dock { display: none; }

@media (max-width: 760px) {
    .dock { position: fixed; z-index: 35; animation: dockIn .4s var(--ease); }
    @keyframes dockIn { from { opacity: 0; transform: translateY(14px); } }
    .dock .k { display: block; color: var(--faint); font-size: 8.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
    .dock .v { display: block; font-size: 16px; font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1.15; }
    .dock .v.gold { color: var(--gold-text); }
    .dock .v.green { color: var(--green); }
    .dock .info { min-width: 0; flex: 0 1 auto; }
    .dock .chips .c { width: 40px; height: 40px; border-width: 2px; font-size: 11px; }

    body.has-dock .round-acts .btn-green,
    body.has-dock [data-dock-hide] { display: none !important; }
    body.has-dock .round-acts .btn-soft { flex: 1 1 auto; }
}

@media (max-width: 760px) {
    :root { --pad-x: 14px; }

    .screen { padding: 12px var(--pad-x) 0; }

    .screen.home, .g-screen, .p-screen { gap: 12px; align-items: stretch; }
    .col { gap: 12px; min-width: 0; }
    .g-screen > *, .screen.home > *, .p-screen > * { min-width: 0; max-width: 100%; }

    .card, .card.lg { padding: 14px; }
    .card > h3, .card.lg > h3, .card-h h3 { font-size: 14px; margin-bottom: 11px; }
    .card-h { margin-bottom: 11px; }

    .topbar { padding: 7px var(--pad-x); gap: 6px; }
    .topbar .title { font-size: 14.5px; }
    .topbar .sub { font-size: 10px; }
    .ibtn { width: 36px; height: 36px; }
    .balance { min-height: 36px; padding: 0 11px; border-radius: 12px; }
    .balance b { font-size: 11.5px; }

    .botnav { min-height: 58px; left: 10px; right: 10px; bottom: 10px; padding: 5px; border-radius: var(--r-md); }
    .botnav a { font-size: 8.5px; gap: 3px; }
    .botnav a svg { width: 18px; height: 18px; }
    .botnav a.mid span { width: 46px; height: 46px; font-size: 21px; border-width: 4px; }
    .botnav a.mid { transform: translateY(-12px); }
    .app { padding-bottom: 82px; }

    .stage { padding: 10px; border-radius: var(--r); }
    .stage .fair { margin-top: 10px; padding: 10px 12px; }
    .stage .fair span { font-size: 10.5px; }

    .mines-grid { gap: 6px; }
    .mines-grid .cell { border-radius: 12px; font-size: 20px; }

    .metrics { gap: 8px; }
    .metric { padding: 9px 11px; border-radius: 14px; }
    .metric .cap { font-size: 8px; margin-bottom: 3px; }
    .metric b { font-size: 17px; }

    .nudge { padding: 10px 11px; }

    .field { min-height: 46px; }
    .field .step { width: 34px; height: 34px; font-size: 16px; }
    .field .val, .field input { font-size: 16px; }
    .quick-row button, .risk-row button, .target-grid button { min-height: 34px; font-size: 11.5px; }
    .bet-head { margin-bottom: 6px; }
    .bet-head small { font-size: 10px; }
    .cap { font-size: 9px; }

    .keno-grid { grid-template-columns: repeat(5, minmax(0,1fr)); gap: 6px; }
    .keno-grid button { border-radius: 11px; font-size: 13px; aspect-ratio: 1.15; }
    .keno-pay { padding: 11px 13px; border-radius: 14px; }

    .bubble-field { min-height: 250px; border-radius: 16px; }
    .bubble-field .cur { width: 96px; height: 96px; font-size: 18px; }
    .bubble-field .goal-ring { width: 172px; height: 172px; }
    .bubble-hist { margin-bottom: 12px; gap: 5px; }
    .bubble-hist span { padding: 5px 9px; font-size: 10px; }
    .bubble-goal { margin-top: 12px; }

    .dice-face { min-height: 168px; gap: 10px; border-radius: 16px; margin-bottom: 12px; }
    .dice-face .roll { font-size: 40px; }
    .dice-face .bar { width: 100%; }
    .dice-sides { gap: 8px; margin-bottom: 10px; }
    .dice-sides button { min-height: 58px; font-size: 13px; border-radius: 14px; }
    .dice-sides button small { font-size: 10px; }

    .fish-table { border-radius: var(--r); }
    .fish-accept { padding: 11px 13px; border-radius: 15px; }
    .fish-accept .head { margin-bottom: 8px; }
    .fish-accept .head .cd { font-size: 17px; }

    [data-fishing] .empty { min-height: 64px; padding: 12px; }
    .fish-last { padding: 10px 12px; border-radius: 14px; }
    .fish-all { padding: 11px 12px; border-radius: 15px; }

    .case-cards {
        flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none;
        margin: 0 calc(var(--pad-x) * -1); padding: 0 var(--pad-x) 2px; gap: 10px;
    }
    .case-cards::-webkit-scrollbar { display: none; }
    .case-cards .c { flex: 0 0 148px; padding: 11px; border-radius: 16px; }
    .case-cards .c .art { height: 84px; margin-bottom: 9px; }
    .case-cards .c b { font-size: 14px; margin-bottom: 7px; }
    .case-reel .it { width: 86px; padding: 9px; }
    .case-reel .it .art { height: 44px; margin-bottom: 7px; }

    .up-row { gap: 12px; margin-bottom: 14px; }
    .up-box { padding: 12px; border-radius: 16px; }
    .up-box b { font-size: 22px; margin-bottom: 4px; }
    .up-gauge { width: 132px; height: 132px; }
    .up-gauge .in { width: 100px; height: 100px; }
    .up-gauge .in b { font-size: 18px; }
    .up-result { padding: 13px; border-radius: 16px; }
    .stage .brandline { font-size: 14px; margin-bottom: 12px; }

    .slots-grid { gap: 8px; }
    .slot .meta { padding: 8px 9px 10px; }
    .slot .meta b { font-size: 11.5px; }
    .slot .meta small { font-size: 10px; }
    .slots-bar { padding: 10px; gap: 8px; border-radius: 16px; }

    .games { gap: 8px; }
    .quest { padding: 10px 11px; }
    .bonus { padding: 10px; }
    .legal { font-size: 10px; }
}

@media (max-width: 380px) {
    .mines-grid { gap: 5px; }
    .keno-grid { gap: 5px; }
}

@media (min-width: 761px) {
    .card, .stage, .p-hero, .ref-card, .fsp {
        transition: border-color .25s, box-shadow .25s, transform .25s var(--ease);
    }
    .card:hover { border-color: var(--line-2); }
    .stage { box-shadow: 0 30px 70px -40px rgba(0,0,0,.9); }
    .slot:hover .art { transform: scale(1.04); }
    .slot .art { transition: transform .4s var(--ease); }
}

@media (prefers-reduced-motion: reduce) {
    .btn-acc::after, .btn-green::after, .btn-gold::after { display: none; }
}

.case-cards .c .art img, .case-reel .it .art img {
    position: absolute; inset: 0; width: 100%; height: 100%;
    object-fit: cover; display: block;
}
.case-cards .c .art, .case-reel .it .art { position: relative; overflow: hidden; }

.btn, .ibtn, .quick-row button, .risk-row button, .target-grid button,
.format-row .f, .field .step, .mines-grid .cell, .keno-grid button,
.dice-sides button, .chips .c, .case-cards .c, .fish-fields .f,
.mult-strip span, .slot, .game, .botnav a, .dock .btn {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none; user-select: none;
}

@media (max-width: 760px) {

    .app { padding-bottom: calc(82px + env(safe-area-inset-bottom, 0px)); }

    .quick-row button, .risk-row button, .target-grid button { min-height: 42px; font-size: 12.5px; }
    .field .step { width: 38px; height: 38px; }
    .chips .c { width: 44px; height: 44px; }

    .field .val, .field input, .field strong { font-size: 18px !important; }

    .dock .pair .btn.btn-acc { box-shadow: 0 12px 26px -12px rgba(77,141,255,1); }

    .keno-grid button { min-height: 42px; }
}

.s-promo { margin-top: 12px; }
.screen.home .s-promo:first-child { margin-top: 0; }

.keno-grid button.draw {
    color: var(--gold-text); border-color: rgba(247,201,75,.55);
    background: radial-gradient(circle at 50% 30%, rgba(247,201,75,.4), rgba(247,201,75,.1));
    box-shadow: 0 10px 24px -12px rgba(247,201,75,.9);
}
.keno-grid button.hit {
    color: #0a1020; border-color: transparent;
    background: linear-gradient(135deg,#ffe08a,#f0a62c);
    box-shadow: 0 12px 26px -12px rgba(247,201,75,1);
    animation: cellPop .32s var(--ease);
}

.mines-grid.shake { animation: gridShake .5s var(--ease); }
@keyframes gridShake {
    0%, 100% { transform: translateX(0); }
    20% { transform: translateX(-7px); }
    40% { transform: translateX(6px); }
    60% { transform: translateX(-4px); }
    80% { transform: translateX(3px); }
}

@keyframes bubbleBurst {
    0% { transform: scale(1); opacity: 1; }
    45% { transform: scale(1.35); opacity: .9; }
    100% { transform: scale(.2); opacity: 0; }
}

[data-balance].bump { display: inline-block; animation: bump .4s var(--ease); }

.side-promo {
    display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: var(--r-sm);
    border: 1px solid var(--green-line); background: linear-gradient(140deg, rgba(54,216,154,.14), rgba(255,255,255,.02));
    transition: border-color .18s, background .18s, transform .18s var(--ease);
}
.side-promo:hover { transform: translateY(-1px); border-color: rgba(54,216,154,.45); background: linear-gradient(140deg, rgba(54,216,154,.2), rgba(255,255,255,.03)); }
.side-promo .ic { font-size: 17px; line-height: 1; flex: none; }
.side-promo .tx { min-width: 0; flex: 1; }
.side-promo b { display: block; font-size: 12px; font-weight: 800; color: var(--mint); white-space: nowrap; }
.side-promo small { display: block; color: var(--muted); font-size: 10.5px; font-weight: 700; white-space: nowrap; }
.side-promo .go { flex: none; display: flex; color: var(--mint-2); transform: rotate(180deg); }
.app[data-rail="1"] .side-promo { justify-content: center; padding: 10px 0; width: 100%; }
.app[data-rail="1"] .side-promo .tx,
.app[data-rail="1"] .side-promo .go { display: none; }

.games .game { animation: cardIn .42s var(--ease) both; }
@keyframes cardIn { from { opacity: 0; transform: translateY(12px); } }

.drawer { padding: 0; gap: 0; overflow: hidden; }
.drawer .dh { flex: none; height: 60px; padding: 0 10px 0 16px; border-bottom: 1px solid var(--line-soft); }
.drawer .dh-tools { display: flex; align-items: center; gap: 2px; }
.drawer .dh-tools .ibtn.ghost { width: 38px; height: 38px; border: 0; background: transparent; color: var(--muted); border-radius: 11px; }
.drawer .dh-tools .ibtn.ghost.is-on { color: var(--gold); }
.drawer-scroll {
    flex: 1; min-height: 0; overflow-y: auto; padding: 14px 14px 12px;
    display: flex; flex-direction: column; gap: 16px;
}
.drawer .side-foot { border-top: 1px solid var(--line-soft); }

@media (max-width: 1040px) {
    .app[data-rail="1"] { grid-template-columns: minmax(0, 1fr); }
    .rail-tip { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .games .game { animation: none; }
}

@media (max-width: 420px) {
    .topbar { gap: 6px; }
}

@media (max-width: 760px) {

    body.has-dock { --bn-h: 54px; }
    body.has-dock .botnav {
        left: 0; right: 0; bottom: 0; z-index: 36;
        min-height: 0; height: calc(var(--bn-h) + env(safe-area-inset-bottom, 0px));
        padding: 4px 8px calc(4px + env(safe-area-inset-bottom, 0px));
        border: 0; border-top: 1px solid var(--line); border-radius: 0;
        background: #0c1120; box-shadow: none; backdrop-filter: none;
    }
    body.has-dock .botnav a { gap: 2px; font-size: 8.5px; border-radius: 12px; }
    body.has-dock .botnav a svg { width: 18px; height: 18px; }
    body.has-dock .botnav a.mid { transform: none; }
    body.has-dock .botnav a.mid span {
        width: 40px; height: 40px; border: 0; font-size: 20px; animation: none;
        box-shadow: 0 8px 18px -8px rgba(77,141,255,.9);
    }
    body.has-dock .dock { bottom: calc(var(--bn-h) + env(safe-area-inset-bottom, 0px)); padding-bottom: 10px; }
    body.has-dock .app { padding-bottom: calc(var(--dock-h, 128px) + var(--bn-h) + 18px + env(safe-area-inset-bottom, 0px)); }

    .dock {
        display: flex; left: 0; right: 0; bottom: 0; top: auto;
        flex-direction: column; align-items: stretch; gap: 0;
        padding: 0 12px calc(10px + env(safe-area-inset-bottom, 0px));
        border-radius: var(--r-lg) var(--r-lg) 0 0;
        border: 1px solid var(--line-2); border-bottom: 0;
        background: rgba(13,18,29,.92); backdrop-filter: blur(24px);
        box-shadow: 0 -18px 44px rgba(0,0,0,.55);
    }

    .dock.open { background: #0c1120; }

    .dock-grip {
        position: relative; display: flex; align-items: center; gap: 6px;
        width: 100%; min-height: 52px; margin: 14px 0 10px; padding: 5px;
        border: 0; border-radius: 14px; text-align: left; cursor: pointer;
        -webkit-tap-highlight-color: transparent;
        color: var(--dim); font-size: 12px; font-weight: 800;
        background: linear-gradient(180deg, rgba(77,141,255,.16), rgba(77,141,255,.07));
        box-shadow: inset 0 0 0 1px var(--acc-line), inset 0 1px 0 rgba(255,255,255,.12);
        transition: background .18s, box-shadow .18s;
    }
    .dock-grip .bar {
        position: absolute; top: -8px; left: 50%; width: 38px; height: 4px; margin-left: -19px;
        border-radius: 999px; background: rgba(255,255,255,.2);
    }

    .dock-grip .gstep, .dock-grip .gqs {
        height: 42px; display: flex; align-items: center; gap: 2px; padding: 3px;
        border-radius: 12px; background: rgba(0,0,0,.3);
        box-shadow: inset 0 2px 6px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.05);
    }

    .dock-grip .gstep { flex: 1.15 1 0; min-width: 0; }
    .dock-grip .gqs { flex: 1 1 0; min-width: 0; }
    .dock-grip .gqs .gs { flex: 1 1 0; min-width: 0; }
    .dock-grip .gqs:not(:has(.gs:not([hidden]))) { display: none; }
    .dock-grip .gs {
        flex: none; height: 36px; display: grid; place-items: center;
        border: 0; border-radius: 9px; padding: 0;
        font: inherit; font-weight: 800; line-height: 1;
        transition: background .14s, color .14s, transform .12s var(--ease), opacity .18s;
        touch-action: manipulation;
    }

    .dock-grip .gstep .gs {
        width: 34px; color: var(--text); font-size: 18px;
        background: linear-gradient(180deg, #1b2438, #121a29);
        box-shadow: inset 0 1px 0 rgba(255,255,255,.1), inset 0 -2px 0 rgba(0,0,0,.35);
    }
    .dock-grip .gstep .gs:active { transform: translateY(1px); box-shadow: inset 0 2px 6px rgba(0,0,0,.5); }

    .dock-grip .gqs .gs {
        width: 33px; color: var(--dim); font-size: 10.5px; background: transparent;
    }
    .dock-grip .gqs .gs[data-gs="max"] { width: 37px; }
    .dock-grip .gqs .gs[data-gs="half"], .dock-grip .gqs .gs[data-gs="double"] { width: 30px; font-size: 13px; }
    .dock-grip .gqs .gs { position: relative; }
    .dock-grip .gqs .gs:not([hidden]) ~ .gs::before {
        content: ''; position: absolute; left: -1.5px; top: 11px; bottom: 11px; width: 1px;
        background: rgba(255,255,255,.1); pointer-events: none;
    }
    .dock-grip .gqs .gs:active::before, .dock-grip .gqs .gs:active + .gs::before { opacity: 0; }
    .dock-grip .gqs .gs:active { color: #fff; background: var(--acc-grad); transform: scale(.94); }
    .dock-grip .gs:disabled { opacity: .35; pointer-events: none; }
    .dock-grip .gs[hidden] { display: none; }
    .dock-grip .gb { min-width: 0; flex: 1; display: flex; flex-direction: column; align-items: center; line-height: 1.15; }
    .dock-grip .gl { flex: none; color: var(--faint); font-size: 8.5px; letter-spacing: .1em; text-transform: uppercase; }
    .dock-grip .gv {
        max-width: 100%; color: var(--text); font-size: 15px; font-weight: 800;
        font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .dock-grip .gv { display: inline-block; }
    .dock-grip .gv.bump { animation: gvBump .28s var(--ease); }

    .dock-grip .gb { cursor: text; }

    .dock-grip .gv[contenteditable], .dock-rows :is(.dx-chance-row, .bb-target) .field .val:focus {
        min-width: 44px; padding: 0 6px; border-radius: 6px; outline: none; text-overflow: clip; text-align: center;
        background: rgba(77,141,255,.16); box-shadow: inset 0 0 0 1px var(--acc-line-2); caret-color: var(--acc-2);
    }
    .dock-grip.no-val .gstep { background: none; box-shadow: none; padding-left: 6px; }
    @keyframes gvBump { 40% { transform: scale(1.12); color: var(--acc-2); } }
    .dock-grip.no-val { padding-left: 12px; }
    .dock-grip.no-val .gb { align-items: flex-start; }
    .dock-grip.no-val .gl { color: var(--text); font-size: 12.5px; letter-spacing: 0; text-transform: none; }
    .dock-grip .gx {
        flex: none; display: inline-flex; align-items: center; gap: 4px; height: 42px; padding: 0 10px;
        border: 0; border-radius: 12px; color: #fff; background: var(--acc-grad);
        font: inherit; font-size: 11.5px; font-weight: 800; box-shadow: 0 8px 18px -10px rgba(77,141,255,1);
    }
    .dock-grip .gx:active { transform: scale(.96); }

    .dock-grip.no-sheet { cursor: default; }
    .dock-grip.no-sheet .gx, .dock-grip.no-sheet .bar { display: none; }

    @media (max-width: 400px) {
        .dock-grip:not(.no-val) .gx .tx { display: none; }
        .dock-grip:not(.no-val) .gx { padding: 0 11px; }
        .dock-grip:not(.no-val) .gx svg:last-child { display: none; }
        .dock-grip .gv { font-size: 14px; }
    }
    .dock-grip .gx svg { transform: rotate(-90deg); transition: transform .28s var(--ease); }
    .dock.open .dock-grip .gx svg { transform: rotate(90deg); }

    .dock-grip.hint { animation: gripHint 1.9s ease-in-out 3; }
    @keyframes gripHint {
        0%, 100% { box-shadow: inset 0 0 0 1px var(--acc-line), inset 0 1px 0 rgba(255,255,255,.12); }
        50%      { box-shadow: inset 0 0 0 1.5px var(--acc-line-2), inset 0 1px 0 rgba(255,255,255,.2), 0 0 22px -4px rgba(77,141,255,.75); }
    }

    .dock-rows { display: grid; gap: 8px; margin: -2px 0 10px; }
    .dock-rows > * { margin: 0 !important; padding: 0 !important; border: 0 !important; }

    .dock-rows .mb-sec { display: flex; align-items: center; gap: 8px; }
    .dock-rows .mb-h { flex: none; margin: 0; }
    .dock-rows .mb-h .cap { font-size: 9px; letter-spacing: .1em; }
    .dock-rows .mb-h small { display: none; }
    .dock-rows .mb-mines { flex: 1; min-width: 0; display: flex; gap: 6px; margin: 0; }
    .dock-rows .seg {
        flex: 1; min-width: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 2px;
        padding: 3px; border-radius: 12px; background: rgba(0,0,0,.28);
    }
    .dock-rows .seg button {
        height: 32px; border: 0; border-radius: 9px; background: transparent; color: var(--dim);
        font-family: var(--f-display); font-size: 13px; font-weight: 700;
    }
    .dock-rows .seg button.on { color: #fff; background: var(--acc-grad); box-shadow: var(--acc-sh); }
    .dock-rows .mines-num { flex: none; width: 104px; gap: 2px; padding: 3px; margin: 0; border-radius: 12px; }
    .dock-rows .mines-num button { width: 30px; height: 32px; border-radius: 9px; font-size: 16px; }
    .dock-rows .mines-num input { height: 32px; font-size: 15px; }

    .dock-rows .up-target .bet-head { display: none; }
    .dock-rows .target-grid {
        display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 2px;
        width: 100%; margin: 0 !important; padding: 3px; border: 0; border-radius: 12px; background: rgba(0,0,0,.28);
    }
    .dock-rows .target-grid button {
        width: 100%; min-width: 0; min-height: 32px; padding: 0; border-radius: 9px;
        color: var(--dim); background: transparent; box-shadow: none;
        font-family: var(--f-display); font-size: 12.5px; font-weight: 700;
    }
    .dock-rows .target-grid button.on { color: #fff; background: var(--acc-grad); box-shadow: var(--acc-sh); }

    .dock-rows .up-target .up-field { min-height: 40px; margin: 0 0 6px !important; padding: 3px; border-radius: 12px; }
    .dock-rows .up-target .up-field .step { width: 34px; height: 34px; border-radius: 9px; }
    .dock-rows .up-target .up-field .up-val input { font-size: 16px !important; }

    .dock-rows :is(.dx-chance-row, .bb-target) {
        display: flex; align-items: center; gap: 6px; min-height: 52px; padding: 5px !important;
        border-radius: 14px;
        background: linear-gradient(180deg, rgba(77,141,255,.16), rgba(77,141,255,.07));
        box-shadow: inset 0 0 0 1px var(--acc-line), inset 0 1px 0 rgba(255,255,255,.12);
    }
    .dock-rows :is(.dx-chance-row, .bb-target) .bet-head { display: none; }
    .dock-rows :is(.dx-chance-row, .bb-target) .field, .dock-rows :is(.dx-chance-row, .bb-target) .quick-row {
        height: 42px; min-height: 0; display: flex; align-items: center; gap: 2px;
        margin: 0 !important; padding: 3px; border: 0; border-radius: 12px; background: rgba(0,0,0,.3);
        box-shadow: inset 0 2px 6px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.05);
    }
    .dock-rows :is(.dx-chance-row, .bb-target) .field { position: relative; flex: 1.15 1 0; min-width: 0; }
    .dock-rows :is(.dx-chance-row, .bb-target) .field .step {
        flex: none; width: 34px; height: 36px; border: 0; border-radius: 9px; color: var(--text); font-size: 18px;
        background: linear-gradient(180deg, #1b2438, #121a29);
        box-shadow: inset 0 1px 0 rgba(255,255,255,.1), inset 0 -2px 0 rgba(0,0,0,.35);
    }
    .dock-rows :is(.dx-chance-row, .bb-target) .field .step:active { transform: translateY(1px); box-shadow: inset 0 2px 6px rgba(0,0,0,.5); }

    .dock-rows :is(.dx-chance-row, .bb-target) .field .val {
        flex: 0 1 auto; min-width: 0; margin: 11px auto 0; padding: 0 6px; line-height: 1.15;
        font-size: 15px !important; text-align: center; cursor: text; outline: none;
    }
    .dock-rows :is(.dx-chance-row, .bb-target) .field { cursor: text; }
    .dock-rows .dx-chance-row .field::before {
        content: 'Шанс'; position: absolute; top: 7px; left: 0; right: 0; text-align: center; pointer-events: none;
        color: var(--faint); font-size: 8.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
    }
    .dock-rows :is(.dx-chance-row, .bb-target) .quick-row { flex: 1 1 0; min-width: 0; }
    .dock-rows :is(.dx-chance-row, .bb-target) .quick-row button {
        position: relative; flex: 1 1 0; width: auto; min-width: 0; height: 36px; min-height: 0; padding: 0;
        border: 0; border-radius: 9px; color: var(--dim); background: transparent; box-shadow: none;
        font-size: 10.5px; font-weight: 800;
    }
    .dock-rows .dx-chance-row .quick-row [data-cq="half"], .dock-rows .dx-chance-row .quick-row [data-cq="double"] { font-size: 13px; }

    .dock-rows .dx-chance-row .quick-row [data-cq="double"] { font-size: 0; }
    .dock-rows .dx-chance-row .quick-row [data-cq="double"]::after { content: '×2'; font-size: 13px; }
    .dock-rows :is(.dx-chance-row, .bb-target) .quick-row button + button::before {
        content: ''; position: absolute; left: -1.5px; top: 11px; bottom: 11px; width: 1px;
        background: rgba(255,255,255,.1); pointer-events: none;
    }
    .dock-rows :is(.dx-chance-row, .bb-target) .quick-row button:active::before, .dock-rows :is(.dx-chance-row, .bb-target) .quick-row button:active + button::before { opacity: 0; }
    .dock-rows :is(.dx-chance-row, .bb-target) .quick-row button:active { color: #fff; background: var(--acc-grad); transform: scale(.94); }

    .dock-rows .cr-opts { grid-template-columns: 1fr 1fr; gap: 6px; }
    .dock-rows .cr-opt { gap: 6px; padding: 5px 6px 5px 8px; font-size: 10.5px; line-height: 1.15; border-radius: 12px; }
    .dock-rows .cr-opt .sw { width: 30px; height: 18px; }
    .dock-rows .cr-opt .sw i::after { width: 12px; height: 12px; }
    .dock-rows .cr-opt .sw input:checked + i::after { transform: translateX(12px); }
    .dock-rows .cr-opt input[type="text"] { width: 46px; padding: 6px 6px; font-size: 12px; }

    .dock-rows .bb-target .field::before {
        content: 'Цель'; position: absolute; top: 7px; left: 0; right: 0; text-align: center; pointer-events: none;
        color: var(--faint); font-size: 8.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
    }
    .dock-rows .bb-target .quick-row button { font-size: 11.5px; }
    .dock-rows .bb-target .quick-row button.on { color: #fff; background: var(--acc-grad); box-shadow: var(--acc-sh); }
    .dock-rows .bb-target .quick-row button.on::before, .dock-rows .bb-target .quick-row button.on + button::before { opacity: 0; }

    .dock-rows .kn-opts { display: flex; align-items: center; gap: 6px; }
    .dock-rows .kn-opts .bet-head, .dock-rows .kn-opts > .cap { display: none !important; }
    .dock-rows .kn-opts .format-row, .dock-rows .kn-opts .risk-row {
        display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 2px; margin: 0;
        padding: 3px; border: 0; border-radius: 12px; background: rgba(0,0,0,.28);
    }
    .dock-rows .kn-opts .format-row { flex: none; width: 92px; }
    .dock-rows .kn-opts .risk-row { flex: 1; min-width: 0; }
    .dock-rows .kn-opts .format-row .f { height: 32px; min-height: 0; padding: 0; border-radius: 9px; }
    .dock-rows .kn-opts .format-row .f { color: var(--dim); box-shadow: none; }
    .dock-rows .kn-opts .format-row .f b { font-size: 14px; color: inherit; }
    .dock-rows .kn-opts .format-row .f.on { color: #fff; background: var(--acc-grad); box-shadow: var(--acc-sh); }
    .dock-rows .kn-opts .format-row .f small { display: none; }
    .dock-rows .kn-opts .risk-row button { min-width: 0; min-height: 32px; height: 32px; padding: 0; border-radius: 9px; font-size: 11.5px; box-shadow: none; }
    .dock-rows .kn-opts .risk-row button.on { box-shadow: 0 6px 14px -8px rgba(247,201,75,.9), inset 0 1px 0 rgba(255,255,255,.35); }

    .dock-more {
        display: grid; grid-template-rows: 0fr;
        transition: grid-template-rows .32s var(--ease);
    }
    .dock-sheet { min-height: 0; overflow: hidden; }
    .dock.open .dock-more { grid-template-rows: 1fr; }
    .dock-more .m-bet {
        margin: 0 0 10px; max-height: 52vh; overflow-y: auto;
        border-radius: var(--r-md); background: rgba(255,255,255,.035); border-color: var(--line);
    }

    .dock-main {
        display: flex; align-items: center; gap: 10px; padding-bottom: 2px;
    }
    .dock-main .info { min-width: 0; flex: 0 1 auto; padding-left: 2px; }
    .dock-main .btn { flex: 1 1 auto; min-height: 52px; border-radius: var(--r-sm); font-size: 14px; }
    .dock-main .pair { display: flex; gap: 7px; flex: 1 1 auto; }
    .dock-main .pair .btn { flex: 1; min-height: 52px; font-size: 13px; }
    .dock-main .chips { flex: 1; gap: 7px; overflow-x: auto; scrollbar-width: none; padding: 2px 0; }
    .dock-main .chips::-webkit-scrollbar { display: none; }

    .dock-main:has(> .chips:only-child) { padding: 6px 4px 2px; }
    .dock-main:has(> .chips:only-child)::before {
        content: 'Фишка'; flex: none;
        color: var(--faint); font-size: 8.5px; font-weight: 800;
        letter-spacing: .1em; text-transform: uppercase;
    }
    .dock-main > .chips:only-child { justify-content: space-between; overflow: visible; }

    .g-screen .m-stage { order: 2; }
    .g-screen .m-nudge { order: 3; }
    .g-screen .m-bet   { order: 4; }
    .g-screen .m-rail  { order: 5; }

    .dock-more .quick-row button,
    .dock-more .risk-row button,
    .dock-more .target-grid button { min-height: 46px; font-size: 13px; }
    .dock-more .field { min-height: 52px; }
    .dock-more .field .step { width: 40px; height: 40px; }
}

@media (max-width: 380px) {
    .dock { padding: 0 10px calc(8px + env(safe-area-inset-bottom, 0px)); }
    .dock-main { gap: 8px; }
    .dock-main .btn { min-height: 48px; font-size: 13px; }
}

.mult-strip span {
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
    transition: transform .18s var(--ease), background .2s, color .2s, box-shadow .2s;
}
.mult-strip span.next {

    transform: none;
    border-color: var(--acc);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.24),
                0 0 0 1px rgba(77,141,255,.45),
                0 0 10px -2px rgba(77,141,255,.55);
}

.dice-face {
    position: relative; overflow: hidden;
    border: 0; box-shadow: inset 0 0 0 1px var(--line-soft);
    background: radial-gradient(520px 260px at 50% 18%, rgba(77,141,255,.2), transparent 70%),
                linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
}
.dice-face .roll { text-shadow: 0 0 34px rgba(107,160,255,.45); transition: color .2s; }
.dice-face .roll.win  { text-shadow: 0 0 38px rgba(54,216,154,.75); }
.dice-face .roll.lose { text-shadow: 0 0 38px rgba(255,102,133,.7); }
.dice-face .bar { width: 240px; height: 8px; box-shadow: inset 0 1px 3px rgba(0,0,0,.5); }
.dice-sides button {
    border: 0;
    box-shadow: inset 0 1.5px 0 rgba(255,255,255,.1), inset 0 -2px 0 rgba(0,0,0,.35), 0 4px 10px -5px rgba(0,0,0,.7);
    transition: transform .14s var(--ease), box-shadow .2s, color .2s;
}
.dice-sides button:active { transform: translateY(1px) scale(.985); box-shadow: inset 0 2px 6px rgba(0,0,0,.55); }

.keno-grid { gap: 8px; }
.keno-grid button {
    border: 0; color: var(--dim);
    background: linear-gradient(180deg, #2a3550, #1b2437 58%, #141c2c);
    box-shadow: inset 0 1.5px 0 rgba(255,255,255,.12), inset 0 -2px 0 rgba(0,0,0,.4), 0 3px 8px -4px rgba(0,0,0,.7);
    transition: transform .14s var(--ease), box-shadow .2s, color .2s, background .2s;
}
.keno-grid button:hover { color: var(--text); transform: translateY(-2px); }
.keno-grid button:active { transform: translateY(1px) scale(.95); box-shadow: inset 0 2px 6px rgba(0,0,0,.6); }
.keno-grid button.on {
    color: #fff;
    background: radial-gradient(circle at 50% 30%, #7f95ff, #4457d8 70%);
    box-shadow: inset 0 1.5px 0 rgba(255,255,255,.35), 0 10px 24px -10px rgba(111,134,255,.95);
    text-shadow: 0 1px 6px rgba(0,0,0,.45);
}
.keno-grid button.hit {
    color: var(--green-ink);
    background: radial-gradient(circle at 50% 30%, #7ff0c0, #22b47f 70%);
    box-shadow: inset 0 1.5px 0 rgba(255,255,255,.4), 0 10px 24px -10px rgba(54,216,154,.95);
}

.quick-row button, .risk-row button, .target-grid button, .format-row .f {
    box-shadow: inset 0 1px 0 rgba(255,255,255,.07);
    transition: transform .14s var(--ease), background .18s, color .18s, box-shadow .18s;
}
.quick-row button.on, .risk-row button.on, .target-grid button.on, .format-row .f.on {
    box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 8px 18px -10px rgba(77,141,255,.9);
}

.chips .c {
    position: relative; isolation: isolate; border: 0;
    color: #fff; font-weight: 800; letter-spacing: -.02em;
    text-shadow: 0 1px 2px rgba(0,0,0,.55);
    background:
        radial-gradient(circle at 34% 26%, rgba(255,255,255,.42), transparent 52%),
        radial-gradient(circle at 50% 120%, rgba(0,0,0,.38), transparent 60%),
        var(--cc);
    box-shadow: inset 0 1.5px 0 rgba(255,255,255,.45),
                inset 0 -2.5px 0 rgba(0,0,0,.3),
                0 6px 12px -6px rgba(0,0,0,.85);
    filter: saturate(.82) brightness(.9);
    transition: transform .16s var(--ease), box-shadow .2s, filter .2s;
}

.chips .c::before {
    content: ''; position: absolute; inset: 0; border-radius: 50%; z-index: -1;
    background: repeating-conic-gradient(from 15deg, rgba(255,255,255,.9) 0 18deg, transparent 18deg 60deg);
    -webkit-mask: radial-gradient(circle closest-side, transparent 0 66%, #000 67% 97%, transparent 98%);
            mask: radial-gradient(circle closest-side, transparent 0 66%, #000 67% 97%, transparent 98%);
}

.chips .c::after {
    content: ''; position: absolute; inset: 21%; border-radius: 50%; z-index: -1;
    background: radial-gradient(circle at 50% 30%, rgba(255,255,255,.14), rgba(0,0,0,.26) 75%);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.5), inset 0 2px 4px rgba(0,0,0,.35);
    outline: 1px dashed rgba(255,255,255,.4); outline-offset: 1.5px;
}
.chips .c:hover { transform: translateY(-2px); filter: none; }
.chips .c:active { transform: translateY(1px) scale(.94); }

.chips .c.on {
    transform: translateY(-4px); filter: none;
    box-shadow: inset 0 1.5px 0 rgba(255,255,255,.5),
                inset 0 -2.5px 0 rgba(0,0,0,.3),
                0 0 0 2px rgba(255,255,255,.9),
                0 0 18px -2px var(--cc),
                0 12px 18px -8px rgba(0,0,0,.85);
}

@media (max-width: 760px) {

    .stage { padding: 12px; border-radius: var(--r-lg); }
    .mines-grid { gap: 6px; }
    .mines-grid .cell { border-radius: 12px; font-size: 20px; }
    .keno-grid { gap: 5px; }
    .keno-grid button { border-radius: 10px; font-size: 13px; }

    .metrics { gap: 8px; }
    .metric { padding: 10px 12px; border-radius: 14px; }
    .metric .cap { font-size: 8px; margin-bottom: 3px; }
    .metric b { font-size: 17px; }

    .stage .fair { margin-top: 10px; font-size: 10px; }

    .dice-face { min-height: 190px; gap: 12px; }
    .dice-face .roll { font-size: 52px; }
    .dice-face .bar { width: 190px; }
    .dice-sides { gap: 8px; margin-bottom: 12px; }
    .dice-sides button { min-height: 64px; font-size: 13.5px; border-radius: var(--r-sm); }

    body.has-dock .round-acts { flex-direction: column; }
    body.has-dock .round-acts .btn-soft { flex: 1; min-height: 48px; border-radius: var(--r-sm); }
}

.keno-bar {
    display: flex; align-items: center; gap: 10px; margin-bottom: 14px;
    padding: 8px 8px 8px 14px; border-radius: var(--r-sm);
    background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 1px var(--line);
}
.keno-bar .k { min-width: 0; flex: 1; color: var(--faint); font-size: 11px; font-weight: 800; }
.keno-bar .k b { color: var(--text); font-size: 13px; font-variant-numeric: tabular-nums; }
.keno-bar .acts { flex: none; display: flex; gap: 7px; }
.keno-bar button {
    min-height: 38px; padding: 0 14px; border: 0; border-radius: 11px;
    color: var(--dim); font-size: 12px; font-weight: 800;
    background: linear-gradient(180deg, #2a3550, #1b2437);
    box-shadow: inset 0 1.5px 0 rgba(255,255,255,.12), inset 0 -2px 0 rgba(0,0,0,.4);
    transition: transform .14s var(--ease), color .16s, box-shadow .16s;
}
.keno-bar button:hover { color: var(--text); }
.keno-bar button:active { transform: translateY(1px) scale(.97); box-shadow: inset 0 2px 6px rgba(0,0,0,.55); }
.keno-bar button[data-keno-random] { color: var(--lilac); box-shadow: inset 0 1.5px 0 rgba(255,255,255,.16), inset 0 0 0 1px var(--acc-line); }

@media (max-width: 760px) {

    .keno-grid { gap: 5px; }
    .keno-grid button { aspect-ratio: 1.38; border-radius: 10px; font-size: 13px; }
    .keno-bar { margin-bottom: 10px; padding: 7px 7px 7px 12px; gap: 8px; }
    .keno-bar .k { font-size: 10px; }
    .keno-bar .k b { display: block; font-size: 13px; }
    .keno-bar button { min-height: 40px; padding: 0 12px; font-size: 12px; }
    .keno-pay { padding: 11px 13px; border-radius: 13px; }
}
@media (max-width: 380px) {
    .keno-bar { flex-wrap: wrap; }
    .keno-bar .acts { flex: 1; }
    .keno-bar .acts button { flex: 1; }
}

.dice-read { text-align: center; }
.dice-read .cap { display: block; letter-spacing: .14em; margin-bottom: 4px; }
.dice-face .roll { display: block; line-height: 1; }

.dice-track {
    position: relative; width: 100%; height: 62px; margin-top: 16px;
    border-radius: 16px; overflow: hidden;
    background:
        repeating-linear-gradient(90deg, rgba(255,255,255,.05) 0 1px, transparent 1px 10%),
        linear-gradient(180deg, #0c1322, #0a0f1b);
    box-shadow: inset 0 0 0 1px var(--line-2), inset 0 10px 22px -14px #000;
}

.dice-track .zone {
    position: absolute; top: 0; bottom: 0; width: 50%;
    background: linear-gradient(180deg, rgba(54,216,154,.34), rgba(54,216,154,.14));
    box-shadow: inset 0 1px 0 rgba(140,255,210,.35);
    transition: width .25s var(--ease), left .25s var(--ease), right .25s var(--ease), background .3s;
}
.dice-track.is-lose .zone { background: linear-gradient(180deg, rgba(255,102,133,.28), rgba(255,102,133,.1)); box-shadow: inset 0 1px 0 rgba(255,170,190,.3); }

.dice-track .edge {
    position: absolute; top: 0; bottom: 0; width: 2px; margin-left: -1px;
    background: linear-gradient(180deg, rgba(255,255,255,.75), rgba(255,255,255,.25));
    transition: left .25s var(--ease);
}
.dice-track .edge i {
    position: absolute; top: 4px; left: 50%; transform: translateX(-50%);
    padding: 2px 7px; border-radius: 7px; white-space: nowrap;
    background: rgba(10,15,26,.9); color: var(--dim);
    font-size: 9.5px; font-weight: 800; font-style: normal; font-variant-numeric: tabular-nums;
}

.dice-track .pin {
    position: absolute; bottom: 0; top: 0; width: 3px; margin-left: -1.5px; left: 50%;
    background: #fff; opacity: 0; border-radius: 2px;
    box-shadow: 0 0 12px 2px rgba(255,255,255,.55);
}
.dice-track .pin.on { opacity: 1; }
.dice-track.is-win .pin { background: var(--green); box-shadow: 0 0 14px 3px rgba(54,216,154,.75); }
.dice-track.is-lose .pin { background: var(--pink); box-shadow: 0 0 14px 3px rgba(255,102,133,.7); }

.dice-scale {

    width: 100%;
    display: flex; justify-content: space-between; margin-top: 7px; padding: 0 1px;
    color: var(--faint); font-size: 9.5px; font-weight: 800; font-variant-numeric: tabular-nums;
}
.dice-scale i { font-style: normal; }

.keno-grid button,
.mines-grid .cell,
.dice-sides button {
    position: relative;
    background:
        radial-gradient(130% 100% at 50% -20%, rgba(116,160,255,.17), transparent 62%),
        linear-gradient(180deg, #26324e 0%, #1a2336 54%, #121a28 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.18),
                inset 0 0 0 1px rgba(146,178,255,.07),
                inset 0 -3px 0 rgba(0,0,0,.4),
                0 5px 12px -6px rgba(0,0,0,.8);
    transition: transform .12s var(--ease), box-shadow .18s, background .18s, color .18s;
}
.keno-grid button:hover,
.mines-grid .cell:hover,
.dice-sides button:hover {
    transform: translateY(-2px);
    background:
        radial-gradient(130% 100% at 50% -20%, rgba(116,160,255,.27), transparent 62%),
        linear-gradient(180deg, #2b3859 0%, #1d2740 54%, #141d2d 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.24),
                inset 0 0 0 1px rgba(124,180,255,.36),
                inset 0 -3px 0 rgba(0,0,0,.4),
                0 12px 20px -10px rgba(0,0,0,.85),
                0 0 18px -7px rgba(77,141,255,.5);
}
.keno-grid button:hover { color: var(--text); }
.keno-grid button:active,
.mines-grid .cell:active,
.dice-sides button:active {
    transform: translateY(2px);
    box-shadow: inset 0 2px 7px rgba(0,0,0,.6);
}

.mines-grid .cell::after {
    content: ''; position: absolute; width: 26%; aspect-ratio: 1;
    border-radius: 3px; transform: rotate(45deg); pointer-events: none;
    box-shadow: inset 0 0 0 2px rgba(163,194,255,.1);
    transition: box-shadow .2s, opacity .2s;
}
.mines-grid .cell:hover::after { box-shadow: inset 0 0 0 2px rgba(163,194,255,.24); }
.mines-grid .cell.open::after,
.mines-grid .cell.boom::after { opacity: 0; }

.keno-grid button.on {
    color: #fff; border-color: transparent;
    background: linear-gradient(180deg, #6f86ff 0%, #4f66e8 55%, #3d51c8 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.4),
                inset 0 -2px 0 rgba(0,0,0,.28),
                0 0 0 1px rgba(111,134,255,.55),
                0 0 14px -2px rgba(111,134,255,.75);
}
.keno-grid button.hit {
    color: #06231a;
    background: linear-gradient(180deg, #5ff0b8 0%, #2fd598 55%, #18b57e 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.5), 0 0 16px -2px rgba(54,216,154,.85);
}
.keno-grid button.miss { opacity: .45; }

.keno-pay { box-shadow: inset 0 1px 0 rgba(255,255,255,.05); }

@media (prefers-reduced-motion: reduce) {
    .dice-track .zone, .dice-track .edge { transition: none; }
}

.mines-num {
    display: flex; align-items: center; gap: 6px;
    padding: 4px; border-radius: var(--r-xs);
    background: rgba(255,255,255,.04); border: 1px solid var(--line-2);
}
.mines-num button {
    flex: none; width: 38px; height: 38px; border-radius: 11px;
    color: var(--dim); font-size: 18px; font-weight: 800; line-height: 1;
    background: linear-gradient(180deg, #1b2438, #121a29);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.1), inset 0 -2px 0 rgba(0,0,0,.35);
    transition: transform .12s var(--ease), color .18s;
}
.mines-num button:hover { color: #fff; }
.mines-num button:active { transform: translateY(2px); box-shadow: inset 0 2px 6px rgba(0,0,0,.5); }
.mines-num input {
    flex: 1; min-width: 0; height: 38px; text-align: center;
    color: #fff; background: none; border: 0;
    font-family: var(--f-display); font-size: 17px; font-weight: 700;
    font-variant-numeric: tabular-nums;
}
.mines-num input:focus { outline: none; }

.mines-num input::-webkit-outer-spin-button,
.mines-num input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.mines-num input[type=number] { -moz-appearance: textfield; appearance: textfield; }

.topbar {
    padding: 11px var(--pad-x);
    gap: 12px;
    background: linear-gradient(180deg, rgba(10,15,24,.92), rgba(10,15,24,.72));
    backdrop-filter: blur(26px) saturate(140%);
    border-bottom: 1px solid rgba(255,255,255,.06);
}
.topbar .top-right { display: flex; align-items: center; gap: 8px; }

.wallet {
    display: flex; align-items: center; gap: 4px; padding: 4px;
    border-radius: 15px;
    background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.02));
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.08), 0 6px 18px -12px #000;
}
.wallet .tx { display: flex; flex-direction: column; justify-content: center; padding: 0 12px 0 10px; }
.wallet .tx small {
    color: var(--faint); font-size: 8.5px; font-weight: 800;
    letter-spacing: .12em; text-transform: uppercase; line-height: 1;
}
.wallet .tx b {
    font-family: var(--f-display); font-size: 15px; font-weight: 700;
    letter-spacing: -.03em; line-height: 1.25; white-space: nowrap;
}
.wallet .add {
    flex: none; display: flex; align-items: center; gap: 7px;
    height: 38px; padding: 0 14px 0 11px; border-radius: 11px;
    color: #fff; background: var(--acc-grad);
    font-size: 12.5px; font-weight: 800; white-space: nowrap;
    box-shadow: inset 0 1.5px 0 rgba(255,255,255,.28), 0 8px 18px -10px rgba(77,141,255,1);
    transition: filter .18s, transform .12s var(--ease);
}
.wallet .add:hover { filter: brightness(1.08); }
.wallet .add:active { transform: translateY(1px); }

.wallet.compact .add span { display: none; }
.wallet.compact .add { padding: 0; width: 38px; justify-content: center; }

.topbar .ibtn.ghost {
    width: 40px; height: 40px; border-radius: 12px;
    background: transparent; border: 0; color: var(--muted);
    transition: background .18s, color .18s;
}
.topbar .ibtn.ghost:hover { background: rgba(255,255,255,.06); color: #fff; }

.topbar .ibtn.ghost[data-lite].is-on { color: var(--gold-text); background: rgba(247, 201, 75, .1); box-shadow: inset 0 0 0 1px var(--gold-line); }

.topbar .userchip {
    gap: 10px; min-height: 40px; padding: 0 12px 0 4px;
    background: transparent; border: 0; border-radius: 13px;
    transition: background .18s;
}
.topbar .userchip:hover { background: rgba(255,255,255,.06); }
.topbar .userchip .ava {
    position: relative; width: 34px; height: 34px; flex: none;
    display: grid; place-items: center; border-radius: 50%;
    background: conic-gradient(var(--acc) var(--p, 0%), rgba(255,255,255,.12) 0);
}
.topbar .userchip .ava i {
    width: 27px; height: 27px; display: grid; place-items: center; border-radius: 50%;
    color: #fff; background: var(--acc-grad); font-style: normal;
    font-family: var(--f-display); font-size: 13px; font-weight: 800;
}
.topbar .userchip .tx { display: flex; flex-direction: column; line-height: 1.25; }
.topbar .userchip .tx b { font-size: 12.5px; font-weight: 800; }
.topbar .userchip .tx small { color: var(--faint); font-size: 10.5px; font-weight: 700; }

.topbar .userchip.is-load .tx,
.topbar .userchip.is-load .ava { animation: pulseDot 1.4s ease-in-out infinite; }

.topbar .topnav {
    position: relative; display: flex; align-items: center; gap: 2px; min-width: 0;
    padding: 4px; border-radius: 999px;
    background: rgba(255,255,255,.028);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.06);
}
.topbar .topnav .hl {
    position: absolute; top: 4px; bottom: 4px; left: 0; width: 0; border-radius: 999px;
    background: rgba(255,255,255,.055); opacity: 0; pointer-events: none;
    transition: transform .32s cubic-bezier(.3,.8,.25,1), width .32s cubic-bezier(.3,.8,.25,1), opacity .2s;
}
.topbar .topnav.is-hover .hl { opacity: 1; }
.topbar .topnav a {
    position: relative; z-index: 1; display: flex; align-items: center; gap: 7px;
    height: 34px; padding: 0 14px; border-radius: 999px;
    color: #8f99ad; font-size: 13px; font-weight: 700; white-space: nowrap; letter-spacing: -.005em;
    transition: color .2s, background .25s, box-shadow .25s;
}
.topbar .topnav .ic { display: grid; place-items: center; flex: none; opacity: .75; transition: opacity .2s, color .2s; }
.topbar .topnav a:hover { color: #eef1f7; }
.topbar .topnav a:hover .ic { opacity: 1; }
.topbar .topnav a.on {
    color: #fff;
    background:
        radial-gradient(80% 120% at 50% 120%, color-mix(in srgb, var(--tone) 30%, transparent), transparent 70%),
        linear-gradient(180deg, rgba(255,255,255,.1), rgba(255,255,255,.035));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.12),
        inset 0 0 0 1px color-mix(in srgb, var(--tone) 32%, rgba(255,255,255,.06)),
        0 6px 18px -8px color-mix(in srgb, var(--tone) 75%, transparent);
}
.topbar .topnav a.on .ic { opacity: 1; color: var(--tone); filter: drop-shadow(0 0 6px color-mix(in srgb, var(--tone) 60%, transparent)); }
.topbar .topnav a:focus-visible { outline: 2px solid var(--tone); outline-offset: 1px; }
.topbar .topnav .n {
    min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px;
    display: grid; place-items: center;
    background: linear-gradient(180deg, #ff6a85, #f03a5d); color: #fff;
    font-size: 10px; font-weight: 800; line-height: 1;
    box-shadow: 0 2px 8px -2px rgba(255,79,111,.7);
}
.topbar .topnav .pc {
    padding: 2px 7px; border-radius: 999px;
    background: rgba(95,204,255,.1); color: #86daff; font-size: 10.5px; font-weight: 800;
    box-shadow: inset 0 0 0 1px rgba(95,204,255,.18);
}

@media (max-width: 1480px) {
    .topbar .topnav a:not(.on) { padding: 0 10px; }
    .topbar .topnav a:not(.on) > span:not(.n) { display: none; }
    .topbar .topnav a:not(.on) .n { position: absolute; top: 1px; right: 0; min-width: 15px; height: 15px; font-size: 9px; padding: 0 4px; }
}
@media (max-width: 1280px) {
    .topbar .topnav a { padding: 0 10px; }
    .topbar .topnav a > span:not(.n) { display: none; }
    .topbar .topnav .n { position: absolute; top: 1px; right: 0; min-width: 15px; height: 15px; font-size: 9px; padding: 0 4px; }
}
@media (prefers-reduced-motion: reduce) { .topbar .topnav .hl { transition: opacity .2s; } }

@media (min-width: 761px) { .topbar > .title { display: none; } }
@media (max-width: 760px) { .topbar .topnav { display: none; } }
.topbar .top-title { min-width: 0; flex: 1 1 auto; }

.topbar .adm-chip { display: inline-flex; align-items: center; vertical-align: 2px; margin-left: 6px; height: 19px; padding: 0 8px;
    border-radius: 999px; font: 800 9.5px/1 Manrope, sans-serif; letter-spacing: .05em; text-transform: uppercase; color: #1d1405;
    background: linear-gradient(90deg,#ffd76a,#ffab3d); box-shadow: 0 6px 14px -8px rgba(255,171,61,.95); }
.topbar .adm-chip .s { display: none; }
@media (max-width: 760px) { .topbar .adm-chip .l { display: none; } .topbar .adm-chip .s { display: inline; } }

.topbar .day-chip { display: inline-flex; align-items: center; gap: 4px; vertical-align: 2px; margin-left: 6px; height: 19px; padding: 0 8px;
    border-radius: 999px; font: 800 9.5px/1 Manrope, sans-serif; letter-spacing: .05em; text-transform: uppercase; color: #2a1a00; text-decoration: none;
    background: linear-gradient(90deg,#fff1a8,#f7c94b 55%,#f0a62c); box-shadow: 0 6px 14px -8px rgba(247,201,75,.95); }
.topbar .day-chip .s { display: none; }
@media (max-width: 760px) { .topbar .day-chip .l { display: none; } .topbar .day-chip .s { display: inline; } }
.topbar .top-title .title,
.topbar .top-title .sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.topbar .wallet { flex: none; }
.topbar .gicon { border-radius: 13px; }

@media (max-width: 760px) {
    :root { --topbar: 52px; }
    .topbar { min-height: 52px; padding: 7px var(--pad-x); gap: 8px; }
    .topbar .top-right { gap: 4px; }
    .topbar .top-right > .ibtn.ghost,
    .topbar [data-settings] { display: none !important; }
    .topbar .ibtn.ghost.only-sm, .topbar .ibtn.ghost.sm, .topbar .ibtn.ghost.sfx-keep { display: grid !important; width: 36px; height: 36px; border-radius: 10px; }
    .topbar .brand .mark { width: 26px; height: 26px; }
    .topbar .brand .word { height: 20px; }
    .wallet { padding: 3px; border-radius: 12px; }
    .wallet .tx { padding: 0 8px 0 7px; }
    .wallet .tx small { display: none; }
    .wallet .tx b { font-size: 13px; }
    .wallet .add { height: 32px; padding: 0; width: 32px; justify-content: center; border-radius: 9px; }
    .wallet .add span { display: none; }
    .topbar .top-title .sub { display: none; }
    .topbar .top-title .title, .topbar > .title { font-size: 15px; }
    .topbar .gicon { width: 32px; height: 32px; border-radius: 10px; font-size: 14px; }
    .topbar .fair-btn { min-height: 34px; width: 34px; padding: 0; justify-content: center; margin: 0; border-radius: 10px; }
    .topbar .fair-btn span { display: none; }

    .main { overflow-x: clip; }
}

@media (max-width: 420px) {
    .topbar .gicon { display: none; }
    .topbar { gap: 6px; }

    .topbar .top-title .title { font-size: 14px; }
    .topbar .wallet { padding: 2px; }
    .topbar .wallet .tx { padding: 0 6px 0 5px; }
    .topbar .wallet .tx b { font-size: 12.5px; }
    .topbar .wallet .add { width: 32px; height: 32px; }

    .topbar { gap: 4px; padding-left: 10px; padding-right: 10px; }
    .topbar .rules-btn, .topbar .fair-btn { width: 32px; min-width: 32px; min-height: 32px; height: 32px; padding: 0; justify-content: center; }
    .topbar .rules-btn + .fair-btn { margin-left: 0; }
}

@media (max-width: 360px) {
    .fish-fields .f .foot { flex-wrap: wrap; row-gap: 1px; }
    .dock-main > .chips:only-child { flex-wrap: nowrap; gap: 5px; }
    .dock-main > .chips:only-child .c { width: 36px; height: 36px; font-size: 10px; border-width: 2px; }
}

html.is-lite *,
html.is-webview *,
html.is-lite *::before,
html.is-webview *::before,
html.is-lite *::after,
html.is-webview *::after {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

html.is-lite .side,
html.is-webview .side,
html.is-lite .topbar,
html.is-webview .topbar,
html.is-lite .botnav,
html.is-webview .botnav,
html.is-lite .dock,
html.is-webview .dock {
    background: var(--screen) !important;
}
html.is-lite .mdl-bg,
html.is-webview .mdl-bg,
html.is-lite .drawer-bg,
html.is-webview .drawer-bg {
    background: rgba(7, 10, 18, .82) !important;
}

html.is-lite .toast,
html.is-webview .toast {
    background: #111520 !important;
}

html.is-lite .g-scene *,
html.is-webview .g-scene *,
html.is-lite .promo-glow,
html.is-webview .promo-glow,
html.is-lite .h-float, html.is-webview .h-float,
html.is-lite .ticker .e.big::after, html.is-webview .ticker .e.big::after,
html.is-lite .h-spin, html.is-webview .h-spin,
html.is-lite .h-slide::before, html.is-webview .h-slide::before,
html.is-lite .h-chip .dot, html.is-webview .h-chip .dot,
html.is-lite .wm-glow,
html.is-webview .wm-glow,
html.is-lite .wm-rays,
html.is-webview .wm-rays,
html.is-lite .wm-actions .btn-acc::after,
html.is-webview .wm-actions .btn-acc::after,
html.is-lite .g-halo,
html.is-webview .g-halo,
html.is-lite .livedot,
html.is-webview .livedot,
html.is-lite .wb-pill.ok i,
html.is-webview .wb-pill.ok i,
html.is-lite .promo-pill .dot,
html.is-webview .promo-pill .dot,
html.is-lite .fish-accept .head strong:first-child::before,
html.is-webview .fish-accept .head strong:first-child::before,
html.is-lite .fish-stage::before,
html.is-webview .fish-stage::before,
html.is-lite .mario-stage .stars,
html.is-webview .mario-stage .stars,
html.is-lite .mario-stage .sun,
html.is-webview .mario-stage .sun,
html.is-lite .mario-stage .coin,
html.is-webview .mario-stage .coin,
html.is-lite .mario-stage .flag::after,
html.is-webview .mario-stage .flag::after,

html.is-lite .mario-stage .road .hero img[data-f="st"],
html.is-webview .mario-stage .road .hero img[data-f="st"],
html.is-lite .ticker .track,
html.is-webview .ticker .track {
    animation: none !important;
}

html.is-lite .ga--fx-slots .fx-sweep,
html.is-webview .ga--fx-slots .fx-sweep,
html.is-lite .fx-ring,
html.is-webview .fx-ring,
html.is-lite .ga--fx-mario .fx-land,
html.is-webview .ga--fx-mario .fx-land,
html.is-lite .game[data-g="mario"] .g-layer-2,
html.is-webview .game[data-g="mario"] .g-layer-2 {
    display: none !important;
}

html.is-lite .cs-reel.is-fast .strip,
html.is-webview .cs-reel.is-fast .strip { filter: none !important; }

html.is-lite .ticker .track,
html.is-webview .ticker .track { transform: none !important; }

html.is-lite .card,
html.is-webview .card,
html.is-lite .game,
html.is-webview .game,
html.is-lite .slot,
html.is-webview .slot,
html.is-lite .btn,
html.is-webview .btn,
html.is-lite .wb-goal,
html.is-webview .wb-goal {
    transition: none !important;
}
html.is-lite .game:hover,
html.is-webview .game:hover,
html.is-lite .slot:hover,
html.is-webview .slot:hover,
html.is-lite .card:hover,
html.is-webview .card:hover {
    transform: none !important;
}

html.is-lite .card,
html.is-webview .card,
html.is-lite .stage,
html.is-webview .stage,
html.is-lite .mdl,
html.is-webview .mdl,
html.is-lite .p-hero,
html.is-webview .p-hero {
    box-shadow: none !important;
}

.ibtn.is-on {
    color: var(--gold-text);
    border-color: var(--gold-line);
    background: rgba(247, 201, 75, .1);
}

.mb { padding: 0; overflow: hidden; }
.mb .mb-sec { padding: 16px 18px 4px; }
.mb .mb-sec + .mb-sec { border-top: 1px solid var(--line-soft); padding-top: 14px; }
.mb .mb-h { display: flex; align-items: baseline; gap: 10px; margin-bottom: 9px; }
.mb .mb-lim { margin-left: auto; color: var(--faint); font-size: 10.5px; font-weight: 700; }

.mb .mb-bet {
    display: grid; grid-template-columns: auto 1fr; grid-template-areas: 'cur num' 'q q';
    gap: 10px 8px; align-items: center; padding: 12px 14px 10px; margin-bottom: 12px;
    border-radius: var(--r-md); background: rgba(255,255,255,.045);
    box-shadow: inset 0 0 0 1px var(--line-2), inset 0 1px 0 rgba(255,255,255,.05);
}
.mb .mb-bet .cur {
    grid-area: cur; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px;
    background: var(--gold-soft-2); color: var(--gold-text); font-size: 15px; font-weight: 800;
    box-shadow: inset 0 0 0 1px var(--gold-line);
}
.mb .mb-bet .num { grid-area: num; font-family: var(--f-display); font-size: 24px; font-weight: 700; letter-spacing: -.04em; }
.mb .mb-quick { grid-area: q; display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; padding: 3px; border-radius: 11px; background: rgba(0,0,0,.28); margin-bottom: 12px; }
.mb .mb-sec .field { margin-bottom: 8px; }
.mb .mb-quick button {
    height: 30px; border: 0; border-radius: 8px; background: transparent; color: var(--dim);
    font-size: 12px; font-weight: 800; cursor: pointer; transition: background .15s, color .15s;
}
.mb .mb-quick button:hover { color: var(--text); background: rgba(255,255,255,.07); }
.mb .mb-quick button.on { color: var(--text); background: var(--surface-4); }

.mb .mb-mines { display: grid; grid-template-columns: 1fr; gap: 8px; margin-bottom: 14px; }
.mb .seg { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; padding: 3px; border-radius: 12px; background: rgba(0,0,0,.28); }
.mb .seg button {
    height: 36px; border: 0; border-radius: 9px; background: transparent; color: var(--dim);
    font-family: var(--f-display); font-size: 13px; font-weight: 700; cursor: pointer;
    transition: background .15s, color .15s, box-shadow .15s;
}
.mb .seg button:hover { color: var(--text); background: rgba(255,255,255,.06); }
.mb .seg button.on { color: #fff; background: var(--acc-grad); box-shadow: var(--acc-sh); }
.mb .mines-num { margin: 0; }

.mb .mb-metrics { margin: 0 18px 12px; }
.mb .round-acts { padding: 0 18px 18px; }

.mb .mb-cta { position: relative; overflow: hidden; min-height: 54px; font-size: 15px; }
.mb .mb-cta::after {
    content: ''; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%;
    background: linear-gradient(100deg, transparent, rgba(255,255,255,.28), transparent);
    animation: mbShine 3.2s ease-in-out infinite;
}
@keyframes mbShine { 0%, 60% { left: -60%; } 100% { left: 130%; } }
.mb .mb-cta.is-off::after { display: none; }

.mines-grid .cell.open { animation: cellFlip .32s var(--ease); }
@keyframes cellFlip { 0% { transform: rotateY(90deg) scale(.9); } 100% { transform: none; } }
.mines-grid .cell.boom { animation: cellBoom .45s var(--ease); }
@keyframes cellBoom { 0% { transform: scale(.7); } 45% { transform: scale(1.12); } 100% { transform: none; } }
.mines-grid.is-over .cell:not(.open):not(.boom) { opacity: .45; }

.mult-strip { position: relative; }
.mult-strip span { position: relative; z-index: 1; }
.mult-strip span.done { color: var(--mint); background: var(--green-soft-2); border-color: var(--green-line); }
.mult-strip span.next { color: #fff; background: var(--acc-soft-2); border-color: var(--acc-line-2); box-shadow: 0 0 0 3px rgba(77,141,255,.18); }

html.is-lite .mb .mb-cta::after { display: none; }

.m-stage {
    background:
        radial-gradient(120% 70% at 50% -10%, rgba(77,141,255,.22), transparent 60%),
        repeating-linear-gradient(0deg, rgba(255,255,255,.025) 0 1px, transparent 1px 34px),
        repeating-linear-gradient(90deg, rgba(255,255,255,.025) 0 1px, transparent 1px 34px),
        linear-gradient(170deg, #141c2d, #0b1120 70%);
    border-color: rgba(124,180,255,.16);
}
.m-stage .mines-grid { max-width: 560px; margin: 0 auto; gap: 12px; }

.mines-grid .cell {
    border-radius: 18px;
    background:
        radial-gradient(120% 90% at 50% -10%, rgba(140,180,255,.22), transparent 60%),
        linear-gradient(180deg, #2c3a5c 0%, #1c2740 58%, #131b2c 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.22),
                inset 0 0 0 1px rgba(146,178,255,.1),
                inset 0 -4px 0 rgba(0,0,0,.45),
                0 8px 18px -8px rgba(0,0,0,.9);
}

.mines-grid .cell::after {
    width: 30%; border-radius: 4px; box-shadow: none;
    background: linear-gradient(135deg, rgba(190,214,255,.45), rgba(120,160,255,.12) 55%, rgba(255,255,255,.35));
    opacity: .38; transition: opacity .2s, transform .2s;
}
.mines-grid .cell:hover::after { opacity: .9; box-shadow: 0 0 18px rgba(124,180,255,.55); transform: rotate(45deg) scale(1.08); }

.mines-grid .cell.open {
    color: #dfffee; font-size: 30px;
    background:
        radial-gradient(circle at 50% 35%, rgba(111,240,187,.55), rgba(54,216,154,.12) 58%, rgba(14,40,32,.95));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.35),
                inset 0 0 0 1.5px rgba(54,216,154,.6),
                inset 0 -4px 0 rgba(0,0,0,.35),
                0 0 26px -6px rgba(54,216,154,.85);
    text-shadow: 0 0 18px rgba(111,240,187,1);
}

.mines-grid .cell.boom {
    color: #ffd3da; font-size: 28px;
    background: radial-gradient(circle at 50% 35%, rgba(255,102,133,.6), rgba(255,102,133,.14) 60%, rgba(52,14,24,.95));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.3),
                inset 0 0 0 1.5px rgba(255,102,133,.65),
                inset 0 -4px 0 rgba(0,0,0,.35),
                0 0 26px -6px rgba(255,102,133,.9);
}

.mult-strip {
    gap: 8px; padding: 10px 2px 16px;

    -webkit-mask: linear-gradient(90deg, #000 calc(100% - 40px), transparent);
            mask: linear-gradient(90deg, #000 calc(100% - 40px), transparent);
}
.mult-strip span {
    min-width: 62px; padding: 7px 10px 8px; border-radius: 13px;
    display: flex; flex-direction: column; align-items: center; gap: 2px;
    font-family: var(--f-display); font-size: 11.5px; font-weight: 700; letter-spacing: -.02em;
}
.mult-strip span small { font-family: var(--f-text); font-size: 9px; font-weight: 800; letter-spacing: .08em; color: var(--faint-2); }
.mult-strip span.done small, .mult-strip span.next small { color: inherit; opacity: .7; }
.mult-strip span.next { transform: scale(1.06); }

.m-controls .mb {
    background: linear-gradient(170deg, #182238, #10172a 70%);
    border: 1px solid rgba(124,180,255,.14);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 24px 50px -30px rgba(0,0,0,.95);
}
.mb .mb-sec { padding: 18px 18px 6px; }
.mb .mb-bet {
    background: rgba(0,0,0,.28);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.07), inset 0 2px 8px rgba(0,0,0,.4);
}
.mb .mb-bet .num { font-size: 26px; }
.mb .mb-quick { background: rgba(255,255,255,.05); }
.mb .seg { background: rgba(0,0,0,.28); box-shadow: inset 0 2px 8px rgba(0,0,0,.35); }
.mb .seg button { height: 40px; font-size: 14px; }
.mb .mines-num { background: rgba(0,0,0,.2); border-color: rgba(255,255,255,.07); }
.mb .mb-metrics .metric { background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); }
.mb .mb-metrics .metric.gold { background: var(--gold-soft); box-shadow: inset 0 0 0 1px var(--gold-line); }
.mb .mb-cta { min-height: 58px; border-radius: 17px; font-size: 15.5px; letter-spacing: -.01em; }
.mb .mb-cta.btn-acc { box-shadow: var(--acc-sh-lg), inset 0 1px 0 rgba(255,255,255,.25); }
.mb .mb-cta.btn-green { box-shadow: 0 18px 38px -16px rgba(54,216,154,.9), inset 0 1px 0 rgba(255,255,255,.25); }

.m-nudge {
    background: linear-gradient(135deg, rgba(54,216,154,.16), rgba(54,216,154,.05));
    border-color: rgba(54,216,154,.3);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}

.mb .mb-sec + .mb-sec { border-top: 0; padding-top: 4px; }
.mb .mb-h { margin-bottom: 8px; }

.mb .mb-bet {
    grid-template-columns: auto 1fr auto; grid-template-areas: 'cur num q';
    gap: 10px; padding: 8px 8px 8px 10px; border-radius: 14px; min-height: 56px;
}
.mb .mb-bet .cur { width: 36px; height: 36px; border-radius: 10px; }
.mb .mb-bet .num { font-size: 24px; line-height: 1; }
.mb .mb-quick { display: flex; gap: 4px; padding: 0; background: none; }
.mb .mb-quick button {
    height: 36px; padding: 0 11px; border-radius: 10px;
    background: rgba(255,255,255,.07); color: var(--dim); font-size: 11.5px;
}
.mb .mb-quick button:hover { background: rgba(255,255,255,.12); color: #fff; }

.mb .seg { border-radius: 14px; padding: 4px; }
.mb .seg button { height: 40px; border-radius: 10px; }
.mb .mines-num {
    padding: 4px; border-radius: 14px; border: 0;
    background: rgba(0,0,0,.28); box-shadow: inset 0 2px 8px rgba(0,0,0,.35);
}
.mb .mines-num button { width: 40px; height: 40px; border-radius: 10px; }

.mb .mb-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 14px 18px 12px; }
.mb .mb-metrics .metric { min-width: 0; padding: 12px 14px; border-radius: 14px; }
.mb .mb-metrics .metric b { font-size: 18px; overflow: hidden; text-overflow: ellipsis; }

@media (max-width: 400px) {
    .mb .mb-bet { grid-template-columns: auto 1fr; grid-template-areas: 'cur num' 'q q'; }
    .mb .mb-quick button { flex: 1; }
}

.m-stage { position: relative; }
.m-result {
    position: absolute; inset: 0; z-index: 5; display: flex; flex-direction: column;
    align-items: center; justify-content: center; gap: 12px; cursor: pointer;
    background: rgba(8,12,22,.42); backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px);
    border-radius: inherit; opacity: 0; transition: opacity .25s var(--ease);
}
.m-result.on { opacity: 1; }
.m-result .mr-card {
    --tone: var(--green);
    min-width: 240px; padding: 18px 26px; border-radius: 22px; text-align: center;
    background: linear-gradient(170deg, #182238, #10172a);
    border: 1.5px solid var(--tone);
    box-shadow: 0 0 0 6px color-mix(in srgb, var(--tone) 18%, transparent), 0 30px 60px -30px #000;
    transform: scale(.9); transition: transform .3s var(--ease);
}
.m-result.on .mr-card { transform: none; }
.m-result.is-lose .mr-card { --tone: var(--pink); }
.m-result .mr-m { display: block; font-family: var(--f-display); font-size: 26px; font-weight: 700; letter-spacing: -.04em; color: var(--tone); }
.m-result .mr-a { display: block; margin-top: 2px; font-family: var(--f-display); font-size: 20px; font-weight: 700; letter-spacing: -.03em; color: #fff; }
.m-result .mr-card small { display: block; margin-top: 8px; color: var(--faint); font-size: 11px; font-weight: 700; }
.m-result .mr-fair { min-height: 40px; padding: 0 18px; border-radius: 12px; font-size: 12.5px; }

.m-controls .card.lg.mb { padding: 0; }
.mb .mb-sec { padding: 14px 14px 4px; }
.mb .mb-metrics { margin: 12px 14px 10px; }
.mb .round-acts { padding: 0 14px 14px; }

.slots-bar { padding: 10px; border-radius: 22px; }
.slots-bar .search-box { min-height: 50px; border-radius: 16px; }

.slots-chips { display: flex; gap: 7px; margin-bottom: 16px; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
.slots-chips::-webkit-scrollbar { display: none; }
.slots-chips button {
    flex: none; display: inline-flex; align-items: center; gap: 7px; height: 36px; padding: 0 13px;
    border-radius: 999px; border: 1px solid var(--line-2); background: var(--surface);
    color: var(--dim); font-size: 12px; font-weight: 800; cursor: pointer;
    transition: color .15s, background .15s, border-color .15s;
}
.slots-chips button .n { padding: 1px 7px; border-radius: 999px; background: rgba(255,255,255,.08); font-size: 10px; color: var(--faint); }
.slots-chips button:hover { color: var(--text); background: var(--surface-3); }
.slots-chips button.on { color: #fff; background: var(--acc-soft-2); border-color: var(--acc-line-2); }
.slots-chips button.on .n { background: rgba(255,255,255,.18); color: #fff; }

@media (min-width: 1500px) { .slots-grid { grid-template-columns: repeat(5, minmax(0,1fr)); } }
.slots-grid { gap: 14px; }
.slot { border-radius: 20px; background: var(--panel-2); border-color: var(--line); }
.slot:hover { transform: translateY(-4px); border-color: var(--acc-line-2); box-shadow: 0 22px 40px -24px rgba(77,141,255,.7); }
.slot .thumb { aspect-ratio: .92; overflow: hidden; }
.slot .cover { transition: transform .5s var(--ease); }
.slot:hover .cover { transform: scale(1.07); }
.slot .meta { padding: 11px 13px 13px; }
.slot .meta b { display: block; font-size: 13px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.slot .meta small { display: block; margin-top: 2px; color: var(--faint); font-size: 11px; font-weight: 700; }
.slot .fs {
    position: absolute; top: 10px; left: 10px; padding: 4px 9px; border-radius: 999px;
    background: var(--green-grad); color: var(--green-ink); font-size: 10px; font-weight: 800; letter-spacing: .06em;
    box-shadow: 0 8px 16px -8px rgba(54,216,154,.9);
}

.slot .play {
    position: absolute; inset: 0; z-index: 3; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
    background: radial-gradient(60% 60% at 50% 50%, rgba(7,11,18,.55), rgba(7,11,18,.25));
    opacity: 0; transition: opacity .2s var(--ease);
}
.slot .play i {
    display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%;
    background: var(--acc-grad); color: #fff; box-shadow: var(--acc-sh-lg);
    transform: scale(.7); transition: transform .25s var(--ease);
}
.slot .play b { color: #fff; font-size: 12px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
@media (hover: hover) {
    .slot:hover .play { opacity: 1; }
    .slot:hover .play i { transform: none; }
}
.slot .demo { z-index: 4; }

.ice-scene {
    position: relative; overflow: hidden; padding: 14px;
    border-radius: var(--r-xl); border: 1px solid rgba(124,200,255,.18);
    background:
        radial-gradient(90% 60% at 50% 0%, rgba(55,215,242,.16), transparent 62%),
        linear-gradient(170deg, #0f1f33, #0a1424 70%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 24px 60px -30px rgba(0,0,0,.95);
}

.ice-scene::before {
    content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .5;
    background:
        radial-gradient(1.5px 1.5px at 12% 18%, #fff 98%, transparent) 0 0 / 220px 180px,
        radial-gradient(1px 1px at 62% 48%, #fff 98%, transparent) 0 0 / 260px 200px,
        radial-gradient(1.2px 1.2px at 88% 78%, #fff 98%, transparent) 0 0 / 300px 240px;
    animation: iceSnow 30s linear infinite;
}
@keyframes iceSnow { to { background-position: 0 180px, 0 200px, 0 240px; } }
.ice-scene > * { position: relative; }

.ice-scene .fish-accept {
    margin-bottom: 12px; padding: 12px 16px; border-radius: 18px;
    background: rgba(6,14,26,.55); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
    border: 1px solid color-mix(in srgb, var(--ph) 26%, transparent);
}
.ice-scene .fish-accept .head .cd { font-size: 24px; }
.ice-scene .fish-accept .meta { margin-top: 10px; padding-top: 9px; }

.ice-scene .fish-table { border: 0; border-radius: 20px; }
.ice-scene .fish-stage::before { inset: -10% 0 10%; opacity: .9; }

.ice-scene .fish-last {
    margin-top: 12px; padding: 10px 14px; border-radius: 16px;
    background: rgba(6,14,26,.5); border: 1px solid rgba(255,255,255,.07);
}

.fish-fields { gap: 12px; margin-top: 14px; }
.fish-fields .f {
    padding: 16px 15px 14px; border-radius: 20px; min-height: 118px;
    display: flex; flex-direction: column;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.55),
                inset 0 0 0 1px var(--fb),
                inset 0 -4px 0 rgba(0,0,0,.2),
                0 14px 30px -14px var(--solid, rgba(0,0,0,.8));
}
.fish-fields .f .n { font-size: 12.5px; letter-spacing: .01em; }
.fish-fields .f { container-type: inline-size; }

.fish-fields .f .m { font-size: min(22px, 14.5cqw); white-space: nowrap; margin: 2px 0 auto; }
.fish-fields .f .foot { margin-top: 10px; font-size: 11px; }
.fish-fields .f:hover { transform: translateY(-4px); }
.fish-fields .f.placed { animation: fieldPlaced .4s var(--ease); }
@keyframes fieldPlaced { 40% { transform: translateY(-6px) scale(1.03); } }

.fish-all { margin-top: 12px; border-radius: 18px; padding: 13px 16px; }

.fish-bar { padding: 16px; }
.fish-bar .head { margin-bottom: 12px; }
.fish-bar .chips { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; justify-items: center; }
.fish-bar .total {
    display: flex; align-items: baseline; justify-content: space-between; gap: 8px;
    margin-top: 14px; padding: 11px 13px; border-radius: 14px;
    background: var(--gold-soft); box-shadow: inset 0 0 0 1px var(--gold-line);
}
.fish-bar .total small { color: var(--gold-warm); font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.fish-bar .total b { font-family: var(--f-display); font-size: 18px; font-weight: 700; color: var(--gold-text); }
.fish-bar .acts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 12px; }
.fish-bar .acts .btn { min-height: 42px; border-radius: 12px; font-size: 12.5px; }
.fish-bar .acts .danger { grid-column: 1 / -1; color: var(--pink); }

html.is-lite .ice-scene::before, html.is-webview .ice-scene::before { animation: none; }

.ice-scene .ice-wg { font-family: var(--f-text); }
.ice-scene .ice-wg__value {
    font-family: var(--f-display);
    font-weight: 700;
    letter-spacing: -.05em;
    stroke: none;
    filter: drop-shadow(0 3px 0 rgba(6, 14, 24, .55)) drop-shadow(0 0 14px var(--wg-soft));
}
.ice-scene .ice-wg__tick-num {
    font-family: var(--f-display);
    font-weight: 600;
    letter-spacing: -.02em;
    stroke-width: calc(3px * var(--s, 1));
}
.ice-scene .ice-wg__chip text { font-weight: 800; letter-spacing: .14em; }
.ice-scene .ice-wg__unit { font-weight: 700; }

@media (max-width: 760px) {
    .ice-scene { padding: 10px; }
    .fish-fields { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; margin-top: 10px; }
    .fish-fields .f { grid-column: span 2; min-height: 82px; padding: 10px 10px 9px; border-radius: 14px; }
    .fish-fields .f:nth-child(n+4) { grid-column: span 3; }
    .fish-fields .f .n { font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .fish-fields .f .m { font-size: 16px; white-space: nowrap; }
    .fish-fields .f .foot { margin-top: 6px; gap: 4px; font-size: 9.5px; white-space: nowrap; }
    .fish-fields .f:hover { transform: none; }
}

.m-controls .m-bet .bet-grid, .rail .m-bet .bet-grid { display: grid; grid-template-columns: 1fr; gap: 14px; }
.m-controls .m-bet .bet-head, .rail .m-bet .bet-head { display: flex; align-items: baseline; gap: 8px; margin-bottom: 8px; }
.m-controls .m-bet .field, .rail .m-bet .field {
    min-height: 52px; border-radius: 14px; padding: 4px;
    background: rgba(0,0,0,.28); border: 0;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.07), inset 0 2px 8px rgba(0,0,0,.4);
}
.m-controls .m-bet .field .val, .rail .m-bet .field .val { font-family: var(--f-display); font-size: 20px; font-weight: 700; letter-spacing: -.03em; }
.m-controls .m-bet .field .step, .rail .m-bet .field .step { width: 42px; height: 42px; border-radius: 10px; }
.m-controls .m-bet .quick-row, .rail .m-bet .quick-row { gap: 4px; padding: 3px; border-radius: 12px; background: rgba(0,0,0,.28); }
.m-controls .m-bet .quick-row button, .rail .m-bet .quick-row button { height: 34px; border: 0; border-radius: 9px; background: transparent; }
.m-controls .m-bet .quick-row button.on, .rail .m-bet .quick-row button.on { background: var(--acc-grad); box-shadow: var(--acc-sh); }
.m-controls .m-bet .launch, .rail .m-bet .launch { display: grid; gap: 10px; margin-top: 14px; }
.m-controls .m-bet .launch .payout, .rail .m-bet .launch .payout {
    display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 14px;
    background: var(--gold-soft); box-shadow: inset 0 0 0 1px var(--gold-line);
}
.m-controls .m-bet .launch .payout b, .rail .m-bet .launch .payout b { display: block; font-family: var(--f-display); font-size: 20px; font-weight: 700; color: var(--gold-text); letter-spacing: -.03em; }
.m-controls .m-bet .launch .payout .x, .rail .m-bet .launch .payout .x { padding: 5px 10px; border-radius: 999px; background: var(--gold-grad); color: var(--gold-ink); font-size: 12px; font-weight: 800; }
.m-controls .m-bet .launch .go, .rail .m-bet .launch .go { min-height: 58px; border-radius: 17px; box-shadow: var(--acc-sh-lg), inset 0 1px 0 rgba(255,255,255,.25); }
.m-controls > .m-bet, .rail.col > .m-bet { background: linear-gradient(170deg, #182238, #10172a 70%); border-color: rgba(124,180,255,.14); }

[data-bubbles] .bubble-field { min-height: 380px; }
[data-bubbles] .stage { padding: 18px !important; }
[data-bubbles] .stage .bubble-field, [data-bubbles] .stage .bubble-hist { max-width: none; }

.ice-scene .fish-table { height: clamp(200px, 28cqw, 370px); }

.ice-scene .fish-table .ice { width: 100%; max-width: 100%; height: auto; aspect-ratio: 1; }
.ice-scene .fish-table .ice.marks { z-index: 3; pointer-events: none; filter: none; overflow: visible; }
.ice-scene .mx-mark { fill: #f5197f; stroke: #fff; stroke-width: 2; }
.ice-scene .mx-glow { fill: #f5197f; opacity: .22; }
.ice-scene .mx-txt { fill: #fff; font-family: var(--f-text); font-weight: 800; letter-spacing: -.02em; text-anchor: middle; dominant-baseline: central; }
.ice-scene .mx-sign { font-size: .68em; fill-opacity: .72; }

.fish-mults {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
    margin-top: 12px; padding: 10px 14px; border-radius: 16px;
    background: rgba(6,14,26,.5); border: 1px solid rgba(255,255,255,.07);
}
.fish-mults .mx {
    display: inline-flex; align-items: center; gap: 7px; padding: 6px 11px; border-radius: 999px;
    background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1);
    color: var(--dim); font-size: 12px; font-weight: 800;
}
.fish-mults .mx i { width: 9px; height: 9px; border-radius: 50%; background: var(--kc); box-shadow: 0 0 0 2px rgba(255,255,255,.12); }
.fish-mults .mx b { color: #ff5aa8; font-family: var(--f-display); font-size: 13px; }

.fish-last .row span { display: inline-flex; align-items: center; gap: 6px; }
.fish-last .row span i { width: 8px; height: 8px; border-radius: 50%; box-shadow: 0 0 0 2px rgba(255,255,255,.1); }

.fish-last .row { flex-wrap: nowrap; }

.rail .fish-bar {
    padding: 16px;
    background:
        radial-gradient(80% 60% at 50% -10%, rgba(55,215,242,.16), transparent 60%),
        linear-gradient(170deg, #142a40, #0f1a2c 70%);
    border: 1px solid rgba(124,200,255,.2);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 24px 50px -30px rgba(0,0,0,.95);
}
.fish-bar .fb-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.fish-bar .fb-head b { display: block; font-family: var(--f-display); font-size: 15px; font-weight: 700; letter-spacing: -.02em; }
.fish-bar .fb-head small { display: block; margin-top: 3px; color: var(--faint); font-size: 11px; font-weight: 700; }
.fish-bar .fb-pick {
    margin-left: auto; flex: none; padding: 8px 12px; border-radius: 12px;
    background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1);
    font-family: var(--f-display); font-size: 14px; font-weight: 700; color: var(--cyan-2);
    font-variant-numeric: tabular-nums;
}

.fish-bar .chips { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px 8px; justify-items: center; padding: 4px 0 2px; }
.fish-bar .chips .c { width: 60px; height: 60px; font-size: 14px; }
.fish-bar .chips .c.on {
    transform: translateY(-3px) scale(1.06); filter: none;
    box-shadow: inset 0 1.5px 0 rgba(255,255,255,.5), inset 0 -2.5px 0 rgba(0,0,0,.3),
                0 0 0 3px #fff, 0 0 0 6px color-mix(in srgb, var(--cc) 55%, transparent),
                0 14px 24px -10px var(--cc);
}

.fish-bar .fb-total {
    display: flex; align-items: center; gap: 10px; margin-top: 16px; padding: 11px 13px;
    border-radius: 14px; background: var(--gold-soft); box-shadow: inset 0 0 0 1px var(--gold-line);
}
.fish-bar .fb-total > span { min-width: 0; flex: 1; }
.fish-bar .fb-total small { display: block; color: var(--gold-warm); font-size: 9.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.fish-bar .fb-total b { display: block; margin-top: 2px; font-family: var(--f-display); font-size: 20px; font-weight: 700; color: var(--gold-text); letter-spacing: -.03em; }
.fish-bar .fb-clear {
    flex: none; height: 34px; padding: 0 12px; border-radius: 10px; border: 0;
    background: rgba(255,102,133,.14); color: var(--pink); font-size: 11.5px; font-weight: 800; cursor: pointer;
    transition: background .15s, opacity .15s;
}
.fish-bar .fb-clear:hover { background: rgba(255,102,133,.24); }
.fish-bar .fb-clear.is-off { opacity: .35; pointer-events: none; }

.fish-bar .acts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
.fish-bar .acts .btn { min-height: 44px; border-radius: 12px; font-size: 12.5px; gap: 8px; }
.fish-bar .acts .btn i {
    display: grid; place-items: center; min-width: 22px; height: 22px; padding: 0 5px; border-radius: 7px;
    background: rgba(255,255,255,.08); font-style: normal; font-size: 11px; font-weight: 800;
}
.fish-bar .acts .btn.is-off i { opacity: .5; }

.ice-scene .fish-table .logo { padding: clamp(6px, 1cqw, 10px) clamp(14px, 2.2cqw, 24px); }
.ice-scene .fish-table .logo img {
    display: block; width: auto; height: clamp(28px, 4.2cqw, 44px); margin: -6px 0;
    filter: invert(1) hue-rotate(180deg);
}

.ice-scene .fish-last { display: flex; align-items: center; gap: 12px; }
.ice-scene .fish-last .row { flex: 1; display: flex; gap: 6px; overflow: hidden; }
.ice-scene .fish-last .row span {
    flex: 1 1 0; min-width: 0; justify-content: center; height: 34px; padding: 0 6px;
    border-radius: 11px; font-size: 12px; font-weight: 800; font-variant-numeric: tabular-nums;
    color: #fff; border: 1px solid color-mix(in srgb, var(--kc) 35%, transparent);
    background: color-mix(in srgb, var(--kc) 16%, rgba(255,255,255,.03));
    animation: histIn .35s var(--ease) both;
}
.ice-scene .fish-last .row span i { width: 7px; height: 7px; border-radius: 50%; background: var(--kc); box-shadow: 0 0 0 2px rgba(255,255,255,.1); }
.ice-scene .fish-last .row span.fish {
    background: linear-gradient(180deg, color-mix(in srgb, var(--kc) 70%, #fff 0%), color-mix(in srgb, var(--kc) 85%, #000 15%));
    border-color: transparent; text-shadow: 0 1px 2px rgba(0,0,0,.35);
}
.ice-scene .fish-last .row span.fish i { background: #fff; box-shadow: none; }
.ice-scene .fish-last .row span.w2 { box-shadow: 0 0 16px -4px var(--kc); }
.ice-scene .fish-last .row span.w3 { box-shadow: 0 0 22px -3px var(--kc), 0 0 0 2px rgba(255,255,255,.35); transform: scale(1.06); }

.ice-scene .fish-last .row span:first-child { outline: 2px solid rgba(255,255,255,.28); outline-offset: 1px; }
@media (max-width: 760px) {
    .ice-scene .fish-last .row span:nth-child(n+8) { display: none; }
}

.ice-scene .fish-last .row span {
    height: 38px; border-radius: 12px; font-size: 12.5px; animation: none;
    background: color-mix(in srgb, var(--kc) 22%, #0b1424); border-color: color-mix(in srgb, var(--kc) 30%, transparent);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}
.ice-scene .fish-last .row span[title="Белый"] { background: linear-gradient(180deg, #ffffff, #e6ecf5); color: #14243f; border-color: transparent; }
.ice-scene .fish-last .row span[title="Белый"] i { background: #9aa6b8; box-shadow: none; }
.ice-scene .fish-last .row span[title="Серый"] { background: linear-gradient(180deg, #8e98a8, #6b7585); color: #fff; border-color: transparent; }
.ice-scene .fish-last .row span[title="Серый"] i { background: #fff; opacity: .7; box-shadow: none; }
.ice-scene .fish-last .row span.fish { box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 8px 16px -10px var(--kc); }
.ice-scene .fish-last .row span:first-child { animation: histIn .35s var(--ease) both; outline: 2px solid rgba(255,255,255,.4); }

.ice-scene .fish-last .row { padding: 3px; }

[data-dice].m-stage {
    padding: 22px;
    background:
        radial-gradient(120% 70% at 50% -10%, rgba(77,141,255,.2), transparent 60%),
        linear-gradient(170deg, #141c2d, #0b1120 70%);
    border-color: rgba(124,180,255,.16);
}
[data-dice] .dice-face {
    max-width: none; padding: 28px 26px 22px; border-radius: 22px;
    background: rgba(255,255,255,.03); box-shadow: inset 0 0 0 1px rgba(255,255,255,.06);
}
[data-dice] .dice-read .cap { font-size: 10px; margin-bottom: 8px; }
[data-dice] .dice-face .roll { font-size: clamp(54px, 7vw, 84px); letter-spacing: -.06em; }

[data-dice] .dice-track { height: 74px; margin-top: 22px; border-radius: 18px; }
[data-dice] .dice-track .zone {
    background: linear-gradient(180deg, rgba(54,216,154,.45), rgba(54,216,154,.16));
    box-shadow: inset 0 1px 0 rgba(140,255,210,.45), 0 0 30px -6px rgba(54,216,154,.6);
}
[data-dice] .dice-track.is-lose .zone { background: linear-gradient(180deg, rgba(255,102,133,.38), rgba(255,102,133,.12)); box-shadow: inset 0 1px 0 rgba(255,170,190,.4), 0 0 30px -6px rgba(255,102,133,.6); }
[data-dice] .dice-track .edge { width: 3px; background: #fff; box-shadow: 0 0 12px rgba(255,255,255,.6); }
[data-dice] .dice-track .edge i { top: 8px; padding: 4px 9px; border-radius: 9px; font-size: 11px; background: #fff; color: #0f1a26; }
[data-dice] .dice-scale { margin-top: 8px; }
[data-dice] .dice-scale i { font-size: 10.5px; font-weight: 800; color: var(--faint-2); }

[data-dice] .dice-sides { max-width: none; gap: 14px; margin-top: 16px; }
[data-dice] .dice-sides button {
    min-height: 82px; border-radius: 20px; font-size: 17px;
    background: linear-gradient(180deg, #223052, #17213a);
    box-shadow: inset 0 1.5px 0 rgba(255,255,255,.12), inset 0 -3px 0 rgba(0,0,0,.35), 0 10px 20px -12px rgba(0,0,0,.8);
}
[data-dice] .dice-sides button small { font-size: 12px; margin-top: 3px; }
[data-dice] .dice-sides button.on.under { background: linear-gradient(135deg,#8fe4ff,#3ba7f0); box-shadow: 0 18px 38px -16px rgba(59,167,240,1), inset 0 1px 0 rgba(255,255,255,.5); }
[data-dice] .dice-sides button.on.over  { background: var(--acc-grad); box-shadow: var(--acc-sh-lg), inset 0 1px 0 rgba(255,255,255,.35); }
[data-dice] .waiting { margin-top: 12px; }

.m-controls .m-bet .payout { padding: 13px 14px; border-radius: 14px; }
.m-controls .m-bet .payout b { font-size: 20px; }
.m-controls .m-bet .range-wrap { padding: 6px 2px 0; }
.m-controls .m-bet .range::-webkit-slider-thumb { width: 24px; height: 24px; box-shadow: 0 0 0 4px rgba(77,141,255,.25), 0 6px 14px -6px rgba(0,0,0,.8); }
.m-controls .m-bet .hint { color: var(--faint); font-size: 11.5px; line-height: 1.6; }

[data-dice] .dice-face .roll.rolling { color: var(--lilac-2); animation: diceFlicker .12s steps(2) infinite; }
@keyframes diceFlicker { to { opacity: .82; } }
[data-dice] .dice-track { transition: none; }
[data-dice] .dice-track.landed.is-win  { animation: diceLandWin .6s var(--ease); }
[data-dice] .dice-track.landed.is-lose { animation: diceLandLose .5s var(--ease); }
@keyframes diceLandWin  { 30% { box-shadow: inset 0 0 0 2px rgba(54,216,154,.8), 0 0 40px -6px rgba(54,216,154,.9); } }
@keyframes diceLandLose { 20%, 60% { transform: translateX(-5px); } 40%, 80% { transform: translateX(5px); } }
[data-dice] .dice-track .pin { transition: none; width: 4px; }

[data-page="keno"] .m-stage {
    background:
        radial-gradient(120% 70% at 50% -10%, rgba(111,134,255,.2), transparent 60%),
        linear-gradient(170deg, #151a30, #0b1020 70%);
    border-color: rgba(140,160,255,.16);
}
.keno-bar { padding: 12px 14px; border-radius: 16px; background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 1px rgba(255,255,255,.07); margin-bottom: 14px; }
.keno-bar .acts button { border-radius: 10px; }

.keno-grid { gap: 9px; margin-bottom: 14px; }
.keno-grid.is-80 { grid-template-columns: repeat(10, minmax(0,1fr)); gap: 7px; }
.keno-grid button { aspect-ratio: 1.15; border-radius: 14px; font-family: var(--f-display); font-size: 14px; font-weight: 700; }
.keno-grid.is-80 button { aspect-ratio: 1.2; font-size: 12px; border-radius: 11px; }

.keno-grid button.draw {
    color: #ffd76a; background: linear-gradient(180deg, rgba(247,201,75,.22), rgba(247,201,75,.08));
    box-shadow: inset 0 0 0 1.5px rgba(247,201,75,.55), 0 0 18px -6px rgba(247,201,75,.7);
    animation: kenoDraw .35s var(--ease);
}
@keyframes kenoDraw { 0% { transform: scale(.7); } 60% { transform: scale(1.1); } 100% { transform: none; } }
.keno-grid button.hit {
    color: #eafff4; background: radial-gradient(circle at 50% 30%, rgba(111,240,187,.6), rgba(54,216,154,.18) 60%, rgba(14,40,32,.95));
    box-shadow: inset 0 0 0 1.5px rgba(54,216,154,.7), 0 0 26px -6px rgba(54,216,154,.95);
    text-shadow: 0 0 12px rgba(111,240,187,.9);
}
.keno-grid button.miss { opacity: .55; }
.keno-grid.is-done button:not(.on):not(.draw) { opacity: .35; }

.keno-pay { flex-wrap: wrap; gap: 10px 14px; }
.keno-pays { display: flex; flex-wrap: wrap; gap: 6px; flex: 1; min-width: 0; }
.keno-pays .kp {
    display: inline-flex; flex-direction: column; align-items: center; gap: 1px; padding: 6px 10px; border-radius: 10px;
    background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 1px rgba(255,255,255,.07);
}
.keno-pays .kp small { color: var(--faint); font-size: 9.5px; font-weight: 800; letter-spacing: .04em; white-space: nowrap; }
.keno-pays .kp b { margin: 0; color: var(--lilac-2); font-family: var(--f-display); font-size: 12px; font-weight: 700; }
.keno-pays .kp.hit { background: var(--green-soft-2); box-shadow: inset 0 0 0 1px var(--green-line), 0 0 16px -6px rgba(54,216,154,.8); }
.keno-pays .kp.hit b { color: var(--mint); }
.keno-pays .kp.hit small { color: var(--mint-2); }
.keno-pay > b { flex: none; }

.m-controls .m-bet .format-row .f { border-radius: 14px; background: rgba(0,0,0,.28); border: 1px solid transparent; }
.m-controls .m-bet .format-row .f.on { background: linear-gradient(180deg, #6f86ff, #4f66e8); border-color: transparent; color: #fff; box-shadow: 0 14px 30px -14px rgba(111,134,255,.9); }
.m-controls .m-bet .risk-row { gap: 4px; padding: 3px; border-radius: 12px; background: rgba(0,0,0,.28); margin-bottom: 16px; }
.m-controls .m-bet .risk-row button { height: 36px; border: 0; border-radius: 9px; background: transparent; color: var(--dim); }
.m-controls .m-bet .risk-row button.on { color: var(--gold-ink); background: var(--gold-grad); box-shadow: 0 10px 22px -12px rgba(247,201,75,.9); }

.case-reel .it.hit { border-color: rgba(255,214,90,.7); box-shadow: 0 0 0 1px rgba(255,214,90,.4), 0 0 24px -6px rgba(255,214,90,.8); }

@media (max-width: 760px) {
    .screen.home .promo {
        display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory;
        scrollbar-width: none; margin: 0 calc(-1 * var(--pad-x)); padding: 0 var(--pad-x) 4px;
        -webkit-overflow-scrolling: touch;
    }
    .screen.home .promo::-webkit-scrollbar { display: none; }
    .screen.home .promo > * { flex: 0 0 84%; scroll-snap-align: start; min-width: 0; }
    .screen.home .promo-slot { display: flex; }
    .screen.home .promo-card { padding: 13px 14px; min-height: 148px; border-radius: 20px; }
    .screen.home .promo-card h3 { font-size: 17px; }
    .screen.home .promo-art { width: 88px; height: 88px; margin-right: -2px; }
    .screen.home .promo-go { height: 34px; padding: 0 12px; font-size: 11.5px; }
    .screen.home .promo-pill { height: 26px; font-size: 10px; }
    .screen.home .promo-ref h3 { font-size: 17px; }
    .screen.home .promo-stats .st { padding: 7px 9px; }
    .screen.home .promo-stats b { font-size: 15px; }
}

@media (max-width: 760px) {

    .dock.has-inline { padding-top: 12px; }
    .dock > .fish-bar {
        display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px 8px;
        margin: 0 0 10px; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none;
    }
    .dock > .fish-bar .fb-head { display: none; }
    .dock > .fish-bar .chips {
        grid-column: 1 / -1; display: flex; justify-content: space-between; gap: 6px;
        padding: 6px 4px; overflow-x: auto; overflow-y: visible; scrollbar-width: none;
    }
    .dock > .fish-bar .chips::-webkit-scrollbar { display: none; }
    .dock > .fish-bar .chips .c { flex: none; width: 46px; height: 46px; font-size: 12px; }
    .dock > .fish-bar .chips .c.on { transform: none; }

    .dock > .fish-bar .fb-total { grid-column: 2; grid-row: 2; margin: 0; padding: 0; border: 0; background: none; }
    .dock > .fish-bar .fb-total > span { display: none; }
    .dock > .fish-bar .fb-clear { height: 38px; padding: 0 12px; border-radius: 11px; font-size: 12px; }
    .dock > .fish-bar .acts { grid-column: 1; grid-row: 2; margin: 0; gap: 6px; }
    .dock > .fish-bar .acts .btn { min-height: 38px; border-radius: 11px; font-size: 12px; padding: 0 8px; }
    .dock > .fish-bar .acts .btn i { width: 20px; height: 20px; font-size: 10px; }

    .dock.has-inline .dock-main .btn { min-height: 46px; }

    .ice-scene .fish-accept { padding: 10px 12px; margin-bottom: 10px; }
    .ice-scene .fish-accept .head { gap: 8px; }
    .ice-scene .fish-accept .head strong:first-child {
        min-width: 0; font-size: 11px; letter-spacing: .08em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .ice-scene .fish-accept .head .cd { font-size: 20px; }
    .ice-scene .fish-accept .meta { gap: 10px; margin-top: 8px; padding-top: 8px; font-size: 11px; }
    .ice-scene .fish-accept .meta small { font-size: 9px; letter-spacing: .08em; }
    .ice-scene .fish-accept .meta b { font-size: 13px; }

    .fish-mults { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; gap: 6px; }
    .fish-mults::-webkit-scrollbar { display: none; }
    .fish-mults .mx { flex: none; }

    .ice-scene .fish-last { gap: 8px; padding: 8px 10px; }
    .ice-scene .fish-last .eyebrow { font-size: 9px; letter-spacing: .1em; }
    .ice-scene .fish-last .row { gap: 5px; }

    [data-fishing] .fish-all { display: none; }
}

.fb-own { display: flex; gap: 6px; margin-top: 14px; }
.fb-amt {
    flex: 1; min-width: 0; height: 44px; display: flex; align-items: center; gap: 8px; padding: 0 12px;
    border-radius: 12px; background: rgba(0,0,0,.25); border: 1px solid rgba(255,255,255,.1); cursor: text;
    transition: border-color .15s, box-shadow .15s;
}
.fb-amt:focus-within { border-color: rgba(143,211,255,.6); box-shadow: 0 0 0 3px rgba(143,211,255,.15); }
.fb-amt small { color: var(--faint); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.fb-amt input {
    flex: 1; min-width: 0; width: 100%; border: 0; outline: 0; background: none; color: var(--text); text-align: right;
    font-family: var(--f-display); font-size: 17px; font-weight: 700; font-variant-numeric: tabular-nums;
}
.fb-amt i { font-style: normal; color: var(--dim); font-weight: 700; }
.fb-q { flex: none; display: flex; gap: 6px; }
.fb-step { flex: 1; min-width: 0; display: flex; gap: 6px; }
.fb-step > .fb-st {
    flex: none; width: 44px; height: 44px; border-radius: 12px; border: 1px solid rgba(255,255,255,.1);
    background: rgba(255,255,255,.06); color: var(--text); font-size: 18px; font-weight: 800; cursor: pointer;
}
.fb-step > .fb-st:active { transform: scale(.95); }
.fb-own > button, .fb-q > button {
    flex: none; min-width: 46px; height: 44px; border-radius: 12px; border: 1px solid rgba(255,255,255,.1);
    background: rgba(255,255,255,.06); color: var(--text); font-weight: 800; font-size: 13px; cursor: pointer;
    transition: background .15s, transform .12s;
}
.fb-own > button:hover, .fb-q > button:hover { background: rgba(255,255,255,.12); }
.fb-own > button:active, .fb-q > button:active { transform: scale(.95); }
.fb-q > .fb-mm { font-size: 12px; }

.fb-own:has(> .fb-q) { flex-wrap: wrap; }
.fb-own:has(> .fb-q) > .fb-step { flex: 1 1 220px; }
.fb-own > .fb-q { flex: 1 1 auto; }
.fb-own > .fb-q > button { flex: 1 1 0; min-width: 0; padding: 0 4px; }
.fish-bar .fb-own + .fb-total { margin-top: 12px; }

@media (max-width: 760px) {
    .dock > .fish-bar:has(.fb-own) { grid-template-columns: minmax(0, 1fr) auto auto; gap: 7px 6px; margin-bottom: 8px; }
    .dock > .fish-bar:has(.fb-own) .chips { padding: 4px 2px; }
    .dock > .fish-bar:has(.fb-own) .chips .c { width: 42px; height: 42px; font-size: 11.5px; }
    .dock > .fish-bar:has(.fb-own) .fb-own { grid-column: 1; grid-row: 2; margin: 0; }
    .dock > .fish-bar:has(.fb-own) .fb-own > button { display: none; }
    .dock > .fish-bar:has(.fb-own) .acts { grid-column: 2; grid-row: 2; display: flex; gap: 6px; margin: 0; }
    .dock > .fish-bar:has(.fb-own) .acts .btn { width: 42px; min-height: 38px; min-width: 0; padding: 0; font-size: 0; gap: 0; }
    .dock > .fish-bar:has(.fb-own) .acts .btn i { width: auto; height: auto; background: none; font-size: 15px; }
    .dock > .fish-bar:has(.fb-own) .fb-total { grid-column: 3; grid-row: 2; margin: 0; padding: 0; background: none; box-shadow: none; }
    .dock > .fish-bar .fb-amt { height: 38px; }
    .dock > .fish-bar .fb-amt small { display: none; }

    .dock > .fish-bar:has(.fb-q) { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px 6px; }
    .dock > .fish-bar:has(.fb-q) .chips { display: none; }
    .dock > .fish-bar:has(.fb-q) .fb-own { grid-column: 1 / -1; grid-row: 1; display: flex; gap: 6px; flex-wrap: nowrap; }
    .dock > .fish-bar:has(.fb-q) .fb-own > .fb-q { flex: none; }
    .dock > .fish-bar:has(.fb-q) .fb-own > .fb-q > button { flex: none; }

    .dock > .fish-bar:has(.fb-q) .fb-step {
        height: 42px; align-items: center; gap: 2px; padding: 3px; border-radius: 12px;
        background: rgba(0,0,0,.3); box-shadow: inset 0 2px 6px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.05);
    }
    .dock > .fish-bar:has(.fb-q) .fb-step > .fb-st {
        width: 34px; height: 36px; border: 0; border-radius: 9px;
        background: linear-gradient(180deg, #1b2438, #121a29);
        box-shadow: inset 0 1px 0 rgba(255,255,255,.1), inset 0 -2px 0 rgba(0,0,0,.35);
    }
    .dock > .fish-bar:has(.fb-q) .fb-step > .fb-st:active { transform: translateY(1px); box-shadow: inset 0 2px 6px rgba(0,0,0,.5); }
    .dock > .fish-bar:has(.fb-q) .fb-amt {
        flex: 1; height: 36px; padding: 0 4px; gap: 3px; justify-content: center;
        border: 0; background: none; box-shadow: none;
    }
    .dock > .fish-bar:has(.fb-q) .fb-amt input { text-align: right; font-size: 15px; }

    @supports (field-sizing: content) {
        .dock > .fish-bar:has(.fb-q) .fb-amt input { flex: 0 1 auto; width: auto; min-width: 1ch; max-width: 100%; field-sizing: content; text-align: center; }
    }
    .dock > .fish-bar:has(.fb-q) .fb-amt i { font-size: 13px; }
    .dock > .fish-bar:has(.fb-q) .fb-q {
        height: 42px; align-items: center; gap: 2px; padding: 3px; border-radius: 12px;
        background: rgba(0,0,0,.3); box-shadow: inset 0 2px 6px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.05);
    }
    .dock > .fish-bar:has(.fb-q) .fb-q > button {
        display: grid; place-items: center; min-width: 0; width: 34px; height: 36px; padding: 0;
        border: 0; border-radius: 9px; background: transparent; color: var(--dim); font-size: 13px;
    }
    .dock > .fish-bar:has(.fb-q) .fb-q > .fb-mm { width: 36px; font-size: 10.5px; }
    .dock > .fish-bar:has(.fb-q) .fb-q > button:active { color: #fff; background: var(--acc-grad); }
    .dock > .fish-bar:has(.fb-q) .acts { grid-column: 1 / 3; grid-row: 2; display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
    .dock > .fish-bar:has(.fb-q) .acts .btn { width: auto; min-height: 38px; padding: 0 6px; gap: 5px; font-size: 11.5px; }
    .dock > .fish-bar:has(.fb-q) .acts .btn i { font-size: 13px; }
    .dock > .fish-bar:has(.fb-q) .fb-total { grid-column: 3; grid-row: 2; }
    .dock > .fish-bar:has(.fb-q) .fb-clear { width: 100%; height: 38px; }
}

.drawer .side-nav { gap: 6px; }
.drawer .side-nav a { height: 44px; }
.drawer .side-tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); }

@media (max-width: 760px) and (max-height: 760px) {
    .dock-grip { min-height: 46px; margin: 11px 0 8px; padding: 4px; }
    .dock-grip .gstep, .dock-grip .gqs, .dock-grip .gx { height: 38px; }
    .dock-grip .gs { height: 32px; }
    .dock-main .btn, .dock-main .pair .btn, .dock.has-inline .dock-main .btn { min-height: 44px; }
    .dock-rows { gap: 6px; margin-bottom: 8px; }
}

.brandmark {
    position: absolute; z-index: 2;
    width: var(--bm-w, clamp(84px, 18%, 150px)); height: auto;
    opacity: var(--bm-o, .62);
    pointer-events: none; user-select: none; -webkit-user-drag: none;
    filter: drop-shadow(0 2px 6px rgba(0,0,0,.5));
}
.brandmark.bm-tl { left: var(--bm-x, 3%); top: var(--bm-y, 3.5%); }
.brandmark.bm-tr { right: var(--bm-x, 3%); top: var(--bm-y, 3.5%); }
.brandmark.bm-bl { left: var(--bm-x, 3%); bottom: var(--bm-y, 3.5%); }
.brandmark.bm-br { right: var(--bm-x, 3%); bottom: var(--bm-y, 3.5%); }
.brandmark.bm-tc { left: 50%; top: var(--bm-y, 3.5%); transform: translateX(-50%); }
.brandmark.bm-bc { left: 50%; bottom: var(--bm-y, 3.5%); transform: translateX(-50%); }
.brandmark.bm-c  { left: 50%; top: var(--bm-y, 50%); transform: translate(-50%, -50%); }
.brandmark.bm-ink {
    --bm-o: .5;
    filter: invert(1) hue-rotate(180deg) drop-shadow(0 1px 0 rgba(255,255,255,.6));
}

.is-fit { overflow: hidden !important; }
.is-fit > [hidden] { display: none !important; }
.is-fit:not(.fit-spread) > * { flex-grow: 1 !important; }
.is-fit.fit-spread { justify-content: space-between; }