:root{color-scheme:dark;font-family:Tahoma,Arial,sans-serif;color:#f7f8fb;background:#080b10;font-synthesis:none}
*{box-sizing:border-box}
body{margin:0;min-width:280px;background:radial-gradient(ellipse at 50% 33%,#1b2431 0%,#0c1119 38%,#080b10 72%)}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit;cursor:pointer}
button:focus-visible,a:focus-visible{outline:3px solid #8dd8ff;outline-offset:6px}
[hidden]{display:none!important}
.screen{min-height:100svh;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:28px 20px max(28px,env(safe-area-inset-bottom));text-align:center}
.eyebrow{font-size:13px;letter-spacing:.04em;color:#bdc9d9;margin:0 0 12px;line-height:1.8}
.poster{display:block;width:min(78vw,470px);padding:0;border:0;background:none;border-radius:32px;transition:transform .18s ease;filter:drop-shadow(0 22px 32px #0007)}
.poster:hover{transform:translateY(-3px)}
.poster:active{transform:scale(.985)}
.poster img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain}
.hint{margin:8px 0 0;font-size:14px;color:#ced6e2;line-height:1.9}
.watch{padding-top:16px;padding-bottom:16px;gap:12px}
.player-wrap{width:min(100%,450px);position:relative}
video{display:block;width:100%;max-height:calc(100svh - 140px);aspect-ratio:9/16;background:#000;border-radius:18px;object-fit:contain;box-shadow:0 16px 80px #0008}
.status{min-height:1.7em;line-height:1.7;font-size:13px;color:#d6deea;margin:10px 0 0}
.player-actions{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;width:min(100%,450px)}
.text-button{min-height:44px;background:none;border:0;color:#d2dce9;font-size:13px;padding:10px 8px;text-underline-offset:5px}
.text-button:hover{text-decoration:underline}
.small-button{min-height:44px;border:1px solid #72849c;border-radius:12px;background:#263447;color:#fff;padding:10px 18px;margin:6px 0}
.direct-link{font-size:13px;color:#c4e7ff;line-height:1.8}
.end-card{width:min(100%,460px);border:1px solid #ffffff20;border-radius:30px;padding:36px 28px 22px;background:linear-gradient(145deg,#ffffff0d,#ffffff03);box-shadow:0 30px 80px #0005;backdrop-filter:blur(20px)}
h2{font-weight:600;font-size:clamp(23px,6vw,32px);line-height:1.8;margin:0;outline-offset:8px}
.outro-note{font-size:13px;color:#bcc7d7;line-height:1.9;margin:8px 0 26px}
.social-links{display:grid;gap:14px}
.social{display:flex;align-items:center;gap:16px;min-height:78px;border:1px solid #ffffff33;border-radius:19px;padding:14px 18px;color:#fff;text-decoration:none;text-align:right;background:linear-gradient(125deg,#ffffff1d,#ffffff07);transition:transform .18s ease,border-color .18s ease}
.social:hover{transform:translateY(-2px);border-color:#ffffff88}
.social span{font-size:18px;font-weight:600}
.social img{width:44px;height:44px;object-fit:contain;flex-shrink:0}
.social .arrow{margin-inline-start:auto;font-size:24px;font-weight:400;color:#bdcde0}
.telegram{box-shadow:inset 0 0 30px #239ed910}
.rubika{box-shadow:inset 0 0 30px #79b42809}
.replay{margin-top:20px;color:#bcc7d7}
.no-script{padding:20px;text-align:center;line-height:2;color:#d2dce9}
.no-script a{color:#a8ddff}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:360px){.end-card{padding:28px 20px 18px}.social{padding:12px}.poster{width:88vw}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}
