:root{--ink:#0a0806;--ink2:#15110b;--paper:#f4efe5;--cream:#faf8f4;--mute:#8a7f6f;--rule:#3a2f24;--amber:#c8780a;--amber-glow:#e89934;--key-face:#1c1612;--key-face-2:#251d16;--key-rim:#3a2e22;--key-base:#0e0a07;--key-letter:#f0e8d7;--key-letter-dim:#5a4d3d}.cn-player-mode .stage,.cn-player-mode .stage *{box-sizing:border-box}.cn-player-mode body{color:var(--paper);justify-content:center;align-items:center;margin:0;padding:0;font-family:DM Mono,monospace;display:flex}.cn-player-mode{background:#000}.stage{background:radial-gradient(#14100b 0%,#050402 70%);justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:relative;overflow:hidden}.grain{pointer-events:none;opacity:.18;mix-blend-mode:overlay;z-index:8;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='1.2' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 1 0'/></filter><rect width='240' height='240' filter='url(%23n)' opacity='.6'/></svg>");animation:1.2s steps(6,end) infinite grain;position:absolute;inset:-50%}@keyframes grain{0%{transform:translate(0)}16%{transform:translate(-2%,1%)}33%{transform:translate(1%,-2%)}50%{transform:translate(-1%,1%)}66%{transform:translate(2%,2%)}83%{transform:translate(-2%,-1%)}to{transform:translate(0)}}.vignette{pointer-events:none;z-index:6;background:radial-gradient(#0000 40%,#0000008c 100%);position:absolute;inset:0}.scan{pointer-events:none;z-index:7;opacity:.35;background:repeating-linear-gradient(0deg,#0000 0 3px,#0000002e 3px 4px);position:absolute;inset:0}.eyebrow{letter-spacing:.4em;color:var(--mute);text-transform:uppercase;z-index:5;opacity:0;align-items:center;gap:18px;font-size:11px;animation:.6s .15s forwards fadeIn;display:flex;position:absolute;top:48px;left:50%;transform:translate(-50%)}.eyebrow:before,.eyebrow:after{content:"";background:var(--rule);width:36px;height:1px;display:block}.bug{color:var(--mute);z-index:5;opacity:0;font-family:Cormorant Garamond,serif;font-size:18px;font-style:italic;animation:.8s 3.6s forwards fadeIn;position:absolute;bottom:42px;left:50%;transform:translate(-50%)}.bug:before{content:"— ";color:var(--amber);font-style:normal}.framenum{letter-spacing:.32em;color:var(--mute);text-transform:uppercase;z-index:5;opacity:0;font-size:9px;animation:.4s .2s forwards fadeIn;position:absolute;bottom:42px;left:42px}.framenum b{color:var(--paper);font-weight:400}.regmark{letter-spacing:.32em;color:var(--mute);text-transform:uppercase;z-index:5;opacity:0;font-size:9px;animation:.4s .2s forwards fadeIn;position:absolute;top:48px;right:42px}@keyframes fadeIn{to{opacity:1}}@media (max-width:760px){.eyebrow,.regmark,.framenum{display:none}.keyboard{transform-origin:50%;gap:6px;transform:rotateX(8deg)scale(.36)}.finale .word{letter-spacing:.12em!important;font-size:54px!important}.finale .top-mark{letter-spacing:.4em;margin-bottom:10px;font-size:9px}.finale .tag{margin-top:10px;font-size:12px}@keyframes ruleGrow{to{width:200px}}.bug{text-align:center;padding:0 24px;font-size:11px;line-height:1.4;bottom:24px}.replay{bottom:18px;right:18px}.replay button{padding:7px 10px;font-size:9px}}.keyboard{z-index:3;perspective:900px;transform-style:preserve-3d;filter:drop-shadow(0 24px 30px #0009);gap:18px;display:flex;position:relative;transform:rotateX(8deg)}.key{width:128px;height:128px;transform-style:preserve-3d;transition:none;animation-fill-mode:forwards;position:relative;transform:translateY(-6px)}.cap{background:linear-gradient(160deg, var(--key-face-2) 0%, var(--key-face) 60%, #0d0907 100%);border:1px solid var(--key-rim);box-shadow:inset 0 1px 0 #dcb47814, inset 0 -3px 0 #000000b3, 0 8px 0 var(--key-base), 0 9px 0 #000, 0 14px 26px #000000b3;border-top-color:#4a3a2a;border-bottom-color:#000;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.cap span{letter-spacing:.04em;color:var(--key-letter-dim);text-shadow:0 1px 0 #000, inset 0 1px 0 #ffffff0d;font-family:Fjalla One,sans-serif;font-size:62px;transition:color .12s,text-shadow .12s}.cap:before,.cap:after{content:"";border:1px solid var(--key-rim);width:8px;height:8px;position:absolute}.cap:before{border-bottom:none;border-right:none;top:8px;left:8px}.cap:after{border-top:none;border-left:none;bottom:8px;right:8px}@keyframes keyStrike{0%{transform:translateY(-6px)}35%{transform:translateY(10px)}60%{transform:translateY(8px)}to{transform:translateY(2px)}}@keyframes capDepress{0%{box-shadow:inset 0 1px 0 #dcb47814, inset 0 -3px 0 #000000b3, 0 8px 0 var(--key-base), 0 9px 0 #000, 0 14px 26px #000000b3}35%{box-shadow:inset 0 1px 0 #dcb4780a, inset 0 -1px 0 #00000080, 0 0 0 var(--key-base), 0 1px 0 #000, 0 4px 14px #000c}to{box-shadow:inset 0 1px 0 #dcb4780f, inset 0 -2px 0 #0009, 0 4px 0 var(--key-base), 0 5px 0 #000, 0 8px 18px #000000b3}}@keyframes letterIgnite{0%{color:var(--key-letter-dim);text-shadow:0 1px #000}40%{color:#ffd998;text-shadow:0 0 22px #e89934f2,0 0 6px #fff,0 1px #000}to{color:var(--key-letter);text-shadow:0 0 14px #e899348c,0 0 3px #e8993466,0 1px #000}}.spark{background:radial-gradient(circle, #fff 0%, var(--amber-glow) 30%, transparent 70%);pointer-events:none;border-radius:50%;width:4px;height:4px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(0)}@keyframes sparkBurst{0%{opacity:0;transform:translate(-50%,-50%)scale(0)}10%{opacity:.95;transform:translate(-50%,-50%)scale(8)}35%{opacity:.4;transform:translate(-50%,-50%)scale(14)}to{opacity:0;transform:translate(-50%,-50%)scale(20)}}.dust{pointer-events:none;opacity:0;filter:blur(3px);background:radial-gradient(#dcc8aa40 0%,#0000 70%);width:80%;height:10px;position:absolute;bottom:6px;left:50%;transform:translate(-50%)}@keyframes dustKick{0%{opacity:0;transform:translate(-50%)}30%{opacity:.7;transform:translate(-50%,-14px)}to{opacity:0;transform:translate(-50%,-28px)}}.key.k1{animation:.55s .5s both keyStrike}.key.k2{animation:.55s .78s both keyStrike}.key.k3{animation:.55s 1.06s both keyStrike}.key.k4{animation:.55s 1.34s both keyStrike}.key.k5{animation:.55s 1.62s both keyStrike}.key.k6{animation:.55s 1.9s both keyStrike}.key.k1 .cap{animation:.55s .5s both capDepress}.key.k2 .cap{animation:.55s .78s both capDepress}.key.k3 .cap{animation:.55s 1.06s both capDepress}.key.k4 .cap{animation:.55s 1.34s both capDepress}.key.k5 .cap{animation:.55s 1.62s both capDepress}.key.k6 .cap{animation:.55s 1.9s both capDepress}.key.k1 .cap span{animation:.55s .55s both letterIgnite}.key.k2 .cap span{animation:.55s .83s both letterIgnite}.key.k3 .cap span{animation:.55s 1.11s both letterIgnite}.key.k4 .cap span{animation:.55s 1.39s both letterIgnite}.key.k5 .cap span{animation:.55s 1.67s both letterIgnite}.key.k6 .cap span{animation:.55s 1.95s both letterIgnite}.key.k1 .spark{animation:.45s .55s both sparkBurst}.key.k2 .spark{animation:.45s .83s both sparkBurst}.key.k3 .spark{animation:.45s 1.11s both sparkBurst}.key.k4 .spark{animation:.45s 1.39s both sparkBurst}.key.k5 .spark{animation:.45s 1.67s both sparkBurst}.key.k6 .spark{animation:.45s 1.95s both sparkBurst}.key.k1 .dust{animation:.8s .58s both dustKick}.key.k2 .dust{animation:.8s .86s both dustKick}.key.k3 .dust{animation:.8s 1.14s both dustKick}.key.k4 .dust{animation:.8s 1.42s both dustKick}.key.k5 .dust{animation:.8s 1.7s both dustKick}.key.k6 .dust{animation:.8s 1.98s both dustKick}.base{border:1px solid var(--rule);z-index:-1;background:linear-gradient(#1a130c 0%,#0a0805 100%);border-top-color:#3a2c1e;position:absolute;inset:30px -30px -20px;box-shadow:0 30px 40px #000000b3}.base:before{content:"";background:#dcb4780f;height:1px;position:absolute;top:8px;left:8px;right:8px}.finale{text-align:center;z-index:4;opacity:0;animation:.8s 2.55s forwards finaleIn;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}@keyframes finaleIn{0%{opacity:0;letter-spacing:.6em;filter:blur(8px);transform:translate(-50%,-50%)scale(.96)}60%{opacity:1;letter-spacing:.18em;filter:blur();transform:translate(-50%,-50%)scale(1)}to{opacity:1;letter-spacing:.18em;filter:blur();transform:translate(-50%,-50%)scale(1)}}.finale .top-rule,.finale .bot-rule{background:var(--amber);width:0;height:1px;margin:0 auto;animation:1.1s 2.7s forwards ruleGrow}@keyframes ruleGrow{to{width:520px}}.finale .top-mark{letter-spacing:.5em;color:var(--amber);text-transform:uppercase;opacity:0;margin-bottom:18px;font-size:10px;animation:.6s 2.85s forwards fadeIn}.finale .word{letter-spacing:.18em;color:var(--paper);text-shadow:0 0 60px #e899342e,0 1px #000;margin:14px 0 18px;font-family:Fjalla One,sans-serif;font-size:188px;line-height:.95}.finale .word b{color:var(--amber);font-weight:400}.finale .tag{color:var(--mute);opacity:0;margin-top:16px;font-family:Cormorant Garamond,serif;font-size:22px;font-style:italic;animation:.6s 3.15s forwards fadeIn}.finale .tag:before{content:"— ";color:var(--amber);font-style:normal}.keyboard{animation:.9s 2.5s forwards kbFade}@keyframes kbFade{0%{opacity:1;filter:blur();transform:rotateX(8deg)translateY(0)scale(1)}to{opacity:0;filter:blur(6px);transform:rotateX(8deg)translateY(40px)scale(.92)}}.replay{z-index:9;letter-spacing:.28em;text-transform:uppercase;opacity:0;align-items:center;gap:10px;font-family:DM Mono,monospace;font-size:10px;animation:.5s 4s forwards fadeIn;display:flex;position:absolute;bottom:42px;right:42px}.replay button{border:1px solid var(--rule);color:var(--paper);cursor:pointer;letter-spacing:.28em;text-transform:uppercase;background:0 0;padding:9px 14px;font-family:inherit;font-size:10px;transition:background .15s,border-color .15s}.replay button:hover{background:var(--ink2);border-color:var(--amber);color:var(--amber)}#tweaks-root{z-index:50;position:fixed}@media (max-width:900px){.key{width:78px;height:78px}.cap span{font-size:36px}.keyboard{gap:10px}.finale .word{letter-spacing:.16em;font-size:84px}.finale .tag{font-size:14px}@keyframes ruleGrow{to{width:280px}}}