:root{color:#f4f0e9;background:#080b15;font-family:Georgia,Times New Roman,serif;font-synthesis:none;text-rendering:optimizeLegibility;--gold: #e9c88b;--rose: #c88da4;--lavender: #ada5d6;--ivory: #f4f0e9;--night: #080b15}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}#app{position:fixed;inset:0;z-index:3}body{min-width:320px;background:radial-gradient(circle at 50% 35%,rgba(70,56,94,.15),transparent 46%),linear-gradient(155deg,#101427,#080b15 55%,#050710)}button{font:inherit}#stage{position:fixed;z-index:1;inset:0;width:100%;height:100%}.code-backdrop{position:fixed;z-index:0;top:clamp(18px,4vh,46px);right:clamp(14px,4vw,62px);width:min(46vw,610px);height:min(72vh,670px);overflow:hidden;border:1px solid rgba(105,212,193,.09);border-radius:12px;background:linear-gradient(145deg,#070d1885,#080b151f);box-shadow:0 24px 90px #00000038,inset 0 0 40px #69d4c105;opacity:.66;transform:perspective(900px) rotateY(-4deg);transform-origin:right center;pointer-events:none;-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 80%,transparent 100%);mask-image:linear-gradient(to bottom,#000 0%,#000 80%,transparent 100%)}.code-window-bar{display:flex;align-items:center;gap:6px;height:32px;padding:0 12px;border-bottom:1px solid rgba(173,165,214,.08);color:#ada5d647;font:8px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase}.code-window-bar span{width:6px;height:6px;border-radius:50%;background:#ff82b8;opacity:.35}.code-window-bar span:nth-child(2){background:#f5cf5e}.code-window-bar span:nth-child(3){background:#69d4c1}.code-window-bar b{margin-left:8px;font-weight:400}.code-stream{margin:0;padding:18px 20px 44px;color:#69d4c161;font:10px/1.78 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;white-space:pre-wrap;tab-size:2;text-shadow:0 0 12px rgba(105,212,193,.1)}.code-stream:after{content:"▋";margin-left:2px;color:#f5cf5eb8;animation:code-cursor .8s steps(1) infinite}@keyframes code-cursor{50%{opacity:0}}.vignette{position:fixed;z-index:2;inset:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 38%,rgba(2,3,9,.38) 76%,rgba(1,2,7,.72));box-shadow:inset 0 0 12vw #00000073}.start-overlay{position:absolute;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:max(24px,env(safe-area-inset-top)) 24px max(24px,env(safe-area-inset-bottom));background:radial-gradient(circle at 50% 44%,#0e2b2547,#080b15e0 68%);transition:opacity .48s ease,visibility .48s}.start-overlay.is-hidden{opacity:0;visibility:hidden;pointer-events:none}.eyebrow,.scene-kicker,.final-number,.sound-note,.controls,.portrait-note{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;text-transform:uppercase;letter-spacing:.25em}.eyebrow{display:flex;align-items:center;gap:12px;margin-bottom:28px;color:#e9c88bb8;font-size:10px}.eyebrow span{width:26px;height:1px;background:currentColor;opacity:.45}.start-overlay h1{margin:0;max-width:800px;font-weight:400;font-size:clamp(38px,7vw,82px);line-height:.98;letter-spacing:-.035em;text-shadow:0 0 45px rgba(173,165,214,.12)}.start-overlay h1 em{color:var(--gold);font-weight:400}.start-overlay>p{margin:28px 0 34px;color:#f4f0e98f;font:13px/1.7 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.04em}.primary-button,.ghost-button{position:relative;border:1px solid rgba(233,200,139,.48);color:var(--ivory);background:#e9c88b0a;cursor:pointer;transition:background .35s,border-color .35s,transform .35s,box-shadow .35s}.primary-button{min-width:164px;padding:15px 24px;border-radius:100px;font:12px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.18em;text-transform:uppercase}.button-star{position:absolute;right:18px;color:var(--gold)}.primary-button:hover,.primary-button:focus-visible,.ghost-button:hover,.ghost-button:focus-visible{transform:translateY(-2px);border-color:var(--gold);background:#e9c88b1c;box-shadow:0 10px 38px #e9c88b1a,inset 0 0 20px #e9c88b0a;outline:none}.sound-note{margin-top:19px;color:#f4f0e947;font-size:8px}.jade-scene{position:relative;width:min(52vw,300px);aspect-ratio:1;margin-bottom:clamp(26px,5vh,48px);display:grid;place-items:center;animation:jade-float 4.8s ease-in-out infinite;filter:drop-shadow(0 22px 34px rgba(29,222,142,.12))}.jade-aura{position:absolute;inset:1%;border-radius:50%;background:radial-gradient(circle,rgba(82,255,186,.2),rgba(36,193,132,.055) 42%,transparent 70%);filter:blur(16px);animation:jade-pulse 3.4s ease-in-out infinite}.jade-stone{position:relative;width:68%;height:61%;overflow:hidden;border-radius:48% 42% 46% 39%/45% 51% 40% 48%;clip-path:polygon(18% 5%,67% 0,94% 23%,100% 68%,73% 96%,30% 100%,4% 73%,0 31%);background:radial-gradient(ellipse at 31% 20%,rgba(229,255,238,.8) 0 3%,transparent 19%),radial-gradient(ellipse at 70% 78%,rgba(6,84,57,.58),transparent 39%),radial-gradient(ellipse at 32% 66%,rgba(111,240,168,.46),transparent 45%),linear-gradient(142deg,#a5e6bd,#4fbd86 24%,#147151 55%,#4db47d 77%,#0a4d38);border:1px solid rgba(215,255,228,.28);box-shadow:inset 18px 14px 30px #e6ffee3b,inset -26px -22px 34px #01342494,inset 0 0 22px #81ffb533,0 0 42px #3cda9129;transform:rotate(-5deg)}.jade-stone:after{content:"";position:absolute;inset:8%;border-radius:50%;border:1px solid rgba(211,255,228,.12);box-shadow:inset 0 0 25px #e9fff11a;transform:rotate(18deg)}.jade-glint{position:absolute;width:46%;height:12%;top:12%;left:16%;border-radius:50%;background:linear-gradient(90deg,transparent,rgba(238,255,244,.72),transparent);filter:blur(5px);transform:rotate(-17deg)}.jade-vein{position:absolute;height:140%;width:8px;top:-20%;border-radius:50%;filter:blur(3px);opacity:.42}.vein-one{left:47%;background:#074f359e;transform:rotate(27deg)}.vein-two{left:65%;background:#b1ffcd6b;transform:rotate(-19deg)}.jade-crack{position:absolute;width:1px;height:58%;top:24%;left:52%;background:#daffe8c2;opacity:0;transform-origin:top}.crack-one{transform:rotate(32deg)}.crack-two{transform:rotate(-48deg)}.jade-fragments{position:absolute;inset:0;pointer-events:none}.jade-fragments i{--x: 0px;--y: 0px;--r: 0deg;--d: 0ms;position:absolute;top:50%;left:50%;width:34px;height:46px;opacity:0;clip-path:polygon(50% 0,100% 68%,40% 100%,0 38%);background:linear-gradient(145deg,#b2f1c8,#3daf78 45%,#07523a);border:1px solid rgba(220,255,232,.32);box-shadow:inset 3px 3px 7px #effff442,0 0 15px #47f2a052;transform:translate(-50%,-50%) scale(.15)}.start-overlay.is-breaking .jade-stone{animation:jade-core-break .42s cubic-bezier(.6,-.2,.8,.2) forwards}.start-overlay.is-breaking .jade-crack{animation:jade-crack .22s ease-out forwards}.start-overlay.is-breaking .jade-aura{animation:jade-flash .72s ease-out forwards}.start-overlay.is-breaking .jade-fragments i{animation:jade-fragment .92s cubic-bezier(.12,.7,.24,1) var(--d) forwards}.start-overlay.is-breaking .primary-button{opacity:0;transform:translateY(10px);pointer-events:none}@keyframes jade-float{0%,to{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-10px) rotate(1.5deg)}}@keyframes jade-pulse{0%,to{opacity:.62;transform:scale(.92)}50%{opacity:1;transform:scale(1.08)}}@keyframes jade-crack{to{opacity:.9}}@keyframes jade-core-break{0%{opacity:1;transform:rotate(-5deg) scale(1);filter:brightness(1)}45%{filter:brightness(2.4)}to{opacity:0;transform:rotate(4deg) scale(.18);filter:brightness(3)}}@keyframes jade-flash{0%{opacity:.7;transform:scale(.8)}28%{opacity:1;transform:scale(1.45)}to{opacity:0;transform:scale(2)}}@keyframes jade-fragment{0%{opacity:0;transform:translate(-50%,-50%) rotate(0) scale(.15)}12%{opacity:1}to{opacity:0;transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) rotate(var(--r)) scale(.82)}}.scene-copy{position:absolute;z-index:3;inset:auto 20px 15vh;text-align:center;pointer-events:none;opacity:0;transform:translateY(12px);transition:opacity 1.1s ease,transform 1.1s ease}.scene-copy.is-visible{opacity:1;transform:none}.scene-copy.is-intro{bottom:27vh}.scene-copy.is-intro h2{font-size:clamp(40px,7.2vw,86px);line-height:.96}.scene-copy.is-intro h2 em{color:var(--gold);font-weight:400}.scene-kicker{margin:0 0 12px;color:var(--gold);font-size:9px}.scene-copy h2{margin:0;font-size:clamp(34px,6vw,68px);font-weight:400;line-height:1;letter-spacing:-.025em;text-shadow:0 0 38px rgba(233,200,139,.18)}.scene-subtitle{margin:14px 0 0;color:#f4f0e994;font-size:15px;font-style:italic}.finale{position:absolute;z-index:4;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:20px;text-align:center;opacity:0;visibility:hidden;transform:translateY(16px);transition:opacity 1.4s ease,transform 1.4s ease,visibility 1.4s;pointer-events:none}.finale:before{content:"";position:absolute;inset:0;z-index:0;background:radial-gradient(circle at 50% 42%,rgba(8,11,21,.72) 0%,rgba(8,11,21,.5) 28%,rgba(8,11,21,.1) 60%,transparent 76%);pointer-events:none}.finale>*{position:relative;z-index:1}.finale.is-visible{opacity:1;visibility:visible;transform:none;pointer-events:auto}.final-number{margin:0 0 20px;color:var(--gold);font-size:10px}.finale h2{margin:0;font-size:clamp(42px,7.5vw,88px);font-weight:400;letter-spacing:-.04em}.finale>p:not(.final-number):not(.signature){margin:15px 0 0;color:#f4f0e9b3;font-size:clamp(18px,3vw,29px);font-style:italic;line-height:1.35}.final-rule{display:flex;align-items:center;width:min(260px,55vw);gap:10px;margin:27px 0 18px;color:var(--gold)}.final-rule:before,.final-rule:after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(233,200,139,.5))}.final-rule:after{transform:scaleX(-1)}.signature{margin:0 0 28px;color:var(--gold);font-size:15px;letter-spacing:.06em}.ghost-button{padding:11px 18px;border-radius:100px;font:10px ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase;letter-spacing:.14em}.ghost-button span{margin-left:8px;color:var(--gold)}.controls{position:absolute;z-index:8;left:max(20px,env(safe-area-inset-left));right:max(20px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));display:flex;align-items:center;gap:14px;opacity:0;visibility:hidden;transition:opacity .8s,visibility .8s;color:#f4f0e975;font-size:8px}.controls.is-visible{opacity:1;visibility:visible}.controls button{width:34px;height:34px;padding:0;border:1px solid rgba(244,240,233,.15);border-radius:50%;background:#080b1566;color:var(--gold);cursor:pointer}.sound-off,.controls.is-muted .sound-on{display:none}.controls.is-muted .sound-off{display:inline}.controls:after{content:"";flex:1}.youtube-audio-frame{position:fixed;left:-9999px;bottom:0;width:200px;height:113px;border:0;pointer-events:none}.portrait-note{position:absolute;z-index:6;left:50%;bottom:12vh;transform:translate(-50%,8px);width:min(88vw,500px);padding:11px 14px;border:1px solid rgba(233,200,139,.18);border-radius:4px;background:#080b159e;color:#f4f0e98a;text-align:center;font-size:8px;line-height:1.7;opacity:0;visibility:hidden;transition:opacity .8s,transform .8s,visibility .8s}.portrait-note.is-visible{opacity:1;visibility:visible;transform:translate(-50%)}.portrait-note code{color:var(--gold);text-transform:none;letter-spacing:0}@media(max-width:600px){.jade-scene{width:min(72vw,290px);margin-bottom:28px}.code-backdrop{top:2vh;right:-24vw;width:88vw;height:68vh;opacity:.48;transform:perspective(800px) rotateY(-7deg)}.code-stream{padding:14px 15px 36px;font-size:8px;line-height:1.72}.scene-copy{bottom:14vh}.scene-copy.is-intro{bottom:29vh}.scene-copy.is-intro h2{font-size:clamp(40px,13vw,60px)}.finale{justify-content:flex-start;padding-top:13vh}.finale h2{font-size:clamp(42px,15vw,64px)}.portrait-note{bottom:10vh}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.2s!important;animation-duration:.01ms!important}}