:root{color:#19212a;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background:#fff;font-family:ui-rounded,SF Pro Rounded,Avenir Next,Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%}body{background:#fff;min-width:320px;margin:0;overflow:hidden}button,label{-webkit-tap-highlight-color:transparent}button{font:inherit}.app-shell{--green:#58cc02;--green-dark:#43a600;--blue:#1cb0f6;--orange:#ff9600;--ink:#19212a;--muted:#66717e;--line:#e6ebf1;--line-strong:#d7dfe8;--panel:#fbfcfe;--shadow:0 18px 42px #18212a1a;width:100%;height:100svh;min-height:100svh;padding:calc(env(safe-area-inset-top) + clamp(8px, 1.7vw, 18px)) clamp(12px, 3vw, 30px) calc(env(safe-area-inset-bottom) + clamp(10px, 2vw, 22px));background:#fff;grid-template-rows:auto minmax(0,1fr);gap:clamp(8px,1.7svh,18px);display:grid;overflow:hidden}.app-header{place-items:center;width:min(100%,1120px);min-height:clamp(52px,8svh,82px);margin:0 auto;display:grid;position:relative}.brand{color:var(--ink);-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;display:inline-flex}.brand-word{color:var(--ink);letter-spacing:0;padding:0 .05em .08em;font-size:clamp(2.25rem,6.6vw,4.9rem);font-weight:1000;line-height:.9;display:inline-block;position:relative}.brand-word span{color:var(--green)}.brand-word:after{content:"";background:var(--green);transform-origin:50%;border-radius:999px;width:1.06em;height:.16em;position:absolute;bottom:-.05em;right:.14em;transform:rotate(-2deg)}.top-actions{gap:8px;display:flex;position:absolute;top:50%;right:0;transform:translateY(-50%)}.icon-button{border:1px solid var(--line-strong);width:48px;height:48px;color:var(--ink);box-shadow:0 3px 0 var(--line-strong), 0 12px 24px #18212a14;cursor:pointer;background:#fff;border-radius:999px;place-items:center;transition:transform .14s,box-shadow .14s,border-color .14s;display:inline-grid}.icon-button:hover{border-color:#cbd5df;transform:translateY(-1px)}.icon-button:active{box-shadow:0 1px 0 var(--line-strong), 0 7px 16px #18212a14;transform:translateY(2px)}.primary-action{color:#fff;border-color:var(--green-dark);background:var(--green);box-shadow:0 3px 0 var(--green-dark), 0 12px 22px #58cc0247}.studio-layout{grid-template-columns:minmax(300px,1fr) minmax(320px,400px);align-items:center;gap:clamp(18px,4.6vw,52px);width:min(100%,1120px);min-height:0;margin:0 auto;display:grid}.avatar-area{place-items:center;min-height:0;display:grid}.stage{--face-top:6.8%;--face-width:32%;--face-height:25%;--top-top:22.7%;--top-width:68%;--top-height:44%;--bottom-top:39.5%;--bottom-width:62%;--bottom-height:51%;--part-x:0px;aspect-ratio:2/3;border:1px solid var(--line);width:min(42vw,470px);max-width:100%;box-shadow:var(--shadow);background:linear-gradient(#fff 0% 62%,#fbfcfe 100%);border-radius:24px;position:relative;overflow:hidden}.stage[data-gender=male]{--face-top:6.1%;--face-width:31.5%;--face-height:24.5%;--top-top:20.8%;--top-width:76%;--top-height:50%;--bottom-top:39.2%;--bottom-width:62%;--bottom-height:54%}.stage-floor{filter:blur(1px);background:#18212a0f;border-radius:50%;height:10%;position:absolute;bottom:7.5%;left:15%;right:15%}.avatar-part{object-fit:contain;-webkit-user-select:none;user-select:none;filter:drop-shadow(0 2px #ffffffe6)drop-shadow(0 11px 9px #18212a1f);transform:translateX(calc(-50% + var(--part-x,0px)));position:absolute;left:50%}.face{z-index:3;--part-top:var(--face-top);--part-width:var(--face-width);--part-height:var(--face-height);top:var(--part-top);width:var(--part-width);height:var(--part-height)}.top{z-index:2;--part-top:var(--top-top);--part-width:var(--top-width);--part-height:var(--top-height);top:var(--part-top);width:var(--part-width);height:var(--part-height)}.bottom{z-index:1;--part-top:var(--bottom-top);--part-width:var(--bottom-width);--part-height:var(--bottom-height);top:var(--part-top);width:var(--part-width);height:var(--part-height);object-fit:fill}.face-dock{z-index:5;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffffe0;border:1px solid #d7dfe8d1;border-radius:999px;gap:6px;padding:5px;display:grid;position:absolute;top:12px;right:12px;box-shadow:0 10px 22px #18212a14}.face-chip{width:42px;height:42px;color:var(--ink);box-shadow:0 2px 0 var(--line-strong);cursor:pointer;background:#fff;border:2px solid #0000;border-radius:999px;place-items:center;padding:0;display:grid;position:relative;overflow:hidden}.face-chip.active{border-color:var(--accent,var(--green))}.face-chip img{object-fit:cover;width:100%;height:100%}.face-chip svg:last-child{color:#fff;background:var(--accent,var(--green));border:2px solid #fff;border-radius:999px;position:absolute;bottom:-2px;right:-2px}.upload-face{cursor:pointer}.upload-face input{display:none}.closet-panel{border:1px solid var(--line);background:var(--panel);min-height:0;box-shadow:var(--shadow);border-radius:22px;grid-template-rows:auto minmax(0,1fr);align-self:stretch;gap:12px;padding:14px;display:grid}.selector-controls{gap:10px;display:grid}.segmented{border:1px solid var(--line);background:#eef3f7;border-radius:999px;grid-template-columns:1fr 1fr;gap:4px;padding:4px;display:grid}.segment-button{min-width:0;min-height:39px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:999px;justify-content:center;align-items:center;gap:7px;font-size:.92rem;font-weight:900;line-height:1;display:inline-flex}.segment-button.active{color:#fff;background:var(--green);box-shadow:0 3px 0 var(--green-dark), 0 9px 18px #58cc0238}.pants-icon{flex:none;width:16px;height:19px;position:relative}.pants-icon:before,.pants-icon:after{content:"";background:currentColor;border-radius:3px 3px 5px 5px;width:7px;height:19px;position:absolute;top:0}.pants-icon:before{left:1px;transform:skew(-4deg)}.pants-icon:after{right:1px;transform:skew(4deg)}.item-row{scrollbar-width:thin;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:10px;min-height:0;padding:2px 2px 7px;display:grid;overflow:auto}.item-card{border:1px solid var(--line);min-height:164px;color:var(--ink);box-shadow:0 2px 0 var(--line-strong), 0 10px 18px #18212a0f;cursor:pointer;text-align:left;background:#fff;border-radius:8px;grid-template-rows:minmax(0,1fr);padding:8px;transition:transform .14s,box-shadow .14s,border-color .14s;display:grid;position:relative}.item-card:hover{transform:translateY(-1px)}.item-card:active{box-shadow:0 1px 0 var(--line-strong), 0 7px 14px #18212a0f;transform:translateY(2px)}.item-card.active{border-color:var(--accent);box-shadow:0 0 0 3px #58cc0226, 0 2px 0 var(--accent), 0 13px 24px #18212a14}.item-image-wrap{aspect-ratio:1;place-items:center;width:100%;min-height:98px;display:grid}.item-image-wrap img{object-fit:contain;filter:drop-shadow(0 8px 8px #18212a1a);width:100%;height:100%}.checkmark{color:#fff;background:var(--accent);border:2px solid #fff;border-radius:999px;place-items:center;width:26px;height:26px;display:grid;position:absolute;top:7px;right:7px;box-shadow:0 8px 14px #18212a24}@media (width<=860px){.app-shell{padding:calc(env(safe-area-inset-top) + 8px) 10px calc(env(safe-area-inset-bottom) + 8px);gap:7px}.app-header{min-height:48px}.brand-word{font-size:clamp(1.95rem,10vw,2.55rem)}.top-actions{gap:6px}.icon-button{width:38px;height:38px;box-shadow:0 2px 0 var(--line-strong), 0 9px 18px #18212a14}.primary-action{box-shadow:0 2px 0 var(--green-dark), 0 9px 18px #58cc023d}.studio-layout{grid-template-rows:minmax(0,1fr) auto;grid-template-columns:1fr;place-items:stretch center;gap:8px;width:min(100%,480px)}.avatar-area{align-items:center;width:100%}.stage{border-radius:18px;width:min(82vw,66.6svh - 158.508px,348px);min-width:190px}.face-dock{gap:5px;padding:4px;top:8px;right:8px}.face-chip{width:33px;height:33px}.face-chip svg:first-child{width:18px;height:18px}.closet-panel{border-radius:18px;align-self:end;gap:8px;width:100%;padding:8px}.selector-controls{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:8px}.segmented{gap:3px;padding:3px}.segment-button{gap:4px;min-height:32px;font-size:.76rem}.segment-button svg{width:15px;height:15px}.item-row{scroll-snap-type:x proximity;gap:8px;max-height:none;padding:2px 2px 6px;scroll-padding-inline:8px;display:flex;overflow:auto hidden}.item-card{scroll-snap-align:center;flex:0 0 clamp(96px,24vw,116px);height:102px;min-height:102px;padding:6px}.item-image-wrap{aspect-ratio:auto;height:64px;min-height:0}.checkmark{width:21px;height:21px;top:4px;right:4px}.checkmark svg{width:13px;height:13px}}@media (width<=380px){.brand-word{font-size:clamp(1.75rem,9.2vw,2rem)}.icon-button{width:34px;height:34px}.top-actions{gap:5px}.selector-controls{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:6px}.segment-button{gap:3px;font-size:.69rem}.item-card{flex-basis:92px}}@media (height<=700px) and (width<=860px){.app-shell{padding-top:calc(env(safe-area-inset-top) + 6px);padding-bottom:calc(env(safe-area-inset-bottom) + 6px);gap:5px}.app-header{min-height:42px}.brand-word{font-size:clamp(1.75rem,8.8vw,2.15rem)}.stage{width:min(74vw,66.6svh - 136.53px,304px)}.closet-panel{gap:6px;padding:7px}.segment-button{min-height:29px}.item-card{height:88px;min-height:88px}.item-image-wrap{height:51px}}