@font-face{font-family:Modu;src:url("./modu.ttf") format("truetype");font-display:swap;font-weight:700}
:root{color-scheme:dark;--bg:#151519;--ink:#f7f0e7;--muted:#beb1ac;--accent:#ebbe99;--line:#3a3436}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;min-height:100dvh;background:radial-gradient(ellipse at 80% -20%,#42332e 0,transparent 60%),var(--bg);color:var(--ink);font:1rem/1.6 system-ui,"Malgun Gothic",sans-serif}
main{width:min(980px,100% - 64px);margin:auto;padding:clamp(40px,7vw,84px) 0 42px}
header{margin-bottom:clamp(22px,4vw,36px)}
.eyebrow{font-size:.82rem;font-weight:650;letter-spacing:.14em;color:var(--accent);display:flex;align-items:center;gap:12px;margin:0 0 12px}
.eyebrow span{height:1px;width:28px;background:currentColor}
h1{font:700 clamp(2rem,5vw,3.5rem)/1.22 Modu,"Malgun Gothic",sans-serif;letter-spacing:-.035em;word-break:keep-all;margin:0}
.performers{margin:14px 0 0;color:var(--muted);font-size:clamp(.92rem,2vw,1.08rem)}
b{font-weight:400;padding:0 .15em;color:var(--accent)}
.screen{aspect-ratio:16/9;background:#171419 url("./media/cover.jpg") center/cover no-repeat;position:relative;overflow:hidden;border:1px solid var(--line);border-radius:17px;box-shadow:0 22px 56px #0007}
video{width:100%;height:100%;display:block;background:#0c0b0e}
[hidden]{display:none!important}
.overlay{position:absolute;inset:0;display:flex;flex-direction:column;gap:12px;align-items:center;justify-content:center;background:linear-gradient(#1c141921,#16111878);padding:12px;text-align:center}
button{min-height:48px;display:inline-flex;align-items:center;gap:8px;border:0;border-radius:999px;padding:.72em 1.25em;background:#f8eadc;color:#30201e;font:700 1rem system-ui,"Malgun Gothic",sans-serif;box-shadow:0 4px 24px #160f14a0;cursor:pointer}
button:hover{background:#fff8f0}
button:focus-visible,video:focus-visible{outline:3px solid #ffbd76;outline-offset:4px}
video:focus-visible{outline-offset:-4px}
button svg{width:21px;height:21px;fill:currentColor}
button:disabled{opacity:.85;cursor:progress}
.details{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:.85rem;padding:16px 0;border-bottom:1px solid var(--line)}
.error{background:#171519f5;color:#fff3e9;margin:0;padding:5px 12px;border-radius:8px;font-size:.83rem}
.sr{position:absolute;width:1px;height:1px;margin:-1px;clip-path:inset(50%);overflow:hidden}
@media(max-width:520px){main{width:calc(100% - 32px);padding-top:36px}.screen{border-radius:12px}}
