/* Apple-style refinement layer: system fonts (SF Pro / PingFang), neutral surfaces, blur header, pill controls. Loaded after styles.css. */
:root{
  --blue:#f5f5f7;--ink:#1d1d1f;--muted:#6e6e73;--lemon:#f5f5f7;--paper:#fff;--deep:#1d1d1f;--line:#d2d2d7;--accent:#0071e3;--accent-hover:#0077ed;
  --font:-apple-system,BlinkMacSystemFont,'SF Pro Text','SF Pro Display','Helvetica Neue','PingFang SC','Hiragino Sans GB','Microsoft YaHei',Arial,sans-serif;
  --display:-apple-system,BlinkMacSystemFont,'SF Pro Display','Helvetica Neue','PingFang SC','Hiragino Sans GB','Microsoft YaHei',Arial,sans-serif;
  --radius:18px;--shadow:0 4px 24px #0000000f;
}
body{font-family:var(--font);letter-spacing:-.011em;background:#fff;color:var(--ink);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
h1,h2,h3,.hero h1,.collection h2,html[lang=zh-CN] .hero h1,html[lang=zh-CN] .collection h2{font-family:var(--display);font-weight:600;letter-spacing:-.028em}
html{scrollbar-color:#c1c1c6 transparent}::-webkit-scrollbar-thumb{background:#c1c1c6;border-color:#fff}::-webkit-scrollbar-track{background:#fff}
::selection{background:#b4d5fe;color:var(--ink)}
a:focus-visible,button:focus-visible,textarea:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.skip-link{background:var(--accent);color:#fff;border-radius:0 0 12px 12px}

/* header: translucent blurred bar */
.site-header,.support-header{position:sticky;top:0;align-items:center;padding:8px var(--pad);background:#fffc;-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid #0000001a}
.site-header{z-index:20}
.wordmark{font-size:22px;font-weight:600;letter-spacing:-.02em}.brand-cn{font-size:18px;margin-left:4px;vertical-align:baseline;font-weight:500}
.brand-caption{display:none}
.desktop-nav{margin-left:3vw;gap:2.4vw}.desktop-nav a{font-size:13px;color:#1d1d1fcc;transition:color .2s}.desktop-nav a:hover{color:var(--ink);text-decoration:none}
.language-switch{font-size:12px}.language-switch button[aria-pressed=true]{font-weight:600}.language-switch button[aria-pressed=true]::after{border-color:var(--accent)}
.bag-toggle{font-size:13px}
.support-header-links a{font-size:13px}.support-header-links a:hover{text-decoration:none;color:var(--accent)}
.mobile-nav{background:#fffffff2;-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-radius:0 0 var(--radius) var(--radius);box-shadow:var(--shadow)}

/* buttons: pill, blue primary */
.button{border-radius:980px;font-size:15px;font-weight:500;min-height:44px;padding:10px 26px;letter-spacing:-.01em}
.button:hover{transform:none}.button:active{transform:scale(.97)}
.button-ink,.button-lemon{background:var(--accent);color:#fff}.button-ink:hover,.button-lemon:hover{background:var(--accent-hover)}
.text-link{border-bottom:0;color:var(--accent);gap:8px;font-size:17px;padding:8px 0}.text-link:hover{text-decoration:underline}
.icon-button:hover{background:#0000000d}
.add-round{border:0;background:#f5f5f7;color:var(--ink)}.add-round:hover,.add-round.added{background:var(--accent);color:#fff}

/* hero */
.hero{background:#f5f5f7}
.hero h1,html[lang=zh-CN] .hero h1{font-weight:700;letter-spacing:-.04em;line-height:1.05}
.hero-handnote{font-family:var(--font);font-style:normal;transform:none;font-size:21px;font-weight:400;color:var(--muted);letter-spacing:-.01em;margin-top:24px}
html[lang=zh-CN] .hero-handnote{font-size:21px;margin-top:24px}
.hero-category{letter-spacing:.04em;color:var(--muted);font-size:12px}
.hero-product p{text-shadow:0 1px 8px #0006}

/* feelings bar / chips */
.feelings-bar{background:#fbfbfd}
.mood-options button{border-radius:980px;background:#fff;border:1px solid var(--line);transition:background .2s,border-color .2s,color .2s}
.mood-options button:hover{border-color:#86868b}
.mood-options button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}

/* collection / cards */
.collection{background:#fff}
.collection h2,html[lang=zh-CN] .collection h2{font-weight:700;letter-spacing:-.035em}
.concept-note{color:var(--muted)}
.product-image-button{border-radius:var(--radius);background:#f5f5f7}
.product-image-button img{transition:transform .9s var(--ease)}
.quick-view{background:#ffffffe6;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:980px;color:var(--ink)}
.product-title{font-weight:600;letter-spacing:-.015em}.product-title:hover{text-decoration:none;color:var(--accent)}
.product-price{color:var(--ink)}.product-subline,.collection-count{color:var(--muted)}

/* ritual & story bands */
.ritual{background:#f5f5f7}.ritual-copy h2{font-weight:700}.ritual-signature{font-family:var(--font);font-style:normal;color:var(--muted)}
.story{background:#fff}.story-title{font-weight:700}
.home-help{background:#f5f5f7}
.faq-item{border-color:var(--line)}.faq-item summary{font-weight:500}

/* dialogs & bag */
dialog{border-radius:22px;background:#fff;box-shadow:0 24px 80px #00000040;overflow:hidden}
dialog::backdrop{background:#00000066;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.dialog-close{background:#f5f5f7;border-radius:50%}
.bag-dialog{border-radius:22px 0 0 22px}
.bag-dock{background:#1d1d1fe6;color:#fff;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:980px;box-shadow:0 8px 32px #00000040}
.toast{background:#1d1d1fe6;color:#fff;border-radius:14px;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
textarea,input,select{border-radius:12px}
textarea{background:#fff;border:1px solid var(--line)}textarea:focus-visible{border-color:var(--accent);outline-offset:0}
.scroll-progress{background:var(--accent)}

/* footer */
.site-footer{background:#f5f5f7;color:var(--muted)}
.footer-wordmark{font-weight:700;letter-spacing:-.04em}
.footer-link-group a:hover,.footer-about>a:hover{color:var(--accent);text-decoration:none}

/* policy / support pages */
.support-layout{background:#fff}
.policy-heading,.policy-article h1,.policy-article h2{font-weight:700}
.support-index a{border-radius:10px}

/* commerce pages (order / admin) */
.order-page,.workspace,.receipt{border-radius:var(--radius)}
.primary{background:var(--accent);color:#fff;border-radius:980px;border:0}.primary:hover{background:var(--accent-hover);color:#fff}
.secondary{border-radius:980px}
table{border-radius:12px}

@media(max-width:760px){
  .site-header{padding:6px var(--pad)}.wordmark{font-size:19px}.brand-cn{font-size:16px}
  .hero-handnote,html[lang=zh-CN] .hero-handnote{font-size:17px}
  .hero-product p{background:#ffffffe6;color:var(--ink);text-shadow:none;border-radius:12px}
  .hero::after{display:none}
  .bag-dialog{border-radius:22px 22px 0 0}
}
@media(min-width:761px) and (max-width:1100px){.site-header{background:#fffc}}