/* Product experience: open compositions connected by a shared paper background. */
body.theme-experience{--paper:#fff7fa;--ink:#33282d;--accent:#d62f6a;--muted:#74636b;--pink-soft:#fde9f1;--pink-line:#f3cfdd;--mast-bg:#fff7fa;--exp-gutter:clamp(32px,6vw,112px);--exp-gap:clamp(56px,7vw,120px);background:var(--paper);font-family:"Noto Sans SC","Microsoft YaHei",sans-serif}
.theme-experience .site-header{height:72px;background:#fff7faeb;backdrop-filter:blur(12px)}
.theme-experience .site-header nav>a{font-size:12px}
.theme-experience main h1,.theme-experience main h2,.theme-experience main h3{font-family:"Noto Serif SC","Songti SC","SimSun",serif;font-weight:400;letter-spacing:-.035em}
.theme-experience main h1{font-size:clamp(30px,2.7vw,44px);line-height:1.38;margin:0 0 20px}
.theme-experience main h2{font-size:clamp(23px,2vw,33px);line-height:1.48;margin:0 0 20px}
.theme-experience main h3{font-size:20px;line-height:1.55;margin:0 0 18px}
.theme-experience main p{font-size:14px;line-height:1.95;color:var(--muted);margin:0 0 20px;max-width:430px}
.theme-experience main figure{margin:0;min-width:0;overflow:hidden;border-radius:20px}
.theme-experience main img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}
/* 照片统一柔和投影，形成悬浮立体感（透明手模舞台除外） */
.theme-experience .exp-understanding>figure,.theme-experience .exp-choice>figure,.theme-experience .exp-sea,.theme-experience .exp-store-scene>img,.theme-experience .exp-stores aside figure,.theme-experience .exp-assets aside figure{border-radius:20px;box-shadow:0 34px 70px -38px rgba(168,60,82,.42),0 14px 30px -20px rgba(214,47,106,.28);transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s}
.theme-experience .exp-understanding>figure:hover,.theme-experience .exp-choice>figure:hover,.theme-experience .exp-sea:hover{transform:translateY(-6px);box-shadow:0 44px 90px -40px rgba(168,60,82,.5),0 18px 38px -20px rgba(214,47,106,.34)}
.theme-experience .exp-section{position:relative;scroll-margin-top:100px}
.theme-experience .exp-understanding,.theme-experience .exp-choice,.theme-experience .exp-stores,.theme-experience .exp-assets{width:calc(100% - var(--exp-gutter)*2);max-width:1536px;margin-inline:auto}
.theme-experience .exp-label{font:400 10px/1.6 Arial,sans-serif;letter-spacing:.18em;color:var(--accent);margin-bottom:26px}
.theme-experience .exp-copy{padding:0;align-self:center;min-width:0}
.theme-experience .exp-link{display:inline-flex;gap:28px;align-items:center;min-height:44px;border-bottom:1px solid #d9b3c2;font-size:13px;color:var(--ink);padding-block:8px;margin-top:12px}
.theme-experience .exp-link:hover{color:var(--accent);border-color:var(--accent)}
.theme-experience .exp-button{display:inline-flex;align-items:center;gap:28px;min-height:48px;background:linear-gradient(120deg,#e8447e,#d62f6a);color:#fff;padding:13px 24px;font-size:14px;border-radius:999px;margin:14px 0 24px;box-shadow:0 12px 26px rgba(214,47,106,.24)}
.theme-experience .exp-button:hover{background:linear-gradient(120deg,#d62f6a,#c01f5a)}
.theme-experience .exp-link .icon,.theme-experience .exp-button .icon{width:16px;height:16px}
.theme-experience .exp-caption,.theme-experience main small{font-size:12px;line-height:1.85;color:var(--muted)}
.theme-experience .exp-hero{position:relative;width:100%;max-width:none;min-height:100svh;display:flex;align-items:center;padding:128px var(--exp-gutter) 104px;margin:0 0 clamp(56px,8vw,112px);isolation:isolate;overflow:hidden}
.theme-experience .exp-hero-media{position:absolute;inset:0;z-index:-2}
.theme-experience .exp-hero-media video{width:100%;height:100%;object-fit:cover;object-position:center}
.theme-experience .exp-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(42,12,28,.38) 0%,rgba(42,12,28,.06) 34%,rgba(42,12,28,.16) 58%,rgba(42,12,28,.66) 100%),linear-gradient(90deg,rgba(48,10,30,.52) 0%,rgba(48,10,30,.14) 42%,transparent 70%)}
.theme-experience .exp-hero-copy{padding:0;min-width:0;width:62%;max-width:660px}
.theme-experience .exp-hero h1{font-size:clamp(40px,4.4vw,72px);line-height:1.16;white-space:normal;color:#fff;text-shadow:0 2px 28px rgba(0,0,0,.24)}
.theme-experience .exp-hero .exp-label{color:rgba(255,255,255,.88)}
.theme-experience .exp-hero .exp-lead{font-family:"Noto Serif SC",serif;font-size:clamp(17px,1.5vw,22px);color:rgba(255,255,255,.95);margin-bottom:22px}
.theme-experience .exp-hero-copy>p{color:rgba(255,255,255,.88);max-width:420px}
.theme-experience .exp-link-light{color:#fff;border-bottom-color:rgba(255,255,255,.55)}
.theme-experience .exp-link-light .icon{color:#fff}
.theme-experience .exp-link-light:hover{color:#ffd9e6;border-bottom-color:#ffd9e6}
.theme-experience .exp-understanding{display:grid;grid-template-columns:5fr 6fr;gap:28px var(--exp-gap);padding-block:36px 0;margin-bottom:72px}
.theme-experience .exp-understanding>.exp-copy{grid-column:1;grid-row:1;align-self:end}
.theme-experience .exp-understanding>figure{grid-column:2;grid-row:1/3;align-self:center;aspect-ratio:1.02}
.theme-experience .exp-understanding aside{grid-column:1;grid-row:2;align-self:start;max-width:420px;padding:28px 30px;border-radius:20px;background:linear-gradient(160deg,#fff 0%,#fff7fa 100%);border:1px solid #f4dce7;box-shadow:0 26px 54px -34px rgba(168,60,82,.4),0 8px 20px -14px rgba(214,47,106,.22)}
.theme-experience .exp-understanding aside .exp-label{display:none}
.theme-experience .exp-understanding aside h3{font-size:20px;line-height:1.5;margin-bottom:10px}
.theme-experience .exp-understanding aside br{display:none}
.theme-experience .exp-understanding aside p{font-size:14px;margin-bottom:8px}
.theme-experience .exp-words{list-style:none;display:flex;flex-wrap:wrap;gap:16px 24px;padding:12px 0;margin:0 0 18px;font-size:12px;color:#7a5563}
.theme-experience .exp-words li{padding-bottom:7px;border-bottom:1px solid #e3c3d0}
.theme-experience .exp-tryon{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:var(--exp-gap);row-gap:0;padding:84px max(var(--exp-gutter),calc((100vw - 1536px)/2)) 96px;background:linear-gradient(var(--paper),#ffeef4 18%,#fbd9e6 58%,#ffeef4 88%,var(--paper));color:#5a2f40}
.theme-experience .exp-tryon .exp-copy{grid-column:1;grid-row:1/3;max-width:400px}
.theme-experience .exp-tryon p{color:#6d3b4e}
.theme-experience .exp-tryon h2 br:nth-child(2){display:none}
.theme-experience .tryon-view{grid-column:2;grid-row:1;min-width:0;display:flex;flex-direction:column}
#tryon-stage{position:relative;width:min(100%,460px);aspect-ratio:3/4;margin-inline:auto;overflow:hidden}
#tryon-stage .tryon-hand{display:block;width:100%;height:100%;object-fit:cover;background:transparent}
.theme-experience .tryon-toolbar{min-height:58px;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px 20px;padding:8px 10px;color:#6d3b4e;font-size:11px}
.theme-experience .tryon-controls{grid-column:2;display:grid;grid-template-columns:repeat(3,1fr);gap:0;padding-top:24px;border-top:1px solid #e6b9cb}
.theme-experience .tryon-controls div{padding:0 22px;border-left:1px solid #e6b9cb}
.theme-experience .tryon-controls div:first-child{padding-left:0;border-left:0}
.theme-experience .tryon-controls strong,.theme-experience .tryon-controls span{display:block;font-size:12px;line-height:1.75}
.theme-experience .tryon-controls strong{font-weight:600;margin-bottom:5px;color:#5a2f40}.theme-experience .tryon-controls span{color:#9a6b7c}

.theme-experience .exp-choice{display:grid;grid-template-columns:6fr 5fr;gap:44px var(--exp-gap);margin-block:72px 104px}
.theme-experience .exp-choice>.exp-copy{grid-column:1/-1;display:grid;grid-template-columns:6fr 5fr;column-gap:var(--exp-gap);align-items:start}
.theme-experience .exp-choice>.exp-copy .exp-label{grid-column:1/-1}
.theme-experience .exp-choice>.exp-copy h2{grid-column:1;grid-row:2/4;margin:0}
.theme-experience .exp-choice>.exp-copy>p:not(.exp-label){grid-column:2;grid-row:2;margin:0}
.theme-experience .exp-choice>.exp-copy>a{grid-column:2;grid-row:3;justify-self:start}
.theme-experience .exp-choice>figure{grid-column:1;grid-row:2;aspect-ratio:1.4;align-self:center}
.theme-experience .exp-rules{grid-column:2;grid-row:2;list-style:none;margin:0;padding:0;align-self:center}
.theme-experience .exp-rules li{padding:20px 22px 18px;margin-bottom:14px;border-radius:16px;background:linear-gradient(155deg,#fff,#fff6fa);border:1px solid #f4dce7;border-left:3px solid var(--accent);box-shadow:0 16px 34px -26px rgba(168,60,82,.4);transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
.theme-experience .exp-rules li:hover{transform:translateX(4px);box-shadow:0 22px 46px -26px rgba(168,60,82,.52)}
.theme-experience .exp-rules li:last-child{padding-bottom:18px;margin-bottom:0}
.theme-experience .exp-rules strong{display:block;font-size:16px;font-weight:500;margin-bottom:8px}
.theme-experience .exp-rules span{display:block;font-size:14px;line-height:1.9;color:var(--muted)}
.theme-experience .exp-rules .exp-link{font-size:12px;min-height:44px;border:0;margin:4px 0 0;padding:6px 0;gap:15px}
.theme-experience .exp-stores{display:grid;grid-template-columns:6fr 5fr;gap:28px var(--exp-gap);margin-block:0 104px}
.theme-experience .exp-store-scene{display:contents}
.theme-experience .exp-store-scene>img{grid-column:1;grid-row:1/3;align-self:stretch;min-height:480px;max-height:680px;object-position:56% center}
.theme-experience .exp-store-scene .exp-copy{grid-column:2;grid-row:1;align-self:end}
.theme-experience .exp-store-scene h2 br:nth-child(2){display:none}
.theme-experience .exp-stores aside{grid-column:2;grid-row:2;padding:26px;display:grid;grid-template-columns:100px 1fr;column-gap:24px;align-self:start;border-radius:20px;background:linear-gradient(160deg,#fff 0%,#fff7fa 100%);border:1px solid #f4dce7;box-shadow:0 26px 54px -34px rgba(168,60,82,.4),0 8px 20px -14px rgba(214,47,106,.22)}
.theme-experience .exp-stores aside h3{grid-column:1/-1;font-size:22px;margin:0 0 22px}
.theme-experience .exp-stores aside br{display:none}
.theme-experience .exp-stores aside figure{grid-column:1;grid-row:2/4;aspect-ratio:1}
.theme-experience .exp-stores aside p{grid-column:2;font-size:14px;margin:0 0 6px}
.theme-experience .exp-stores aside small{grid-column:2}
.theme-experience .exp-assets{display:grid;grid-template-columns:5fr 6fr;gap:30px var(--exp-gap);margin-block:0 88px}
.theme-experience .exp-assets>.exp-copy{grid-column:1;grid-row:1;align-self:end}
.theme-experience .exp-assets h2 br:nth-child(2){display:none}
.theme-experience .exp-sea{grid-column:2;grid-row:1/3;align-self:stretch;min-height:560px;position:relative}
.theme-experience .exp-sea img{position:absolute;inset:0}
.theme-experience .exp-assets aside{grid-column:1;grid-row:2;display:grid;grid-template-columns:1fr 104px;gap:14px 24px;align-self:start;padding:26px;border-radius:20px;background:linear-gradient(160deg,#fff 0%,#fff7fa 100%);border:1px solid #f4dce7;box-shadow:0 26px 54px -34px rgba(168,60,82,.4),0 8px 20px -14px rgba(214,47,106,.22)}
.theme-experience .exp-assets aside .exp-label{grid-column:1/-1;margin:0}
.theme-experience .exp-assets ol{grid-column:1;list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;font-size:13px;color:#7a5563}
.theme-experience .exp-assets li{padding-block:8px}
.theme-experience .exp-assets aside figure{grid-column:2;grid-row:2/4;aspect-ratio:1}
.theme-experience .exp-assets aside small{grid-column:1}
.theme-experience .exp-availability{font-size:12px;text-align:center;max-width:none;margin:0;padding:24px var(--exp-gutter);background:var(--paper)}
.theme-experience .site-footer{background-color:#fff9fb;background-image:linear-gradient(var(--paper),#fff7fa75 35%,#fff9fb35),url('assets/experience/09.webp');background-size:cover;background-position:center 55%;min-height:320px;padding-block:100px 60px;border:0}
.theme-experience .site-footer>div>p,.theme-experience .footer-meta{color:#6d4251}
.theme-experience .preview-caption{background:#f9e9eb}
@media(min-width:768px) and (max-width:1100px){
 body.theme-experience{--exp-gutter:40px;--exp-gap:48px}
 .theme-experience .site-header nav>a{font-size:10px}
 .theme-experience main h1,.theme-experience .exp-hero h1{font-size:32px;white-space:normal}
 .theme-experience main h2{font-size:28px}
 .theme-experience .exp-hero{min-height:760px;padding:116px 40px 88px;margin-bottom:88px}
 .theme-experience .exp-understanding>figure{aspect-ratio:auto;height:520px}
 .theme-experience .exp-tryon{grid-template-columns:1fr 1fr;row-gap:24px;padding-block:80px}
 .theme-experience .exp-tryon .exp-copy{grid-row:1}
 .theme-experience .tryon-controls{grid-column:1/-1;justify-content:center;gap:40px}
 .theme-experience .exp-choice{margin-block:80px 100px}
 .theme-experience .exp-choice>figure{aspect-ratio:.85}
 .theme-experience .exp-stores{margin-bottom:100px}
 .theme-experience .exp-store-scene>img{min-height:600px}
 .theme-experience .exp-stores aside{grid-template-columns:75px 1fr;gap:16px}
 .theme-experience .exp-assets aside{grid-template-columns:1fr 75px;gap:10px 16px}
 .theme-experience .exp-assets ol{grid-template-columns:1fr}
}
@media(max-width:767px){
 body.theme-experience{--exp-gutter:24px;--exp-gap:32px}
 .theme-experience .site-header{height:64px}.theme-experience .site-header nav>a{font-size:11px}
 .theme-experience main h1,.theme-experience .exp-hero h1{font-size:clamp(32px,8.6vw,42px);line-height:1.45;white-space:normal}
 .theme-experience main h2{font-size:30px;line-height:1.5}
 .theme-experience main h3{font-size:23px}
 .theme-experience main p{font-size:15px;line-height:1.95}
 .theme-experience main p br{display:none}
 .theme-experience .exp-label{font-size:10px;margin-bottom:22px}
 .theme-experience .exp-section{scroll-margin-top:88px}
 .theme-experience .exp-hero{min-height:100svh;display:flex;flex-direction:column;justify-content:center;gap:0;padding:104px 24px 84px;margin-bottom:clamp(44px,9vw,72px);align-items:stretch}
 .theme-experience .exp-hero-copy{width:100%;max-width:560px}
 .theme-experience .exp-understanding{display:flex;flex-direction:column;gap:32px;padding:0;margin-bottom:64px}
 .theme-experience .exp-understanding>figure{width:100%;aspect-ratio:1.15;order:1}
 .theme-experience .exp-understanding aside{order:2;width:100%;padding-top:24px}
 .theme-experience .exp-words{gap:14px 22px}
 .theme-experience .exp-tryon{display:flex;flex-direction:column;gap:24px;padding:64px 24px 72px}
 .theme-experience .exp-tryon .exp-copy{max-width:none;align-self:stretch}
 .theme-experience .tryon-view{width:100%}#tryon-stage{width:min(100%,390px)}
 .theme-experience .tryon-controls{grid-template-columns:1fr;gap:18px;padding-top:22px}
 .theme-experience .tryon-controls div{padding:0 0 18px;border-left:0;border-bottom:1px solid #e6b9cb}
 .theme-experience .tryon-toolbar{font-size:11px;gap:8px}
 .theme-experience .exp-choice{display:flex;flex-direction:column;gap:30px;margin-block:64px 80px}
 .theme-experience .exp-choice>.exp-copy{display:block;align-self:stretch}
 .theme-experience .exp-choice>.exp-copy h2{margin-bottom:22px}
 .theme-experience .exp-choice>figure{aspect-ratio:1.3;width:100%}
 .theme-experience .exp-rules{align-self:stretch}
 .theme-experience .exp-rules li{padding-block:22px}
 .theme-experience .exp-stores{display:flex;flex-direction:column;gap:30px;margin-bottom:80px}
 .theme-experience .exp-store-scene .exp-copy{order:0;align-self:stretch}
 .theme-experience .exp-store-scene>img{order:1;min-height:0;height:auto;aspect-ratio:1.15;max-height:none}
 .theme-experience .exp-stores aside{order:2;grid-template-columns:90px 1fr;gap:18px;align-self:stretch;padding-top:26px}
 .theme-experience .exp-assets{display:flex;flex-direction:column;gap:30px;margin-bottom:70px}
 .theme-experience .exp-assets>.exp-copy{align-self:stretch}
 .theme-experience .exp-sea{width:100%;min-height:0;aspect-ratio:1.1}
 .theme-experience .exp-assets aside{align-self:stretch;grid-template-columns:1fr 85px;gap:14px 18px}
 .theme-experience .exp-assets ol{font-size:12px;gap:5px 10px}
 .theme-experience .exp-caption{font-size:12px}
 .theme-experience .site-footer{min-height:300px;padding:76px 24px 38px}
}
@media(prefers-reduced-motion:reduce){.theme-experience *{scroll-behavior:auto!important;transition:none!important}}

/* ── 小花 Agent 专区：错位式排版，标题直写「小花 Agent」 ── */
.theme-experience .exp-agent{display:grid;grid-template-columns:5fr 6fr;gap:30px var(--exp-gap);margin-block:0 96px;width:calc(100% - var(--exp-gutter)*2);max-width:1536px;margin-inline:auto}
.theme-experience .exp-agent>.exp-copy{grid-column:1;grid-row:1;align-self:end}
.theme-experience .exp-agent h2{font-size:clamp(26px,2.3vw,38px)}
.theme-experience .exp-agent .exp-agent-hero{grid-column:2;grid-row:1/3;align-self:stretch;min-height:420px;position:relative;margin:0;overflow:hidden}
.theme-experience .exp-agent .exp-agent-hero img,.theme-experience .exp-agent .exp-agent-hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.theme-experience .exp-agent .exp-agent-hero video.agent-sparkle{animation:agentFloat 4.6s ease-in-out infinite}
@keyframes agentFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.theme-experience .exp-agent aside{grid-column:1;grid-row:2;display:grid;grid-template-columns:96px 1fr;gap:20px;align-items:center;align-self:start;padding-top:26px;border-top:1px solid #f0d8e1}
.theme-experience .exp-agent aside .ip-avatar{width:96px;height:96px;border-radius:50%;object-fit:contain;background:radial-gradient(circle at 40% 35%,#fff,#fde9f0);box-shadow:0 8px 20px rgba(132,31,66,.12);border:1px solid #f6dde7}
.theme-experience .exp-agent aside p{font-size:13px;margin:0 0 6px}
.theme-experience .exp-agent aside small{font-size:12px;color:var(--muted);line-height:1.8;display:block}
@media (min-width:1101px){
  .theme-experience .exp-agent>.exp-copy{align-self:start;margin-top:64px}
  .theme-experience .exp-agent .exp-agent-hero{margin-top:44px}
  .theme-experience .exp-agent aside{margin-left:52px}
}
@media (max-width:767px){
  .theme-experience .exp-agent{display:flex;flex-direction:column;gap:30px;margin-bottom:80px}
  .theme-experience .exp-agent .exp-agent-hero{width:100%;min-height:0;aspect-ratio:4/3}
  .theme-experience .exp-agent aside{align-self:stretch;grid-template-columns:84px 1fr;gap:16px}
  .theme-experience .exp-agent aside .ip-avatar{width:84px;height:84px}
}

/* ── 错位式排版（宽屏）：标题区与图、图与注释互相错开，形成参差节奏 ── */
@media (min-width:1101px) {
  .theme-experience .exp-understanding {padding-block:52px 0;margin-bottom:104px}
  .theme-experience .exp-understanding>figure {align-self:start;margin-top:108px}
  .theme-experience .exp-understanding aside {align-self:start;margin-top:48px;margin-left:70px}
  .theme-experience .exp-tryon {padding-top:96px}
  .theme-experience .exp-tryon .tryon-view {margin-top:48px}
  .theme-experience .exp-choice {margin-block:88px 112px}
  .theme-experience .exp-choice>figure {margin-top:80px}
  .theme-experience .exp-stores {margin-bottom:112px}
  .theme-experience .exp-stores aside {margin-top:40px}
  .theme-experience .exp-assets {margin-bottom:96px}
  .theme-experience .exp-assets>figure.exp-sea {margin-top:64px}
  .theme-experience .exp-assets aside {margin-left:46px}
}
