:root{color-scheme:light;--ink:#2a1e30;--muted:#625862;--paper:#f9f7f1;--line:#dfd8d0;--lilac:#e9def7;--purple:#765394;--white:#fffdfa;--max:1240px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--paper);font:15px/1.65 "PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif}h1,h2,h3,p,figure{margin:0}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit;color:inherit}button{cursor:pointer}[hidden]{display:none!important}:focus-visible{outline:3px solid #8956b5;outline-offset:4px}.shell{width:min(var(--max),calc(100% - 96px));margin-inline:auto}.skip{position:fixed;left:1rem;top:1rem;z-index:5;background:white;padding:10px;transform:translateY(-200%)}.skip:focus{transform:none}section[id]{scroll-margin-top:86px}.header{position:sticky;top:0;z-index:2;background:#f9f7f1f5;border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}.nav{height:76px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px}.brand{display:inline-flex;align-items:center;gap:10px;justify-self:start;font-weight:800;font-size:17px;line-height:1.25;white-space:nowrap}.brand small{display:block;font-size:8px;letter-spacing:.16em;margin-top:4px;font-weight:700}.nav nav{display:flex;gap:36px;font-size:14px;font-weight:650}.nav nav a:hover,.text-link:hover{color:var(--purple)}.nav-cta{justify-self:end;border:1px solid var(--ink);padding:8px 17px;border-radius:40px;font-size:13px;font-weight:700;white-space:nowrap}.nav-cta:hover{background:var(--lilac)}.nav-cta span{margin-left:8px}
.hero{min-height:570px;display:grid;grid-template-columns:1fr 1.15fr;gap:64px;align-items:center;padding-block:34px 44px}.hero-copy{padding:12px 0 0}.eyebrow{display:flex;align-items:center;gap:9px;font-size:11px;line-height:1.5;letter-spacing:.15em;font-weight:800;color:var(--purple)}.eyebrow i{display:inline-block;width:8px;height:8px;background:#ad85cf;border-radius:50%}.eyebrow span{opacity:.6}.hero h1{font-size:clamp(48px,5.75vw,86px);line-height:1.12;letter-spacing:-.065em;margin:21px 0 19px;font-weight:900}.hero h1 span,.section-heading h2 span,.about h2 span,.contact h2 span{color:#9565b9}.intro{font-size:16px;max-width:350px;color:var(--muted);line-height:1.9}.button{display:inline-flex;align-items:center;justify-content:center;gap:21px;padding:11px 20px;min-height:46px;border:1px solid transparent;border-radius:5px;font-weight:750;font-size:14px}.primary{background:var(--ink);color:#fffdfd}.primary:hover{background:#4d325f}.secondary{border-color:#9c8ea6;background:transparent}.secondary:hover{background:#ede5f5}.hero .button{margin-top:25px}
.catalog{background:#f0ece6;border-block:1px solid var(--line);padding:53px 0 68px}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin:9px 0 25px}.section-heading h2,.about h2,.contact h2{font-size:clamp(35px,4.3vw,59px);line-height:1.16;letter-spacing:-.055em;font-weight:900}.section-heading p,.about p:not(.eyebrow),.contact p:not(.eyebrow){color:var(--muted)}.section-heading p{padding-bottom:4px}.controls{display:flex;justify-content:space-between;align-items:center;gap:15px}.search{display:flex;gap:8px;align-items:center;background:var(--white);border:1px solid #d4cbd2;border-radius:5px;padding:0 10px}.search svg{width:17px;height:17px;stroke:var(--muted);stroke-width:1.8;fill:none;flex:none}.search input{border:0;background:transparent;padding:8px 0;width:177px;min-width:0}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.card{display:block;width:100%;border:1px solid var(--line);padding:0;text-align:left;background:var(--white);border-radius:8px;overflow:hidden;transition:border-color .2s,transform .2s}.card:hover{border-color:#a77acb;transform:translateY(-3px)}.card-body{padding:15px 17px 17px;display:grid;grid-template-columns:1fr auto;align-items:end;gap:8px}.card-body small{display:block;font-size:11px;color:var(--purple);letter-spacing:.08em;font-weight:750}.card-body strong{display:block;font-size:18px;line-height:1.4;margin-top:4px}.card-arrow{width:33px;height:33px;display:grid;place-items:center;border-radius:50%;background:#eee6f7}.empty{padding:50px 15px;text-align:center;border:1px dashed #c7bbc9}.empty .button{margin-top:12px}
.about{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;padding-block:82px}.about h2,.contact h2{margin:12px 0 16px}.about p:not(.eyebrow),.contact p:not(.eyebrow){max-width:380px;line-height:1.9}.text-link{font-size:14px;font-weight:800}.about .text-link{display:inline-block;margin-top:20px;border-bottom:1px solid;padding-bottom:2px}.contact{padding:62px 0;background:#eee6f4;border-block:1px solid #ded1e6}.contact-inner{display:grid;grid-template-columns:1fr 1.15fr;gap:54px}.contact form{display:grid;gap:13px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:13px}.contact label{display:grid;gap:5px;font-size:13px;font-weight:700;min-width:0}.contact input,.contact select,.contact textarea{width:100%;min-width:0;background:#fffcff;border:1px solid #cbbdd1;border-radius:5px;padding:9px 11px;font-weight:400}.contact textarea{resize:vertical}.form-actions{display:flex;flex-wrap:wrap;gap:8px}#form-status{font-size:13px;min-height:20px}
dialog{max-width:min(890px,calc(100vw - 30px));max-height:calc(100dvh - 30px);padding:0;border:0;border-radius:12px;color:var(--ink);background:var(--paper);width:890px;overflow:auto}dialog::backdrop{background:#211829b8}body:has(dialog[open]){overflow:hidden}.close{z-index:1;position:absolute;right:11px;top:11px;border:1px solid var(--line);background:var(--white);border-radius:50%;width:37px;height:37px;font-size:23px;line-height:1}.detail-copy{padding:53px 30px 30px}.detail-copy h2{font-size:34px;line-height:1.2;margin:8px 0 14px}.detail-copy p:not(.eyebrow){color:var(--muted)}.detail-copy dl{margin:23px 0}.detail-copy dl div{display:grid;grid-template-columns:74px 1fr;gap:10px;padding:8px 0;border-top:1px solid var(--line)}.detail-copy dt{font-weight:800}.detail-copy dd{margin:0;color:var(--muted)}
@media(max-width:940px){.shell{width:calc(100% - 60px)}.hero{gap:30px;min-height:auto}.about{gap:35px}.contact-inner{gap:30px}}
@media(max-width:680px){.shell{width:calc(100% - 32px)}.nav{height:62px;grid-template-columns:1fr auto;gap:10px}.nav nav{display:none}.nav-cta{padding:6px 10px}.hero{grid-template-columns:1fr;gap:19px;padding-block:20px 26px}.hero h1{font-size:clamp(44px,10vw,67px);margin:13px 0}.intro{font-size:14px}.hero .button{margin-top:15px}.catalog{padding:34px 0 44px}.section-heading{align-items:start;flex-direction:column;gap:7px;margin-bottom:16px}.controls{align-items:stretch;flex-direction:column;gap:9px}.search input{width:100%}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.card-body{padding:9px;gap:5px}.card-body strong{font-size:14px}.card-arrow{width:25px;height:25px}.about,.contact-inner{grid-template-columns:1fr;gap:24px}.about{padding-block:42px}.contact{padding:37px 0}.detail-copy{padding:18px}.detail-copy h2{font-size:26px}.detail-copy dl{margin:13px 0}}
@media(max-width:350px){.form-row{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}

/* Brand introduction */
.hero-band {
  color: #fffaf2;
  background: radial-gradient(ellipse at 26% 100%, #4c3556, #281d32 61%);
}
.hero-band .hero { padding-block: 40px; }
.hero-band .eyebrow { color: #e7c9fa; }
.hero-band h1 span { color: #d7a9ef; }
.hero-band .intro { color: #eee2f0; max-width: 430px; }
.hero-copy h1, .hero-copy .intro, .about-copy h2, .about-copy p {
  white-space: pre-line;
  overflow-wrap: anywhere;
}
.announcement {
  color: #3c2845;
  background: #eee1f1;
  border-block: 1px solid #dfcde5;
}
.announcement[hidden] { display: none; }
.announcement-inner { display: flex; align-items: center; gap: 12px; min-height: 54px; }
.announcement-window { flex: 1; min-width: 0; overflow: hidden; }
.announcement-track {
  display: flex;
  width: max-content;
  min-width: 200%;
  animation: announcement-scroll 24s linear infinite;
}
.announcement-track span {
  flex: 1 0 auto;
  min-width: 50%;
  padding-inline: 1.5rem;
  text-align: center;
  white-space: nowrap;
  font-weight: 700;
}
.announcement-track.is-paused, .announcement-window:hover .announcement-track { animation-play-state: paused; }
.announcement button {
  flex: none;
  padding: 6px 10px;
  border: 1px solid #8a6e94;
  border-radius: 6px;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 12px;
  cursor: pointer;
}
@keyframes announcement-scroll { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
  .announcement-track { display: block; width: auto; min-width: 0; animation: none; }
  .announcement-track span { display: block; padding-block: 8px; white-space: normal; overflow-wrap: anywhere; }
  .announcement-track span[aria-hidden], .announcement button { display: none; }
}
.hero-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.hero-band .primary { background: #f4e6fb; color: #2b1d35; }
.hero-band .primary:hover { background: #e7c7f7; }
.hero-band .secondary { color: #fffaf2; border-color: #bca4c5; }
.hero-band .secondary:hover { background: #4d365a; }

/* Product center */
.catalog { background: #fbfaf7; padding-block: 60px 76px; }
.catalog-kicker {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 12px;
  color: #70636d;
  font-weight: 650;
  letter-spacing: .08em;
}
.catalog-kicker span {
  font-variant-numeric: tabular-nums;
  color: #fffaf4;
  background: #403044;
  border-radius: 4px;
  padding: 1px 6px;
  letter-spacing: .02em;
}
.catalog .section-heading { margin: 11px 0 27px; }
.catalog .section-heading h2 { font-size: clamp(37px, 4.4vw, 60px); letter-spacing: -.055em; }
.catalog .section-heading p { font-size: 14px; }
.filters {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 13px;
  margin-bottom: 31px;
}
.filter {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
  min-height: 109px;
  padding: 16px 19px;
  border: 1px solid #ded7d1;
  border-radius: 10px;
  background: #f7f4ef;
  text-align: left;
  transition: background .18s, border-color .18s, transform .18s;
}
.filter:hover { background: #eee8ed; border-color: #ad99b1; transform: translateY(-2px); }
.filter[aria-pressed="true"] {
  border-color: #36263c;
  background: #36263c;
  color: #fffcf7;
}
.filter-copy { display: grid; gap: 5px; }
.filter-copy strong { font-size: clamp(15px, 1.55vw, 21px); line-height: 1.35; }
.filter-copy > span { font-size: 12px; color: #6b5c68; }
.filter-icon {
  width: clamp(29px, 3.5vw, 48px);
  flex: none;
  stroke: #75577a;
  stroke-width: 1.25;
  stroke-linecap: round;
  stroke-linejoin: round;
  fill: none;
}
.filter[aria-pressed="true"] .filter-copy > span,
.filter[aria-pressed="true"] .filter-icon { color: #ead9ed; stroke: #e4c9e9; }
.controls {
  border-top: 1px solid #e0dad4;
  padding-top: 15px;
  margin-bottom: 15px;
}
.listing-title { display: flex; align-items: baseline; gap: 11px; }
.listing-title h3 { font-size: 19px; }
.count { color: var(--muted); font-size: 12px; }
.card { border-radius: 10px; }
.card-body { min-height: 78px; }
.cooperation { padding-block: 54px; background: #f0ece6; border-top: 1px solid var(--line); }
.steps {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 0 0 21px;
  padding: 0;
}
.steps li { padding: 19px; background: var(--white); border: 1px solid var(--line); border-radius: 9px; }
.steps span { color: var(--purple); font-size: 12px; font-weight: 800; }
.steps h3 { font-size: 20px; margin: 5px 0; }
.steps p { color: var(--muted); }
.contact form { padding: 20px; background: #f9f5fc; border: 1px solid #d9cce4; border-radius: 10px; }
.faq { display: grid; grid-template-columns: .7fr 1.3fr; gap: 40px; padding-block: 60px; }
.faq h2 { font-size: clamp(32px, 3.8vw, 52px); line-height: 1.18; margin-top: 10px; }
.faq h2 span { color: #9565b9; }
.faq details { border-top: 1px solid var(--line); padding: 12px 0; }
.faq details:last-child { border-bottom: 1px solid var(--line); }
.faq summary { cursor: pointer; font-weight: 750; }
.faq details p { color: var(--muted); padding: 7px 0 2px; }
.footer { background: #2a1e30; color: #f8edf8; }
.footer-inner { display: grid; grid-template-columns: 1fr auto 1fr; gap: 15px; align-items: center; padding-block: 24px 16px; }
.footer nav { display: flex; gap: 16px; font-size: 13px; }
.footer .text-link { justify-self: end; }
.footer a:hover { color: #e9bfed; }
.footer p { grid-column: 1 / -1; color: #dfcde1; border-top: 1px solid #705778; padding-top: 10px; font-size: 12px; }
@media (max-width: 680px) {
  .hero-band .hero { padding-block: 24px; }
  .catalog { padding-block: 37px 45px; }
  .catalog .section-heading { margin-bottom: 18px; }
  .filters { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-bottom: 19px; }
  .filter { min-height: 78px; padding: 10px; }
  .filter-copy { gap: 3px; }
  .filter-copy > span { font-size: 11px; }
  .card-body { min-height: 65px; }
  .cooperation, .faq { padding-block: 34px; }
  .steps, .faq { grid-template-columns: 1fr; gap: 9px; }
  .steps li { padding: 13px; }
  .steps h3 { font-size: 17px; }
  .contact form { padding: 12px; }
  .footer-inner { grid-template-columns: 1fr auto; }
  .footer nav { grid-row: 2; grid-column: 1 / -1; flex-wrap: wrap; }
}

.brand-mark { display: block; flex: none; }
.nav .brand { white-space: normal; }
.card-body { min-height: 120px; align-items: center; }
.product-feature { display: block; margin-top: 6px; font-size: 13px; color: var(--muted); }
.about-scenes { display: grid; gap: 1px; border-block: 1px solid #ddd3dd; background: #ddd3dd; }
.about-scenes span { background: #f3edf5; padding: 13px 19px; color: #5f4167; font-weight: 700; }
#detail { width: min(550px, calc(100vw - 30px)); }
.variants { display: flex; flex-wrap: wrap; gap: 8px; }
.variants:not(:empty) { margin-bottom: 14px; }
.variants [aria-pressed="true"] { background: #ede2f4; border-color: #785193; }
@media (max-width: 680px) {
  .card-body { min-height: 103px; }
  .product-feature { font-size: 12px; }
}

.hero-preview { height: 437px; display: grid; justify-items: center; grid-template-rows: minmax(0, 1fr) auto; background: #e5d6ea; color: #3c2845; border-radius: 12px; overflow: hidden; }
.hero-artwork { display: grid; grid-template: minmax(0, 1fr) / minmax(0, 1fr); place-items: center; width: 100%; min-height: 0; }
.hero-artwork > * { grid-area: 1 / 1; }
.hero-artwork > svg { display: block; width: 100%; height: 100%; }
.hero-artwork canvas { display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; }
.hero-artwork > [hidden], .hero-preview select[hidden] { display: none; }
.hero-preview figcaption { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 8px; min-height: 44px; padding: 10px 16px; background: #f2e8f4; font-size: 12px; font-weight: 700; }
.hero-preview select { max-width: 58%; padding: 4px 6px; color: inherit; font: inherit; background: #fffafc; border: 1px solid #bfaac6; border-radius: 5px; }
.product-preview { display: grid; grid-template: minmax(0, 1fr) / minmax(0, 1fr); place-items: center; height: auto; aspect-ratio: 1.3; padding: 12px; background: var(--surface); overflow: hidden; }
.product-preview canvas, .detail-preview canvas { display: block; width: auto; height: auto; max-width: 100%; max-height: 100%; }
.card-body { min-height: 100px; }
#detail { width: min(835px, calc(100vw - 30px)); }
.detail-with-preview { display: grid; grid-template-columns: 1fr 1.05fr; }
.detail-preview { display: grid; place-items: center; grid-template-rows: minmax(0, 1fr) auto; gap: 10px; padding: 20px; min-width: 0; background: #eee7ef; }
.detail-preview canvas { max-height: 380px; }
.detail-preview > span { color: var(--muted); font-size: 12px; }
.denied { display: grid; min-height: 100svh; align-items: center; justify-items: center; padding: 20px; }
.denied-panel { width: min(100%, 470px); padding: clamp(23px, 5vw, 42px); border: 1px solid var(--line); background: var(--white); border-radius: 12px; }
.denied-panel h1 { margin-block: 7px 8px; font-size: 35px; }
.denied-panel #access-check-message { color: var(--muted); margin-bottom: 16px; }
@media (max-width: 680px) {
  .hero-preview { height: 335px; }
  .product-preview { padding: 6px; }
  .detail-with-preview { grid-template-columns: 1fr; }
  .detail-preview { padding: 10px; }
  .detail-preview canvas { max-height: 35dvh; }
}

.business-contact{margin-top:18px;padding:15px 16px;border:1px solid #ddcfe4;background:#f9f4fc;border-radius:10px}.business-contact h3{font-size:15px;margin:0 0 8px}.business-contact ul{list-style:none;margin:0;padding:0}.business-contact li{display:flex;gap:8px;align-items:center;min-height:33px;border-top:1px solid #e7ddeb;font-size:13px;overflow-wrap:anywhere}.contact-label{font-weight:700;color:#5a4162;min-width:32px}.business-contact li a{text-decoration:underline;text-underline-offset:3px}.contact-copy{margin-left:auto;border:1px solid #d9c9e1;border-radius:5px;padding:3px 7px;background:white;color:#53385e;font-size:12px;white-space:nowrap}.contact-copy:hover{background:#f1e8f5}#business-contact-note,#business-contact-status{margin:8px 0 0;font-size:13px}#business-contact-status:empty{display:none}

#inquiry fieldset{margin:0;padding:0;border:0;min-inline-size:0;display:grid;gap:12px}#inquiry .inquiry-step{font-size:12px;font-weight:750;letter-spacing:.05em;color:#694877}#inquiry .inquiry-hint{font-size:12px;color:var(--muted)}#form-status:empty{display:none}.inquiry-success{padding:15px;border:1px solid #d9cce3;border-radius:9px;background:#fffafc}.inquiry-success h3{font-size:20px;margin:0 0 6px}.inquiry-success .button{margin-top:12px}

.detail-preview:has(.detail-gallery:not([hidden])){grid-template-rows:minmax(0,1fr) auto auto}.detail-gallery{display:flex;align-items:center;gap:12px;font-size:12px;color:var(--muted)}.detail-gallery button{border:1px solid #d5c5dc;border-radius:6px;background:#fff;padding:3px 9px;color:#4c3457;font-size:15px}.detail-gallery button:disabled{opacity:.4;cursor:default}

.catalog-feature{border:1px solid #9b7c9b;border-radius:12px;background:#392940;padding:clamp(22px,4vw,54px)}.catalog-feature h2{font-size:clamp(26px,4vw,45px);line-height:1.2;margin:11px 0 17px}.catalog-feature ul{list-style:none;margin:0;padding:0}.catalog-feature li{display:flex;gap:12px;border-top:1px solid #745978;padding:9px 0}.catalog-feature li span{font-size:12px;color:#edcbe9}.catalog-card-band{display:block;height:8px;background:var(--surface)}#detail{width:min(565px,calc(100vw - 30px))}
#detail{width:min(835px,calc(100vw - 30px))}.detail-preview{grid-template-rows:minmax(0,1fr) auto auto}.detail-preview:has(#gallery-links:not([hidden])):has(#detail-gallery:not([hidden])){grid-template-rows:minmax(0,1fr) auto auto auto}#gallery-links a{color:#633f72;text-decoration:underline;text-underline-offset:3px}
.product-preview{position:relative}.gallery-count{position:absolute;right:10px;bottom:10px;border-radius:5px;background:#302036dd;color:#fff;padding:3px 7px;font-size:12px;font-weight:700}.detail-preview{display:flex;flex-direction:column;align-items:center;justify-content:center}.detail-preview>canvas{object-fit:contain;max-height:min(360px,44dvh)}.gallery-thumbnails{display:flex;gap:6px;overflow:auto;width:100%;padding:3px 3px 6px}.gallery-thumbnails button{display:grid;place-items:center;flex:0 0 53px;height:53px;padding:3px;border:1px solid #cdbbd4;border-radius:6px;background:#fbf7fc}.gallery-thumbnails button[aria-pressed="true"]{border:2px solid #80549a}.gallery-thumbnails canvas{max-width:100%;max-height:43px}