:root{--paper:#f6efe4;--ink:#3b2f3a;--dim:#7a6c78;--a:#ffc34d;--b:#ff7a59;--c:#8b7cff;--beat:.6s}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{background:var(--paper);color:var(--ink);background-image:radial-gradient(circle at 20% 15%,#ffc34d38,#0000 38%),radial-gradient(circle at 85% 80%,#8b7cff2e,#0000 42%);flex-direction:column;min-height:100vh;font-family:Inter,system-ui,sans-serif;display:flex}#root{display:contents}.stage{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:26px;padding:36px 20px 12px;display:flex;position:relative;overflow:hidden}.hero{text-align:center;z-index:1;position:relative}.wordmark{letter-spacing:-1px;background:linear-gradient(100deg, var(--a), var(--b) 55%, var(--c));color:#0000;filter:drop-shadow(3px 4px #3b2f3ae6);animation:pop var(--beat) ease-in-out infinite;transform-origin:50% 80%;-webkit-background-clip:text;background-clip:text;margin:0;font:800 clamp(56px,11vw,120px)/1 "Baloo 2",Fredoka,sans-serif}.squiggle{width:min(320px,70vw);height:22px;margin-top:-6px}.squiggle path{fill:none;stroke:var(--ink);stroke-width:4px;stroke-linecap:round}.tag{margin:12px 0 2px;font:600 clamp(18px,3vw,26px) Fredoka,sans-serif}.tag-hi{color:var(--dim);margin:0 0 22px;font:600 clamp(16px,2.4vw,21px) "Baloo 2",sans-serif}.gate{justify-items:center;gap:12px;min-height:90px;display:grid}.open{color:#1a1030;border:3px solid var(--ink);background:linear-gradient(100deg, var(--a), var(--b));box-shadow:4px 5px 0 var(--ink);border-radius:999px;padding:14px 30px;font:700 18px Fredoka,sans-serif;text-decoration:none;transition:transform .12s,box-shadow .12s}.open:hover{box-shadow:6px 7px 0 var(--ink);transform:translate(-1px,-1px)}.open:active{box-shadow:1px 1px 0 var(--ink);transform:translate(3px,4px)}.note{color:var(--dim);max-width:40ch;margin:0;font-size:14px}.note.deny{color:#b3402a;font-weight:600}.screen{z-index:1;border:4px solid var(--ink);width:min(720px,92vw);box-shadow:7px 8px 0 var(--ink);background:#222;border-radius:18px;margin:0;position:relative;overflow:hidden;transform:rotate(-.6deg)}.screen canvas{width:100%;height:auto;display:block}.bubbles i{color:var(--ink);border:3px solid var(--ink);opacity:0;background:#fff;border-radius:16px;padding:2px 12px;font:700 20px "Baloo 2",sans-serif;animation:7s linear infinite float;position:absolute}.bubbles i:first-child{animation-delay:0s;left:6%}.bubbles i:nth-child(2){background:#ffe7b0;animation-delay:2.2s;left:18%}.bubbles i:nth-child(3){animation-delay:1.1s;left:82%}.bubbles i:nth-child(4){background:#e6dcff;animation-delay:3.4s;left:90%}.bubbles i:nth-child(5){background:#ffd6c8;animation-delay:4.6s;left:10%}.bubbles i:nth-child(6){animation-delay:5.5s;left:76%}.bubbles i:nth-child(7){background:#e6dcff;animation-delay:6.3s;left:26%}.bubbles i:nth-child(8){background:#ffe7b0;animation-delay:2.8s;left:70%}.foot{text-align:center;color:var(--dim);padding:14px;font-size:13px}@keyframes pop{0%,to{transform:scale(1)}50%{transform:scale(1.025)rotate(-.6deg)}}@keyframes float{0%{opacity:0;bottom:-40px}15%{opacity:.85}to{opacity:0;bottom:105%;transform:translate(22px)rotate(8deg)}}@media (prefers-reduced-motion:reduce){.wordmark,.bubbles i{animation:none}.bubbles{display:none}}
