:root{--bg:#000;--fg:#fff;--pink:#ec2555;--green:#3ddc97;--blue:#4d8dff;--gray:#242424;--bubble:#1c1c1c;--card:#181818;--u:min(1vw, 1.7778vh);--font:var(--font-jost), "Jost", "Futura", system-ui, sans-serif;--side:calc(5 * var(--u));--screen-h:100vh}*{box-sizing:border-box}@supports (height:100dvh){:root{--screen-h:100dvh}}html{background:#000;place-items:center;height:100%;display:grid}body{width:calc(100 * var(--u));height:var(--screen-h);background:var(--bg);color:var(--fg);font-family:var(--font);-webkit-font-smoothing:antialiased;margin:0;position:relative;overflow:hidden}h1,h2,p,blockquote{margin:0}[hidden]{display:none!important}#dots{z-index:1;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}#collage{top:0;bottom:0;left:calc(52 * var(--u));right:calc(2 * var(--u));column-gap:calc(1.04 * var(--u));visibility:hidden;-webkit-mask-composite:source-in;grid-template-columns:repeat(3,1fr);display:grid;position:absolute;overflow:hidden;-webkit-mask:linear-gradient(90deg,#0000,#000 22%),linear-gradient(#000 70%,#0000 96%);-webkit-mask-composite:source-in,source-over;mask:linear-gradient(90deg,#0000,#000 22%) intersect,linear-gradient(#000 70%,#0000 96%)}body[data-view=idle] #collage{visibility:visible;animation:.9s steps(9,end) both px-in}#collage .track{gap:calc(1.04 * var(--u));will-change:transform;flex-direction:column;display:flex}.tile{border-radius:calc(.8 * var(--u));background:var(--card);width:100%;image-rendering:pixelated;flex:none;display:block}#collage .tile.on{filter:brightness(.55)saturate(.9)}#top{z-index:5;height:calc(7.5 * var(--u));padding:0 calc(5.6 * var(--u)) 0 var(--side);align-items:center;display:flex;position:absolute;top:0;left:0;right:0}#top:before{content:"";z-index:-1;height:calc(12 * var(--u));pointer-events:none;background:linear-gradient(#0000008c,#00000040 55%,#0000);position:absolute;top:0;left:0;right:0}#brand{height:calc(1.68 * var(--u));color:var(--fg);margin-top:calc(-.3 * var(--u));align-items:flex-end;display:flex}#brand svg{width:auto;height:100%;margin-right:calc(-.08 * var(--u))}#brand span{font-weight:500;font-size:calc(2.4 * var(--u));letter-spacing:-.01em;line-height:.72}#steps{left:calc(22.9 * var(--u));top:calc(2.9 * var(--u));width:calc(54.2 * var(--u));column-gap:calc(1.25 * var(--u));grid-template-columns:repeat(4,1fr);margin:0;padding:0;list-style:none;display:grid;position:absolute}#steps li{padding-top:calc(1 * var(--u));border-top:2px solid var(--fg);font-size:calc(1.15 * var(--u));letter-spacing:.2em;text-transform:uppercase;white-space:nowrap;font-weight:500}#steps b{font-weight:500}#steps li.now{border-top:4px solid var(--pink);padding-top:calc(1 * var(--u) - 2px)}#steps li.now span{color:var(--pink)}body[data-view=idle] #steps,body[data-view=idle] #clock{visibility:hidden}#clock{margin-left:auto;margin-right:calc(1.75 * var(--u));font-size:calc(1.77 * var(--u));color:var(--pink);font-variant-numeric:tabular-nums;font-weight:500}#lang{align-items:center;gap:calc(.6 * var(--u));display:flex}#lang button{font:500 calc(1.15 * var(--u)) / 1 var(--font);letter-spacing:.18em;color:var(--fg);border-radius:calc(.35 * var(--u));width:calc(3.45 * var(--u));height:calc(2.5 * var(--u));cursor:pointer;background:0 0;border:2px solid #0000;padding:0 0 0 .18em}#lang button.active{border-color:var(--pink)}#lang button:disabled{cursor:default}#lang button:focus-visible{outline:2px solid var(--fg);outline-offset:2px}.view{z-index:2;visibility:hidden;position:absolute;inset:0}body[data-view=idle] #v-idle,body[data-view=chat] #v-chat,body[data-view=draw] #v-draw,body[data-view=done] #v-done{visibility:visible;animation:.6s steps(6,end) both px-in}.who{font-size:calc(1 * var(--u));letter-spacing:.18em;text-transform:uppercase;color:var(--pink);align-items:center;gap:.55em;font-weight:600;display:flex}.who:before{content:"";background:currentColor;border-radius:50%;width:.5em;height:.5em}.who.plain:before{display:none}.kicker{font-size:calc(1 * var(--u));letter-spacing:.18em;text-transform:uppercase;color:var(--pink);font-weight:600}.kicker.white{color:var(--fg)}#v-idle{padding:calc(var(--screen-h) * .256) 0 0 var(--side)}#idle-kicker{margin-bottom:calc(1.5 * var(--u))}#idle-title{font-size:calc(8.6 * var(--u));text-transform:uppercase;font-weight:700;line-height:1.21}#idle-title span,#idle-title em{font-style:normal;display:block}#idle-title em{color:var(--pink)}#idle-lead{margin-top:calc(3.1 * var(--u));max-width:calc(46 * var(--u));font-size:calc(1.46 * var(--u));white-space:pre-line;line-height:1.43}body[data-state=error] #idle-lead{color:var(--fg);font-weight:500}body[data-view=chat] #v-chat{display:flex}#v-chat{left:calc(18.75 * var(--u));right:calc(18.75 * var(--u));gap:calc(2.6 * var(--u));padding:calc(6.3 * var(--u)) 0 calc(20.5 * var(--u));flex-direction:column}#chat{justify-content:flex-end;gap:calc(2.6 * var(--u));flex-direction:column;flex:1;min-height:0;display:flex;overflow:hidden;-webkit-mask:linear-gradient(#0000,#000 32%);mask:linear-gradient(#0000,#000 32%)}.msg{flex:none;animation:.45s steps(5,end) both msg-in}.msg .text{overflow-wrap:anywhere}.msg.ai .text{margin-top:calc(1.2 * var(--u));max-width:calc(48 * var(--u));font-size:calc(2.5 * var(--u));font-weight:500;line-height:1.2}.msg.you{flex-direction:column;align-items:flex-end;display:flex}.msg.you .who{color:var(--fg)}.msg.you .who:before{display:none}.msg.you .text{margin-top:calc(1.2 * var(--u));max-width:calc(40 * var(--u));padding:calc(1.05 * var(--u)) calc(1.75 * var(--u));border-radius:calc(1.3 * var(--u));background:var(--bubble);font-size:calc(1.77 * var(--u));border:2px solid #0000;line-height:1.3}.msg.you.live .who{color:var(--blue)}.msg.you.live .text{border-color:var(--blue);background:#0b1630}.msg.old{opacity:.45}.msg.ai:not(.live):not(:last-child) .text{color:#8a8a8a}.msg.ai:not(.live):not(:last-child) .who{color:color-mix(in srgb, var(--pink) 45%, #000)}#tail{gap:calc(1.4 * var(--u));flex:none;animation:.45s steps(5,end) both msg-in;display:grid}#tail .who{color:var(--green)}#tail.warn .who{color:var(--pink)}#tail.warn .typing{display:none}#chips-box{gap:calc(1.1 * var(--u));margin-bottom:calc(1.2 * var(--u));display:grid}#chips-box .who{color:var(--green)}#chips{gap:calc(.65 * var(--u));flex-wrap:wrap;display:flex}#chips span{padding:calc(.7 * var(--u)) calc(1.3 * var(--u));border:2px solid var(--green);font-size:calc(1.77 * var(--u));border-radius:999px;line-height:1.2;animation:.4s steps(4,end) both msg-in}#chips span:nth-child(2){animation-delay:.12s}#chips span:nth-child(3){animation-delay:.24s}#chips span:nth-child(4){animation-delay:.36s}#chips span:nth-child(5){animation-delay:.48s}#chips span:nth-child(6){animation-delay:.6s}.typing{gap:calc(.62 * var(--u));display:flex}.typing i{width:calc(.94 * var(--u));height:calc(.94 * var(--u));background:var(--green);border-radius:50%;animation:1.2s steps(3,end) infinite typing}.typing i:nth-child(2){animation-delay:.4s}.typing i:nth-child(3){animation-delay:.8s}#v-draw{padding-top:calc(1 * var(--u));text-align:center;flex-direction:column;justify-content:center;align-items:center;display:flex}#draw-title{margin-top:calc(1.6 * var(--u));font-size:calc(6 * var(--u));color:var(--pink);font-weight:600;line-height:1}#progress{gap:calc(.26 * var(--u));margin-top:calc(2 * var(--u));display:flex}#progress i{width:calc(.63 * var(--u));height:calc(.63 * var(--u));background:var(--gray)}#progress i.on{background:var(--pink)}#progress i.head{background:color-mix(in srgb, var(--pink) 60%, #000)}#progress i.tail{background:color-mix(in srgb, var(--pink) 30%, #000)}#v-draw .block{width:calc(39.6 * var(--u));margin-top:calc(1.4 * var(--u));padding-top:calc(1.75 * var(--u));border-top:1px solid var(--gray)}#draw-heard blockquote{margin-top:calc(1 * var(--u));font-size:calc(2.5 * var(--u));-webkit-line-clamp:4;line-clamp:4;-webkit-box-orient:vertical;font-weight:500;line-height:1.2;display:-webkit-box;overflow:hidden}#draw-prompt-text{margin:calc(1.1 * var(--u)) auto 0;max-width:calc(31 * var(--u));font-size:calc(1.55 * var(--u));-webkit-line-clamp:4;line-clamp:4;-webkit-box-orient:vertical;line-height:1.22;display:-webkit-box;overflow:hidden}#done-text{left:calc(10.4 * var(--u));top:calc(var(--screen-h) * .26);width:calc(36 * var(--u));position:absolute}#name{font-size:calc(5.6 * var(--u));color:var(--pink);overflow-wrap:anywhere;font-weight:600;line-height:1.1}#done-sub{margin-top:calc(1.8 * var(--u));max-width:calc(30 * var(--u));padding-bottom:calc(1.9 * var(--u));border-bottom:1px solid var(--gray);font-size:calc(2.5 * var(--u));font-weight:500;line-height:1.22}#download{--qr-tile:calc(7.49 * var(--u));align-items:center;gap:calc(2.14 * var(--u));margin-top:calc(3.8 * var(--u));display:flex}#qr{width:100%;height:100%}#dl-label{font-size:calc(.94 * var(--u));letter-spacing:.14em;line-height:1.2}#dl-text{margin-top:calc(.9 * var(--u));font-size:calc(1.77 * var(--u));white-space:pre-line;line-height:1.3}#reel{--w:calc(20.6 * var(--u));--h:calc(36.6 * var(--u));--gap:calc(1.3 * var(--u));--top:calc((var(--screen-h) - var(--h)) / 2);left:calc(68 * var(--u));top:var(--top);width:var(--w);height:var(--h);position:absolute}#reel .card,#reel .side{width:var(--w);height:var(--h);border-radius:calc(.8 * var(--u));background:var(--card);position:absolute;left:0;overflow:hidden}#reel .card{top:0}#develop,#shot{width:100%;height:100%;display:block;position:absolute;inset:0}#develop{image-rendering:pixelated}#shot{object-fit:cover;opacity:0}#shot.on{opacity:1}#reel .side{image-rendering:pixelated;opacity:0;transition:opacity .6s steps(6,end)}#reel .side.on{opacity:.6}#reel-prev{bottom:calc(100% + var(--gap));--edge:calc(var(--h) + var(--gap) - var(--top));-webkit-mask:linear-gradient(to bottom, transparent var(--edge), #000 100%);-webkit-mask:linear-gradient(to bottom, transparent var(--edge), #000 100%);mask:linear-gradient(to bottom, transparent var(--edge), #000 100%)}#reel-next{top:calc(100% + var(--gap));--edge:calc(var(--screen-h) - var(--top) - var(--h) - var(--gap));-webkit-mask:linear-gradient(to bottom, #000 0, transparent var(--edge));-webkit-mask:linear-gradient(to bottom, #000 0, transparent var(--edge));mask:linear-gradient(to bottom, #000 0, transparent var(--edge))}#hint{z-index:4;left:0;right:0;bottom:calc(2.3 * var(--u));align-items:center;gap:calc(2.4 * var(--u));width:fit-content;padding:calc(.55 * var(--u)) calc(1.1 * var(--u));white-space:nowrap;font-size:calc(1.36 * var(--u));background:#000000d1;border-radius:999px;margin:0 auto;animation:.4s steps(4,end) both msg-in;display:flex;position:absolute}#hint span{align-items:center;gap:calc(.6 * var(--u));display:flex}#hint kbd{font:600 calc(.82 * var(--u)) / 1 var(--font);letter-spacing:.14em;padding:calc(.42 * var(--u)) calc(.7 * var(--u)) calc(.36 * var(--u));border-radius:calc(.35 * var(--u));border:1.5px solid #ffffff8c}#hint .mic{width:calc(1.35 * var(--u));height:calc(1.35 * var(--u));color:var(--pink)}#gate{border:1px solid var(--gray);border-radius:calc(1 * var(--u));padding:calc(2.2 * var(--u)) calc(2.4 * var(--u));width:min(calc(26 * var(--u)), calc(100vw - 2rem));color:var(--fg);font-family:var(--font);background:#0b0b0b}#gate::backdrop{background:#000000bf}#gate form{gap:calc(1 * var(--u));display:grid}#gate h2{font-size:calc(1.8 * var(--u));color:var(--pink);font-weight:600}#gate input{font:inherit;font-size:calc(1.2 * var(--u));color:var(--fg);background:var(--bubble);border:2px solid var(--gray);border-radius:calc(.5 * var(--u));padding:calc(.7 * var(--u)) calc(.9 * var(--u))}#gate input:focus-visible{border-color:var(--pink);outline:none}#gate button{font:600 calc(1 * var(--u)) / 1 var(--font);letter-spacing:.18em;text-transform:uppercase;color:var(--fg);background:var(--pink);padding:calc(1 * var(--u));cursor:pointer;border:0;border-radius:999px}#gate button:focus-visible{outline:2px solid var(--fg);outline-offset:2px}#gate-err{min-height:1.3em;color:var(--pink)}#offline{z-index:6;left:50%;top:calc(8 * var(--u));padding:calc(.4 * var(--u)) calc(1 * var(--u));background:var(--pink);color:#fff;font-size:calc(1 * var(--u));letter-spacing:.14em;text-transform:uppercase;border-radius:999px;font-weight:600;position:absolute;translate:-50%}@keyframes px-in{0%{opacity:0}to{opacity:1}}@keyframes msg-in{0%{opacity:0;translate:0 calc(1 * var(--u))}to{opacity:1;translate:0}}@keyframes typing{0%{opacity:1}33%{opacity:.6}66%{opacity:.3}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.tile,#develop,#reel .side,#stage .side{object-fit:cover}
