:root{--ground:#f1f1f1;--sheet:#fff;--ink:#111;--muted:#6f6f6f;--field:#f5f5f5;--line:#e7e7e7;--ok:#1f7a4d;--err:#b42318;--sans:"Satoshi", "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif}*{box-sizing:border-box}html,body{height:100%}body{background:var(--ground);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;margin:0}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.frame{background:var(--sheet);grid-template-rows:auto auto minmax(0,1fr);grid-template-columns:minmax(0,1fr);height:calc(100dvh - 56px);margin:28px;padding:22px 12px 12px;display:grid;overflow:hidden}.top{justify-content:space-between;align-items:center;padding:10px 12px 0;display:flex}.brand{letter-spacing:-.02em;color:var(--ink);font-size:22px;font-weight:700;text-decoration:none}.hero{text-align:center;flex-direction:column;align-items:center;padding:clamp(12px,4vh,56px) 16px clamp(14px,3.2vh,40px);display:flex}h1{letter-spacing:-.045em;text-wrap:balance;margin:0;font-size:clamp(34px,min(6.2vw,8.5vh),84px);font-weight:500;line-height:1.02}.lede{max-width:34ch;color:var(--muted);text-wrap:pretty;margin:clamp(10px,2.4vh,26px) 0 0;font-size:clamp(14px,2vh,17px);line-height:1.5}.join{gap:6px;width:min(100%,420px);margin-top:clamp(12px,2.8vh,30px);display:flex}.join input{background:var(--field);min-width:0;height:48px;font:inherit;color:var(--ink);border:0;border-radius:999px;outline:none;flex:1;padding:0 20px;font-size:15px;transition:box-shadow .15s}.join input::placeholder{color:#8d8d8d}.join input:focus{box-shadow:0 0 0 2px var(--ink)}.join input[aria-invalid=true]{box-shadow:0 0 0 2px var(--err)}.join button{background:var(--ink);color:#fff;height:48px;font:inherit;cursor:pointer;white-space:nowrap;border:0;border-radius:999px;padding:0 26px;font-size:15px;font-weight:500;transition:transform .1s,background-color .15s}.join button:hover{background:#2b2b2b}.join button:active{transform:scale(.97)}.join button:disabled{opacity:.6;cursor:default}.join button:focus-visible{outline:2px solid var(--ink);outline-offset:3px}.tease{color:var(--muted);flex-wrap:wrap;justify-content:center;gap:8px 22px;margin:clamp(10px,2.2vh,22px) 0 0;padding:0;font-size:clamp(13px,1.8vh,15px);list-style:none;display:flex}.tease li{align-items:baseline;gap:7px;display:flex}.tease b{color:var(--ink);font-weight:700}.tease s{color:#9a9a9a;text-decoration-thickness:1.5px}.tease span{color:var(--ink);font-weight:500}.note{color:var(--muted);margin:clamp(6px,1.3vh,14px) 0 0;font-size:13px}.note.ok{color:var(--ok)}.note.err{color:var(--err)}.stage{min-width:0;min-height:0;display:flex}.film{width:100%;height:100%;box-shadow:0 0 0 1px var(--line), 0 24px 60px -30px #00000040;background:#0b0b0c;border-radius:16px;position:relative;overflow:hidden}.film video{object-fit:cover;width:100%;height:100%;display:block;position:absolute;inset:0}.sound{z-index:2;color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(6px);background:#00000047;border:0;border-radius:999px;place-items:center;width:32px;height:32px;transition:transform .1s,background-color .15s;display:grid;position:absolute;bottom:14px;right:14px}.sound svg{width:15px;height:15px}.sound [hidden]{display:none}.sound:hover{background:#00000073}.sound:active{transform:scale(.95)}.sound:focus-visible{outline-offset:3px;outline:2px solid #fff}.foot{justify-content:center;padding:clamp(8px,1.6vh,18px) 0 2px;display:flex}.social{z-index:2;background:#fff;border-radius:10px;gap:4px;padding:6px 8px;display:flex;position:absolute;bottom:16px;left:50%;transform:translate(-50%);box-shadow:0 4px 18px #1e1e501f}.social a{width:32px;height:32px;color:var(--ink);border-radius:7px;place-items:center;transition:background-color .15s;display:grid}.social a:hover{background:#f1f1f1}.social a:focus-visible{outline:2px solid var(--ink);outline-offset:1px}@media (width<=520px){.frame{height:calc(100dvh - 20px);margin:10px;padding:14px 8px 8px}.hero{padding:clamp(10px,3vh,40px) 8px clamp(10px,2.4vh,28px)}.join{flex-direction:column;gap:8px}.join input,.join button{height:44px}.join input{flex:none}.join button{width:100%}}@media (prefers-reduced-motion:reduce){*{transition:none!important}}
