@charset "UTF-8";
/*
 * Chang'an Hanfu storefront skin (design source: websites/changanhanfu.com/changan-hanfu-store).
 * Every rule is scoped under .ca and every class is ca- prefixed so the inherited
 * default theme cannot collide with this markup (and vice versa). No !important.
 */

.ca {
    --ca-paper: #f8f4eb;
    --ca-paper-deep: #eee5d7;
    --ca-paper-light: #fcfaf4;
    --ca-paper-band: #eee6da;
    --ca-paper-note: #eee6d9;
    --ca-ink: #24211e;
    --ca-ink-soft: #595148;
    --ca-muted: #665c53;
    --ca-line: #dfd4c4;
    --ca-line-strong: #cfc3b2;
    --ca-red: #b63831;
    --ca-red-dark: #982c27;
    --ca-sage: #737a68;
    --ca-on-red: #ffffff;
    --ca-toast-bg: #27231f;
    --ca-shadow: 0 5px 18px rgba(54, 42, 29, .08);
    --ca-shadow-lift: 0 10px 24px rgba(54, 42, 29, .12);
    --ca-serif: Georgia, "Times New Roman", "Noto Serif SC", "Songti SC", serif;
    --ca-sans: Arial, "Helvetica Neue", "PingFang SC", "Microsoft YaHei", sans-serif;
    /*
     * 版心与沟槽：只消费框架契约 token（Theme/variables/_spacing.css）。
     * 本设计主题把版心定为 1360px，其余壳层全部继承，不再各自算宽度。
     */
    --weline-layout-content-max-width: 1360px;
    --ca-content: var(--weline-layout-content-max-width);
    --ca-gutter: var(--weline-layout-content-padding-inline);
    color: var(--ca-ink);
    font-family: var(--ca-sans);
    font-size: 15px;
    line-height: 1.55;
}

body.ca {
    margin: 0;
    background: var(--ca-paper) url("/static/Weline/hanfu/frontend/assets/images/changan/paper-texture.svg") repeat;
    background-size: 240px 240px;
}

/*
 * 继承主题的 body 会在整页高度上铺两层大渐变（radial + 180deg linear），
 * 长页面上 8bit 量化会把渐变切成一条条可见色阶（截图里的"不均匀方块"）。
 * 本皮肤改回平纸色 + 无缝点纹理，彻底去掉色带。
 */
/* 页面画布 owner 在 hanfu-ui-sot.css（主题风格文件）；此处不再重复声明。 */

.ca *,
.ca *::before,
.ca *::after { box-sizing: border-box; }
.ca img { max-width: 100%; display: block; }
.ca a { color: inherit; text-decoration: none; }
.ca button, .ca input, .ca select, .ca textarea { font: inherit; }
.ca button { cursor: pointer; }
.ca :focus-visible { outline: 2px solid var(--ca-red); outline-offset: 3px; }
.ca h1, .ca h2, .ca h3, .ca h4, .ca p { margin-top: 0; }
.ca h1, .ca h2, .ca h3, .ca .ca-serif { font-family: var(--ca-serif); font-weight: 400; color: var(--ca-ink); }
.ca h1 { font-size: clamp(42px, 5.4vw, 78px); line-height: 1.04; margin-bottom: 18px; letter-spacing: -.025em; }
.ca h2 { font-size: clamp(29px, 3vw, 42px); line-height: 1.15; margin-bottom: 14px; }
.ca h3 { font-size: 25px; line-height: 1.22; margin-bottom: 9px; }
.ca p { color: var(--ca-ink-soft); }

.ca-icon { width: 24px; height: 24px; flex: 0 0 auto; }
.ca-icon--xs { width: 14px; height: 14px; }
.ca-icon--sm { width: 18px; height: 18px; }
.ca-icon--lg { width: 38px; height: 38px; }
.ca-skip { position: absolute; left: -9999px; top: 0; }
.ca-skip:focus { left: 12px; top: 12px; z-index: 100; background: var(--ca-paper-light); padding: 8px 12px; }

.ca-wrap {
    box-sizing: border-box;
    width: min(100%, var(--ca-content));
    margin-inline: auto;
    padding-inline: var(--ca-gutter);
}
.ca-eyebrow { font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--ca-muted); }
.ca-lead { font-size: 17px; max-width: 570px; line-height: 1.75; }
.ca-muted { color: var(--ca-muted); }
.ca-zh { font-family: "Noto Serif SC", "Songti SC", serif; letter-spacing: .08em; }
.ca-center { text-align: center; }
.ca-stamp { font-family: var(--ca-serif); letter-spacing: .24em; font-size: 11px; color: var(--ca-red); }
.ca-notice { font-size: 12px; padding: 12px 14px; background: var(--ca-paper-note); border-left: 2px solid var(--ca-red); color: #675c51; }
.ca-divider { height: 1px; background: var(--ca-line); margin: 26px 0; }
.ca-empty { text-align: center; padding: 45px 20px; color: var(--ca-muted); border: 1px dashed var(--ca-line); }

/* Buttons & links */
.ca-btn {
    display: inline-flex; justify-content: center; align-items: center; gap: 12px;
    min-height: 48px; padding: 0 25px; border: 1px solid var(--ca-ink); background: transparent;
    color: var(--ca-ink); transition: background .2s, color .2s, border-color .2s; white-space: nowrap;
}
.ca-btn:hover { background: var(--ca-ink); color: var(--ca-on-red); }
.ca-btn--primary { background: var(--ca-red); border-color: var(--ca-red); color: var(--ca-on-red); }
.ca-btn--primary:hover { background: var(--ca-red-dark); border-color: var(--ca-red-dark); }
.ca-btn--small { min-height: 38px; padding: 0 17px; font-size: 13px; }
.ca-btn--block { width: 100%; }
.ca-btn[disabled] { opacity: .55; cursor: not-allowed; }
.ca-link { display: inline-flex; gap: 8px; align-items: center; border-bottom: 1px solid currentColor; padding-bottom: 4px; font-size: 13px; letter-spacing: .04em; }
.ca-link:hover { color: var(--ca-red); }

/* Announcement + header */
.ca-announce {
    height: 35px; background: #eee8dd; border-bottom: 1px solid rgba(77, 65, 50, .12);
    display: flex; align-items: center; justify-content: center; gap: 22px;
    font-size: 11px; letter-spacing: .04em; color: #38322d;
}
.ca-announce__dot { color: var(--ca-red); font-size: 16px; }
.ca-header {
    height: 78px; border-bottom: 1px solid rgba(88, 72, 55, .15); display: flex; align-items: center;
    justify-content: space-between; padding: 0 calc(max(0px, (100vw - var(--ca-content)) / 2) + var(--ca-gutter)); gap: 30px;
    background: rgba(250, 247, 239, .92); position: relative; z-index: 40;
}
.ca-brand { display: block; width: 218px; flex: 0 0 218px; }
.ca-brand img { width: 100%; height: auto; }
.ca-nav { display: flex; align-items: center; justify-content: center; gap: clamp(22px, 3.25vw, 54px); flex: 1; }
.ca-nav a { font-family: var(--ca-serif); font-size: 16px; white-space: nowrap; position: relative; padding: 27px 0; }
.ca-nav a:hover::after,
.ca-nav a.is-active::after { content: ""; height: 1.5px; background: var(--ca-red); position: absolute; bottom: 17px; left: 0; right: 0; }
.ca-actions { display: flex; align-items: center; gap: 14px; }
.ca-icon-link { border: 0; background: none; padding: 5px; display: inline-flex; align-items: center; justify-content: center; position: relative; color: var(--ca-ink); }
.ca-icon-link:hover { color: var(--ca-red); }
/* 账号位头像（登录态由框架 account-session.js 客户端替换；未登录仍是原剪影）
   外框 34px = 1px 描边 + 2px 透明纸隙 + 28px 头像；34px 与相邻 .ca-icon 24px + padding 5×2 等高，
   icons 行节奏不变。纸隙透出 header 底色，不引入新色值。 */
.ca-account { display: inline-flex; }
.ca-account__slot { display: inline-flex; align-items: center; justify-content: center; }
/* 34px 外框已含视觉留白；断点里 .ca-actions .ca-icon-link 的 padding 不得再撑宽账号位。 */
.ca-actions .ca-icon-link.ca-icon-link--account { padding: 0; }
.ca-account__avatar {
    display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box;
    inline-size: 34px; block-size: 34px; padding: 2px; border: 1px solid var(--ca-line);
    border-radius: 50%; background: transparent;
}
.ca-account__img { inline-size: 100%; block-size: 100%; object-fit: cover; display: block; border-radius: 50%; }
.ca-account__fallback {
    inline-size: 100%; block-size: 100%; display: flex; align-items: center; justify-content: center;
    border-radius: 50%; overflow: hidden; background: var(--ca-paper-deep);
    font-family: var(--ca-serif); font-size: 12px; line-height: 1; color: var(--ca-muted);
}
.ca-account__fallback svg { width: 16px; height: 16px; }
.ca-account__fallback[data-has-initial="1"] svg { display: none; }
.ca-cart-count {
    font-size: 10px; position: absolute; right: -2px; top: -4px; background: var(--ca-red); color: var(--ca-on-red);
    min-width: 17px; height: 17px; padding: 0 4px; display: grid; place-items: center; border-radius: 9px; line-height: 1;
}
.ca-cart-count[hidden] { display: none; }
.ca-menu-toggle { display: none; }

/* Currency switcher */
.ca-currency { position: relative; }
.ca-currency__toggle {
    display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--ca-line); background: transparent;
    padding: 6px 10px; font-size: 12px; letter-spacing: .06em; color: var(--ca-ink); min-height: 34px;
}
.ca-currency__toggle:hover { border-color: var(--ca-ink); }
.ca-currency__toggle .ca-icon { width: 14px; height: 14px; transition: transform .2s; }
.ca-currency.is-open .ca-currency__toggle .ca-icon { transform: rotate(180deg); }
.ca-currency__panel {
    position: absolute; right: 0; top: calc(100% + 8px); width: 260px; max-height: 360px; overflow: auto;
    background: var(--ca-paper-light); border: 1px solid var(--ca-line); box-shadow: var(--ca-shadow-lift);
    padding: 8px; z-index: 60;
}
.ca-currency__panel[hidden] { display: none; }
.ca-currency__search { width: 100%; border: 0; border-bottom: 1px solid var(--ca-line); background: transparent; padding: 8px 6px; margin-bottom: 6px; outline: none; }
.ca-currency__option { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 6px; font-size: 13px; color: var(--ca-ink); }
.ca-currency__option:hover,
.ca-currency__option.active { background: var(--ca-paper-deep); }
.ca-currency__option.active { color: var(--ca-red); }
.ca-currency__symbol { min-width: 30px; font-family: var(--ca-serif); }
.ca-currency__code { min-width: 38px; letter-spacing: .06em; }
.ca-currency__name { color: var(--ca-muted); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ca-currency__option[hidden] { display: none; }

/* Hero 底部渐隐：照片不再与下一段"图贴图" */
@media (min-width: 901px) {
    .ca-hero::after {
        content: "";
        position: absolute;
        left: 0; right: 0; bottom: 0;
        height: clamp(90px, 12vw, 170px);
        background: linear-gradient(to bottom, rgba(248, 244, 235, 0) 0%, rgba(248, 244, 235, .55) 48%, var(--ca-paper) 100%);
        pointer-events: none;
        z-index: 0;
    }
    .ca-hero__copy { position: relative; z-index: 1; }
}

/* Hero */
.ca-hero { min-height: 480px; position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: center; background: #f3ede2; }
.ca-hero::before {
    content: ""; position: absolute; inset: 0; z-index: -1;
    background: linear-gradient(90deg, rgba(248, 244, 235, .99) 0%, rgba(248, 244, 235, .93) 34%, rgba(248, 244, 235, .18) 61%, rgba(248, 244, 235, 0) 100%);
}
.ca-hero__image { position: absolute; inset: 0 0 0 auto; width: 61%; height: 100%; object-fit: cover; object-position: 42% 45%; z-index: -2; }
.ca-hero__copy {
    box-sizing: border-box;
    width: min(100%, var(--ca-content));
    margin: 0 auto;
    padding: 65px var(--ca-gutter) 72px;
    position: relative;
}
.ca .ca-hero__title { font-size: clamp(52px, 7vw, 94px); max-width: 660px; margin-bottom: 4px; letter-spacing: .04em; }
.ca-hero__brand { font-size: 19px; letter-spacing: .21em; margin: 9px 0 16px; display: flex; align-items: center; gap: 14px; }
.ca-hero__brand::before,
.ca-hero__brand::after { content: ""; height: 1px; background: currentColor; width: 42px; }
.ca .ca-hero__tagline { font-family: var(--ca-serif); font-size: clamp(26px, 3vw, 40px); line-height: 1.2; margin-bottom: 26px; color: #332f2b; }
.ca-hero__actions { display: flex; gap: 13px; flex-wrap: wrap; }

/* Trust strip */
.ca-trust {
    display: grid; grid-template-columns: repeat(3, 1fr);
    background: var(--ca-paper);
    border-top: 0; border-bottom: 1px solid var(--ca-line);
    padding: 20px 26px;
}
.ca-trust__item { display: flex; align-items: center; justify-content: center; gap: 17px; padding: 0 20px; border-right: 1px solid var(--ca-line-strong); }
.ca-trust__item:last-child { border-right: 0; }
.ca-trust__item .ca-icon { width: 38px; height: 38px; color: var(--ca-ink); }
.ca-trust__item strong { font-weight: 400; font-size: 14px; display: block; color: var(--ca-ink); }
.ca-trust__item span { display: block; color: var(--ca-muted); font-size: 12px; }

/* Sections */
.ca-section { padding: 70px 0; }
.ca-section--tight { padding: 42px 0; }
.ca-section-head { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.ca .ca-section-head h2 { margin: 0; }
.ca-section-head .ca-eyebrow { margin-bottom: 10px; }

/* Category tiles */
.ca-cats { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; }
.ca-cat {
    border: 1px solid rgba(125, 103, 78, .16); border-radius: 9px; overflow: hidden; background: rgba(255, 253, 248, .68);
    box-shadow: var(--ca-shadow); transition: transform .2s, box-shadow .2s;
}
.ca-cat:hover { transform: translateY(-3px); box-shadow: var(--ca-shadow-lift); }
.ca-cat img { width: 100%; aspect-ratio: 1.55; object-fit: cover; }
.ca-cat__copy { text-align: center; padding: 11px 8px 13px; }
.ca .ca-cat h3 { font-size: 19px; margin: 0 0 1px; }
.ca .ca-cat__zh { font-family: var(--ca-serif); font-size: 14px; margin: 0; color: var(--ca-muted); }
.ca .ca-cat__micro { font-size: 11px; color: var(--ca-muted); margin: 3px 0 0; }

/* Product cards */
.ca-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }
.ca-card {
    min-width: 0; position: relative; border: 1px solid rgba(125, 103, 78, .15); background: #fcfaf5; border-radius: 8px;
    overflow: hidden; box-shadow: 0 3px 10px rgba(58, 46, 31, .06); transition: transform .2s, box-shadow .2s;
}
.ca-card:hover { transform: translateY(-3px); box-shadow: var(--ca-shadow); }
.ca-card__photo { position: relative; display: block; overflow: hidden; aspect-ratio: 1.28; background: #e9e0d3; }
.ca-card__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s; }
.ca-card:hover .ca-card__photo img { transform: scale(1.035); }
.ca-card__badge { position: absolute; top: 12px; left: 12px; background: #f4eada; color: var(--ca-red); padding: 5px 9px; font-family: var(--ca-serif); font-size: 11px; letter-spacing: .04em; }
.ca-card__info { padding: 14px 16px 15px; }
.ca .ca-card__title { font-size: 19px; margin: 0 0 5px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.ca .ca-card__sub { font-size: 12px; color: var(--ca-muted); margin-bottom: 12px; }
.ca-card__meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ca-price { font-family: var(--ca-serif); font-size: 19px; color: var(--ca-ink); white-space: nowrap; }
.ca-price__was { color: var(--ca-muted); font-size: 13px; margin-left: 4px; }
.ca-pill { border: 1px solid #d9c9b7; border-radius: 20px; padding: 4px 10px; font-family: var(--ca-serif); font-size: 12px; white-space: nowrap; }
.ca-card__quick { color: var(--ca-red); font-size: 12px; padding: 8px 0 0; display: inline-flex; gap: 7px; align-items: center; }

/* Editorial */
.ca-editorial { display: grid; grid-template-columns: 1.06fr .94fr; min-height: 360px; background: #ece2d3; overflow: hidden; }
.ca-editorial__image { min-height: 360px; position: relative; }
.ca-editorial__image img { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: cover; }
.ca-editorial__copy { padding: clamp(32px, 5vw, 72px); display: flex; justify-content: center; flex-direction: column; }
.ca-editorial__copy h2 { max-width: 450px; }
.ca-editorial__copy p { max-width: 430px; }

/* Journal */
.ca-journal { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.ca-journal-card { border: 1px solid var(--ca-line); background: rgba(255, 253, 247, .75); overflow: hidden; }
.ca-journal-card img { aspect-ratio: 1.65; width: 100%; object-fit: cover; }
.ca-journal-card__copy { padding: 19px 21px 22px; }
.ca-journal-card__date { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--ca-muted); }
.ca .ca-journal-card h3 { font-size: 23px; margin: 8px 0; }
.ca .ca-journal-card p { font-size: 13px; }

/* Footer */
.ca-footer { margin-top: 30px; border-top: 1px solid var(--ca-line); background: var(--ca-paper-band); padding: 48px 0 22px; }
.ca-footer__grid { display: grid; grid-template-columns: 1.35fr 1fr 1fr 1fr; gap: 34px; padding-bottom: 37px; }
.ca-footer__brand { max-width: 260px; }
.ca-footer__brand img { width: 205px; margin-bottom: 17px; }
.ca .ca-footer__brand p { font-size: 13px; }
.ca .ca-footer__col h3 { font-size: 15px; font-family: var(--ca-sans); font-weight: 600; margin-bottom: 15px; }
.ca-footer__col a { display: block; color: #62584f; font-size: 13px; margin: 9px 0; }
.ca-footer__col a:hover { color: var(--ca-red); }
.ca-newsletter { display: flex; margin-top: 13px; border-bottom: 1px solid #9f9281; max-width: 290px; }
.ca-newsletter input { background: transparent; border: 0; min-width: 0; width: 100%; padding: 10px 0; outline: none; color: var(--ca-ink); }
.ca-newsletter button { border: 0; background: none; font-size: 12px; padding: 0 4px; color: var(--ca-ink); }
.ca-footer__bottom { border-top: 1px solid #d5c9b9; padding-top: 17px; display: flex; justify-content: space-between; gap: 18px; flex-wrap: wrap; font-size: 11px; color: #5f5449; }
.ca-footer__bottom nav { display: flex; gap: 14px; flex-wrap: wrap; }
.ca-footer__bottom a:hover { color: var(--ca-red); }

/* Page hero / breadcrumbs */
.ca-page-hero { padding: 54px 0 48px; text-align: center; border-bottom: 1px solid rgba(125, 103, 78, .16); background: linear-gradient(115deg, rgba(239, 230, 216, .8), rgba(249, 246, 238, .25)); }
.ca .ca-page-hero h1 { font-size: clamp(38px, 5vw, 62px); margin: 0 0 12px; }
.ca .ca-page-hero p { max-width: 620px; margin: 0 auto; }
.ca-breadcrumbs { font-size: 12px; color: var(--ca-muted); margin: 23px 0; display: flex; gap: 9px; align-items: center; flex-wrap: wrap; }
.ca-breadcrumbs a:hover { color: var(--ca-red); }

/* Listing */
.ca-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 22px; flex-wrap: wrap; }
.ca-chips { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.ca-chip { background: transparent; border: 1px solid var(--ca-line); padding: 9px 14px; font-size: 12px; color: var(--ca-ink); }
.ca-chip.is-active,
.ca-chip:hover { background: var(--ca-ink); color: var(--ca-on-red); border-color: var(--ca-ink); }
.ca-field,
.ca-sort select {
    border: 1px solid var(--ca-line); background: rgba(255, 253, 248, .7); padding: 12px; color: var(--ca-ink); border-radius: 0; min-width: 0;
}
.ca-sort { display: inline-flex; align-items: center; gap: 10px; font-size: 12px; color: var(--ca-muted); }
.ca-sort select { min-width: 185px; }
.ca-shop { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 28px; }
.ca-sidebar { border-right: 1px solid var(--ca-line); padding-right: 20px; }
.ca .ca-sidebar h3 { font-size: 18px; margin: 0 0 14px; }
.ca-sidebar__group { padding-bottom: 22px; margin-bottom: 20px; border-bottom: 1px solid var(--ca-line); }
.ca-sidebar__group:last-child { border-bottom: 0; }
.ca-sidebar a { display: block; font-size: 13px; padding: 5px 0; color: var(--ca-muted); }
.ca-sidebar a:hover,
.ca-sidebar a.is-active { color: var(--ca-red); }
.ca .ca-sidebar p { font-size: 12px; }
.ca-count { font-size: 12px; color: var(--ca-muted); }
.ca-pager { display: flex; gap: 6px; justify-content: center; align-items: center; margin-top: 34px; flex-wrap: wrap; }
.ca-pager a,
.ca-pager span { min-width: 38px; height: 38px; display: inline-grid; place-items: center; padding: 0 10px; border: 1px solid var(--ca-line); font-size: 13px; }
.ca-pager a:hover { border-color: var(--ca-ink); }
.ca-pager .is-current { background: var(--ca-ink); color: var(--ca-on-red); border-color: var(--ca-ink); }
.ca-pager .is-gap { border: 0; }

/* Forms grid (forms / dynasties tiles) */
.ca-forms { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.ca-form-card { position: relative; display: block; background: #eee4d4; min-height: 260px; overflow: hidden; }
.ca-form-card img { position: absolute; width: 100%; height: 100%; object-fit: cover; inset: 0; transition: transform .4s; }
.ca-form-card:hover img { transform: scale(1.04); }
.ca-form-card::after { content: ""; position: absolute; inset: 40% 0 0; background: linear-gradient(transparent, rgba(28, 24, 20, .72)); }
.ca-form-card__copy { position: absolute; z-index: 1; bottom: 20px; left: 22px; right: 22px; color: var(--ca-on-red); }
.ca .ca-form-card h3 { font-size: 27px; margin: 0; color: var(--ca-on-red); }
.ca .ca-form-card p { color: var(--ca-on-red); font-size: 12px; margin: 4px 0 0; }

/* Size guide */
.ca-size { display: grid; grid-template-columns: .72fr 1.28fr; gap: 54px; align-items: start; }
.ca-size__note { background: var(--ca-paper-note); padding: 28px; margin-top: 22px; }
.ca-table-wrap { border: 1px solid var(--ca-line); overflow: auto; background: rgba(255, 253, 248, .75); }
.ca table.ca-table { border-collapse: collapse; width: 100%; min-width: 480px; text-align: left; }
.ca-table th,
.ca-table td { border-bottom: 1px solid #e4dbce; padding: 13px 15px; font-size: 13px; }
.ca-table th { background: #f0e9dd; font-weight: 500; }
.ca-table tr:last-child td { border-bottom: 0; }
.ca .ca-size__tip { font-size: 12px; color: var(--ca-muted); margin-top: 12px; }
.ca-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 26px; }
.ca-step { border: 1px solid var(--ca-line); padding: 18px; background: rgba(255, 253, 248, .5); }
.ca-step__num { font-family: var(--ca-serif); font-size: 28px; color: var(--ca-red); }
.ca .ca-step p { font-size: 12px; margin-bottom: 0; }

/* PDP */
.ca-pdp { display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(0, .98fr); gap: 44px; align-items: start; }
.ca-gallery { display: grid; grid-template-columns: 78px minmax(0, 1fr); gap: 12px; position: sticky; top: 18px; }
.ca-gallery--single { grid-template-columns: minmax(0, 1fr); }
.ca-thumbs { display: flex; flex-direction: column; gap: 9px; max-height: 640px; overflow: auto; }
.ca-thumb { padding: 0; background: none; border: 1px solid transparent; }
.ca-thumb.is-active { border-color: #4d453c; }
.ca-thumb img { width: 100%; aspect-ratio: 3 / 3.5; object-fit: cover; }
.ca-gallery__main { width: 100%; aspect-ratio: .84; object-fit: cover; background: #eae1d5; }
.ca-pdp__details { padding: 9px 0; }
.ca-pdp__details .ca-breadcrumbs { margin-top: 0; }
.ca-labels { display: flex; gap: 8px; flex-wrap: wrap; margin: 13px 0; }
.ca-labels span { border: 1px solid var(--ca-line); padding: 4px 10px; font-size: 12px; color: #655b50; }
.ca .ca-pdp__summary { max-width: 520px; font-size: 14px; line-height: 1.8; }
.ca-pdp__price { font-family: var(--ca-serif); font-size: 30px; margin: 13px 0 0; color: var(--ca-ink); display: flex; gap: 12px; align-items: baseline; flex-wrap: wrap; }
.ca-pdp__price s { font-size: 17px; color: var(--ca-muted); }
.ca-pdp__price .ca-pdp__off { font-family: var(--ca-sans); font-size: 12px; color: var(--ca-red); border: 1px solid var(--ca-red); padding: 2px 6px; }
.ca .ca-pdp__tax { font-size: 12px; color: var(--ca-muted); margin: 4px 0 18px; }
.ca-option { margin: 16px 0 0; }
.ca-option__head { display: flex; justify-content: space-between; align-items: center; margin: 0 0 9px; font-size: 13px; }
.ca-option__value { color: var(--ca-muted); margin-left: 6px; font-weight: 400; }
.ca-option__list { display: flex; gap: 8px; flex-wrap: wrap; }
.ca-variant { min-width: 60px; min-height: 37px; padding: 0 12px; border: 1px solid var(--ca-line); background: transparent; color: var(--ca-ink); font-size: 13px; display: inline-flex; align-items: center; gap: 8px; }
.ca-variant.is-selected,
.ca-variant:hover { background: #393633; color: var(--ca-on-red); border-color: #393633; }
.ca-variant.is-unavailable { opacity: .45; text-decoration: line-through; }
.ca-variant__swatch { width: 18px; height: 18px; border-radius: 50%; border: 1px solid var(--ca-line); background-size: cover; background-position: center; }
.ca-qty { display: inline-flex; border: 1px solid var(--ca-line); align-items: center; }
.ca-qty button { width: 34px; height: 40px; border: 0; background: none; color: var(--ca-ink); }
.ca-qty input { width: 44px; height: 40px; border: 0; text-align: center; background: transparent; color: var(--ca-ink); -moz-appearance: textfield; }
.ca-qty input::-webkit-outer-spin-button,
.ca-qty input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.ca-mini-chart { border: 1px solid var(--ca-line); border-radius: 8px; overflow: hidden; margin: 15px 0; background: rgba(255, 253, 248, .55); }
.ca-mini-chart__head { padding: 11px 13px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--ca-line); font-size: 13px; }
.ca-mini-chart table { border-collapse: collapse; width: 100%; }
.ca-mini-chart th,
.ca-mini-chart td { padding: 7px 10px; text-align: center; font-size: 11px; border-bottom: 1px solid #e4dbce; font-weight: 400; }
.ca-mini-chart tr:last-child td { border-bottom: 0; }
.ca-mini-chart__tip { padding: 8px 12px; font-size: 11px; color: var(--ca-muted); }
.ca-ship-note { display: flex; gap: 10px; align-items: center; font-size: 12px; color: #5d554c; margin: 17px 0; }
.ca-buy { display: grid; grid-template-columns: auto 1fr .7fr; gap: 10px; align-items: stretch; }
.ca-buy .ca-btn { width: 100%; padding-inline: 12px; }
.ca-buy .weline-cart-product-add-to-cart { display: contents; }
.ca-buy .ca-btn.is-loading { opacity: .7; }
.ca-message { min-height: 0; font-size: 13px; margin-top: 10px; }
.ca-message:empty { display: none; }
.ca-message.is-error { color: var(--ca-red); }
.ca-message.is-success { color: var(--ca-sage); }
.ca-message a { text-decoration: underline; margin-left: 6px; }
.ca .ca-unavailable { color: var(--ca-red); font-size: 13px; }
.ca-reassure { display: grid; grid-template-columns: 1fr 1fr; background: #f1eadf; border: 1px solid var(--ca-line); padding: 16px 10px; margin-top: 14px; gap: 10px; }
.ca-reassure__item { display: flex; justify-content: center; align-items: center; gap: 11px; font-size: 12px; border-right: 1px solid var(--ca-line); }
.ca-reassure__item:last-child { border: 0; }
.ca-reassure__item span { display: block; color: var(--ca-muted); font-size: 11px; }
.ca-tabs { margin-top: 48px; border-top: 1px solid var(--ca-line); }
.ca-tabs details { border-bottom: 1px solid var(--ca-line); padding: 17px 0; }
.ca-tabs summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; font-family: var(--ca-serif); font-size: 20px; }
.ca-tabs summary::-webkit-details-marker { display: none; }
.ca-tabs details[open] summary .ca-tabs__sign { transform: rotate(45deg); }
.ca-tabs__sign { transition: transform .2s; }
.ca-tabs__body { max-width: 860px; margin: 15px 0 2px; font-size: 14px; line-height: 1.85; color: var(--ca-ink-soft); }
.ca-tabs__body img { margin: 14px 0; height: auto; }
.ca-specs { display: grid; grid-template-columns: max-content 1fr; gap: 6px 18px; font-size: 13px; }
.ca-specs dt { color: var(--ca-muted); }
.ca-specs dd { margin: 0; }

/* Article / prose */
.ca-article { display: grid; grid-template-columns: minmax(0, 780px) minmax(180px, 1fr); gap: 60px; max-width: 1110px; margin: 0 auto; }
.ca-prose { line-height: 1.95; color: var(--ca-ink-soft); }
.ca-prose h2 { font-size: 31px; margin: 37px 0 13px; }
.ca-prose h3 { font-size: 23px; margin: 28px 0 10px; }
.ca-prose p,
.ca-prose li { line-height: 1.95; }
.ca-prose a { color: var(--ca-red); border-bottom: 1px solid currentColor; }
.ca-prose img { width: 100%; height: auto; margin: 28px 0; max-height: 560px; object-fit: cover; }
.ca-prose table { border-collapse: collapse; width: 100%; margin: 18px 0; }
.ca-prose th,
.ca-prose td { border: 1px solid var(--ca-line); padding: 9px 12px; font-size: 13px; text-align: left; }
.ca-aside { border-left: 1px solid var(--ca-line); padding-left: 25px; height: max-content; }
.ca-aside a { display: block; font-size: 13px; margin: 12px 0; color: var(--ca-muted); }
.ca-aside a:hover { color: var(--ca-red); }
.ca-narrow { max-width: 850px; margin-inline: auto; }
.ca-narrow h2 { font-size: 30px; margin-top: 34px; }
.ca-narrow p,
.ca-narrow li { line-height: 1.9; }
.ca-info-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.ca-info-card { padding: 25px; border: 1px solid var(--ca-line); background: rgba(255, 253, 248, .55); }
.ca-info-card .ca-icon { width: 28px; height: 28px; margin-bottom: 14px; color: var(--ca-red); }
.ca .ca-info-card h3 { font-size: 21px; }
.ca .ca-info-card p { font-size: 13px; margin-bottom: 0; }

/* Contact / forms */
.ca-contact { display: grid; grid-template-columns: .85fr 1.15fr; gap: 45px; }
.ca-contact__info { background: var(--ca-paper-note); padding: 31px; }
.ca-contact__line { display: flex; gap: 12px; margin: 18px 0; }
.ca-contact__line .ca-icon { width: 21px; height: 21px; }
.ca-form { display: grid; gap: 15px; }
.ca-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.ca-form label { font-size: 12px; color: #5e554c; display: grid; gap: 7px; }
.ca-form textarea { min-height: 135px; resize: vertical; }
.ca-form .ca-field { width: 100%; }

/* FAQ */
.ca-faq details { border-bottom: 1px solid var(--ca-line); padding: 19px 0; }
.ca-faq summary { list-style: none; cursor: pointer; font-family: var(--ca-serif); font-size: 20px; display: flex; justify-content: space-between; gap: 20px; }
.ca-faq summary::-webkit-details-marker { display: none; }
.ca-faq details[open] .ca-tabs__sign { transform: rotate(45deg); }
.ca-faq__answer { padding-top: 13px; max-width: 760px; line-height: 1.85; color: var(--ca-ink-soft); }

/* Search */
.ca-search-form { display: flex; gap: 10px; max-width: 650px; margin: 28px auto; }
.ca-search-form input { flex: 1; min-width: 0; background: transparent; border: 0; border-bottom: 1px solid #9e9283; padding: 13px 4px; color: var(--ca-ink); }
.ca-search-form--inline { max-width: 280px; margin: 0; }
.ca-search-form--inline input { padding: 10px 2px; }

/* Module islands (cart / checkout / account / search results) sit on paper */
.ca-island { background: rgba(255, 253, 248, .6); border: 1px solid var(--ca-line); padding: 24px; }
.ca-island--bare { background: none; border: 0; padding: 0; }
.ca-account-card { max-width: 520px; margin: 0 auto; border: 1px solid var(--ca-line); padding: 35px; background: rgba(255, 253, 248, .7); }

/* Cart / checkout (static storefront cart.html + checkout.html) */
.ca-cart { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(280px, .7fr); gap: 35px; align-items: start; }
.ca-cart__items { border-top: 1px solid var(--ca-line); }
.ca-cart__item { display: grid; grid-template-columns: 115px minmax(0, 1fr) auto; gap: 18px; padding: 20px 0; border-bottom: 1px solid var(--ca-line); align-items: start; }
.ca-cart__item img { width: 115px; height: 135px; object-fit: cover; background: var(--ca-paper-deep); }
.ca .ca-cart__item h3 { font-size: 21px; margin-bottom: 6px; }
.ca-cart__sub { font-size: 12px; color: var(--ca-muted); margin-bottom: 12px; }
.ca-cart__line-price { font-family: var(--ca-serif); font-size: 18px; white-space: nowrap; }
.ca-qty-control { display: inline-flex; border: 1px solid var(--ca-line); align-items: center; }
.ca-qty-control button { width: 32px; height: 32px; border: 0; background: none; color: var(--ca-ink); }
.ca-qty-control button:hover { color: var(--ca-red); }
.ca-qty-control span { min-width: 25px; text-align: center; font-size: 12px; }
.ca-remove { border: 0; background: none; padding: 7px 0; color: var(--ca-muted); text-decoration: underline; font-size: 11px; cursor: pointer; }
.ca-cart__summary { background: var(--ca-paper-note); padding: 25px; position: sticky; top: 18px; }
.ca .ca-cart__summary h3 { font-size: 22px; margin-bottom: 13px; }
.ca-summary-line { display: flex; justify-content: space-between; gap: 15px; padding: 10px 0; font-size: 13px; border-bottom: 0; }
.ca-summary-line--total { border-top: 1px solid #d1c4b3; margin-top: 8px; padding-top: 17px; font-size: 16px; }
.ca-cart__summary .ca-btn { width: 100%; margin-top: 12px; }
.ca-cart__empty { text-align: center; padding: 65px 20px; border: 1px dashed var(--ca-line); }
.ca-cart__empty .ca-icon { width: 38px; height: 38px; margin: 0 auto 20px; color: var(--ca-muted); }
.ca-checkout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr); gap: 45px; align-items: start; }
.ca-checkout__section { display: grid; gap: 13px; margin-bottom: 26px; }
.ca-checkout__section h2 { font-size: 28px; margin: 0 0 4px; }
.ca-checkout__summary { background: var(--ca-paper-note); padding: 25px; position: sticky; top: 18px; }
.ca-checkout__summary .ca-btn { width: 100%; margin-top: 12px; }
.ca-checkout__summary-item { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid rgba(207, 195, 178, .55); font-size: 13px; }
.ca-checkout__summary-item:last-of-type { border-bottom: 0; }
.ca-radio-line { display: flex; align-items: flex-start; gap: 9px; font-size: 12px; color: var(--ca-ink-soft); }
.ca-radio-line input { margin-top: 3px; accent-color: var(--ca-red); }
.ca-visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* Toast */
.ca-toast {
    position: fixed; z-index: 90; bottom: 25px; right: 25px; max-width: min(360px, calc(100% - 40px));
    background: var(--ca-toast-bg); color: var(--ca-on-red); padding: 15px 19px; box-shadow: 0 5px 20px rgba(0, 0, 0, .14);
    opacity: 0; transform: translateY(12px); pointer-events: none; transition: opacity .2s, transform .2s; font-size: 13px;
}
.ca-toast.is-show { opacity: 1; transform: translateY(0); }

@media (max-width: 1060px) {
    .ca-header { gap: 20px; }
    .ca-brand { width: 180px; flex-basis: 180px; }
    .ca-nav { gap: 20px; }
    .ca-nav a { font-size: 14px; }
    .ca-cats { grid-template-columns: repeat(3, 1fr); }
    .ca-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ca-hero__image { width: 65%; opacity: .88; }
    .ca .ca-hero__title { font-size: 64px; }
    .ca-footer__grid { grid-template-columns: repeat(2, 1fr); }
    .ca-buy { grid-template-columns: auto 1fr; }
    .ca-buy > .ca-btn:last-child { grid-column: 1 / -1; }
}

@media (max-width: 900px) {
    .ca-announce { height: 31px; font-size: 9px; gap: 10px; }
    .ca-header { height: 68px; gap: 10px; }
    .ca-brand { width: 140px; flex-basis: 140px; }
    .ca-actions { gap: 4px; }
    .ca-actions .ca-icon { width: 21px; height: 21px; }
    .ca-menu-toggle { display: inline-flex; border: 0; background: none; padding: 4px; color: var(--ca-ink); }
    .ca-currency__toggle { padding: 4px 6px; min-height: 30px; }
    .ca-currency__panel { position: fixed; left: 12px; right: 12px; top: 112px; width: auto; }
    .ca-nav {
        display: none; position: absolute; top: 64px; left: 0; right: 0; background: var(--ca-paper-light);
        padding: 10px 22px 22px; border-bottom: 1px solid var(--ca-line); box-shadow: var(--ca-shadow);
        align-items: stretch; flex-direction: column; gap: 0;
    }
    .ca-nav.is-open { display: flex; }
    .ca-nav a { padding: 12px 0; border-bottom: 1px solid var(--ca-line); font-size: 16px; }
    .ca-nav a:hover::after,
    .ca-nav a.is-active::after { display: none; }
    .ca-hero { min-height: 560px; align-items: flex-end; }
    .ca-hero::before { background: linear-gradient(0deg, rgba(248, 244, 235, 1) 0%, rgba(248, 244, 235, .94) 32%, rgba(248, 244, 235, .18) 78%, rgba(248, 244, 235, 0) 100%); }
    .ca-hero__image { height: 72%; width: 100%; top: 0; bottom: auto; object-position: 48% 40%; opacity: 1; }
    .ca-hero__copy { padding: 245px var(--ca-gutter) 32px; }
    .ca .ca-hero__title { font-size: 49px; max-width: 500px; }
    .ca-hero__brand { font-size: 13px; gap: 8px; letter-spacing: .12em; }
    .ca-hero__brand::before,
    .ca-hero__brand::after { width: 24px; }
    .ca .ca-hero__tagline { font-size: 28px; margin-bottom: 19px; }
    .ca-hero__actions { gap: 9px; }
    .ca-hero__actions .ca-btn { padding-inline: 16px; min-height: 44px; }
    .ca-trust { padding: 14px 17px; gap: 0; grid-template-columns: 1fr; }
    .ca-trust__item { justify-content: flex-start; padding: 12px 15px; border-right: 0; border-bottom: 1px solid #d5c9b9; }
    .ca-trust__item:last-child { border-bottom: 0; }
    .ca-trust__item .ca-icon { width: 30px; height: 30px; }
    .ca-section { padding: 45px 0; }
    .ca-section--tight { padding: 28px 0; }
    .ca-section-head { align-items: start; flex-direction: column; gap: 12px; margin-bottom: 19px; }
    .ca .ca-section-head h2 { font-size: 31px; }
    .ca-cats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .ca .ca-cat h3 { font-size: 17px; }
    .ca-grid { gap: 11px; }
    .ca-card__info { padding: 11px; }
    .ca .ca-card__title { font-size: 16px; }
    .ca .ca-card__sub { font-size: 11px; }
    .ca-card__meta { align-items: flex-start; flex-direction: column; gap: 8px; }
    .ca-price { font-size: 17px; }
    .ca-pill { font-size: 11px; }
    .ca-editorial { grid-template-columns: 1fr; }
    .ca-editorial__image { min-height: 250px; }
    .ca-editorial__copy { padding: 28px 24px 34px; }
    .ca-journal { grid-template-columns: 1fr; gap: 15px; }
    .ca-journal-card { display: grid; grid-template-columns: 35% 1fr; }
    .ca-journal-card img { height: 100%; min-height: 180px; aspect-ratio: auto; }
    .ca-journal-card__copy { padding: 15px; }
    .ca .ca-journal-card h3 { font-size: 20px; }
    .ca-footer__grid { grid-template-columns: 1fr 1fr; gap: 26px 18px; }
    .ca-footer__brand { grid-column: 1 / -1; }
    .ca-footer__brand img { width: 180px; }
    .ca-page-hero { padding: 38px 0 34px; }
    .ca .ca-page-hero h1 { font-size: 38px; }
    .ca-toolbar { align-items: flex-start; flex-direction: column; }
    .ca-shop { grid-template-columns: 1fr; gap: 20px; }
    .ca-sidebar { border-right: 0; border-bottom: 1px solid var(--ca-line); padding: 0 0 14px; }
    .ca-sidebar__group { padding-bottom: 11px; margin-bottom: 10px; }
    .ca-sidebar__links { display: flex; flex-wrap: wrap; gap: 4px 18px; }
    .ca-forms { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .ca-form-card { min-height: 220px; }
    .ca .ca-form-card h3 { font-size: 23px; }
    .ca-size { grid-template-columns: 1fr; gap: 24px; }
    .ca-steps { grid-template-columns: 1fr; }
    .ca-pdp { grid-template-columns: 1fr; gap: 24px; }
    .ca-gallery { position: static; grid-template-columns: 54px minmax(0, 1fr); gap: 8px; }
    .ca-thumbs { gap: 6px; max-height: 420px; }
    .ca-gallery__main { aspect-ratio: .92; }
    .ca-pdp__price { font-size: 27px; }
    .ca-article { grid-template-columns: 1fr; gap: 25px; }
    .ca-aside { border-left: 0; border-top: 1px solid var(--ca-line); padding: 20px 0 0; }
    .ca-contact { grid-template-columns: 1fr; gap: 20px; }
    .ca-info-cards { grid-template-columns: 1fr; }
    .ca-form__row { grid-template-columns: 1fr; }
    .ca-account-card { padding: 24px; }
    .ca-cart,
    .ca-checkout { grid-template-columns: 1fr; gap: 22px; }
    .ca-cart__summary,
    .ca-checkout__summary { position: static; }
    .ca-cart__item { grid-template-columns: 85px minmax(0, 1fr) auto; gap: 11px; }
    .ca-cart__item img { width: 85px; height: 110px; }
    .ca .ca-cart__item h3 { font-size: 17px; }
    .ca-form__row { grid-template-columns: 1fr; }
    .ca-visually-hidden { position: absolute !important; }
    .ca-sort select { min-width: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .ca *,
    .ca *::before,
    .ca *::after { transition: none !important; }
}

/* Currency chrome island → Chang'an look (system island replaces custom markup) */
.ca [data-weline-chrome-island="currency-switcher"] .w-currency-switcher__trigger {
    display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--ca-line); background: transparent;
    padding: 6px 10px; font-size: 12px; letter-spacing: .06em; color: var(--ca-ink); min-height: 34px; border-radius: 0; box-shadow: none;
}
.ca [data-weline-chrome-island="currency-switcher"] .w-currency-switcher__trigger:hover { border-color: var(--ca-ink); }
.ca [data-weline-chrome-island="currency-switcher"] .w-currency-switcher__panel {
    background: var(--ca-paper-light); border: 1px solid var(--ca-line); box-shadow: var(--ca-shadow-lift); border-radius: 0; color: var(--ca-ink);
}
.ca [data-weline-chrome-island="currency-switcher"] .w-currency-switcher__option:hover,
.ca [data-weline-chrome-island="currency-switcher"] .w-currency-switcher__option.is-active { background: var(--ca-paper-deep); color: var(--ca-red); }
.ca [data-weline-chrome-island="currency-switcher"] .w-field { border-color: var(--ca-line); }
body.theme-layout-product {
    --ca-paper: #f8f4eb; --ca-paper-deep: #eee5d7; --ca-paper-light: #fcfaf4;
    --ca-ink: #24211e; --ca-ink-soft: #595148; --ca-muted: #665c53; --ca-line: #dfd4c4;
    --ca-red: #b63831; --ca-red-dark: #982c27; --ca-on-red: #ffffff;
    --ca-serif: Georgia, "Times New Roman", "Noto Serif SC", "Songti SC", serif;
    --ca-sans: Arial, "Helvetica Neue", "PingFang SC", "Microsoft YaHei", sans-serif;
    background: var(--ca-paper) url("/static/Weline/hanfu/frontend/assets/images/changan/paper-texture.svg") repeat;
    background-size: 240px 240px;
    color: var(--ca-ink);
}

/* PDP: product-native-detail → Chang'an look (shell kept for widget JS contract) */
body.theme-layout-product .product-native-detail { display: grid; grid-template-columns: var(--pdp-main-columns, minmax(0,1.02fr) minmax(0,.98fr)); gap: var(--pdp-main-gap, 44px); align-items: start; font-family: var(--ca-sans); color: var(--ca-ink); }
.ca .product-native-detail { display: grid; grid-template-columns: var(--pdp-main-columns, minmax(0,1.02fr) minmax(0,.98fr)); gap: var(--pdp-main-gap, 44px); align-items: start; font-family: var(--ca-sans); color: var(--ca-ink); }
body.theme-layout-product .product-native-detail__hero-grid, .ca .product-native-detail__hero-grid { display: contents; }
/* 详情（技术细节 / 关于该商品）是 hero-grid 之后的第三个网格项；默认会落进左列，
   这里让它跨满两列，脱离主信息双栏容器。 */
body.theme-layout-product .product-native-detail__detail-sections, .ca .product-native-detail__detail-sections { grid-column: 1 / -1; }
body.theme-layout-product .product-native-detail__media-column .product-native-detail__gallery, .ca .product-native-detail__media-column .product-native-detail__gallery { display: grid; grid-template-columns: 78px minmax(0,1fr); gap: 12px; position: sticky; top: 18px; }
body.theme-layout-product .product-native-detail__thumbs, .ca .product-native-detail__thumbs { display: flex; flex-direction: column; gap: 9px; max-height: 640px; overflow: auto; }
body.theme-layout-product .product-native-detail__thumb, .ca .product-native-detail__thumb { padding: 0; background: none; border: 1px solid transparent; }
body.theme-layout-product .product-native-detail__thumb.is-active, .ca .product-native-detail__thumb.is-active { border-color: #4d453c; }
body.theme-layout-product .product-native-detail__thumb img, .ca .product-native-detail__thumb img { width: 100%; aspect-ratio: 3/3.5; object-fit: cover; }
/* 画框比例由布局 --pdp-gallery-frame-ratio 固定；图片填满画框，不再自带 aspect-ratio。 */
body.theme-layout-product .product-native-detail__primary-image, .ca .product-native-detail__primary-image { width: 100%; height: 100%; object-fit: cover; background: #eae1d5; border-radius: 0; }
/* PDP 标题：全主题唯一声明处（默认层见 Product/view/statics/css/widgets/product-native-detail.css）。
   尺寸走 --hanfu-title-size（2rem=32px），行高 1.35；勿在 commerce/ui-sot/布局再定义 font-size。 */
body.theme-layout-product .product-native-detail__title, .hanfu-atelier .product-native-detail__title, .ca .product-native-detail__title { font-family: var(--ca-serif); font-weight: 400; font-size: clamp(1.5rem, 2.2vw, var(--hanfu-title-size, 2rem)); line-height: 1.35; margin: 0 0 var(--weline-space-4); color: var(--ca-ink); letter-spacing: 0; max-width: 28ch; overflow-wrap: anywhere; }
body.theme-layout-product .product-native-detail__brand, .ca .product-native-detail__brand { color: var(--ca-muted); font-size: 13px; }
body.theme-layout-product .product-native-detail__bullets, .ca .product-native-detail__bullets { color: var(--ca-ink-soft); font-size: 14px; line-height: 1.8; max-width: 520px; }
body.theme-layout-product .product-native-detail__price, .ca .product-native-detail__price { font-family: var(--ca-serif); font-size: 30px; color: var(--ca-ink); }
body.theme-layout-product .product-native-detail__price-label, .ca .product-native-detail__price-label,
body.theme-layout-product .product-native-detail__meta-row, .ca .product-native-detail__meta-row { color: var(--ca-muted); font-size: 12px; }
body.theme-layout-product .product-native-detail__buybox, .ca .product-native-detail__buybox,
body.theme-layout-product .product-native-detail__purchase-box, .ca .product-native-detail__purchase-box { background: none; border: 0; box-shadow: none; padding: 0; }
body.theme-layout-product .product-native-detail__actions .product-native-detail__add, .ca .product-native-detail__actions .product-native-detail__add { background: var(--ca-red) !important; border: 1px solid var(--ca-red) !important; color: var(--ca-on-red) !important; min-height: 48px; padding: 0 25px; border-radius: 0; font-family: var(--ca-sans); }
body.theme-layout-product .product-native-detail__actions .product-native-detail__add:hover, .ca .product-native-detail__actions .product-native-detail__add:hover { background: var(--ca-red-dark) !important; border-color: var(--ca-red-dark) !important; }
body.theme-layout-product .product-native-detail__buy-now, .ca .product-native-detail__buy-now { background: transparent !important; border: 1px solid var(--ca-ink) !important; color: var(--ca-ink) !important; min-height: 48px; border-radius: 0; }
body.theme-layout-product .product-native-detail__buy-now:hover, .ca .product-native-detail__buy-now:hover { background: var(--ca-ink) !important; color: var(--ca-on-red) !important; }
body.theme-layout-product .product-native-detail__qty-select, .ca .product-native-detail__qty-select,
body.theme-layout-product .product-native-detail__qty-controls button, .ca .product-native-detail__qty-controls button { border-color: var(--ca-line); border-radius: 0; color: var(--ca-ink); }
body.theme-layout-product .product-native-detail__option-row .is-selected, .ca .product-native-detail__option-row .is-selected { background: #393633 !important; color: var(--ca-on-red) !important; border-color: #393633 !important; border-radius: 0; }
body.theme-layout-product .product-native-detail__description, .ca .product-native-detail__description { border-top: 1px solid var(--ca-line); margin-top: 48px; padding-top: 24px; }
body.theme-layout-product .product-native-detail__description-body, .ca .product-native-detail__description-body { font-family: var(--ca-sans); color: var(--ca-ink-soft); line-height: 1.85; max-width: none; }
/* 模块默认给 lead 段落 48ch / 普通段落 58ch 阅读行宽；详情已改为通栏，行宽上限会让正文缩在左侧，这里去掉。 */
body.theme-layout-product .product-native-detail__description-body .weline-detail-prose.weline-detail-prose--lead > p,
.ca .product-native-detail__description-body .weline-detail-prose.weline-detail-prose--lead > p { max-width: none; }
body.theme-layout-product .product-native-detail__shipping-hint, .ca .product-native-detail__shipping-hint,
body.theme-layout-product .product-native-detail__delivery, .ca .product-native-detail__delivery { color: #5d554c; font-size: 12px; }
body.theme-layout-product .product-native-detail__secure, .ca .product-native-detail__secure,
body.theme-layout-product .product-native-detail__divider, .ca .product-native-detail__divider { border-color: var(--ca-line); }
@media (max-width: 760px) {
  body.theme-layout-product .product-native-detail { grid-template-columns: 1fr; gap: 24px; }
  .ca .product-native-detail { grid-template-columns: 1fr; gap: 24px; }
  body.theme-layout-product .product-native-detail__media-column .product-native-detail__gallery, .ca .product-native-detail__media-column .product-native-detail__gallery { position: static; grid-template-columns: 54px minmax(0,1fr); gap: 8px; }
  body.theme-layout-product .product-native-detail__price, .ca .product-native-detail__price { font-size: 27px; }
}
/* Cart / checkout / account: module islands → Chang'an paper look */
body.theme-layout-cart,
body.theme-layout-checkout,
body.theme-layout-account {
    --ca-paper: #f8f4eb; --ca-paper-deep: #eee5d7; --ca-paper-light: #fcfaf4; --ca-paper-note: #eee6d9;
    --ca-ink: #24211e; --ca-ink-soft: #595148; --ca-muted: #665c53; --ca-line: #dfd4c4; --ca-line-strong: #cfc3b2;
    --ca-red: #b63831; --ca-red-dark: #982c27; --ca-on-red: #ffffff;
    --ca-serif: Georgia, "Times New Roman", "Noto Serif SC", "Songti SC", serif;
    --ca-sans: Arial, "Helvetica Neue", "PingFang SC", "Microsoft YaHei", sans-serif;
    background: var(--ca-paper) url("/static/Weline/hanfu/frontend/assets/images/changan/paper-texture.svg") repeat;
    background-size: 240px 240px;
    color: var(--ca-ink);
}
/* Cart shell */
body.theme-layout-cart .weline-cart-shell { background: rgba(255,253,248,.6); border: 1px solid var(--ca-line); border-radius: 0; }
body.theme-layout-cart .weline-cart-shell__checkout { background: var(--ca-red); border-color: var(--ca-red); color: var(--ca-on-red); border-radius: 0; min-height: 48px; }
body.theme-layout-cart .weline-cart-shell__checkout:hover { background: var(--ca-red-dark); border-color: var(--ca-red-dark); }
body.theme-layout-cart .weline-cart-shell__summary { background: var(--ca-paper-note); border: 1px solid var(--ca-line); border-radius: 0; }
body.theme-layout-cart .weline-cart-shell__line { border-color: var(--ca-line); }
body.theme-layout-cart .weline-cart-shell__line-title { font-family: var(--ca-serif); color: var(--ca-ink); }
body.theme-layout-cart .weline-cart-shell__empty-title,
body.theme-layout-cart .weline-cart-shell__heading h1 { font-family: var(--ca-serif); color: var(--ca-ink); }
body.theme-layout-cart .weline-cart-shell__continue { color: var(--ca-ink); border-color: var(--ca-line); border-radius: 0; }
body.theme-layout-cart .weline-cart-shell__remove,
body.theme-layout-cart .weline-cart-shell__line-remove { color: var(--ca-muted); }
/* Checkout form fields */
body.theme-layout-checkout input,
body.theme-layout-checkout select,
body.theme-layout-checkout textarea,
body.theme-layout-account input,
body.theme-layout-account select { border: 1px solid var(--ca-line); background: rgba(255,253,248,.7); color: var(--ca-ink); border-radius: 0; }
body.theme-layout-checkout .btn-primary,
body.theme-layout-checkout button[class*="primary"],
body.theme-layout-account .btn-primary { background: var(--ca-red); border-color: var(--ca-red); color: var(--ca-on-red); border-radius: 0; min-height: 48px; }
body.theme-layout-checkout .btn-primary:hover,
body.theme-layout-account .btn-primary:hover { background: var(--ca-red-dark); border-color: var(--ca-red-dark); }
body.theme-layout-checkout h1, body.theme-layout-checkout h2,
body.theme-layout-account h1, body.theme-layout-account h2 { font-family: var(--ca-serif); color: var(--ca-ink); font-weight: 400; }

/* Products listing (PLP) / search results → Chang'an look */
body.theme-layout-products,
body.theme-layout-search {
    --ca-paper: #f8f4eb; --ca-paper-deep: #eee5d7; --ca-paper-light: #fcfaf4; --ca-paper-note: #eee6d9;
    --ca-ink: #24211e; --ca-ink-soft: #595148; --ca-muted: #665c53; --ca-line: #dfd4c4; --ca-line-strong: #cfc3b2;
    --ca-red: #b63831; --ca-red-dark: #982c27; --ca-on-red: #ffffff;
    --ca-serif: Georgia, "Times New Roman", "Noto Serif SC", "Songti SC", serif;
    --ca-sans: Arial, "Helvetica Neue", "PingFang SC", "Microsoft YaHei", sans-serif;
    background: var(--ca-paper) url("/static/Weline/hanfu/frontend/assets/images/changan/paper-texture.svg") repeat;
    background-size: 240px 240px;
    color: var(--ca-ink);
}
body.theme-layout-products h1, body.theme-layout-products h2, body.theme-layout-products h3,
body.theme-layout-search h1, body.theme-layout-search h2, body.theme-layout-search h3 { font-family: var(--ca-serif); font-weight: 400; color: var(--ca-ink); }
body.theme-layout-products .hanfu-shop-plp { background: none; }
body.theme-layout-products .hanfu-shop-plp__banner { background: linear-gradient(115deg, rgba(239,230,216,.8), rgba(249,246,238,.25)); border: 0; border-bottom: 1px solid rgba(125,103,78,.16); border-radius: 0; }
body.theme-layout-products .hanfu-shop-plp__banner-title { font-family: var(--ca-serif); color: var(--ca-ink); }
body.theme-layout-products .products-layout__toolbar,
body.theme-layout-products .products-layout__sidebar { border-color: var(--ca-line); color: var(--ca-ink-soft); }
body.theme-layout-products .products-layout__filter-toggle { border-color: var(--ca-line); color: var(--ca-ink); border-radius: 0; }
body.theme-layout-products .product-storefront__card,
body.theme-layout-products [class*="product-card"] { background: #fcfaf5; border: 1px solid rgba(125,103,78,.15); border-radius: 8px; }
body.theme-layout-products .product-storefront__title a,
body.theme-layout-products [class*="product-card"] h3 a { font-family: var(--ca-serif); color: var(--ca-ink); }
body.theme-layout-products [class*="price"], body.theme-layout-products .product-storefront__price { font-family: var(--ca-serif); color: var(--ca-ink); }
body.theme-layout-products .products-layout__sidebar a { color: var(--ca-muted); }
body.theme-layout-products .products-layout__sidebar a:hover { color: var(--ca-red); }
body.theme-layout-search .search-input,
body.theme-layout-search input[type="search"] { border: 0; border-bottom: 1px solid #9e9283; background: transparent; color: var(--ca-ink); border-radius: 0; }

/* Blog list + post detail → Chang'an look */
body.hanfu-atelier[class*="blog"],
body[class*="theme-layout-blog"] {
    --ca-paper: #f8f4eb; --ca-ink: #24211e; --ca-ink-soft: #595148; --ca-muted: #665c53; --ca-line: #dfd4c4;
    --ca-red: #b63831; --ca-red-dark: #982c27; --ca-on-red: #ffffff;
    --ca-serif: Georgia, "Times New Roman", "Noto Serif SC", "Songti SC", serif;
    --ca-sans: Arial, "Helvetica Neue", "PingFang SC", "Microsoft YaHei", sans-serif;
}
body.hanfu-atelier[class*="blog"] .blog-post-detail h1,
body.hanfu-atelier[class*="blog"] .blog-post-detail h2,
body.hanfu-atelier[class*="blog"] .blog-post-detail h3 { font-family: var(--ca-serif); font-weight: 400; color: var(--ca-ink); }
body.hanfu-atelier[class*="blog"] .blog-post-detail p,
body.hanfu-atelier[class*="blog"] .post-content p { color: var(--ca-ink-soft); line-height: 1.95; }
body.hanfu-atelier[class*="blog"] .blog-post-detail a { color: var(--ca-red); }
body.hanfu-atelier[class*="blog"] [class*="post-card"],
body.hanfu-atelier[class*="blog"] [class*="article-card"] { background: rgba(255,253,247,.75); border: 1px solid var(--ca-line); border-radius: 0; }

/* 404 / error page → Chang'an look (already has hanfu-not-found shell) */
body[class*="not-found"],
body[class*="error"] {
    --ca-paper: #f8f4eb; --ca-ink: #24211e; --ca-ink-soft: #595148; --ca-muted: #665c53;
    --ca-line: #dfd4c4; --ca-red: #b63831;
    --ca-serif: Georgia, "Times New Roman", "Noto Serif SC", serif;
    background: var(--ca-paper) url("/static/Weline/hanfu/frontend/assets/images/changan/paper-texture.svg") repeat;
    background-size: 240px 240px;
    color: var(--ca-ink);
}

/* ---------- Header chrome: currency + language islands (single source of truth) ---------- */
/* 框架会把货币位置换成官方 island 标记，因此两处都按 island 的 DOM 类名皮肤化。 */
.ca-currency-slot,
.ca-lang {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
}

.ca [data-weline-chrome-island="currency-switcher"] .w-currency-switcher,
.ca-lang .w-language-switcher {
    display: inline-flex;
    align-items: center;
    position: relative;
}

.ca [data-weline-chrome-island="currency-switcher"] .w-currency-switcher .w-currency-switcher__trigger.w-button,
.ca-lang .w-language-switcher .w-language-switcher__trigger.w-button,
.ca-lang .w-language-switcher .w-language-switcher__trigger {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 4px;
    min-height: 34px;
    padding: 0 8px;
    border: 1px solid var(--ca-line) !important;
    border-radius: 0;
    background: transparent !important;
    color: var(--ca-ink) !important;
    box-shadow: none !important;
    font-family: var(--ca-sans);
    font-size: 12px;
    letter-spacing: .04em;
    line-height: 1;
    white-space: nowrap;
}

.ca [data-weline-chrome-island="currency-switcher"] .w-currency-switcher .w-currency-switcher__trigger.w-button:hover,
.ca-lang .w-language-switcher .w-language-switcher__trigger.w-button:hover,
.ca-lang .w-language-switcher .w-language-switcher__trigger:hover {
    border-color: var(--ca-ink) !important;
    background: transparent !important;
    color: var(--ca-red) !important;
}

.ca [data-weline-chrome-island="currency-switcher"] .w-currency-switcher__current,
.ca [data-weline-chrome-island="currency-switcher"] .w-currency-switcher__code,
.ca-lang .w-language-switcher__current {
    display: inline-block;
    font-size: inherit;
    line-height: 1;
    color: inherit;
}

.ca [data-weline-chrome-island="currency-switcher"] .w-currency-switcher__trigger svg,
.ca-lang .w-language-switcher__trigger svg {
    width: 12px;
    height: 12px;
    flex: 0 0 auto;
    color: inherit;
}

.ca [data-weline-chrome-island="currency-switcher"] .w-currency-switcher__panel,
.ca-lang .w-language-switcher__menu {
    background: var(--ca-paper-light);
    border: 1px solid var(--ca-line);
    border-radius: 0;
    box-shadow: var(--ca-shadow-lift);
    color: var(--ca-ink);
    min-width: 240px;
    z-index: 60;
}

.ca [data-weline-chrome-island="currency-switcher"] .w-currency-switcher__option:hover,
.ca [data-weline-chrome-island="currency-switcher"] .w-currency-switcher__option.is-active,
.ca-lang .w-language-switcher__menu .w-menu__item:hover,
.ca-lang .w-language-switcher__menu .w-menu__item.is-active {
    background: var(--ca-paper-deep);
    color: var(--ca-red);
}

.ca [data-weline-chrome-island="currency-switcher"] .w-field,
.ca-lang .w-language-switcher__search {
    border: 1px solid var(--ca-line);
    border-radius: 0;
    background: rgba(255, 253, 248, .7);
    color: var(--ca-ink);
}

/* 移动抽屉内的快捷入口（桌面隐藏） */
.ca-nav__tools { display: none; }

@media (max-width: 1180px) {
    .ca [data-weline-chrome-island="currency-switcher"] .w-currency-switcher__code { display: none; }
    .ca-lang .w-language-switcher__current { max-width: 84px; overflow: hidden; text-overflow: ellipsis; }
}

@media (max-width: 900px) {
    .ca-lang .w-language-switcher__current,
    .ca-lang .w-language-switcher__flag,
    .ca-lang .w-language-switcher__trigger svg { display: none; }
    .ca [data-weline-chrome-island="currency-switcher"] .w-currency-switcher__trigger svg { display: none; }
    .ca-lang .w-language-switcher__trigger::before {
        content: "";
        width: 18px;
        height: 18px;
        flex: 0 0 auto;
        background: url("/static/Weline/hanfu/frontend/assets/icons/changan/globe.svg") center / contain no-repeat;
    }
    .ca-header { height: 64px; gap: 4px; }
    .ca-brand { width: 116px; flex-basis: 116px; }
    .ca-actions { gap: 0; margin-left: auto; }
    .ca-actions .ca-icon-link { padding: 6px; }
    .ca [data-weline-chrome-island="currency-switcher"] .w-currency-switcher .w-currency-switcher__trigger.w-button,
    .ca-lang .w-language-switcher .w-language-switcher__trigger.w-button,
    .ca-lang .w-language-switcher .w-language-switcher__trigger {
        height: 30px;
        min-height: 30px;
        padding: 0 6px;
        justify-content: center;
        border-color: transparent !important;
        gap: 3px;
    }
    .ca [data-weline-chrome-island="currency-switcher"] .w-currency-switcher__panel,
    .ca-lang .w-language-switcher__menu {
        position: fixed;
        left: 12px;
        right: 12px;
        top: 96px;
        width: auto;
        min-width: 0;
        max-height: 60vh;
        overflow: auto;
    }
    .ca-nav__tools {
        display: flex;
        flex-direction: column;
        gap: 0;
        margin-top: 8px;
        border-top: 1px solid var(--ca-line);
        padding-top: 8px;
    }
    .ca-nav__tools a { padding: 12px 0; border-bottom: 1px solid var(--ca-line); font-size: 15px; color: var(--ca-muted); }
    .ca-nav__tools a:last-child { border-bottom: 0; }
}

@media (max-width: 480px) {
    .ca-brand { width: 104px; flex-basis: 104px; }
    .ca-actions .ca-icon-link--account { display: none; }
    .ca-announce { gap: 6px; font-size: 8.5px; letter-spacing: 0; }
    .ca-announce .ca-announce__dot { font-size: 12px; }
}

@media (max-width: 360px) {
    .ca-brand { width: 92px; flex-basis: 92px; }
    .ca-actions .ca-icon-link--search { display: none; }
    .ca-header { gap: 2px; }
    .ca-menu-toggle { padding: 2px; }
    .ca-actions .ca-icon-link { padding: 5px; }
    .ca-announce span:nth-child(n+5) { display: none; }
}

/* ---------- 汉堡抽屉：分类树 ---------- */
.ca-nav__cats { display: none; }
@media (max-width: 900px) {
    .ca-nav__cats {
        display: flex;
        flex-direction: column;
        margin-top: 8px;
        border-top: 1px solid var(--ca-line);
        padding-top: 8px;
        max-height: 46vh;
        overflow: auto;
    }
    .ca-nav__cats-title {
        margin: 4px 0 2px;
        font-size: 11px;
        letter-spacing: .18em;
        text-transform: uppercase;
        color: var(--ca-muted);
    }
    .ca-nav__cat {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 11px 0;
        border-bottom: 1px solid var(--ca-line);
        font-size: 15px;
        color: var(--ca-ink);
    }
    .ca-nav__cat:last-child { border-bottom: 0; }
    .ca-nav__cat--group { font-weight: 600; }
    .ca-nav__cat--group::after {
        content: "";
        flex: 1 1 auto;
        height: 1px;
        background: var(--ca-line);
        opacity: .55;
    }
    .ca-nav__cat--child {
        padding-left: 14px;
        font-size: 13.5px;
        color: var(--ca-ink-soft);
    }
    .ca-nav__cat--child::before {
        content: "·";
        color: var(--ca-red);
        font-weight: 700;
    }
}