/* Макет сторис: полоска кружков и проигрыватель. Три вида кадра переключаются data-style у .st-viewer. */
.stories{padding-top:14px;padding-bottom:6px}
.st-strip{display:flex;gap:14px;align-items:flex-start;overflow-x:auto;padding:4px 2px 8px}
.st-ring{all:unset;box-sizing:border-box;width:72px;flex:none;text-align:center;cursor:pointer;font-size:11px;color:var(--ink-2)}
.st-ring:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:12px}
.st-ring b{display:block;color:var(--ink);font-weight:600;margin-top:6px}
.st-ring .c{display:grid;place-items:center;width:68px;height:68px;border-radius:50%;padding:3px;margin:0 auto;background:conic-gradient(var(--red),var(--gold),var(--red))}
.st-ring .c span{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;border:3px solid var(--ground);font:900 12px var(--display);color:#fff;background:#1c2a55}
.st-ring.hue-red .c span{background:#3a0f16}.st-ring.hue-gold .c span{background:#4a3a10}
.st-ring.live .c{background:var(--red);animation:st-pulse 1.6s infinite}
.st-ring.live::after{content:"LIVE";display:block;margin:-12px auto 0;position:relative;width:34px;font:700 9px var(--mono);background:var(--red);color:#fff;border-radius:3px;line-height:15px}
.st-ring.seen .c{background:var(--hair)}.st-ring.seen .c span{opacity:.7}
.st-note{align-self:center;color:var(--ink-2);font:500 11px var(--mono);letter-spacing:.06em;padding-left:8px;white-space:nowrap}
@keyframes st-pulse{50%{box-shadow:0 0 0 6px #ff334633}}
@media (prefers-reduced-motion:reduce){.st-ring.live .c{animation:none}}

.st-viewer{--gold:#e2b54a;--red:#ff3346;--blue:#5b7cff;--hair:#2c2f37;--ink:#f1f2f5;--ink-2:#a3a7b3;position:fixed;inset:0;z-index:100;background:#000d;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:12px}
.st-viewer[hidden]{display:none}
.st-stage{position:relative;width:min(100%,360px);height:min(calc(100dvh - 76px),640px);border-radius:22px;overflow:hidden;background:#000;box-shadow:0 0 0 1px var(--hair),0 24px 60px #000a;isolation:isolate}
.st-bars{position:absolute;z-index:6;left:10px;right:10px;top:10px;display:flex;gap:4px}
.st-bars i{flex:1;height:3px;border-radius:2px;background:#ffffff40;overflow:hidden;position:relative}
.st-bars i::after{content:"";position:absolute;inset:0;background:#fff;transform-origin:left;transform:scaleX(0)}
.st-bars i.done::after{transform:scaleX(1)}
.st-bars i.run::after{animation:st-fill var(--dur,6s) linear forwards}
.st-viewer.paused .st-bars i.run::after{animation-play-state:paused}
@keyframes st-fill{to{transform:scaleX(1)}}
@media (prefers-reduced-motion:reduce){.st-bars i.run::after{animation:none;transform:scaleX(1)}}
.st-who{position:absolute;z-index:6;left:12px;right:12px;top:24px;display:flex;align-items:center;gap:8px;font-size:12px;color:#fff}
.st-who i{width:28px;height:28px;flex:none;border-radius:50%;background:var(--red);display:grid;place-items:center;font:900 7px var(--display);font-style:normal;letter-spacing:-.02em}
.st-who b{font-weight:600}.st-who span{color:#ffffffb0}
.st-close{all:unset;margin-left:auto;width:32px;height:32px;display:grid;place-items:center;font-size:22px;cursor:pointer;border-radius:50%}
.st-close:focus-visible{outline:2px solid #fff}
.st-share{all:unset;margin-left:auto;width:32px;height:32px;display:grid;place-items:center;cursor:pointer;border-radius:50%}.st-share+.st-close{margin-left:0}.st-share:focus-visible{outline:2px solid #fff}
.st-frame .st-react{position:absolute;right:10px;bottom:132px;z-index:7;display:grid;gap:8px}
.st-rx{all:unset;box-sizing:border-box;min-width:46px;padding:6px 4px;display:grid;justify-items:center;gap:1px;border-radius:14px;background:#0000007a;color:#fff;font-size:20px;line-height:1.1;cursor:pointer}
.st-rx b{font:600 11px var(--mono)}
.st-rx.on{background:#fff;color:#111}
.st-rx:focus-visible{outline:2px solid #fff}
.st-toast{position:absolute;left:50%;top:64px;transform:translateX(-50%);z-index:12;background:#fff;color:#111;font:600 13px var(--body);padding:8px 14px;border-radius:999px;pointer-events:none}
.st-tap{all:unset;position:absolute;z-index:2;top:64px;bottom:76px;width:34%;cursor:pointer}.st-tap.l{left:0}.st-tap.r{right:0}
.st-frame{position:absolute;inset:0;color:#fff;font-family:var(--body);pointer-events:none}
.st-frame .st-int,.st-frame a,.st-frame video{pointer-events:auto}
.st-frame>*{position:relative;z-index:3}
.st-frame a.st-cta,.st-frame .st-cta{position:absolute;z-index:7;left:12px;right:12px;bottom:12px;height:40px;display:grid;place-items:center;text-decoration:none;font:600 13px var(--body)}
.st-style{display:flex;gap:6px}
.st-style button{all:unset;cursor:pointer;padding:7px 12px;border-radius:999px;background:#ffffff1a;color:#fff;font:600 12px var(--body)}
.st-style button[aria-pressed=true]{background:#fff;color:#111}
.st-style button:focus-visible{outline:2px solid #fff}

/* общие части кадра */
.st-body{position:absolute;inset:70px 16px 64px;display:flex;flex-direction:column;justify-content:flex-end}
.st-kick{font:500 10px var(--mono);letter-spacing:.12em;text-transform:uppercase}
.st-title{font:900 26px/1.08 var(--display);margin:8px 0;text-wrap:balance}
.st-text{margin:0;font-size:15px;line-height:1.4}
.st-scoreline{display:flex;justify-content:space-between;align-items:center;margin:12px 0 4px}
.st-score{font:900 58px/1 var(--display);letter-spacing:-.02em}
.st-teams{display:flex;justify-content:space-between;font:700 12px var(--display);text-transform:uppercase}
.st-events{list-style:none;margin:14px 0 0;padding:0 0 0 12px;border-left:2px solid #ffffff30;display:flex;flex-direction:column;gap:8px;font-size:13px}
.st-events li b{font:700 12px var(--mono);margin-right:8px}
.st-opt{margin-top:8px;position:relative;isolation:isolate;padding:10px 12px;border-radius:10px;background:#ffffff1f;font-weight:600;display:flex;justify-content:space-between;overflow:hidden}
.st-opt u{position:absolute;inset:0 auto 0 0;background:#ffffff33;z-index:-1}
.st-author{margin-top:12px;font-weight:600}

/* А · Классика */
[data-style=classic] .st-frame{background:radial-gradient(120% 70% at 30% 0%,#ff334680,#0000 60%),radial-gradient(90% 60% at 100% 100%,#5b7cff66,#0000 60%),linear-gradient(160deg,#2a0f14,#0d1020 70%)}
[data-style=classic] .st-frame[data-tone=blue]{background:radial-gradient(120% 70% at 30% 0%,#5b7cff80,#0000 60%),linear-gradient(160deg,#10183a,#0b0c0f 70%)}
[data-style=classic] .st-frame[data-tone=gold]{background:radial-gradient(120% 70% at 30% 0%,#e2b54a77,#0000 60%),linear-gradient(160deg,#3a2c08,#0b0c0f 70%)}
[data-style=classic] .st-frame::before{content:"";position:absolute;inset:0;background:linear-gradient(#0009,#0000 25%,#0000 45%,#000d);z-index:1}
[data-style=classic] .st-kick{display:inline-block;align-self:flex-start;background:var(--red);padding:3px 8px;border-radius:3px}
[data-style=classic] .st-cta{background:#fff;color:#111;border-radius:20px}

/* Б · Табло */
[data-style=tablo] .st-frame{background:repeating-linear-gradient(0deg,#ffffff06 0 1px,#0000 1px 3px),linear-gradient(#101114,#16171b)}
[data-style=tablo] .st-body{justify-content:flex-start}
[data-style=tablo] .st-kick{color:var(--gold);border-bottom:1px solid var(--hair);padding-bottom:8px}
[data-style=tablo] .st-title{font-size:20px;text-transform:uppercase}
[data-style=tablo] .st-score{font-family:var(--mono);font-size:78px;text-shadow:0 0 28px #e2b54a55}
[data-style=tablo] .st-events{border-color:var(--hair)}[data-style=tablo] .st-events li b{color:var(--gold)}
[data-style=tablo] .st-opt{border-radius:0;background:var(--hair)}[data-style=tablo] .st-opt u{background:var(--gold);opacity:.35}
[data-style=tablo] .st-author{color:var(--gold)}
[data-style=tablo] .st-cta{background:var(--gold);color:#111;border-radius:4px;font-family:var(--mono);text-transform:uppercase;letter-spacing:.08em}

/* В · Плакат */
[data-style=poster] .st-frame{background:var(--red)}
[data-style=poster] .st-frame[data-tone=blue]{background:var(--blue)}
[data-style=poster] .st-frame[data-tone=gold]{background:var(--gold);color:#111}
[data-style=poster] .st-title{font-size:34px;line-height:.98;text-transform:uppercase}
[data-style=poster] .st-score{font-size:84px;line-height:.9}
[data-style=poster] .st-kick{align-self:flex-start;background:#111;color:#fff;padding:5px 9px}
[data-style=poster] .st-text{font-weight:600}
[data-style=poster] .st-events{border-color:#0004}
[data-style=poster] .st-opt{border-radius:0;background:#111;color:#fff}[data-style=poster] .st-opt u{background:#fff3}
[data-style=poster] .st-frame[data-tone=gold] .st-kick,[data-style=poster] .st-frame[data-tone=gold] .st-opt{color:#fff}
[data-style=poster] .st-cta{background:#111;color:#fff;border-radius:0}
[data-style=poster] .st-frame[data-kind=quote] .st-text{background:#fff;color:#111;padding:14px;font:700 19px/1.25 var(--body)}
[data-style=poster] .st-teams{color:inherit}

/* видео, звук, скрытие шапки при удержании */
.st-viewer.holding .st-bars,.st-viewer.holding .st-who,.st-viewer.holding .st-sound{opacity:0;transition:opacity .15s}
.st-bars,.st-who{transition:opacity .15s}
.st-video{position:absolute!important;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--st-focus,50% 50%);z-index:1!important;background:#000}
.st-frame[data-kind=video]::before{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(#0008,#0000 22%,#0000 55%,#000c)}
.st-frame[data-kind=video] .st-body{z-index:3}
.st-frame[data-kind=video] .st-title{font-size:22px}
[data-style=poster] .st-frame[data-kind=video] .st-title{background:#111;padding:6px 10px;display:inline;box-decoration-break:clone;-webkit-box-decoration-break:clone}
[data-style=tablo] .st-frame[data-kind=video] .st-kick{border-bottom:0}
.st-sound{all:unset;position:absolute;z-index:8;right:14px;bottom:64px;width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:#000a;color:#fff;font-size:17px;cursor:pointer}
.st-sound:focus-visible{outline:2px solid #fff}
.st-sound[hidden]{display:none}

/* голосование в кадре: опрос и Кумир */
.st-int{position:relative;z-index:9}
.st-opt{all:unset;box-sizing:border-box;width:100%;margin-top:8px;position:relative;isolation:isolate;padding:11px 12px;border-radius:10px;background:#ffffff1f;font-weight:600;display:flex;justify-content:space-between;overflow:hidden;cursor:pointer;font-family:var(--body);font-size:14px}
.st-opt:focus-visible{outline:2px solid #fff}
.st-opt u{position:absolute;inset:0 auto 0 0;background:#ffffff33;z-index:-1;transition:width .4s}
.st-opt.mine{box-shadow:inset 0 0 0 2px #fff}
.st-opt[disabled]{cursor:default;opacity:.8}
.st-opt b{font-family:var(--mono)}
.st-hint{margin:10px 0 0;font-size:12px;opacity:.8}
.st-login{display:inline-block;margin-top:10px;color:inherit;font-weight:700;text-decoration:underline}
.st-slots{display:flex;gap:8px;margin:12px 0 10px}
.st-slot{all:unset;box-sizing:border-box;flex:1;min-height:58px;border-radius:10px;border:2px dashed #ffffff55;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:12px;font-weight:600;text-align:center;cursor:pointer;padding:4px}
.st-slot i{font:900 16px var(--display);font-style:normal;opacity:.7}
.st-slot.on{border-style:solid;border-color:#fff;background:#ffffff26}
.st-slot:focus-visible{outline:2px solid #fff}
.st-chips{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.st-chip{all:unset;box-sizing:border-box;padding:7px 4px;border-radius:8px;background:#ffffff1a;text-align:center;font-size:12px;font-weight:600;cursor:pointer;line-height:1.15}
.st-chip small{display:block;font:500 10px var(--mono);opacity:.7}
.st-chip.used{opacity:.3;cursor:default}
.st-chip:focus-visible{outline:2px solid #fff}
.st-send{all:unset;box-sizing:border-box;margin-top:12px;height:40px;display:grid;place-items:center;font:700 13px var(--body);cursor:pointer;width:100%;background:#fff;color:#111;border-radius:20px}
.st-send[disabled]{opacity:.35;cursor:default}
.st-send:focus-visible{outline:2px solid #fff;outline-offset:2px}
.st-mine{margin-top:12px;display:flex;flex-direction:column;gap:6px;font-weight:600}
.st-mine span{display:flex;gap:10px;align-items:center;padding:9px 12px;border-radius:10px;background:#ffffff26}
.st-mine i{font:900 14px var(--display);font-style:normal;width:18px}
[data-style=tablo] .st-slot.on,[data-style=tablo] .st-chip{border-radius:2px}
[data-style=tablo] .st-slot{border-radius:2px}[data-style=tablo] .st-slot.on{border-color:var(--gold);background:#e2b54a22}
[data-style=tablo] .st-chip{background:var(--hair)}[data-style=tablo] .st-send{background:var(--gold);color:#111;border-radius:4px;font-family:var(--mono);text-transform:uppercase;letter-spacing:.08em}
[data-style=tablo] .st-opt{border-radius:0;background:var(--hair)}[data-style=tablo] .st-opt u{background:var(--gold);opacity:.35}
[data-style=tablo] .st-opt.mine{box-shadow:inset 0 0 0 2px var(--gold)}
[data-style=poster] .st-slot,[data-style=poster] .st-chip,[data-style=poster] .st-opt{border-radius:0}
[data-style=poster] .st-slot{border-color:#111a}[data-style=poster] .st-slot.on{background:#111;color:#fff;border-color:#111}
[data-style=poster] .st-chip{background:#111;color:#fff}[data-style=poster] .st-send{background:#111;color:#fff;border-radius:0}
[data-style=poster] .st-mine span{background:#111;color:#fff;border-radius:0}
[data-style=poster] .st-opt.mine{box-shadow:inset 0 0 0 3px #fff}
[data-style=classic] .st-send{border-radius:20px}
.st-style [data-signed-toggle]{margin-left:8px;background:#ffffff0d;border:1px dashed #ffffff55}

/* список игроков: основа и замены, на низком экране прокручивается внутри кадра */
.st-frame[data-kind=kumir] .st-body{inset:66px 16px 12px;justify-content:flex-start}
.st-frame[data-kind=kumir] .st-title{font-size:20px;margin:6px 0 0}
.st-frame[data-kind=kumir] .st-slots{margin:8px 0}
.st-frame[data-kind=kumir] .st-slot{min-height:48px}
.st-pick{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-right:2px;scrollbar-width:thin}
.st-pick .st-chips{gap:5px}
.st-pick .st-chip{padding:6px 4px}
.st-frame[data-kind=kumir] .st-send{margin-top:10px;flex:none}

/* кадры из базы */
.st-events li.y b{color:#ffd23f}
[data-style=poster] .st-events li.y b{color:#111}
.st-livemark{color:#fff;background:var(--red);padding:1px 6px;border-radius:3px;font-weight:700}
.st-frame[data-kind=match] .st-hint{margin:6px 0 0}

/* ссылка «Все сюжеты», страница сюжета */
.st-all{display:block;width:72px;color:var(--ink-2);text-decoration:none}
.st-all .c{display:grid;place-items:center;width:68px;height:68px;border-radius:50%;margin:0 auto;border:2px dashed var(--hair);box-sizing:border-box}
.st-all:hover .c,.st-all:focus-visible .c{color:var(--ink);border-color:var(--ink-2)}
.st-all:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:12px}
.story-watch{margin:10px 0 18px}.story-watch .stories{padding:0}
.story-frames{list-style:none;margin:0;padding:0;display:grid;gap:14px;counter-reset:frame}
.story-frame{counter-increment:frame;background:var(--ground-2);padding:14px 16px;position:relative}
.story-frame h2{margin:4px 0 6px}
.story-events{list-style:none;margin:6px 0;padding:0;display:grid;gap:3px;font-size:14px}
.story-quote{margin:6px 0;padding-left:14px;border-left:3px solid var(--blue);font-weight:600}
.st-ring.live .c span{background:#3a0f16}

/* кружок: метка LIVE лежит на нижнем крае круга, название не больше двух строк */
.st-ring{position:relative}
.st-ring.live::after{position:absolute;top:54px;left:50%;margin:0;transform:translateX(-50%)}
.st-ring b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* работа, ссылка, ролик */
.st-cover{position:absolute!important;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--st-focus,50% 50%);z-index:1!important;background:#000}
.st-frame.has-cover::before{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(#0008,#0000 22%,#0000 35%,#000d)}
.st-frame.has-cover .st-body{z-index:3}
.st-play{all:unset;box-sizing:border-box;margin-top:14px;display:grid;place-items:center;height:56px;border-radius:28px;background:#fff;color:#111;font:700 15px var(--body);cursor:pointer;width:100%}
.st-play:focus-visible{outline:2px solid #fff;outline-offset:2px}
[data-style=tablo] .st-play{background:var(--gold);border-radius:4px;font-family:var(--mono);text-transform:uppercase;letter-spacing:.08em}
[data-style=poster] .st-play{background:#111;color:#fff;border-radius:0}
.st-embed{position:absolute;inset:60px 0 64px;width:100%;height:calc(100% - 124px);border:0;background:#000;z-index:9}
.st-ring .c span{position:relative;overflow:hidden}
/* обложка любой пропорции (вертикальная афиша 9:16 тоже) заполняет круг и обрезается по нему, а не растягивает ячейку в овал */
.st-ring .c span img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}

/* полоска кружков: настоящий список, кружок внутри пункта */
.st-strip{list-style:none;margin:0}
.st-item{flex:none;display:block}
.st-more{align-self:center}
.stories{width:100%;box-sizing:border-box}
.story-photo{display:block;max-width:100%;max-height:420px;border-radius:8px;margin:6px 0}
/* кадр с фото или видео как в сторис: где стоит текст и насколько затемнено под ним */
.st-frame[data-place=top] .st-body{justify-content:flex-start}
.st-frame[data-place=center] .st-body{justify-content:center}
.st-frame[data-place=bottom] .st-body{justify-content:flex-end}
.st-frame[data-shade]::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none}
.st-frame[data-shade=soft][data-place=bottom]::after{background:linear-gradient(0deg,rgba(0,0,0,.6),rgba(0,0,0,0) 55%)}
.st-frame[data-shade=soft][data-place=top]::after{background:linear-gradient(180deg,rgba(0,0,0,.6),rgba(0,0,0,0) 55%)}
.st-frame[data-shade=soft][data-place=center]::after{background:rgba(0,0,0,.35)}
.st-frame[data-shade=strong][data-place=bottom]::after{background:linear-gradient(0deg,rgba(0,0,0,.85),rgba(0,0,0,.25) 75%)}
.st-frame[data-shade=strong][data-place=top]::after{background:linear-gradient(180deg,rgba(0,0,0,.85),rgba(0,0,0,.25) 75%)}
.st-frame[data-shade=strong][data-place=center]::after{background:rgba(0,0,0,.6)}
.st-frame[data-kind=photo] .st-text,.st-frame[data-kind=video] .st-text{font:400 15px/1.35 var(--body);margin:2px 0 6px}
.st-frame[data-kind=photo] .st-kick,.st-frame[data-kind=video] .st-kick{display:none}
/* стикеры кадра: плашка поверх фото в верхней, средней или нижней трети */
.st-sticker{position:absolute;left:16px;right:16px;z-index:6;display:flex;justify-content:center;pointer-events:none}
.st-sticker[data-at=top]{top:92px}
.st-sticker[data-at=center]{top:50%;transform:translateY(-50%)}
.st-sticker[data-at=bottom]{bottom:76px}
.st-stk{pointer-events:auto;display:inline-grid;gap:2px;justify-items:center;max-width:100%;padding:10px 16px;background:#fff;color:#111;border-radius:14px;text-decoration:none;box-shadow:0 8px 26px rgba(0,0,0,.35);font:700 14px/1.2 var(--body);transform:rotate(-2deg)}
.st-pollstk{transform:none;display:grid;justify-items:stretch;gap:0;width:100%;max-width:340px;padding:12px}
.st-pollstk h4{margin:0 0 4px;font:700 15px/1.25 var(--body);color:#111}
.st-pollstk .st-opt{background:#eceef3;color:#111}
.st-pollstk .st-opt u{background:#c9d3f2}
.st-pollstk .st-opt.mine{box-shadow:inset 0 0 0 2px #1d4fd7}
.st-pollstk .st-hint{color:#444;opacity:1}
.st-pollstk .st-login{color:#1d4fd7}
.st-stk small{font:600 10px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#6b6f7b}
.st-stk b{font:900 26px/1 var(--display)}
.st-stk span{max-width:240px;text-align:center}
.st-scorestk{grid-template-columns:auto auto auto;align-items:center;gap:10px}
.st-scorestk b{font-size:24px}
.st-scorestk .st-livemark{grid-column:1/-1;font:700 10px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#c8102e}
.st-mention{font:900 20px var(--display);color:#2a47c9}

/* кнопка кадра как кнопки сайта: красная, квадратная, моноширинные заглавные */
.st-frame a.st-cta,[data-style] .st-frame a.st-cta{background:var(--red);border:2px solid var(--red);border-radius:0;color:#fff;font:700 12px var(--mono);letter-spacing:.1em;text-transform:uppercase;box-sizing:border-box}
.st-frame a.st-cta:hover{filter:brightness(1.1)}

/* ===== афиша: матч, обложка, день в истории, заметка, ссылка, цитата (опрос, Кумир и работы не трогаем) ===== */
.st-stage::after{content:"";position:absolute;z-index:9;left:0;right:0;bottom:0;height:6px;background:linear-gradient(90deg,#c8102e 0 50%,#2f4fd0 50%);pointer-events:none}

/* матч: красно-синий табло с гербами */
.st-viewer .st-frame[data-kind=match]{background:
 radial-gradient(90% 55% at 0% 0%,#c8102e99,#0000 60%),
 radial-gradient(90% 55% at 100% 100%,#2f4fd099,#0000 60%),
 radial-gradient(#ffffff12 1.5px,#0000 2px) 0 0/16px 16px,
 linear-gradient(170deg,#0b1230,#070a1c)}
.st-frame[data-kind=match]::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(115deg,#0000 46%,#ffffff0d 46% 54%,#0000 54%)}
.st-frame[data-kind=match] .st-body{inset:68px 14px 64px;justify-content:flex-start}
.st-frame[data-kind=match] .st-kick{align-self:flex-start;background:var(--gold);color:#111;padding:4px 9px;border-radius:2px;border:0;font-weight:700}
.st-versus{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:6px;margin:26px 0 8px}
.st-side{display:grid;justify-items:center;gap:8px;text-align:center}
.st-side span{font:700 15px/1.05 var(--display);text-transform:uppercase;text-wrap:balance}
.st-crest{width:86px;height:86px;object-fit:contain;filter:drop-shadow(0 6px 14px #0009)}
.st-crest-ph{display:grid;place-items:center;border-radius:50%;background:#ffffff1a;box-shadow:inset 0 0 0 2px #ffffff40;font:900 26px var(--display)}
.st-mid{display:grid;justify-items:center;gap:6px}
.st-frame[data-kind=match] .st-score{font:900 54px/1 var(--display);text-shadow:0 4px 0 #0009;letter-spacing:-.02em}
.st-frame[data-kind=match] .st-when{font-size:38px}
.st-frame[data-kind=match] .st-livemark{background:var(--red);color:#fff;padding:2px 8px;font:700 10px var(--mono);letter-spacing:.14em;text-transform:uppercase;border-radius:2px}
.st-wm{position:absolute!important;z-index:1!important;width:260px;height:260px;object-fit:contain;opacity:.1;filter:grayscale(.2);top:120px;pointer-events:none}
.st-wm.l{left:-90px}.st-wm.r{right:-90px}
.st-frame[data-kind=match]::after{content:"";position:absolute;z-index:1;left:50%;bottom:-120px;width:380px;height:380px;margin-left:-190px;border:2px solid #ffffff1c;border-radius:50%;box-shadow:inset 0 0 0 40px #ffffff05,0 -2px 0 #0000;pointer-events:none}
.st-timeline{list-style:none;margin:16px 0 0;padding:0;position:relative;display:flex;flex-direction:column;gap:5px;max-height:226px;overflow:hidden}
.st-timeline::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;margin-left:-1px;background:#ffffff26}
.st-timeline li{display:grid;grid-template-columns:1fr 46px 1fr;align-items:center;font-size:12.5px;position:relative}
.st-timeline li b{justify-self:center;background:#0b1230;border:1px solid #ffffff40;border-radius:999px;padding:2px 0;width:42px;text-align:center;font:700 11px var(--mono);color:var(--gold);position:relative}
.st-timeline .l{text-align:right;padding-right:8px}.st-timeline .r{padding-left:8px}
.st-timeline .who{display:inline-flex;align-items:center;gap:6px;font-weight:600;white-space:nowrap}
.st-ic{display:inline-block;flex:none}
.st-ic.ball{width:13px;height:13px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff 0 35%,#cfd3e6 36% 70%,#fff 71%);box-shadow:0 0 0 2px #111,0 0 10px #fff6}
.st-ic.card{width:10px;height:14px;border-radius:2px}.st-ic.card.y{background:var(--gold)}.st-ic.card.r{background:#ff3346}
.st-timeline li.goal .who{color:#fff}
/* обложка сюжета: плакат с узором */
.st-viewer .st-frame[data-kind=cover]{background:
 radial-gradient(#ffffff26 1.6px,#0000 2.2px) 0 0/14px 14px,
 linear-gradient(115deg,#c8102e 0 56%,#2f4fd0 56%)}
.st-viewer .st-frame[data-kind=cover].has-cover{background:#000}
.st-frame[data-kind=cover]::before{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(#0008,#0000 28%,#0000 42%,#000c)}
.st-frame[data-kind=cover] .st-kick{align-self:flex-start;background:#fff;color:#111;padding:5px 10px;font-weight:700;border-radius:2px}
.st-frame[data-kind=cover] .st-title{font-size:40px;line-height:.96;text-transform:uppercase;text-shadow:0 3px 0 #0006}
.st-frame[data-kind=cover] .st-text{font-weight:500;color:#fff;opacity:.92}

/* день в истории: страница «Армейского вестника» */
.st-viewer .st-frame[data-kind=day]{background:
 repeating-linear-gradient(0deg,#0000 0 27px,#2a1e0a10 27px 28px),
 #f1eadd;color:#14161c}
.st-frame[data-kind=day]::before{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(120% 70% at 50% 0%,#0000 60%,#9a875c40)}
.st-frame[data-kind=day] .st-body{inset:62px 16px 64px;justify-content:flex-start}
.st-frame[data-kind=day] .st-kick{font:700 10px var(--display);letter-spacing:.24em;color:#c8102e;border-top:3px double #14161c;border-bottom:1px solid #14161c;padding:6px 0;text-align:center}
.st-frame[data-kind=day] .st-title{font:900 40px/1 var(--display);text-transform:uppercase;text-align:center;margin:12px 0 10px;color:#14161c;letter-spacing:-.01em}
.st-frame[data-kind=day] .st-events{border:0;padding:0;margin:0;gap:0;max-height:330px;overflow:hidden}
.st-frame[data-kind=day] .st-events li{display:grid;grid-template-columns:54px 1fr;gap:8px;align-items:baseline;padding:7px 0;border-bottom:1px solid #14161c33;font:400 13px/1.25 var(--body);color:#14161c}
.st-frame[data-kind=day] .st-events li b{font:900 14px var(--display);color:#c8102e;margin:0;white-space:nowrap}
.st-frame[data-kind=day] .st-events li:not(:has(b)){display:block}
.st-frame[data-kind=day] a.st-cta,.st-frame[data-kind=day] .st-cta{background:#0e1e46;color:#f0b323;border-color:#0e1e46}

/* заметка и ссылка: крупный плакат с узором и наклейкой-меткой */
.st-viewer .st-frame[data-kind=note]{background:
 radial-gradient(#ffffff2e 1.8px,#0000 2.4px) 0 0/16px 16px,
 linear-gradient(160deg,#c8102e,#8a0b20)}
.st-viewer .st-frame[data-kind=link]{background:
 radial-gradient(#ffffff2e 1.8px,#0000 2.4px) 0 0/16px 16px,
 linear-gradient(160deg,#2f4fd0,#1a2f86)}
.st-frame[data-kind=note] .st-kick,.st-frame[data-kind=link] .st-kick{align-self:flex-start;background:#fff;color:#111;padding:5px 10px;font-weight:700;border-radius:2px;transform:rotate(-2deg);box-shadow:3px 3px 0 #0005}
.st-frame[data-kind=note] .st-title,.st-frame[data-kind=link] .st-title{font-size:38px;line-height:.98;text-transform:uppercase;text-shadow:0 3px 0 #0005}
.st-frame[data-kind=note] .st-text,.st-frame[data-kind=link] .st-text{font-weight:500;font-size:16px;line-height:1.35}
.st-frame[data-kind=note] .st-body::after,.st-frame[data-kind=link] .st-body::after{content:"";display:block;width:64px;height:6px;margin-top:14px;background:var(--gold)}

/* цитата гостевой: газетная вырезка на узоре */
.st-viewer .st-frame[data-kind=quote]{background:
 radial-gradient(#ffffff22 1.6px,#0000 2.2px) 0 0/14px 14px,
 linear-gradient(160deg,#0e1e46,#1f3fc0)}
.st-frame[data-kind=quote] .st-body{justify-content:center}
.st-frame[data-kind=quote] .st-kick{align-self:flex-start;background:var(--gold);color:#111;padding:4px 9px;font-weight:700;border-radius:2px;margin-bottom:12px}
.st-frame[data-kind=quote] .st-text{background:#f9f4e4;color:#14161c;padding:44px 18px 16px;font:italic 400 19px/1.3 "PT Serif",Georgia,serif;border:2px solid #14161c;box-shadow:7px 7px 0 #0007;position:relative;transform:rotate(-1deg)}
.st-qmark{position:absolute;z-index:4;font:900 110px/1 var(--display);color:#c8102e;left:26px;top:52px;pointer-events:none}
.st-frame[data-kind=quote] .st-author{margin-top:16px;font:700 14px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--gold)}
/* история встреч в кадре матча */
.st-h2h{margin-top:auto;padding-top:14px}
.st-frame[data-kind=match] .st-body{justify-content:flex-start}
.st-frame[data-kind=match] .st-body:not(:has(.st-timeline)):not(:has(.st-h2h)) .st-versus{margin-top:auto;margin-bottom:0}
.st-frame[data-kind=match] .st-body:not(:has(.st-timeline)):not(:has(.st-h2h)) .st-where{margin-bottom:auto}
.st-h2h small{display:block;font:600 9px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}
.st-h2h-row{display:flex;gap:6px}
.st-h2h-row span{flex:1;display:grid;justify-items:center;gap:2px;padding:8px 4px;background:#ffffff10;border:1px solid #ffffff1c;font:600 10px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:#cfd5f5}
.st-h2h-row b{font:900 22px/1 var(--display);color:#fff}
.st-h2h-row .w b{color:#4be08a}.st-h2h-row .d b{color:var(--gold)}.st-h2h-row .l b{color:#ff6378}
.st-h2h-bar{display:flex;height:6px;margin-top:8px;gap:2px}
.st-h2h-bar i{display:block;min-width:2px}.st-h2h-bar .w{background:#4be08a}.st-h2h-bar .d{background:var(--gold)}.st-h2h-bar .l{background:#ff6378}
.st-h2h-foot{display:flex;justify-content:space-between;align-items:center;margin-top:8px;font:600 11px var(--mono);letter-spacing:.06em;color:#cfd5f5}
.st-h2h-foot .form{display:flex;gap:4px}.st-h2h-foot .form i{width:12px;height:12px;border-radius:50%;background:#888}
.st-h2h-foot .d-w{background:#4be08a!important}.st-h2h-foot .d-d{background:var(--gold)!important}.st-h2h-foot .d-l{background:#ff6378!important}
.st-frame[data-kind=match] .st-body{padding-bottom:6px}

/* матч как карточка в гостевой: итог цветом полосы под счётом, место, без штампов и отсчёта */
.st-mid small{font:600 10px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#cfd5f5}
.st-mid small .st-livemark{background:var(--red);color:#fff;padding:2px 8px;border-radius:2px}
.st-mid .st-score{position:relative;padding-bottom:8px}
.st-mid .st-score::after{content:"";position:absolute;left:8%;right:8%;bottom:0;height:4px;background:#ffffff2e}
.o-win .st-mid .st-score::after,.st-versus.o-win .st-score::after{background:#4be08a}
.st-versus.o-draw .st-score::after{background:var(--gold)}
.st-versus.o-loss .st-score::after{background:#ff6378}
.st-side b{color:#fff}.st-side span{font-weight:500}
.st-where{text-align:center;font:600 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#cfd5f5;margin-top:8px}

/* ===== страница сюжета: афиша, кнопка «Смотреть» и плитки кадров ===== */
.story-page{padding-bottom:30px}
.story-hero{position:relative;margin:6px 0 16px;padding:28px 26px 26px;color:#fff;overflow:hidden;background:
 radial-gradient(#ffffff26 1.6px,#0000 2.2px) 0 0/16px 16px,
 linear-gradient(110deg,#c8102e 0 58%,#2f4fd0 58%);border:2px solid #14161c;box-shadow:8px 8px 0 #14161c33}
.story-hero::after{content:"";position:absolute;inset:auto 0 0 0;height:6px;background:var(--gold,#f0b323)}
.story-kick{margin:0;display:inline-block;background:#fff;color:#111;padding:5px 10px;font:700 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;transform:rotate(-1.5deg)}
.story-hero h1.page{margin:14px 0 8px;color:#fff;font-size:clamp(34px,6vw,64px);line-height:.96;text-transform:uppercase;text-shadow:0 4px 0 #0005;text-wrap:balance;max-width:900px}
.story-lead{margin:0;max-width:640px;font-size:17px;line-height:1.4;color:#fff;opacity:.95}
.story-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:20px}
.story-play{background:#fff!important;color:#111!important;border-color:#fff!important;font-size:14px;padding:13px 24px}
.story-play::before{content:"▶";margin-right:10px;font-size:12px}
.story-play:hover{background:#111!important;color:#fff!important;border-color:#111!important}
.story-meta{font:600 12px var(--mono);letter-spacing:.08em;text-transform:uppercase;opacity:.9}
.story-strip{padding:0;margin:0}.story-strip .stories{padding:0}.story-strip .st-strip{display:none}
.story-sub{margin:30px 0 12px;font:700 13px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-2)}
.st-tiles{list-style:none;margin:0;padding:6px;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.st-tile button{all:unset;box-sizing:border-box;position:relative;display:flex;flex-direction:column;justify-content:flex-end;gap:4px;width:100%;aspect-ratio:3/4;padding:12px;overflow:hidden;cursor:pointer;color:#fff;background:linear-gradient(160deg,#0e1e46,#1f3fc0);box-shadow:0 0 0 2px #14161c,5px 5px 0 #14161c40;transition:transform .15s,box-shadow .15s}
.st-tile button:hover{transform:translate(-2px,-2px);box-shadow:0 0 0 2px #14161c,8px 8px 0 #14161c55}
.st-tile button:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.st-tile.k-match button{background:radial-gradient(90% 55% at 0 0,#c8102e99,#0000 60%),radial-gradient(90% 55% at 100% 100%,#2f4fd099,#0000 60%),linear-gradient(170deg,#0b1230,#070a1c)}
.st-tile.k-note button{background:linear-gradient(160deg,#c8102e,#8a0b20)}
.st-tile.k-link button{background:linear-gradient(160deg,#2f4fd0,#1a2f86)}
.st-tile.k-day button{background:#f1eadd;color:#14161c}
.st-tile.k-quote button{background:linear-gradient(160deg,#0e1e46,#1f3fc0)}
.st-tile.k-poll button,.st-tile.k-kumir button{background:linear-gradient(160deg,#111,#222)}
.st-tile.has-img button::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#000d,#0000 62%)}
.st-tile>button>img:not(.cr){position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.st-tile>button>*{position:relative;z-index:2}
.st-tile>button>img:not(.cr){z-index:0}
.st-tile .tn{position:absolute;left:10px;top:10px;font:700 11px var(--mono);background:#0008;padding:2px 7px;border-radius:99px}
.st-tile.k-day .tn{background:#14161c;color:#fff}
.st-tile .tk{font:700 9px var(--mono);letter-spacing:.12em;text-transform:uppercase;opacity:.85}
.st-tile .tt{font:700 17px/1.02 var(--display);text-transform:uppercase;text-wrap:balance}
.st-tile.k-quote .tt{font:italic 400 14px/1.25 "PT Serif",Georgia,serif;text-transform:none}
.st-tile .tm{position:absolute;left:0;right:0;top:46px;display:flex;align-items:center;justify-content:center;gap:6px}
.st-tile .tm .cr{width:38px;height:38px;object-fit:contain}
.st-tile .tm b{font:900 22px var(--display)}
.st-tile .tp{position:absolute;left:50%;top:38%;width:44px;height:44px;margin:-22px 0 0 -22px;display:grid;place-items:center;border-radius:50%;background:#000a;font-size:16px}
@media(max-width:560px){.st-tiles{grid-template-columns:repeat(2,1fr)}.story-hero{padding:22px 18px}}

/* предстоящий матч: больше цифр, последние встречи списком */
.st-h2h-sub{margin-top:14px!important}
.st-meetings{list-style:none;margin:0;padding:0;display:grid;gap:5px}
.st-meetings li{display:grid;grid-template-columns:72px 1fr;gap:8px;padding:7px 10px;background:#ffffff0f;border-left:3px solid #ffffff55;font-size:12px;align-items:center}
.st-meetings li.o-win{border-left-color:#4be08a}.st-meetings li.o-draw{border-left-color:var(--gold)}.st-meetings li.o-loss{border-left-color:#ff6378}
.st-meetings .dt{font:600 10px var(--mono);color:#cfd5f5}
.st-meetings .tm b{font:900 13px var(--display);margin:0 3px;color:#fff}
.st-stage:has(.st-frame[data-kind=day]) .st-who{color:#14161c}
.st-stage:has(.st-frame[data-kind=day]) .st-who span{color:#14161c99}
.st-stage:has(.st-frame[data-kind=day]) .st-close,.st-stage:has(.st-frame[data-kind=day]) .st-share{color:#14161c}
.st-stage:has(.st-frame[data-kind=day]) .st-bars i{background:#14161c33}
.st-stage:has(.st-frame[data-kind=day]) .st-bars i::after{background:#14161c}

.story-text{margin-top:18px;border-top:1px solid var(--hair);padding-top:12px}
.story-text summary{cursor:pointer;font:700 12px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2)}
.story-text[open] summary{margin-bottom:12px}

/* содержимое плиток: чтобы не было пустоты */
.st-tile .tx{font:400 12px/1.3 var(--body);opacity:.9}
.st-tile .tb{position:absolute;left:12px;right:12px;top:44px;display:grid;gap:7px}
.st-tile .tb i{display:block;height:14px;background:linear-gradient(90deg,#c8102e,#2f4fd0);border-radius:2px}
.st-tile .tpd{position:absolute;left:12px;right:12px;top:40px;display:flex;align-items:flex-end;justify-content:center;gap:6px;height:76px}
.st-tile .tpd i{flex:1;display:grid;place-items:start center;padding-top:6px;background:#ffffff1f;border-top:3px solid var(--gold,#f0b323);font:900 18px var(--display);font-style:normal}
.st-tile .tpd i:nth-child(1){height:56px}.st-tile .tpd i:nth-child(2){height:76px;background:#f0b32333}.st-tile .tpd i:nth-child(3){height:42px}
.st-tile .td{position:absolute;left:12px;right:12px;top:34px;display:grid;line-height:.9}
.st-tile .td b{font:900 64px var(--display);color:#c8102e}
.st-tile .td small{font:700 15px var(--display);text-transform:uppercase;letter-spacing:.06em}
.st-tile .tq{position:absolute;left:10px;top:24px;font:900 90px/1 var(--display);color:#f0b323;opacity:.9}
.st-tile.k-day .tk{color:#c8102e}

/* плитка внешней ссылки: адрес крупно на бумаге, не синяя заливка */
.st-tile.k-link button{background:#f1eadd;color:#14161c}
.st-tile.k-link .tn{background:#14161c;color:#fff}
.st-tile.k-link .tk{color:#2f4fd0;font-size:11px}
.st-tile.k-link .tt{font-size:20px}
.st-tile.k-link::after{content:"↗";position:absolute;right:14px;top:14px;font:900 28px var(--display);color:#c8102e;pointer-events:none}
.st-tile .tpl{position:absolute;left:12px;right:12px;top:40px;display:grid;gap:5px}
.st-tile .tpl span{display:flex;align-items:center;gap:8px;padding:5px 8px;background:#ffffff1c;border-left:3px solid var(--gold,#f0b323);font:700 13px var(--display);text-transform:uppercase}
.st-tile .tpl i{font:900 15px var(--display);font-style:normal;color:var(--gold,#f0b323)}
/* линия времени: карточки левых узлов прижаты к линии */

/* «Что внутри»: две колонки одинаковых карточек, номер и тип над каждой */
.story-grid{list-style:none;margin:6px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.sg-item{display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:8px;row-gap:8px;align-content:start}
.sg-num{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;font:900 12px var(--display);color:#fff;background:#c8102e}
.sg-item.tone-blue .sg-num{background:#2f4fd0}.sg-item.tone-gold .sg-num{background:#f0b323;color:#111}
.sg-label{font:700 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2)}
.sg-box{grid-column:1/-1;min-width:0}
.sg-box .gb-em{margin-top:0;justify-items:stretch}
.sg-box .em-link{max-width:none;width:100%}
.sg-box div.em-link .em-title{color:inherit}
.sg-box .em-note .em-site,.sg-box .em-quote .em-site,.sg-box .em-day .em-site{color:var(--red)}
@media(max-width:700px){.story-grid{grid-template-columns:1fr}}

/* архив сюжетов: главный сюжет афишей и остальные плитками */
.story-archive{padding-bottom:30px}
.ar-hero{position:relative;display:flex;flex-direction:column;justify-content:flex-end;gap:8px;min-height:280px;margin:6px 0 18px;padding:26px;color:#fff;text-decoration:none;overflow:hidden;border:2px solid #14161c;box-shadow:8px 8px 0 #14161c33;background:radial-gradient(#ffffff26 1.6px,#0000 2.2px) 0 0/16px 16px,linear-gradient(110deg,#c8102e 0 58%,#2f4fd0 58%)}
.ar-hero.has-img{background:#0e1e46}
.ar-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ar-hero.has-img::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0e1e46ee,#0e1e4600 75%)}
.ar-hero>*{position:relative;z-index:1}.ar-hero>img{z-index:0}
.ar-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:6px;background:#f0b323;z-index:1}
.ar-hero .ar-kick{align-self:flex-start;background:#fff;color:#111;padding:5px 10px;font:700 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;transform:rotate(-1.5deg)}
.ar-hero .ar-title{font:900 clamp(30px,5vw,56px)/.98 var(--display);text-transform:uppercase;text-shadow:0 4px 0 #0005;max-width:820px;text-wrap:balance}
.ar-hero .ar-lead{max-width:620px;font-size:16px;line-height:1.4;opacity:.95}
.ar-hero .ar-go{align-self:flex-start;margin-top:6px;background:#fff;color:#111;padding:12px 22px;font:700 13px var(--mono);letter-spacing:.1em;text-transform:uppercase}
.ar-hero .ar-go::before{content:"▶";margin-right:10px;font-size:11px}
.ar-hero:hover .ar-go{background:#111;color:#fff}
.ar-tiles{list-style:none;margin:0;padding:6px;display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:16px}
.ar-tile{position:relative;display:flex;flex-direction:column;justify-content:flex-end;gap:5px;aspect-ratio:3/4;padding:14px;overflow:hidden;color:#fff;text-decoration:none;background:radial-gradient(#ffffff22 1.5px,#0000 2.1px) 0 0/14px 14px,linear-gradient(160deg,#c8102e,#8a0b20);box-shadow:0 0 0 2px #14161c,5px 5px 0 #14161c40;transition:transform .15s,box-shadow .15s}
.ar-tile.tone-1{background:radial-gradient(#ffffff22 1.5px,#0000 2.1px) 0 0/14px 14px,linear-gradient(160deg,#2f4fd0,#1a2f86)}
.ar-tile.tone-2{background:radial-gradient(#ffffff22 1.5px,#0000 2.1px) 0 0/14px 14px,linear-gradient(160deg,#0e1e46,#1f3fc0)}
.ar-tile.has-img{background:#000}
.ar-tile:hover{transform:translate(-2px,-2px);box-shadow:0 0 0 2px #14161c,8px 8px 0 #14161c55}
.ar-tile>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ar-tile::before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#000d,#0000 62%)}
.ar-tile>*{position:relative}.ar-tile>img{z-index:0}
.ar-tile .ar-kick{font:700 10px var(--mono);letter-spacing:.12em;text-transform:uppercase;opacity:.9}
.ar-tile .ar-title{font:900 21px/1 var(--display);text-transform:uppercase;text-wrap:balance}
.ar-tile .ar-lead{font-size:12.5px;line-height:1.3;opacity:.9}
@media(max-width:560px){.ar-hero{padding:20px;min-height:240px}.ar-tiles{grid-template-columns:repeat(2,1fr)}}