:root {
  --ink: #25212a;
  --muted: #8d8491;
  --paper: #fffdfc;
  --canvas: #f8f5f7;
  --line: rgba(45, 35, 50, .09);
  --rose: #e78da5;
  --rose-soft: #f8dfe6;
  --lilac: #d9cef5;
  --blue: #cce5ee;
  --butter: #f5e2aa;
  --sage: #cde2d5;
  --shadow: 0 18px 45px rgba(59, 39, 57, .09);
  --radius: 26px;
}

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--canvas); }
body {
  margin: 0;
  min-height: 100vh;
  color: var(--ink);
  background:
    radial-gradient(circle at 12% 10%, rgba(248,223,230,.9), transparent 30%),
    radial-gradient(circle at 90% 85%, rgba(217,206,245,.55), transparent 34%),
    var(--canvas);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  overflow-x: hidden;
}
button, input, textarea { font: inherit; }
button { color: inherit; }
.ambient { position: fixed; border-radius: 50%; filter: blur(20px); pointer-events: none; z-index: 0; }
.ambient-one { width: 240px; height: 240px; background: rgba(242,190,204,.2); top: -80px; right: -60px; }
.ambient-two { width: 280px; height: 280px; background: rgba(184,213,223,.18); bottom: -100px; left: 4%; }
.app-shell { position: relative; z-index: 1; width: min(1180px, 100%); margin: 0 auto; min-height: 100vh; display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 28px; padding: 26px; }
.desktop-rail { min-height: calc(100vh - 52px); position: sticky; top: 26px; align-self: start; padding: 24px 18px; border: 1px solid rgba(255,255,255,.7); background: rgba(255,253,252,.72); backdrop-filter: blur(18px); border-radius: 30px; box-shadow: var(--shadow); }
.brand-lockup { display: flex; align-items: center; gap: 12px; padding: 4px 8px 28px; }
.brand-mark { width: 42px; height: 42px; display: grid; place-items: center; color: white; background: var(--ink); border-radius: 15px 15px 15px 5px; font-family: Georgia, serif; font-size: 24px; font-style: italic; }
.brand-lockup strong { display: block; font-size: 19px; letter-spacing: .02em; }
.brand-lockup small { color: var(--muted); font-size: 11px; letter-spacing: .12em; }
.desktop-rail nav { display: grid; gap: 7px; }
.nav-button { border: 0; background: transparent; border-radius: 15px; min-height: 52px; padding: 0 14px; display: flex; gap: 12px; align-items: center; cursor: pointer; color: #766d79; transition: .2s ease; }
.nav-button svg, .bottom-nav svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.nav-button:hover { background: rgba(255,255,255,.8); color: var(--ink); transform: translateX(2px); }
.nav-button.active { color: #9d5169; background: linear-gradient(120deg, #fae4ea, #f5edf4); font-weight: 700; }
.rail-card { margin-top: 34px; padding: 17px; background: linear-gradient(145deg, #2c2630, #493d4a); border-radius: 21px; color: white; box-shadow: 0 15px 30px rgba(32,25,33,.18); }
.rail-card .eyebrow { opacity: .55; }
.rail-card strong { display: block; margin: 7px 0 14px; font-family: Georgia, "Songti SC", serif; font-weight: 500; line-height: 1.45; }
.mood-line { display: flex; gap: 5px; }.mood-line i { display: block; width: 9px; height: 4px; border-radius: 9px; background: #f3b4c5; }.mood-line i:nth-child(4), .mood-line i:nth-child(5) { background: rgba(255,255,255,.2); }
.phone-stage { min-width: 0; padding-bottom: 18px; }
.topbar { height: 66px; display: grid; grid-template-columns: 46px 1fr 46px; align-items: center; gap: 12px; padding: 0 4px; }
.avatar { position: relative; border: 0; padding: 0; width: 42px; height: 42px; border-radius: 50%; background: linear-gradient(145deg,#2b2530,#625165); color:white; box-shadow: 0 5px 15px rgba(50,35,51,.18); cursor: pointer; }
.avatar span { font-weight: 700; }.avatar i { position:absolute; right:0; bottom:1px; width:10px; height:10px; border-radius:50%; background:#8dc9a5; border:2px solid var(--canvas); }
.top-title small { display:block; color:var(--muted); font-size:9px; letter-spacing:.18em; margin-bottom:3px; }.top-title strong { font-size:18px; }
.icon-button { position:relative; display:grid; place-items:center; width:42px;height:42px;border:1px solid var(--line);background:rgba(255,255,255,.7);border-radius:15px;cursor:pointer; }.icon-button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.notification-dot{position:absolute;top:9px;right:10px;width:6px;height:6px;border-radius:50%;background:var(--rose);border:1px solid white}
.page { animation: pageIn .35s ease; }
@keyframes pageIn { from {opacity:0; transform:translateY(6px)} to {opacity:1;transform:none} }
.hero { position:relative; overflow:hidden; min-height: 220px; padding: 26px; border-radius: 30px; background: linear-gradient(135deg,#26212a 0%,#443945 65%,#7b6271 100%); color:white; box-shadow: 0 22px 44px rgba(43,32,43,.18); }
.hero:after { content:""; position:absolute; width:240px;height:240px;border-radius:50%; background:radial-gradient(circle,rgba(255,213,224,.26),transparent 65%); right:-55px;top:-70px; }
.hero-copy { position:relative; z-index:2; max-width:62%; }.eyebrow { font-size:10px; letter-spacing:.15em; text-transform:uppercase; color:var(--muted); }.hero .eyebrow{color:#ddc8d2}.hero h1{font:500 31px/1.23 Georgia,"Songti SC",serif;margin:10px 0}.hero p{font-size:12px;line-height:1.7;color:rgba(255,255,255,.7);margin:0 0 20px}.hero-actions{display:flex;gap:10px;align-items:center}.primary-button,.soft-button,.outline-button { border:0;cursor:pointer;min-height:43px;border-radius:15px;padding:0 18px;font-weight:700;font-size:13px;transition:.18s ease; }.primary-button{background:linear-gradient(135deg,#ef9db3,#d97f99);color:#fff;box-shadow:0 10px 22px rgba(207,101,133,.28)}.primary-button:hover{transform:translateY(-2px)}.soft-button{background:#f7e2e8;color:#894d60}.outline-button{background:transparent;border:1px solid var(--line);color:var(--muted)}
.weather-orbit { position:absolute; right:22px; bottom:20px; width:154px; height:154px; border:1px solid rgba(255,255,255,.18); border-radius:50%; display:grid;place-items:center; }.weather-orbit:before,.weather-orbit:after{content:"";position:absolute;border:1px solid rgba(255,255,255,.1);border-radius:50%}.weather-orbit:before{inset:13px}.weather-orbit:after{inset:31px}.weather-main{position:relative;z-index:2;text-align:center}.weather-main b{display:block;font:38px Georgia,serif}.weather-main span{font-size:10px;color:#e7dbe1}.orbit-dot{position:absolute;top:13px;right:23px;width:18px;height:18px;border-radius:50%;background:#f3d384;box-shadow:0 0 24px rgba(243,211,132,.6)}
.quick-row { margin: 16px 0; display:grid; grid-template-columns: repeat(3,1fr); gap:12px; }.quick-card{border:1px solid rgba(255,255,255,.8);background:rgba(255,253,252,.78);backdrop-filter:blur(12px);border-radius:20px;padding:14px;box-shadow:0 10px 25px rgba(47,35,47,.05)}.quick-card small{display:block;color:var(--muted);font-size:10px;margin-bottom:7px}.quick-card strong{font-size:12px;line-height:1.4}.quick-icon{width:28px;height:28px;border-radius:10px;margin-bottom:12px;display:grid;place-items:center;font-size:14px}.quick-card:nth-child(1) .quick-icon{background:var(--rose-soft)}.quick-card:nth-child(2) .quick-icon{background:var(--blue)}.quick-card:nth-child(3) .quick-icon{background:var(--lilac)}
.section-head { display:flex;align-items:end;justify-content:space-between;margin:24px 2px 12px}.section-head h2{font:500 21px Georgia,"Songti SC",serif;margin:0}.section-head p{margin:4px 0 0;color:var(--muted);font-size:11px}.text-button{border:0;background:transparent;color:#a65c73;font-weight:700;font-size:11px;cursor:pointer;padding:8px}
.outfit-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px }.outfit-card{position:relative;border:1px solid var(--line);background:rgba(255,253,252,.9);border-radius:24px;padding:12px;box-shadow:0 12px 28px rgba(48,35,48,.06);cursor:pointer;transition:.2s ease}.outfit-card:hover{transform:translateY(-3px);box-shadow:0 17px 35px rgba(48,35,48,.1)}.outfit-card.selected{outline:2px solid rgba(226,128,156,.45);outline-offset:2px}.outfit-visual{height:155px;display:grid;grid-template-columns:1.15fr .85fr;gap:7px;border-radius:17px;overflow:hidden;background:#f3edf0}.garment-main,.garment-side{display:grid;place-items:center;position:relative}.garment-side{grid-template-rows:1fr 1fr;gap:7px}.piece{width:100%;height:100%;display:grid;place-items:center;overflow:hidden}.piece svg{width:80%;height:80%}.piece.blush{background:#f3dce3}.piece.cream{background:#eee7dd}.piece.blue{background:#d8e6ec}.piece.lilac{background:#e6dff0}.piece.ink{background:#d9d5da}.piece.sage{background:#d8e6dc}.piece.butter{background:#f1e4bd}.outfit-meta{padding:12px 3px 2px}.outfit-meta small{color:var(--muted);font-size:9px;letter-spacing:.08em}.outfit-meta strong{display:block;font-size:13px;margin:5px 0}.outfit-meta p{font-size:10px;color:var(--muted);margin:0;line-height:1.45}.heart{position:absolute;right:20px;top:20px;z-index:3;border:0;width:31px;height:31px;border-radius:50%;background:rgba(255,255,255,.85);font-size:15px;cursor:pointer;box-shadow:0 5px 10px rgba(40,25,35,.08)}
.page-heading{display:flex;justify-content:space-between;align-items:center;margin:12px 2px 20px}.page-heading h1{font:500 30px Georgia,"Songti SC",serif;margin:0}.page-heading p{color:var(--muted);font-size:12px;margin:5px 0 0}.search{display:flex;gap:10px;align-items:center;background:rgba(255,255,255,.75);border:1px solid var(--line);border-radius:17px;padding:0 14px;height:44px;min-width:250px}.search svg{width:18px;height:18px;fill:none;stroke:var(--muted);stroke-width:1.8}.search input{border:0;outline:0;background:transparent;width:100%;color:var(--ink)}
.filter-row{display:flex;gap:8px;overflow:auto;padding:2px 2px 12px;scrollbar-width:none}.filter-chip{white-space:nowrap;border:1px solid var(--line);background:rgba(255,255,255,.72);border-radius:999px;padding:9px 14px;color:var(--muted);font-size:11px;cursor:pointer}.filter-chip.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.wardrobe-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.garment-card{position:relative;border:1px solid var(--line);background:rgba(255,253,252,.88);border-radius:22px;padding:10px;min-width:0}.garment-art{height:138px;border-radius:16px;display:grid;place-items:center;overflow:hidden}.garment-art svg{width:78%;height:78%}.garment-info{padding:10px 3px 3px}.garment-info strong{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.garment-info small{display:block;color:var(--muted);font-size:10px;margin-top:4px}.rating{color:#d9829b;letter-spacing:1px;font-size:9px;margin-top:7px}.availability{position:absolute;top:17px;left:17px;padding:5px 8px;border-radius:999px;background:rgba(255,255,255,.86);color:#669273;font-size:8px;font-weight:800}.add-card{min-height:204px;border:1px dashed rgba(170,125,143,.35);background:rgba(250,238,243,.5);border-radius:22px;display:grid;place-items:center;text-align:center;color:#a86d80;cursor:pointer}.add-card span{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#fff;font-size:23px;margin:0 auto 8px;box-shadow:0 8px 20px rgba(100,62,80,.08)}.add-card b{font-size:12px}
.tryon-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:16px}.mirror-card{min-height:490px;border-radius:30px;padding:18px;background:linear-gradient(150deg,#efe7ec,#dcd6df);box-shadow:var(--shadow);position:relative;overflow:hidden}.mirror-inner{height:100%;min-height:454px;border-radius:22px;background:linear-gradient(165deg,#fefaf8,#eee7ea);border:1px solid rgba(255,255,255,.8);display:grid;place-items:center;position:relative;overflow:hidden}.mirror-inner:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 49.8%,rgba(255,255,255,.5) 50%,transparent 50.2%);opacity:.5}.silhouette{position:relative;width:180px;height:370px;z-index:2}.head{position:absolute;width:72px;height:85px;border-radius:48% 48% 45% 45%;background:#d6b29f;top:8px;left:54px}.hair{position:absolute;width:82px;height:70px;border-radius:50% 50% 20% 20%;background:#363039;top:0;left:49px;clip-path:polygon(5% 0,94% 0,100% 70%,78% 48%,64% 83%,50% 43%,28% 76%,0 66%)}.body-look{position:absolute;width:148px;height:178px;left:16px;top:82px;background:linear-gradient(145deg,#26212c,#59495d);border-radius:42px 42px 18px 18px;clip-path:polygon(20% 0,80% 0,100% 19%,83% 100%,17% 100%,0 19%)}.body-look:after{content:"";position:absolute;width:28px;height:100%;left:60px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent)}.legs{position:absolute;left:38px;top:242px;width:104px;height:124px;background:linear-gradient(90deg,#cabdc3 0 42%,transparent 42% 58%,#cabdc3 58%);clip-path:polygon(0 0,100% 0,92% 100%,65% 100%,50% 18%,35% 100%,8% 100%)}.look-label{position:absolute;left:16px;top:16px;border-radius:999px;background:rgba(255,255,255,.72);backdrop-filter:blur(8px);padding:8px 12px;font-size:9px;color:#746a75;z-index:4}.sparkle{position:absolute;color:white;opacity:.7;font-size:18px}.s1{left:17%;top:25%}.s2{right:18%;top:18%;font-size:11px}.s3{right:12%;bottom:20%;font-size:14px}
.tryon-panel{display:flex;flex-direction:column;gap:12px}.panel-card{background:rgba(255,253,252,.86);border:1px solid var(--line);border-radius:24px;padding:18px}.panel-card h3{font:500 18px Georgia,"Songti SC",serif;margin:0 0 5px}.panel-card>p{font-size:10px;color:var(--muted);line-height:1.55;margin:0 0 14px}.segmented{display:grid;grid-template-columns:1fr 1fr;background:#f1ebee;border-radius:13px;padding:3px}.segment{border:0;background:transparent;border-radius:10px;padding:9px;font-size:10px;color:var(--muted);cursor:pointer}.segment.active{background:#fff;color:var(--ink);box-shadow:0 4px 12px rgba(50,35,50,.08);font-weight:800}.mini-look{display:flex;align-items:center;gap:10px;margin-top:13px;padding:10px;border-radius:15px;background:#f8f4f5}.mini-swatch{width:42px;height:48px;border-radius:12px;background:linear-gradient(135deg,#29232c,#6b5868)}.mini-look span{font-size:10px;color:var(--muted)}.mini-look strong{display:block;color:var(--ink);font-size:11px;margin-bottom:3px}.api-note{border:1px dashed rgba(152,113,129,.25);background:rgba(245,236,241,.55);border-radius:18px;padding:14px;display:flex;gap:10px;align-items:flex-start}.api-note i{font-style:normal;width:26px;height:26px;border-radius:9px;background:#fff;display:grid;place-items:center}.api-note strong{display:block;font-size:10px;margin-bottom:4px}.api-note span{font-size:9px;color:var(--muted);line-height:1.5}.full-button{width:100%;min-height:48px;border:0;border-radius:16px;background:var(--ink);color:white;font-weight:800;font-size:12px;cursor:pointer;box-shadow:0 12px 22px rgba(43,34,44,.18)}
.calendar{background:rgba(255,253,252,.82);border:1px solid var(--line);border-radius:28px;padding:18px}.calendar-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.calendar-head strong{font:500 20px Georgia,serif}.calendar-head button{border:0;background:#f5edf1;border-radius:11px;width:34px;height:34px}.week{display:grid;grid-template-columns:repeat(7,1fr);gap:7px}.day{text-align:center;min-height:94px;border-radius:16px;padding:10px 4px;background:#faf7f8}.day small{color:var(--muted);font-size:8px}.day b{display:block;font-size:11px;margin:6px 0 9px}.day.today{background:linear-gradient(160deg,#f5dfe6,#eee2f0);box-shadow:inset 0 0 0 1px rgba(214,129,155,.25)}.day-look{width:28px;height:35px;margin:auto;border-radius:8px 8px 5px 5px}.history-list{display:grid;gap:10px}.history-item{display:grid;grid-template-columns:52px 1fr auto;gap:12px;align-items:center;background:rgba(255,253,252,.8);border:1px solid var(--line);padding:11px;border-radius:19px}.history-thumb{height:52px;border-radius:14px;background:linear-gradient(145deg,#d8e3e5,#eee0e5)}.history-item strong{display:block;font-size:12px}.history-item small{color:var(--muted);font-size:9px}.temp-feedback{display:flex;gap:5px}.temp-feedback span{font-size:9px;padding:6px 8px;border-radius:999px;background:#f6eef1;color:#9a6d7c}
.profile-card{display:grid;grid-template-columns:90px 1fr auto;gap:17px;align-items:center;padding:20px;background:linear-gradient(135deg,#302936,#534352);color:white;border-radius:28px;box-shadow:var(--shadow)}.profile-portrait{height:90px;border-radius:28px 28px 28px 8px;background:radial-gradient(circle at 52% 35%,#d5b4a5 0 14%,transparent 15%),radial-gradient(circle at 50% 35%,#403841 0 25%,transparent 26%),linear-gradient(145deg,#d9c8d4,#7c6877)}.profile-card h2{font:500 24px Georgia,"Songti SC",serif;margin:0 0 5px}.profile-card p{font-size:10px;color:rgba(255,255,255,.62);margin:0}.profile-card button{border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);color:white;border-radius:13px;padding:10px 13px;font-size:10px}.settings-list{display:grid;gap:10px}.setting{display:grid;grid-template-columns:38px 1fr auto;gap:11px;align-items:center;padding:13px;background:rgba(255,253,252,.8);border:1px solid var(--line);border-radius:18px}.setting-icon{width:38px;height:38px;border-radius:13px;display:grid;place-items:center;background:#f4e9ed}.setting strong{font-size:11px;display:block}.setting small{font-size:9px;color:var(--muted)}.setting>span{color:#b9b0b8}
.bottom-nav { display:none; }
.toast{position:fixed;z-index:20;left:50%;bottom:28px;transform:translate(-50%,20px);padding:11px 18px;border-radius:999px;background:#28222c;color:#fff;font-size:11px;box-shadow:0 12px 30px rgba(30,20,30,.24);opacity:0;pointer-events:none;transition:.25s}.toast.show{opacity:1;transform:translate(-50%,0)}

@media (max-width: 820px) {
  body { background: var(--canvas); }
  .ambient, .desktop-rail { display:none; }
  .app-shell { display:block; padding:0; width:100%; }
  .phone-stage { width:100%; min-height:100vh; padding:0 14px 100px; }
  .topbar { height:72px; position:sticky;top:0;z-index:10;background:rgba(248,245,247,.84);backdrop-filter:blur(16px);padding-top:max(0px,env(safe-area-inset-top)); }
  .hero { min-height:226px;padding:23px 20px }.hero-copy{max-width:66%}.hero h1{font-size:27px}.weather-orbit{width:132px;height:132px;right:12px;bottom:14px}.weather-main b{font-size:33px}
  .quick-row{gap:8px}.quick-card{padding:12px 9px}.quick-card strong{font-size:10px}.outfit-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -14px;padding:3px 14px 18px;scrollbar-width:none}.outfit-card{min-width:76vw;scroll-snap-align:center}.outfit-visual{height:190px}
  .bottom-nav{position:fixed;display:grid;grid-template-columns:repeat(5,1fr);left:10px;right:10px;bottom:max(9px,env(safe-area-inset-bottom));z-index:12;padding:7px 4px;background:rgba(255,253,252,.9);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.85);border-radius:22px;box-shadow:0 16px 38px rgba(56,40,55,.16)}.bottom-nav .nav-button{padding:5px 2px;min-height:48px;display:flex;flex-direction:column;gap:3px;justify-content:center;border-radius:15px;font-size:8px}.bottom-nav .nav-button svg{width:19px;height:19px}.bottom-nav .nav-button:hover{transform:none}
  .page-heading{align-items:flex-end}.page-heading h1{font-size:27px}.search{min-width:44px;width:44px;padding:0 12px}.search input{display:none}
  .wardrobe-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.garment-art{height:146px}
  .tryon-layout{grid-template-columns:1fr}.mirror-card{min-height:430px}.mirror-inner{min-height:394px}.silhouette{transform:scale(.9)}
  .week{gap:4px}.day{min-height:76px;padding:8px 2px}.day-look{width:22px;height:28px}.history-item{grid-template-columns:45px 1fr}.history-thumb{height:45px}.temp-feedback{display:none}
  .profile-card{grid-template-columns:70px 1fr}.profile-portrait{height:70px}.profile-card button{display:none}
}

@media (max-width: 380px) {
  .hero-copy{max-width:72%}.hero h1{font-size:24px}.hero p{max-width:190px}.weather-orbit{width:115px;height:115px;right:4px}.quick-card:nth-child(3){display:none}.quick-row{grid-template-columns:1fr 1fr}.outfit-card{min-width:84vw}
}

@media (prefers-reduced-motion: reduce) { *,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important} }

/* 更接近年轻女性试衣档案的中性时装轮廓 */
.hair{width:90px;height:126px;border-radius:50% 50% 38% 38%;top:-2px;left:45px;clip-path:polygon(8% 0,92% 0,100% 88%,79% 100%,68% 42%,50% 23%,32% 42%,21% 100%,0 88%)}
.body-look{width:128px;left:26px;border-radius:38px 38px 22px 22px;clip-path:polygon(25% 0,75% 0,100% 18%,84% 100%,16% 100%,0 18%)}
.body-look:after{left:51px;width:26px}
.legs{left:42px;width:96px;background:linear-gradient(90deg,#cabdc3 0 41%,transparent 41% 59%,#cabdc3 59%);clip-path:polygon(0 0,100% 0,92% 100%,64% 100%,50% 18%,36% 100%,8% 100%)}