:root{color-scheme:light;--yellow:#fbe700;--ink:#10100d}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--yellow);color:var(--ink)}
body{font-family:Arial,Helvetica,sans-serif}
main{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:env(safe-area-inset-top) max(0px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(0px,env(safe-area-inset-left));gap:12px}
.scene{width:100%;max-width:1440px;display:flex;justify-content:center}
video{display:block;width:100%;max-height:calc(100svh - 150px - env(safe-area-inset-top) - env(safe-area-inset-bottom));object-fit:contain;aspect-ratio:1080/760;background:var(--yellow)}
.controls{display:flex;justify-content:center;align-items:center;gap:8px;flex-wrap:wrap;padding:0 12px}
button{font:12px/1.2 Arial,Helvetica,sans-serif;font-weight:600;letter-spacing:.025em;min-height:44px;padding:12px 16px;border:1px solid var(--ink);border-radius:4px;color:var(--ink);background:transparent;cursor:pointer;touch-action:manipulation}
button:hover{background:rgba(16,16,13,.07)}button:focus-visible{outline:3px solid var(--ink);outline-offset:4px}
button[aria-pressed="true"]{background:var(--ink);color:var(--yellow)}
.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}
.notice{text-align:center;font-size:14px;padding:8px 20px;max-width:540px}
[hidden]{display:none!important}
@media(max-width:480px){main{gap:20px}button{padding:12px 14px}}
@media(max-height:480px) and (orientation:landscape){main{gap:4px}video{max-height:calc(100svh - 115px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}}

.tagline{margin:0;padding:0 20px;text-align:center;font-size:clamp(13px,2.8vw,16px);line-height:1.5}
button:disabled{opacity:.5;cursor:default}