/* Страница зимнего ивента «Ёлка класса» (И1, И2), скрипт — js/event.js. Перенос прототипа prototypes/winter-event/simple.html
   (вариант «Поляна»): весь экран — зимняя сцена, ёлка в центре, рейтинг, корзинка и коробка — предметы на сцене.
   Все правила — внутри .ev (страница #ev-root и слой окон #ev-layer), чтобы не задеть остальной сайт.
   У body стоит zoom: var(--z) (page_zoom.js), поэтому высоты в vh делятся на --z. */
.ev { --ink: #4a2c17; --muted: #8a6a52; --gm-acc: #3b8fd9; --gm-acc-d: #23649e; color: var(--ink); font-family: Nunito, sans-serif; }
.ev * { box-sizing: border-box; }
:where(.ev) button { font: inherit; cursor: pointer; color: inherit; } /* :where — без веса: цвет кнопок gm-acc (белый) не перебивается */
:where(.ev) h1, :where(.ev) h2, :where(.ev) h3 { font-family: Rubik, Nunito, sans-serif; margin: 0; }
.ev-page { width: 100%; max-width: 1180px; margin: 0 auto; padding: 0 0 40px; }
body:has(#ev-root) #mascot-container { display: none; } /* На сцене свой лисёнок */

/* --- Ёлка --- */
.ev .tree-svg { display: block; height: 100%; width: auto; max-width: 100%; margin: 0 auto; touch-action: none; user-select: none; overflow: visible; }
.ev .tree-svg image, .ev .tree-svg ellipse, .ev .tree-svg .bulb { pointer-events: none; }
.ev .tree-svg .toy image, .ev .tree-svg .gift image { pointer-events: auto; }
.ev .tree-svg .toy.mine { cursor: grab; }
.ev .tree-svg .toy .halo { display: none; }
.ev .tree-svg .toy.mine .halo { display: block; }
.ev .tree-svg .toy.fresh .halo { stroke: #ffd34d; stroke-width: 3; animation: ev-halo 1s infinite ease-in-out; transform-box: fill-box; transform-origin: center; }
@keyframes ev-halo { 0%, 100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.35); opacity: .5; } }
.ev .tree-svg.twinkle .bulb { animation: ev-twinkle 1.6s infinite ease-in-out; }
@keyframes ev-twinkle { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
.ev .tree-svg .gift { cursor: pointer; animation: ev-wob 1.4s infinite ease-in-out; transform-box: fill-box; transform-origin: 50% 100%; }
/* Неоткрытая коробка: мягкое свечение «дышит», искорки вспыхивают по очереди */
.ev .tree-svg .gift-glow, .ev .tree-svg .spark { pointer-events: none; transform-box: fill-box; transform-origin: center; }
.ev .tree-svg .gift-glow { animation: ev-giftglow 2.4s infinite ease-in-out; }
.ev .tree-svg .spark { animation: ev-spark 1.8s infinite ease-in-out; filter: drop-shadow(0 0 3px #ffc23a); }
@keyframes ev-giftglow { 0%, 100% { opacity: .7; transform: scale(.92); } 50% { opacity: 1; transform: scale(1.06); } }
@keyframes ev-spark { 0%, 100% { opacity: 0; scale: .3; } 45%, 55% { opacity: 1; scale: 1; } }
@keyframes ev-wob { 0%, 70%, 100% { transform: rotate(0); } 78% { transform: rotate(-7deg); } 86% { transform: rotate(7deg); } 94% { transform: rotate(-3deg); } }

/* Лисёнок: кадры 3×3 из fox-reactions.webp */
.ev .ev-fox-img { background: url('images/characters/fox/fox-reactions.webp') 0 0 / 300% 300% no-repeat; aspect-ratio: 1; }
.ev .bubble { position: relative; color: var(--ink); background: var(--gm-parch); border-radius: 18px; padding: 10px 14px; font-weight: 800; font-size: 15px; line-height: 1.3; box-shadow: 0 4px 0 rgba(124, 74, 42, .25); max-width: 240px; }

/* Кнопка «Играть» */
.ev .play { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 12px; border-radius: 22px; padding: 14px 30px; font-family: Rubik; font-weight: 900; font-size: 24px; white-space: nowrap; }
.ev .play[disabled] { filter: grayscale(.7); opacity: .75; cursor: default; pointer-events: none; }
.ev .play .flakes { display: inline-flex; gap: 3px; font-size: 20px; }
.ev .play .flakes i.off { opacity: .35; }

/* Окна */
.ev .overlay { position: fixed; inset: 0; z-index: 80; background: rgba(40, 28, 18, .5); display: flex; align-items: center; justify-content: center; padding: 16px; }
.ev .card { width: min(460px, 100%); background: var(--gm-parch); border-radius: 28px; padding: 24px; text-align: center; box-shadow: 0 8px 0 rgba(124, 74, 42, .3); max-height: calc(92vh / var(--z, 1)); overflow: auto; position: relative; }
.ev .card.wide { width: min(560px, 100%); }
/* Памятка «Как устроен ивент» (showRules): пункты с иконками, по прототипу «мозгового штурма» */
.ev .card.rules-card { width: min(620px, 100%); }
.ev .rules-card .ev-fox-img { width: 96px; }
.ev .rules-list { list-style: none; margin: 4px 0 18px; padding: 0; text-align: left; display: flex; flex-direction: column; gap: 10px; }
.ev .rules-list li { display: flex; gap: 12px; align-items: flex-start; font-weight: 700; font-size: 15.5px; line-height: 1.4; }
.ev .rules-list li i { flex-shrink: 0; width: 34px; height: 34px; border-radius: 11px; display: flex; align-items: center; justify-content: center;
    font-size: 19px; color: #b4241e; background: rgba(255, 255, 255, .6); box-shadow: 0 2px 0 rgba(124, 74, 42, .15); }
.ev .rules-list b { color: #b4241e; }
.ev .rules-foot { margin-top: 10px; font-size: 13px; font-weight: 700; color: var(--muted); }
.ev .card h2 { font-size: 24px; font-weight: 900; margin: 6px 0 8px; }
.ev .card p { font-weight: 700; font-size: 16px; line-height: 1.4; margin: 0 0 16px; }
.ev .card .ev-fox-img { width: 130px; margin: 0 auto; }
.ev .card .x { position: absolute; top: 12px; right: 12px; width: 38px; height: 38px; border-radius: 12px; border: 0; background: rgba(124, 74, 42, .12); font-size: 18px; }
.ev .btn { border-radius: 16px; padding: 12px 22px; font-family: Rubik; font-weight: 800; font-size: 18px; }
.ev .btn[disabled] { filter: grayscale(.8); opacity: .6; pointer-events: none; }
.ev .btn-soft { border: 0; background: rgba(124, 74, 42, .12); border-radius: 16px; padding: 12px 18px; font-weight: 800; font-size: 16px; }
.ev .got svg { display: block; margin: 0 auto; width: 130px; height: 140px; animation: ev-popin .5s; }
@keyframes ev-popin { from { transform: scale(0); } 70% { transform: scale(1.15); } to { transform: scale(1); } }
.ev .dots3 { display: flex; gap: 8px; justify-content: center; margin: 4px 0 18px; }
.ev .dots3 b { width: 12px; height: 12px; border-radius: 50%; background: rgba(124, 74, 42, .2); }
.ev .dots3 b.on { background: var(--gm-acc); }
.ev .rtag { display: inline-block; color: #fff; border-radius: 10px; padding: 3px 12px; font-weight: 900; font-size: 13px; letter-spacing: .02em; }
.ev .rarity-note { font-size: 13px !important; color: var(--muted); margin: 6px 0 14px !important; }
.ev .row-btns { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.ev .card p.q { font-size: 15px; margin: 0 0 8px; color: var(--muted); }
.ev .book-note { font-size: 13px; font-weight: 700; color: var(--muted); background: rgba(255, 255, 255, .55); border-radius: 14px; padding: 10px 12px; margin-bottom: 16px; text-align: left; line-height: 1.4; }
.ev .words-line { font-size: 14px !important; color: var(--muted); }

/* Выбор учебника учеником (пока учитель не выбрал) */
.ev .books { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; margin-bottom: 18px; }
.ev .book { border: 3px solid transparent; border-radius: 16px; padding: 10px 0 8px; color: #fff; display: flex; flex-direction: column; align-items: center; box-shadow: 0 4px 0 rgba(0, 0, 0, .18); transition: transform .15s; }
.ev .book b { font-family: Rubik; font-size: 28px; line-height: 1; }
.ev .book span { font-size: 10px; font-weight: 800; opacity: .9; }
.ev .book.sel { border-color: var(--ink); transform: translateY(-4px); }
.ev .mods { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin-bottom: 16px; }
.ev .mods button { min-width: 42px; height: 42px; border-radius: 12px; border: 0; background: #fff; font-family: Rubik; font-weight: 800; font-size: 17px; box-shadow: 0 3px 0 rgba(124, 74, 42, .2); }
.ev .mods button.in { background: #e6f2fc; }
.ev .mods button.sel { background: var(--gm-acc); color: #fff; box-shadow: 0 3px 0 var(--gm-acc-d); }

/* Рейтинг (выпадает под табличкой) */
.ev .rank { display: flex; flex-direction: column; gap: 5px; text-align: left; }
.ev .rank-row { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 14px; background: rgba(255, 255, 255, .6); font-weight: 800; font-size: 15px; }
.ev .rank-row.me { background: #fff; outline: 3px solid var(--gm-acc); }
.ev .rank-row .n { min-width: 24px; text-align: center; font-family: Rubik; font-weight: 900; font-size: 18px; color: var(--muted); }
.ev .rank-row .n.m1 { color: #d9a22a; } .ev .rank-row .n.m2 { color: #94a3b8; } .ev .rank-row .n.m3 { color: #b87a4a; }
.ev .rank-row .grow { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ev .rank-sep { text-align: center; letter-spacing: .3em; color: var(--muted); font-weight: 900; }
.ev .lit { display: inline-flex; gap: 1px; font-size: 14px; color: rgba(124, 74, 42, .22); }
.ev .lit i.on { color: #e9a92a; }
.ev .rank-note { font-size: 12px; font-weight: 700; color: var(--muted); margin: 8px 2px 0; line-height: 1.35; }

/* Окно игрушек — горизонтальное: слева коллекция по 5 в ряд, справа картинка, описание и кнопки */
.ev .inv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(70px, 1fr)); gap: 8px; }
.ev .inv-grid button { position: relative; border: 3px solid transparent; background: #fff; border-radius: 16px; padding: 6px 2px 10px; box-shadow: 0 3px 0 rgba(124, 74, 42, .18); }
.ev .inv-grid button.sel { border-color: var(--gm-acc); }
.ev .inv-grid button svg { width: 44px; height: 48px; display: block; margin: 0 auto; pointer-events: none; }
.ev .inv-grid .rb { position: absolute; left: 8px; right: 8px; bottom: 4px; height: 4px; border-radius: 3px; }
/* Отметки «где висит»: синяя с классом — на ёлке класса, зелёная с ёлочкой — на своей ёлочке (одна игрушка может висеть на обеих) */
.ev .mk { display: inline-flex; width: 22px; height: 22px; border-radius: 50%; color: #fff; font-size: 13px; align-items: center; justify-content: center; vertical-align: middle; flex-shrink: 0; }
.ev .mk-cls { background: #3b8fd9; box-shadow: 0 2px 0 #23649e; }
.ev .mk-own { background: #3a9c4f; box-shadow: 0 2px 0 #256b35; }
.ev .mk.off { background: rgba(124, 74, 42, .18); box-shadow: none; }
.ev .inv-grid .mks { position: absolute; top: -6px; right: -6px; display: flex; gap: 2px; }
.ev .inv-where { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; font-weight: 700; font-size: 14px; color: var(--muted); }
.ev .inv-where .iw { display: flex; align-items: center; gap: 8px; }
.ev .inv-where b { color: var(--ink); }
.ev .inv-hint { display: flex; gap: 8px; align-items: flex-start; margin: 8px 2px 0; padding: 8px 10px; border-radius: 14px; background: rgba(255, 255, 255, .6); font-weight: 700; font-size: 13px; line-height: 1.45; color: var(--muted); }
.ev .inv-hint > i { color: #e9a92a; font-size: 18px; margin-top: 1px; }
.ev .inv-hint .mk { width: 18px; height: 18px; font-size: 11px; }
.ev .inv-grid button.no svg { filter: grayscale(1) brightness(.6) opacity(.25); }
.ev .inv-grid button.no { background: rgba(255, 255, 255, .55); box-shadow: none; }
.ev .inv-grid .x2 { position: absolute; top: 3px; left: 7px; font-size: 11px; font-weight: 900; color: var(--muted); }
.ev .places { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 6px; font-weight: 800; font-size: 14px; color: var(--muted); }
.ev .places b { width: 14px; height: 14px; border-radius: 50%; background: rgba(124, 74, 42, .15); }
.ev .places b.on { background: #3a9c4f; }
.ev .card.inv { width: min(980px, 100%); display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 18px; text-align: left; overflow: visible; padding: 20px; }
.ev .card.inv .x { top: -14px; right: -14px; z-index: 2; background: var(--gm-parch); box-shadow: 0 3px 0 rgba(124, 74, 42, .3); border-radius: 50%; }
.ev .inv-main h2 { margin: 0 0 4px; }
.ev .card.inv .inv-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin-top: 10px; }
.ev .card.inv .inv-grid button { padding: 10px 2px 14px; }
.ev .card.inv .inv-grid button svg { width: 56px; height: 60px; }
.ev .inv-foot { font-size: 13px; color: var(--muted); font-weight: 700; margin: 12px 0 0 !important; }
.ev .inv-side { display: flex; flex-direction: column; gap: 12px; }
.ev .inv-card { flex: 1; display: flex; flex-direction: column; background: #fff; border-radius: 22px; overflow: hidden; }
.ev .inv-pic { aspect-ratio: 1; flex-shrink: 0; display: flex; align-items: center; justify-content: center; background: #fff; border-bottom: 3px solid rgba(124, 74, 42, .14); }
.ev .inv-pic.no svg { filter: grayscale(1) brightness(.6) opacity(.25); }
.ev .inv-info { padding: 14px 16px; }
.ev .inv-info h3 { font-size: 22px; font-weight: 900; margin: 0 0 6px; }
.ev .inv-side .desc { font-weight: 700; font-size: 14px; color: var(--muted); margin: 8px 0 0; line-height: 1.35; }
.ev .inv-btns { display: flex; gap: 10px; }
.ev .inv-btns .btn, .ev .inv-btns .btn-soft { flex: 1; min-height: 62px; border-radius: 22px; font-size: 19px; padding: 12px 10px; display: flex; align-items: center; justify-content: center; gap: 8px; }
.ev .inv-btns .desc { margin: 0; text-align: center; flex: 1; }
.ev .inv-sum { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 6px 16px; font-weight: 800; font-size: 14px; color: var(--muted); margin: 2px 4px 4px; }
.ev .inv-sum b { color: var(--ink); }
@media (max-width: 760px) {
    .ev .card.inv { grid-template-columns: 1fr; overflow: auto; padding: 58px 14px 18px; gap: 14px; }
    .ev .card.inv .x { top: 10px; right: 10px; border-radius: 12px; box-shadow: none; }
    .ev .inv-side { order: -1; }
    .ev .inv-card { flex-direction: row; }
    .ev .inv-pic { width: 110px; height: 110px; border-bottom: 0; border-right: 3px solid rgba(124, 74, 42, .14); }
    .ev .inv-pic svg { width: 90px; height: 96px; }
    .ev .inv-info { padding: 10px 12px; }
    .ev .inv-info h3 { font-size: 18px; }
    .ev .card.inv .inv-grid { gap: 6px; }
    .ev .card.inv .inv-grid button svg { width: 42px; height: 46px; }
    .ev .books { grid-template-columns: repeat(3, 1fr); }
}

/* ============ Сцена «Поляна» ============ */
.ev .a-stage { position: relative; border-radius: 30px; overflow: hidden; aspect-ratio: 16 / 10.6; min-height: 620px; max-height: calc(100vh / var(--z, 1) - 90px); width: 100%;
    background: url('images/event/scene-event.webp') 50% 100% / cover, #1d2650; box-shadow: 0 10px 30px rgba(29, 38, 80, .25); }
/* Низ ёлки — над рядом «коробка — Играть — корзинка» (он в пикселях от низа сцены): в процентах от высоты сцены на сайте,
   где сцена ниже, чем в прототипе (шапка, масштаб страницы), ёлка опускалась и подарки у ствола уходили за кнопку «Играть» */
.ev .a-tree { position: absolute; left: 0; right: 0; margin: 0 auto; width: fit-content; bottom: 222px; height: calc(100% - 240px); }
.ev .a-sign { position: absolute; top: 18px; left: 18px; display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px 12px; border-radius: 14px; font-family: Rubik; font-weight: 800; font-size: 17px; border: 0; z-index: 6; max-width: calc(100% - 100px); }
.ev .a-sign .sign-t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.ev .a-sign .sign-p { white-space: nowrap; flex-shrink: 0; margin-left: -2px; }   /* место видно всегда, сокращается название */
.ev .a-sign i { font-size: 22px; }
.ev .a-sign .chev { font-size: 15px; transition: transform .2s; }
.ev .a-sign.open .chev { transform: rotate(180deg); }
.ev .a-rank { position: absolute; top: 76px; left: 18px; width: min(360px, calc(100% - 36px)); z-index: 7; background: var(--gm-parch); border-radius: 20px; padding: 14px; box-shadow: 0 8px 0 rgba(124, 74, 42, .3), 0 14px 30px rgba(40, 28, 18, .25); animation: ev-drop .18s ease-out; }
.ev .a-rank::before { content: ''; position: absolute; top: -9px; left: 34px; border: 10px solid transparent; border-bottom-color: var(--gm-parch); border-top: 0; }
.ev .a-rank h3 { font-size: 16px; font-weight: 900; margin: 0 2px 8px; }
/* Топ-10 и свой класс: окно не выше сцены, лишнее прокручивается внутри списка (стрелка окна не обрезается) */
.ev .a-rank { display: flex; flex-direction: column; max-height: calc(100% - 150px); }
.ev .a-rank .rank { overflow-y: auto; min-height: 0; padding: 3px; margin: -3px; }
.ev .a-rank .rank { gap: 3px; }
.ev .a-rank .rank-row { padding: 4px 10px; font-size: 14px; }
.ev .a-rank .rank-row .n { font-size: 16px; }
.ev .a-rank .rank-me { overflow: visible; flex-shrink: 0; margin-top: 3px; }
.ev .a-rank .rank-sep { line-height: 1; }
@keyframes ev-drop { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
/* Лисёнок — внизу справа над шкалой, левее корзинки; фраза — над ним и только на несколько секунд (js: foxSay) */
.ev .a-fox { position: absolute; right: 124px; bottom: 112px; width: 112px; z-index: 7; pointer-events: none; }
.ev .a-fox .ev-fox-img { pointer-events: auto; cursor: pointer; }   /* нажал на лисёнка — фраза показывается снова */
.ev .a-fox .bubble { transition: opacity .3s, transform .3s; transform-origin: 100% 100%; }
.ev .a-fox .bubble.quiet { opacity: 0; transform: scale(.85); pointer-events: none; }
.ev .a-fox .bubble { position: absolute; right: 0; bottom: 100%; margin-bottom: 6px; width: max-content; max-width: 240px; }
.ev .a-fox .bubble::after { content: ''; position: absolute; right: 40px; bottom: -8px; border: 9px solid transparent; border-top-color: var(--gm-parch); border-bottom: 0; }

/* Нижний ряд: счётчик коробки — «Играть» — корзинка. Сетка вместо translate: кнопка не съезжает при наведении */
.ev .a-row { position: absolute; left: 18px; right: 18px; bottom: 116px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; z-index: 6; }
.ev .a-row { pointer-events: none; }
.ev .a-row > * { pointer-events: auto; }
.ev .a-row > :first-child { justify-self: start; }
.ev .a-row > :last-child { justify-self: end; }
.ev .a-boxc { display: flex; align-items: center; gap: 10px; background: rgba(255, 246, 226, .95); border-radius: 18px; padding: 8px 14px 9px 10px; box-shadow: 0 4px 0 rgba(124, 74, 42, .25); font-weight: 800; font-size: 14px; line-height: 1.2; border: 0; text-align: left; }
.ev .a-boxc .gi { font-size: 30px; color: #d84a4a; }
.ev .a-boxc .segs { display: flex; gap: 3px; margin-top: 5px; }
.ev .a-boxc .segs b { width: 11px; height: 7px; border-radius: 3px; background: rgba(124, 74, 42, .16); }
.ev .a-boxc .segs b.on { background: linear-gradient(#f7c766, #e9a92a); }
.ev .a-boxc.ready { animation: ev-ready 1.2s infinite ease-in-out; cursor: pointer; }
.ev .a-boxc.ready .gi { animation: ev-wob 1.4s infinite ease-in-out; }
.ev .a-boxc.frozen .gi { color: #5aa8e6; }
@keyframes ev-ready { 0%, 100% { box-shadow: 0 4px 0 rgba(124, 74, 42, .25), 0 0 0 0 rgba(242, 193, 78, .0); } 50% { box-shadow: 0 4px 0 rgba(124, 74, 42, .25), 0 0 0 6px rgba(242, 193, 78, .45); } }
.ev .a-basket { position: relative; width: 96px; height: 86px; border: 0; background: url('images/event/inventory.webp') center / contain no-repeat; transition: transform .15s; }
.ev .a-basket:hover { transform: translateY(-3px) rotate(-3deg); }
.ev .a-basket .cnt { position: absolute; top: -4px; right: -2px; min-width: 28px; height: 28px; border-radius: 14px; background: var(--gm-acc); color: #fff; font-weight: 900; display: flex; align-items: center; justify-content: center; padding: 0 6px; box-shadow: 0 2px 0 var(--gm-acc-d); }
.ev .dot-new { position: absolute; top: -7px; right: -7px; width: 16px; height: 16px; border-radius: 50%; background: #ef4444; border: 3px solid #fff; animation: ev-dotp 1.6s infinite ease-in-out; }
@keyframes ev-dotp { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.2); } }

/* Шкала украшений — матовое стекло по всей ширине окна. Над кружками — порог, на полоске — сколько очков сейчас */
.ev .a-prog { position: absolute; left: 12px; right: 12px; bottom: 8px; height: 102px; border-radius: 22px; z-index: 6;
    background: rgba(255, 255, 255, .26); -webkit-backdrop-filter: blur(10px) saturate(1.2); backdrop-filter: blur(10px) saturate(1.2);
    border: 1px solid rgba(255, 255, 255, .6); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7), 0 6px 20px rgba(60, 90, 120, .12); }
.ev .pg-track { position: absolute; left: 48px; right: 48px; top: 45px; height: 12px; border-radius: 10px; background: rgba(74, 44, 23, .14); box-shadow: inset 0 1px 3px rgba(74, 44, 23, .25); }
.ev .pg-fill { position: absolute; inset: 0 auto 0 0; border-radius: 10px; transition: width .6s;
    background: repeating-linear-gradient(-45deg, rgba(255, 255, 255, .35) 0 6px, transparent 6px 14px), linear-gradient(90deg, #9fd3ff, #5aa8e6 55%, #f2c14e);
    background-size: 28px 28px, 100% 100%; animation: ev-shimmer 1.4s linear infinite; box-shadow: 0 0 10px rgba(159, 211, 255, .8); }
@keyframes ev-shimmer { to { background-position: 28px 0, 0 0; } }
.ev .pg-now { position: absolute; top: -34px; width: 0; height: 22px; transition: left .6s; z-index: 2; }
.ev .pg-now-b { position: absolute; left: 0; top: 0; transform: translateX(calc(-50% + var(--sh, 0px))); white-space: nowrap; background: var(--gm-acc); color: #fff; font-family: Rubik; font-weight: 800; font-size: 13px; line-height: 16px; padding: 3px 9px; border-radius: 10px; box-shadow: 0 2px 0 var(--gm-acc-d); }
.ev .pg-now::after { content: ''; position: absolute; left: -6px; bottom: -6px; border: 6px solid transparent; border-top-color: var(--gm-acc); border-bottom: 0; }
.ev .pg-now.below { top: 20px; }
.ev .pg-now.below::after { bottom: auto; top: -6px; border-top: 0; border-bottom: 6px solid var(--gm-acc); }
.ev .pg-mark { position: absolute; top: 50%; transform: translate(-50%, -50%); display: flex; flex-direction: column; align-items: center; }
.ev .pg-orb { width: 44px; height: 44px; border-radius: 50%; background: rgba(255, 255, 255, .85); border: 2px solid rgba(124, 74, 42, .25); display: flex; align-items: center; justify-content: center; box-shadow: 0 3px 8px rgba(74, 44, 23, .15); position: relative; transition: transform .2s; }
.ev .pg-orb img { width: 32px; height: 32px; object-fit: contain; }
.ev .pg-mark:not(.on) .pg-orb img { filter: grayscale(1) opacity(.45); }
.ev .pg-mark .lock { position: absolute; right: -5px; bottom: -4px; width: 18px; height: 18px; border-radius: 50%; background: #8a6a52; color: #fff; font-size: 10px; display: flex; align-items: center; justify-content: center; }
.ev .pg-mark.on .pg-orb { border-color: #e2b23e; background: radial-gradient(#fff8dc, #f7d27a); box-shadow: 0 0 0 4px rgba(247, 210, 122, .4), 0 0 16px rgba(255, 220, 120, .8); }
.ev .pg-mark.next .pg-orb { animation: ev-nextp 1.6s infinite ease-in-out; }
@keyframes ev-nextp { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.1); } }
.ev .pg-at { position: absolute; bottom: 50px; font-family: Rubik; font-weight: 800; font-size: 13px; color: var(--muted); white-space: nowrap; }
.ev .pg-mark.on .pg-at { color: #b4862a; }
.ev .pg-name { position: absolute; top: 48px; white-space: nowrap; font-weight: 800; font-size: 12px; color: var(--ink); text-shadow: 0 0 6px rgba(255, 255, 255, .9); }
.ev .pg-mark.on .pg-name { color: #9a6a00; }

/* Вкладки «Ёлка класса» / «Моя ёлка» — в левом верхнем углу (по центру они закрывают верхушку ёлки), табличка места — под ними */
.ev .a-stage:has(.a-tabs) .a-sign { top: 76px; }
.ev .a-stage:has(.a-tabs) .a-rank { top: 134px; }
.ev .a-tabs { position: absolute; top: 18px; left: 18px; z-index: 6; display: flex; gap: 4px; padding: 5px; border-radius: 18px; background: rgba(255, 246, 226, .92); box-shadow: 0 4px 0 rgba(124, 74, 42, .25); }
.ev .a-tabs button { display: flex; align-items: center; gap: 6px; border: 0; background: transparent; border-radius: 13px; padding: 8px 16px; font-family: Rubik; font-weight: 800; font-size: 16px; color: var(--muted); white-space: nowrap; }
.ev .a-tabs button i { font-size: 19px; }
.ev .a-tabs button.on { background: var(--gm-acc); color: #fff; box-shadow: 0 3px 0 var(--gm-acc-d); }
.ev .guest-bar { position: absolute; top: 18px; left: 18px; z-index: 6; display: flex; align-items: center; gap: 10px; padding: 7px 8px; border-radius: 20px; background: rgba(255, 246, 226, .95); box-shadow: 0 4px 0 rgba(124, 74, 42, .25); white-space: nowrap; max-width: calc(100% - 100px); }
.ev .guest-bar > span:not(.m-ava) { min-width: 0; overflow: hidden; }
.ev .guest-bar b { display: block; font-family: Rubik; font-weight: 800; font-size: 16px; overflow: hidden; text-overflow: ellipsis; }
.ev .guest-bar small { display: block; font-weight: 800; font-size: 12px; color: var(--muted); }
.ev .guest-bar .btn-soft { padding: 8px 12px; font-size: 14px; margin-left: 6px; }
.ev .guest-bar .m-ava { width: 38px; height: 38px; border-width: 2px; }
.ev .guest-info { position: absolute; left: 50%; bottom: 22px; transform: translateX(-50%); z-index: 6; background: rgba(255, 246, 226, .95); border-radius: 16px; padding: 10px 18px; font-weight: 800; box-shadow: 0 4px 0 rgba(124, 74, 42, .25); white-space: nowrap; }
.ev .a-stage.guest .a-tree { cursor: default; }
.ev .a-note { position: absolute; left: 50%; bottom: 120px; transform: translateX(-50%); z-index: 6; background: rgba(255, 246, 226, .95); border-radius: 18px; padding: 12px 20px; font-weight: 800; box-shadow: 0 4px 0 rgba(124, 74, 42, .25); text-align: center; max-width: calc(100% - 40px); }

/* Лента одноклассников под сценой: «В гости» */
.ev .mates { margin-top: 14px; background: var(--gm-parch); border-radius: 24px; padding: 10px 12px 12px; box-shadow: 0 6px 0 rgba(124, 74, 42, .2); }
.ev .m-title { font-family: Rubik; font-weight: 800; font-size: 15px; margin: 0 6px 8px; display: flex; align-items: center; gap: 6px; }
.ev .m-title i { color: var(--gm-acc); font-size: 19px; }
.ev .m-row { display: flex; align-items: center; gap: 6px; }
.ev .m-list { flex: 1; display: flex; gap: 6px; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; padding: 2px; }
.ev .m-list::-webkit-scrollbar { display: none; }
.ev .m-arr { display: none; flex-shrink: 0; width: 38px; height: 38px; border-radius: 50%; border: 0; background: rgba(124, 74, 42, .12); font-size: 18px; color: var(--ink); align-items: center; justify-content: center; }
.ev .mates.scroll .m-arr { display: flex; }
.ev .mate { flex-shrink: 0; width: 84px; scroll-snap-align: start; display: flex; flex-direction: column; align-items: center; gap: 4px; border: 3px solid transparent; background: transparent; border-radius: 16px; padding: 6px 2px 5px; }
.ev .mate:hover { background: rgba(255, 255, 255, .6); }
.ev .mate.on { background: #fff; border-color: var(--gm-acc); }
.ev .m-ava { width: 52px; height: 52px; border-radius: 50%; object-fit: cover; background: #ffe9d4; border: 3px solid #fff; box-shadow: 0 2px 0 rgba(124, 74, 42, .2); flex-shrink: 0; }
.ev .m-nm { font-weight: 800; font-size: 12px; white-space: nowrap; max-width: 78px; overflow: hidden; text-overflow: ellipsis; }

/* После ивента и «скоро» */
.ev .a-stage.after { display: flex; align-items: center; justify-content: center; }
.ev .after-card { position: relative; z-index: 6; width: min(440px, calc(100% - 32px)); border-radius: 28px; padding: 22px; text-align: center; box-shadow: 0 8px 0 rgba(124, 74, 42, .3); }
.ev .after-card .ev-fox-img { width: 120px; margin: 0 auto; }
.ev .after-card h2 { font-size: 24px; font-weight: 900; margin: 6px 0 8px; }
.ev .after-card p { font-weight: 700; margin: 0 0 16px; line-height: 1.4; }

/* Наряд ёлки — «примерочная» (вариант А): кисточка открывает панель снизу, ёлка сразу примеряет выбор */
.ev .dress { position: absolute; left: 12px; right: 12px; bottom: 8px; z-index: 8; background: var(--gm-parch); border-radius: 24px; padding: 12px 16px 12px; box-shadow: 0 8px 0 rgba(124, 74, 42, .3), 0 14px 30px rgba(40, 28, 18, .25); }
.ev .dr-head { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.ev .dr-done { font-size: 16px; padding: 9px 20px; margin-left: auto; }
.ev .dr-cats { display: flex; gap: 4px; background: rgba(124, 74, 42, .12); border-radius: 16px; padding: 4px; flex-wrap: wrap; }
.ev .dr-cat { position: relative; border: 0; background: transparent; border-radius: 12px; padding: 5px 12px 5px 6px; display: flex; align-items: center; gap: 6px; font-weight: 800; font-size: 14px; color: var(--muted); }
.ev .dr-cat.on { background: #fff; color: var(--ink); box-shadow: 0 2px 0 rgba(124, 74, 42, .15); }
.ev .dr-cat img { width: 28px; height: 28px; object-fit: contain; }
.ev .dr-cat .of-sw { width: 24px; height: 24px; margin: 2px; }
.ev .dr-cat .lk { position: absolute; top: -4px; right: -4px; width: 17px; height: 17px; border-radius: 50%; background: #8a6a52; color: #fff; font-size: 10px; display: flex; align-items: center; justify-content: center; }
.ev .of-opts { display: flex; gap: 8px; flex-wrap: wrap; }
.ev .dr-opts { justify-content: center; }
.ev .of-opt { position: relative; border: 3px solid transparent; background: #fff; border-radius: 16px; padding: 6px 6px 5px; width: 88px; display: flex; flex-direction: column; align-items: center; gap: 3px; box-shadow: 0 3px 0 rgba(124, 74, 42, .16); font-size: 12px; font-weight: 800; line-height: 1.1; }
.ev .of-opt.sel { border-color: var(--gm-acc); }
.ev .of-opt.win::before { content: '\2605'; position: absolute; top: -9px; left: -7px; width: 22px; height: 22px; border-radius: 50%; background: #f2c14e; color: #fff; font-size: 13px; display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 0 #b4862a; }
.ev .of-sw { width: 40px; height: 40px; border-radius: 50%; border: 2px solid rgba(124, 74, 42, .2); }
.ev .of-sw.img { border: 0; border-radius: 10px; background: center / contain no-repeat; }
.ev .of-votes { position: absolute; top: -8px; right: -6px; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 11px; background: var(--gm-acc); color: #fff; font-size: 12px; font-weight: 900; display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 0 var(--gm-acc-d); }
.ev .dr-note { text-align: center; font-size: 12px; font-weight: 700; color: var(--muted); margin-top: 8px; }

/* Правый верхний угол: кнопка «Во весь экран», под ней меню (выпадает, как рейтинг): «Как играть», «Наряд ёлки», снег, музыка, живой фон.
   Нет кнопки (iPhone) — меню встаёт в угол */
.ev .a-rt { position: absolute; top: 18px; right: 18px; z-index: 9; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.ev .a-rbtn { width: 48px; height: 48px; border-radius: 50%; border: 0; font-size: 24px; display: flex; align-items: center; justify-content: center; }
.ev .a-rbtn i { transition: transform .3s; }
.ev .a-rbtn.open .ph-gear-six { transform: rotate(60deg); }
.ev .a-wrap { position: relative; }
.ev .a-narrow { display: none; }   /* меню — только на телефоне вертикально (ниже) */
.ev .a-menu { display: inline-flex; align-items: center; gap: 6px; padding: 10px 14px 12px; border-radius: 14px; border: 0; font-size: 22px; }
.ev .a-menu .chev { font-size: 15px; transition: transform .2s; }
.ev .a-menu.open .chev { transform: rotate(180deg); }
.ev .menu-panel, .ev .fx-panel { position: absolute; z-index: 9; background: var(--gm-parch); border-radius: 20px; padding: 8px; box-shadow: 0 8px 0 rgba(124, 74, 42, .3), 0 14px 30px rgba(40, 28, 18, .25); animation: ev-drop .18s ease-out; }
.ev .menu-panel { top: calc(100% + 10px); right: 0; width: 250px; }
.ev .menu-panel::before { content: ''; position: absolute; top: -9px; right: 30px; border: 10px solid transparent; border-bottom-color: var(--gm-parch); border-top: 0; }
.ev .fx-panel { top: 0; right: calc(100% + 10px); width: 240px; }   /* настройки — слева от шестерёнки */
.ev .menu-sep { height: 1px; margin: 4px 10px; background: rgba(124, 74, 42, .18); }
.ev .fx-row { display: flex; align-items: center; gap: 10px; width: 100%; border: 0; background: transparent; border-radius: 14px; padding: 9px 10px; font-weight: 800; font-size: 15px; color: var(--ink); text-align: left; }
.ev .fx-row:hover { background: rgba(255, 255, 255, .6); }
.ev .fx-row > i { font-size: 22px; color: var(--gm-acc); width: 24px; }
.ev .fx-row span { flex: 1; }
.ev .fx-row .sw { width: 42px; height: 24px; border-radius: 12px; background: rgba(124, 74, 42, .25); position: relative; transition: background .2s; }
.ev .fx-row .sw::after { content: ''; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, .25); transition: left .2s; }
.ev .fx-row .sw.on { background: var(--gm-acc); }
.ev .fx-row .sw.on::after { left: 21px; }
.ev .bg-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 100%; pointer-events: none; }
.ev .snow { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 5; }

/* Перетаскивание игрушки: «призрак» под пальцем (в слое окон — без zoom страницы) */
.ev-drag-ghost { position: fixed; z-index: 100; pointer-events: none; width: 52px; height: 58px; transform: translate(-50%, -60%); }

/* Машина времени (только EVENT_MODE=test, только админ) */
.ev .tm { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-bottom: 12px; padding: 8px 12px; border-radius: 16px; background: #2b2420; color: #d6cbc0; font-size: 13px; font-weight: 700; }
.ev .tm b { color: #fff; }
.ev .tm .grp { display: flex; gap: 4px; align-items: center; flex-wrap: wrap; }
.ev .tm button { border: 1px solid #5a4a3e; background: #3d332c; color: #eee3d8; border-radius: 8px; padding: 4px 10px; font-weight: 700; font-size: 13px; }
.ev .tm button.on { background: var(--gm-acc); border-color: var(--gm-acc); color: #fff; }

@media (max-width: 760px) {
    .ev .a-stage { aspect-ratio: auto; height: calc(100vh / var(--z, 1) - 90px); min-height: 640px; max-height: none; background-position: 50% 100%; }
    .ev .a-tree { bottom: max(31%, 166px); height: 56%; width: 96%; }
    .ev .a-tree .tree-svg { width: 100%; height: 100%; }
    .ev .a-fox { width: 72px; right: 8px; bottom: 168px; }
    .ev .a-fox .bubble { margin-bottom: 4px; font-size: 14px; max-width: 220px; }
    .ev .a-fox .bubble::after { right: 26px; }
    .ev .a-row { left: 10px; right: 10px; bottom: 104px; grid-template-columns: auto 1fr auto; gap: 8px; }
    .ev .a-row > .play { justify-self: stretch; font-size: 20px; padding: 13px 10px; }
    .ev .a-boxc { padding: 8px; }
    .ev .a-boxc .txt { display: none; }
    .ev .a-basket { width: 72px; height: 58px; }
    .ev .a-sign { font-size: 15px; padding: 8px 12px 10px; }
    .ev .a-rank { top: 66px; }
    .ev .a-prog { left: 6px; right: 6px; bottom: 6px; height: 90px; }
    .ev .pg-track { left: 26px; right: 26px; top: 38px; }
    .ev .pg-orb { width: 36px; height: 36px; }
    .ev .pg-orb img { width: 26px; height: 26px; }
    .ev .pg-at { font-size: 11px; bottom: 40px; }
    .ev .pg-now { top: -30px; height: 19px; }
    .ev .pg-now.below { top: 19px; }
    .ev .pg-now-b { font-size: 11px; line-height: 15px; padding: 2px 7px; }
    .ev .pg-name { font-size: 11px; top: 40px; display: none; }
    .ev .pg-mark.next .pg-name { display: block; } /* на узком экране подписано только ближайшее украшение */
    .ev .a-tabs { left: 10px; top: 14px; }
    .ev .a-tabs button { padding: 7px 10px; font-size: 14px; }
    .ev .a-stage:has(.a-tabs) .a-sign { top: 68px; left: 10px; }
    .ev .a-stage:has(.a-tabs) .a-rank { top: 118px; }
    .ev .a-rt { top: 14px; right: 10px; gap: 8px; }
    .ev .a-rbtn { width: 44px; height: 44px; font-size: 21px; }
    .ev .a-menu { padding: 8px 12px 10px; font-size: 20px; }
    /* Окно игрушек на телефоне — компактнее, чтобы помещалось без долгой прокрутки */
    .ev .card.inv { padding: 50px 12px 14px; gap: 10px; }
    .ev .inv-main h2 { font-size: 20px; }
    .ev .inv-pic { width: 84px; height: 84px; }
    .ev .inv-pic svg { width: 70px; height: 76px; }
    .ev .inv-info h3 { font-size: 17px; margin-bottom: 4px; }
    .ev .inv-side .desc { font-size: 13px; margin-top: 4px; }
    .ev .inv-btns .btn, .ev .inv-btns .btn-soft { min-height: 48px; font-size: 16px; border-radius: 16px; }
    .ev .card.inv .inv-grid button { padding: 6px 2px 10px; border-radius: 12px; }
    .ev .card.inv .inv-grid button svg { width: 34px; height: 38px; }
    .ev .card.inv .inv-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; }
    .ev .places b, .ev .inv-foot { display: none; }
    .ev .guest-bar { left: 10px; top: 14px; }
    .ev .guest-bar small { display: none; }
    .ev .guest-info { white-space: normal; text-align: center; width: calc(100% - 40px); }
    .ev .mate { width: 70px; }
    .ev .m-ava { width: 46px; height: 46px; }
    .ev .dress { left: 6px; right: 6px; bottom: 6px; padding: 10px; }
    .ev .dr-head { flex-wrap: wrap; }
    .ev .dr-cat { padding: 4px 8px 4px 4px; font-size: 12px; }
    .ev .dr-cat img { width: 22px; height: 22px; }
    .ev .of-opt { width: 70px; }
    .ev .a-note { bottom: 108px; }
}

/* Полный экран: во весь экран — весь сайт (так он не слетает в раунде), но страница ивента выглядит как окно игры:
   своя прокрутка поверх сайта, сцена ровно на экран, ниже — лента одноклассников (и машина времени у админа).
   Масштаб сайта (--z) в полном экране — 1: окна ивента и сцена по размеру экрана */
html:fullscreen:has(#ev-root) { --z: 1; }
html:fullscreen body:has(#ev-root) header,
html:fullscreen body:has(#ev-root) #btn-bug-report { display: none !important; }
html:fullscreen #ev-root { position: fixed; inset: 0; z-index: 60; max-width: none; margin: 0; padding: 0; overflow-y: auto; overscroll-behavior: contain;
    background: #141b3a; display: flex; flex-direction: column; }
html:fullscreen #ev-root .a-stage { flex: none; order: 1; width: 100%; height: 100vh; height: 100dvh; min-height: 0; max-height: none; aspect-ratio: auto;
    border-radius: 0; box-shadow: none; }
html:fullscreen #ev-root .mates { order: 2; margin: 0; border-radius: 0; box-shadow: none; }
html:fullscreen #ev-root .tm { order: 3; margin: 0; border-radius: 0; }

/* Телефон боком (и в полном экране, и без него): страница ивента без увеличения zoom (у body на телефоне боком — 1.25),
   сцена — по высоте окна, всё на ней компактнее */
@media (orientation: landscape) and (max-height: 500px) and (pointer: coarse) {
    html:has(#ev-root) { --z: 1; }
    .ev .a-stage { aspect-ratio: auto; min-height: 0; max-height: none; height: calc(100vh - 112px); height: calc(100dvh - 112px); border-radius: 20px; }
    .ev .a-tree { bottom: 136px; height: calc(100% - 148px); width: fit-content; }
    .ev .a-tabs { top: 10px; left: 10px; padding: 4px; }
    .ev .a-tabs button { padding: 6px 12px; font-size: 14px; }
    .ev .a-tabs button i { font-size: 16px; }
    .ev .a-sign, .ev .a-stage:has(.a-tabs) .a-sign { top: 56px; left: 10px; font-size: 14px; padding: 7px 12px 9px; }
    .ev .guest-bar { top: 10px; left: 10px; }
    .ev .a-rank, .ev .a-stage:has(.a-tabs) .a-rank { top: 100px; left: 10px; max-height: calc(100% - 110px); overflow: auto; }
    .ev .a-rt { top: 10px; right: 10px; gap: 6px; }
    .ev .a-rbtn { width: 40px; height: 40px; font-size: 19px; }
    .ev .fx-panel { padding: 4px; }
    .ev .fx-panel .fx-row { padding: 6px 10px; }
    .ev .a-fox { width: 70px; right: 86px; bottom: 70px; }   /* над шкалой, левее корзинки */
    .ev .a-fox .bubble { margin-bottom: 4px; font-size: 13px; max-width: 220px; padding: 8px 12px; }
    .ev .a-fox .bubble::after { right: 24px; }
    .ev .a-row { left: 10px; right: 10px; bottom: 74px; grid-template-columns: 1fr auto 1fr; }
    .ev .play, .ev .a-row > .play { justify-self: center; font-size: 18px; padding: 8px 22px; gap: 8px; border-radius: 18px; }
    .ev .play .flakes { font-size: 15px; }
    .ev .a-boxc { padding: 6px 10px; font-size: 12px; }
    .ev .a-boxc .gi { font-size: 24px; }
    .ev .a-basket { width: 70px; height: 56px; }
    .ev .a-prog { left: 6px; right: 6px; bottom: 4px; height: 66px; border-radius: 16px; }
    .ev .pg-track { left: 30px; right: 30px; top: 34px; }
    .ev .pg-orb { width: 30px; height: 30px; }
    .ev .pg-orb img { width: 22px; height: 22px; }
    .ev .pg-mark .lock { width: 14px; height: 14px; font-size: 8px; }
    .ev .pg-at { font-size: 11px; bottom: 33px; }
    .ev .pg-name { display: none; }
    .ev .pg-now { top: -26px; height: 18px; }
    .ev .pg-now.below { top: 16px; }
    .ev .pg-now-b { font-size: 11px; line-height: 14px; padding: 2px 7px; }
    .ev .dress { left: 6px; right: 6px; bottom: 4px; padding: 8px 12px; }
    .ev .dr-head { margin-bottom: 6px; }
    .ev .of-opt { width: 72px; font-size: 11px; }
    .ev .of-sw { width: 30px; height: 30px; }
    .ev .dr-note { display: none; }
    .ev .guest-info { bottom: 10px; }
    /* Окна — по высоте экрана; окно игрушек: слева коллекция по 7 в ряд, справа — выбранная игрушка */
    .ev .overlay { padding: 8px; }
    .ev .card { max-height: calc(100vh - 16px); padding: 16px; }
    .ev .card .ev-fox-img { width: 80px; }
    .ev .card h2 { font-size: 20px; margin: 2px 0 6px; }
    .ev .card p { font-size: 15px; margin-bottom: 10px; }
    .ev .card.inv { overflow: auto; grid-template-columns: minmax(0, 1fr) 230px; gap: 12px; padding: 14px; align-items: start; }
    .ev .card.inv .x { top: 8px; right: 8px; border-radius: 12px; box-shadow: none; background: rgba(124, 74, 42, .12); }
    .ev .inv-main h2 { font-size: 20px; }
    .ev .card.inv .inv-grid { grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; margin-top: 6px; }
    .ev .card.inv .inv-grid button { padding: 5px 2px 9px; border-radius: 12px; }
    .ev .card.inv .inv-grid button svg { width: 34px; height: 38px; }
    .ev .inv-foot { display: none; }
    .ev .inv-side { order: 0; margin-top: 44px; }
    .ev .inv-card { flex-direction: column; }
    .ev .inv-pic { width: auto; height: 104px; aspect-ratio: auto; border-right: 0; border-bottom: 3px solid rgba(124, 74, 42, .14); }
    .ev .inv-pic svg { width: 84px; height: 90px; }
    .ev .inv-info { padding: 8px 12px; }
    .ev .inv-info h3 { font-size: 17px; margin-bottom: 4px; }
    .ev .inv-side .desc { font-size: 13px; margin-top: 4px; }
    .ev .inv-btns .btn, .ev .inv-btns .btn-soft { min-height: 44px; font-size: 15px; border-radius: 14px; }
    .ev .places b { width: 10px; height: 10px; }
    .ev .books { grid-template-columns: repeat(6, 1fr); margin-bottom: 10px; }
    .ev .book { padding: 6px 0 5px; }
    .ev .book b { font-size: 22px; }
    .ev .mods { margin-bottom: 10px; }
    .ev .mods button { min-width: 36px; height: 36px; font-size: 15px; }
}

/* Телефон вертикально: вместо «?», кисточки и шестерёнки — одно меню под кнопкой «Во весь экран» */
@media (max-width: 760px) and (orientation: portrait) {
    .ev .a-wide { display: none; }
    .ev .a-narrow { display: block; }
}

/* Левый верхний угол: вкладки «Ёлка класса» / «Моя ёлка» (или плашка гостя), под ними — табличка класса не шире вкладок */
.ev .a-tl { position: absolute; top: 18px; left: 18px; z-index: 6; display: inline-flex; flex-direction: column; align-items: stretch; gap: 6px; max-width: calc(100% - 100px); }
.ev .a-tl > * { position: static; }
.ev .a-tl > .a-tabs + .a-sign { width: 0; min-width: 100%; max-width: none; }
.ev .a-tl > .a-sign:only-child { max-width: none; }   /* табличка одна (учитель, «К ёлке»): ширину ограничивает сам столбик */
@media (max-width: 760px) { .ev .a-tl { top: 14px; left: 10px; max-width: calc(100% - 74px); } }
@media (orientation: landscape) and (max-height: 500px) and (pointer: coarse) {
    .ev .a-tl { top: 10px; left: 10px; }
    /* Боком без полного экрана сцена низкая: столбик из четырёх кнопок наезжал на корзинку — там тоже меню */
    html:not(:fullscreen) .ev .a-wide { display: none; }
    html:not(:fullscreen) .ev .a-narrow { display: block; }
}

/* ============ Учитель (пачка 19в): табличка класса с переключателем, «Сегодня играли», учебник, место ============ */
.ev .tree-svg .toy.removable { cursor: grab; touch-action: none; }
.ev .tree-svg .toy.removable:hover { filter: drop-shadow(0 0 4px #d84a4a); }
.ev .warn-dot { color: #e9a92a; font-size: 18px !important; flex-shrink: 0; }
.ev .t-book { font-size: 19px; padding: 14px 24px; gap: 10px; max-width: 100%; }
.ev .a-stage.teacher .a-row { bottom: 128px; }
.ev .a-stage.teacher .a-fox { right: 40px; bottom: 196px; }
.ev .t-book i { font-size: 24px; }
.ev .t-book .t-book-t { overflow: hidden; text-overflow: ellipsis; }
.ev .t-book.need { background: #e9a92a; border-color: #b4781a; box-shadow: 0 5px 0 #b4781a; animation: ev-needp 1.4s infinite ease-in-out; }
@keyframes ev-needp { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.05); } }
.ev .t-place { display: inline-flex; gap: 8px; align-items: center; border: 0; border-radius: 14px; padding: 10px 16px 12px; font-family: Rubik; font-weight: 800; font-size: 17px; }
.ev .t-place i { font-size: 22px; }
.ev .t-today { border: 0; text-align: left; cursor: pointer; }
.ev .t-today .gi { color: #3a9c4f; }
.ev .t-today .bar { width: 120px; height: 7px; border-radius: 4px; background: rgba(124, 74, 42, .16); margin-top: 5px; overflow: hidden; }
.ev .t-today .bar b { display: block; height: 100%; background: linear-gradient(90deg, #7ee08a, #3a9c4f); }
.ev .cls-row { border: 0; width: 100%; text-align: left; cursor: pointer; }
.ev .cls-row .grow { white-space: normal; }
.ev .cls-row small { display: block; font-size: 12px; color: var(--muted); font-weight: 700; }
.ev .cls-row .warn { color: #b4621a; }
.ev .cls-row .pl { font-family: Rubik; font-weight: 800; font-size: 14px; color: var(--muted); white-space: nowrap; }
.ev .a-rank.t-cls { max-height: calc(100% - 300px); min-height: 160px; overflow: auto; }
.ev .a-rank.up { top: auto; left: auto; right: 18px; bottom: 196px; max-height: calc(100% - 212px); z-index: 10; } /* Над столбиком кнопок справа */
.ev .a-rank.up::before { top: auto; bottom: -9px; left: auto; right: 40px; border: 10px solid transparent; border-top-color: var(--gm-parch); border-bottom: 0; }
.ev .t-note { display: flex; align-items: center; justify-content: center; text-align: center; padding: 0 20px; font-weight: 800; color: var(--ink); }
.ev .t-note:empty { display: none; }
.ev .st-sub { font-size: 14px !important; color: var(--muted); margin: 0 0 4px !important; }
.ev .st-foot { margin-top: 12px !important; font-size: 13px !important; }
.ev .st-row { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: 14px; background: rgba(255, 255, 255, .6); font-weight: 800; text-align: left; margin-bottom: 5px; }
.ev .st-row .st-ava { width: 34px; height: 34px; border-width: 2px; }
.ev .st-row.never .st-ava { filter: grayscale(.7); opacity: .7; }
.ev .st-row .grow { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ev .st-row .flk { display: inline-flex; gap: 1px; color: rgba(124, 74, 42, .2); }
.ev .st-row .flk i.on { color: var(--gm-acc); }
.ev .st-row .tot { width: 96px; text-align: right; font-size: 13px; color: var(--muted); line-height: 1.15; }
.ev .st-row .tot small { display: block; font-size: 11px; font-weight: 700; }
.ev .st-row.never .tot { color: #b4621a; }
.ev .st-group { text-align: left; font-family: Rubik; font-weight: 800; font-size: 14px; margin: 12px 4px 6px; }
.ev .st-group.warn { color: #b4621a; }
.ev .book[disabled] { opacity: .4; cursor: default; }
@media (max-width: 760px) {
    .ev .t-row { grid-template-columns: 1fr 1fr; bottom: 100px; }
    .ev .t-row > .t-book, .ev .t-row > .play { grid-column: 1 / -1; order: -1; justify-self: stretch; font-size: 16px; padding: 12px 8px; }
    .ev .t-row > .t-today { padding: 6px 10px; }
    .ev .t-row > .t-today .txt { display: block; font-size: 12px; }
    .ev .t-row > .t-today .bar { width: 90px; }
    .ev .t-book i { font-size: 20px; }
    .ev .t-place { font-size: 14px; padding: 8px 10px 10px; }
    .ev .t-place .txt { display: none; }
    .ev .a-rank.up { right: 10px; bottom: 236px; max-height: calc(100% - 252px); }
    .ev .a-stage.teacher .a-tree { bottom: max(36%, 220px); height: 50%; }
    .ev .a-stage.teacher .a-fox { right: 8px; bottom: 226px; }
    .ev .a-stage.teacher .a-row { bottom: 100px; }
    .ev .st-row .flk { display: none; }
}
@media (orientation: landscape) and (max-height: 500px) and (pointer: coarse) {
    .ev .t-book { font-size: 15px; padding: 8px 16px; }
    .ev .t-today .txt { font-size: 12px; }
    .ev .t-today .bar { width: 80px; }
    .ev .t-place { font-size: 14px; padding: 6px 10px 8px; }
    .ev .a-rank.up { bottom: 120px; max-height: calc(100% - 130px); overflow: auto; }
}

/* ============ Голосование «Какая ёлка красивее» ============ */
.ev .v-wait { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 40px; }
.ev .v-title { position: absolute; top: 18px; left: 50%; transform: translateX(-50%); z-index: 6; padding: 10px 22px; border-radius: 18px; text-align: center; font-family: Rubik; font-weight: 900; font-size: 22px; white-space: nowrap; }
.ev .v-title small { display: block; font-family: Nunito; font-weight: 700; font-size: 13px; color: var(--muted); }
.ev .v-pair { position: absolute; top: 126px; bottom: 74px; left: 3%; right: 3%; z-index: 6; display: grid; grid-template-columns: 1fr auto 1fr; align-items: stretch; gap: 10px; }
.ev .v-opt { border: 0; background: radial-gradient(ellipse 60% 14% at 50% 94%, rgba(255, 255, 255, .55), transparent 70%); border-radius: 24px; padding: 6px; transition: transform .2s, filter .2s, opacity .3s; cursor: pointer; min-height: 0; min-width: 0; }
.ev .v-opt .tree-svg { height: 100%; }
.ev .v-opt:hover { transform: translateY(-6px); filter: drop-shadow(0 0 18px rgba(255, 230, 160, .7)); }
.ev .v-opt.win { transform: scale(1.04); filter: drop-shadow(0 0 26px rgba(255, 215, 110, .95)); }
.ev .v-opt.lose { opacity: .3; }
.ev .v-or { align-self: center; font-family: Rubik; font-weight: 900; font-size: 20px; color: #fff; text-shadow: 0 2px 6px rgba(0, 0, 0, .5); }
.ev .v-foot { position: absolute; left: 12px; right: 12px; bottom: 8px; z-index: 6; padding: 12px 16px; border-radius: 18px; text-align: center; font-weight: 700; font-size: 14px; color: var(--ink);
    background: rgba(255, 255, 255, .55); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border: 1px solid rgba(255, 255, 255, .6); }
.ev .a-stage.vote .a-tl { z-index: 7; }
@media (max-width: 760px) {
    .ev .v-title { font-size: 17px; padding: 8px 14px; top: 118px; white-space: normal; width: calc(100% - 20px); }
    .ev .v-pair { top: 220px; bottom: 90px; left: 2%; right: 2%; gap: 4px; }
    .ev .v-opt { display: flex; align-items: center; }   /* узкая ячейка: ёлка по ширине и посередине, а не внизу */
    .ev .v-opt .tree-svg { height: auto; width: 100%; }
    .ev .v-or { font-size: 14px; }
    .ev .v-foot { font-size: 12px; padding: 8px 10px; }
}
@media (orientation: landscape) and (max-height: 500px) and (pointer: coarse) {
    .ev .v-title { top: 10px; font-size: 16px; padding: 6px 14px; }
    .ev .v-title small { display: none; }
    .ev .v-pair { top: 64px; bottom: 50px; }
    .ev .v-count { flex-direction: row; margin-top: 2px; font-size: 12px; }
    .ev .v-count i { width: 90px; }
    .ev .v-foot { padding: 6px 10px; font-size: 12px; bottom: 4px; }
}

/* ============ Зал славы ============ */
/* Зал — «сцена» с постоянными пропорциями: размеры в cqw (доля ширины сцены), поэтому всё масштабируется вместе.
   Подиум 1–3 — в глубине зала у стены (низ постаментов — на линии пола, 70% высоты задника), места 4–10 — ближе, на паркете */
.ev .hall { border-radius: 30px; overflow: hidden; color: #fff4e0; background: #3b2238; box-shadow: 0 10px 30px rgba(40, 20, 30, .3); }
.ev .hall-scene { position: relative; container-type: inline-size; aspect-ratio: 1180 / 1020;
    background: linear-gradient(rgba(30, 12, 26, .35), rgba(30, 12, 26, 0) 32%), url('images/event/hall-bg.webp') 50% 0 / auto 100% no-repeat, #3b2238; }
.ev .hall .back { position: absolute; top: 1.8cqw; left: 2cqw; z-index: 4; white-space: nowrap; display: inline-flex; gap: 8px; align-items: center; padding: 9px 14px 11px; border-radius: 14px; font-family: Rubik; font-weight: 800; border: 0; color: var(--ink); }
.ev .hall-head { position: absolute; top: 1cqw; left: 0; right: 0; z-index: 3; display: flex; flex-direction: column; align-items: center; gap: .7cqw; }
.ev .banner { position: relative; width: 34cqw; aspect-ratio: 1400 / 312; background: url('images/event/banner-hall.webp') center / contain no-repeat; }
.ev .banner h1 { position: absolute; left: 50%; top: 53%; transform: translate(-50%, -50%); white-space: nowrap; font-size: 3cqw; line-height: 1; font-weight: 900; color: #fff6e0; text-shadow: 0 2px 0 #6e1a1a, 0 0 8px rgba(110, 26, 26, .6); letter-spacing: .02em; }
.ev .hall-sub { font-weight: 800; font-size: max(12px, 1.2cqw); color: #f3e2c8; text-shadow: 0 1px 3px rgba(0, 0, 0, .6); }
.ev .hall-segs { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }
.ev .hseg { display: inline-flex; background: rgba(0, 0, 0, .3); border-radius: 14px; padding: 4px; gap: 4px; }
.ev .hseg button { border: 0; background: transparent; color: #e8cfae; padding: 7px 12px; border-radius: 10px; font-weight: 800; font-size: max(12px, 1.15cqw); }
.ev .hseg button.on { background: #f7d27a; color: #4a2c17; }
/* Категории по размеру (мини-группы / группы / классы) — второй переключатель, светлее номинаций */
.ev .hseg-league button.on { background: #fff6e0; }
.ev .hseg button i, .ev .rank-scope button i { font-size: .9em; vertical-align: -1px; }
.ev .hall-empty { position: absolute; left: 50%; top: 45%; transform: translate(-50%, -50%); width: min(440px, 80%); padding: 16px 20px; border-radius: 20px; text-align: center; font-weight: 800; color: var(--ink); }
.ev .row-podium { position: absolute; left: 0; right: 0; bottom: 29.1%; z-index: 1; display: flex; justify-content: center; align-items: flex-end; gap: 3cqw; }
.ev .row-honor { position: absolute; left: 1.5cqw; right: 1.5cqw; bottom: 1.5%; z-index: 2; display: flex; justify-content: center; align-items: flex-end; gap: 1cqw; }
.ev .stand { position: relative; display: flex; flex-direction: column; align-items: center; flex: 0 0 auto; }
.ev .stand.p1 { width: 21.5cqw; } .ev .stand.p2, .ev .stand.p3 { width: 19cqw; }
.ev .row-honor .stand { width: 12.8cqw; }
/* Лампа на цепи (lamp.webp, 190×900: внизу колокол с лампочкой); цепь продлена линией до потолка */
.ev .lamp { position: absolute; left: 50%; bottom: calc(100% + 3.4cqw); width: 5.4cqw; height: 60cqw; transform: translateX(-50%); z-index: 1; pointer-events: none;
    background: url('images/event/lamp.webp') center bottom / 100% auto no-repeat, linear-gradient(#8a5a3a, #8a5a3a) center top / 2px calc(100% - 20cqw) no-repeat; }
.ev .beam { position: absolute; z-index: 0; left: 50%; top: -4.7cqw; width: 170%; height: calc(100% + 4cqw); transform: translateX(-50%); pointer-events: none;
    background: linear-gradient(rgba(255, 238, 190, .3), rgba(255, 238, 190, 0) 85%); clip-path: polygon(calc(50% - 2.5cqw) 0, calc(50% + 2.5cqw) 0, 100% 100%, 0 100%); }
/* Витрина стоит на верхней площадке постамента: постамент заезжает под неё */
.ev .case { position: relative; z-index: 2; width: 92%; border-radius: 14px 14px 3px 3px; padding: .6cqw .4cqw 0; border: 2px solid rgba(255, 255, 255, .35); border-bottom: 0;
    background: linear-gradient(135deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, .03) 45%, rgba(255, 255, 255, .1)); box-shadow: inset 0 0 24px rgba(255, 255, 255, .08); }
.ev .case .tree-svg { height: 100%; }
.ev .stand.p1 .case { height: 26cqw; }
.ev .stand.p2 .case, .ev .stand.p3 .case { height: 22cqw; }
.ev .row-honor .case { height: 15.5cqw; }
.ev .ped { position: relative; z-index: 1; width: 100%; background: url('images/event/pedestal.webp') center / 100% 100% no-repeat; filter: drop-shadow(0 8px 10px rgba(0, 0, 0, .4)); aspect-ratio: 600 / 248; margin-top: -3.3%; }
.ev .stand.p1 .ped, .ev .stand.p2 .ped, .ev .stand.p3 .ped { background-image: url('images/event/pedestal-top.webp'); }
.ev .stand.p1 .ped { aspect-ratio: 2.05; margin-top: -4.9%; }
.ev .stand.p2 .ped { aspect-ratio: 2.6; margin-top: -3.8%; }
.ev .stand.p3 .ped { aspect-ratio: 3.1; margin-top: -3.2%; }
/* Табличка — ровно между полосами постамента */
.ev .plaque { position: absolute; left: 50%; transform: translateX(-50%); top: 33%; bottom: 9%; max-width: 90%; display: flex; align-items: center; gap: .6cqw; padding: 0 .9cqw; border-radius: .5cqw;
    color: #3a2410; white-space: nowrap; background: linear-gradient(#e9d3a0, #b9934e); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .6), 0 2px 0 rgba(0, 0, 0, .2); }
.ev .stand.p1 .plaque, .ev .stand.p2 .plaque, .ev .stand.p3 .plaque { top: 28%; bottom: 25%; gap: .8cqw; padding: 0 1.2cqw; }
.ev .stand.p1 .plaque { background: linear-gradient(#fbe39a, #d9a22a); }
.ev .stand.p2 .plaque { background: linear-gradient(#f1f4f7, #a9b6c4); }
.ev .stand.p3 .plaque { background: linear-gradient(#f0c9a4, #b87a4a); }
.ev .pl-n { font-family: Rubik; font-weight: 900; font-size: 2.3cqw; line-height: 1; }
.ev .stand.p1 .pl-n { font-size: 3.4cqw; } .ev .stand.p2 .pl-n { font-size: 3cqw; } .ev .stand.p3 .pl-n { font-size: 2.6cqw; }
.ev .stand.p1 .pl-name, .ev .stand.p2 .pl-name, .ev .stand.p3 .pl-name { font-size: 1.4cqw; }
.ev .stand.p1 .pl-v, .ev .stand.p2 .pl-v, .ev .stand.p3 .pl-v { font-size: 1.05cqw; }
.ev .pl-t { display: flex; flex-direction: column; min-width: 0; text-align: left; }
.ev .pl-name { font-weight: 900; font-size: 1.15cqw; line-height: 1.1; overflow: hidden; text-overflow: ellipsis; }
.ev .pl-v { font-weight: 700; font-size: .9cqw; line-height: 1.1; opacity: .8; }
.ev .row-honor .plaque { gap: .45cqw; padding: 0 .6cqw; }
.ev .row-honor .pl-n { font-size: 1.7cqw; }
.ev .row-honor .pl-name { font-size: .95cqw; }
.ev .row-honor .pl-v { font-size: .75cqw; }
.ev .me-tag { position: absolute; top: -1.5cqw; z-index: 3; background: var(--gm-acc); color: #fff; font-weight: 900; font-size: max(11px, 1cqw); padding: 3px 10px; border-radius: 10px; box-shadow: 0 2px 0 var(--gm-acc-d); white-space: nowrap; }
.ev .stand.me .case { border-color: rgba(120, 190, 255, .8); box-shadow: inset 0 0 24px rgba(120, 190, 255, .25), 0 0 18px rgba(120, 190, 255, .35); }
.ev .hall-note { margin: 0 auto; padding: 14px 18px 18px; max-width: 800px; text-align: center; font-weight: 700; font-size: 14px; color: #f3e2c8; line-height: 1.5; }
.ev .hall-note b { color: #f7d27a; }
.ev .hall-certs { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 12px; }
.ev .hall-certs .btn { font-size: 15px; padding: 10px 16px; display: inline-flex; gap: 8px; align-items: center; }
@media (max-width: 760px) {
    .ev .hall-scene { aspect-ratio: auto; padding: 0 8px 16px; background: url('images/event/hall-bg.webp') 50% 0 / auto 330px no-repeat, linear-gradient(#3b2238 0 231px, #7a4a2a 231px); }
    .ev .hall .back { top: 10px; left: 10px; padding: 8px 12px 10px; }
    .ev .hall .back .txt { display: none; }
    .ev .hall-head { position: static; padding-top: 10px; gap: 6px; }
    .ev .banner { width: min(250px, 62vw); }
    .ev .banner h1 { font-size: 20px; }
    .ev .lamp { display: none; }
    .ev .beam { top: -40px; height: calc(100% + 30px); }
    .ev .row-podium, .ev .row-honor { position: static; }
    .ev .row-podium { gap: 6px; margin-top: 40px; }
    .ev .stand.p1 { width: 34%; } .ev .stand.p2, .ev .stand.p3 { width: 30%; }
    .ev .stand.p1 .case { height: 170px; } .ev .stand.p2 .case, .ev .stand.p3 .case { height: 140px; }
    .ev .stand.p1 .ped, .ev .stand.p2 .ped, .ev .stand.p3 .ped { aspect-ratio: 2; margin-top: -5%; } /* постаменты одной высоты: иначе табличке тесно */
    .ev .row-honor { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px 8px; margin-top: 34px; }
    .ev .row-honor .stand { width: auto; }
    .ev .row-honor .case { height: 130px; }
    .ev .me-tag { top: -12px; }
    .ev .case { padding: 4px 3px 0; }
    .ev .plaque, .ev .stand.p1 .plaque, .ev .stand.p2 .plaque, .ev .stand.p3 .plaque { gap: 4px; padding: 0 6px; border-radius: 6px; }
    .ev .pl-n, .ev .stand.p1 .pl-n, .ev .stand.p2 .pl-n, .ev .stand.p3 .pl-n { font-size: 18px; }
    .ev .pl-name, .ev .stand.p1 .pl-name, .ev .stand.p2 .pl-name, .ev .stand.p3 .pl-name { font-size: 11px; }
    .ev .pl-v, .ev .stand.p1 .pl-v, .ev .stand.p2 .pl-v, .ev .stand.p3 .pl-v { font-size: 9px; }
    .ev .row-honor .pl-n { font-size: 15px; } .ev .row-honor .pl-name { font-size: 10px; } .ev .row-honor .pl-v { font-size: 9px; }
    .ev .hall-empty { position: static; transform: none; margin: 60px auto 20px; width: auto; }
}

/* ============ Фото на память, альбом, грамота ============ */
.ev .inv-tabs { display: inline-flex; gap: 4px; background: rgba(124, 74, 42, .12); border-radius: 14px; padding: 4px; margin: 2px 0 12px; }
.ev .inv-tabs button { border: 0; background: transparent; border-radius: 10px; padding: 7px 14px; font-weight: 800; color: var(--muted); }
.ev .inv-tabs button.on { background: #fff; color: var(--ink); box-shadow: 0 2px 0 rgba(124, 74, 42, .15); }
.ev .card.photo-card { width: min(520px, 100%); }
.ev .ph-cv { display: block; width: min(100%, 380px); margin: 4px auto 12px; border-radius: 6px; box-shadow: 0 6px 18px rgba(74, 44, 23, .25); background: #fff; aspect-ratio: 1080 / 1350; }
.ev .ph-note { font-size: 13px !important; color: var(--muted); margin: 0 0 12px !important; }
.ev .card.cert-card { width: min(760px, 100%); }
.ev .cert-cv { width: 100%; aspect-ratio: 1754 / 1240; }
.ev .cert-who { display: flex; align-items: center; justify-content: center; gap: 8px; font-weight: 800; margin-bottom: 10px; }
.ev .cert-who select { font: inherit; border-radius: 12px; border: 2px solid rgba(124, 74, 42, .2); padding: 6px 10px; background: #fff; max-width: 100%; }
.ev .card.album-card { width: min(720px, 100%); }
.ev .alb-title { font-size: 20px; font-weight: 900; display: flex; gap: 8px; align-items: center; margin: 0 0 14px; color: #1e293b; }
.ev .alb-title i { color: var(--gm-acc); }
.ev .alb-cover { display: flex; align-items: center; gap: 18px; width: 100%; max-width: 460px; border: 1px solid #f1e6d6; background: #fffaf2; border-radius: 22px; padding: 14px 18px; text-align: left; box-shadow: 0 3px 0 rgba(124, 74, 42, .14); }
.ev .alb-cover:hover { background: #fff; }
.ev .alb-cover > i { margin-left: auto; font-size: 20px; color: var(--muted); }
.ev .alb-stack { position: relative; width: 120px; height: 130px; flex-shrink: 0; }
.ev .alb-stack canvas { position: absolute; top: 0; left: 10px; width: 92px; aspect-ratio: 1080 / 1350; border-radius: 3px; box-shadow: 0 3px 10px rgba(74, 44, 23, .3); background: #fff; }
.ev .alb-stack canvas:first-child:not(:last-child) { transform: rotate(-8deg); left: 0; }
.ev .alb-stack canvas:last-child:not(:first-child) { transform: rotate(6deg); left: 26px; top: 6px; }
.ev .alb-t b { display: block; font-family: Rubik; font-weight: 900; font-size: 20px; }
.ev .alb-t small { font-weight: 800; color: var(--muted); }
.ev .alb-sub { text-align: center; font-size: 14px !important; color: var(--muted); }
.ev .alb-photos { display: flex; gap: 16px; justify-content: center; margin-bottom: 18px; }
.ev .alb-ph { border: 0; background: none; padding: 0; width: min(46%, 240px); transition: transform .15s; }
.ev .alb-ph:hover { transform: translateY(-3px) rotate(-1deg); }
.ev .alb-ph canvas { width: 100%; aspect-ratio: 1080 / 1350; border-radius: 4px; box-shadow: 0 6px 16px rgba(74, 44, 23, .25); background: #fff; display: block; }
.ev .alb-h { font-size: 17px; font-weight: 900; margin: 0 0 10px; text-align: left; }
.ev .coll { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 8px; }
.ev .coll .c { border-radius: 16px; background: #fff; padding: 8px 4px 6px; text-align: center; position: relative; box-shadow: 0 3px 0 rgba(124, 74, 42, .14); }
.ev .coll .c svg { width: 48px; height: 52px; }
.ev .coll .c .nm { font-size: 12px; font-weight: 800; }
.ev .coll .c .rr { font-size: 11px; font-weight: 900; }
.ev .coll .c .x2 { position: absolute; top: 6px; right: 8px; font-size: 11px; font-weight: 900; color: var(--muted); }
.ev .coll .c.no svg { filter: grayscale(1) brightness(.6) opacity(.25); }
.ev .coll .c.no .nm { color: #c0ab98; }
@media (max-width: 760px) { .ev .coll { grid-template-columns: repeat(auto-fill, minmax(74px, 1fr)); } }

/* Голосование: сколько пар осталось — «Пара 6 из 21» и полоска под заголовком */
.ev .v-count { margin-top: 6px; display: flex; flex-direction: column; align-items: center; gap: 4px; font-family: Nunito; font-weight: 800; font-size: 13px; color: var(--muted); }
.ev .v-count b { color: var(--ink); }
.ev .v-count i { display: block; width: min(220px, 100%); height: 7px; border-radius: 4px; background: rgba(124, 74, 42, .16); overflow: hidden; }
.ev .v-count i b { display: block; height: 100%; background: linear-gradient(90deg, #9fd3ff, #3b8fd9); transition: width .4s; }

/* Рейтинг: вкладки «Весь сайт» / «Мои классы» (классы одного учителя) */
.ev .rank-scope { display: flex; flex-wrap: wrap; gap: 4px; margin: -2px 0 8px; padding: 3px; border-radius: 12px; background: rgba(124, 74, 42, .12); flex-shrink: 0; }
.ev .rank-scope button { flex: 1 1 auto; white-space: nowrap; border: 0; border-radius: 9px; padding: 5px 8px; background: transparent; font-family: Nunito; font-weight: 800; font-size: 13px; color: var(--muted); cursor: pointer; }
.ev .rank-scope button.on { background: #fff; color: var(--ink); box-shadow: 0 1px 3px rgba(74, 44, 23, .2); }