:root{--bg: #fff6ee;--bg-soft: #ffefe3;--surface: #ffffff;--surface-2: #fff9f4;--ink: #46302e;--ink-soft: #8a6f6c;--line: #f3ddd2;--coral: #ff7e8a;--coral-deep: #f25d6f;--peach: #ffc9a9;--mint: #8fe0d5;--teal: #3ec3b4;--lilac: #c9b8f2;--butter: #ffd98a;--tier-silver: #9aa7b5;--tier-gold: #e9a93d;--tier-diamond: #6fc7e8;--tier-black: #2e2630;--radius-s: 12px;--radius-m: 20px;--radius-l: 28px;--shadow-pop: 0 8px 24px rgba(242, 93, 111, .14), 0 2px 6px rgba(70, 48, 46, .06);--shadow-soft: 0 6px 18px rgba(70, 48, 46, .08);--font-display: "Baloo 2", system-ui, sans-serif;--font-body: "Nunito", system-ui, sans-serif;--space-1: 6px;--space-2: 10px;--space-3: 16px;--space-4: 24px;--space-5: 36px;--space-6: 56px;--duration-fast: .15s;--duration-normal: .3s;--ease-pop: cubic-bezier(.34, 1.56, .64, 1)}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{font-family:var(--font-body);color:var(--ink);background:var(--bg);background-image:radial-gradient(640px 420px at 8% -10%,rgba(255,201,169,.45),transparent 64%),radial-gradient(560px 420px at 104% 12%,rgba(201,184,242,.32),transparent 62%),radial-gradient(700px 520px at 50% 118%,rgba(143,224,213,.3),transparent 60%);background-attachment:fixed}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}img{display:block;max-width:100%}.page{max-width:1080px;margin:0 auto;padding:var(--space-4) var(--space-3) var(--space-6)}h1,h2,h3{font-family:var(--font-display);line-height:1.1;margin:0}h1{font-size:clamp(1.7rem,1.3rem + 1.6vw,2.4rem)}h2{font-size:clamp(1.15rem,1rem + .7vw,1.5rem)}.section{margin-top:var(--space-5)}.section-head{display:inline-flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-3)}.section-head:after{content:"";width:46px;height:8px;border-radius:99px;background:linear-gradient(90deg,var(--coral),var(--butter));transform:rotate(-2deg)}.shell-nav{position:sticky;top:12px;z-index:20;max-width:1080px;margin:12px auto 0;padding:10px 14px;display:flex;align-items:center;gap:var(--space-3);background:#ffffffeb;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:99px;box-shadow:var(--shadow-soft)}.wordmark{display:flex;align-items:center;gap:8px;font-family:var(--font-display)}.wordmark strong{font-size:1.15rem;letter-spacing:.02em}.wordmark .club-chip{font-size:.66rem;font-weight:800;letter-spacing:.08em;background:linear-gradient(135deg,var(--coral),var(--coral-deep));color:#fff;padding:3px 8px;border-radius:8px;transform:rotate(-4deg)}.nav-links{display:flex;gap:4px;margin-left:var(--space-2)}.nav-links a{font-weight:800;font-size:.92rem;color:var(--ink-soft);padding:7px 13px;border-radius:99px;transition:background var(--duration-fast),color var(--duration-fast)}.nav-links a:hover{background:var(--bg-soft);color:var(--ink)}.nav-links a.active{background:var(--ink);color:#fff}.nav-right{margin-left:auto;display:flex;align-items:center;gap:var(--space-2)}.coin-pill{display:inline-flex;align-items:center;gap:7px;background:linear-gradient(135deg,#ffe7ae,var(--butter));border:1px solid #f0c465;border-radius:99px;padding:5px 12px 5px 7px;font-family:var(--font-display);font-weight:800;font-size:.95rem;color:#7a5410}.coin-disc{width:20px;height:20px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff3cd,#f5b83d 70%);border:2px solid #d99a23;box-shadow:inset 0 -2px #0000001f}.tier-chip{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-display);font-weight:800;font-size:.8rem;padding:5px 12px;border-radius:99px;color:#fff;text-transform:uppercase;letter-spacing:.05em}.tier-chip:before{content:"";width:8px;height:8px;border-radius:50%;background:#ffffffd9}.tier-silver{background:linear-gradient(135deg,#b9c4d0,var(--tier-silver))}.tier-gold{background:linear-gradient(135deg,#f4c976,var(--tier-gold))}.tier-diamond{background:linear-gradient(135deg,#a4dcf2,var(--tier-diamond))}.tier-black{background:linear-gradient(135deg,#4a3d50,var(--tier-black));box-shadow:0 0 0 1.5px var(--butter) inset}.icon-btn{border:1px solid var(--line);background:var(--surface);color:var(--ink-soft);border-radius:99px;padding:6px 11px;font-weight:800;font-size:.8rem}.icon-btn:hover{color:var(--coral-deep);border-color:var(--coral)}.logout-btn{display:inline-flex;align-items:center;gap:6px;padding:7px 13px}.logout-btn .logout-label{font-family:var(--font-display)}@media (max-width: 600px){.logout-btn .logout-label{display:none}}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-l);box-shadow:var(--shadow-soft);padding:var(--space-4)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-display);font-weight:800;font-size:.95rem;border:none;border-radius:99px;padding:11px 22px;color:#fff;background:linear-gradient(135deg,var(--coral),var(--coral-deep));box-shadow:0 6px 16px #f25d6f59;transition:transform var(--duration-fast) var(--ease-pop),box-shadow var(--duration-fast)}.btn:hover{transform:translateY(-2px);box-shadow:0 10px 20px #f25d6f66}.btn:active{transform:scale(.96)}.btn:disabled{background:var(--line);color:var(--ink-soft);box-shadow:none;transform:none;cursor:default}.btn-ghost{background:var(--surface);color:var(--coral-deep);border:2px solid var(--coral);box-shadow:none}.btn-ghost:hover{background:#fff1f0;box-shadow:none}.btn-small{padding:7px 14px;font-size:.85rem}.input{font:inherit;font-weight:700;color:var(--ink);background:var(--surface-2);border:2px solid var(--line);border-radius:var(--radius-s);padding:11px 14px;width:100%;transition:border-color var(--duration-fast)}.input:focus{outline:none;border-color:var(--coral)}.muted{color:var(--ink-soft)}.small{font-size:.85rem}.gate{max-width:460px;margin:var(--space-6) auto;text-align:center}.gate img{width:132px;margin:-86px auto var(--space-3);border-radius:26px;border:4px solid #fff;box-shadow:var(--shadow-pop);transform:rotate(-3deg)}.gate form{display:flex;gap:var(--space-2);margin-top:var(--space-4)}.gate .error{color:var(--coral-deep);font-weight:700;margin-top:var(--space-2)}.hero{display:grid;grid-template-columns:300px 1fr;gap:var(--space-4);align-items:stretch}.avatar-card{position:relative;text-align:center;padding:var(--space-4);background:linear-gradient(180deg,#fff,var(--surface-2))}.avatar-portrait{width:200px;height:200px;object-fit:cover;object-position:top;margin:0 auto;border-radius:50%;border:5px solid #ffd9cf;animation:floaty 4s ease-in-out infinite}.title-chip{display:inline-block;margin-top:var(--space-2);background:var(--lilac);color:#4a3680;font-weight:800;font-size:.78rem;padding:4px 12px;border-radius:99px;transform:rotate(-2deg)}.name-coral{color:var(--coral-deep)}.hero-main{display:flex;flex-direction:column;gap:var(--space-3)}.hero-greeting{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap}.coin-big{display:flex;align-items:baseline;gap:10px}.coin-big strong{font-family:var(--font-display);font-size:2.6rem;line-height:1}.progress-block{margin-top:auto}.progress-track{height:18px;border-radius:99px;background:var(--bg-soft);border:1px solid var(--line);overflow:hidden}.progress-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,var(--coral),var(--butter));transition:width var(--duration-normal) var(--ease-pop)}.stat-row{display:flex;gap:var(--space-3);flex-wrap:wrap}.stat{flex:1;min-width:120px;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius-m);padding:var(--space-3);text-align:center}.stat strong{font-family:var(--font-display);font-size:1.3rem;display:block}.profile-stage{position:relative;height:320px;margin:20px 0;overflow:hidden;border-radius:var(--radius-m);background:linear-gradient(180deg,#fde7ef,#fff3e4)}.home-cards{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4);margin-bottom:var(--space-4)}.perk-list{list-style:none;padding:0;margin:10px 0 0;display:flex;flex-direction:column;gap:7px}.perk-list li{font-weight:700;font-size:.9rem;padding-left:22px;position:relative}.perk-list li:before{content:"✦";position:absolute;left:0;color:var(--coral)}.perk-list.locked li{font-weight:600;color:var(--ink-soft)}.perk-list.locked li:before{content:"+";color:var(--ink-soft)}.next-perk{margin-top:14px;padding-top:12px;border-top:1px dashed var(--line)}.perks-card .tier-chip{margin-top:2px}.earn-card{display:flex;flex-direction:column}.earn-list{list-style:none;padding:0;margin:12px 0 16px;display:flex;flex-direction:column;gap:11px}.earn-list li{display:flex;gap:11px;align-items:center}.earn-list li div{display:flex;flex-direction:column;line-height:1.25}.earn-list strong{font-size:.92rem}.earn-ico{flex:0 0 auto;width:38px;height:38px;display:grid;place-items:center;font-size:1.3rem;background:var(--surface-2);border:1px solid var(--line);border-radius:12px}.earn-card .btn{margin-top:auto;align-self:flex-start}.badge-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:var(--space-3)}.badge-sticker{background:var(--surface);border:2px dashed #f7c8c0;border-radius:var(--radius-m);padding:var(--space-3);text-align:center;box-shadow:var(--shadow-soft);transition:transform var(--duration-fast) var(--ease-pop)}.badge-sticker:nth-child(odd){transform:rotate(-1.6deg)}.badge-sticker:nth-child(2n){transform:rotate(1.4deg)}.badge-sticker:hover{transform:rotate(0) scale(1.05)}.badge-sticker .glyph{font-size:2rem}.badge-sticker .name{font-weight:800;font-size:.82rem;margin-top:6px}.badge-sticker.trophy{border-style:solid;border-color:var(--butter);background:linear-gradient(180deg,#fffaf0,#fff)}.badge-sticker .limited-tag{color:var(--coral-deep);font-size:.66rem;font-weight:800;letter-spacing:.06em}.ledger{display:flex;flex-direction:column;gap:var(--space-2)}.ledger-row{display:flex;align-items:center;gap:var(--space-3);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-m);padding:10px 16px}.ledger-delta{font-family:var(--font-display);font-weight:800;min-width:70px}.ledger-delta.pos{color:var(--teal)}.ledger-delta.neg{color:var(--coral-deep)}.shop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:var(--space-3)}.shop-card{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-m);padding:var(--space-3);text-align:center;display:flex;flex-direction:column;gap:var(--space-2);transition:transform var(--duration-fast) var(--ease-pop),box-shadow var(--duration-fast)}.shop-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-pop)}.shop-art{font-size:3rem;line-height:1;height:116px;padding:8px;background:var(--surface-2);border-radius:var(--radius-s);display:flex;align-items:center;justify-content:center;overflow:hidden}.shop-art img{max-width:100%;max-height:100%;border-radius:10px}.mini-art{width:24px;height:24px;object-fit:cover;border-radius:7px;display:inline-block;font-size:1.1rem;line-height:24px}.fx-swatch{width:92px;height:92px;display:inline-block}.badge-sticker .glyph img{width:58px;height:58px;object-fit:cover;border-radius:14px}.stage-loading{font-family:var(--font-display);font-weight:800;font-size:.95rem;color:var(--ink-soft);background:#ffffffe6;border-radius:99px;padding:10px 20px;white-space:nowrap;box-shadow:var(--shadow-soft)}.shop-name{font-weight:800}.ribbon{position:absolute;top:10px;left:-6px;font-size:.64rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#fff;padding:3px 10px;border-radius:6px;transform:rotate(-4deg)}.ribbon-common{background:var(--teal)}.ribbon-rare{background:#9b7fe8}.ribbon-epic{background:#f0a32f}.ribbon-limited{background:var(--coral-deep)}.owned-tick{color:var(--teal);font-weight:800}.shop-layout{display:grid;grid-template-columns:.9fr 1.35fr;gap:var(--space-4);align-items:start;margin-top:var(--space-4)}.shop-side{position:sticky;top:84px;display:flex;flex-direction:column;gap:var(--space-3)}.shop-side .stage-card{position:static;height:clamp(300px,42vh,420px)}.tryon-meta{text-align:center;display:flex;flex-direction:column;gap:6px;align-items:center;padding:var(--space-3)}.mini-portrait{width:92px;height:92px;border-radius:50%;object-fit:cover;object-position:top;border:4px solid #ffd9cf}.tryon-rows{display:flex;flex-direction:column;gap:6px;margin-top:8px}.tryon-row{display:flex;align-items:center;gap:8px;font-weight:700;font-size:.88rem}.tryon-row .price{margin-left:auto;color:var(--ink-soft)}.tryon-row button{border:none;background:none;color:var(--coral-deep);font-weight:800;cursor:pointer}.card-actions{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.btn-try.on{background:var(--ink);color:#fff;border-color:var(--ink)}.celebrate-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;display:flex;align-items:center;justify-content:center;background:#46302e47;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);animation:fade-in var(--duration-fast) ease-out}.confetti-layer{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none}.confetti-piece{position:absolute;top:-24px;border-radius:3px;animation-name:confetti-fall;animation-timing-function:cubic-bezier(.3,.6,.5,1);animation-fill-mode:forwards}.confetti-piece.round{border-radius:50%}@keyframes confetti-fall{0%{transform:translateY(-10vh) rotate(0);opacity:1}to{transform:translateY(108vh) rotate(680deg);opacity:.15}}.celebrate-card{position:relative;z-index:1;background:var(--surface);border-radius:var(--radius-l);padding:32px 36px;text-align:center;box-shadow:var(--shadow-pop);max-width:360px;animation:pop-in var(--duration-normal) var(--ease-pop)}.celebrate-burst{font-size:2.2rem}.celebrate-art{width:120px;height:120px;margin:8px auto 14px;background:var(--surface-2);border-radius:var(--radius-m);display:flex;align-items:center;justify-content:center;font-size:3.4rem}.celebrate-art img{max-width:88%;max-height:88%;border-radius:12px}.celebrate-name{font-family:var(--font-display);font-weight:800;font-size:1.15rem;margin:0}.mint-badge{margin-left:8px;font-size:.7rem;background:var(--coral);color:#fff;padding:3px 8px;border-radius:99px;vertical-align:middle}@keyframes pop-in{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%);background:var(--ink);color:#fff;font-weight:800;padding:12px 22px;border-radius:99px;box-shadow:var(--shadow-pop);z-index:50}.toast.good{background:var(--teal)}.toast.bad{background:var(--coral-deep)}.dressing-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:var(--space-4);align-items:start}.stage-card{position:sticky;top:84px;overflow:hidden;padding:0;height:clamp(420px,70vh,640px);background:linear-gradient(180deg,#fde7ef,#fff3e4 55%,#fff9f1)}.stage-note{position:absolute;left:14px;bottom:12px;z-index:2;font-size:.74rem;font-weight:700;color:var(--ink-soft);background:#ffffffd9;border-radius:99px;padding:5px 12px}.stage-col{display:flex;flex-direction:column;gap:var(--space-3);position:sticky;top:84px;align-self:start}.stage-col .stage-card{position:static;height:clamp(340px,54vh,520px)}.save-bar{display:flex;flex-direction:column;gap:6px;align-items:stretch;text-align:center;padding:var(--space-3)}.save-btn{width:100%}.save-btn:disabled{opacity:.55;cursor:default}.save-hint-dirty{color:var(--coral-deep);font-weight:800}.welcome-banner{display:flex;gap:14px;align-items:center;margin-bottom:var(--space-4);background:linear-gradient(120deg,#fff1f0,#fff7e8);border:2px solid var(--peach)}.welcome-spark{font-size:2.4rem;line-height:1;flex:0 0 auto}.link-btn{background:none;border:none;color:var(--ink-soft);font-weight:700;font-size:.84rem;text-decoration:underline;cursor:pointer;padding:4px}.link-btn:hover{color:var(--coral-deep)}.link-btn:disabled{opacity:.5;cursor:default}.wardrobe{display:flex;flex-direction:column;gap:var(--space-3)}.slot-group h3{font-size:1rem;margin-bottom:var(--space-2)}.slot-items{display:flex;flex-wrap:wrap;gap:var(--space-2)}.slot-item{display:inline-flex;align-items:center;gap:8px;background:var(--surface);border:2px solid var(--line);border-radius:var(--radius-s);padding:8px 12px;font-weight:800;font-size:.86rem;transition:border-color var(--duration-fast),transform var(--duration-fast) var(--ease-pop)}.slot-item:hover{transform:translateY(-2px)}.slot-item.on{border-color:var(--coral);background:#fff1f0}.slot-item .mini{font-size:1.1rem}.look-picker{display:flex;flex-direction:column;gap:var(--space-3)}.look-row{display:flex;align-items:center;gap:var(--space-3)}.look-label{font-family:var(--font-display);font-weight:800;font-size:.9rem;width:56px;flex-shrink:0}.look-options{display:flex;gap:8px;flex-wrap:wrap}.swatch{width:30px;height:30px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 1px var(--line);cursor:pointer;padding:0;transition:transform var(--duration-fast) var(--ease-pop),box-shadow var(--duration-fast)}.swatch:hover{transform:scale(1.12)}.swatch.on{box-shadow:0 0 0 3px var(--coral);transform:scale(1.1)}.buddy-carousel{display:flex;align-items:center;gap:6px}.buddy-track{display:flex;gap:var(--space-3);overflow-x:auto;flex:1;scroll-snap-type:x mandatory;padding:4px 2px;scrollbar-width:none}.buddy-track::-webkit-scrollbar{display:none}.carousel-arrow{flex:0 0 auto;width:32px;height:32px;border-radius:50%;border:2px solid var(--line);background:var(--surface);cursor:pointer;font-size:1.2rem;font-weight:800;line-height:1;color:var(--ink);transition:border-color var(--duration-fast),transform var(--duration-fast)}.carousel-arrow:hover{border-color:var(--coral);transform:scale(1.08)}.picker-card{flex:0 0 auto;width:150px;scroll-snap-align:center;cursor:pointer;background:var(--surface-2);border:3px solid var(--line);border-radius:var(--radius-m);padding:var(--space-3);display:flex;flex-direction:column;align-items:center;gap:8px;font-family:var(--font-display);font-weight:800;font-size:1rem;color:var(--ink);transition:transform var(--duration-fast) var(--ease-pop),border-color var(--duration-fast)}.picker-card img{width:100%;aspect-ratio:1 / 1;object-fit:cover;object-position:top;border-radius:18px}.picker-card:hover{transform:translateY(-3px);border-color:var(--peach)}.picker-card.on{border-color:var(--coral);background:#fff1f0}.profile-card{max-width:640px;margin:0 auto;text-align:center}.profile-card .avatar-portrait{width:168px;height:168px}.profile-meta{display:flex;justify-content:center;gap:var(--space-3);flex-wrap:wrap;margin-top:var(--space-3)}@keyframes floaty{0%,to{transform:translateY(0)}50%{transform:translateY(-7px)}}.frame-pearl-shimmer{border:6px solid transparent!important;background:linear-gradient(#fff,#fff) padding-box,conic-gradient(#ffb6d3,#a8d8ff,#b8f3d8,#ffe9a8,#ffb6d3) border-box!important}.frame-bubble-pop{border:6px dotted var(--coral-deep)!important;background:#fff!important}.frame-gold-foil{border:7px solid transparent!important;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,#ffe9a8,#d99a23 40%,#fff3cd,#d99a23 70%,#ffe9a8) border-box!important;box-shadow:0 0 22px #e9a93d8c}.bg-clouds{background:linear-gradient(#ffffff73,#ffffffb8),url(/backgrounds/soft-clouds.png) center / cover,linear-gradient(180deg,#f2fbff,#fff6ee)!important}@media (max-width: 820px){.hero,.dressing-grid,.home-cards,.shop-layout{grid-template-columns:1fr}.shop-side,.stage-col{position:static}.shell-nav{border-radius:var(--radius-m);flex-wrap:wrap}.nav-right{margin-left:0;width:100%;justify-content:flex-end}.stage-card{min-height:420px}}@media (prefers-reduced-motion: reduce){.avatar-portrait{animation:none}.btn,.shop-card,.badge-sticker,.slot-item{transition:none}}