:root{--gold: #ffcf3f;--gold-dark: #c98a00;--ink: #142247;--sky-top: #3a8bff;--sky-bottom: #bfe6ff;--gem: #2fe08a;--text: #ffffff}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#3a8bff;color:var(--text);font-family:Nunito,system-ui,sans-serif}#scene{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}.top{position:fixed;top:0;left:0;right:0;padding:20px 28px;pointer-events:none}.brand{display:inline-flex;align-items:center;gap:10px;font-family:Lilita One,sans-serif;font-size:30px;letter-spacing:.5px;text-shadow:0 3px 0 var(--ink),0 0 2px var(--ink);-webkit-text-stroke:1.5px var(--ink)}.brand .name span{color:var(--gold)}.brand .crown svg{width:38px;height:26px;fill:var(--gold);stroke:var(--ink);stroke-width:3;stroke-linejoin:round}.hero{position:fixed;left:clamp(20px,5vw,72px);top:50%;transform:translateY(-50%);max-width:440px;pointer-events:none}.kicker{margin:0 0 6px;font-weight:800;text-transform:uppercase;letter-spacing:3px;font-size:14px;color:#fff6c9;text-shadow:0 2px 0 var(--ink),1.5px 0 0 var(--ink),-1.5px 0 0 var(--ink),0 -1.5px 0 var(--ink),0 3px 8px rgba(20,34,71,.4)}h1{margin:0;font-family:Lilita One,sans-serif;font-weight:400;font-size:clamp(42px,6vw,76px);line-height:.98;-webkit-text-stroke:2px var(--ink);text-shadow:0 5px 0 var(--ink)}h1 span{color:var(--gold)}.lead{margin:16px 0 26px;font-size:18px;font-weight:600;line-height:1.45;color:#fff;text-shadow:0 2px 0 var(--ink),1.5px 0 0 var(--ink),-1.5px 0 0 var(--ink),0 -1.5px 0 var(--ink),0 3px 8px rgba(20,34,71,.4)}.cta{pointer-events:auto;display:inline-flex;align-items:center;gap:12px;padding:16px 26px 18px;border-radius:14px;font-family:Lilita One,sans-serif;font-size:24px;letter-spacing:.4px;color:#fff;text-decoration:none;-webkit-text-stroke:1px var(--ink);text-shadow:0 2px 0 var(--ink);background:linear-gradient(180deg,#ffe066,#ffbf1a 55%,#f0a000);border:3px solid var(--ink);box-shadow:inset 0 -6px 0 var(--gold-dark),inset 0 3px #ffffff8c,0 6px 0 var(--ink),0 12px 24px #0a1e4659;transition:transform .15s ease,box-shadow .15s ease,filter .15s ease}.cta:hover{transform:translateY(-2px);filter:brightness(1.06)}.cta:active{transform:translateY(4px);box-shadow:inset 0 -3px 0 var(--gold-dark),0 2px 0 var(--ink)}.cta .gem{width:22px;height:26px;background:linear-gradient(160deg,#a6ffd2,var(--gem) 55%,#109a58);clip-path:polygon(50% 0,100% 30%,82% 100%,18% 100%,0 30%);filter:drop-shadow(0 2px 0 var(--ink))}.tip{position:fixed;z-index:5;padding:8px 14px 9px;border-radius:10px;font-family:Lilita One,sans-serif;font-size:18px;background:var(--ink);border:2px solid var(--gold);color:#fff;pointer-events:none;transform:translate(16px,16px);white-space:nowrap}.tip b{color:var(--gold);font-weight:400}.hint{position:fixed;left:50%;bottom:54px;transform:translate(-50%);padding:6px 14px;border-radius:999px;font-weight:800;font-size:14px;background:#1422478c;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);pointer-events:none;transition:opacity .6s ease}.foot{position:fixed;left:0;right:0;bottom:14px;text-align:center;font-size:12px;font-weight:600;color:#ffffffd9;text-shadow:0 1px 2px rgba(20,34,71,.8);pointer-events:none}@media (max-width: 760px){.hero{top:auto;bottom:92px;left:16px;right:16px;transform:none;max-width:none;text-align:center}.lead{font-size:15px;margin:10px 0 18px}.hint{display:none}.brand{font-size:24px}}.loader{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;display:grid;place-items:center;background:radial-gradient(circle at 50% 40%,#4a9bff,#1f5fd6 70%,#153f9a);transition:opacity .7s ease,visibility .7s}.loader.done{opacity:0;visibility:hidden}.loader-box{width:min(420px,82vw);text-align:center}.loader-title{font-family:Lilita One,sans-serif;font-size:48px;color:#fff;-webkit-text-stroke:2px var(--ink);text-shadow:0 5px 0 var(--ink);margin-bottom:22px}.loader-title span{color:var(--gold)}.loader-track{height:26px;border:3px solid var(--ink);border-radius:14px;background:#0d1a3a;overflow:hidden;box-shadow:0 5px 0 var(--ink)}.loader-bar{height:100%;width:0;border-radius:10px;background:linear-gradient(180deg,#8dff9d,#2fd35b 55%,#1a9c3e);box-shadow:inset 0 3px #ffffff80;transition:width .2s ease}.loader-text{margin-top:12px;font-weight:800;color:#dcecff}.hero>*,.top,.cta{opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,1.4,.4,1)}body.ready .top{opacity:1;transform:none;transition-delay:2.4s}body.ready .hero>*{opacity:1;transform:none}body.ready .hero>:nth-child(1){transition-delay:2.6s}body.ready .hero>:nth-child(2){transition-delay:2.75s}body.ready .hero>:nth-child(3){transition-delay:2.9s}body.ready .hero>:nth-child(4){transition-delay:3.1s}.cta{position:relative;overflow:hidden}.cta:after{content:"";position:absolute;top:-40%;left:-60%;width:40%;height:180%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.65),transparent);transform:skew(-20deg);animation:shine 3.2s ease-in-out infinite 4s}@keyframes shine{0%{left:-60%}35%,to{left:130%}}.hint{opacity:0;transition:opacity .6s ease}body.ready .hint{opacity:1;transition-delay:3.6s}body.ready .hint.gone{opacity:0;transition-delay:0s}.hint:before{content:"👆 "}@media (prefers-reduced-motion: reduce){.cta:after{animation:none}.hero>*,.top,.cta{transition:none}}
