*,:before,:after{box-sizing:border-box}:not(dialog){margin:0}@media (prefers-reduced-motion:no-preference){html{interpolate-size:allow-keywords}}body{-webkit-font-smoothing:antialiased;line-height:1.5}img,picture,video,canvas,svg{max-width:100%;display:block}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}p{text-wrap:pretty}h1,h2,h3,h4,h5,h6{text-wrap:balance}#root,#__next{isolation:isolate}body{background-color:#f8fcff;place-items:start center;min-height:100svh;padding:2rem;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;display:grid}main{justify-items:center;gap:1.5rem;width:500px;max-width:100%;display:grid}.overlap-toggle{align-items:center;gap:.5rem;display:flex;position:absolute;top:1rem;right:1rem}.stage{justify-items:center;gap:2rem;display:grid}.target,.contestant{width:500px;max-width:100%;height:300px}.target{border-radius:12px;overflow:clip}.target video{object-fit:cover;object-position:center;justify-self:center;width:175%;max-width:none;height:100%}.contestant{border-radius:12px;place-items:center;display:grid}main:has(#overlap:checked) .stage{gap:0}:is(main:has(#overlap:checked) .target,main:has(#overlap:checked) .contestant){grid-area:1/1}.credit{color:#94a3b8;font-size:11px;line-height:1;text-decoration:none;position:absolute;bottom:.5rem;right:.75rem}.credit:hover{text-decoration:underline}@property --hover{syntax:"<number>";inherits:true;initial-value:0}@property --nx{syntax:"<number>";inherits:false;initial-value:0}@property --ny{syntax:"<number>";inherits:false;initial-value:0}@property --wave{syntax:"<number>";inherits:true;initial-value:0}@property --wave-a{syntax:"<number>";inherits:true;initial-value:0}.contestant{perspective:800px;position:relative}.mosaic-btn{--cols:40;--rows:13;--tile:9px;--gap:1px;--radius:48px;--spot-r:8.5;--tilt-x:7deg;--tilt-y:9deg;--mx:-100;--my:-100;--cx:-100;--cy:-100;width:calc(var(--cols) * var(--tile) + (var(--cols) - 1) * var(--gap));height:calc(var(--rows) * var(--tile) + (var(--rows) - 1) * var(--gap));border-radius:var(--radius);corner-shape:squircle;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transform:rotateX(calc(var(--ny) * -1 * var(--tilt-x))) rotateY(calc(var(--nx) * var(--tilt-y))) scale(var(--press,1));box-shadow:calc(var(--nx) * -6px) calc(10px + var(--ny) * -6px) 24px -8px oklch(45% .2 266/.55), 0 4px 10px -2px oklch(40% .2 266/.35), 0 0 70px 10px oklch(65% .17 262/.18);background:oklch(47% .18 266);border:0;padding:0;transition:--nx .6s cubic-bezier(.2,.8,.3,1),--ny .6s cubic-bezier(.2,.8,.3,1),--hover .7s,transform .15s;display:grid;position:relative;overflow:clip}@supports not (corner-shape:squircle){.mosaic-btn{--radius:34px}}.mosaic-btn:hover{--hover:1;transition:--nx .35s cubic-bezier(.2,.8,.3,1),--ny .35s cubic-bezier(.2,.8,.3,1),--hover .4s,transform .15s}.mosaic-btn:active{--press:.98}.mosaic-btn:focus-visible{outline-offset:4px;outline:2px solid oklch(60% .2 266)}.mosaic-btn>*,.mosaic-btn:after{grid-area:1/1}.tiles{grid-template-columns:repeat(var(--cols), 1fr);grid-template-rows:repeat(var(--rows), 1fr);gap:var(--gap);display:grid}.tiles i{--L:calc(.51 + var(--seed) * .08);--d:hypot(calc(var(--c) - var(--mx)), calc(var(--r) - var(--my)));--spot:exp(calc(-1 * pow(var(--d) / var(--spot-r), 2)));--reflect:calc(.5 + var(--seed2) * .5);--dc:hypot(calc(var(--c) - var(--cx)), calc(var(--r) - var(--cy)));--w:calc(2 + var(--wave) * .15);--ring:calc(exp(calc(-1 * pow((var(--dc) - var(--wave)) / var(--w), 2))) * var(--wave-a));--boost:calc(var(--spot) * var(--hover) * var(--reflect) * .2 + var(--ring) * .2);background-color:oklch(calc(var(--L) + var(--boost)) calc(.19 - var(--boost) * .25) 265);display:block}.mosaic-btn:after{content:"";border-radius:inherit;corner-shape:inherit;pointer-events:none;background:radial-gradient(80% 95% at 50% 0,oklch(100% 0 0/.3),#0000 70%),linear-gradient(#0000 60%,oklch(25% .12 266/.22));box-shadow:inset 0 1.5px oklch(100% 0 0/.45),inset 0 -3px 4px oklch(22% .12 266/.45),inset 2px 0 3px oklch(100% 0 0/.08),inset -2px 0 3px oklch(100% 0 0/.08)}.mosaic-btn.waving{animation:1.4s cubic-bezier(.15,.6,.35,1) forwards shockwave}@keyframes shockwave{0%{--wave:0;--wave-a:1}to{--wave:45;--wave-a:0}}.label{z-index:1;pointer-events:none;letter-spacing:-.01em;color:#fff;text-shadow:0 0 1px oklch(25% .12 266/.85),0 1px 2px oklch(20% .1 266/.5);place-self:center;font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-size:1.8rem;font-weight:600;position:relative}@media (prefers-reduced-motion:reduce){.mosaic-btn{transition:--hover .2s;transform:none}.mosaic-btn.waving{animation:none}}.prompt-log{color:oklch(30% .03 265);width:100%;margin-top:1rem;padding-bottom:3rem;font-family:Inter,ui-sans-serif,system-ui,sans-serif}.prompt-log h2{color:oklch(25% .05 265);font-size:1.1rem;font-weight:600}.prompt-log__meta{color:oklch(55% .03 265);margin-top:.15rem;font-size:.8rem}.prompt-log ol{gap:.5rem;margin-top:1rem;padding:0;list-style:none;display:grid}.prompt-log li{background:oklch(99% .005 265);border:1px solid oklch(92% .02 265);border-radius:10px;grid-template-columns:6.5rem 1fr;align-items:baseline;gap:.25rem .75rem;padding:.6rem .8rem;font-size:.875rem;line-height:1.5;display:grid}.prompt-log time{font-variant-numeric:tabular-nums;color:oklch(50% .12 266);white-space:nowrap;font-size:.8rem}.prompt-log li p{grid-column:2}.prompt-log__initial{background:oklch(97% .02 266);border-color:oklch(80% .08 266)}.prompt-log__tag{color:#fff;letter-spacing:.02em;text-transform:uppercase;background:oklch(55% .19 266);border-radius:999px;grid-area:1/2;justify-self:start;padding:.05rem .5rem;font-size:.7rem;font-weight:600}.prompt-log .prompt-log__initial p{grid-column:1/-1}@media (width<=480px){.prompt-log li{grid-template-columns:1fr}.prompt-log li p,.prompt-log__tag{grid-area:auto/1}}