:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--ease:cubic-bezier(.22, 1, .36, 1);--radius-lg:28px;--radius-md:18px;--radius-sm:12px;--bg-1:#fff5f0;--bg-2:#f3eaff;--bg-3:#e0f2ff;--text:#15131a;--text-soft:#4b4754;--text-dim:#7a7587;--glass:#ffffffa6;--glass-stroke:#ffffff8c;--shadow-lg:0 24px 60px -24px #3f276659, 0 6px 16px -8px #3f27662e;--shadow-md:0 8px 24px -12px #3f27664d;--accent:#6c4dff;--accent-2:#ff63a5;--ring:0 0 0 3px #6c4dff52}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0;padding:0}body{color:var(--text);background:radial-gradient(120% 80% at 0% 0%, var(--bg-1) 0%, transparent 60%), radial-gradient(120% 80% at 100% 0%, var(--bg-3) 0%, transparent 55%), radial-gradient(140% 100% at 50% 110%, var(--bg-2) 0%, transparent 65%), linear-gradient(180deg, #fbf8ff 0%, #f3eef8 100%);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;background-attachment:fixed;font-family:Inter,-apple-system,BlinkMacSystemFont,Helvetica Neue,Segoe UI,system-ui,sans-serif}.app{isolation:isolate;flex-direction:column;gap:18px;max-width:460px;margin:0 auto;padding:24px 18px 120px;display:flex;position:relative}.app__glow{z-index:-1;filter:blur(40px)saturate(120%);pointer-events:none;height:60vh;transition:opacity .6s var(--ease);background:radial-gradient(40% 60% at 20% 30%,#ff63a547,#0000 70%),radial-gradient(45% 60% at 80% 20%,#6c4dff47,#0000 70%),radial-gradient(50% 60% at 50% 70%,#22d3ee38,#0000 70%);position:fixed;inset:-10% -10% auto}.app--mono .app__glow{background:radial-gradient(40% 60% at 20% 30%,#0f172a2e,#0000 70%),radial-gradient(45% 60% at 80% 20%,#94a3b84d,#0000 70%)}.app--cool .app__glow{background:radial-gradient(40% 60% at 20% 30%,#38bdf852,#0000 70%),radial-gradient(50% 60% at 80% 30%,#6366f147,#0000 70%)}.app--neon .app__glow{background:radial-gradient(40% 60% at 30% 30%,#ec489961,#0000 70%),radial-gradient(45% 60% at 80% 20%,#facc1547,#0000 70%),radial-gradient(50% 60% at 50% 90%,#a855f74d,#0000 70%)}.app__header{text-align:center;padding:4px 0 0}.app__eyebrow{letter-spacing:.18em;text-transform:uppercase;color:var(--text-dim);margin:0 0 4px;font-size:12px}.app__title{letter-spacing:-.03em;background:linear-gradient(120deg, var(--accent) 0%, var(--accent-2) 100%);color:#0000;-webkit-background-clip:text;background-clip:text;margin:0;font-size:clamp(34px,9vw,44px);font-weight:800}.brief{border-radius:var(--radius-lg);background:var(--glass);border:1px solid var(--glass-stroke);box-shadow:var(--shadow-md);-webkit-backdrop-filter:blur(18px)saturate(140%);animation:fadeUp .36s var(--ease) both;padding:18px 18px 16px;position:relative;overflow:hidden}.brief__label{letter-spacing:.16em;text-transform:uppercase;color:var(--text-dim);margin:0 0 6px;font-size:11px}.brief__name{letter-spacing:-.02em;align-items:center;gap:10px;margin:0 0 4px;font-size:26px;font-weight:700;display:flex}.brief__emoji{filter:drop-shadow(0 4px 8px #00000014);font-size:30px}.brief__tagline{color:var(--text-soft);margin:0 0 12px;font-size:14px}.brief__tags{flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none;display:flex}.brief__tag{color:var(--text-soft);background:#6c4dff14;border:1px solid #6c4dff2e;border-radius:999px;padding:4px 8px;font-size:11px}.avatar{justify-content:center;padding:8px 0 4px;display:flex;position:relative}.avatar__stage{justify-content:center;align-items:flex-end;width:240px;height:280px;display:flex;position:relative}.avatar__shadow{filter:blur(4px);background:radial-gradient(closest-side,#28125047,#0000 70%);border-radius:50%;width:180px;height:26px;position:absolute;bottom:6px;left:50%;transform:translate(-50%)}.avatar__body{flex-direction:column;align-items:center;width:140px;height:260px;display:flex;position:relative}.avatar__head{background:linear-gradient(160deg,#ffe2cc,#ffd0b4);border-radius:50%;width:78px;height:78px;position:relative;box-shadow:inset -8px -10px #0000000d,0 6px 18px -8px #0003}.avatar__face{position:absolute;inset:0}.avatar__eye{background:#2b1c3a;border-radius:50%;width:6px;height:8px;animation:5s infinite blink;position:absolute;top:36px}.avatar__eye--l{left:22px}.avatar__eye--r{right:22px}.avatar__mouth{background:#d97073;border-bottom-right-radius:16px;border-bottom-left-radius:16px;width:16px;height:8px;position:absolute;bottom:18px;left:50%;transform:translate(-50%)}.avatar__torso{background:linear-gradient(#f3e6da,#e8d5c2);border-radius:30px 30px 24px 24px;width:100px;height:100px;margin-top:-6px;box-shadow:inset -6px -10px #0000000d}.avatar__legs{background:linear-gradient(#efdcc8,#e2cab4);border-radius:0 0 22px 22px;width:84px;height:90px;margin-top:-8px;box-shadow:inset -6px -10px #0000000d}.avatar__layers{pointer-events:none;position:absolute;inset:0}.layer{filter:drop-shadow(0 6px 14px #28125040);animation:pop .32s var(--ease) both;text-shadow:0 0 14px var(--layer-color,transparent);flex-direction:column;align-items:center;gap:2px;font-size:44px;display:flex;position:absolute}.layer__label{letter-spacing:.06em;background:var(--glass);border:1px solid var(--glass-stroke);color:var(--text-soft);white-space:nowrap;border-radius:999px;padding:2px 6px;font-size:10px;font-weight:500}.layer--tops{top:86px;left:50%;transform:translate(-50%)}.layer--bottoms{top:168px;left:50%;transform:translate(-50%)}.layer--shoes{font-size:36px;bottom:0;left:50%;transform:translate(-50%)}.layer--accessories{font-size:30px;top:28px;left:50%;transform:translate(calc(60px - 50%))}.avatar__hint{text-align:center;color:var(--text-dim);letter-spacing:.04em;margin:0;font-size:12px;position:absolute;bottom:-22px;left:0;right:0}.closet{flex-direction:column;gap:10px;margin-top:14px;display:flex}.closet__row{flex-direction:column;gap:6px;display:flex}.closet__heading{letter-spacing:.16em;text-transform:uppercase;color:var(--text-dim);margin:0;padding-left:4px;font-size:12px;font-weight:600}.closet__scroll{scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:8px;padding:6px 4px 10px;display:flex;overflow-x:auto}.closet__scroll::-webkit-scrollbar{display:none}.chip{scroll-snap-align:start;-webkit-backdrop-filter:blur(10px);color:var(--text);letter-spacing:-.01em;cursor:pointer;transition:transform .18s var(--ease), box-shadow .18s var(--ease), background .18s var(--ease), border-color .18s var(--ease);background:#ffffffb3;border:1px solid #0f172a14;border-radius:999px;flex:none;align-items:center;gap:8px;padding:9px 14px 9px 10px;font-family:inherit;font-size:13px;font-weight:600;display:flex;position:relative}.chip:before{content:"";background:var(--chip-color,#eee);border:2px solid #fff;border-radius:50%;flex:none;width:22px;height:22px;box-shadow:0 2px 6px #0000001f}.chip__glyph{margin-left:-4px;font-size:16px}.chip:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}.chip:active{transform:translateY(0)}.chip--active{color:#fff;background:linear-gradient(120deg,#6c4dfff2,#ff63a5f2);border-color:#0000;box-shadow:0 12px 28px -10px #6c4dff8c}.chip--active:before{border-color:#fffc}.chip:focus-visible{box-shadow:var(--ring);outline:none}.actions{background:var(--glass);border:1px solid var(--glass-stroke);width:min(440px,100% - 24px);box-shadow:var(--shadow-lg);-webkit-backdrop-filter:blur(18px)saturate(140%);z-index:10;border-radius:999px;gap:8px;padding:8px;display:flex;position:fixed;bottom:14px;left:50%;transform:translate(-50%)}.btn{font:inherit;letter-spacing:-.01em;cursor:pointer;transition:transform .16s var(--ease), box-shadow .16s var(--ease), background .16s var(--ease), opacity .16s var(--ease);white-space:nowrap;border:none;border-radius:999px;flex:auto;padding:12px 10px;font-size:13px;font-weight:600}.btn:focus-visible{box-shadow:var(--ring);outline:none}.btn--ghost{color:var(--text);background:#ffffff8c}.btn--ghost:hover{background:#ffffffd9}.btn--primary{color:#fff;background:linear-gradient(120deg,#6c4dff,#ff63a5);box-shadow:0 10px 26px -10px #6c4dff99}.btn--primary:hover{transform:translateY(-1px)}.btn--primary:disabled{opacity:.55;cursor:not-allowed;box-shadow:none;transform:none}.result{border-radius:var(--radius-lg);background:var(--glass);border:1px solid var(--glass-stroke);max-width:420px;box-shadow:var(--shadow-lg);-webkit-backdrop-filter:blur(22px)saturate(140%);text-align:center;z-index:11;animation:rise .38s var(--ease) both;margin:0 auto;padding:24px 22px 22px;position:fixed;inset:auto 14px 90px;overflow:hidden}.result__halo{filter:blur(10px);z-index:-1;background:radial-gradient(40% 50% at 30% 20%,#6c4dff40,#0000 70%),radial-gradient(40% 50% at 80% 30%,#ff63a540,#0000 70%);position:absolute;inset:-40%}.result__close{width:28px;height:28px;color:var(--text-soft);cursor:pointer;background:#0f172a0d;border:none;border-radius:50%;place-items:center;font-size:18px;line-height:1;display:grid;position:absolute;top:10px;right:12px}.result__close:hover{background:#0f172a1a}.result__eyebrow{letter-spacing:.18em;text-transform:uppercase;color:var(--text-dim);margin:0 0 6px;font-size:11px}.result__score{letter-spacing:-.04em;background:linear-gradient(120deg, var(--accent), var(--accent-2));color:#0000;-webkit-background-clip:text;background-clip:text;margin:0 0 8px;font-size:72px;font-weight:800;line-height:1}.result__verdict{color:var(--text-soft);margin:0;font-size:15px;line-height:1.4}.result__badge{letter-spacing:.1em;text-transform:uppercase;color:#fff;background:linear-gradient(120deg,#f59e0b,#ef4444);border-radius:999px;margin:12px auto 0;padding:6px 12px;font-size:12px;font-weight:700;display:inline-block;box-shadow:0 8px 18px -6px #ef444480}.result--iconic{box-shadow:var(--shadow-lg), 0 0 0 1px #f59e0b59, 0 0 60px -10px #f59e0b73;animation:rise .38s var(--ease) both, shimmer 2.4s var(--ease) infinite alternate;border-color:#f59e0b80}@keyframes blink{0%,92%,to{transform:scaleY(1)}94%,98%{transform:scaleY(.1)}}@keyframes pop{0%{opacity:0;transform:translate(-50%)scale(.6)}to{opacity:1;transform:translate(-50%)scale(1)}}.layer--accessories{animation-name:popAcc}@keyframes popAcc{0%{opacity:0;transform:translate(calc(60px - 50%))scale(.6)}to{opacity:1;transform:translate(calc(60px - 50%))scale(1)}}@keyframes fadeUp{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes rise{0%{opacity:0;transform:translateY(18px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes shimmer{0%{filter:brightness()}to{filter:brightness(1.05)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}
