:root {
    --bg: var(--tg-theme-bg-color, #0b0d12);
    --bg-card: var(--tg-theme-secondary-bg-color, #14171f);
    --text: var(--tg-theme-text-color, #e8e9ec);
    --text-muted: var(--tg-theme-hint-color, #7b8191);
    --accent: var(--tg-theme-button-color, #00d4ff);
    --accent-text: var(--tg-theme-button-text-color, #0b0d12);
    --border: rgba(255, 255, 255, 0.08);
    --danger: #ff4561;
    --success: #2ed573;
    --legendary: #ffae00;
    --mythical: #ff00aa;
    --epic: #b967ff;
    --rare: #00d4ff;
    --common: #aab4cb;
    --legacy: #8b94a3;
}

* { box-sizing: border-box; margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; }

html, body {
    width: 100%;
    min-height: 100vh;
    background: var(--bg);
    color: var(--text);
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 15px;
    line-height: 1.45;
    overflow-x: hidden;
}

#app {
    max-width: 480px;
    margin: 0 auto;
    padding: 16px;
    min-height: 100vh;
}

.view { display: none; }
.view.active { display: block; animation: fade 0.25s ease; }
.hidden { display: none !important; }

@keyframes fade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

/* ===== HEADER ===== */
.term-header {
    text-align: center;
    padding: 24px 0 20px;
    border-bottom: 1px solid var(--border);
    margin-bottom: 20px;
    position: relative;
}
/* Шапка-баннер главного экрана: лого Plugin Terminal фоном сверху */
.term-header--hero {
    margin: -16px -16px 18px;   /* full-bleed: гасим верхний и боковые паддинги #app */
    padding-top: 0;
}
/* СЛОЙ 1 — исходная картинка (фон + заяц), как в оригинале. НЕ мигает.
   mix-blend screen растворяет тёмную подложку картинки в фон страницы. */
.term-header--hero::before {
    content: '';
    display: block;
    width: 100%;
    aspect-ratio: 32 / 15;       /* задаёт высоту баннера */
    margin: 0 0 8px;             /* шапка уже full-bleed (паддинги по бокам = 0) */
    /* center 35% по Y — картинка чуть ниже (больше свободного места сверху) */
    background: url('logo-terminal.png') center 35% / cover no-repeat;
    mix-blend-mode: screen;
    /* Верх и низ мягко затухают в фон страницы (симметрично) */
    -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 8%, #000 92%, transparent 100%);
    mask-image: linear-gradient(to bottom, transparent 0%, #000 8%, #000 92%, transparent 100%);
    pointer-events: none;
}
.term-title {
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 0.5px;
    font-family: 'SF Mono', Menlo, Consolas, monospace;
}
.term-sub {
    font-size: 13px;
    color: var(--text-muted);
    margin-top: 6px;
}
.admin-badge {
    position: absolute;
    top: 8px;
    right: 0;
    background: var(--accent);
    color: var(--accent-text);
    font-size: 10px;
    font-weight: 700;
    padding: 3px 8px;
    border-radius: 4px;
    letter-spacing: 1px;
}

/* ===== BALANCE CARD ===== */
.balance-card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 16px;
    margin-bottom: 20px;
}
.balance-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.balance-item { flex: 1; position: relative; }
.sig-help-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    margin-left: 4px;
    padding: 0;
    border: 1px solid rgba(34, 211, 238, 0.4);
    border-radius: 50%;
    background: rgba(34, 211, 238, 0.06);
    color: rgba(34, 211, 238, 0.65);
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    vertical-align: middle;
    transition: transform 0.15s ease, background 0.15s ease;
    animation: sigHelpPulse 2.6s ease-in-out infinite;
}
.sig-help-btn:hover,
.sig-help-btn:active {
    background: rgba(34, 211, 238, 0.14);
    transform: scale(1.15);
    animation: none;
}
@keyframes sigHelpPulse {
    0%, 100% { box-shadow: 0 0 3px 0 rgba(34, 211, 238, 0.08); }
    50% { box-shadow: 0 0 11px 2px rgba(34, 211, 238, 0.26); }
}
.sig-help-pop {
    position: absolute;
    top: 22px;
    left: 0;
    z-index: 30;
    width: max-content;
    max-width: 240px;
    padding: 10px 12px;
    background: #232734;
    border: 1px solid var(--border);
    border-radius: 10px;
    font-size: 13px;
    line-height: 1.35;
    color: var(--text);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);
}
.sig-help-pop b { color: var(--text); font-weight: 700; }
.sig-help-link { color: var(--accent, #6ea8fe); text-decoration: underline; cursor: pointer; }
.balance-item .label {
    font-size: 11px;
    color: var(--text-muted);
    letter-spacing: 1px;
    text-transform: uppercase;
}
.balance-item .value {
    font-size: 20px;
    font-weight: 600;
    margin-top: 4px;
}
.balance-item .value.big { font-size: 28px; }
.label { color: var(--text-muted); font-size: 13px; }
.value { font-weight: 600; }

.progress-row { margin-top: 6px; }
.progress-bar {
    width: 100%;
    height: 8px;
    background: rgba(255, 255, 255, 0.06);
    border-radius: 4px;
    overflow: hidden;
}
.progress-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--accent), #3bffd6);
    border-radius: 4px;
    transition: width 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}
/* Хватает на токен — полный бар, цвета 1:1 с фото (cyan→фиолет→маджента-пинк) */
.progress-fill--ready {
    background: linear-gradient(90deg,
        #19e6d2 0%,
        #00c6ff 32%,
        #7b6bff 62%,
        #ff1ea0 100%);
    /* внутренний glow (inset не режется overflow:hidden трека) */
    box-shadow:
        inset 0 0 6px rgba(255, 255, 255, 0.55),
        inset 0 0 10px rgba(0, 210, 255, 0.5);
}
/* внешний размытый glow — размытая копия того же градиента позади бара */
.progress-bar--ready {
    position: relative;
    z-index: 0;
    overflow: visible;          /* пускаем свечение за пределы трека */
    /* весь ореол даёт градиентный ::before — никаких одноцветных box-shadow */
}
/* мягкий цветной ореол под баром (cyan слева → маджента справа) — как на фото 2 */
.progress-bar--ready::before {
    content: '';
    position: absolute;
    inset: var(--bar-glow-spread, 1px);
    border-radius: 4px;
    background: linear-gradient(90deg, #19e6d2 0%, #00c6ff 32%, #7b6bff 62%, #ff1ea0 100%);
    filter: blur(var(--bar-glow-blur, 7px));
    opacity: var(--bar-glow-op, 1);
    z-index: -1;
    pointer-events: none;
    transform: translateZ(0);
    will-change: filter, transform;
    backface-visibility: hidden;
}
.progress-label {
    font-size: 12px;
    color: var(--text-muted);
    margin-top: 6px;
    text-align: center;
}
/* CTA для нового юзера (баланс 0): зовущий cyan, без тревоги */
.progress-label.progress-cta {
    color: #00dcdc;
    font-weight: 600;
}
/* Хватает на токен — подпись почти белая (чуть приглушена, ~90%) */
.progress-label.progress-ready {
    color: rgba(255, 255, 255, 0.88);
    font-weight: 600;
    text-align: right;
}
/* Число $SIG — синее, хвост «/ 500 $SIG» — серый (1:1 с эталоном) */
.progress-label .pl-sig  { color: #4d9fe6; font-weight: 700; }
.progress-label .pl-rest { color: var(--text-muted); font-weight: 600; }

/* ===== SECTION DESC ===== */
.section-desc {
    text-align: center;
    color: var(--text-muted);
    font-size: 14px;
    margin-bottom: 20px;
    line-height: 1.5;
}
/* когда сразу под описанием идёт лента — убираем лишний воздух между ними */

/* ===== BUTTONS ===== */
.actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 12px;       /* зазор, чтобы ореол кнопки лишь подсвечивал низ ленты, а не вставал под всю строку */
    margin-bottom: 20px;
}
.btn {
    display: block;
    width: 100%;
    padding: 14px 16px;
    border: none;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: transform 0.08s ease, opacity 0.15s ease;
    font-family: inherit;
}
.btn:active { transform: scale(0.97); }
.btn:disabled { opacity: 0.4; cursor: not-allowed; }

.btn-primary { background: var(--accent); color: var(--accent-text); }

/* Кнопка "Получить License Token" — тёмная заливка, cyan→маджента glow-обводка */
#btn-buy-token {
    position: relative;
    z-index: 0;
    background: rgba(8, 12, 20, 0.85);
    color: #ffffff;
    border: 2.5px solid transparent;
    border-radius: 12px;
    font-size: 16px;
    text-transform: uppercase;
    background-image:
        linear-gradient(rgba(8, 12, 20, 0.85), rgba(8, 12, 20, 0.85)),
        linear-gradient(90deg, #19e6d2 0%, #00c6ff 32%, #7b6bff 62%, #ff1ea0 100%);
    background-origin: border-box;
    background-clip: padding-box, border-box;
    /* лёгкое свечение надписи внутри */
    text-shadow:
        0 0 6px rgba(0, 200, 255, 0.55),
        0 0 10px rgba(255, 30, 160, 0.4);
    /* весь ореол даёт градиентный ::before — никаких одноцветных box-shadow */
}
/* мягкий диффузный ореол под кнопкой — повторяет градиент обводки (cyan→фиолет→маджента), как на фото 2 */
#btn-buy-token::before {
    content: '';
    position: absolute;
    inset: var(--btn-glow-spread, -15px);
    border-radius: inherit;
    background: linear-gradient(90deg, #19e6d2 0%, #00c6ff 32%, #7b6bff 62%, #ff1ea0 100%);
    filter: blur(var(--btn-glow-blur, 23px));
    opacity: var(--btn-glow-op, 1);
    z-index: -1;
    pointer-events: none;
    transform: translateZ(0);   /* отдельный GPU-слой: убирает прыгающий тёмный бокс на мобиле */
    will-change: filter, transform;
    backface-visibility: hidden;
}
/* заливка кнопки — тот же градиент, что и свечение (1:1), яркость регулируется ручкой */
#btn-buy-token::after {
    content: '';
    position: absolute;
    inset: 0;                   /* контейнер abs-слоя — padding-box, рамка уже снаружи: 0 = вплотную к обводке */
    border-radius: 9.5px;
    background: linear-gradient(90deg, #19e6d2 0%, #00c6ff 32%, #7b6bff 62%, #ff1ea0 100%);
    opacity: var(--btn-fill-op, 0.18);
    z-index: -1;                /* над тёмной базой и свечением, но под текстом */
    pointer-events: none;
}
.btn-secondary { background: var(--bg-card); color: var(--text); border: 1px solid var(--border); }
.btn-ghost { background: transparent; color: var(--text-muted); border: 1px solid var(--border); }
.btn-sm { padding: 8px 12px; font-size: 13px; }

/* Кнопка "К скидкам · Получить $SIG" — спокойный outline: это путь, а не событие */
#btn-get-sig {
    background: transparent;
    color: var(--text);
    border: 1px solid rgba(0, 212, 255, 0.28);
    font-size: 15px;
    box-shadow: none;
}

/* ===== РЫЧАГ: «АКТИВИРОВАТЬ ТОКЕН» — самый яркий объект экрана ===== */
#btn-activate {
    position: relative;
    z-index: 0;
    padding: 18px 16px;
    font-size: 17px;
    font-weight: 800;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: #ffffff;
    border: 2.5px solid transparent;
    border-radius: 14px;
    background-image:
        linear-gradient(rgba(8, 12, 20, 0.55), rgba(8, 12, 20, 0.55)),
        linear-gradient(90deg, #19e6d2 0%, #00c6ff 32%, #7b6bff 62%, #ff1ea0 100%);
    background-origin: border-box;
    background-clip: padding-box, border-box;
    text-shadow:
        0 0 8px rgba(0, 200, 255, 0.6),
        0 0 14px rgba(255, 30, 160, 0.45);
}
/* заливка ярче, чем у buy-token — рычаг «заряжен» */
#btn-activate::after {
    content: '';
    position: absolute;
    inset: 0;                   /* контейнер abs-слоя — padding-box, рамка уже снаружи: 0 = вплотную к обводке */
    border-radius: 11.5px;
    background: linear-gradient(90deg, #19e6d2 0%, #00c6ff 32%, #7b6bff 62%, #ff1ea0 100%);
    opacity: var(--lever-fill-op, 0.4);
    z-index: -1;
    pointer-events: none;
}
/* дышащий ореол */
#btn-activate::before {
    content: '';
    position: absolute;
    inset: var(--lever-glow-spread, -16px);
    border-radius: inherit;
    background: linear-gradient(90deg, #19e6d2 0%, #00c6ff 32%, #7b6bff 62%, #ff1ea0 100%);
    filter: blur(var(--lever-glow-blur, 24px));
    z-index: -1;
    pointer-events: none;
    transform: translateZ(0);
    backface-visibility: hidden;
    animation: lever-breathe 2.6s ease-in-out infinite;
}
@keyframes lever-breathe {
    /* яркость дыхания масштабируется ручкой --lever-glow-op */
    0%, 100% { opacity: calc(var(--lever-glow-op, 1) * 0.5); }
    50%      { opacity: calc(var(--lever-glow-op, 1) * 0.95); }
}
/* блик, пробегающий по рычагу раз в ~5 сек */
.lever-sheen {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    overflow: hidden;
    pointer-events: none;
}
.lever-sheen::after {
    content: '';
    position: absolute;
    inset: -30%;
    background: linear-gradient(115deg, transparent 44%, rgba(255, 255, 255, 0.3) 50%, transparent 56%);
    transform: translateX(-120%);
    animation: lever-sheen 5.2s ease-in-out infinite;
}
@keyframes lever-sheen {
    0%, 62%   { transform: translateX(-120%); }
    80%, 100% { transform: translateX(120%); }
}
.lever-label { position: relative; z-index: 1; }

/* Ячейка токенов «заряжена», когда токенов > 0 */
.balance-item--charged #main-tokens {
    color: #19e6d2;
    text-shadow: 0 0 12px rgba(25, 230, 210, 0.55);
}
.token-ready {
    font-size: 10px;
    letter-spacing: 0.5px;
    color: #19e6d2;
    text-shadow: 0 0 8px rgba(25, 230, 210, 0.4);
    margin-top: 2px;
}
@media (prefers-reduced-motion: reduce) {
    #btn-activate::before { animation: none; opacity: 0.7; }
    .lever-sheen::after { animation: none; }
}

/* ===== ADMIN ===== */
.admin-panel {
    background: rgba(255, 174, 0, 0.05);
    border: 1px solid rgba(255, 174, 0, 0.3);
    border-radius: 10px;
    padding: 12px;
    margin: 16px 0;
}
.admin-title {
    font-size: 11px;
    letter-spacing: 1px;
    color: var(--legendary);
    font-weight: 700;
    margin-bottom: 10px;
}
.admin-row {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-bottom: 8px;
    font-size: 13px;
}
.admin-row select {
    flex: 1;
    padding: 6px 8px;
    background: var(--bg);
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 6px;
    font-family: inherit;
}

.admin-prices {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed rgba(255, 174, 0, 0.2);
}
.admin-subtitle {
    font-size: 10px;
    letter-spacing: 1px;
    color: var(--legendary);
    font-weight: 700;
    margin-bottom: 8px;
    text-transform: uppercase;
}
.admin-price-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
    font-size: 12px;
}
.admin-price-row label {
    flex: 1;
    color: var(--text-muted);
}
.admin-price-row input {
    width: 90px;
    padding: 5px 8px;
    background: var(--bg);
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 6px;
    font-family: inherit;
    font-size: 12px;
    text-align: right;
}
.admin-price-row .admin-readonly {
    width: 90px;
    text-align: right;
    color: var(--text);
    font-family: 'SF Mono', Menlo, monospace;
    font-weight: 600;
}
.admin-price-result .admin-readonly {
    color: var(--legendary);
}
.admin-prices button {
    margin-top: 8px;
    width: 100%;
}

.admin-list-block {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed rgba(255, 174, 0, 0.2);
}
.admin-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 8px 0;
}
.admin-list-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 10px;
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: 6px;
    font-size: 12px;
    gap: 8px;
}
.admin-list-item .item-text {
    flex: 1;
    font-family: 'SF Mono', Menlo, monospace;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.admin-list-item .btn-remove {
    background: transparent;
    color: var(--danger);
    border: none;
    cursor: pointer;
    font-size: 14px;
    padding: 2px 6px;
    border-radius: 4px;
}
.admin-list-item .btn-remove:hover { background: rgba(255, 69, 97, 0.1); }
.admin-list-empty {
    color: var(--text-muted);
    font-size: 11px;
    font-style: italic;
    padding: 6px 10px;
}
.admin-list-add {
    display: flex;
    gap: 6px;
    margin-top: 6px;
}
.admin-list-add-3col {
    display: grid;
    grid-template-columns: 1fr 1fr 70px;
    gap: 6px;
    margin-top: 6px;
}
.admin-list-add input {
    flex: 1;
    padding: 6px 8px;
    background: var(--bg);
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 6px;
    font-family: inherit;
    font-size: 12px;
}

/* ===== STUB ===== */
.stub-body { text-align: center; padding: 20px 0; }
.stub-body p { margin-bottom: 10px; color: var(--text-muted); }
.hint {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 14px;
    font-size: 13px;
    margin: 20px 0;
    text-align: left;
    color: var(--text-muted);
    line-height: 1.6;
}
.stub-debug {
    margin-top: 24px;
    padding: 12px;
    background: rgba(255, 174, 0, 0.05);
    border: 1px solid rgba(255, 174, 0, 0.3);
    border-radius: 8px;
    text-align: left;
    font-family: 'SF Mono', Menlo, monospace;
    font-size: 11px;
    color: var(--text);
    line-height: 1.6;
}
.stub-debug-title {
    color: var(--legendary);
    font-weight: 700;
    letter-spacing: 1px;
    margin-bottom: 8px;
    font-size: 10px;
}

/* ===== LOADER ===== */
.loader {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 60vh;
    gap: 16px;
}
.loader-ring {
    width: 40px;
    height: 40px;
    border: 3px solid var(--border);
    border-top-color: var(--accent);
    border-radius: 50%;
    animation: spin 0.9s linear infinite;
}
.loader-text {
    font-family: 'SF Mono', Menlo, monospace;
    color: var(--text-muted);
    font-size: 12px;
    letter-spacing: 2px;
}
@keyframes spin { to { transform: rotate(360deg); } }

.error-box {
    text-align: center;
    padding: 40px 20px;
}
.error-title {
    font-size: 48px;
    font-weight: 700;
    color: var(--danger);
    font-family: monospace;
}
.error-msg { color: var(--text-muted); margin: 10px 0 20px; }

/* ===== SPIN ANIMATION ===== */
.spin-stage {
    padding: 40px 0;
    text-align: center;
}
.spin-title {
    font-size: 14px;
    letter-spacing: 3px;
    color: var(--text-muted);
    font-family: 'SF Mono', Menlo, monospace;
    margin-bottom: 30px;
}
.spin-strip {
    position: relative;
    height: 80px;
    overflow: hidden;
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 10px;
    margin: 0 -16px;
}
/* Края ленты тают в фон — оверлеем, а НЕ mask-image (маска клипала glow взвода). */
.spin-strip::before, .spin-strip::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 16%;
    z-index: 3;
    pointer-events: none;
}
.spin-strip::before { left: 0; background: linear-gradient(90deg, var(--bg-card), transparent); }
.spin-strip::after  { right: 0; background: linear-gradient(270deg, var(--bg-card), transparent); }
/* «Взвод» перед прокрутом — пульс cyan-рамки окна (box-shadow теперь не обрезан маской) */
.spin-strip.arming {
    animation: strip-arm 0.45s ease-out;
}
@keyframes strip-arm {
    0%   { border-color: var(--border); box-shadow: none; }
    50%  { border-color: var(--accent); box-shadow: 0 0 26px rgba(0,212,255,0.5), inset 0 0 24px rgba(0,212,255,0.18); }
    100% { border-color: var(--border); box-shadow: none; }
}
.strip-inner {
    display: flex;
    height: 100%;
    will-change: transform;
}
.strip-item {
    flex: 0 0 140px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 38px;
    border-right: 1px solid var(--border);
    font-weight: 700;
    font-family: 'SF Mono', Menlo, monospace;
    position: relative;
    transition: filter 0.2s ease, transform 0.25s cubic-bezier(.34,1.56,.64,1);
}
.strip-item::before {
    content: '';
    position: absolute;
    inset: 6px;
    border-radius: 8px;
    border: 1px solid rgba(255,255,255,0.06);
    background: linear-gradient(180deg, rgba(255,255,255,0.04) 0%, rgba(0,0,0,0.2) 100%);
    z-index: -1;
}
.strip-item.common    { color: var(--common); }
.strip-item.rare      { color: var(--rare); text-shadow: 0 0 8px rgba(0,212,255,0.4); }
.strip-item.epic      { color: var(--epic); text-shadow: 0 0 12px rgba(185,103,255,0.5); }
.strip-item.legendary { color: var(--legendary); text-shadow: 0 0 14px rgba(255,174,0,0.6); }
.strip-item.mythical  { color: var(--mythical); text-shadow: 0 0 16px rgba(255,0,170,0.7); }
/* Сияние SIGMA-волны: text-shadow не действует на SVG-штрих — нужен drop-shadow */
.strip-item.mythical .strip-cell-icon svg,
.pool-tier.tier-mythical .pool-tier-emoji svg,
.tier-mythical .result-tier-chip svg {
    filter: drop-shadow(0 0 3px rgba(255, 0, 170, 0.9)) drop-shadow(0 0 9px rgba(255, 0, 170, 0.55));
}
.fx-low .strip-item.mythical .strip-cell-icon svg { filter: drop-shadow(0 0 4px rgba(255, 0, 170, 0.8)); }

.strip-item.rare::before      { border-color: rgba(0,212,255,0.25); background: linear-gradient(180deg, rgba(0,212,255,0.08), rgba(0,0,0,0.25)); }
.strip-item.epic::before      { border-color: rgba(185,103,255,0.3); background: linear-gradient(180deg, rgba(185,103,255,0.1), rgba(0,0,0,0.25)); }
.strip-item.legendary::before { border-color: rgba(255,174,0,0.4); background: linear-gradient(180deg, rgba(255,174,0,0.12), rgba(0,0,0,0.25)); }
.strip-item.mythical::before  { border-color: rgba(255,0,170,0.5); background: linear-gradient(180deg, rgba(255,0,170,0.15), rgba(0,0,0,0.25)); }

/* Подсветка финальной плитки на остановке */
.strip-item.lock-in {
    animation: lock-in-pulse 0.5s ease;
    z-index: 3;
}
.strip-item.lock-in::before {
    border-color: var(--accent);
    box-shadow: 0 0 24px var(--accent), inset 0 0 16px rgba(255,255,255,0.15);
}
/* Цвет свечения по тиру (common/rare/бонус остаются cyan) */
.strip-item.epic.lock-in::before      { border-color: var(--epic);      box-shadow: 0 0 26px var(--epic), inset 0 0 16px rgba(255,255,255,0.15); }
.strip-item.legendary.lock-in::before { border-color: var(--legendary); box-shadow: 0 0 28px var(--legendary), inset 0 0 16px rgba(255,255,255,0.15); }
.strip-item.mythical.lock-in::before  { border-color: var(--mythical);  box-shadow: 0 0 30px var(--mythical), inset 0 0 16px rgba(255,255,255,0.15); }

/* Ударная волна — расширяющееся гаснущее кольцо в момент остановки */
.strip-item.lock-in::after {
    content: '';
    position: absolute;
    inset: 6px;
    border-radius: 8px;
    border: 2px solid var(--accent);
    opacity: 0;
    z-index: 4;
    pointer-events: none;
    animation: lock-shockwave 0.6s ease-out;
}
.strip-item.epic.lock-in::after      { border-color: var(--epic); }
.strip-item.legendary.lock-in::after { border-color: var(--legendary); }
.strip-item.mythical.lock-in::after  { border-color: var(--mythical); }
@keyframes lock-shockwave {
    0%   { opacity: 0.9; transform: scale(1); }
    100% { opacity: 0; transform: scale(1.85); }
}
@keyframes lock-in-pulse {
    0%   { transform: scale(1); }
    40%  { transform: scale(1.18); }
    70%  { transform: scale(0.96); }
    100% { transform: scale(1); }
}

/* Near-miss подсветка соседних плиток */
.strip-item.near-miss::before {
    border-color: rgba(255, 255, 255, 0.4);
    box-shadow: 0 0 14px rgba(255, 255, 255, 0.25);
    animation: near-miss-flash 0.6s ease;
}
@keyframes near-miss-flash {
    0%, 100% { opacity: 1; }
    50%      { opacity: 0.4; }
}
.near-miss-tag {
    position: absolute;
    top: -28px;
    left: 50%;
    transform: translateX(-50%) translateY(8px);
    background: rgba(255, 255, 255, 0.9);
    color: #000;
    font-size: 10px;
    font-weight: 700;
    padding: 3px 8px;
    border-radius: 8px;
    letter-spacing: 0.5px;
    white-space: nowrap;
    opacity: 0;
    animation: near-miss-tag 1.6s ease;
    pointer-events: none;
    z-index: 5;
}
@keyframes near-miss-tag {
    0%   { opacity: 0; transform: translateX(-50%) translateY(8px); }
    20%  { opacity: 1; transform: translateX(-50%) translateY(0); }
    80%  { opacity: 1; transform: translateX(-50%) translateY(0); }
    100% { opacity: 0; transform: translateX(-50%) translateY(-8px); }
}
/* Зона захвата — рамка шириной в одну клетку по центру окна */
.strip-pointer {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 140px;
    height: 100%;
    border-left: 2px solid var(--accent);
    border-right: 2px solid var(--accent);
    background: rgba(0,212,255,0.04);
    box-shadow: 0 0 18px rgba(0,212,255,0.45), inset 0 0 22px rgba(0,212,255,0.12);
    z-index: 2;
    pointer-events: none;
}
/* Носы-треугольники сверху и снизу, смотрят внутрь окна (без отрицательных отступов) */
.strip-pointer::before, .strip-pointer::after {
    content: '';
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
}
.strip-pointer::before { top: 0; border-top: 9px solid var(--accent); }
.strip-pointer::after { bottom: 0; border-bottom: 9px solid var(--accent); }
/* «Rushing» — на пике скорости рамка-зона разгорается ярче (эффект разгона) */
.spin-strip.rushing .strip-pointer {
    border-color: #7fecff;
    background: rgba(0,212,255,0.08);
    box-shadow: 0 0 30px rgba(0,212,255,0.75), inset 0 0 34px rgba(0,212,255,0.22);
    transition: box-shadow 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}
.spin-strip.rushing { border-color: rgba(0,212,255,0.4); }
.spin-status {
    margin-top: 24px;
    font-family: 'JetBrains Mono', 'SF Mono', Menlo, monospace;
    font-size: 13px;
    color: var(--text-muted);
    letter-spacing: 2px;
    text-transform: uppercase;
}
/* Полноэкранная мягкая cyan-вспышка при взводе */
.arming-flash {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 998;
    /* Мягче и компактнее — не строб на спаме рероллов, свет сосредоточен у барабана */
    background: radial-gradient(ellipse 70% 32% at 50% 42%, rgba(0,212,255,0.16), rgba(0,212,255,0) 70%);
    animation: arming-flash 0.55s ease-out forwards;
}
@keyframes arming-flash {
    0%   { opacity: 0; }
    35%  { opacity: 1; }
    100% { opacity: 0; }
}

/* ===== RESULT CARD ===== */
.result-card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 24px;
    text-align: center;
    margin-top: 40px;
}
.result-card.tier-rare      { border-color: var(--rare); box-shadow: 0 0 24px rgba(0, 212, 255, 0.2); }
/* ===== 💾 LEGACY ===== материал — обычный графит common, фольга не нужна */
.result-card.tier-legacy    { border-color: rgba(139, 148, 163, 0.45); }
.tier-legacy .result-tier-chip { color: var(--legacy); }
.tier-legacy .result-tagline { color: var(--legacy); }
.tier-legacy .price-saved-value { color: var(--legacy); text-shadow: none; }
.legacy-compat {
    display: inline-block;
    margin: 6px 0 2px;
    padding: 3px 8px;
    border: 1px solid rgba(139, 148, 163, 0.4);
    border-radius: 6px;
    font-family: 'SF Mono', Menlo, monospace;
    font-size: 10px;
    letter-spacing: 1px;
    color: var(--legacy);
    text-transform: uppercase;
}
.result-card.tier-epic      { border-color: var(--epic); box-shadow: 0 0 32px rgba(185, 103, 255, 0.25); }
.result-card.tier-legendary { border-color: var(--legendary); box-shadow: 0 0 40px rgba(255, 174, 0, 0.3); animation: pulse-leg 2.4s ease-in-out infinite; }
.result-card.tier-mythical  { border-color: var(--mythical);  box-shadow: 0 0 40px rgba(255, 0, 170, 0.3); animation: pulse-myth 2s ease-in-out infinite; }

/* Появление карточки снизу */
.result-card { animation: card-rise 0.45s cubic-bezier(.18,.74,.12,1.0); }
@keyframes card-rise {
    from { opacity: 0; transform: translateY(20px) scale(0.96); }
    to   { opacity: 1; transform: none; }
}

@keyframes pulse-myth {
    0%, 100% { box-shadow: 0 0 40px rgba(255, 0, 170, 0.3); }
    50%      { box-shadow: 0 0 70px rgba(255, 0, 170, 0.55); }
}
@keyframes pulse-leg {
    0%, 100% { box-shadow: 0 0 30px rgba(255, 174, 0, 0.25); }
    50%      { box-shadow: 0 0 50px rgba(255, 174, 0, 0.45); }
}

/* Mythical/Legendary — частицы блика по краю.
   Крутим угол conic-градиента (@property), а НЕ transform: rotate элемента:
   вращающийся прямоугольник углами вылезал за низ страницы, высота прокрутки
   пульсировала — сбоку мигал «второй» скроллбар. Bbox градиента неподвижен. */
@property --shine-a {
    syntax: '<angle>';
    inherits: false;
    initial-value: 0deg;
}
.result-card.tier-mythical::before,
.result-card.tier-legendary::before {
    content: '';
    position: absolute;
    inset: -2px;
    border-radius: 14px;
    background: conic-gradient(from var(--shine-a), transparent 0deg, var(--mythical) 60deg, transparent 120deg, transparent 240deg, var(--legendary) 300deg, transparent 360deg);
    opacity: 0.35;
    filter: blur(8px);
    z-index: -1;
    animation: shine-sweep 6s linear infinite;
}
.result-card.tier-legendary::before { background: conic-gradient(from var(--shine-a), transparent, var(--legendary) 60deg, transparent 180deg, var(--legendary) 240deg, transparent 360deg); }
.result-card { position: relative; }
@keyframes shine-sweep { to { --shine-a: 360deg; } }
/* Анимация угла = repaint каждый кадр: на слабых устройствах глушим, блик статичен */
.fx-low .result-card.tier-mythical::before,
.fx-low .result-card.tier-legendary::before { animation: none; }

/* Tagline под названием тира */
.result-tagline {
    font-size: 12px;
    color: var(--text-muted);
    margin-top: -12px;
    margin-bottom: 16px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    font-weight: 600;
}
.tier-legendary .result-tagline { color: var(--legendary); }
.tier-mythical .result-tagline { color: var(--mythical); animation: tagline-pulse 1.4s ease-in-out infinite; }
@keyframes tagline-pulse {
    0%, 100% { opacity: 0.7; }
    50%      { opacity: 1; }
}

/* Реверс-конфетти для mythical */
.confetti-burst {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 999;
}
.confetti-piece {
    position: absolute;
    width: 8px;
    height: 14px;
    top: -20px;
    will-change: transform;
    animation: confetti-fall 2.5s ease-out forwards;
}
@keyframes confetti-fall {
    to { transform: translateY(110vh) rotate(720deg); opacity: 0; }
}

/* Typewriter caret */
.typing::after {
    content: '▍';
    color: var(--accent);
    animation: caret-blink 0.7s steps(1) infinite;
    margin-left: 2px;
}
@keyframes caret-blink { 50% { opacity: 0; } }

/* Бейдж экономии — анимация выезда с пружинкой */
.price-savings.pop-in {
    animation: savings-pop 0.55s cubic-bezier(.34,1.56,.64,1);
}
@keyframes savings-pop {
    0%   { opacity: 0; transform: scale(0.6) translateY(10px); }
    60%  { opacity: 1; transform: scale(1.08); }
    100% { opacity: 1; transform: scale(1); }
}

.result-header {
    font-size: 12px;
    letter-spacing: 2px;
    color: var(--text-muted);
    margin-bottom: 12px;
}
.result-tier {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2px;
    font-family: 'SF Mono', Menlo, monospace;
}
.tier-common .result-tier { color: var(--common); }
.tier-rare .result-tier { color: var(--rare); }
.tier-epic .result-tier { color: var(--epic); }
.tier-legendary .result-tier { color: var(--legendary); }
.tier-mythical .result-tier { color: var(--mythical); }
.result-prize { margin: 20px 0; }
.prize-maker {
    font-size: 13px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 4px;
}
.prize-name {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.3;
}
.result-pricing {
    margin: 16px 0 8px;
    padding: 14px 14px 12px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.02);
}
.price-market-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-size: 13px;
    color: var(--text-muted);
}
.price-market {
    position: relative;
    color: var(--text-muted);
}
/* Анимированное зачёркивание: линия прорезает цену слева направо */
.price-market::after {
    content: '';
    position: absolute;
    left: -3px;
    right: -3px;
    top: 52%;
    height: 2px;
    border-radius: 1px;
    background: rgba(255, 90, 90, 0.85);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.35s cubic-bezier(.6,.04,.3,1);
}
.price-market.struck::after { transform: scaleX(1); }
.price-vstradar-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
}
.price-vstradar-label {
    font-size: 13px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.price-vstradar {
    font-size: 22px;
    font-weight: 700;
    color: var(--success);
    font-variant-numeric: tabular-nums;
}
.price-savings {
    margin-top: 8px;
    text-align: right;
    font-size: 12px;
    font-weight: 600;
    color: var(--success);
    letter-spacing: 0.3px;
}
.result-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 16px;
}

/* ===== CTA-ИЕРАРХИЯ: «Забрать» доминирует, рероллы — второй план ===== */
.btn-claim {
    width: 100%;
    padding: 16px;
    font-size: 16px;
    font-weight: 800;
    letter-spacing: 1px;
    border: none;
    border-radius: 12px;
    color: #0b0d12;
    background: var(--success);
    box-shadow: 0 4px 18px rgba(46, 213, 115, 0.35);
    cursor: pointer;
    transition: transform 0.12s ease, box-shadow 0.2s ease;
}
.btn-claim:active { transform: scale(0.97); }
.tier-epic .btn-claim      { background: var(--epic); box-shadow: 0 4px 18px rgba(185,103,255,0.4); color: #fff; }
.tier-legendary .btn-claim { background: linear-gradient(180deg, #ffc84d, var(--legendary)); box-shadow: 0 4px 22px rgba(255,174,0,0.45); }
.tier-mythical .btn-claim  { background: linear-gradient(180deg, #ff4dc4, var(--mythical)); box-shadow: 0 4px 22px rgba(255,0,170,0.45); color: #fff; }
/* Подпись-пояснение над платными рероллами: цены без контекста читаются как загадка */
.reroll-label {
    font-family: 'JetBrains Mono', 'SF Mono', Menlo, monospace;
    font-size: 10px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--text-muted);
    text-align: center;
    margin-top: 6px;
}
.reroll-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}
.reroll-row .btn { font-size: 13px; padding: 11px 8px; }
/* ⭐ Stars 2.0: продажа ценности stars-реролла под кнопками */
.stars-reroll-hint {
    font-family: 'JetBrains Mono', 'SF Mono', Menlo, monospace;
    font-size: 10px;
    letter-spacing: 0.5px;
    color: var(--text-muted);
    text-align: center;
    margin-top: 4px;
}
/* ⭐ Stars 2.0: бейдж активного буста удачи на главной */
.stars-luck-badge {
    font-family: 'JetBrains Mono', 'SF Mono', Menlo, monospace;
    font-size: 11px;
    letter-spacing: 0.5px;
    color: #ffd166;
    text-align: center;
    margin-top: 8px;
    padding: 6px 8px;
    border: 1px dashed rgba(255, 209, 102, 0.45);
    border-radius: 8px;
    background: rgba(255, 209, 102, 0.07);
}

/* Ступенчатое появление кнопок после кульминации.
   Контекст и «Что я выбил?» гейтятся тем же механизмом — иначе «1 из N»
   читается раньше, чем напечатано имя плагина. */
.result-card.acts-wait .result-actions { opacity: 0; pointer-events: none; }
.result-card.acts-wait #btn-plugin-info,
.result-card.acts-wait #result-context { opacity: 0; pointer-events: none; }
.result-card.acts-in #btn-plugin-info { animation: act-in 0.4s cubic-bezier(.22,.9,.32,1) backwards; animation-delay: 0.02s; }
.result-card.acts-in #result-context { animation: act-in 0.4s cubic-bezier(.22,.9,.32,1) backwards; animation-delay: 0.1s; }
.result-card.acts-in .result-actions { opacity: 1; pointer-events: auto; }
.result-card.acts-in .result-actions > * {
    animation: act-in 0.4s cubic-bezier(.22,.9,.32,1) backwards;
}
.result-card.acts-in .result-actions > :nth-child(1) { animation-delay: 0.05s; }
.result-card.acts-in .result-actions > :nth-child(2) { animation-delay: 0.16s; }
.result-card.acts-in .result-actions > :nth-child(3) { animation-delay: 0.24s; }
.result-card.acts-in .result-actions > :nth-child(4) { animation-delay: 0.32s; }
.result-card.acts-in .result-actions > :nth-child(5) { animation-delay: 0.40s; }
/* 6–8 — share и legacy-кнопки («Скачать» / «Крутить дальше») */
.result-card.acts-in .result-actions > :nth-child(6) { animation-delay: 0.48s; }
.result-card.acts-in .result-actions > :nth-child(7) { animation-delay: 0.56s; }
.result-card.acts-in .result-actions > :nth-child(8) { animation-delay: 0.64s; }
@keyframes act-in {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: none; }
}

/* ===== ТИР-ЧИП: осциллограмма + имя тира вместо emoji ===== */
.result-tier-chip {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 5px 12px;
    margin-bottom: 14px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.03);
}
.tier-chip-wave {
    width: 22px;
    height: 16px;
    display: block;
}
.tier-common .result-tier-chip    { color: var(--common); border-color: rgba(170,180,203,0.4); }
.tier-rare .result-tier-chip      { color: var(--rare); border-color: rgba(0,212,255,0.4); }
.tier-epic .result-tier-chip      { color: var(--epic); border-color: rgba(185,103,255,0.45); }
.tier-legendary .result-tier-chip { color: var(--legendary); border-color: rgba(255,174,0,0.5); box-shadow: 0 0 12px rgba(255,174,0,0.2); }
.tier-mythical .result-tier-chip  { color: var(--mythical); border-color: rgba(255,0,170,0.5); box-shadow: 0 0 12px rgba(255,0,170,0.25); }

/* ===== КОНТЕКСТ ДРОПА: редкость / перцентиль / sunk value / дефицит ===== */
.result-context {
    margin: 10px 0 2px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.result-context:empty { display: none; }
.ctx-line {
    font-size: 12px;
    color: var(--text-muted);
    letter-spacing: 0.3px;
}
.ctx-line.ctx-hot { color: var(--legendary); }
.ctx-line.ctx-scarce { color: #ff6b6b; }

/* ===== PITY-TEASE над рероллами (только common/rare) ===== */
.pity-tease {
    font-size: 12px;
    color: var(--mythical);
    letter-spacing: 0.3px;
    padding: 2px 0;
}

/* ===== ВИНЬЕТКА ЭКРАНА РЕЗУЛЬТАТА ===== */
.result-vignette {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    opacity: 0;
    transition: opacity 0.8s ease;
    background: radial-gradient(ellipse 120% 90% at 50% 38%, transparent 45%, rgba(0,0,0,0.55) 100%);
}
.result-vignette.on { opacity: 1; }
.fx-low .result-vignette { display: none; }

/* Базовый слой фольги (материалы тиров — стили по классам tier-*) */
.card-foil {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}
.result-card > :not(.card-foil),
.claim-card > :not(.card-foil) { position: relative; z-index: 1; }

/* ===== ТИР-МАТЕРИАЛЫ: графит → стекло → нойз → brushed gold → holo foil ===== */
.tier-common .card-foil {
    background: linear-gradient(165deg, rgba(255,255,255,0.04) 0%, transparent 45%);
}
.tier-rare .card-foil {
    background:
        linear-gradient(165deg, rgba(0,212,255,0.10) 0%, transparent 50%),
        radial-gradient(ellipse 90% 60% at 50% 0%, rgba(0,212,255,0.06), transparent 70%);
}
.tier-epic .card-foil {
    background:
        linear-gradient(165deg, rgba(185,103,255,0.14) 0%, transparent 55%),
        radial-gradient(ellipse 90% 60% at 50% 0%, rgba(185,103,255,0.09), transparent 70%),
        repeating-linear-gradient(45deg, rgba(255,255,255,0.015) 0 2px, transparent 2px 4px);
}
.tier-legendary .card-foil {
    /* brushed gold: тонкие вертикальные штрихи металла */
    background:
        linear-gradient(165deg, rgba(255,174,0,0.16) 0%, transparent 60%),
        repeating-linear-gradient(90deg, rgba(255,200,80,0.05) 0 1px, transparent 1px 3px);
}
.tier-legendary .card-foil::after {
    /* sheen-sweep: блик медленно проезжает по золоту */
    content: '';
    position: absolute;
    inset: -40%;
    background: linear-gradient(115deg, transparent 42%, rgba(255,235,170,0.16) 50%, transparent 58%);
    animation: foil-sheen 3.4s ease-in-out infinite;
}
@keyframes foil-sheen {
    0%        { transform: translateX(-55%); }
    55%, 100% { transform: translateX(55%); }
}
.tier-mythical .card-foil {
    /* holo foil: радужный conic; центр сдвигается тилтом (--tx/--ty из JS) */
    background:
        conic-gradient(from 210deg at calc(50% + var(--tx, 0px)) calc(38% + var(--ty, 0px)),
            rgba(255,0,170,0.20), rgba(120,80,255,0.16), rgba(0,212,255,0.14),
            rgba(0,255,170,0.10), rgba(255,220,0,0.13), rgba(255,0,170,0.20)),
        linear-gradient(165deg, rgba(255,0,170,0.07), transparent 60%);
    filter: saturate(1.25);
    animation: foil-hue 8s linear infinite;
}
/* Когда фольгой рулит живой тилт (DeviceOrientation) — авто-дрейф выключаем */
.result-card.tilt-live .card-foil { animation: none; }
@keyframes foil-hue {
    to { filter: saturate(1.25) hue-rotate(360deg); }
}
.fx-low .tier-legendary .card-foil::after { display: none; }
.fx-low .tier-mythical .card-foil { animation: none; }

/* ===== BURN-РИТУАЛ: карточка сгорает перед рероллом ===== */
.result-card.burn {
    animation: card-burn 0.3s ease-in forwards;
}
@keyframes card-burn {
    to {
        opacity: 0;
        transform: scale(0.92) translateY(8px);
        filter: brightness(1.7) saturate(0.3);
    }
}

/* ===== AMBIENT-ЧАСТИЦЫ (mythical, FX_LEVEL 2) ===== */
.ambient-wrap {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 5;
    overflow: hidden;
}
.ambient-dot {
    position: absolute;
    bottom: -10px;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: var(--mythical);
    box-shadow: 0 0 6px rgba(255, 0, 170, 0.8);
    animation: ambient-rise linear infinite;
}
@keyframes ambient-rise {
    from { transform: translateY(0); }
    to   { transform: translateY(-108vh) translateX(18px); }
}

/* ===== CLAIM CARD ===== */
.claim-card {
    background: var(--bg-card);
    border: 1px solid var(--success);
    border-radius: 12px;
    padding: 24px;
    text-align: center;
    margin-top: 40px;
}
.claim-header {
    font-size: 16px;
    font-weight: 700;
    color: var(--success);
    margin-bottom: 14px;
}
.claim-prize {
    font-size: 18px;
    margin-bottom: 20px;
}
.claim-code-box {
    background: var(--bg);
    border: 1px dashed var(--border);
    border-radius: 8px;
    padding: 14px;
    margin: 16px 0 20px;
}
.claim-code-label {
    font-size: 11px;
    color: var(--text-muted);
    letter-spacing: 1px;
    margin-bottom: 8px;
}
.claim-code {
    font-family: 'SF Mono', Menlo, monospace;
    font-size: 16px;
    font-weight: 700;
    word-break: break-all;
    margin-bottom: 10px;
    user-select: all;
}

.claim-auth-box {
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 12px 14px;
    margin: 0 0 16px;
    text-align: left;
}
.claim-auth-label {
    font-size: 11px;
    color: var(--text-muted);
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 6px;
}
.claim-auth {
    font-size: 14px;
    line-height: 1.5;
    color: var(--text);
    white-space: pre-wrap;
    word-break: break-word;
}
/* Кликабельная ссылка в тексте активации (тап = копировать) */
.auth-link {
    color: var(--accent);
    text-decoration: underline;
    word-break: break-all;
    cursor: pointer;
}
.auth-link:active { opacity: 0.6; }

/* ===== CLAIMED: тир-тема, лицензионная карта, блок «Дальше» ===== */
.claim-card { position: relative; }
.claim-card.tier-rare      { border-color: var(--rare); box-shadow: 0 0 24px rgba(0,212,255,0.18); }
.claim-card.tier-epic      { border-color: var(--epic); box-shadow: 0 0 28px rgba(185,103,255,0.22); }
.claim-card.tier-legendary { border-color: var(--legendary); box-shadow: 0 0 36px rgba(255,174,0,0.28); }
.claim-card.tier-mythical  { border-color: var(--mythical); box-shadow: 0 0 36px rgba(255,0,170,0.28); }
.claim-tier {
    font-family: 'SF Mono', Menlo, monospace;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    margin: -6px 0 10px;
}
.tier-common .claim-tier    { color: var(--common); }
.tier-rare .claim-tier      { color: var(--rare); }
.tier-epic .claim-tier      { color: var(--epic); }
.tier-legendary .claim-tier { color: var(--legendary); }
.tier-mythical .claim-tier  { color: var(--mythical); }
.btn-copy-code.copied { color: var(--success); border-color: var(--success); }
.claim-next {
    margin: 4px 0 16px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.02);
    display: flex;
    flex-direction: column;
    gap: 8px;
    text-align: center;
}
.claim-next-title {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;
    color: var(--text-muted);
}
.claim-token-progress { margin-bottom: 2px; }
.claim-token-bar {
    height: 6px;
    border-radius: 3px;
    background: rgba(255, 255, 255, 0.06);
    overflow: hidden;
}
.claim-token-fill {
    height: 100%;
    width: 0;
    border-radius: 3px;
    background: linear-gradient(90deg, var(--accent), var(--epic));
    transition: width 0.8s cubic-bezier(.22,.9,.32,1);
}
.claim-token-label {
    margin-top: 6px;
    font-size: 12px;
    color: var(--text-muted);
}

/* ===== HISTORY ===== */
.history-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 20px;
}
.history-item {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    font-size: 13px;
}
/* 💾 Полка артефактов — найденные legacy-мемы */
.legacy-shelf {
    background: var(--bg-card);
    border: 1px solid rgba(139, 148, 163, 0.35);
    border-left: 3px solid var(--legacy);
    border-radius: 10px;
    padding: 12px;
    font-size: 13px;
}
.legacy-shelf-title {
    font-family: 'JetBrains Mono', 'SF Mono', Menlo, monospace;
    font-size: 12px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--legacy);
    margin-bottom: 8px;
}
.legacy-shelf-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    padding: 6px 0;
    border-top: 1px solid var(--border);
}
.legacy-shelf-name { color: var(--text); }
.legacy-shelf-dl {
    background: none;
    border: 1px solid rgba(139, 148, 163, 0.4);
    border-radius: 8px;
    padding: 6px 12px;
    font-size: 15px;
    line-height: 1;
    cursor: pointer;
}
.history-item.tier-legendary { border-left: 3px solid var(--legendary); }
.history-item.tier-mythical  { border-left: 3px solid var(--mythical);  }
.history-item.tier-epic      { border-left: 3px solid var(--epic);      }
.history-item.tier-rare      { border-left: 3px solid var(--rare);      }
.history-item .hi-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
}
.history-item .hi-name { font-weight: 600; }
.history-item .hi-meta { color: var(--text-muted); font-size: 11px; margin-top: 2px; }
.history-item .hi-status {
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.history-item .hi-status.claimed { background: rgba(46, 213, 115, 0.15); color: var(--success); }
.history-item .hi-status.pending { background: rgba(255, 174, 0, 0.15); color: var(--legendary); }
.history-item .hi-status.rerolled { background: rgba(123, 129, 145, 0.15); color: var(--text-muted); }

/* Код активации внутри истории дропов */
.history-item .hi-code { border-top: 1px solid var(--border); padding-top: 8px; }
.history-item .hi-code-toggle {
    width: 100%;
    background: transparent;
    border: 1px dashed var(--border);
    color: var(--text-muted);
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 12px;
    cursor: pointer;
}
.history-item .hi-code-toggle:active { opacity: 0.7; }
.history-item .hi-code-reveal {
    margin-top: 8px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.history-item .hi-code-value {
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 10px;
    font-family: monospace;
    font-size: 13px;
    color: var(--text);
    word-break: break-all;
    user-select: all;
}
.history-item .hi-code-copy {
    align-self: flex-start;
    background: var(--bg-card);
    border: 1px solid var(--border);
    color: var(--text);
    border-radius: 8px;
    padding: 6px 12px;
    font-size: 12px;
    cursor: pointer;
}
.history-item .hi-code-copy:active { opacity: 0.7; }
.history-item .hi-code-auth {
    color: var(--text-muted);
    font-size: 11px;
    line-height: 1.4;
    white-space: pre-wrap;
    word-break: break-word;
}

/* ===== СТАТИСТИКА ЮЗЕРА ===== */
.stats-card {
    margin: 12px 0 16px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(0, 212, 255, 0.04) 0%, rgba(0,0,0,0) 100%);
}
.stats-title {
    font-size: 11px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin-bottom: 10px;
}
.stats-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.stats-cell {
    background: rgba(255,255,255,0.03);
    border-radius: 8px;
    padding: 8px 12px;
}
.stats-cell-label {
    font-size: 11px;
    color: var(--text-muted);
    margin-bottom: 2px;
}
.stats-cell-value {
    font-size: 18px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--text);
}
.stats-best {
    margin-top: 10px;
    padding: 8px 12px;
    background: rgba(255,255,255,0.03);
    border-radius: 8px;
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
}
.stats-best-label {
    font-size: 11px;
    color: var(--text-muted);
    flex-shrink: 0;
}
.stats-best-value {
    font-size: 12px;
    font-weight: 600;
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ===== PITY BAR (legacy, скрыт по умолчанию) ===== */
.pity-card {
    margin: 12px 0 16px;
    padding: 12px 14px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(255, 0, 170, 0.05) 0%, rgba(0,0,0,0) 100%);
    position: relative;
    overflow: hidden;
}
.pity-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 8px;
}
.pity-label {
    font-size: 12px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 1px;
}
.pity-counter {
    font-size: 13px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--mythical);
}
.pity-bar {
    height: 8px;
    background: rgba(255,255,255,0.06);
    border-radius: 4px;
    overflow: hidden;
}
.pity-fill {
    height: 100%;
    width: 0%;
    background: linear-gradient(90deg, var(--epic), var(--mythical));
    border-radius: 4px;
    box-shadow: 0 0 8px rgba(255, 0, 170, 0.4);
    transition: width 0.6s ease;
}
.pity-hint {
    margin-top: 6px;
    font-size: 11px;
    color: var(--text-muted);
    text-align: right;
    font-style: italic;
}

/* ===== TICKER (внутри шапки, full-bleed) ===== */
.drops-feed {
    margin: 10px 0 0;
    padding: 0;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    background: transparent;
    overflow: hidden;
    position: relative;
    z-index: 1;
    height: 28px;
    display: flex;
    align-items: center;
    pointer-events: none;       /* лента не перехватывает тапы у шапки */
    text-align: left;           /* шапка центрирует текст — тикеру нельзя */
}
/* Тикер становится нижней кромкой шапки: её собственный бордер и паддинг гасим */
.term-header--hero:has(.drops-feed:not(.hidden)) {
    border-bottom: none;
    padding-bottom: 0;
}
/* Маска-обёртка: плавное затухание текста по краям ленты.
   Маска на статичной обёртке, не на .drops-track (transform утащил бы её с собой)
   и не на .drops-feed (растворила бы линии border по краям). */
.drops-mask {
    width: 100%;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(to right, transparent, #000 44px, #000 calc(100% - 44px), transparent);
    mask-image: linear-gradient(to right, transparent, #000 44px, #000 calc(100% - 44px), transparent);
}
/* Слабые устройства: лента статична, видны первые элементы */
.fx-low .drops-track { animation: none !important; }
.drops-track {
    display: flex;
    width: max-content;            /* КРИТИЧНО: ширина = контент (A+A), иначе -50% считается от feed → рывок */
    animation: drops-marquee 120s linear infinite;
    white-space: nowrap;
    will-change: transform;
}
/* Трек = две одинаковые половины (A+A). Сдвиг -50% = ровно ширина одной половины →
   в этот момент вторая половина встаёт на место первой → бесшовная петля без видимого перехода.
   Отступ между элементами — на .drop-item (margin-right), не на gap трека (иначе межкопийный зазор). */
@keyframes drops-marquee {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}
.drop-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-right: 18px;
    font-family: 'SF Mono', Menlo, Consolas, monospace;
    font-size: 11px;
    letter-spacing: 1px;
    color: var(--text-muted);
}
/* Разделитель — приглушённый, без неона: полоса должна быть тише баннера */
.drop-item::after {
    content: '▪';
    margin-left: 12px;
    color: rgba(154, 163, 178, 0.4);
    font-weight: 400;
}
.drop-item.drop-sys {
    color: var(--text-muted);
    text-transform: uppercase;
}
/* Победу (тип B) отбивает сам 🔥 — точка ни до, ни после неё не нужна:
   глушим ::after у самой победы (точка после) и у элемента ПЕРЕД ней (точка до). */
.drop-item.drop-win::after { content: none; }
.drop-item:has(+ .drop-win)::after { content: none; }
.drop-item .drop-tier-emoji { font-size: 14px; }
.drop-item .drop-user { color: var(--text); font-weight: 600; }
.drop-item .drop-name { color: var(--text-muted); }
/* Ник всегда одного цвета — тир показывает эмодзи слева, без перекраски ника */

/* Тип A — бренд пула: нейтральный, чистое имя (без иконки, разделитель — общий «•») */
.drop-brand .drop-brand-name { color: var(--text); font-weight: 600; }

/* Тип B — настоящая ALPHA/SIGMA-победа: акцентнее бренда, цвет под тир */
.drop-win .drop-win-fire { font-size: 14px; }
.drop-win .drop-user { font-weight: 700; }
.drop-win.tier-legendary .drop-user,
.drop-win.tier-legendary .drop-name { color: var(--legendary); text-shadow: 0 0 8px rgba(255, 174, 0, 0.45); }
.drop-win.tier-mythical .drop-user,
.drop-win.tier-mythical .drop-name { color: var(--mythical); text-shadow: 0 0 8px rgba(255, 0, 170, 0.45); }

/* ===== POOL SHOWCASE (FOMO) ===== */
.pool-showcase {
    margin: 12px 0 16px;
    padding: 12px 14px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--bg-card);
}
.pool-showcase-title {
    font-size: 11px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin-bottom: 8px;
}
.pool-tiers {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 6px;
}
.pool-tier {
    text-align: center;
    padding: 8px 2px;
    border-radius: 8px;
    background: rgba(0, 212, 255, 0.02);
    border: 1px solid var(--border);
    transition: box-shadow 0.3s ease, border-color 0.3s ease, opacity 0.3s ease;
}
.pool-tier-emoji { font-size: 18px; line-height: 1; }
.pool-tier-emoji svg {
    width: 24px;
    height: 32px;
    display: inline-block;
    vertical-align: middle;
    transition: color 0.3s ease, filter 0.3s ease;
}
.pool-tier-count {
    font-size: 15px;
    font-weight: 700;
    margin-top: 3px;
    font-variant-numeric: tabular-nums;
    color: var(--text);
}
.pool-tier-label {
    font-size: 9px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 1px;
    transition: color 0.3s ease, font-weight 0.3s ease, text-shadow 0.3s ease;
}
/* Подписи тиров: чем выше тир — тем ярче и жирнее cyan */
.pool-tier.tier-common .pool-tier-label    { color: var(--text-muted); font-weight: 500; }
.pool-tier.tier-rare .pool-tier-label      { color: #8fe3ff; font-weight: 600; }
.pool-tier.tier-epic .pool-tier-label      { color: #74b8d0; font-weight: 600; }
.pool-tier.tier-legendary .pool-tier-label { color: var(--rare); font-weight: 800; text-shadow: 0 0 6px rgba(0, 212, 255, 0.4); }
.pool-tier.tier-mythical .pool-tier-label  { color: #e25aa6; font-weight: 800; text-shadow: 0 0 7px rgba(201, 46, 135, 0.5); }

/* ===== Прогрессивное cyan-свечение пула: BASIC угасает → SIGMA сияет ===== */
/* BASIC (common) — приглушённый, почти выключенный */
.pool-tier.tier-common {
    opacity: 0.65;
    border-color: rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.025);
}
.pool-tier.tier-common .pool-tier-emoji { color: var(--text-muted); }
.pool-tier.tier-common .pool-tier-count { color: var(--text-muted); }
.pool-tier.tier-rare .pool-tier-emoji      { color: #8fe3ff; }
.pool-tier.tier-epic .pool-tier-emoji      { color: #74b8d0; }
.pool-tier.tier-legendary .pool-tier-emoji { color: var(--rare); filter: drop-shadow(0 0 4px rgba(0, 212, 255, 0.5)); }
.pool-tier.tier-mythical .pool-tier-emoji  { color: #d4318f; filter: drop-shadow(0 0 6px rgba(201, 46, 135, 0.6)); }

/* STANDARD (rare) — лёгкое касание cyan */
.pool-tier.tier-rare {
    opacity: 0.78;
    border-color: rgba(0, 212, 255, 0.28);
}
.pool-tier.tier-rare .pool-tier-count { color: #8fe3ff; }

/* PRO (epic) — cyan-обводка + мягкое свечение */
.pool-tier.tier-epic {
    border-color: rgba(0, 212, 255, 0.32);
    box-shadow: inset 0 0 8px rgba(0, 212, 255, 0.04);
}
.pool-tier.tier-epic .pool-tier-count { color: #74b8d0; }

/* ELITE (legendary) — ярче и заметнее */
.pool-tier.tier-legendary {
    border-color: rgba(0, 212, 255, 0.8);
    box-shadow: 0 0 16px rgba(0, 212, 255, 0.3), inset 0 0 10px rgba(0, 212, 255, 0.1);
}
.pool-tier.tier-legendary .pool-tier-count {
    color: var(--rare);
    text-shadow: 0 0 8px rgba(0, 212, 255, 0.45);
}

/* SIGMA (mythical) — максимальное свечение + пульс */
.pool-tier.tier-mythical {
    border-color: #c92e87;
    box-shadow: 0 0 14px rgba(201, 46, 135, 0.32), inset 0 0 12px rgba(201, 46, 135, 0.14);
    animation: pool-sigma-pulse 2.6s ease-in-out infinite;
}
.pool-tier.tier-mythical .pool-tier-count {
    color: #e25aa6;
    text-shadow: 0 0 8px rgba(201, 46, 135, 0.45);
}
@keyframes pool-sigma-pulse {
    0%, 100% { box-shadow: 0 0 12px rgba(201, 46, 135, 0.28), inset 0 0 10px rgba(201, 46, 135, 0.12); }
    50%      { box-shadow: 0 0 20px rgba(201, 46, 135, 0.45), inset 0 0 14px rgba(201, 46, 135, 0.18); }
}

/* Спин-каунтер цены при ревиле */
.price-vstradar {
    font-variant-numeric: tabular-nums;
    transition: color 0.2s ease;
}
.price-vstradar.counting { color: var(--accent); }

/* ===== «Подробнее о плагине» — кнопка-ссылка ===== */
.btn-info-link {
    display: block;
    margin: 4px auto 12px;
    padding: 4px 10px;
    background: transparent;
    border: 1px solid var(--border);
    border-radius: 16px;
    color: var(--accent);
    font-size: 12px;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.btn-info-link:active {
    background: rgba(0, 212, 255, 0.08);
}

/* ===== Модальный лист «О плагине» ===== */
.info-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    z-index: 998;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    animation: overlay-fade 0.2s ease;
}
@keyframes overlay-fade {
    from { opacity: 0; }
    to   { opacity: 1; }
}
.info-sheet {
    width: 100%;
    max-width: 480px;
    max-height: 85vh;
    overflow-y: auto;
    background: var(--bg-card);
    border-top-left-radius: 18px;
    border-top-right-radius: 18px;
    padding: 18px 18px 30px;
    position: relative;
    animation: sheet-rise 0.28s cubic-bezier(.18,.74,.12,1.0);
}
@keyframes sheet-rise {
    from { transform: translateY(100%); }
    to   { transform: translateY(0); }
}
.info-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: none;
    background: rgba(255, 255, 255, 0.08);
    color: var(--text);
    font-size: 16px;
    cursor: pointer;
    z-index: 2;
}
.info-image-wrap {
    width: 100%;
    aspect-ratio: 16 / 9;
    background: rgba(255, 255, 255, 0.04);
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.info-image-wrap img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}
.info-image-wrap img[src=""] { display: none; }
.info-maker {
    font-size: 12px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 1.2px;
    margin-bottom: 4px;
}
.info-name {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.25;
    margin-bottom: 10px;
}
.info-tag {
    display: inline-block;
    padding: 3px 10px;
    background: rgba(0, 212, 255, 0.1);
    color: var(--accent);
    border-radius: 12px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    margin-bottom: 12px;
}
.info-description {
    font-size: 14px;
    line-height: 1.5;
    color: var(--text);
    margin-bottom: 16px;
    white-space: pre-wrap;
}
.info-description.empty {
    color: var(--text-muted);
    font-style: italic;
}
#info-link {
    display: inline-block;
    text-decoration: none;
}

/* ===== БОНУС-ИСХОДЫ (реролл / +$SIG) ===== */
/* Цвет cyan #00dcdc. Скромнее топ-тиров (ALPHA/SIGMA): без вращающихся бликов,
   без пульсации — это приятный бонус, а не главный приз. */

/* Бонус-ячейки на ленте барабана */
.strip-item.bonus-reroll,
.strip-item.bonus-sig {
    color: #00dcdc;
    text-shadow: 0 0 10px rgba(0, 220, 220, 0.45);
}
.strip-item.bonus-reroll::before,
.strip-item.bonus-sig::before {
    border-color: rgba(0, 220, 220, 0.3);
    background: linear-gradient(180deg, rgba(0, 220, 220, 0.09), rgba(0, 0, 0, 0.25));
}

/* 💾 Legacy-ячейка — по образцу bonus-sig, но серая и без свечения */
.strip-item.bonus-legacy {
    color: var(--legacy);
    text-shadow: none;
}
.strip-item.bonus-legacy::before {
    border-color: rgba(139, 148, 163, 0.3);
    background: linear-gradient(180deg, rgba(139, 148, 163, 0.09), rgba(0, 0, 0, 0.25));
}

/* 🐟 Fish-ячейка — серебристо-циановая, скромная */
.strip-item.bonus-fish {
    color: #9fd6df;
    text-shadow: 0 0 8px rgba(159, 214, 223, 0.35);
}
.strip-item.bonus-fish::before {
    border-color: rgba(159, 214, 223, 0.3);
    background: linear-gradient(180deg, rgba(159, 214, 223, 0.08), rgba(0, 0, 0, 0.25));
}
/* Хореография побега: дёргается → уходит вверх с фейдом → бледный след */
.strip-item.fish-wiggle { animation: fish-wiggle 0.35s ease-in-out 1; }
@keyframes fish-wiggle {
    0%, 100% { transform: rotate(0deg); }
    16% { transform: rotate(8deg); }
    33% { transform: rotate(-8deg); }
    50% { transform: rotate(8deg); }
    66% { transform: rotate(-8deg); }
    83% { transform: rotate(6deg); }
}
.strip-item.fish-escape { animation: fish-escape 0.3s ease-in forwards; }
@keyframes fish-escape {
    to { transform: translateY(-26px) rotate(-14deg); opacity: 0; }
}
.strip-item.fish-gone { opacity: 0.25; }

/* Карточка бонус-результата */
.bonus-card {
    background: var(--bg-card);
    border: 1px solid #00dcdc;
    border-radius: 12px;
    padding: 32px 24px;
    text-align: center;
    margin-top: 40px;
    box-shadow: 0 0 26px rgba(0, 220, 220, 0.18);
    animation: card-rise 0.45s cubic-bezier(.18,.74,.12,1.0);
}
.bonus-icon {
    font-size: 46px;
    line-height: 1;
    margin-bottom: 14px;
    filter: drop-shadow(0 0 12px rgba(0, 220, 220, 0.5));
}
.bonus-header {
    font-family: 'JetBrains Mono', 'SF Mono', Menlo, monospace;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: 1px;
    color: #00dcdc;
    text-shadow: 0 0 14px rgba(0, 220, 220, 0.4);
    margin-bottom: 8px;
}
.bonus-sub {
    font-family: 'JetBrains Mono', 'SF Mono', Menlo, monospace;
    font-size: 13px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--text-muted);
    margin-bottom: 24px;
}
/* 🐟 Акцент суммы чешуи в описании язя */
.bonus-sub .fish-sig {
    color: #00dcdc;
    text-shadow: 0 0 10px rgba(0, 220, 220, 0.4);
    white-space: nowrap;
}
.bonus-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* Тонкий скроллбар под тёмную тему (WebKit: Telegram desktop, Chrome/Edge) */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
    background: rgba(0, 212, 255, 0.25);
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover { background: rgba(0, 212, 255, 0.4); }
/* Firefox */
html { scrollbar-width: thin; scrollbar-color: rgba(0,212,255,0.25) transparent; }

/* ===== GLOW TUNER (только для dev-id 637262710) ===== */
.glow-tuner {
    position: fixed;
    top: 8px;
    left: 8px;
    right: 8px;
    z-index: 9999;
    padding: 8px 12px;
    background: #0a0e16;            /* плотный фон вместо backdrop-filter — он глючит на мобиле при перетаскивании */
    border: 1px solid rgba(0, 200, 255, 0.35);
    border-radius: 12px;
    box-shadow: 0 0 18px rgba(0, 200, 255, 0.25);
    font-size: 11px;
    color: #fff;
}
.glow-tuner-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 700;
    margin-bottom: 8px;
}
.glow-tuner-min {
    width: 22px;
    height: 22px;
    border: none;
    border-radius: 6px;
    background: rgba(0, 200, 255, 0.18);
    color: #fff;
    cursor: pointer;
    font-size: 14px;
    line-height: 1;
}
.glow-tuner.collapsed .glow-tuner-body { display: none; }
/* горизонтальная сетка 2 колонки — панель широкая и низкая, не лезет к кнопке снизу */
.glow-tuner-body {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px 14px;
    align-items: end;
}
.glow-tuner-body label { display: flex; flex-direction: column; gap: 2px; color: rgba(255,255,255,0.85); }
.glow-tuner-body label b { color: #19e6d2; }
.glow-tuner-body input[type=range] { width: 100%; accent-color: #00c6ff; margin: 0; }
.glow-tuner-reset {
    grid-column: 1 / -1;        /* кнопка сброса на всю ширину под сеткой */
    margin-top: 2px;
    padding: 6px;
    border: 1px solid rgba(255, 30, 160, 0.4);
    border-radius: 8px;
    background: transparent;
    color: #ff5cc0;
    cursor: pointer;
    font-size: 12px;
}

/* ===== REDUCED MOTION ===== */
@media (prefers-reduced-motion: reduce) {
    .confetti-burst, .arming-flash { display: none; }
    .result-card.tier-legendary,
    .result-card.tier-mythical { animation: none; }
    .result-card.tier-mythical::before,
    .result-card.tier-legendary::before { animation: none; }
    .drops-track { animation: none !important; }
    .ambient-wrap, .fx-burst { display: none; }
    .tier-legendary .card-foil::after { display: none; }
    .tier-mythical .card-foil { animation: none; }
    .prize-shot-skeleton { animation: none; }
    .result-card.acts-in .result-actions > * { animation: none; }
    .result-card.acts-in #btn-plugin-info,
    .result-card.acts-in #result-context { animation: none; }
    .price-saved-value.stamp { animation: none; }
}

/* ===== SOUND TOGGLE ===== */
.snd-toggle {
    position: fixed;
    top: 10px;
    right: 10px;
    z-index: 900;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid var(--border);
    background: rgba(11, 13, 18, 0.65);
    backdrop-filter: blur(4px);
    font-size: 15px;
    line-height: 1;
    opacity: 0.65;
    cursor: pointer;
    transition: opacity 0.2s ease;
}
.snd-toggle:active { opacity: 1; }

/* ===== PITY CARD (видимая гарантия) ===== */
.pity-card {
    position: relative;
    background: var(--bg-card);
    border: 1px solid rgba(255, 0, 170, 0.25);
    border-radius: 12px;
    padding: 12px 14px;
    margin-top: 12px;
}
.pity-card .sig-help-pop {
    top: 36px;
    left: 14px;
}
.pity-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 8px;
}
.pity-title {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    color: var(--mythical);
    text-transform: uppercase;
}
.pity-counter {
    font-family: 'SF Mono', Menlo, monospace;
    font-size: 11px;
    color: var(--text-muted);
}
.pity-bar {
    height: 6px;
    border-radius: 3px;
    background: rgba(255, 255, 255, 0.06);
    overflow: hidden;
}
.pity-fill {
    height: 100%;
    border-radius: 3px;
    background: linear-gradient(90deg, #ff00aa, #ff5cc0);
    box-shadow: 0 0 8px rgba(255, 0, 170, 0.5);
    transition: width 0.6s ease;
}
.pity-hint {
    margin-top: 7px;
    font-size: 11px;
    color: var(--text-muted);
    line-height: 1.4;
}

/* ===== POOL SCARCITY ===== */
.pool-tier { position: relative; }
.pool-tier-scarcity {
    margin-top: 3px;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: #ff7b54;
    animation: scarcity-pulse 1.6s ease-in-out infinite;
}
.pool-tier--scarce .pool-tier-count { color: #ff7b54; }
@keyframes scarcity-pulse {
    0%, 100% { opacity: 0.65; }
    50%      { opacity: 1; }
}

/* ===== HISTORY TOTAL ===== */
.history-total {
    margin-top: 6px;
    font-size: 12px;
    color: var(--text-muted);
}
.history-total b { color: var(--accent); }

/* ===== B1: RARITY BLEED (антиципация на торможении) ===== */
.spin-strip {
    transition: border-color 0.9s ease, box-shadow 0.9s ease;
}
.spin-strip.bleed-legendary {
    border-color: rgba(255, 174, 0, 0.55);
    box-shadow: 0 0 34px rgba(255, 174, 0, 0.28), inset 0 0 30px rgba(255, 174, 0, 0.08);
}
.spin-strip.bleed-legendary .strip-pointer {
    border-color: var(--legendary);
    box-shadow: 0 0 24px rgba(255, 174, 0, 0.6), inset 0 0 26px rgba(255, 174, 0, 0.14);
    transition: box-shadow 0.9s ease, border-color 0.9s ease;
}
.spin-strip.bleed-mythical {
    border-color: rgba(255, 0, 170, 0.6);
    box-shadow: 0 0 38px rgba(255, 0, 170, 0.33), inset 0 0 34px rgba(255, 0, 170, 0.1);
    animation: bleed-myth-pulse 1.1s ease-in-out infinite;
}
.spin-strip.bleed-mythical .strip-pointer {
    border-color: var(--mythical);
    box-shadow: 0 0 26px rgba(255, 0, 170, 0.65), inset 0 0 28px rgba(255, 0, 170, 0.16);
    transition: box-shadow 0.9s ease, border-color 0.9s ease;
}
@keyframes bleed-myth-pulse {
    0%, 100% { box-shadow: 0 0 38px rgba(255, 0, 170, 0.33), inset 0 0 34px rgba(255, 0, 170, 0.1); }
    50%      { box-shadow: 0 0 54px rgba(255, 0, 170, 0.5), inset 0 0 40px rgba(255, 0, 170, 0.16); }
}

/* ===== B4: TIME DILATION (микро-zoom на финальных тиках) ===== */
.spin-stage {
    transition: transform 0.3s ease;
}
.spin-stage.finale {
    transform: scale(1.03);
}

/* ===== C1: TIER BUILDUP (затемнение + вспышка перед топ-дропом) ===== */
.tier-buildup {
    position: fixed;
    inset: 0;
    z-index: 997;
    pointer-events: none;
    background: #000;
    opacity: 0;
    animation: buildup-darken 0.75s ease-out forwards;
}
@keyframes buildup-darken {
    to { opacity: 0.94; }
}
.tier-buildup.flash {
    animation: buildup-flash 0.3s ease-out forwards;
}
.tier-buildup--legendary.flash { background: radial-gradient(circle at 50% 45%, rgba(255,174,0,0.85), #000 75%); }
.tier-buildup--mythical.flash  { background: radial-gradient(circle at 50% 45%, rgba(255,0,170,0.85), #000 75%); }
/* epic — для снапа fake-out (buildup на epic не бывает, но флэш переиспользуется) */
.tier-buildup--epic.flash      { background: radial-gradient(circle at 50% 45%, rgba(185,103,255,0.85), #000 75%); }
@keyframes buildup-flash {
    0%   { opacity: 0.94; }
    45%  { opacity: 1; }
    100% { opacity: 0; }
}

/* ===== 🎭 Fake-out «СБОЙ ТЕРМИНАЛА» ===== */
.fault-overlay {
    position: fixed; inset: 0; z-index: 999;
    background: rgba(0, 0, 0, 0.96);
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px;
    font-family: 'SF Mono', Menlo, monospace;
}
.fault-line { color: #ffb02e; font-size: 17px; line-height: 1.5; letter-spacing: 2px; text-align: center; padding: 0 24px; }
.fault-reboot { color: rgba(255, 176, 46, 0.6); font-size: 12px; letter-spacing: 3px; }
.fault-dots::after { content: '.'; animation: fault-dots 0.6s steps(1, end) infinite; }
@keyframes fault-dots {
    0%   { content: '.'; }
    33%  { content: '..'; }
    66%  { content: '...'; }
}
.result-card.glitch { animation: card-glitch 0.35s steps(2) 1; }
.result-card.glitch .prize-maker,
.result-card.glitch .result-header {
    text-shadow: 2px 0 rgba(255, 0, 170, 0.8), -2px 0 rgba(0, 212, 255, 0.8);
}
@keyframes card-glitch {
    0% { transform: translate(0, 0); }
    25% { transform: translate(2px, -1px); }
    50% { transform: translate(-2px, 1px); }
    75% { transform: translate(1px, 2px); }
    100% { transform: translate(0, 0); }
}

/* ===== 🎭 Фантомный тир OMEGA??? ===== */
.omega-flash {
    color: #ffffff !important;
    text-shadow: 2px 0 rgba(255, 0, 170, 0.8), -2px 0 rgba(0, 212, 255, 0.8);
    animation: omega-jitter 0.3s steps(3) 1;
}
@keyframes omega-jitter {
    0% { transform: translateX(0); }
    33% { transform: translateX(1.5px); }
    66% { transform: translateX(-1.5px); }
    100% { transform: translateX(0); }
}
.result-card.micro-shake { animation: micro-shake 0.15s linear 1; }
@keyframes micro-shake {
    0%, 100% { transform: translate(0, 0); }
    25% { transform: translate(1.5px, -1px); }
    50% { transform: translate(-1.5px, 1px); }
    75% { transform: translate(1px, 1.5px); }
}

/* ===== C3: ЭКОНОМИЯ-КУЛЬМИНАЦИЯ (отдельный блок, не строка чека) ===== */
.price-saved-finale {
    margin: 14px 0 4px;
    text-align: center;
}
.price-saved-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;
    color: var(--text-muted);
    margin-bottom: 2px;
}
.price-saved-value {
    font-size: 44px;
    line-height: 1.05;
    font-weight: 800;
    color: var(--success);
    font-variant-numeric: tabular-nums;
    letter-spacing: -1px;
    text-shadow: 0 0 22px rgba(46, 213, 115, 0.35);
}
.price-saved-value.counting { color: var(--success); }
.tier-epic .price-saved-value      { color: var(--epic); text-shadow: 0 0 22px rgba(185,103,255,0.4); }
.tier-legendary .price-saved-value { color: var(--legendary); text-shadow: 0 0 24px rgba(255,174,0,0.45); }
.tier-mythical .price-saved-value  { color: var(--mythical); text-shadow: 0 0 26px rgba(255,0,170,0.5); }
.price-saved-finale.pop-in {
    animation: savings-pop 0.55s cubic-bezier(.34,1.56,.64,1);
}
/* Штамп-удар по завершении каунт-апа */
.price-saved-value.stamp {
    animation: saved-stamp 0.42s cubic-bezier(.22,1.4,.36,1);
}
@keyframes saved-stamp {
    0%   { transform: scale(1.35); filter: brightness(1.8); }
    55%  { transform: scale(0.96); }
    100% { transform: scale(1); filter: none; }
}

/* ===== ПАКЕТ 5: A1 SVG-тайлы, A2 параллакс/CRT, A3 прожектор ===== */

/* A1 — тайл ленты: осциллограмма тира + декоративная подпись-бренд */
.strip-item {
    flex-direction: column;
    gap: 5px;
}
.strip-cell-icon {
    line-height: 0;
}
.strip-cell-icon svg {
    width: 62px;
    height: 34px;
    display: block;
}
.strip-cell-brand {
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.4);
    max-width: 118px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* Бонус-эмодзи в каркасе тайла: высота строки = высота SVG-осциллограммы,
   размер скромный — спец-клетка не должна выбиваться из ритма ленты */
.strip-cell-emoji {
    font-size: 22px;
    line-height: 34px;
}
.strip-item.bonus-reroll .strip-cell-brand,
.strip-item.bonus-sig .strip-cell-brand    { color: rgba(0, 220, 220, 0.55); }
.strip-item.bonus-legacy .strip-cell-brand { color: rgba(139, 148, 163, 0.6); }
.strip-item.bonus-fish .strip-cell-brand   { color: rgba(159, 214, 223, 0.55); }
/* Свечение осциллограммы по тиру (text-shadow не работает на SVG-stroke) */
.strip-item.rare .strip-cell-icon      { filter: drop-shadow(0 0 5px rgba(0,212,255,0.45)); }
.strip-item.epic .strip-cell-icon      { filter: drop-shadow(0 0 7px rgba(185,103,255,0.55)); }
.strip-item.legendary .strip-cell-icon { filter: drop-shadow(0 0 8px rgba(255,174,0,0.6)); }
.strip-item.mythical .strip-cell-icon  { filter: drop-shadow(0 0 9px rgba(255,0,170,0.7)); }
.strip-item.legendary .strip-cell-brand { color: rgba(255,174,0,0.55); }
.strip-item.mythical .strip-cell-brand  { color: rgba(255,0,170,0.6); }

/* A2 — параллакс-слой за лентой (JS двигает на 0.3× скорости, период 42px) */
.strip-parallax {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: calc(100% + 42px);
    z-index: 0;
    pointer-events: none;
    will-change: transform;
    background:
        repeating-linear-gradient(90deg,
            rgba(0, 212, 255, 0.07) 0 1px,
            transparent 1px 21px,
            rgba(255, 255, 255, 0.035) 21px 22px,
            transparent 22px 42px);
}
.strip-inner {
    position: relative;
    z-index: 1;
}
/* A2 — CRT-оверлей: scanlines + виньетка по краям окна */
.strip-crt {
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    background:
        repeating-linear-gradient(0deg,
            rgba(0, 0, 0, 0.12) 0 1px,
            transparent 1px 3px),
        radial-gradient(ellipse at center, transparent 55%, rgba(0, 0, 0, 0.35) 100%);
}
/* Гейт по железу: на слабых девайсах декоративные слои отключены */
.fx-low .strip-parallax,
.fx-low .strip-crt {
    display: none;
}

/* A3 — прожектор: во время прокрута всё вокруг окна ленты гаснет */
.spin-strip {
    transition: box-shadow 0.5s ease;
}
.spin-strip.spotlight {
    box-shadow: 0 0 0 100vmax rgba(0, 0, 0, 0.6);
}
/* Статус-лог остаётся читаемым над затемнением */
.spin-status {
    position: relative;
    z-index: 5;
}

/* ===== ПАКЕТ 6: A4 флаппер, A5 частицы, C2 tier climb, C4 тир-эффекты ===== */

/* A4 — флаппер-язычок: висит с верха зоны захвата, отклоняется на тиках (JS) */
.strip-flapper {
    position: absolute;
    top: 7px;
    left: 50%;
    transform: translateX(-50%);
    width: 4px;
    height: 16px;
    border-radius: 0 0 3px 3px;
    background: linear-gradient(180deg, var(--accent), rgba(0, 212, 255, 0.5));
    box-shadow: 0 0 6px rgba(0, 212, 255, 0.6);
    transform-origin: top center;
    z-index: 3;
    pointer-events: none;
}
.fx-low .strip-flapper { display: none; }

/* A5 — переиспользуемые частицы защёлка (контейнер позиционируется из JS) */
.spin-particles {
    position: fixed;
    width: 0;
    height: 0;
    z-index: 90;
    pointer-events: none;
}
.spin-particle {
    position: absolute;
    left: -3px;
    top: -3px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    opacity: 0;
}
.spin-particle.burst {
    animation: particle-fly 0.65s ease-out forwards;
}
@keyframes particle-fly {
    0%   { opacity: 1; transform: translate(0, 0) scale(1); }
    100% { opacity: 0; transform: translate(var(--dx), var(--dy)) scale(0.3); }
}

/* C2 — пульс бейджа тира на каждом шаге «взбирания» */
#result-tier.climb-tick {
    animation: climb-tick 0.16s ease-out;
}
@keyframes climb-tick {
    0%   { transform: scale(1); }
    45%  { transform: scale(1.14); }
    100% { transform: scale(1); }
}

/* C4 — epic: радиальный burst фиолетовых точек из карточки */
.fx-burst {
    position: fixed;
    width: 0;
    height: 0;
    z-index: 95;
    pointer-events: none;
}
.fx-burst-dot {
    position: absolute;
    left: -3px;
    top: -3px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--epic);
    box-shadow: 0 0 10px var(--epic);
    opacity: 0;
    animation: particle-fly 0.85s ease-out forwards;
}

/* C4 — legendary/mythical: золотые искры, поднимающиеся снизу экрана */
.fx-sparks {
    position: fixed;
    inset: 0;
    z-index: 95;
    pointer-events: none;
    overflow: hidden;
}
.fx-spark {
    position: absolute;
    bottom: -12px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--legendary);
    box-shadow: 0 0 8px var(--legendary), 0 0 16px rgba(255, 174, 0, 0.4);
    opacity: 0;
    animation: spark-rise 1.4s ease-out forwards;
}
@keyframes spark-rise {
    0%   { opacity: 0; transform: translateY(0) scale(1); }
    15%  { opacity: 1; }
    60%  { opacity: 0.9; }
    100% { opacity: 0; transform: translateY(-46vh) translateX(12px) scale(0.5); }
}

/* ===== ПАКЕТ 8: D3 live-toasts ===== */
.live-toast {
    position: fixed;
    top: calc(env(safe-area-inset-top, 0px) + 14px);
    left: 50%;
    transform: translateX(-50%) translateY(-72px);
    max-width: 92vw;
    padding: 10px 16px;
    border-radius: 12px;
    background: rgba(16, 22, 30, 0.96);
    border: 1px solid var(--border);
    color: var(--text);
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    z-index: 120;
    pointer-events: none;
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.5);
    transition: transform 0.35s cubic-bezier(.34,1.4,.64,1), opacity 0.35s ease;
    opacity: 0;
}
.live-toast.show {
    transform: translateX(-50%) translateY(0);
    opacity: 1;
}
.live-toast.tier-legendary { border-color: rgba(255,174,0,0.5); box-shadow: 0 6px 24px rgba(0,0,0,0.5), 0 0 14px rgba(255,174,0,0.25); }
.live-toast.tier-mythical  { border-color: rgba(255,0,170,0.55); box-shadow: 0 6px 24px rgba(0,0,0,0.5), 0 0 16px rgba(255,0,170,0.3); }

/* ===== АРТ-СЛОТ ПРИЗА: место зарезервировано всегда — нулевой layout shift ===== */
.prize-shot {
    position: relative;
    height: 140px;
    margin: 10px 0 2px;
    border-radius: 10px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid var(--border);
}
.prize-shot img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    opacity: 0;
    transform: scale(1.04);
    transition: opacity 0.5s ease, transform 0.6s cubic-bezier(.22,.9,.32,1);
}
.prize-shot img.loaded { opacity: 1; transform: scale(1); }
/* Скелетон-шиммер пока грузится скрин */
.prize-shot-skeleton {
    position: absolute;
    inset: 0;
    background: linear-gradient(100deg,
        rgba(255,255,255,0.02) 35%,
        rgba(255,255,255,0.07) 50%,
        rgba(255,255,255,0.02) 65%);
    background-size: 220% 100%;
    animation: shot-shimmer 1.3s ease-in-out infinite;
}
@keyframes shot-shimmer {
    from { background-position: 120% 0; }
    to   { background-position: -120% 0; }
}
.fx-low .prize-shot-skeleton { animation: none; }
/* Генеративный фолбэк: осциллограмма тира + монограмма, если скрина нет */
.prize-shot-fallback {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
}
.prize-shot-fallback svg {
    width: 110px;
    height: 44px;
    opacity: 0.8;
}
.prize-shot-fallback .shot-monogram {
    font-family: 'SF Mono', Menlo, monospace;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 3px;
    color: var(--text-muted);
    text-transform: uppercase;
}
.prize-shot-fallback .shot-legacy-lost {
    font-family: 'SF Mono', Menlo, monospace;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2px;
    color: var(--legacy);
    text-align: center;
    padding: 0 16px;
}
/* ===== ЛАЙТБОКС: рассмотреть арт приза ===== */
.zoom-overlay {
    position: fixed;
    inset: 0;
    z-index: 10000;
    background: rgba(0, 0, 0, 0.94);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.2s ease;
    touch-action: none;
    overscroll-behavior: contain;
}
.zoom-overlay.open { opacity: 1; }
.zoom-overlay.hidden { display: none; }
.zoom-img {
    max-width: 100vw;
    max-height: 100vh;
    will-change: transform;
    user-select: none;
    -webkit-user-select: none;
    -webkit-user-drag: none;
}
.zoom-img[src=""] { display: none; }
.zoom-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.16);
    color: #fff;
    font-size: 16px;
    line-height: 1;
    z-index: 2;
    cursor: pointer;
}
/* Аффорданс на слоте: арт кликабелен, только когда реальный скрин загружен */
.prize-shot.zoomable { cursor: zoom-in; }
.prize-shot.zoomable::after {
    content: '⤢';
    position: absolute;
    right: 7px;
    bottom: 5px;
    font-size: 13px;
    line-height: 1;
    color: rgba(255, 255, 255, 0.6);
    background: rgba(0, 0, 0, 0.5);
    border-radius: 6px;
    padding: 3px 6px 4px;
    pointer-events: none;
}
.info-image-wrap img { cursor: zoom-in; }