/* AI换装镜 — warm editorial workspace */
:root{--bg:#f8f7f5;--bg2:#fff;--panel:#fff;--line:#eae6e4;--line2:#ddd5dc;--tx:#302934;--tx2:#766e7b;--tx3:#9b939e;--ac:#72516e;--ac2:#573c54;--control-border:#e2dce2;--control-hover-border:#b8a4b5;--control-text:#625369;--selected-bg:#f0e9f0;--selected-text:#6d4d69;--recessed-bg:#f4f0f3;--selection-bg:#f8f4f7;--result-bg:#f5f1f4;--r:16px;--sh:0 12px 36px #4935490b}
html{scroll-behavior:smooth;scroll-padding-top:110px}body{background:var(--bg)}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}[hidden]{display:none!important}svg{flex-shrink:0}.studio-symbols{position:absolute;width:0;height:0;overflow:hidden}
.app-header svg,.studio-hero svg,.face-upload-button svg,.card-heading svg,.empty svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.skip-link{position:fixed;top:-70px;left:20px;z-index:100;background:white;color:var(--ac);padding:12px 20px;border-radius:12px}.skip-link:focus{top:10px}
.app-header{height:88px;padding:0 clamp(24px,4vw,80px);display:flex;align-items:center;gap:40px;background:#ffffffed;border-bottom:1px solid var(--line);position:relative;z-index:35}
.studio-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--tx);font-size:22px;font-weight:750;white-space:nowrap;letter-spacing:-.04em}
.studio-brand small{display:block;font-size:8px;letter-spacing:.13em;font-weight:500;color:var(--tx3);margin-top:5px}.brand-mark{width:40px;height:45px;background:#eee5ee;display:grid;place-items:center;border-radius:14px;color:var(--ac)}.brand-mark svg{width:30px;height:35px;stroke-width:1.8}
.studio-sidebar{flex:1;min-width:0}.sidebar-label,.sidebar-bottom{display:none}.studio-nav{display:flex;align-items:center;justify-content:center;gap:6px}.studio-nav button{display:flex;align-items:center;gap:7px;min-height:40px;padding:0 15px;border:0;border-radius:12px;background:transparent;color:var(--tx2);font-size:13px;white-space:nowrap;transition:background .2s}.studio-nav button svg{width:16px;height:16px}.studio-nav button small{display:none}.studio-nav button[aria-current=page]{color:var(--ac2);font-weight:650;background:#f2ecf2}.studio-nav button:hover{background:#f7f3f6;color:var(--ac)}
.studio-topbar{flex-shrink:0}.studio-top-actions{display:flex;align-items:center;gap:16px}.studio-topbar .fitting-toggle{border:0;background:var(--ac);color:white;min-height:42px;border-radius:12px;gap:8px;padding:0 17px;font-size:12px;font-weight:550;box-shadow:0 4px 12px #72516e15}.studio-topbar .fitting-toggle svg{width:16px;height:16px}.studio-topbar .fitting-toggle:hover{background:var(--ac2)}.sidebar-toggle{display:none}
.studio-shell{max-width:1800px;margin:auto;padding:30px clamp(24px,4vw,80px) 0}.studio-hero{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:24px;padding:0;margin:0 0 42px;max-width:none}
.hero-feature{background:#eee8ed;position:relative;display:grid;grid-template-columns:1.15fr 1fr;border-radius:26px;min-height:345px;overflow:hidden;isolation:isolate}.hero-feature:before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 80% 80%,#ecdacc 0,transparent 65%),linear-gradient(125deg,#f1ecef,#eee6ed)}
.studio-hero-copy{padding:42px 0 36px 42px;z-index:2}.hero-kicker{font-size:9px;font-weight:600;letter-spacing:.13em;color:#947a90;display:flex;align-items:center;gap:7px;margin:0 0 20px}.hero-kicker>span{width:5px;height:5px;background:#b48b9f;border-radius:50%}
.studio-hero h1{font-family:var(--f);font-size:clamp(28px,2.65vw,44px);font-weight:700;line-height:1.5;letter-spacing:-.04em;margin:0 0 14px}.studio-hero h1 em{font-style:normal;color:var(--ac)}.hero-description{font-size:12px;line-height:1.9;color:#8b7e8a;margin:0 0 25px}.hero-create{display:inline-flex;gap:20px;align-items:center;justify-content:center;min-height:44px;padding:0 19px;border:0;border-radius:11px;background:#fff;color:var(--ac2);font-size:12px;font-weight:600;box-shadow:0 6px 20px #70516c0a}.hero-create svg{width:17px}.hero-create:hover{background:var(--ac);color:white}.hero-footnote{display:block;font-size:9px;color:#a696a4;margin-top:15px;letter-spacing:.05em}
.hero-collage{position:relative;min-width:0;isolation:isolate}.collage-orbit{position:absolute;width:330px;height:330px;left:2%;top:13%;border:1px solid #fff9;border-radius:50%;z-index:-1}.collage-orbit:after{content:"";position:absolute;inset:23px;border:1px solid #fff5;border-radius:50%}.collage-outfit{width:190px;position:absolute;top:30px;left:25%;margin:0;padding:8px;background:#fff;border-radius:100px 100px 14px 14px;transform:rotate(8deg);box-shadow:0 16px 35px #71546516;overflow:hidden}.collage-outfit img{display:block;width:100%;height:265px;object-fit:cover;border-radius:100px 100px 9px 9px}.collage-outfit figcaption{font-size:8px;letter-spacing:.12em;padding:12px 5px 5px;display:flex;justify-content:space-between;color:#79657a}.collage-outfit figcaption span{font-size:16px;line-height:8px}.collage-face{width:102px;position:absolute;left:2%;top:53%;margin:0;padding:6px;background:white;border-radius:12px;transform:rotate(-10deg);box-shadow:0 14px 25px #7154651a}.collage-face img{display:block;width:90px;height:105px;object-fit:cover;border-radius:8px}.collage-face figcaption{font-size:9px;color:#95798b;padding:8px 0 4px;text-align:center}.collage-sticker{position:absolute;right:10px;top:60%;display:flex;gap:6px;align-items:center;font-size:10px;background:#fae7d5;color:#967456;padding:10px 13px;border-radius:9px;transform:rotate(-7deg);box-shadow:0 4px 10px #7e5f5410}.collage-sticker svg{width:15px;height:15px}.collage-number{position:absolute;bottom:18px;right:20px;font:8px ui-monospace,monospace;letter-spacing:.14em;color:#a798a3}
.hero-discover{display:flex;flex-direction:column;gap:12px;justify-content:center}.discover-heading{display:flex;flex-direction:column;gap:6px;padding:0 4px 4px;font-size:15px;font-weight:600}.discover-heading small{font-size:8px;letter-spacing:.13em;color:var(--tx3);font-weight:400}.discover-card{display:flex;align-items:center;gap:13px;width:100%;text-align:left;border:1px solid var(--line);border-radius:16px;background:#fff;padding:18px 16px;min-height:85px;color:var(--tx);transition:transform .2s,box-shadow .2s}.discover-card:hover{transform:translateX(-3px);box-shadow:var(--sh);border-color:#cdbecb}.discover-card b{display:block;font-size:12px;font-weight:600}.discover-card small{display:block;font-size:10px;color:var(--tx3);margin-top:8px;white-space:nowrap}.discover-icon,.discover-card>img{width:42px;height:46px;border-radius:11px;background:#f1eaf2;color:#aa86ac;display:grid;place-items:center;object-fit:cover}.discover-icon svg{width:24px;height:24px}.discover-pose .discover-icon{background:#f9efdf;color:#bd9b70}.discover-card .discover-arrow{margin-left:auto;width:15px;height:15px;color:#b3a5b1}
.tools{position:relative;top:auto;background:transparent;border:0;backdrop-filter:none;z-index:1;scroll-margin-top:25px}.tools-in{padding:0;max-width:none}.collection-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px}.collection-eyebrow{display:block;font-size:8px;letter-spacing:.16em;color:#aa9baa;margin-bottom:9px}.collection-heading h2{font-size:24px;font-weight:650;margin:0;display:flex;align-items:center;gap:12px;letter-spacing:-.04em}.collection-heading h2 small{font-size:11px;color:#aa8fa6;background:#f0e9ef;border-radius:20px;padding:4px 9px;letter-spacing:0;font-weight:500}
.row2{flex-wrap:nowrap;gap:20px;margin:0}.search{min-width:0}.search input{min-height:48px;font-size:12px;padding:0 45px;border:1px solid var(--line);border-radius:13px;background:#fff}.search input::placeholder{color:#b1a9b3}.search input:focus{border-color:#b8a4b5;box-shadow:0 0 0 3px #72516e08}.search svg{left:16px;opacity:1;color:#a390a0}.search kbd{position:absolute;right:15px;top:13px;border:1px solid var(--line);border-radius:5px;font:11px ui-monospace,monospace;line-height:20px;width:20px;text-align:center;color:#b0a4b1;pointer-events:none}.search:has(input:not(:placeholder-shown)) kbd{display:none}.studio-sort{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--tx3);white-space:nowrap}.studio-sort select{background:transparent;border:0;color:var(--tx2);font-size:12px;min-height:44px;cursor:pointer;max-width:110px}
.tabs{gap:7px;flex-wrap:nowrap;overflow-x:auto;padding:16px 0 6px;scrollbar-width:thin;scrollbar-color:#ddd3dc transparent}.tab{min-height:32px;border:1px solid transparent;background:transparent;border-radius:9px;padding:0 12px;font-size:11px;font-weight:400;color:#908492}.tab em{font-size:9px;font-weight:400;margin-left:6px;color:#b1a6b1}.tab[aria-selected=true]{background:#eee5ee;border-color:transparent;color:var(--ac2)}.tab[aria-selected=true] em{color:#9e7d99}.tab:hover{background:#f0ebef;color:var(--ac)}
.face-sections{display:flex;flex-wrap:wrap;gap:7px;margin-top:16px}.face-sections button{min-height:38px;padding:0 13px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--tx2);font-size:12px}.face-sections button[aria-pressed=true]{background:var(--selected-bg);color:var(--selected-text);border-color:#d7c9d5}.face-sections small{margin-left:5px;font-size:10px}.face-source{font-size:10px;line-height:1.8;color:var(--tx3);margin:10px 0 0}.face-source a{color:var(--ac);text-underline-offset:3px}
.collection-meta{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-top:16px;color:var(--tx3);font-size:10px}.collection-meta .count{font-size:10px;color:#9b8d9c;margin:0}.catalog-status{font-size:12px;color:#8a6c34;background:#fff9ed;border:1px solid #efe4c9;border-radius:10px;padding:10px 12px}.catalog-status button{border:0;background:transparent;color:var(--ac);text-decoration:underline;margin-left:12px}
.studio-gallery{padding:18px 0 36px;max-width:none}.grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:20px}.card{padding:0;border:0;border-radius:16px;background:transparent;position:relative;box-shadow:none}.card:hover,.card:focus-visible{transform:translateY(-4px);box-shadow:none}.card-heading{position:absolute;top:10px;left:10px;right:10px;z-index:2;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.card-type{display:flex;align-items:center;gap:5px;padding:5px 7px;background:#ffffffdc;color:#847384;border-radius:7px;font-size:7px;letter-spacing:.05em;backdrop-filter:blur(8px)}.card-type svg{width:12px;height:12px}.favorite-button{pointer-events:auto;display:grid;place-items:center;width:29px;height:29px;padding:0;border:0;border-radius:50%;background:#ffffffdb;color:#9d8d9e;backdrop-filter:blur(8px)}.favorite-button svg{width:15px;height:15px}.favorite-button[aria-pressed=true]{color:var(--ac)}.favorite-button[aria-pressed=true] svg{fill:#decedc}.favorite-button:hover{background:white;color:var(--ac)}
.ph{border-radius:15px;aspect-ratio:3/4;background:#eeebed;border:1px solid #e8e2e5}.ph img{object-fit:contain}.card[data-kind=pose] .ph{background:#fff}.card[data-kind=face] .ph{background:#eae8e9}.card[data-kind=face] .ph img{object-fit:contain}.card .meta{padding:12px 2px 6px}.meta .row{align-items:flex-start}.meta .id{font-family:var(--f);font-size:11px;line-height:1.5;color:#6e5d70;font-weight:550;min-width:0;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.meta .cat{font-size:9px;color:#a292a3;white-space:nowrap;margin-top:2px}.meta .desc{font-size:10px;line-height:1.6;color:#b1a4b0;margin-top:5px;-webkit-line-clamp:1}.tryon-chip{border-radius:9px;background:#ffffffed;color:var(--ac2);box-shadow:0 2px 10px #39283912;font-size:10px;padding:8px 12px}.card:focus-within .tryon-chip{opacity:1;transform:none}
.empty{padding:65px 20px 75px;line-height:1.9;background:#f3eff3;border:1px dashed #dfd1dd;border-radius:20px;font-size:12px}.empty .empty-icon{display:grid;place-items:center;width:62px;height:62px;background:#fff;border-radius:20px;color:#b398af;margin:0 auto 20px}.empty .empty-icon svg{width:29px;height:29px}.empty b{font-size:18px;font-weight:550}.empty p{margin:0 0 20px}.empty button,.face-upload-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:#eee4ed;border:1px solid #e1d3df;color:var(--ac);border-radius:11px;min-height:40px;padding:0 15px;font-size:12px}.face-upload-button svg{width:16px;height:16px}.studio-footer{padding:10px 20px 28px;color:#b0a3ae;font-size:10px;letter-spacing:.03em}.studio-footer span{margin:0 8px}.morebtn{min-height:42px;min-width:180px;font-size:12px;font-weight:500;border-radius:11px}
.modal{background:#30233188}.modal .close{position:absolute;right:20px;top:16px;width:42px;height:42px;border:1px solid #ffffff66;background:#fff;border-radius:50%;font-size:22px;cursor:pointer;z-index:1}.dl-try,.dl-try:hover{background:var(--ac);color:#fff}.mbox{border-radius:22px}.settings-note{color:#927755}.settings-message,.history-message{color:#b55365}.settings-message.ok{color:#458373}.settings-reset,.history-clear{color:#a35366;border-color:#e7c7d0;background:#fdf4f6}.settings-save{background:var(--ac);color:white}.settings-overlay,.history-overlay,.service-dialog-overlay,.taobao-dialog-overlay{background:#30233177}.settings-card,.history-card{border-radius:24px}.settings-section{background:#faf8fa;padding:18px}.settings-head,.history-head,.settings-form{padding:24px}.history-empty{background:#f7f2f7}
:where(.app-header,.studio-hero,.tools,.studio-gallery) :where(button,a,select):focus-visible{outline:2px solid var(--ac);outline-offset:3px}
@media(max-width:1450px){.app-header{gap:20px;padding:0 30px}.studio-nav button{padding:0 11px;font-size:12px}.studio-nav button svg{display:none}.studio-shell{padding:26px 36px 0}.studio-hero{grid-template-columns:minmax(0,1fr) 280px;gap:20px}.studio-hero-copy{padding-left:30px}.studio-hero h1{font-size:34px}.collage-outfit{left:24%;width:167px}.collage-outfit img{height:248px}.collage-face{left:0;width:93px}.collage-face img{width:81px;height:100px}.collage-sticker{right:5px;font-size:9px;padding:8px}.grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}.studio-brand{font-size:20px}.studio-top-actions{gap:12px}}
@media(max-width:1150px){.app-header{gap:12px;padding:0 22px}.studio-nav{gap:0}.studio-nav button{padding:0 9px;font-size:11px}.studio-brand{font-size:18px}.studio-brand small{font-size:7px}.brand-mark{width:35px;height:40px}.studio-topbar .fitting-toggle{font-size:11px;padding:0 12px;min-height:38px}.studio-hero{grid-template-columns:1fr}.hero-discover{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.discover-heading{display:none}.hero-feature{min-height:315px;grid-template-columns:1fr 1fr}.studio-hero h1{font-size:36px}.studio-hero-copy{padding:30px 0 25px 35px}.collage-outfit{width:172px;left:35%;top:13px}.collage-outfit img{height:245px}.collage-face{left:16%;top:52%}.collage-sticker{right:22px;top:56%}.collage-orbit{top:0;left:18%}.discover-card{padding:14px 12px;gap:10px}.discover-card b{font-size:11px}.discover-card small{font-size:9px}.discover-icon,.discover-card>img{width:35px;height:40px}.grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:800px){.app-header{height:72px;padding:0 20px;gap:12px}.studio-brand{margin-right:auto;font-size:19px}.studio-sidebar{position:fixed;inset:0 auto 0 0;width:250px;background:#fff;padding:35px 20px;transform:translateX(-100%);transition:transform .2s;z-index:45;display:flex;flex-direction:column;border-right:1px solid var(--line);overflow-y:auto}.studio-sidebar.is-open{transform:translateX(0)}.sidebar-label{display:block;font-size:12px;color:var(--tx3);margin-bottom:25px}.sidebar-bottom{display:block;margin-top:auto;font-size:10px;color:var(--tx3);border-top:1px solid var(--line);padding-top:20px}.status-dot{width:5px;height:5px;background:#8aaa95;border-radius:50%;display:inline-block;margin-right:5px}.studio-nav{flex-direction:column;align-items:stretch;gap:10px}.studio-nav button{font-size:13px;padding:0 13px;min-height:48px}.studio-nav button svg{display:block;width:19px;height:19px;margin-right:5px}.studio-nav button small{display:block;margin-left:auto;font-size:10px;color:var(--tx3)}.sidebar-toggle{display:grid;place-items:center;width:35px;height:35px;padding:6px;border:0;background:transparent;color:var(--tx2);order:-1}.sidebar-backdrop{position:fixed;inset:0;background:#30233166;border:0;z-index:40}.studio-shell{padding:22px 24px 0}.studio-hero{margin-bottom:30px}.studio-hero h1{font-size:32px}.hero-kicker{font-size:7px}.hero-description{font-size:11px}.hero-feature{min-height:300px}.studio-hero-copy{padding:30px 0 26px 25px}.collage-outfit{left:25%;width:152px;top:22px}.collage-outfit img{height:220px}.collage-face{left:2%;top:52%;width:85px}.collage-face img{width:73px;height:85px}.collage-sticker{right:2px;top:52%}.collage-number{bottom:10px;right:14px}.collage-orbit{width:260px;height:260px;left:5%;top:8%}.hero-footnote{font-size:8px}.discover-card small{font-size:8px}.discover-card{padding:12px 10px;gap:7px;border-radius:13px}.discover-card .discover-arrow{display:none}.discover-icon,.discover-card>img{width:32px;height:38px}.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.collection-heading h2{font-size:22px}}
@media(max-width:580px){.app-header{height:68px;padding:0 14px;gap:6px}.studio-brand{font-size:17px;gap:7px}.studio-brand small{font-size:6px;letter-spacing:.08em}.brand-mark{width:30px;height:36px;border-radius:10px}.brand-mark svg{width:25px;height:30px}.sidebar-toggle{width:27px;padding:3px}.studio-top-actions{gap:8px}.studio-topbar .fitting-toggle{padding:0 10px;min-height:35px;font-size:10px;border-radius:10px}.studio-topbar .fitting-toggle svg{display:none}.studio-shell{padding:18px 16px 0}.hero-feature{grid-template-columns:1fr;min-height:0;border-radius:20px}.studio-hero-copy{padding:26px 24px 24px}.hero-kicker{font-size:7px;margin-bottom:14px}.studio-hero h1{font-size:30px;line-height:1.5;margin-bottom:10px}.hero-description{font-size:11px;margin-bottom:18px}.hero-description br{display:none}.hero-create{min-height:40px;font-size:11px;padding:0 15px}.hero-footnote{margin-top:11px}.hero-collage{height:208px;margin-top:-8px;overflow:hidden}.collage-outfit{width:143px;left:47%;top:-60px;transform:rotate(10deg)}.collage-outfit img{height:204px}.collage-face{width:85px;left:17%;top:23px;transform:rotate(-12deg)}.collage-face img{height:95px}.collage-sticker{top:120px;right:16px}.collage-orbit{left:22%;top:-76px}.collage-number{bottom:14px;font-size:7px}.hero-discover{gap:8px}.discover-card{flex-direction:column;align-items:flex-start;padding:12px;gap:10px;min-height:111px}.discover-icon,.discover-card>img{height:32px;width:32px;border-radius:9px}.discover-icon svg{height:20px;width:20px}.discover-card b{font-size:10px}.discover-card small{font-size:8px;margin-top:6px;white-space:normal;line-height:1.5}.studio-hero{gap:12px;margin-bottom:28px}.collection-eyebrow{font-size:7px}.collection-heading{margin-bottom:16px}.collection-heading h2{font-size:21px}.collection-heading h2 small{font-size:10px}.row2{gap:7px}.search input{min-height:44px;padding-left:35px;padding-right:10px;font-size:11px;border-radius:11px}.search svg{left:11px;width:17px}.search kbd{display:none}.studio-sort{font-size:0;gap:0}.studio-sort select{font-size:10px;max-width:81px}.tabs{padding-top:12px}.tab{padding:0 10px;font-size:10px}.tab em{font-size:8px}.collection-meta{font-size:9px;gap:8px;margin-top:12px}.collection-meta .count{font-size:9px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.studio-gallery{padding-top:16px}.ph{border-radius:12px}.meta .id{font-size:10px}.meta .cat{font-size:8px}.meta .desc{font-size:9px}.card-type{font-size:6px;padding:4px 5px}.card-heading{left:7px;right:7px;top:7px}.favorite-button{width:26px;height:26px}.face-upload-button{font-size:10px;padding:0 10px;min-height:36px}.face-sections button{font-size:11px;padding:0 10px}.empty{padding:42px 18px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
