:root{--bg:#FBF7FC;--fg:#221330;--muted:#6A5B78;--line:#E9DFF0;--plum:#6A2C8C;--night:#1E0B2B;--night2:#2F1442;--on:#FFF4E6;--onm:#CDB8DA;--gold:#FFB627;--coral:#FF6B57;--lilac:#C9A2F0;--mint:#5FCFA5;--lilacs:#F1E5FC}
*{box-sizing:border-box}html,body{margin:0}body{background:var(--bg);color:var(--fg);font:17px/1.55 Figtree,system-ui,sans-serif;min-height:100vh}
a{color:var(--plum)}h1,h2,.serif{font-family:"Young Serif",Georgia,serif;font-weight:400;margin:0}
.top{display:flex;justify-content:space-between;align-items:center;max-width:720px;margin:0 auto;padding:18px 16px}
.logo{font-family:"Young Serif",Georgia,serif;font-size:24px;color:var(--plum);text-decoration:none}
main{max-width:720px;margin:0 auto;padding:8px 16px 60px;display:grid;gap:18px}
.hero{position:relative;overflow:hidden;border-radius:32px;padding:30px 24px;color:var(--on);background:linear-gradient(135deg,var(--night),var(--night2) 55%,#4A1F5E)}
.hero h1{font-size:clamp(30px,7vw,44px);line-height:1.12}.hero p{color:var(--onm)}
.orb{position:absolute;border-radius:50%;opacity:.22;filter:blur(2px);animation:float 9s ease-in-out infinite alternate}
@keyframes float{to{transform:translate(40px,-30px) scale(1.15)}}
@media (prefers-reduced-motion:reduce){.orb{animation:none}}
.hero>*:not(.orb){position:relative}
.card{background:#fff;border:1px solid var(--line);border-radius:24px;padding:22px;display:grid;gap:12px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 22px;border-radius:999px;border:0;background:var(--gold);color:var(--fg);font:700 16px Figtree,sans-serif;text-decoration:none;cursor:pointer;transition:transform .15s}
.btn:active{transform:scale(.97)}.btn.dark{background:var(--plum);color:#fff}.btn.line{background:transparent;border:1.5px solid var(--line)}
input{font:16px Figtree,sans-serif;padding:14px 16px;border:2px solid var(--line);border-radius:18px;width:100%;color:var(--fg);background:#fff}
input:focus{outline:none;border-color:var(--plum)}
.muted{color:var(--muted)}.small{font-size:14px}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:10px}.stat{background:rgba(255,255,255,.09);border-radius:18px;padding:14px;text-align:center}
.stat b{display:block;font-family:"Young Serif",Georgia,serif;font-weight:400;font-size:30px;color:var(--gold)}
.feat{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--line)}
.feat:first-child{border-top:0}.ico{flex:0 0 38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--lilacs);font-size:18px}
.locked .ico{background:var(--night);filter:grayscale(1)}.locked b{color:var(--muted)}
.gold{background:linear-gradient(135deg,var(--gold),var(--coral));color:var(--fg)}.gold p{color:var(--fg)}
.badge{display:inline-flex;gap:6px;align-items:center;padding:6px 12px;border-radius:999px;font:800 12px Figtree,sans-serif;letter-spacing:.4px}
.fade{animation:up .6s cubic-bezier(.2,.7,.2,1) both}@keyframes up{from{opacity:0;transform:translateY(16px)}}
[hidden]{display:none!important}
.confetti{position:fixed;inset:0;pointer-events:none;overflow:hidden}.confetti i{position:absolute;top:-20px;width:8px;height:14px;border-radius:2px;animation:fall linear infinite}
@keyframes fall{to{transform:translateY(110vh) rotate(540deg)}}
.gold .stat{background:rgba(255,255,255,.35)}.gold .stat b{color:var(--plum)}.gold .small,.gold .stat{color:var(--fg)}
