:root { --paper:#f3eee8; --paper-2:#e9e1da; --ink:#37302d; --muted:#8e817a; --line:rgba(69,55,50,.11); --glass:rgba(255,255,255,.58); --rose:#b98886; --moon:#74645f; --safe-top:max(16px,env(safe-area-inset-top)); --safe-bottom:max(14px,env(safe-area-inset-bottom)); }
* { box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html,body { margin:0; min-height:100%; }
body { color:var(--ink); background:#d9d1cb; font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","PingFang SC",sans-serif; }
.luna-shell,.world-screen { -webkit-user-select:none; user-select:none; }
input,textarea { -webkit-user-select:text; user-select:text; }
button,input,textarea { font:inherit; color:inherit; }
button { border:0; cursor:pointer; }
.hidden { display:none!important; }
.luna-ambient { position:fixed; border-radius:50%; filter:blur(80px); pointer-events:none; opacity:.72; }
.ambient-one { width:300px; height:300px; top:-120px; right:-130px; background:#efd4d6; }
.ambient-two { width:320px; height:320px; left:-180px; bottom:80px; background:#d9e2e3; }
.luna-shell,.world-screen { width:min(100%,520px); min-height:100vh; min-height:100dvh; margin:auto; position:relative; background:linear-gradient(155deg,rgba(250,247,243,.97),rgba(235,227,220,.97)); overflow:hidden; }
.world-header { height:calc(64px + var(--safe-top)); padding:var(--safe-top) 16px 8px; display:grid; grid-template-columns:46px 1fr auto; align-items:center; position:relative; z-index:5; }
.world-header>div { text-align:center; line-height:1.1; }
.world-header>div span { display:block; color:#91857f; font-size:8px; letter-spacing:.26em; }
.world-header>div strong { display:block; margin-top:5px; font-family:"Songti SC","STSong",serif; font-size:15px; font-weight:500; }
.round-button { width:40px; height:40px; display:grid; place-items:center; border-radius:50%; background:rgba(255,255,255,.56); border:1px solid rgba(255,255,255,.86); box-shadow:0 9px 28px rgba(64,50,45,.07); font-size:18px; }
.account-button { min-width:62px; padding:8px 11px; display:flex; gap:6px; align-items:center; justify-content:center; border-radius:999px; background:rgba(255,255,255,.52); border:1px solid rgba(255,255,255,.82); color:#776b66; font-size:9px; }
.account-button i { font-size:13px; font-style:normal; }
.support-entry-button { min-width:72px; padding:8px 11px; display:flex; gap:6px; align-items:center; justify-content:center; border-radius:999px; color:#756763; background:linear-gradient(135deg,rgba(255,255,255,.78),rgba(244,229,228,.6)); border:1px solid rgba(255,255,255,.92); box-shadow:0 10px 26px rgba(75,54,50,.08),inset 0 1px rgba(255,255,255,.9); font-size:9px; white-space:nowrap; }
.support-entry-button i { color:#aa7d7b; font-family:Georgia,serif; font-size:13px; font-style:normal; }
.support-entry-button:active { transform:scale(.97); }
.world-header-actions { display:flex; align-items:center; gap:6px; }
.world-share-entry { width:36px; height:36px; display:grid; place-items:center; border-radius:50%; color:#796c67; background:rgba(255,255,255,.62); border:1px solid rgba(255,255,255,.88); box-shadow:0 9px 24px rgba(70,52,47,.07); font-size:15px; }
.world-intro { min-height:94px; padding:15px 24px 12px; position:relative; display:grid; align-content:center; gap:7px; }
.world-intro:after { content:"☾"; position:absolute; right:20px; top:2px; color:rgba(118,94,88,.055); font-family:serif; font-size:55px; pointer-events:none; }
.world-intro>span,.section-heading span,.editorial-cover>span,.note-card header span,.bulletin-feature>span,.radar-hero>span,.follow-card header span,.your-radar>span,.product-description>span,.review-copy>span,.auth-hero>span,.review-success>span,.support-success>span { color:#9c8f88; font-size:8px; letter-spacing:.23em; }
.world-intro-line { max-width:420px; display:grid; grid-template-columns:minmax(0,1.25fr) minmax(140px,.75fr); gap:18px; align-items:end; }
.world-intro h1 {
  max-width:390px;
  margin:10px 0 11px;
  color:#75645d;
  font-family:Baskerville,"Songti SC","STSong",serif;
  font-size:25px;
  font-weight:400;
  line-height:1.42;
  letter-spacing:.015em;
}
.world-intro p { margin:0; color:var(--muted); font-size:7px; line-height:1.7; text-align:right; }
.section-lead { max-width:390px; margin:0; color:var(--muted); font-size:9px; line-height:1.75; }
.world-nav { min-height:76px; margin:0 16px; padding:0; display:grid; grid-template-columns:repeat(5,1fr); position:sticky; top:0; z-index:8; overflow:hidden; border-top:1px solid rgba(92,72,64,.16); border-bottom:1px solid rgba(92,72,64,.16); background:rgba(247,242,237,.78); backdrop-filter:blur(20px); box-shadow:0 10px 26px rgba(67,51,46,.035); }
.world-nav button { min-width:0; padding:11px 4px 10px; position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; background:transparent; color:#8f837d; }
.world-nav button:not(:last-child):after { content:""; width:1px; position:absolute; top:14px; right:0; bottom:14px; background:rgba(92,72,64,.14); }
.world-nav button span { display:block; margin:0; color:#a3948c; font:italic 7px/1 Baskerville,"Times New Roman",serif; letter-spacing:.14em; }
.world-nav button strong { display:block; color:inherit; font:500 12px/1.25 "Songti SC","STSong",serif; letter-spacing:.04em; }
.world-nav button small { display:block; color:#a39690; font:5px/1.2 Baskerville,"Times New Roman",serif; letter-spacing:.16em; }
.world-nav button:before { content:""; width:20px; height:1px; position:absolute; left:50%; bottom:6px; transform:translateX(-50%) scaleX(0); background:#6f5d57; transition:transform .28s ease; }
.world-nav button.active { color:#433a36; background:rgba(255,255,255,.22); box-shadow:none; }
.world-nav button.active span,.world-nav button.active small { color:#7b6962; }
.world-nav button.active:before { transform:translateX(-50%) scaleX(1); }
.world-content { padding:20px 18px calc(40px + var(--safe-bottom)); }
.world-panel { display:none; animation:panelIn .55s ease both; }
.world-panel.active { display:block; }
@keyframes panelIn { from { opacity:0; transform:translateY(9px); } }
.section-heading { display:flex; justify-content:space-between; align-items:end; }
.section-heading h2 { margin:5px 0 0; font-family:"Songti SC","STSong",serif; font-size:25px; font-weight:500; }
.section-heading em { color:#a29690; font-size:7px; font-style:normal; letter-spacing:.13em; }
.section-lead { margin:12px 0 18px; }
.library-search { height:48px; padding:0 14px; display:grid; grid-template-columns:20px 1fr auto; align-items:center; border-radius:18px; background:rgba(255,255,255,.62); border:1px solid rgba(255,255,255,.88); box-shadow:0 12px 30px rgba(69,53,47,.06); }
.library-search input { min-width:0; border:0; outline:0; background:transparent; font-size:11px; }
.library-search span { color:#9a8d86; font-size:16px; }
.library-search i { color:#a59a94; font-size:6px; font-style:normal; letter-spacing:.18em; }
.facet-tabs { margin:15px -18px 0; padding:0 18px 9px; display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; }
.facet-tabs::-webkit-scrollbar,.facet-values::-webkit-scrollbar { display:none; }
.facet-tabs button { flex:0 0 84px; padding:10px 9px; text-align:left; border-radius:15px; background:rgba(255,255,255,.38); color:#81746e; border:1px solid rgba(255,255,255,.64); }
.facet-tabs button span { display:block; font-size:10px; }
.facet-tabs button small { display:block; margin-top:3px; font-size:7px; opacity:.64; }
.facet-tabs button.active { color:#fff; background:#73635f; border-color:#73635f; }
.facet-values { display:flex; gap:7px; overflow-x:auto; padding:3px 0 12px; scrollbar-width:none; }
.facet-values button { flex:0 0 auto; padding:8px 12px; border-radius:999px; background:transparent; border:1px solid var(--line); color:#847872; font-size:9px; }
.facet-values button.active { color:#4d423e; background:rgba(255,255,255,.72); border-color:rgba(255,255,255,.9); }
.brand-intro { width:100%; margin:6px 0 15px; padding:17px; border-radius:21px; background:linear-gradient(135deg,rgba(231,220,215,.92),rgba(248,245,241,.72)); border:1px solid rgba(255,255,255,.78); text-align:left; }
.brand-intro:not(:disabled) { cursor:pointer; transition:transform .35s ease,box-shadow .35s ease; }
.brand-intro:not(:disabled):hover { transform:translateY(-3px); box-shadow:0 18px 40px rgba(76,58,53,.09); }
.brand-intro-summary { display:flex; justify-content:space-between; align-items:end; }
.brand-intro span { color:#998a83; font-size:7px; letter-spacing:.18em; }
.brand-intro h3 { margin:4px 0; font-family:"Songti SC","STSong",serif; font-size:21px; font-weight:500; }
.brand-intro p { margin:0; color:#8d8079; font-size:8px; }
.brand-intro b { color:#9e8e87; font-size:7px; letter-spacing:.13em; }
.brand-intro.has-editorial { padding:18px; background:radial-gradient(circle at 91% 11%,rgba(255,255,255,.78),transparent 27%),linear-gradient(145deg,rgba(221,208,204,.95),rgba(249,246,242,.83)); box-shadow:0 16px 34px rgba(76,58,53,.07); }
.brand-editorial-note { margin-top:13px; padding:13px 0 1px; border-top:1px solid rgba(125,103,95,.13); }
.brand-editorial-note>span { color:#897872; }
.brand-editorial-note p { margin-top:7px; font-family:"Songti SC","STSong",serif; font-size:10px; line-height:1.8; color:#74645f; letter-spacing:.015em; }
.brand-editorial-note strong { display:inline-block; margin-right:7px; color:#4e403c; font-weight:500; }
.product-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:11px; }
.library-product { min-width:0; padding:10px 10px 13px; text-align:left; border-radius:22px; background:rgba(255,255,255,.55); border:1px solid rgba(255,255,255,.83); box-shadow:0 12px 30px rgba(73,57,51,.055); }
.product-oval-window,.product-packshot-window { margin:3px auto 0; display:grid; place-items:center; overflow:hidden; position:relative; }
.product-oval-window { width:78px; height:112px; border-radius:50%; border:1px solid rgba(255,255,255,.7); box-shadow:0 8px 18px rgba(73,54,48,.1); }
.product-oval-window:after { content:""; position:absolute; inset:0; border-radius:inherit; box-shadow:inset 5px 2px 10px rgba(255,255,255,.28),inset -4px -2px 9px rgba(70,48,42,.08); pointer-events:none; }
.product-oval-window img { width:100%; height:100%; object-fit:fill; transform:scale(1.12); }
.library-product.is-gel[data-brand="燕翎"] .product-oval-window img,
.library-product.is-gel[data-brand="末町"] .product-oval-window img,
.library-product.is-gel[data-brand="enoi"] .product-oval-window img,
.library-product.is-gel[data-brand="Mao·Gel"] .product-oval-window img { transform:scale(1.27); }
.product-packshot-window { width:100%; height:136px; border-radius:16px; background:#f1ebe7; }
.product-packshot-window img { position:absolute; inset:9px 16px 12px; display:block; width:calc(100% - 32px); height:calc(100% - 21px); max-width:none; max-height:none; object-fit:contain; }
.library-product h3 { margin:11px 2px 3px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-family:"Songti SC","STSong",serif; font-size:14px; font-weight:500; }
.library-product p { margin:0 2px; color:#93867f; font-size:7px; }
.library-product footer { margin:9px 2px 0; display:flex; justify-content:space-between; align-items:center; color:#8e7d76; font-size:7px; }
.library-product footer b { width:22px; height:22px; display:grid; place-items:center; border-radius:50%; background:rgba(255,255,255,.82); font-size:10px; }
.empty-library { grid-column:1/-1; padding:60px 20px; text-align:center; color:#948781; font-family:"Songti SC","STSong",serif; }
.editorial-cover { min-height:220px; margin:-2px 0 16px; padding:30px 22px; display:flex; flex-direction:column; justify-content:end; border-radius:28px; color:#fff; background:radial-gradient(circle at 65% 20%,rgba(255,255,255,.56),transparent 25%),linear-gradient(145deg,#8f7776,#d4aca9 52%,#90898d); box-shadow:0 18px 40px rgba(82,61,59,.17); }
.editorial-cover>span { color:rgba(255,255,255,.72); }
.editorial-cover h2 { margin:8px 0; font-family:"Songti SC","STSong",serif; font-size:31px; font-weight:500; }
.editorial-cover p { margin:0; font-size:10px; opacity:.8; }
.feature-story { padding:20px; border-radius:28px; background:rgba(255,255,255,.58); border:1px solid rgba(255,255,255,.8); position:relative; }
.feature-number { position:absolute; right:17px; top:13px; color:#e5d8d2; font-family:serif; font-size:48px; }
.feature-art { height:190px; display:grid; place-items:center; }
.feature-art img { max-height:184px; max-width:82%; object-fit:contain; filter:drop-shadow(0 18px 18px rgba(73,54,48,.16)); }
.feature-story>span,.editorial-list article>span { color:#9a8c85; font-size:7px; letter-spacing:.18em; }
.feature-story h3,.editorial-list h3 { margin:6px 0; font-family:"Songti SC","STSong",serif; font-size:20px; font-weight:500; }
.feature-story p,.editorial-list p { color:#897d77; font-size:9px; line-height:1.7; }
.feature-story button { padding:10px 0; background:transparent; color:#665955; font-size:10px; }
.editorial-list { display:grid; gap:9px; margin-top:10px; }
.editorial-list article { padding:17px; border-radius:21px; background:rgba(255,255,255,.43); border:1px solid rgba(255,255,255,.72); position:relative; }
.editorial-list h3 { font-size:16px; }
.editorial-list p { margin:0; }
.editorial-list article>b { position:absolute; right:16px; top:17px; font-weight:400; }
.selects-coming-soon { min-height:560px; padding:72px 24px 46px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; border-radius:32px; background:radial-gradient(circle at 50% 35%,rgba(255,255,255,.82),transparent 32%),linear-gradient(145deg,rgba(237,226,222,.9),rgba(224,231,231,.76)); border:1px solid rgba(255,255,255,.82); box-shadow:0 24px 60px rgba(71,54,49,.08); }
.selects-coming-soon>span { color:#9d8e87; font-size:7px; letter-spacing:.26em; }
.selects-coming-soon h2 { max-width:320px; margin:24px 0 13px; font:500 26px/1.45 "Songti SC","STSong",serif; }
.selects-coming-soon p { max-width:300px; margin:0; color:#8d8079; font-size:9px; line-height:1.85; }
.selects-orbit { width:112px; height:112px; margin:28px auto 5px; display:grid; place-items:center; position:relative; border-radius:50%; border:1px solid rgba(124,100,93,.14); box-shadow:0 0 0 17px rgba(255,255,255,.24),0 0 0 34px rgba(255,255,255,.12); }
.selects-orbit i { position:absolute; inset:17px; border-radius:50%; background:radial-gradient(circle at 38% 32%,#fff,rgba(222,204,202,.56) 64%,rgba(163,134,130,.16)); }
.selects-orbit b { position:relative; color:#8c7772; font:400 36px Georgia,serif; }
.note-categories { display:grid; gap:7px; margin:17px 0; }
.note-categories button { padding:14px 15px; display:grid; grid-template-columns:1fr auto; text-align:left; border-radius:17px; background:rgba(255,255,255,.46); border:1px solid rgba(255,255,255,.72); transition:transform .38s cubic-bezier(.2,.8,.2,1),box-shadow .38s ease,background .38s ease; }
.note-categories button:hover { transform:translateY(-4px) scale(1.006); background:rgba(255,255,255,.67); box-shadow:0 18px 38px rgba(73,55,50,.09); }
.note-categories button span { grid-column:1; color:#9a8b84; font-size:7px; letter-spacing:.16em; }
.note-categories button b { grid-column:1; margin-top:4px; font-size:10px; font-weight:500; }
.note-categories button i { grid-column:2; grid-row:1/3; align-self:center; color:#b4a6a0; font-family:serif; font-size:20px; font-style:normal; }
.note-card { margin-top:10px; padding:20px; border-radius:25px; background:linear-gradient(145deg,#f5ebe6,#e6d1cc); box-shadow:0 14px 32px rgba(73,55,50,.08); cursor:pointer; transition:transform .42s cubic-bezier(.2,.8,.2,1),box-shadow .42s ease; }
.note-card:hover { transform:translateY(-5px); box-shadow:0 24px 46px rgba(73,55,50,.12); }
.note-card.soft-blue { background:linear-gradient(145deg,#eef1f0,#cfdcde); }
.note-card header { display:flex; justify-content:space-between; }
.note-card header i { color:#948680; font-size:8px; font-style:normal; }
.note-card h3 { margin:27px 0 10px; font-family:"Songti SC","STSong",serif; font-size:23px; font-weight:500; }
.note-card p { color:#776b66; font-size:10px; line-height:1.8; }
.note-card footer { display:flex; gap:6px; align-items:center; margin-top:22px; }
.note-card footer span { padding:6px 8px; border-radius:999px; background:rgba(255,255,255,.5); font-size:7px; }
.note-card footer button { margin-left:auto; background:transparent; font-size:9px; }
.bulletin-feature { min-height:0; padding:0; border-radius:30px; overflow:hidden; background:#353a43; box-shadow:0 22px 48px rgba(61,48,43,.18); }
.bulletin-feature-card { width:100%; min-height:360px; padding:0; display:block; overflow:hidden; position:relative; color:#fff; background:#353a43; text-align:left; }
.bulletin-feature-card>img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; object-position:50% 50%; transition:transform 1.1s cubic-bezier(.2,.8,.2,1),filter .8s ease; }
.bulletin-feature-shade { position:absolute; inset:0; background:linear-gradient(180deg,rgba(25,29,38,.03) 22%,rgba(24,29,39,.26) 53%,rgba(19,22,29,.88) 100%); }
.bulletin-feature-copy { min-height:360px; padding:24px; display:flex; flex-direction:column; justify-content:flex-end; position:relative; z-index:1; }
.bulletin-feature-copy small { color:rgba(255,255,255,.65); font-size:7px; letter-spacing:.24em; }
.bulletin-feature-copy strong { max-width:320px; margin:11px 0 8px; font:500 27px/1.3 "Songti SC","STSong",serif; letter-spacing:.01em; }
.bulletin-feature-copy em { max-width:310px; color:rgba(255,255,255,.74); font-size:9px; font-style:normal; line-height:1.65; }
.bulletin-feature-copy>i { width:max-content; margin-top:19px; padding:10px 15px; border-radius:999px; color:#423c39; background:rgba(255,255,255,.88); font-size:8px; font-style:normal; box-shadow:0 9px 23px rgba(0,0,0,.12); }
.bulletin-feature-copy>i b { margin-left:8px; font-weight:400; }
.bulletin-feature-card:active>img { transform:scale(1.025); filter:saturate(.92); }
.bulletin-list { margin-top:18px; border-top:1px solid var(--line); }
.bulletin-list article { border-bottom:1px solid var(--line); }
.bulletin-list article>button { width:100%; padding:14px 0; display:grid; grid-template-columns:46px 65px minmax(0,1fr) 22px; gap:10px; align-items:center; background:transparent; text-align:left; }
.bulletin-list time { align-self:start; padding-top:4px; color:#9a8b84; font:10px Baskerville,"Times New Roman",serif; letter-spacing:.02em; }
.bulletin-thumb { width:65px; height:82px; display:block; overflow:hidden; border-radius:16px; background:#e6ddd6; box-shadow:0 9px 18px rgba(68,52,47,.08); }
.bulletin-thumb img { width:100%; height:100%; display:block; object-fit:cover; }
.bulletin-thumb.is-packshot { padding:5px; background:radial-gradient(circle at 55% 42%,rgba(228,210,207,.82),transparent 47%),#f1ece8; }
.bulletin-thumb.is-packshot img { object-fit:contain; filter:drop-shadow(0 7px 7px rgba(58,45,42,.16)); }
.bulletin-story-copy { min-width:0; display:block; }
.bulletin-story-copy small { color:#a08e87; font-size:6px; letter-spacing:.16em; }
.bulletin-story-copy strong { display:block; margin:5px 0 6px; font:500 14px/1.4 "Songti SC","STSong",serif; }
.bulletin-story-copy em { display:-webkit-box; overflow:hidden; color:#91847e; font-size:7px; font-style:normal; line-height:1.65; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.bulletin-list article>button>i { color:#9a8b84; font-size:12px; font-style:normal; }
.radar-hero { min-height:210px; padding:25px; display:flex; flex-direction:column; justify-content:end; border-radius:29px; overflow:hidden; position:relative; color:#f7f3ef; background:linear-gradient(145deg,#4c5559,#79898b 52%,#aa9995); }
.radar-hero i { position:absolute; width:160px; height:160px; right:-34px; top:-35px; border:1px solid rgba(255,255,255,.25); border-radius:50%; box-shadow:0 0 0 30px rgba(255,255,255,.04),0 0 0 60px rgba(255,255,255,.035); }
.radar-hero>span { color:#d6dcdb; }
.radar-hero h2 { margin:8px 0; font-family:"Songti SC","STSong",serif; font-size:29px; font-weight:500; }
.radar-hero p { margin:0; font-size:9px; opacity:.78; }
.radar-types { display:flex; justify-content:space-between; padding:13px 5px; color:#867a74; font-size:7px; letter-spacing:.1em; }
.follow-card,.your-radar { margin-top:11px; padding:18px; border-radius:24px; background:rgba(255,255,255,.5); border:1px solid rgba(255,255,255,.77); }
.follow-card header { display:flex; justify-content:space-between; align-items:end; margin-bottom:9px; }
.follow-card h3,.your-radar h3 { margin:4px 0; font-family:"Songti SC","STSong",serif; font-size:18px; font-weight:500; }
.follow-card header small { color:#998c85; font-size:7px; }
.follow-card>button { width:100%; padding:12px 2px; display:flex; justify-content:space-between; align-items:center; text-align:left; background:transparent; border-top:1px solid var(--line); }
.follow-card>button span { font-family:"Songti SC","STSong",serif; font-size:13px; }
.follow-card>button small { display:block; margin-top:3px; color:#998c85; font-family:sans-serif; font-size:7px; }
.follow-card>button b { width:32px; height:32px; display:grid; place-items:center; border-radius:50%; background:rgba(255,255,255,.65); color:#a17f7c; font-size:16px; font-weight:400; }
.follow-card>button.following b { background:#8c706d; color:#fff; }
.your-radar article { padding:13px 0; display:grid; grid-template-columns:9px 1fr auto; gap:10px; align-items:center; border-top:1px solid var(--line); }
.your-radar article i { width:7px; height:7px; border-radius:50%; background:#87a29c; box-shadow:0 0 8px rgba(86,132,119,.4); }
.your-radar article i.sale { background:#be8e83; }
.your-radar article i.limited { background:#9d8aa8; }
.your-radar article b { display:block; font-size:10px; font-weight:500; }
.your-radar article small { color:#9a8d86; font-size:7px; }
.your-radar article>span { color:#9c8e87; }
.radar-event-card { width:100%; padding:16px 0 14px; display:grid; grid-template-columns:10px minmax(0,1fr) auto; gap:11px; align-items:center; border-top:1px solid var(--line); background:transparent; text-align:left; }
.radar-event-card>i { width:8px; height:8px; border-radius:50%; background:#bd8b80; box-shadow:0 0 12px rgba(179,116,103,.43); }
.radar-event-card>span b { display:block; font:500 13px/1.5 "Songti SC","STSong",serif; }
.radar-event-card>span small { display:block; margin-top:5px; color:#9b8d86; font-size:7px; }
.radar-event-card>em { color:#9a8b84; font-size:15px; font-style:normal; transition:transform .3s ease; }
.radar-event-card:hover>em { transform:translateX(4px); }
.world-screen { position:fixed; z-index:40; inset:0; overflow-y:auto; animation:screenIn .5s cubic-bezier(.2,.8,.2,1); }
@keyframes screenIn { from { opacity:0; transform:translateY(12px); } }
.detail-header { height:calc(60px + var(--safe-top)); padding:var(--safe-top) 16px 6px; display:flex; justify-content:space-between; align-items:center; position:relative; z-index:5; }
.detail-header>span { color:#91847d; font-size:8px; letter-spacing:.22em; }
.detail-header>i { width:40px; }
.article-screen { overflow-x:hidden; background:radial-gradient(circle at 92% 4%,rgba(233,210,211,.54),transparent 28%),linear-gradient(155deg,#f7f3ef,#eae1da); }
.article-detail-header,.directory-header,.share-luna-header { position:sticky; top:0; z-index:20; background:linear-gradient(180deg,rgba(248,244,240,.94),rgba(248,244,240,.7)); backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px); }
.article-reader { padding-bottom:calc(50px + var(--safe-bottom)); }
.article-hero { min-height:460px; padding:72px 25px 34px; position:relative; overflow:hidden; color:#463c38; background:radial-gradient(circle at 79% 20%,rgba(255,255,255,.86),transparent 31%),linear-gradient(150deg,#ead9d5,#f4eee8 62%,#d9e4e3); }
.article-hero[data-tone="blue"] { background:radial-gradient(circle at 78% 17%,rgba(255,255,255,.88),transparent 29%),linear-gradient(150deg,#d9e3e5,#f3eee8 64%,#dacfd4); }
.article-hero[data-tone="gold"] { background:radial-gradient(circle at 78% 17%,rgba(255,255,255,.9),transparent 29%),linear-gradient(150deg,#e8dfca,#f4eee8 64%,#d8c8bb); }
.article-hero[data-tone="ink"] { color:#f6f1ec; background:radial-gradient(circle at 77% 20%,rgba(255,255,255,.12),transparent 29%),linear-gradient(150deg,#3e4143,#777278 64%,#8e7772); }
.article-hero>span { color:currentColor; opacity:.58; font-size:7px; letter-spacing:.3em; }
.article-number { position:absolute; right:-4px; top:45px; color:currentColor; opacity:.055; font:210px/.8 Baskerville,"Times New Roman",serif; }
.article-hero h1 { max-width:420px; margin:70px 0 20px; font:500 37px/1.26 "Songti SC","STSong",serif; letter-spacing:.01em; position:relative; z-index:1; }
.article-hero>p { max-width:400px; margin:0; color:currentColor; opacity:.72; font:400 12px/2 "Songti SC","STSong",serif; position:relative; z-index:1; }
.article-hero footer { margin-top:45px; padding-top:15px; display:flex; justify-content:space-between; align-items:center; border-top:1px solid currentColor; border-color:color-mix(in srgb,currentColor 16%,transparent); position:relative; z-index:1; }
.article-hero footer>div { display:flex; flex-wrap:wrap; gap:7px; }
.article-hero footer span { padding:7px 10px; border-radius:999px; background:rgba(255,255,255,.42); font-size:7px; }
.article-hero footer time { font-size:7px; letter-spacing:.14em; opacity:.65; }
.article-paper { margin:-1px 0 0; padding:44px 23px 8px; position:relative; background:linear-gradient(180deg,rgba(250,247,243,.98),rgba(238,231,224,.98)); }
.article-dropcap { position:absolute; right:18px; top:14px; color:rgba(99,78,71,.045); font:180px/.8 Baskerville,"Times New Roman",serif; }
.article-prose { max-width:440px; margin:auto; position:relative; z-index:1; }
.article-prose>p { margin:0 0 22px; color:#625752; font:400 12px/2.05 "Songti SC","STSong",serif; text-align:justify; }
.article-prose strong { color:#3f3632; font-weight:600; }
.article-prose h2 { margin:55px 0 19px; font:500 25px/1.45 "Songti SC","STSong",serif; }
.article-prose h3 { margin:37px 0 16px; font:500 17px/1.5 "Songti SC","STSong",serif; }
.article-prose .article-chapter-title { padding-top:23px; border-top:1px solid rgba(79,62,56,.12); }
.article-prose .article-note-label { margin:40px 0 15px; padding:13px 16px; border-radius:999px; color:#826b67; background:linear-gradient(135deg,rgba(236,216,215,.82),rgba(255,255,255,.64)); font:500 10px "Songti SC","STSong",serif; letter-spacing:.11em; }
.article-prose ul { margin:0 0 24px; padding:18px 20px 15px 38px; border-radius:22px; background:rgba(255,255,255,.55); border:1px solid rgba(255,255,255,.82); }
.article-prose li { margin:0 0 10px; color:#675b56; font:400 11px/1.85 "Songti SC","STSong",serif; }
.article-divider { margin:48px 0; display:flex; align-items:center; justify-content:center; gap:12px; color:#a08781; }
.article-divider i { width:54px; height:1px; background:linear-gradient(90deg,transparent,rgba(111,86,78,.18)); }
.article-divider i:last-child { transform:scaleX(-1); }
.article-divider span { font:17px Georgia,serif; }
.article-key-lines { margin:0 0 25px; padding:17px 18px; border-radius:22px; background:linear-gradient(145deg,rgba(224,232,231,.66),rgba(255,255,255,.55)); border:1px solid rgba(255,255,255,.85); }
.article-key-lines p { margin:0 0 9px; color:#655955; font:500 11px/1.7 "Songti SC","STSong",serif; }
.article-related { margin:44px 0 8px; padding:21px; border-radius:24px; color:#f4efeb; background:linear-gradient(135deg,#615451,#87716d); box-shadow:0 19px 38px rgba(72,53,48,.13); }
.article-related span { font-size:7px; letter-spacing:.24em; opacity:.63; }
.article-related p { margin:10px 0 0; font:400 11px/1.8 "Songti SC","STSong",serif; }
.article-signoff { padding:55px 0 20px; text-align:center; color:#9a8a83; }
.article-signoff span { display:block; font:24px Georgia,serif; }
.article-signoff p { margin:10px 0 0; font-size:6px; letter-spacing:.23em; }
.brand-directory-screen { background:radial-gradient(circle at 50% 0,rgba(255,255,255,.9),transparent 26%),linear-gradient(155deg,#f5f0ea,#e5dcd4); }
.directory-hero { min-height:310px; padding:66px 26px 34px; position:relative; overflow:hidden; }
.directory-hero:after { content:"A—Z"; position:absolute; right:-8px; top:10px; color:rgba(89,70,63,.045); font:118px Baskerville,serif; }
.directory-hero>span { color:#9d8f88; font-size:7px; letter-spacing:.26em; }
.directory-hero h1 { margin:30px 0 13px; font:500 42px "Songti SC","STSong",serif; }
.directory-hero p { max-width:370px; margin:0; color:#847770; font:400 11px/1.9 "Songti SC","STSong",serif; }
.brand-directory-content { padding:0 18px calc(44px + var(--safe-bottom)); }
.directory-group { margin:0 0 18px; padding:22px; border-radius:29px; background:rgba(255,255,255,.56); border:1px solid rgba(255,255,255,.84); box-shadow:0 18px 45px rgba(72,54,48,.07); }
.directory-group header { display:grid; grid-template-columns:1fr auto; align-items:end; padding-bottom:17px; border-bottom:1px solid rgba(74,58,52,.12); }
.directory-group header span { grid-column:1; color:#9c8d86; font-size:7px; letter-spacing:.2em; }
.directory-group h2 { grid-column:1; margin:6px 0 0; font:500 25px "Songti SC","STSong",serif; }
.directory-group header em { grid-column:2; grid-row:1/3; color:#9b8d86; font-size:7px; font-style:normal; letter-spacing:.12em; }
.directory-group>div { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 18px; }
.directory-group button { min-width:0; padding:15px 0; display:grid; grid-template-columns:22px minmax(0,1fr) auto; gap:8px; align-items:center; border-bottom:1px solid rgba(77,61,55,.09); background:transparent; text-align:left; }
.directory-group button b { color:#b0a19a; font:500 9px Baskerville,"Times New Roman",serif; letter-spacing:.08em; }
.directory-group button span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font:500 13px "Songti SC","STSong",serif; }
.directory-group button i { color:#a0928b; font-style:normal; transition:transform .3s ease; }
.directory-group button:hover i { transform:translate(3px,-2px); }
.share-luna-screen { background:radial-gradient(circle at 50% 25%,rgba(255,255,255,.95),transparent 31%),linear-gradient(155deg,#efe5df,#dce5e4); }
.share-luna-hero { min-height:calc(100vh - 70px); min-height:calc(100dvh - 70px); padding:54px 24px calc(42px + var(--safe-bottom)); display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.share-luna-symbol { width:126px; height:126px; margin:0 auto 34px; display:grid; place-items:center; position:relative; border-radius:50%; color:#89736e; background:rgba(255,255,255,.63); border:1px solid rgba(255,255,255,.9); box-shadow:0 25px 65px rgba(75,55,49,.12),0 0 0 18px rgba(255,255,255,.18); }
.share-luna-symbol span { font:45px Georgia,serif; }
.share-luna-symbol i { position:absolute; right:21px; top:20px; width:28px; height:28px; display:grid; place-items:center; border-radius:50%; color:#fff; background:#8a706c; font-size:11px; font-style:normal; animation:shareOrbit 3.4s ease-in-out infinite; }
@keyframes shareOrbit { 50% { transform:translate(5px,-5px) rotate(7deg); box-shadow:0 8px 18px rgba(88,61,55,.2); } }
.share-luna-hero>span { color:#9a8b84; font-size:7px; letter-spacing:.25em; }
.share-luna-hero h1 { max-width:390px; margin:19px 0 17px; font:500 32px/1.4 "Songti SC","STSong",serif; }
.share-luna-hero>p { max-width:380px; margin:0; color:#71645f; font:500 12px/1.85 "Songti SC","STSong",serif; }
.share-luna-letter { max-width:400px; margin:27px 0; padding:21px 19px; border-radius:26px; background:rgba(255,255,255,.5); border:1px solid rgba(255,255,255,.82); }
.share-luna-letter p { margin:0 0 15px; color:#81736d; font-size:10px; line-height:1.95; text-align:justify; }
.share-luna-letter strong { color:#6a5a55; font:500 13px "Songti SC","STSong",serif; }
.share-luna-button { width:100%; max-width:400px; min-height:56px; padding:0 20px; display:flex; align-items:center; justify-content:space-between; border-radius:999px; color:#fff; background:linear-gradient(115deg,#554a46,#8a716c); box-shadow:0 16px 35px rgba(77,57,52,.18); }
.share-luna-button span { margin:auto; padding-left:16px; font:500 13px "Songti SC","STSong",serif; }
.share-luna-button i { font-style:normal; }
.share-luna-hero>small { margin-top:11px; color:#9b8e87; font-size:7px; }
.news-screen { --news-accent:#7e6c67; --news-deep:#4a3e3b; --news-soft:#ebddd8; --news-shift:0px; --news-scale:1; overflow-x:hidden; background:#eee7e0; scroll-behavior:smooth; }
.news-screen[data-theme="hermes"] { --news-accent:#7989a7; --news-deep:#313b50; --news-soft:#dce5f2; }
.news-screen[data-theme="chanel"] { --news-accent:#a46b75; --news-deep:#241f20; --news-soft:#ead6d5; }
.news-screen[data-theme="opi"] { --news-accent:#a56e68; --news-deep:#633b42; --news-soft:#f2d9cb; }
.news-screen[data-theme="dior"] { --news-accent:#8a7986; --news-deep:#403643; --news-soft:#e5dbe2; }
.news-screen[data-theme="chrome"] { --news-accent:#9a8f8c; --news-deep:#565152; --news-soft:#e7e5e2; }
.news-detail-header { margin-bottom:calc(-60px - var(--safe-top)); position:sticky; top:0; z-index:20; color:#fff; background:linear-gradient(180deg,rgba(30,27,28,.42),rgba(30,27,28,0)); }
.news-detail-header .round-button { color:#fff; background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); box-shadow:0 8px 26px rgba(0,0,0,.08); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
.news-detail-header>span { color:rgba(255,255,255,.76); text-shadow:0 1px 12px rgba(0,0,0,.2); }
.news-reader-hero { height:min(74dvh,720px); min-height:560px; position:relative; overflow:hidden; background:var(--news-deep); }
.news-reader-hero.is-poster { height:100vh; height:100dvh; min-height:700px; }
.news-reader-hero>img { width:100%; height:calc(100% + 42px); display:block; object-fit:cover; object-position:center; transform:translate3d(0,var(--news-shift),0) scale(var(--news-scale)); transform-origin:center top; will-change:transform; }
.news-reader-hero.is-poster>img { object-position:center top; }
.news-screen[data-theme="chanel"] .news-reader-hero.is-poster>img { animation:chanelPosterRise 1.25s cubic-bezier(.16,.78,.2,1) both; }
@keyframes chanelPosterRise {
  from { opacity:.72; filter:blur(4px); transform:translate3d(0,calc(var(--news-shift) + 58px),0) scale(1.035); }
  to { opacity:1; filter:blur(0); transform:translate3d(0,var(--news-shift),0) scale(var(--news-scale)); }
}
.news-hero-wash { position:absolute; inset:0; background:linear-gradient(180deg,rgba(16,18,24,.06),transparent 42%,rgba(22,21,25,.48)); pointer-events:none; }
.news-reader-hero.is-poster .news-hero-wash { background:linear-gradient(180deg,rgba(18,17,18,.12),transparent 29%,rgba(24,22,22,.21)); }
.news-hero-signature { position:absolute; top:calc(82px + var(--safe-top)); left:22px; right:22px; display:flex; align-items:center; justify-content:space-between; color:#fff; }
.news-hero-signature>span { font-size:7px; letter-spacing:.28em; }
.news-hero-signature>small { font:8px Baskerville,"Times New Roman",serif; letter-spacing:.12em; opacity:.74; }
.news-scroll-cue { position:absolute; left:50%; bottom:23px; display:flex; flex-direction:column; align-items:center; gap:8px; color:rgba(255,255,255,.7); transform:translateX(-50%); }
.news-scroll-cue i { width:1px; height:29px; display:block; background:linear-gradient(transparent,rgba(255,255,255,.78)); animation:newsScrollCue 1.9s ease-in-out infinite; transform-origin:top; }
.news-scroll-cue span { font-size:6px; letter-spacing:.21em; white-space:nowrap; }
@keyframes newsScrollCue { 0%,100% { opacity:.35; transform:scaleY(.65); } 50% { opacity:1; transform:scaleY(1); } }
.news-paper { margin-top:-25px; padding:0 19px calc(52px + var(--safe-bottom)); border-radius:34px 34px 0 0; position:relative; z-index:3; background:radial-gradient(circle at 85% 4%,var(--news-soft),transparent 22%),linear-gradient(160deg,#faf7f3,#eee6df); box-shadow:0 -18px 44px rgba(34,29,29,.13); }
.news-title-block { padding:44px 5px 25px; border-bottom:1px solid rgba(68,52,47,.12); }
.news-title-block>span { color:var(--news-accent); font-size:7px; letter-spacing:.2em; }
.news-title-block h1 { max-width:435px; margin:13px 0 11px; font:500 34px/1.27 "Songti SC","STSong",serif; letter-spacing:-.025em; }
.news-title-block p { max-width:420px; margin:0; color:#756965; font:500 13px/1.75 "Songti SC","STSong",serif; }
.news-meta { margin:0 4px 27px; padding:16px 0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; border-bottom:1px solid rgba(68,52,47,.11); }
.news-meta div { min-width:0; }
.news-meta span { display:block; margin-bottom:5px; color:#a2948e; font-size:6px; letter-spacing:.08em; }
.news-meta strong { display:block; color:#635854; font-size:8px; font-weight:500; line-height:1.45; }
.news-prose { padding:0 5px; }
.news-lead { margin:0 0 24px; color:#4d4441; font:500 18px/1.8 "Songti SC","STSong",serif; }
.news-paragraph { margin:0 0 22px; color:#655b57; font:400 13px/2.05 "Songti SC","STSong",serif; text-align:justify; }
.news-paragraph strong,.news-lead strong,.news-colour-note strong { color:#403734; font-weight:600; }
.news-section-title { margin:37px 0 22px; color:#463d3a; font:500 23px/1.5 "Songti SC","STSong",serif; }
.news-quote { margin:38px 8px; padding:4px 0 4px 21px; position:relative; color:var(--news-deep); font:500 20px/1.72 "Songti SC","STSong",serif; }
.news-quote:before { content:""; width:1px; position:absolute; inset:0 auto 0 0; background:linear-gradient(transparent,var(--news-accent),transparent); }
.news-media { margin:34px -19px 35px; position:relative; overflow:hidden; background:#e8e0da; }
.news-media img { width:100%; max-height:680px; display:block; object-fit:cover; }
.news-media figcaption { padding:11px 19px; color:#938680; background:rgba(255,255,255,.42); font-size:6px; letter-spacing:.18em; }
.news-shades { margin:4px 0 31px; padding:0; list-style:none; border-top:1px solid rgba(70,54,48,.12); }
.news-shades li { padding:16px 2px; display:grid; grid-template-columns:minmax(110px,37%) 1fr; gap:13px; border-bottom:1px solid rgba(70,54,48,.1); }
.news-shades strong { color:var(--news-deep); font:500 12px/1.45 Baskerville,"Times New Roman",serif; }
.news-shades p { margin:0; color:#776b66; font:400 10px/1.75 "Songti SC","STSong",serif; }
.news-colour-note,.news-edition { margin:35px 0; padding:22px 20px; border-radius:25px; color:#fff; background:linear-gradient(135deg,var(--news-deep),var(--news-accent)); box-shadow:0 20px 42px rgba(67,49,45,.14); }
.news-colour-note>span,.news-edition>span { display:block; margin-bottom:14px; color:rgba(255,255,255,.64); font-size:7px; letter-spacing:.22em; }
.news-colour-note p,.news-edition p { margin:0; color:rgba(255,255,255,.86); font:400 12px/1.95 "Songti SC","STSong",serif; }
.news-edition { color:#554b48; background:linear-gradient(145deg,rgba(255,255,255,.72),rgba(226,216,209,.76)); border:1px solid rgba(255,255,255,.82); box-shadow:0 16px 34px rgba(67,49,45,.07); }
.news-edition>span { color:var(--news-accent); }
.news-edition p { color:#756965; font-family:Baskerville,"Songti SC",serif; }
.news-sources { margin:38px 4px 0; padding:22px 0; display:grid; gap:9px; border-top:1px solid rgba(70,54,48,.12); border-bottom:1px solid rgba(70,54,48,.12); }
.news-sources>span { margin-bottom:2px; color:#9c8e88; font-size:6px; letter-spacing:.22em; }
.news-sources a,.news-sources p { margin:0; color:#6f625d; font:500 9px/1.6 "Songti SC","STSong",serif; text-decoration:none; }
.news-sources a i { color:var(--news-accent); font-style:normal; }
.news-library-cta { margin:38px -1px 0; padding:25px 20px 22px; border-radius:29px; overflow:hidden; position:relative; color:#fff; background:radial-gradient(circle at 88% 7%,rgba(255,255,255,.17),transparent 27%),linear-gradient(145deg,var(--news-deep),var(--news-accent)); box-shadow:0 24px 50px rgba(65,48,45,.17); }
.news-library-cta>span { color:rgba(255,255,255,.57); font-size:6px; letter-spacing:.23em; }
.news-library-cta>h2 { margin:10px 0; font:500 23px/1.42 "Songti SC","STSong",serif; }
.news-library-cta>p { margin:0; color:rgba(255,255,255,.72); font:400 10px/1.85 "Songti SC","STSong",serif; }
.news-product-links { margin:20px -20px -4px; padding:0 20px 5px; display:flex; gap:9px; overflow-x:auto; scrollbar-width:none; }
.news-product-links::-webkit-scrollbar { display:none; }
.news-product-link { flex:0 0 138px; min-height:160px; padding:11px; display:grid; grid-template-rows:96px auto auto; border-radius:20px; color:#5d514d; background:rgba(255,255,255,.89); text-align:left; box-shadow:0 12px 24px rgba(28,21,21,.13); }
.news-product-link>span { display:grid; place-items:center; overflow:hidden; border-radius:14px; background:#eee8e3; }
.news-product-link img { width:100%; height:100%; display:block; object-fit:contain; }
.news-product-link b { margin-top:8px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font:500 10px "Songti SC","STSong",serif; }
.news-product-link i { margin-top:4px; color:#988984; font-size:6px; font-style:normal; }
.news-end-mark { padding:46px 0 5px; text-align:center; color:#9b8e88; }
.news-end-mark>span { display:block; color:var(--news-accent); font:24px Georgia,serif; }
.news-end-mark p { margin:12px 0 0; font-size:6px; letter-spacing:.21em; }
.news-reveal { opacity:0; transform:translateY(18px); filter:blur(5px); transition:opacity .85s ease,transform .85s cubic-bezier(.2,.76,.22,1),filter .85s ease; }
.news-reveal.is-visible { opacity:1; transform:translateY(0); filter:blur(0); }
.product-detail-hero { min-height:445px; padding:22px 20px 25px; display:flex; flex-direction:column; align-items:center; position:relative; }
.detail-orbit { position:absolute; width:320px; height:320px; top:20px; border-radius:50%; background:radial-gradient(circle,#fff 0,rgba(235,219,216,.64) 39%,transparent 70%); filter:blur(4px); }
.detail-product-image { height:298px; width:230px; display:grid; place-items:center; overflow:hidden; position:relative; z-index:1; }
.detail-product-image img { position:absolute; display:block; max-width:none; max-height:none; object-fit:contain; filter:drop-shadow(0 24px 26px rgba(63,48,43,.16)); }
#product-screen.is-polish .detail-orbit { display:none; }
#product-screen.is-polish .detail-product-image { width:min(100%,310px); height:298px; border-radius:28px; background:#f1ebe7; border:1px solid rgba(255,255,255,.76); }
#product-screen.is-polish .detail-product-image img { inset:16px 28px 20px; width:calc(100% - 56px); height:calc(100% - 36px); }
#product-screen.is-gel .detail-product-image { width:156px; height:224px; overflow:hidden; border-radius:50%; clip-path:ellipse(50% 50% at 50% 50%); -webkit-clip-path:ellipse(50% 50% at 50% 50%); isolation:isolate; border:1px solid rgba(255,255,255,.72); background:transparent; box-shadow:0 18px 36px rgba(73,54,48,.13); }
#product-screen.is-gel .detail-product-image img { inset:0; width:100%; height:100%; object-fit:fill; clip-path:ellipse(50% 50% at 50% 50%); -webkit-clip-path:ellipse(50% 50% at 50% 50%); filter:none; }
#product-screen.is-gel[data-brand="燕翎"] .detail-product-image img,
#product-screen.is-gel[data-brand="末町"] .detail-product-image img,
#product-screen.is-gel[data-brand="enoi"] .detail-product-image img,
#product-screen.is-gel[data-brand="Mao·Gel"] .detail-product-image img { transform:scale(1.27); }
#product-screen.is-gel .detail-product-image:after { content:""; position:absolute; inset:0; border-radius:inherit; box-shadow:inset 9px 3px 18px rgba(255,255,255,.22),inset -7px -3px 16px rgba(65,44,38,.08); pointer-events:none; }
.detail-product-gallery { min-height:34px; display:flex; justify-content:center; gap:6px; margin:-5px 0 13px; position:relative; z-index:2; }
.detail-product-gallery button { width:30px; height:30px; padding:2px; border-radius:50%; overflow:hidden; background:rgba(255,255,255,.65); border:1px solid rgba(255,255,255,.82); opacity:.62; }
.detail-product-gallery button.active { opacity:1; box-shadow:0 0 0 1px rgba(102,83,76,.22),0 5px 12px rgba(66,51,46,.1); }
.detail-product-gallery img { width:100%; height:100%; display:block; object-fit:cover; border-radius:50%; }
.product-detail-hero>span { color:#988983; font-size:8px; letter-spacing:.14em; }
.product-detail-hero h1 { margin:7px 0 3px; font-family:"Songti SC","STSong",serif; font-size:29px; font-weight:500; }
.product-detail-hero p { margin:0; color:#948781; font-size:9px; }
.product-facts { margin:0 18px; padding:15px; display:grid; grid-template-columns:repeat(2,1fr); gap:8px; border-radius:23px; background:rgba(255,255,255,.58); border:1px solid rgba(255,255,255,.8); }
.product-facts div { padding:10px; border-radius:15px; background:rgba(244,239,234,.76); }
.product-facts span { display:block; color:#9a8c85; font-size:7px; }
.product-facts strong { display:block; margin-top:5px; font-size:10px; font-weight:500; }
.product-description { padding:28px 22px 18px; }
.product-description h2,.community-experiences h2 { margin:6px 0 9px; font-family:"Songti SC","STSong",serif; font-size:20px; font-weight:500; }
.product-description p { color:#7f736d; font-size:10px; line-height:1.85; }
.product-purchase { display:inline-block; margin-top:8px; padding:9px 13px; border-radius:999px; background:rgba(255,255,255,.58); border:1px solid rgba(255,255,255,.8); color:#746762; font-size:8px; text-decoration:none; }
.product-actions-grid { margin:0 18px; display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.product-actions-grid button { padding:15px 8px; display:flex; gap:8px; justify-content:center; border-radius:18px; background:rgba(255,255,255,.55); border:1px solid rgba(255,255,255,.78); color:#756964; font-size:9px; }
.product-actions-grid button span { color:#ad8582; font-size:13px; }
.product-actions-grid button.active { color:#fff; background:#75635f; border-color:#75635f; }
.experience-button { width:calc(100% - 36px); margin:10px 18px; padding:16px; display:grid; grid-template-columns:1fr auto; text-align:left; border-radius:21px; color:#fff; background:linear-gradient(120deg,#6a5d59,#9a7c79); box-shadow:0 14px 30px rgba(76,57,52,.16); }
.experience-button span,.experience-button small { grid-column:1; }
.experience-button span { font-family:"Songti SC","STSong",serif; font-size:13px; }
.experience-button small { margin-top:5px; color:#e7dcd8; font-size:7px; }
.experience-button b { grid-column:2; grid-row:1/3; align-self:center; font-weight:400; }
.community-experiences { padding:26px 18px 10px; }
.community-experiences header { display:flex; justify-content:space-between; align-items:end; }
.community-experiences header span { color:#9b8d86; font-size:7px; letter-spacing:.17em; }
.community-experiences header em { color:#9a8d86; font-size:8px; font-style:normal; }
.empty-reviews { padding:25px 5px; color:#998c86; font-family:"Songti SC","STSong",serif; font-size:12px; text-align:center; }
.experience-card { padding:16px 2px; border-top:1px solid var(--line); }
.experience-card header { display:flex; justify-content:space-between; color:#94867f; font-size:8px; }
.experience-meta { display:flex; gap:7px; margin-top:10px; align-items:center; }
.experience-stars { color:#b48775; font-size:12px; letter-spacing:.08em; }
.experience-expectation { padding:5px 8px; border-radius:999px; background:#eee5df; color:#806e66; font-size:7px; }
.experience-card p { color:#6f645f; font-size:10px; line-height:1.75; }
.experience-images { display:flex; gap:7px; overflow-x:auto; }
.experience-images img { width:116px; height:116px; object-fit:cover; border-radius:16px; }
.design-colour-button { width:calc(100% - 36px); margin:8px 18px calc(22px + var(--safe-bottom)); padding:16px; border-radius:999px; color:#fff; background:#4f4744; font-size:11px; }
.review-screen,.auth-screen { padding-bottom:calc(30px + var(--safe-bottom)); }
.review-copy,.auth-hero { padding:35px 24px 18px; }
.review-copy h1,.auth-hero h1,.review-success h1 { margin:10px 0 16px; font-family:"Songti SC","STSong",serif; font-size:30px; font-weight:500; line-height:1.35; }
.review-copy p,.auth-hero p,.review-success p { color:#81746e; font-size:10px; line-height:1.85; }
.review-copy blockquote { margin:22px 0 0; padding:16px 18px; border:0; border-radius:20px; background:rgba(255,255,255,.52); color:#6f625d; font-family:"Songti SC","STSong",serif; font-size:12px; line-height:1.7; }
.review-form,.auth-form { margin:0 18px; padding:20px; border-radius:26px; background:rgba(255,255,255,.55); border:1px solid rgba(255,255,255,.8); }
.review-form label>span,.auth-form label { display:block; color:#847872; font-size:9px; }
.review-form textarea,.auth-form input { width:100%; margin-top:8px; padding:13px 0; border:0; border-bottom:1px solid var(--line); outline:0; background:transparent; resize:none; font-size:11px; }
.review-form label>small { display:block; margin-top:5px; color:#a0938c; font-size:7px; }
.review-fieldset { min-width:0; margin:22px 0 0; padding:0; border:0; }
.review-fieldset legend { padding:0; color:#776b65; font-size:9px; }
.star-rating { min-height:45px; margin-top:8px; display:inline-flex; flex-direction:row-reverse; justify-content:flex-end; gap:5px; }
.star-rating input { position:absolute; opacity:0; pointer-events:none; }
.star-rating label { padding:2px; color:#d8cdc7; font-size:29px; line-height:1; cursor:pointer; transition:color .22s ease,transform .22s ease,text-shadow .22s ease; }
.star-rating label:hover,.star-rating label:hover~label,.star-rating input:checked~label { color:#b78d79; text-shadow:0 5px 13px rgba(149,103,86,.2); transform:translateY(-1px); }
.star-rating:focus-within { outline:0; }
.expectation-options { margin-top:11px; display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }
.expectation-options label { display:block; }
.expectation-options input { position:absolute; opacity:0; pointer-events:none; }
.expectation-options label>span { min-height:41px; padding:11px 5px; display:grid; place-items:center; border-radius:999px; color:#897b74; background:rgba(238,231,225,.7); border:1px solid rgba(255,255,255,.82); text-align:center; font-size:8px; transition:.22s ease; }
.expectation-options input:checked+span { color:#fff; background:#776560; border-color:#776560; box-shadow:0 7px 17px rgba(82,59,53,.14); }
.photo-upload { margin-top:14px; min-height:105px; display:grid!important; place-items:center; align-content:center; border:1px dashed rgba(101,81,73,.2); border-radius:19px; text-align:center; position:relative; }
.photo-upload input { position:absolute; inset:0; opacity:0; }
.photo-upload>span { color:#9f817b; font-size:21px; }
.photo-upload b { margin-top:4px; font-size:10px; font-weight:500; }
.upload-preview { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; margin-top:8px; }
.upload-preview img { width:100%; aspect-ratio:1; object-fit:cover; border-radius:12px; }
.review-consent-note { margin:15px 0; color:#9a8c85; font-size:7px; line-height:1.65; }
.review-submit,.auth-form button { width:100%; padding:15px 17px; display:flex; justify-content:space-between; border-radius:999px; color:#fff; background:#665955; }
.auth-tabs { margin:0 18px 10px; padding:4px; display:grid; grid-template-columns:1fr 1fr; border-radius:999px; background:rgba(255,255,255,.44); }
.auth-tabs button { padding:10px; border-radius:999px; background:transparent; color:#948781; font-size:10px; }
.auth-tabs button.active { color:#fff; background:#74645f; }
.auth-form label { margin-bottom:15px; }
.auth-form button { justify-content:center; margin-top:6px; }
#auth-message { min-height:18px; margin:12px 0 0; color:#9b6966; font-size:8px; text-align:center; }
.auth-privacy { padding:17px 26px; color:#9b8e87; font-size:8px; text-align:center; }
.review-success { padding:calc(95px + var(--safe-top)) 28px 35px; text-align:center; }
.success-moon { width:72px; height:72px; margin:0 auto 24px; display:grid; place-items:center; border-radius:50%; color:#8d7772; background:rgba(255,255,255,.68); box-shadow:0 18px 42px rgba(76,57,51,.12); font-size:28px; }
.review-success p { max-width:360px; margin:9px auto; }
.review-success p strong { color:#655954; font-family:"Songti SC","STSong",serif; font-size:13px; font-weight:500; }
.review-success button { width:100%; margin-top:28px; padding:15px; border-radius:999px; color:#fff; background:#685a56; }
.support-screen { padding-bottom:calc(42px + var(--safe-bottom)); background:radial-gradient(circle at 78% 11%,rgba(232,205,207,.58),transparent 31%),radial-gradient(circle at 8% 78%,rgba(215,227,226,.58),transparent 35%),linear-gradient(155deg,#faf7f3,#eae1da); }
.support-screen:before { content:""; position:fixed; width:310px; height:310px; left:50%; top:125px; transform:translateX(-50%); border-radius:50%; background:rgba(255,255,255,.4); filter:blur(48px); pointer-events:none; }
.support-header { position:sticky; top:0; background:linear-gradient(180deg,rgba(248,244,240,.93),rgba(248,244,240,.68)); backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px); }
.support-hero { min-height:calc(100vh - 80px); min-height:calc(100dvh - 80px); padding:34px 24px calc(35px + var(--safe-bottom)); text-align:center; position:relative; z-index:1; }
.support-moon-mark { width:116px; height:116px; margin:2px auto 30px; display:grid; place-items:center; border-radius:50%; position:relative; color:#86716c; background:linear-gradient(145deg,rgba(255,255,255,.84),rgba(235,217,216,.58)); border:1px solid rgba(255,255,255,.92); box-shadow:0 28px 70px rgba(83,59,54,.12),inset 0 0 35px rgba(255,255,255,.72); }
.support-moon-mark:before,.support-moon-mark:after { content:""; position:absolute; border:1px solid rgba(151,119,113,.18); border-radius:50%; }
.support-moon-mark:before { inset:-13px; animation:supportOrbit 4.8s ease-in-out infinite; }
.support-moon-mark:after { inset:-26px; border-color:rgba(151,119,113,.08); animation:supportOrbit 5.8s ease-in-out infinite reverse; }
.support-moon-mark>i { position:absolute; inset:15px; border-radius:50%; background:radial-gradient(circle at 36% 31%,rgba(255,255,255,.96),rgba(220,196,197,.48) 56%,rgba(183,143,140,.18)); filter:blur(.2px); }
.support-moon-mark>span { position:relative; font-family:Georgia,serif; font-size:45px; transform:translateX(2px); animation:supportMoonFloat 3.8s ease-in-out infinite; }
.support-moon-mark>b { position:absolute; right:19px; bottom:19px; color:#ad8582; font-family:Georgia,serif; font-size:13px; font-weight:400; animation:supportHeart 2.4s ease-in-out infinite; }
@keyframes supportOrbit { 50% { transform:scale(1.035) rotate(8deg); opacity:.55; } }
@keyframes supportMoonFloat { 50% { transform:translate(2px,-4px) rotate(-3deg); text-shadow:0 9px 18px rgba(111,78,72,.16); } }
@keyframes supportHeart { 40% { transform:scale(1.22) rotate(-8deg); } 65% { transform:scale(.96); } }
.support-eyebrow { color:#9c8d86; font-size:7px; letter-spacing:.28em; }
.support-hero h1 { margin:12px 0 13px; font:400 35px/1.15 Baskerville,"Songti SC","STSong",serif; letter-spacing:.01em; }
.support-lead { margin:0 auto; color:#6f625d; font:500 14px/1.75 "Songti SC","STSong",serif; }
.support-letter { max-width:400px; margin:25px auto 27px; padding:20px 18px; border-radius:25px; color:#81736d; background:rgba(255,255,255,.48); border:1px solid rgba(255,255,255,.78); box-shadow:0 20px 52px rgba(79,60,54,.07); }
.support-letter p { margin:0 0 13px; font-size:10px; line-height:1.9; }
.support-letter p:last-child { margin-bottom:0; }
.support-letter strong { color:#5f534e; font-family:"Songti SC","STSong",serif; font-size:11px; font-weight:500; }
.support-coffee-button,.support-complete-button { width:100%; min-height:56px; padding:0 20px; display:flex; align-items:center; justify-content:space-between; border-radius:999px; color:#fff; background:linear-gradient(115deg,#514844,#7d6863 62%,#a18480); box-shadow:0 17px 37px rgba(77,57,52,.2),inset 0 1px rgba(255,255,255,.17); }
.support-coffee-button span { margin:auto; padding-left:14px; font:500 14px "Songti SC","STSong",serif; }
.support-coffee-button i,.support-complete-button i { font-style:normal; opacity:.8; }
.support-coffee-button:active,.support-complete-button:active { transform:scale(.985); }
.support-no-pressure { display:block; margin-top:12px; color:#9e918a; font-size:7px; letter-spacing:.04em; }
.support-payment-card { margin:-8px 18px 0; padding:25px 20px 23px; border-radius:31px; position:relative; z-index:2; background:linear-gradient(145deg,rgba(255,255,255,.76),rgba(245,236,230,.68)); border:1px solid rgba(255,255,255,.92); box-shadow:0 28px 80px rgba(77,56,50,.14); animation:supportReveal .72s cubic-bezier(.2,.8,.2,1) both; }
@keyframes supportReveal { from { opacity:0; transform:translateY(22px) scale(.98); } }
.support-payment-heading { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.support-payment-heading span { color:#9b8c85; font-size:7px; letter-spacing:.2em; }
.support-payment-heading h2 { margin:6px 0 0; font:500 22px "Songti SC","STSong",serif; }
.support-payment-heading>i { width:43px; height:43px; display:grid; place-items:center; border-radius:50%; color:#a07e79; background:rgba(255,255,255,.64); font:normal 20px Georgia,serif; }
.support-qr-frame { width:min(72vw,276px); aspect-ratio:1; margin:0 auto; padding:13px; display:grid; place-items:center; position:relative; border-radius:31px; overflow:hidden; background:rgba(249,246,242,.82); border:1px solid rgba(119,95,86,.1); box-shadow:inset 0 0 0 7px rgba(255,255,255,.45),0 18px 42px rgba(69,51,46,.09); }
.support-qr-frame>img { width:100%; height:100%; display:block; object-fit:contain; border-radius:20px; }
.support-payment-switch { position:absolute; right:19px; bottom:19px; z-index:2; min-height:24px; padding:0 9px; border:1px solid rgba(255,255,255,.9); border-radius:999px; color:#735f59; background:rgba(255,251,247,.9); box-shadow:0 5px 14px rgba(71,50,45,.15); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); font-size:7px; letter-spacing:.02em; }
.support-payment-switch:active { transform:scale(.96); }
.support-payment-note { max-width:350px; margin:20px auto 22px; color:#81736d; font-size:9px; line-height:1.85; text-align:left; }
.support-payment-note h3 { margin:0 0 12px; color:#5f514b; font:500 18px/1.3 "Songti SC","STSong",serif; }
.support-payment-note p { margin:0 0 9px; }
.support-payment-note p:last-child { margin-bottom:0; }
.support-form { padding-top:18px; border-top:1px solid rgba(101,82,74,.1); }
.support-form label { display:flex; align-items:center; justify-content:space-between; color:#756964; font-size:10px; }
.support-form label small { color:#a1958f; font-size:8px; }
.support-form textarea { width:100%; min-height:120px; margin-top:10px; padding:15px; border:1px solid rgba(104,84,76,.1); border-radius:20px; outline:0; resize:none; color:#625650; background:rgba(255,255,255,.6); font-size:11px; line-height:1.7; }
.support-form textarea:focus { border-color:rgba(143,110,104,.27); box-shadow:0 0 0 4px rgba(152,119,113,.06); }
.support-form-meta { margin:7px 2px 18px; display:flex; justify-content:space-between; gap:10px; color:#a1958f; font-size:7px; }
.support-form-meta i { font-style:normal; text-align:right; }
.support-complete-button { min-height:52px; }
.support-complete-button span { margin:auto; padding-left:14px; font:500 12px "Songti SC","STSong",serif; }
.support-verification-note { margin:12px 4px 0; color:#a0948d; font-size:7px; line-height:1.7; text-align:center; }
.support-success { padding:calc(80px + var(--safe-top)) 27px calc(38px + var(--safe-bottom)); text-align:center; background:radial-gradient(circle at 50% 22%,rgba(239,211,213,.72),transparent 30%),radial-gradient(circle at 15% 88%,rgba(211,226,224,.63),transparent 33%),linear-gradient(155deg,#faf7f3,#e9dfd8); }
.support-success-visual { width:132px; height:132px; margin:0 auto 34px; display:grid; place-items:center; border-radius:50%; position:relative; background:rgba(255,255,255,.63); border:1px solid rgba(255,255,255,.9); box-shadow:0 28px 65px rgba(82,59,53,.13); }
.support-success-visual:before,.support-success-visual:after { content:""; position:absolute; border-radius:50%; border:1px solid rgba(142,109,102,.13); animation:supportGrow 2.8s ease-in-out infinite; }
.support-success-visual:before { inset:-16px; }
.support-success-visual:after { inset:-32px; animation-delay:.55s; }
@keyframes supportGrow { 0%,100% { transform:scale(.96); opacity:.38; } 50% { transform:scale(1.04); opacity:.8; } }
.support-success-visual>i { position:absolute; width:2px; height:30px; left:50%; bottom:21px; border-radius:2px; background:linear-gradient(#a98c84,#708f82); transform:translateX(-50%); }
.support-success-visual>span { position:relative; margin-top:-22px; color:#89716c; font:42px Georgia,serif; }
.support-success-visual>b { position:absolute; right:26px; top:26px; color:#ae827e; font:400 14px Georgia,serif; }
.support-success h1 { max-width:420px; margin:13px auto 25px; font:400 31px/1.2 Baskerville,"Songti SC","STSong",serif; }
.support-success p { max-width:370px; margin:9px auto; color:#81746e; font-size:10px; line-height:1.9; }
.support-success p strong { color:#61544f; font:500 15px "Songti SC","STSong",serif; }
.support-success .support-final-thanks { margin-top:22px; color:#6b5d58; font:500 14px "Songti SC","STSong",serif; }
.support-success>button { width:100%; margin-top:31px; padding:15px; border-radius:999px; color:#fff; background:linear-gradient(115deg,#554a46,#88706b); box-shadow:0 16px 35px rgba(77,57,52,.17); }
.glossary-screen { padding-bottom:calc(48px + var(--safe-bottom)); background:linear-gradient(160deg,rgba(249,246,241,.99),rgba(235,226,217,.98)); overflow-x:hidden; }
.glossary-screen:before { content:""; position:fixed; width:260px; height:260px; top:70px; left:50%; transform:translateX(-50%); border-radius:50%; background:rgba(226,204,201,.25); filter:blur(74px); pointer-events:none; }
.glossary-header { position:sticky; top:0; z-index:18; background:linear-gradient(180deg,rgba(247,243,238,.94),rgba(247,243,238,.72)); backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px); border-bottom:1px solid rgba(255,255,255,.48); }
.glossary-hero { min-height:338px; padding:54px 25px 27px; position:relative; overflow:hidden; }
.glossary-hero:before { content:"G"; position:absolute; right:-7px; top:1px; color:rgba(107,89,82,.045); font-family:Baskerville,"Times New Roman",serif; font-size:238px; line-height:1; }
.glossary-hero:after { content:"☾"; position:absolute; right:30px; bottom:31px; color:rgba(118,91,87,.1); font-family:serif; font-size:61px; }
.glossary-hero>span { color:#a0938c; font-size:7px; letter-spacing:.25em; }
.glossary-hero h1 { max-width:420px; margin:20px 0 22px; font-family:Baskerville,"Songti SC","STSong",serif; font-size:43px; font-weight:400; letter-spacing:.015em; line-height:.95; position:relative; }
.glossary-hero h1 small { display:block; margin-bottom:8px; color:#8e7d75; font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","PingFang SC",sans-serif; font-size:9px; font-weight:500; letter-spacing:.34em; line-height:1; }
.glossary-hero h1 b { color:#a88481; font-family:"Songti SC","STSong",serif; font-size:25px; font-weight:400; vertical-align:top; }
.glossary-hero>p { max-width:430px; margin:0; color:#7f726c; font-family:"Songti SC","STSong",serif; font-size:11px; line-height:2; text-align:justify; position:relative; z-index:1; }
.glossary-edition { margin-top:25px; padding-top:14px; display:flex; justify-content:space-between; gap:12px; border-top:1px solid rgba(79,62,56,.12); color:#9a8d86; font-size:6px; letter-spacing:.15em; position:relative; z-index:1; }
.glossary-edition em { flex:0 0 auto; font-style:normal; }
.glossary-search-dock { padding:10px 18px 14px; position:sticky; top:calc(59px + var(--safe-top)); z-index:15; background:linear-gradient(180deg,rgba(242,236,230,.96),rgba(242,236,230,.82) 82%,rgba(242,236,230,0)); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); }
.glossary-search-box { height:52px; padding:0 13px; display:grid; grid-template-columns:24px minmax(0,1fr) 28px; align-items:center; border-radius:20px; background:rgba(255,255,255,.72); border:1px solid rgba(255,255,255,.9); box-shadow:0 14px 35px rgba(75,58,52,.075); }
.glossary-search-box>span { color:#8f817a; font-size:18px; }
.glossary-search-box input { width:100%; border:0; outline:0; background:transparent; font-size:11px; }
.glossary-search-box input::-webkit-search-cancel-button { -webkit-appearance:none; appearance:none; }
.glossary-search-box input::placeholder { color:#a39791; }
.glossary-search-clear { width:27px; height:27px; border-radius:50%; color:#8d7e77; background:rgba(233,225,219,.72); opacity:0; pointer-events:none; transition:.2s ease; }
.glossary-search-clear.visible { opacity:1; pointer-events:auto; }
.glossary-categories { margin:9px -18px 0; padding:0 18px 5px; display:flex; gap:7px; overflow-x:auto; scrollbar-width:none; }
.glossary-categories::-webkit-scrollbar { display:none; }
.glossary-categories button { flex:0 0 auto; padding:8px 12px; border-radius:999px; color:#857771; background:rgba(255,255,255,.34); border:1px solid rgba(255,255,255,.65); font-size:8px; white-space:nowrap; }
.glossary-categories button.active { color:#fff; background:#74635e; border-color:#74635e; box-shadow:0 8px 18px rgba(82,61,55,.13); }
.glossary-results-heading { margin:8px 21px 4px; padding:17px 1px 14px; display:flex; justify-content:space-between; align-items:end; border-bottom:1px solid rgba(71,55,49,.12); }
.glossary-results-heading span { color:#9c8f88; font-size:7px; letter-spacing:.24em; }
.glossary-results-heading h2 { margin:4px 0 0; font-family:"Songti SC","STSong",serif; font-size:23px; font-weight:500; }
.glossary-results-heading p { margin:0; color:#a0948e; font-size:7px; }
.glossary-list { padding:0 17px; }
.glossary-entry { margin:0; scroll-margin-top:164px; border-bottom:1px solid rgba(75,59,53,.105); transition:margin .35s ease,background .35s ease,box-shadow .35s ease,border-radius .35s ease; }
.glossary-entry>summary { min-height:104px; padding:19px 5px 18px; display:grid; grid-template-columns:32px minmax(0,1fr) 31px; gap:10px; align-items:start; list-style:none; cursor:pointer; }
.glossary-entry>summary::-webkit-details-marker { display:none; }
.glossary-entry>summary:focus { outline:none; }
.glossary-entry>summary:focus-visible { border-radius:20px; box-shadow:inset 0 0 0 1px rgba(116,99,94,.28); }
.glossary-entry-number { padding-top:4px; color:#aa9d96; font-family:Baskerville,"Times New Roman",serif; font-size:9px; letter-spacing:.08em; }
.glossary-entry-heading { min-width:0; display:block; }
.glossary-entry-heading small { display:block; color:#a1938c; font-size:6px; letter-spacing:.15em; }
.glossary-entry-heading strong { display:block; margin:5px 0 7px; font-family:"Songti SC","STSong",serif; font-size:20px; font-weight:500; line-height:1.25; }
.glossary-entry-heading em { display:-webkit-box; overflow:hidden; color:#8c7f79; font-size:8px; font-style:normal; line-height:1.65; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.glossary-entry-toggle { width:29px; height:29px; display:grid; place-items:center; border-radius:50%; color:#8e7e77; background:rgba(255,255,255,.58); border:1px solid rgba(255,255,255,.8); font-size:15px; font-style:normal; transition:transform .35s ease,background .35s ease,color .35s ease; }
.glossary-entry[open] { margin:10px 0; border:1px solid rgba(255,255,255,.82); border-radius:24px; background:rgba(255,255,255,.56); box-shadow:0 18px 46px rgba(77,59,53,.075); }
.glossary-entry[open]>summary { min-height:92px; padding:20px 17px 15px; }
.glossary-entry[open] .glossary-entry-toggle { color:#fff; background:#796762; transform:rotate(45deg); }
.glossary-entry-body { padding:2px 18px 22px 59px; animation:glossaryBodyIn .45s ease both; }
@keyframes glossaryBodyIn { from { opacity:0; transform:translateY(6px); } }
.glossary-entry-body>p,.glossary-callout p { margin:0 0 13px; color:#5f5550; font-family:"Songti SC","STSong",serif; font-size:12px; line-height:1.95; }
.glossary-entry-body>p:last-child,.glossary-callout p:last-child { margin-bottom:0; }
.glossary-entry-body .glossary-quote { padding:10px 13px; border-left:2px solid rgba(152,115,110,.55); color:#786662; background:rgba(238,228,223,.56); font-size:12px; }
.glossary-entry-body .glossary-comparison { padding:10px 12px; border-radius:13px; color:#675955; background:rgba(237,230,224,.64); font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","PingFang SC",sans-serif; font-size:10px; line-height:1.75; }
.glossary-callout { margin:19px 0; padding:15px 16px 14px; border-radius:18px; background:linear-gradient(140deg,rgba(238,220,219,.74),rgba(250,246,242,.72)); border:1px solid rgba(255,255,255,.84); }
.glossary-callout>span { display:block; margin-bottom:10px; color:#9b7775; font-size:7px; letter-spacing:.18em; text-transform:uppercase; }
.glossary-callout p { color:#6f605c; font-size:11px; }
.glossary-callout.confusion { background:linear-gradient(140deg,rgba(222,229,228,.8),rgba(249,246,242,.72)); }
.glossary-callout.confusion>span { color:#6e8a85; }
.glossary-callout.attention { background:linear-gradient(140deg,rgba(236,225,207,.82),rgba(250,246,242,.72)); }
.glossary-callout.attention>span { color:#9b7f56; }
.glossary-related { margin-top:20px; padding-top:15px; border-top:1px solid rgba(79,61,55,.11); }
.glossary-related>span { display:block; margin-bottom:9px; color:#9c8e87; font-size:7px; letter-spacing:.16em; }
.glossary-related>div { display:flex; flex-wrap:wrap; gap:7px; }
.glossary-related button { padding:8px 10px; border-radius:999px; color:#776963; background:rgba(240,233,227,.82); border:1px solid rgba(255,255,255,.82); font-size:8px; }
.glossary-related button i { margin-left:4px; color:#a58d87; font-style:normal; }
.glossary-closing-note { margin:27px 1px 10px; padding:25px 22px; border-radius:27px; color:#fff; background:linear-gradient(145deg,#7b6964,#9a7e7c 58%,#6e696d); box-shadow:0 22px 50px rgba(73,55,51,.17); position:relative; overflow:hidden; }
.glossary-closing-note:after { content:"☾"; position:absolute; right:-8px; bottom:-28px; color:rgba(255,255,255,.09); font-size:110px; }
.glossary-closing-note>span { display:block; margin-bottom:15px; color:rgba(255,255,255,.65); font-size:7px; letter-spacing:.25em; }
.glossary-closing-note p { margin:0 0 11px; color:rgba(255,255,255,.83); font-family:"Songti SC","STSong",serif; font-size:11px; line-height:1.85; position:relative; z-index:1; }
.glossary-empty { min-height:320px; padding:55px 24px; text-align:center; }
.glossary-empty>span { width:54px; height:54px; margin:auto; display:grid; place-items:center; border-radius:50%; color:#947e79; background:rgba(255,255,255,.65); font-size:21px; }
.glossary-empty h2 { margin:17px 0 8px; font-family:"Songti SC","STSong",serif; font-size:20px; font-weight:500; }
.glossary-empty p { max-width:280px; margin:auto; color:#958882; font-size:9px; line-height:1.8; }
.luna-toast { position:fixed; z-index:100; left:50%; bottom:calc(20px + var(--safe-bottom)); transform:translate(-50%,20px); max-width:calc(100% - 36px); padding:10px 15px; border-radius:999px; background:rgba(55,47,44,.9); color:#fff; opacity:0; pointer-events:none; transition:.3s; font-size:9px; white-space:nowrap; }
.luna-toast.show { opacity:1; transform:translate(-50%,0); }
@media(min-width:680px){ .luna-shell,.world-screen{box-shadow:0 0 70px rgba(59,46,41,.18)} }
@media(max-width:360px){ .world-header { padding-left:12px; padding-right:12px; } .world-header-actions { gap:4px; } .world-share-entry { width:33px; height:33px; } .support-entry-button { min-width:54px; padding:8px 8px; font-size:7px; } .support-entry-button span { display:none; } .support-hero { padding-inline:18px; } .support-hero h1 { font-size:32px; } .support-payment-card { margin-inline:12px; padding-inline:15px; } .support-success h1 { font-size:27px; } .article-hero { padding-left:20px; padding-right:20px; }.article-hero h1{font-size:32px}.article-paper{padding-left:18px;padding-right:18px}.directory-group>div{grid-template-columns:1fr}.share-luna-hero{padding-left:18px;padding-right:18px} }
@media(max-width:360px){ .product-oval-window{width:72px;height:104px}.product-packshot-window{height:128px}.product-packshot-window img{inset:8px 14px 11px;width:calc(100% - 28px);height:calc(100% - 19px)}#product-screen.is-gel .detail-product-image{width:144px;height:207px}.world-content{padding-left:14px;padding-right:14px}.facet-tabs{margin-left:-14px;margin-right:-14px;padding-left:14px}.product-grid{gap:8px}.glossary-hero{padding-left:20px;padding-right:20px}.glossary-hero h1{font-size:37px}.glossary-search-dock{padding-left:14px;padding-right:14px}.glossary-categories{margin-left:-14px;margin-right:-14px;padding-left:14px;padding-right:14px}.glossary-entry>summary{grid-template-columns:28px minmax(0,1fr) 29px;gap:7px}.glossary-entry[open]>summary{padding-left:13px;padding-right:13px}.glossary-entry-body{padding-left:48px;padding-right:14px}.glossary-results-heading{margin-left:17px;margin-right:17px}.glossary-list{padding-left:13px;padding-right:13px} }
@media(prefers-reduced-motion:reduce){ .news-screen[data-theme="chanel"] .news-reader-hero.is-poster>img{animation:none}.support-moon-mark:before,.support-moon-mark:after,.support-moon-mark>span,.support-moon-mark>b,.support-success-visual:before,.support-success-visual:after,.share-luna-symbol i{animation:none} }

/* 2026-08-25 · editorial identity refinement */
html,body { width:100%; max-width:100%; overflow-x:hidden; overscroll-behavior:none; touch-action:pan-y; }
button,a,input,textarea { touch-action:manipulation; }
.luna-shell,.world-screen { max-width:520px; }
.world-header { min-height:calc(72px + var(--safe-top)); grid-template-columns:44px minmax(0,1fr) auto; padding-inline:14px; }
.world-brand-title { position:absolute; left:50%; top:calc(var(--safe-top) + 7px); transform:translateX(-50%); min-width:142px; padding:7px 20px 8px; text-align:center; isolation:isolate; }
.world-brand-title::selection,.world-brand-title *::selection { background:transparent; }
.world-brand-title::before,.world-brand-title::after { content:""; position:absolute; top:50%; width:15px; height:1px; background:rgba(127,104,94,.28); }
.world-brand-title::before { left:0; }
.world-brand-title::after { right:0; }
.world-header .world-brand-title span { font-family:Baskerville,"Times New Roman",serif; font-size:8px; letter-spacing:.32em; text-shadow:0 1px rgba(255,255,255,.75); }
.world-header .world-brand-title strong { margin-top:4px; font-family:Baskerville,"Songti SC","STSong",serif; font-size:19px; letter-spacing:.08em; text-shadow:0 1px rgba(255,255,255,.72),0 7px 18px rgba(86,60,52,.08); }
.world-header-actions { grid-column:3; justify-self:end; position:relative; z-index:2; }
.support-entry-button { width:88px; height:39px; min-width:0; padding:0; position:relative; overflow:hidden; border:0; border-radius:999px; background:transparent; box-shadow:0 8px 22px rgba(83,57,54,.09); }
.support-entry-button img { width:100%; height:100%; display:block; object-fit:contain; pointer-events:none; }
.support-entry-button::after { content:""; position:absolute; top:-30%; bottom:-30%; left:-38%; width:24%; transform:skewX(-18deg); background:rgba(255,255,255,.58); filter:blur(2px); animation:supportSheen 3.6s ease-in-out infinite; pointer-events:none; }
@keyframes supportSheen { 0%,22% { left:-38%; opacity:0; } 38% { opacity:.85; } 62%,100% { left:118%; opacity:0; } }

.facet-tabs { gap:5px; padding-top:2px; }
.facet-tabs button { flex:0 0 116px; width:116px; height:54px; padding:0; border:0; border-radius:0; background-color:transparent; background-repeat:no-repeat; background-size:contain; background-position:center; color:transparent; overflow:hidden; box-shadow:none; }
.facet-tabs button span,.facet-tabs button small { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.facet-tabs button:nth-child(1) { background-image:url("assets/brand-ui/library-tabs/brand-light.png"); }
.facet-tabs button:nth-child(2) { background-image:url("assets/brand-ui/library-tabs/colour-light.png"); }
.facet-tabs button:nth-child(3) { background-image:url("assets/brand-ui/library-tabs/finish-light.png"); }
.facet-tabs button:nth-child(4) { background-image:url("assets/brand-ui/library-tabs/type-light.png"); }
.facet-tabs button:nth-child(5) { background-image:url("assets/brand-ui/library-tabs/collection-light.png"); }
.facet-tabs button:nth-child(1).active { background-image:url("assets/brand-ui/library-tabs/brand-dark.png"); }
.facet-tabs button:nth-child(2).active { background-image:url("assets/brand-ui/library-tabs/colour-dark.png"); }
.facet-tabs button:nth-child(3).active { background-image:url("assets/brand-ui/library-tabs/finish-dark.png"); }
.facet-tabs button:nth-child(4).active { background-image:url("assets/brand-ui/library-tabs/type-dark.png"); }
.facet-tabs button:nth-child(5).active { background-image:url("assets/brand-ui/library-tabs/collection-dark.png"); }
.facet-tabs button.active { color:transparent; background-color:transparent; background-repeat:no-repeat; background-size:contain; background-position:center; border-color:transparent; }
.facet-tabs button:focus { outline:none; }
.facet-tabs button:focus-visible { filter:drop-shadow(0 0 4px rgba(177,132,65,.62)); }

.world-panel[data-world-panel="notes"] { padding:31px 24px 46px; border:3px double rgba(76,57,49,.26); background:#eee5da; }
.world-panel[data-world-panel="notes"]>.section-heading { padding:13px 4px 22px; align-items:end; border-bottom:3px double rgba(72,53,46,.2); text-align:left; }
.world-panel[data-world-panel="notes"]>.section-heading h2 { margin-top:9px; font:400 33px/1.08 "Songti SC","STSong","Noto Serif CJK SC",serif; letter-spacing:.11em; }
.world-panel[data-world-panel="notes"]>.section-lead { max-width:360px; margin:17px 4px 26px; color:#776860; font:10px/1.9 Baskerville,"Songti SC","STSong",serif; }
.world-panel[data-world-panel="notes"] .note-categories { gap:0; margin:0 0 34px; border-top:1px solid rgba(72,53,46,.2); }
.world-panel[data-world-panel="notes"] .note-categories button { min-height:72px; padding:17px 4px 15px; border:0; border-bottom:1px solid rgba(76,58,51,.15); border-radius:0; background:transparent; box-shadow:none; }
.world-panel[data-world-panel="notes"] .note-categories button:hover,.world-panel[data-world-panel="notes"] .note-categories button:focus-visible { padding-left:12px; transform:none; color:#6f544a; background:rgba(255,255,255,.22); box-shadow:none; }
.world-panel[data-world-panel="notes"] .note-categories button span { color:#8a766b; font-family:Baskerville,"Times New Roman",serif; letter-spacing:.28em; }
.world-panel[data-world-panel="notes"] .note-categories button b { margin-top:8px; font:500 15px Baskerville,"Songti SC","STSong",serif; letter-spacing:.02em; }
.world-panel[data-world-panel="notes"] .note-categories button i { color:#a18d82; font:400 26px Baskerville,"Times New Roman",serif; }
.world-panel[data-world-panel="notes"] .note-card { margin-top:18px; padding:25px 22px; border:3px double rgba(105,73,68,.28); border-radius:0; background:radial-gradient(circle at 10% 0,rgba(255,255,255,.7),transparent 38%),linear-gradient(145deg,rgba(239,220,216,.97),rgba(224,197,193,.94)); box-shadow:inset 0 1px rgba(255,255,255,.66),0 14px 30px rgba(91,62,58,.07); }
.world-panel[data-world-panel="notes"] .note-card:hover { transform:translateY(-4px); border-color:rgba(123,91,70,.35); box-shadow:0 17px 34px rgba(73,55,50,.08); }
.world-panel[data-world-panel="notes"] .note-card.soft-blue { border-color:rgba(79,99,102,.25); background:radial-gradient(circle at 10% 0,rgba(255,255,255,.74),transparent 38%),linear-gradient(145deg,rgba(223,231,232,.97),rgba(199,213,216,.94)); box-shadow:inset 0 1px rgba(255,255,255,.72),0 14px 30px rgba(58,77,81,.07); }
.world-panel[data-world-panel="notes"] .note-card h3 { margin:24px 0 12px; font:500 25px/1.25 Baskerville,"Songti SC","STSong",serif; }
.world-panel[data-world-panel="notes"] .note-card footer span { border:1px solid rgba(88,67,58,.14); border-radius:0; background:transparent; }

.brand-directory-screen { background:#eee5da; }
.directory-header { background:#eee5da; border-bottom:1px solid rgba(76,59,52,.11); backdrop-filter:none; -webkit-backdrop-filter:none; }
.directory-hero { min-height:270px; margin:18px 20px 30px; padding:52px 28px 38px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; border:3px double rgba(76,57,49,.28); background:transparent; overflow:hidden; }
.directory-hero::before { content:"☾   ·   A — Z   ·   ☾"; position:absolute; left:50%; top:19px; transform:translateX(-50%); color:#907d70; font:8px Baskerville,serif; letter-spacing:.22em; white-space:nowrap; }
.directory-hero:after { content:""; width:56px; height:1px; right:auto; top:auto; left:50%; bottom:24px; transform:translateX(-50%); background:rgba(92,72,63,.32); }
.directory-hero>span { color:#8b786d; font-family:Baskerville,"Times New Roman",serif; letter-spacing:.31em; }
.directory-hero h1 { margin:22px 0 13px; font:500 40px/1.1 Baskerville,"Songti SC","STSong",serif; letter-spacing:.08em; }
.directory-hero p { max-width:340px; color:#776860; font-size:10px; line-height:1.9; }
.brand-directory-content { padding:0 24px calc(52px + var(--safe-bottom)); }
.directory-group { margin:0; padding:27px 0 34px; border:0; border-top:1px solid rgba(72,53,46,.23); border-radius:0; background:transparent; box-shadow:none; }
.directory-group:last-child { border-bottom:1px solid rgba(72,53,46,.23); }
.directory-group header { padding:0 0 17px; grid-template-columns:1fr auto; border-bottom:3px double rgba(72,53,46,.2); }
.directory-group header span { color:#8a766b; font-family:Baskerville,"Times New Roman",serif; letter-spacing:.26em; }
.directory-group h2 { margin-top:8px; font:500 28px Baskerville,"Songti SC","STSong",serif; letter-spacing:.06em; }
.directory-group header em { color:#9c887d; }
.directory-group>div { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 28px; }
.directory-group button { min-height:62px; padding:18px 2px 15px; grid-template-columns:20px minmax(0,1fr); gap:10px; border-bottom:1px solid rgba(76,58,51,.13); transition:padding .3s ease,color .3s ease,background .3s ease; }
.directory-group button b { color:#a18d82; font-size:8px; }
.directory-group button span { font:500 15px Baskerville,"Songti SC","STSong",serif; letter-spacing:.02em; }
.directory-group button:hover,.directory-group button:focus-visible { padding-left:9px; color:#6f544a; background:rgba(255,255,255,.22); }
.directory-group button i { display:none; }

@media(max-width:390px) {
  .world-brand-title { min-width:126px; padding-inline:14px; }
  .world-header .world-brand-title strong { font-size:17px; }
  .support-entry-button { width:76px; height:35px; }
  .facet-tabs button { flex-basis:106px; width:106px; height:49px; }
  .world-panel[data-world-panel="notes"] { padding-inline:18px; }
  .directory-hero { margin-inline:14px; padding-inline:18px; }
  .brand-directory-content { padding-inline:18px; }
  .directory-group>div { grid-template-columns:1fr; }
}

@media(max-width:360px) {
  .world-brand-title { min-width:116px; padding-inline:10px; }
  .world-header .world-brand-title strong { font-size:16px; }
  .support-entry-button { width:68px; height:32px; }
}

@media(prefers-reduced-motion:reduce) {
  .support-entry-button::after { animation:none; }
}

/* 2026-08-26 · Nail Bulletin editorial journal */
.world-panel.bulletin-journal { margin:-8px -18px calc(-40px - var(--safe-bottom)); padding:0 18px calc(48px + var(--safe-bottom)); color:#332d2a; background:
  radial-gradient(circle at 88% 3%,rgba(188,165,151,.16),transparent 24%),
  linear-gradient(180deg,#f1eae2 0%,#eee5dc 48%,#f3ece5 100%); }
.bulletin-masthead { padding:22px 0 0; border-top:4px double rgba(53,43,39,.72); }
.bulletin-issue-line { min-height:25px; padding:0 2px 9px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(61,47,42,.42); color:#776860; font:7px/1.2 Baskerville,"Times New Roman",serif; letter-spacing:.25em; }
.bulletin-issue-line time { font-style:normal; }
.bulletin-nameplate { padding:25px 0 22px; display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; position:relative; border-bottom:4px double rgba(53,43,39,.72); }
.bulletin-nameplate small { grid-column:1/-1; margin-bottom:11px; color:#917f75; font:7px/1.2 Baskerville,"Times New Roman",serif; letter-spacing:.31em; }
.bulletin-nameplate h2 { margin:0; color:#2e2927; font:400 clamp(36px,10.4vw,49px)/.82 Baskerville,"Times New Roman",serif; letter-spacing:-.045em; }
.bulletin-nameplate h2 i { display:block; padding-left:26px; font-style:italic; font-weight:400; }
.bulletin-nameplate strong { padding-bottom:3px; writing-mode:vertical-rl; color:#5e504a; font:500 14px/1.15 "Songti SC","STSong",serif; letter-spacing:.22em; }
.bulletin-editorial-deck { padding:16px 2px 15px; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:18px; align-items:end; border-bottom:1px solid rgba(61,47,42,.25); }
.bulletin-editorial-deck p { max-width:300px; margin:0; color:#665a54; font:500 10px/1.85 Baskerville,"Songti SC","STSong",serif; letter-spacing:.025em; }
.bulletin-editorial-deck span { max-width:88px; color:#97847a; font:6px/1.75 Baskerville,"Times New Roman",serif; letter-spacing:.2em; text-align:right; }
.bulletin-section-strip { padding:10px 1px 9px; display:flex; gap:17px; overflow-x:auto; border-bottom:1px solid rgba(61,47,42,.38); color:#7f6f67; font:6px Baskerville,"Times New Roman",serif; letter-spacing:.18em; scrollbar-width:none; white-space:nowrap; }
.bulletin-section-strip::-webkit-scrollbar { display:none; }
.bulletin-lead-section,.bulletin-picks-section,.bulletin-index-section { margin-top:28px; }
.bulletin-section-rule { margin-bottom:12px; padding:0 1px 8px; display:flex; justify-content:space-between; align-items:end; border-bottom:1px solid rgba(61,47,42,.53); }
.bulletin-section-rule span { color:#3d3430; font:8px Baskerville,"Times New Roman",serif; letter-spacing:.24em; }
.bulletin-section-rule em { color:#948178; font:6px Baskerville,"Times New Roman",serif; font-style:normal; letter-spacing:.17em; }
.bulletin-journal .bulletin-feature { min-height:0; padding:0; overflow:visible; border-radius:0; background:transparent; box-shadow:none; }
.bulletin-journal .bulletin-feature-card { min-height:430px; overflow:hidden; border-radius:2px; color:#fff; background:#34363b; box-shadow:0 19px 36px rgba(53,41,36,.16); }
.bulletin-journal .bulletin-feature-card>img { object-position:50% 50%; filter:saturate(.82) contrast(.98); }
.bulletin-journal .bulletin-feature-shade { background:linear-gradient(180deg,rgba(17,19,23,.17) 0%,rgba(18,20,24,.03) 28%,rgba(19,21,26,.23) 53%,rgba(15,17,21,.9) 100%); }
.bulletin-feature-meta { padding:15px 17px 0; display:flex; justify-content:space-between; position:absolute; inset:0 0 auto; z-index:2; color:rgba(255,255,255,.82); font:6px Baskerville,"Times New Roman",serif; letter-spacing:.2em; }
.bulletin-feature-meta small { font:inherit; }
.bulletin-feature-meta time { font-style:normal; }
.bulletin-feature-number { position:absolute; top:30px; right:14px; z-index:1; color:rgba(255,255,255,.25); font:italic 84px/.8 Baskerville,"Times New Roman",serif; }
.bulletin-journal .bulletin-feature-copy { min-height:430px; padding:30px 24px 27px; }
.bulletin-journal .bulletin-feature-copy small { color:rgba(255,255,255,.66); font:6px Baskerville,"Times New Roman",serif; letter-spacing:.29em; }
.bulletin-journal .bulletin-feature-copy strong { max-width:350px; margin:12px 0 11px; font:500 clamp(27px,7.7vw,35px)/1.31 Baskerville,"Songti SC","STSong",serif; letter-spacing:.015em; }
.bulletin-journal .bulletin-feature-copy em { max-width:330px; color:rgba(255,255,255,.77); font:9px/1.75 Baskerville,"Songti SC","STSong",serif; letter-spacing:.035em; }
.bulletin-journal .bulletin-feature-copy>i { width:132px; margin-top:22px; padding:11px 13px; display:flex; align-items:center; justify-content:space-between; border:1px solid rgba(255,255,255,.44); border-radius:0; color:#fff; background:rgba(255,255,255,.08); box-shadow:none; font:7px Baskerville,"Songti SC","STSong",serif; font-style:normal; letter-spacing:.08em; backdrop-filter:blur(9px); }
.bulletin-journal .bulletin-feature-copy>i b { margin:0; font-size:12px; }
.bulletin-journal .bulletin-feature-card:active>img { transform:scale(1.018); filter:saturate(.86) contrast(.98); }
.bulletin-cover-caption { padding:12px 1px 0; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:18px; color:#6e6059; }
.bulletin-cover-caption span { font:8px/1.7 Baskerville,"Songti SC","STSong",serif; }
.bulletin-cover-caption em { max-width:92px; color:#9a877e; font:5px/1.7 Baskerville,"Times New Roman",serif; font-style:normal; letter-spacing:.17em; text-align:right; }
.bulletin-picks { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.bulletin-pick-card { min-width:0; border-bottom:1px solid rgba(61,47,42,.34); }
.bulletin-pick-card>button { width:100%; height:100%; padding:0 0 15px; position:relative; background:transparent; text-align:left; }
.bulletin-pick-media { width:100%; aspect-ratio:.78; display:block; overflow:hidden; position:relative; background:#dcd1c7; }
.bulletin-pick-media img { width:100%; height:100%; display:block; object-fit:cover; filter:saturate(.82); transition:transform .8s cubic-bezier(.2,.8,.2,1),filter .5s ease; }
.bulletin-pick-media.is-packshot { padding:12px; background:linear-gradient(150deg,#e9e0da,#d8cbc4); }
.bulletin-pick-media.is-packshot img { object-fit:contain; filter:drop-shadow(0 10px 10px rgba(56,43,39,.17)) saturate(.84); }
.bulletin-pick-number { position:absolute; top:8px; right:8px; z-index:1; color:rgba(255,255,255,.88); font:italic 24px Baskerville,"Times New Roman",serif; text-shadow:0 2px 8px rgba(35,28,25,.28); }
.bulletin-pick-copy { display:block; padding:11px 1px 0; }
.bulletin-pick-copy>span,.bulletin-story-copy>span { display:flex; justify-content:space-between; gap:8px; align-items:center; }
.bulletin-pick-copy small,.bulletin-story-copy small { color:#8f7b72; font:6px Baskerville,"Times New Roman",serif; letter-spacing:.18em; }
.bulletin-pick-copy time,.bulletin-story-copy time { color:#9c8b82; font:6px Baskerville,"Times New Roman",serif; }
.bulletin-pick-copy strong { min-height:48px; display:block; margin:9px 0 7px; font:500 16px/1.45 Baskerville,"Songti SC","STSong",serif; }
.bulletin-pick-copy em { display:-webkit-box; min-height:37px; overflow:hidden; color:#81736c; font:7px/1.7 Baskerville,"Songti SC","STSong",serif; font-style:normal; -webkit-line-clamp:3; -webkit-box-orient:vertical; }
.bulletin-pick-copy>i { margin-top:13px; display:flex; justify-content:space-between; color:#76665f; font:6px Baskerville,"Times New Roman",serif; font-style:normal; letter-spacing:.2em; }
.bulletin-pick-copy>i b { font-size:10px; font-weight:400; }
.bulletin-pick-card>button:active .bulletin-pick-media img { transform:scale(1.025); filter:saturate(.88); }
.bulletin-journal .bulletin-list { margin-top:0; border-top:0; }
.bulletin-journal .bulletin-list article { border-bottom:1px solid rgba(61,47,42,.34); }
.bulletin-journal .bulletin-list article>button { min-height:145px; padding:15px 0; grid-template-columns:29px minmax(0,1fr) 74px 12px; gap:10px; align-items:center; }
.bulletin-index-number { align-self:start; padding-top:1px; color:#9c877d; font:italic 18px Baskerville,"Times New Roman",serif; }
.bulletin-journal .bulletin-story-copy strong { margin:9px 0 7px; font:500 16px/1.42 Baskerville,"Songti SC","STSong",serif; }
.bulletin-journal .bulletin-story-copy em { color:#81736c; font:7px/1.7 Baskerville,"Songti SC","STSong",serif; -webkit-line-clamp:3; }
.bulletin-journal .bulletin-thumb { width:74px; height:98px; border-radius:0; background:#dbd1c9; box-shadow:none; }
.bulletin-journal .bulletin-thumb img { filter:saturate(.82); }
.bulletin-journal .bulletin-thumb.is-packshot { padding:8px; border-radius:0; background:linear-gradient(145deg,#e7ddd6,#d8ccc5); }
.bulletin-journal .bulletin-list article>button>i { color:#786860; font-size:12px; }
.bulletin-colophon { margin-top:34px; padding:15px 1px 0; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; border-top:4px double rgba(53,43,39,.65); color:#75655e; font:6px Baskerville,"Times New Roman",serif; letter-spacing:.19em; }
.bulletin-colophon i { color:#9b7d73; font:17px Baskerville,serif; font-style:normal; }
.bulletin-colophon em { justify-self:end; font-style:normal; }
.bulletin-masthead,.bulletin-lead-section,.bulletin-picks-section,.bulletin-index-section,.bulletin-colophon { animation:bulletinJournalRise .75s cubic-bezier(.2,.8,.2,1) both; }
.bulletin-lead-section { animation-delay:.08s; }
.bulletin-picks-section { animation-delay:.15s; }
.bulletin-index-section { animation-delay:.22s; }
.bulletin-colophon { animation-delay:.29s; }
@keyframes bulletinJournalRise { from { opacity:0; transform:translateY(15px); } }

@media(max-width:390px) {
  .world-panel.bulletin-journal { margin-inline:-14px; padding-inline:14px; }
  .bulletin-nameplate h2 { font-size:37px; }
  .bulletin-journal .bulletin-feature-card,.bulletin-journal .bulletin-feature-copy { min-height:404px; }
  .bulletin-picks { gap:10px; }
  .bulletin-pick-copy strong { min-height:44px; font-size:14px; }
  .bulletin-journal .bulletin-list article>button { grid-template-columns:25px minmax(0,1fr) 66px 10px; gap:8px; }
  .bulletin-journal .bulletin-thumb { width:66px; height:90px; }
}

@media(max-width:350px) {
  .bulletin-editorial-deck { grid-template-columns:1fr; gap:9px; }
  .bulletin-editorial-deck span { max-width:none; text-align:left; }
  .bulletin-journal .bulletin-feature-copy { padding-inline:20px; }
  .bulletin-pick-copy em { -webkit-line-clamp:2; }
  .bulletin-journal .bulletin-list article>button { grid-template-columns:23px minmax(0,1fr) 58px; }
  .bulletin-journal .bulletin-thumb { width:58px; height:82px; }
  .bulletin-journal .bulletin-list article>button>i { display:none; }
}

@media(prefers-reduced-motion:reduce) {
  .bulletin-masthead,.bulletin-lead-section,.bulletin-picks-section,.bulletin-index-section,.bulletin-colophon { animation:none; }
  .bulletin-journal .bulletin-feature-card>img,.bulletin-pick-media img { transition:none; }
}

/* =========================================================
   LUNA NAIL BULLETIN
   EDITORIAL STORIES · 02—05
   ========================================================= */

   .bulletin-picks {
    display:grid;
    grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
    gap:clamp(22px,5.5vw,42px);
    align-items:start;
  }
  
  /* ---------------------------------------------------------
     Shared editorial story
     --------------------------------------------------------- */
  
  .bulletin-editorial-story {
    min-width:0;
  }
  
  .bulletin-editorial-story button {
    width:100%;
    padding:0;
    display:block;
    color:inherit;
    background:transparent;
    text-align:left;
  }
  
  .bulletin-editorial-image,
  .bulletin-archive-image {
    overflow:hidden;
    position:relative;
    background:#ded4cc;
  }
  
  .bulletin-editorial-image img,
  .bulletin-archive-image img {
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    filter:saturate(.76) contrast(.96);
    transition:
      transform .9s cubic-bezier(.18,.75,.22,1),
      filter .6s ease;
  }
  
  .bulletin-editorial-story button:hover img {
    transform:scale(1.018);
    filter:saturate(.84) contrast(.98);
  }
  
  .bulletin-editorial-number {
    color:#76645b;
    font:italic 39px/.9 Baskerville,"Times New Roman",serif;
    font-weight:400;
  }
  
  .bulletin-editorial-meta {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
  }
  
  .bulletin-editorial-meta small,
  .bulletin-editorial-meta time {
    color:#8d7a70;
    font:6px/1.3 Baskerville,"Times New Roman",serif;
    font-style:normal;
    letter-spacing:.19em;
  }
  
  .bulletin-editorial-copy h3 {
    margin:0;
    color:#342d2a;
    font-family:Baskerville,"Songti SC","STSong",serif;
    font-weight:400;
    letter-spacing:-.015em;
  }
  
  .bulletin-editorial-copy p {
    margin:0;
    color:#756861;
    font:8px/1.85 Baskerville,"Songti SC","STSong",serif;
    letter-spacing:.015em;
  }
  
  .bulletin-editorial-link {
    display:flex;
    align-items:center;
    justify-content:space-between;
    color:#75655e;
    font:6px/1 Baskerville,"Times New Roman",serif;
    letter-spacing:.21em;
  }
  
  .bulletin-editorial-link i {
    font-size:12px;
    font-style:normal;
    letter-spacing:0;
  }
  
  
  /* ---------------------------------------------------------
     Story 02 · portrait feature
     --------------------------------------------------------- */
  
  .bulletin-editorial-story--portrait {
    padding-right:2px;
  }
  
  .bulletin-editorial-story--portrait .bulletin-editorial-image {
    aspect-ratio:.79;
  }
  
  .bulletin-editorial-story--portrait .bulletin-editorial-number {
    position:absolute;
    top:12px;
    right:13px;
    z-index:2;
    color:rgba(255,255,255,.88);
    font-size:35px;
    text-shadow:0 3px 14px rgba(30,23,20,.18);
  }
  
  .bulletin-editorial-story--portrait .bulletin-editorial-copy {
    padding:17px 1px 20px;
    border-bottom:1px solid rgba(61,47,42,.35);
  }
  
  .bulletin-editorial-story--portrait .bulletin-editorial-meta {
    margin-bottom:17px;
  }
  
  .bulletin-editorial-story--portrait .bulletin-editorial-copy h3 {
    max-width:96%;
    font-size:clamp(19px,4.6vw,25px);
    line-height:1.38;
  }
  
  .bulletin-editorial-story--portrait .bulletin-editorial-copy p {
    max-width:92%;
    margin-top:14px;
  }
  
  .bulletin-editorial-story--portrait .bulletin-editorial-link {
    margin-top:27px;
    padding-top:13px;
    border-top:1px solid rgba(61,47,42,.15);
  }
  
  
  /* ---------------------------------------------------------
     Story 03 · archive composition
     --------------------------------------------------------- */
  
  .bulletin-editorial-story--archive {
    margin-top:54px;
  }
  
  .bulletin-archive-heading {
    margin-bottom:11px;
    padding-bottom:10px;
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:14px;
    align-items:end;
    border-bottom:1px solid rgba(61,47,42,.34);
  }
  
  .bulletin-archive-heading .bulletin-editorial-meta {
    padding-bottom:2px;
  }
  
  .bulletin-archive-image {
    aspect-ratio:1.02;
  }
  
  .bulletin-archive-image.is-packshot {
    padding:23px;
    background:
      radial-gradient(circle at 50% 42%,rgba(255,255,255,.48),transparent 46%),
      #ddd2ca;
  }
  
  .bulletin-archive-image.is-packshot img {
    object-fit:contain;
    filter:drop-shadow(0 15px 18px rgba(46,35,31,.14)) saturate(.8);
  }
  
  .bulletin-editorial-story--archive .bulletin-editorial-copy {
    padding-top:19px;
  }
  
  .bulletin-editorial-story--archive .bulletin-editorial-copy h3 {
    font-size:clamp(18px,4.2vw,23px);
    line-height:1.42;
  }
  
  .bulletin-editorial-story--archive .bulletin-editorial-copy p {
    margin-top:13px;
  }
  
  .bulletin-editorial-story--archive .bulletin-editorial-link {
    margin-top:30px;
    padding-bottom:15px;
    border-bottom:1px solid rgba(61,47,42,.35);
  }
  
  
  /* =========================================================
     NEWS INDEX
     ========================================================= */
  
  .bulletin-journal .bulletin-list {
    margin-top:0;
    border:0;
  }
  
  .bulletin-index-entry {
    border-bottom:1px solid rgba(61,47,42,.42);
  }
  
  .bulletin-index-entry:first-child {
    border-top:0;
  }
  
  .bulletin-index-entry > button {
    width:100%;
    min-height:185px;
    padding:26px 0 27px;
    display:grid;
    grid-template-columns:
      50px
      minmax(0,1fr)
      clamp(82px,23vw,112px);
    gap:clamp(15px,4vw,29px);
    align-items:center;
    color:inherit;
    background:transparent;
    text-align:left;
  }
  
  .bulletin-index-side {
    height:100%;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    align-items:flex-start;
  }
  
  .bulletin-index-number {
    padding:0;
    color:#9a8479;
    font:italic clamp(27px,7vw,38px)/.9 Baskerville,"Times New Roman",serif;
  }
  
  .bulletin-index-side small {
    writing-mode:vertical-rl;
    transform:rotate(180deg);
    color:#9b887e;
    font:5px/1 Baskerville,"Times New Roman",serif;
    letter-spacing:.19em;
  }
  
  .bulletin-index-main {
    min-width:0;
    align-self:center;
  }
  
  .bulletin-index-meta {
    margin-bottom:18px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    color:#a08b80;
    font:5px/1.2 Baskerville,"Times New Roman",serif;
    letter-spacing:.16em;
  }
  
  .bulletin-index-meta time {
    font-style:normal;
  }
  
  .bulletin-index-main h3 {
    max-width:400px;
    margin:0;
    color:#342d2a;
    font:400 clamp(18px,4.5vw,25px)/1.38 Baskerville,"Songti SC","STSong",serif;
    letter-spacing:-.012em;
  }
  
  .bulletin-index-main p {
    max-width:390px;
    margin:13px 0 0;
    color:#776a63;
    font:7px/1.75 Baskerville,"Songti SC","STSong",serif;
  }
  
  .bulletin-index-read {
    width:max-content;
    margin-top:24px;
    display:flex;
    align-items:center;
    gap:13px;
    color:#74645d;
    font:5.5px/1 Baskerville,"Times New Roman",serif;
    letter-spacing:.22em;
  }
  
  .bulletin-index-read i {
    font-size:11px;
    font-style:normal;
  }
  
  .bulletin-index-image {
    width:100%;
    aspect-ratio:.77;
    overflow:hidden;
    position:relative;
    background:#ddd3cb;
  }
  
  .bulletin-index-image img {
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    filter:saturate(.74) contrast(.96);
    transition:
      transform .9s cubic-bezier(.18,.75,.22,1),
      filter .5s ease;
  }
  
  .bulletin-index-image.is-packshot {
    padding:12px;
    background:
      radial-gradient(circle at center,rgba(255,255,255,.5),transparent 48%),
      #ddd3cb;
  }
  
  .bulletin-index-image.is-packshot img {
    object-fit:contain;
    filter:drop-shadow(0 12px 13px rgba(47,35,31,.14)) saturate(.8);
  }
  
  .bulletin-index-entry button:hover .bulletin-index-image img {
    transform:scale(1.025);
    filter:saturate(.84) contrast(.98);
  }
  
  
  /* ---------------------------------------------------------
     Give alternate index entries a subtle editorial rhythm
     --------------------------------------------------------- */
  
  .bulletin-index-entry:nth-child(even) > button {
    grid-template-columns:
      50px
      clamp(82px,23vw,112px)
      minmax(0,1fr);
  }
  
  .bulletin-index-entry:nth-child(even) .bulletin-index-image {
    grid-column:2;
    grid-row:1;
  }
  
  .bulletin-index-entry:nth-child(even) .bulletin-index-main {
    grid-column:3;
    grid-row:1;
  }
  
  .bulletin-index-entry:nth-child(even) .bulletin-index-side {
    grid-column:1;
    grid-row:1;
  }
  
  
  /* =========================================================
     MOBILE
     ========================================================= */
  
  @media(max-width:390px) {
  
    .bulletin-picks {
      grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
      gap:12px;
    }
  
    .bulletin-editorial-story--archive {
      margin-top:38px;
    }
  
    .bulletin-editorial-story--portrait .bulletin-editorial-copy h3,
    .bulletin-editorial-story--archive .bulletin-editorial-copy h3 {
      font-size:15px;
    }
  
    .bulletin-editorial-copy p {
      font-size:6.7px;
    }
  
    .bulletin-editorial-link {
      font-size:5.2px;
    }
  
    .bulletin-index-entry > button,
    .bulletin-index-entry:nth-child(even) > button {
      min-height:155px;
      grid-template-columns:
        35px
        minmax(0,1fr)
        76px;
      gap:10px;
    }
  
    .bulletin-index-entry:nth-child(even) .bulletin-index-image {
      grid-column:3;
    }
  
    .bulletin-index-entry:nth-child(even) .bulletin-index-main {
      grid-column:2;
    }
  
    .bulletin-index-main h3 {
      font-size:15px;
    }
  
    .bulletin-index-main p {
      font-size:6.3px;
      -webkit-line-clamp:3;
      display:-webkit-box;
      overflow:hidden;
      -webkit-box-orient:vertical;
    }
  
    .bulletin-index-side small {
      font-size:4.5px;
    }
  
    .bulletin-index-read {
      margin-top:17px;
    }
  }
  
  
  @media(max-width:350px) {
  
    .bulletin-picks {
      grid-template-columns:1fr;
      gap:35px;
    }
  
    .bulletin-editorial-story--archive {
      margin-top:0;
      padding-left:17%;
    }
  
    .bulletin-editorial-story--portrait {
      padding-right:12%;
    }
  
    .bulletin-index-entry > button,
    .bulletin-index-entry:nth-child(even) > button {
      grid-template-columns:30px minmax(0,1fr) 64px;
    }
  
    .bulletin-index-meta span {
      display:none;
    }
  }
@media(max-width:390px) {
  .world-intro { min-height:88px; padding-inline:18px; }
  .world-intro-line { grid-template-columns:1fr; gap:3px; }
  .world-intro h1 { font-size:14px; }
  .world-intro p { font-size:6.5px; text-align:left; }
  .world-nav { min-height:72px; margin-inline:12px; }
  .world-nav button { padding-inline:2px; }
  .world-nav button strong { font-size:11px; }
  .world-nav button small { font-size:4.5px; letter-spacing:.12em; }
}

/* --------------------------------------------------
   REVIEW IMAGE VIEWER
-------------------------------------------------- */

.experience-image-button {
  flex: 0 0 auto;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: zoom-in;
  -webkit-tap-highlight-color: transparent;
}

.experience-image-button img {
  display: block;
  width: 116px;
  height: 116px;
  object-fit: cover;
  border-radius: 16px;
}

.review-image-viewer {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding:
    calc(24px + env(safe-area-inset-top))
    20px
    calc(24px + env(safe-area-inset-bottom));
  background: rgba(28, 24, 23, 0.9);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.review-image-viewer.hidden {
  display: none;
}

.review-image-viewer img {
  display: block;
  max-width: 100%;
  max-height: 88vh;
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 18px;
  box-shadow: 0 18px 60px rgba(0, 0, 0, 0.28);
  user-select: none;
  -webkit-user-select: none;
}

.review-image-viewer-close {
  position: absolute;
  top: calc(16px + env(safe-area-inset-top));
  right: 16px;
  z-index: 2;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.16);
  color: #fff;
  font-size: 28px;
  font-weight: 300;
  line-height: 42px;
  text-align: center;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

/* --------------------------------------------------
   LUNA SALON ENTRY
-------------------------------------------------- */

.luna-salon-entry {
  min-height:108px;
  margin:17px 18px 0;
  padding:20px 19px;
  display:grid;
  grid-template-columns:1fr 82px;
  gap:12px;
  align-items:center;
  position:relative;
  overflow:hidden;
  border-radius:27px;
  text-decoration:none;
  color:#5b4b46;
  background:
    radial-gradient(circle at 92% 4%,rgba(255,255,255,.82),transparent 34%),
    linear-gradient(135deg,rgba(223,205,200,.9),rgba(246,238,233,.79));
  border:1px solid rgba(255,255,255,.88);
  box-shadow:
    inset 0 1px rgba(255,255,255,.85),
    0 16px 38px rgba(79,56,50,.065);
}

.luna-salon-entry:before {
  content:"";
  width:130px;
  height:130px;
  position:absolute;
  right:-52px;
  top:-65px;
  border:1px solid rgba(113,81,73,.1);
  border-radius:50%;
}

.luna-salon-entry-copy {
  position:relative;
  z-index:1;
}

.luna-salon-entry-copy span {
  display:block;
  color:#9a8179;
  font:6px Baskerville,"Times New Roman",serif;
  letter-spacing:.25em;
}

.luna-salon-entry-copy strong {
  display:block;
  margin-top:8px;
  font:500 23px/1.1 Baskerville,"Songti SC","STSong",serif;
  letter-spacing:.05em;
}

.luna-salon-entry-copy p {
  margin:8px 0 0;
  color:#89756d;
  font-size:8px;
  line-height:1.65;
}

.luna-salon-entry-mark {
  width:72px;
  height:72px;
  display:grid;
  place-items:center;
  position:relative;
  border:1px solid rgba(109,78,70,.16);
  border-radius:50%;
}

.luna-salon-entry-mark:after {
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(109,78,70,.1);
  border-radius:50%;
}

.luna-salon-entry-mark i {
  color:#876c64;
  font:27px Georgia,serif;
  font-style:normal;
}

.luna-salon-entry-mark b {
  position:absolute;
  bottom:-3px;
  padding:2px 5px;
  color:#9b847c;
  background:#eee4de;
  font:5px Baskerville,serif;
  letter-spacing:.18em;
}

.luna-salon-entry:active {
  transform:scale(.985);
}

/* --------------------------------------------------
   LUNA WORLD HERO · REFINED 2026-08-28
-------------------------------------------------- */

.world-hero {
  min-height: 285px;
  padding-top: 34px;
  padding-bottom: 26px;
}

.world-hero h1 {
  max-width: 360px;
  margin-top: 22px;
  margin-bottom: 14px;
  font-size: clamp(27px, 4.6vw, 34px);
  line-height: 1.42;
  letter-spacing: .01em;
}

.world-hero > p,
.world-hero-copy > p {
  margin-top: 8px;
  font-size: 9px;
  line-height: 1.8;
}

@media (max-width: 520px) {
  .world-hero {
    min-height: 250px;
    padding-top: 28px;
    padding-bottom: 20px;
  }

  .world-hero h1 {
    max-width: 330px;
    margin-top: 18px;
    margin-bottom: 12px;
    font-size: 29px;
    line-height: 1.42;
  }
}


/* ==================================================
   LUNA WORLD · TEXT WORDMARK REFINEMENT
   2026-08-28
   ================================================== */

.world-brand-title {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  line-height: 1;
  text-align: center;
}

.world-brand-title span {
  display: block;
  margin-bottom: 7px;
  color: #8f827d;
  font-family: "Times New Roman", "Songti SC", serif;
  font-size: 10px;
  font-weight: 400;
  letter-spacing: .34em;
  white-space: nowrap;
}

.world-brand-title strong {
  display: block;
  color: #453a37;
  font-family:
    "Baskerville",
    "Iowan Old Style",
    "Palatino Linotype",
    "Songti SC",
    "STSong",
    serif;
  font-size: 28px;
  font-weight: 400;
  letter-spacing: .035em;
  white-space: nowrap;
}

@media (max-width: 560px) {
  .world-brand-title span {
    font-size: 9px;
    letter-spacing: .30em;
  }

  .world-brand-title strong {
    font-size: 25px;
  }
}

@media (max-width: 380px) {
  .world-brand-title strong {
    font-size: 23px;
  }
}


/* ==================================================
   LUNA EDIT · EDITORIAL TYPOGRAPHY REFINEMENT
   2026-08-28
   ================================================== */

/* 中文展示型标题：
   更细、更有呼吸感，避免默认宋体过重 */
.luna-shell h1,
.luna-shell h2,
.luna-shell h3 {
  font-family:
    "Songti SC",
    "STSong",
    "Noto Serif CJK SC",
    serif;
  font-weight: 400;
  text-rendering: geometricPrecision;
  -webkit-font-smoothing: antialiased;
}

/* 首页超大主标题：让颜色留下它自己的痕迹。 */
.world-hero h1,
.world-intro h1,
.hero-copy h1 {
  font-family:
    "Songti SC",
    "STSong",
    serif;
  font-weight: 300;
  letter-spacing: .015em;
  line-height: 1.42;
}

/* 品牌目录 / 全部品牌这类 editorial heading */
.directory-screen h1,
.directory-screen h2,
.brand-directory h1,
.brand-directory h2 {
  font-family:
    "Songti SC",
    "STSong",
    serif;
  font-weight: 300;
  letter-spacing: .04em;
}

/* 笔记卡片标题 */
.article-card h2,
.article-card h3,
.note-card h2,
.note-card h3 {
  font-family:
    "Songti SC",
    "STSong",
    serif;
  font-weight: 400;
  letter-spacing: .015em;
  line-height: 1.35;
}

/* 中英文混排，例如「什么是 Rubber Base?」
   英文字母会优先呈现更漂亮的衬线形态 */
.article-card h2,
.note-card h2 {
  font-family:
    "Baskerville",
    "Iowan Old Style",
    "Songti SC",
    "STSong",
    serif;
}

/* 速报 / Cover Story 大标题 */
.news-card h2,
.news-feature h2,
.bulletin-card h2,
.cover-story h2 {
  font-family:
    "Baskerville",
    "Iowan Old Style",
    "Songti SC",
    "STSong",
    serif;
  font-weight: 400;
  letter-spacing: .01em;
  line-height: 1.2;
}

/* CREATE 页面大标题 */
.create-screen h1,
.create-screen h2,
.creation-screen h1,
.creation-screen h2 {
  font-family:
    "Songti SC",
    "STSong",
    serif;
  font-weight: 300;
  letter-spacing: .025em;
  line-height: 1.28;
}

/* 小型英文 editorial labels */
.world-hero .eyebrow,
.world-intro .eyebrow,
.directory-screen .eyebrow,
.article-card .eyebrow,
.note-card .eyebrow,
.news-card .eyebrow,
.cover-story .eyebrow {
  font-family:
    "Baskerville",
    "Iowan Old Style",
    "Times New Roman",
    serif;
  font-weight: 400;
  letter-spacing: .24em;
}

/* Luna 世界顶部品牌字 */
.world-brand-title strong {
  font-family:
    "Baskerville",
    "Iowan Old Style",
    "Songti SC",
    "STSong",
    serif;
  font-weight: 400;
  letter-spacing: .045em;
}


/* ==================================================
   LUNA EDIT · BODY COPY REFINEMENT
   2026-08-28
   ================================================== */

.world-salon p,
.library-heading p,
.world-section p,
.section-intro p,
.section-description {
  font-family:
    "Songti SC",
    "STSong",
    "Noto Serif CJK SC",
    serif;
  font-weight: 300;
  letter-spacing: .025em;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}


/* ==================================================
   LUNA EDIT · REFINED DESCRIPTION COPY
   2026-08-28
   ================================================== */

.section-lead {
  font-family:
    "Songti SC",
    "STSong",
    "Noto Serif CJK SC",
    serif;
  font-weight: 300;
  letter-spacing: .035em;
  line-height: 1.8;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}

/* 美甲沙龙说明 */
.salon-entry p,
.salon-card p,
.salon-panel p {
  font-family:
    "Songti SC",
    "STSong",
    "Noto Serif CJK SC",
    serif;
  font-weight: 300;
  letter-spacing: .035em;
  line-height: 1.8;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}



/* ==================================================
   LUNA EDIT · HERO TITLE REFINEMENT
   精致但稍有重量的中文展示字体
   ================================================== */

.world-hero h1,
.world-intro h1,
.hero-copy h1 {
  font-family:
    "Songti SC",
    "STSong",
    "Noto Serif CJK SC",
    serif;

  font-weight: 600;
  letter-spacing: .015em;
  line-height: 1.38;

  color: #766964;

  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}



/* ==================================================
   LUNA EDIT · FINAL EDITORIAL TYPE SYSTEM
   2026-08-28
   ================================================== */

/* 01 · 首页主标题
   让颜色留下它自己的痕迹。 */
.world-intro h1 {
  font-family:
    "Songti SC",
    "STSong",
    "Noto Serif CJK SC",
    serif;
  font-size: inherit;
  font-weight: 500;
  letter-spacing: .012em;
  line-height: 1.38;
  color: #746763;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}

/* 首页右侧说明
   图鉴、灵感、知识与美甲圈正在发生的事 */
.world-intro-line > p {
  font-family:
    "Songti SC",
    "STSong",
    serif;
  font-weight: 400;
  letter-spacing: .035em;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
}

/* 02 · 美甲沙龙说明
   分享颜色、试色与关于指尖的一点想法。 */
.luna-salon-entry-copy p {
  font-family:
    "Songti SC",
    "STSong",
    "Noto Serif CJK SC",
    serif;
  font-weight: 400;
  letter-spacing: .035em;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}

/* 美甲沙龙标题 */
.luna-salon-entry-copy strong {
  font-family:
    "Songti SC",
    "STSong",
    serif;
  font-weight: 500;
  letter-spacing: .025em;
}

/* 03 · 图鉴说明
   一间可以慢慢查询、比较与补充经验的颜色档案室。 */
.world-panel[data-world-panel="library"] > .section-lead {
  font-family:
    "Songti SC",
    "STSong",
    "Noto Serif CJK SC",
    serif;
  font-weight: 400;
  letter-spacing: .035em;
  line-height: 1.85;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}

/* 04 · 图鉴 / 全部品牌等 section 标题 */
.section-heading h2,
.section-heading h3 {
  font-family:
    "Songti SC",
    "STSong",
    serif;
  font-weight: 500;
  letter-spacing: .025em;
  -webkit-font-smoothing: antialiased;
}

/* 05 · 品牌目录大标题：全部品牌 */
.directory-hero h1 {
  font-family:
    "Songti SC",
    "STSong",
    serif;
  font-weight: 500;
  letter-spacing: .035em;
  line-height: 1.22;
  -webkit-font-smoothing: antialiased;
}

/* 品牌目录说明正文 */
.directory-hero p {
  font-family:
    "Songti SC",
    "STSong",
    serif;
  font-weight: 400;
  letter-spacing: .025em;
  line-height: 1.9;
}

/* 甲油胶 / 指甲油等目录标题 */
.directory-group h2 {
  font-family:
    "Songti SC",
    "STSong",
    serif;
  font-weight: 500;
  letter-spacing: .025em;
}

/* 品牌名称 */
.directory-group button span {
  font-family:
    "Baskerville",
    "Iowan Old Style",
    "Songti SC",
    "STSong",
    serif;
  font-weight: 500;
}

/* 06 · 笔记卡片标题
   什么是 Rubber Base？
   猫眼光带为什么会移动？ */
.world-panel[data-world-panel="notes"] .note-card h3 {
  font-family:
    "Baskerville",
    "Iowan Old Style",
    "Songti SC",
    "STSong",
    serif;
  font-weight: 500;
  letter-spacing: .01em;
  line-height: 1.38;
  -webkit-font-smoothing: antialiased;
}

/* 笔记说明正文 */
.world-panel[data-world-panel="notes"] .note-card p {
  font-family:
    "Songti SC",
    "STSong",
    serif;
  font-weight: 400;
  letter-spacing: .025em;
  line-height: 1.8;
}

/* 07 · 精选 / editorial 大标题 */
.editorial-cover h2 {
  font-family:
    "Baskerville",
    "Iowan Old Style",
    "Songti SC",
    "STSong",
    serif;
  font-weight: 500;
  letter-spacing: .005em;
  line-height: 1.22;
}

/* 08 · 新闻详情标题 */
.news-title-block h1 {
  font-family:
    "Baskerville",
    "Iowan Old Style",
    "Songti SC",
    "STSong",
    serif;
  font-weight: 500;
  letter-spacing: -.005em;
  line-height: 1.3;
}

/* 中文新闻正文 */
.news-title-block p,
.news-lead,
.news-paragraph,
.news-section-title {
  font-family:
    "Songti SC",
    "STSong",
    serif;
  -webkit-font-smoothing: antialiased;
}


/* ==================================================
   DIRECTORY HEADING SIZE REFINEMENT
   2026-08-28
   ================================================== */

/* 全部品牌 */
.directory-hero h1 {
  font-size: 36px;
}

/* 甲油胶 / 指甲油 */
.directory-group h2 {
  font-size: 22px;
}

@media (max-width: 560px) {
  .directory-hero h1 {
    font-size: 34px;
  }

  .directory-group h2 {
    font-size: 21px;
  }
}


/* ==================================================
   BRAND ARCHIVE · LOGO TITLES
   2026-08-28
   ================================================== */

.brand-intro-logo-wrap {
  min-height: 48px;
  margin: 6px 0 2px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.brand-intro-logo {
  display: block;
  width: auto;
  height: auto;
  object-fit: contain;
  object-position: center;
  pointer-events: none;
}

/* Chanel */
.brand-intro-logo[data-brand="Chanel 香奈儿"] {
  max-width: 158px;
  max-height: 42px;
}

/* Hermès */
.brand-intro-logo[data-brand="Hermès 爱马仕"] {
  max-width: 152px;
  max-height: 54px;
}

/* enoi */
.brand-intro-logo[data-brand="enoi"] {
  max-width: 108px;
  max-height: 44px;
}

@media (max-width: 560px) {
  .brand-intro-logo-wrap {
    min-height: 44px;
  }

  .brand-intro-logo[data-brand="Chanel 香奈儿"] {
    max-width: 145px;
    max-height: 38px;
  }

  .brand-intro-logo[data-brand="Hermès 爱马仕"] {
    max-width: 138px;
    max-height: 48px;
  }

  .brand-intro-logo[data-brand="enoi"] {
    max-width: 98px;
    max-height: 40px;
  }
}


/* ==================================================
   BRAND ARCHIVE · CENTER LOGOS
   ================================================== */

/* 有 Logo 时，让左侧标题区域占满整行 */
.brand-intro:has(.brand-intro-logo) .brand-intro-summary {
  position: relative;
  display: block;
}

/* Logo 所在区域占满卡片宽度 */
.brand-intro:has(.brand-intro-logo) .brand-intro-summary > div {
  width: 100%;
}

/* BRAND ARCHIVE 保持左侧 */
.brand-intro:has(.brand-intro-logo) .brand-intro-summary > div > span {
  display: block;
}

/* Logo 真正以整个卡片为基准水平居中 */
.brand-intro:has(.brand-intro-logo) .brand-intro-logo-wrap {
  width: 100%;
  min-height: 58px;
  margin: 8px 0 2px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 图片自身居中 */
.brand-intro:has(.brand-intro-logo) .brand-intro-logo {
  display: block;
  margin: 0 auto;
  object-fit: contain;
  object-position: center;
}

/* SHADES 固定右下，不影响 Logo 的中心位置 */
.brand-intro:has(.brand-intro-logo) .brand-intro-summary > b {
  position: absolute;
  right: 0;
  bottom: 3px;
}



/* 2026-08-28 · Bulletin editorial CTA refinement */
.bulletin-feature-copy .bulletin-read-cta {
  width:max-content;
  min-width:132px;
  margin-top:21px;
  padding:12px 21px 11px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.54);
  background:linear-gradient(
    180deg,
    rgba(255,255,255,.11),
    rgba(255,255,255,.045)
  );
  box-shadow:
    inset 0 1px rgba(255,255,255,.18),
    0 7px 24px rgba(17,14,13,.08);
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
  color:#fff;
  font-style:normal;
  transition:
    background .35s ease,
    border-color .35s ease,
    transform .35s cubic-bezier(.2,.75,.2,1);
}

.bulletin-feature-copy .bulletin-read-cta span {
  color:rgba(255,255,255,.94);
  font-family:"Songti SC","STSong",serif;
  font-size:10px;
  font-weight:400;
  letter-spacing:.16em;
  line-height:1;
}

.bulletin-feature-card:hover .bulletin-read-cta,
.bulletin-feature-card:focus-visible .bulletin-read-cta {
  transform:translateY(-2px);
  border-color:rgba(255,255,255,.75);
  background:rgba(255,255,255,.16);
}

@media(max-width:520px) {
  .world-panel[data-world-panel="notes"]>.section-heading h2 {
    font-size:31px;
    letter-spacing:.10em;
  }

  .bulletin-feature-copy .bulletin-read-cta {
    min-width:120px;
    padding:11px 18px 10px;
  }
}


/* =========================================================
   2026-08-28 · THE EDIT spacing + NEWS INDEX refinement
   ========================================================= */


/* ---------- THE EDIT：收掉过度留白 ---------- */

.bulletin-journal .bulletin-picks-section {
  margin-top:26px;
}

.bulletin-journal .bulletin-picks {
  align-items:start;
}

/* 右侧 03 不再人为向下空 54px */
.bulletin-journal .bulletin-editorial-story--archive {
  margin-top:34px;
}

/* 两张 story 的尾部链接更克制 */
.bulletin-journal .bulletin-editorial-story--portrait .bulletin-editorial-link {
  margin-top:20px;
  padding-top:11px;
  padding-bottom:10px;
}

.bulletin-journal .bulletin-editorial-story--archive .bulletin-editorial-link {
  margin-top:21px;
  padding-bottom:10px;
}

/* NEWS INDEX 更早进入视野 */
.bulletin-journal .bulletin-index-section {
  margin-top:15px;
}


/* ---------- READ THE STORY：变成更精致的刊物页脚 ---------- */

.bulletin-journal .bulletin-editorial-link {
  position:relative;
  color:rgba(68,54,49,.68);
  font-family:Baskerville,"Times New Roman",serif;
  font-size:5.5px;
  font-weight:400;
  letter-spacing:.24em;
  line-height:1;
}

.bulletin-journal .bulletin-editorial-link::after {
  content:"";
  width:26px;
  height:1px;
  margin-left:12px;
  display:inline-block;
  vertical-align:middle;
  background:rgba(69,54,49,.28);
}


/* ---------- NEWS INDEX 章节标题 ---------- */

.bulletin-journal .bulletin-index-section > .bulletin-section-rule {
  margin-bottom:0;
  padding:0 1px 10px;
  border-bottom:1px solid rgba(61,47,42,.42);
}

.bulletin-journal .bulletin-index-section > .bulletin-section-rule span {
  color:rgba(49,40,36,.88);
  font-size:7.5px;
  letter-spacing:.29em;
}

.bulletin-journal .bulletin-index-section > .bulletin-section-rule em {
  color:rgba(118,98,89,.64);
  font-size:5.5px;
  letter-spacing:.22em;
}


/* ---------- NEWS INDEX 每条速报 ---------- */

.bulletin-journal .bulletin-index-entry {
  border-bottom:1px solid rgba(61,47,42,.24);
}

.bulletin-journal .bulletin-index-entry > button,
.bulletin-journal .bulletin-index-entry:nth-child(even) > button {
  min-height:166px;
  padding:22px 0 23px;
  grid-template-columns:
    44px
    minmax(0,1fr)
    clamp(72px,20vw,96px);
  gap:clamp(13px,3.5vw,24px);
  align-items:center;
}


/* ---------- 左侧编号：像刊物 folio ---------- */

.bulletin-journal .bulletin-index-side {
  position:relative;
  justify-content:flex-start;
  gap:28px;
}

.bulletin-journal .bulletin-index-number {
  color:rgba(112,89,79,.68);
  font:italic 36px/.78 Baskerville,"Times New Roman",serif;
  font-weight:400;
  letter-spacing:-.055em;
}

.bulletin-journal .bulletin-index-side small {
  margin-left:3px;
  color:rgba(117,97,88,.55);
  font-size:4.5px;
  letter-spacing:.25em;
}


/* ---------- 日期 / desk 信息 ---------- */

.bulletin-journal .bulletin-index-meta {
  margin-bottom:13px;
  justify-content:flex-start;
  gap:18px;
  color:rgba(126,105,95,.60);
  font-size:5px;
  letter-spacing:.19em;
}

.bulletin-journal .bulletin-index-meta time {
  position:relative;
}

.bulletin-journal .bulletin-index-meta time::after {
  content:"";
  width:18px;
  height:1px;
  margin-left:10px;
  display:inline-block;
  vertical-align:middle;
  background:rgba(91,72,64,.20);
}


/* ---------- 标题：更像高级中文时装刊物 ---------- */

.bulletin-journal .bulletin-index-main h3 {
  max-width:360px;
  color:rgba(45,37,34,.91);
  font-family:
    Baskerville,
    "STSongti-SC-Light",
    "STSongti-SC",
    "Songti SC",
    "STSong",
    serif;
  font-size:clamp(18px,4.15vw,23px);
  font-weight:300;
  line-height:1.42;
  letter-spacing:.015em;
  -webkit-font-smoothing:antialiased;
}

.bulletin-journal .bulletin-index-main p {
  max-width:345px;
  margin-top:11px;
  color:rgba(103,87,80,.68);
  font-family:
    Baskerville,
    "STSongti-SC",
    "Songti SC",
    "STSong",
    serif;
  font-size:6.5px;
  line-height:1.8;
  letter-spacing:.025em;
}


/* ---------- 右侧图片：缩成 archive specimen ---------- */

.bulletin-journal .bulletin-index-image {
  width:100%;
  max-width:92px;
  justify-self:end;
  position:relative;
  overflow:hidden;
  background:rgba(93,75,67,.055);
}

.bulletin-journal .bulletin-index-image::before {
  content:"";
  position:absolute;
  inset:6px;
  z-index:1;
  pointer-events:none;
  border:1px solid rgba(82,64,57,.08);
}

.bulletin-journal .bulletin-index-image img {
  filter:saturate(.78) contrast(.96);
  transition:
    transform .7s cubic-bezier(.2,.75,.2,1),
    filter .7s ease;
}

.bulletin-journal .bulletin-index-entry button:hover .bulletin-index-image img {
  transform:scale(1.025);
  filter:saturate(.9) contrast(.98);
}


/* ---------- 手机：保持杂志排版，不退化成普通列表 ---------- */

@media(max-width:520px) {

  .bulletin-journal .bulletin-editorial-story--archive {
    margin-top:25px;
  }

  .bulletin-journal .bulletin-index-section {
    margin-top:12px;
  }

  .bulletin-journal .bulletin-index-entry > button,
  .bulletin-journal .bulletin-index-entry:nth-child(even) > button {
    min-height:148px;
    padding:19px 0 20px;
    grid-template-columns:
      38px
      minmax(0,1fr)
      70px;
    gap:12px;
  }

  .bulletin-journal .bulletin-index-number {
    font-size:32px;
  }

  .bulletin-journal .bulletin-index-side {
    gap:23px;
  }

  .bulletin-journal .bulletin-index-main h3 {
    font-size:18px;
    line-height:1.42;
  }

  .bulletin-journal .bulletin-index-main p {
    margin-top:9px;
    font-size:6px;
  }

  .bulletin-journal .bulletin-index-image {
    max-width:70px;
  }
}

/* =========================================================
   LUNA MEMORY 1.0
   ========================================================= */

body.luna-memory-modal-open {
  overflow: hidden;
}

.luna-memory-modal[hidden] {
  display: none;
}

.luna-memory-modal {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(21, 17, 15, 0.52);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.luna-memory-modal-card {
  width: min(520px, 100%);
  max-height: calc(100vh - 48px);
  overflow-y: auto;
  padding: 38px 34px 32px;
  border: 1px solid rgba(86, 67, 57, 0.16);
  border-radius: 26px;
  background: #f8f4ef;
  box-shadow: 0 30px 90px rgba(25, 18, 14, 0.24);
  text-align: center;
}

.luna-memory-modal-eyebrow {
  margin: 0 0 12px;
  font-size: 11px;
  letter-spacing: 0.22em;
  color: rgba(59, 46, 39, 0.58);
}

.luna-memory-modal-card h2 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(30px, 7vw, 46px);
  font-weight: 400;
  letter-spacing: -0.03em;
  color: #342923;
}

.luna-memory-modal-message {
  margin: 18px auto 26px;
  max-width: 410px;
  font-size: 14px;
  line-height: 1.8;
  color: rgba(52, 41, 35, 0.72);
}

.luna-memory-private-label {
  margin-bottom: 10px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.19em;
  color: #8b6654;
}

.luna-memory-key-code {
  display: block;
  padding: 17px 12px;
  border: 1px solid rgba(71, 54, 45, 0.14);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.62);
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: clamp(13px, 3.6vw, 17px);
  letter-spacing: 0.08em;
  color: #312722;
  overflow-wrap: anywhere;
}

.luna-memory-copy-button,
.luna-memory-saved-button {
  width: 100%;
  min-height: 48px;
  border-radius: 999px;
  letter-spacing: 0.13em;
  font-size: 11px;
  cursor: pointer;
}

.luna-memory-copy-button {
  margin-top: 12px;
  border: 1px solid rgba(52, 41, 35, 0.22);
  background: transparent;
  color: #342923;
}

.luna-memory-warning {
  margin: 25px auto 0;
  max-width: 410px;
  font-size: 12px;
  line-height: 1.75;
  color: rgba(52, 41, 35, 0.72);
}

.luna-memory-warning strong {
  display: block;
  margin-bottom: 3px;
  color: #47372f;
}

.luna-memory-recovery-note {
  margin: 14px auto 22px;
  max-width: 400px;
  font-size: 11px;
  line-height: 1.7;
  color: rgba(52, 41, 35, 0.52);
}

.luna-memory-saved-button {
  border: 0;
  background: #342923;
  color: #fffaf5;
}

.product-actions-grid [data-product-state] {
  transition:
    transform 160ms ease,
    background 160ms ease,
    border-color 160ms ease,
    color 160ms ease;
}

.product-actions-grid [data-product-state].active {
  border-color: rgba(74, 53, 43, 0.46);
  background: #3e3029;
  color: #fffaf5;
}

.product-actions-grid [data-product-state]:active {
  transform: scale(0.985);
}

@media (max-width: 640px) {
  .luna-memory-modal {
    padding: 16px;
  }

  .luna-memory-modal-card {
    padding: 30px 21px 24px;
    border-radius: 22px;
  }
}

/* =========================================================
   PRODUCT MEMORY ACTIONS · 2026-08-29
   Product title → Memory actions → Facts
   ========================================================= */

.product-detail-hero + .product-actions-grid {
  width: min(360px, calc(100% - 54px));
  margin: 22px auto 24px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}

.product-detail-hero + .product-actions-grid button {
  min-height: 58px;
  padding: 10px 14px;
  display: grid;
  grid-template-columns: auto auto;
  grid-template-rows: auto auto;
  justify-content: center;
  align-items: center;
  column-gap: 8px;
  row-gap: 1px;
  border: 1px solid rgba(104, 88, 80, 0.13);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.25);
  color: rgba(74, 63, 58, 0.72);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.44),
    0 7px 20px rgba(86, 68, 60, .035);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.product-detail-hero + .product-actions-grid button span {
  grid-row: 1 / 3;
  align-self: center;
  color: #a9857d;
  font-size: 17px;
  line-height: 1;
}

.product-detail-hero + .product-actions-grid button b {
  align-self: end;
  font-size: 9px;
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: .13em;
}

.product-detail-hero + .product-actions-grid button small {
  align-self: start;
  font-size: 7px;
  line-height: 1.2;
  color: rgba(111, 96, 89, .55);
}

.product-detail-hero + .product-actions-grid button.active {
  border-color: rgba(118, 91, 82, .24);
  background: rgba(126, 101, 92, .13);
  color: #66534d;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.56),
    0 8px 22px rgba(92, 68, 60, .06);
}

.product-detail-hero + .product-actions-grid button.active span {
  color: #8e655d;
}

.product-detail-hero + .product-actions-grid button.active small {
  color: rgba(91, 72, 65, .68);
}

@media (max-width: 640px) {
  .product-detail-hero + .product-actions-grid {
    width: calc(100% - 64px);
    gap: 16px;
    margin-top: 20px;
    margin-bottom: 23px;
  }

  .product-detail-hero + .product-actions-grid button {
    min-height: 55px;
    padding-inline: 10px;
  }
}

/* Luna Memory product detail spacing refinement */
.product-detail-hero + .product-actions-grid {
  margin-top: 4px;
  margin-bottom: 18px;
}

@media (max-width: 640px) {
  .product-detail-hero + .product-actions-grid {
    margin-top: 2px;
    margin-bottom: 18px;
  }
}

/* =========================================================
   LUNA MEMORY · RESTORE
   ========================================================= */

.luna-memory-restore-entry {
  display: block;
  margin: -8px auto 18px;
  padding: 5px 10px;
  border: 0;
  background: transparent;
  color: rgba(91, 77, 70, .48);
  font-size: 7px;
  letter-spacing: .08em;
}

.luna-memory-restore-entry:hover {
  color: rgba(91, 77, 70, .78);
}

.luna-memory-restore-card {
  text-align: center;
}

.luna-memory-restore-copy {
  max-width: 350px;
  margin: 10px auto 22px;
  color: rgba(72, 60, 54, .58);
  font-size: 10px;
  line-height: 1.8;
}

.luna-memory-restore-field {
  display: block;
  text-align: left;
}

.luna-memory-restore-field span {
  display: block;
  margin: 0 0 7px 4px;
  color: rgba(67, 54, 48, .52);
  font-size: 7px;
  letter-spacing: .16em;
}

.luna-memory-restore-field input {
  box-sizing: border-box;
  width: 100%;
  padding: 15px 16px;
  border: 1px solid rgba(90, 70, 60, .13);
  border-radius: 16px;
  outline: none;
  background: rgba(255,255,255,.48);
  color: #493b35;
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.luna-memory-restore-field input:focus {
  border-color: rgba(108, 81, 70, .34);
}

.luna-memory-restore-message {
  min-height: 18px;
  margin: 9px 4px;
  color: #9b6966;
  font-size: 8px;
}

.luna-memory-restore-submit,
.luna-memory-restore-cancel {
  width: 100%;
  padding: 14px 16px;
  border-radius: 999px;
  font-size: 9px;
}

.luna-memory-restore-submit {
  border: 0;
  background: #342923;
  color: #fffaf5;
}

.luna-memory-restore-submit:disabled {
  opacity: .55;
}

.luna-memory-restore-cancel {
  margin-top: 8px;
  border: 1px solid rgba(78, 62, 54, .12);
  background: rgba(255,255,255,.3);
  color: rgba(69, 56, 50, .62);
}

/* =========================================================
   PRODUCT DETAIL · COMPACT HERO
   Remove legacy fixed hero whitespace before Memory actions.
   ========================================================= */

.product-detail-hero {
  min-height: 0;
  padding-bottom: 12px;
}

/* Gel artwork is shorter than the legacy polish layout. */
#product-screen.is-gel .product-detail-hero {
  min-height: 0;
  padding-bottom: 10px;
}

/* Memory actions belong visually to the product identity block. */
.product-detail-hero + .product-actions-grid {
  margin-top: 0;
  margin-bottom: 14px;
}

/* Restore is secondary, so keep it close to Memory actions. */
.luna-memory-restore-entry {
  margin-top: -4px;
  margin-bottom: 14px;
}

@media (max-width: 640px) {
  .product-detail-hero {
    min-height: 0;
    padding-bottom: 10px;
  }

  .product-detail-hero + .product-actions-grid {
    margin-top: 0;
    margin-bottom: 13px;
  }

  .luna-memory-restore-entry {
    margin-top: -3px;
    margin-bottom: 13px;
  }
}

/* DIOR 628 · library card only */
.library-product[data-product-id="DIOR-628"] .product-packshot-window img {
  transform: scale(.92);
  transform-origin: center center;
}


/* LUNA WORLD · NAIL STUDIO ENTRY · 2026-09-01 */

.world-header {
  grid-template-columns:minmax(118px,auto) 1fr auto;
}

.nail-studio-entry {
  width:max-content;
  min-height:39px;
  padding:7px 12px 7px 13px;
  display:flex;
  align-items:center;
  gap:5px;
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.92);
  border-radius:999px;
  color:#625651;
  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,.78),
      rgba(246,239,234,.58)
    );
  box-shadow:
    0 10px 28px rgba(65,49,44,.065),
    inset 0 1px 0 rgba(255,255,255,.94);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  text-decoration:none;
  white-space:nowrap;
  transition:
    transform .36s cubic-bezier(.22,1,.36,1),
    box-shadow .36s ease,
    border-color .36s ease;
}

.nail-studio-entry::before {
  content:"";
  width:52px;
  height:120%;
  position:absolute;
  top:-10%;
  left:-70px;
  transform:skewX(-18deg);
  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255,255,255,.58),
      transparent
    );
  opacity:0;
  transition:
    left .72s cubic-bezier(.22,1,.36,1),
    opacity .3s ease;
  pointer-events:none;
}

.nail-studio-entry span {
  position:relative;
  z-index:1;
  color:#786b65;
  font-family:"Songti SC","STSong",serif;
  font-size:10px;
  font-weight:500;
  letter-spacing:.035em;
}

.nail-studio-entry i {
  position:relative;
  z-index:1;
  color:#a18b83;
  font:400 9px/1 Baskerville,Georgia,serif;
  font-style:normal;
  transform-origin:center;
  transition:
    transform .55s cubic-bezier(.22,1,.36,1),
    opacity .3s ease;
}

.nail-studio-entry strong {
  position:relative;
  z-index:1;
  color:#504642;
  font:500 9px/1 Baskerville,"Times New Roman",serif;
  letter-spacing:.055em;
}

@media (hover:hover) {
  .nail-studio-entry:hover {
    transform:translateY(-1px);
    border-color:rgba(255,255,255,1);
    box-shadow:
      0 15px 34px rgba(65,49,44,.09),
      inset 0 1px 0 rgba(255,255,255,1);
  }

  .nail-studio-entry:hover::before {
    left:115%;
    opacity:1;
  }

  .nail-studio-entry:hover i {
    transform:rotate(90deg) scale(1.08);
  }
}

.nail-studio-entry:active {
  transform:translateY(0) scale(.975);
}

@media (max-width:430px) {
  .world-header {
    grid-template-columns:minmax(105px,auto) 1fr auto;
    padding-left:12px;
    padding-right:12px;
  }

  .nail-studio-entry {
    min-height:36px;
    padding:6px 9px 6px 10px;
    gap:4px;
  }

  .nail-studio-entry span {
    font-size:9px;
  }

  .nail-studio-entry strong {
    font-size:8px;
    letter-spacing:.025em;
  }
}

@media (max-width:370px) {
  .nail-studio-entry {
    padding-left:9px;
    padding-right:9px;
  }

  .nail-studio-entry span {
    display:none;
  }
}

@media (prefers-reduced-motion:reduce) {
  .nail-studio-entry,
  .nail-studio-entry::before,
  .nail-studio-entry i {
    transition:none;
  }
}

/* LUNA WORLD · NAIL STUDIO ENTRY · 2026-09-01 */

.world-header {
  grid-template-columns:minmax(118px,auto) 1fr auto;
}

.nail-studio-entry {
  width:max-content;
  min-height:39px;
  padding:7px 12px 7px 13px;
  display:flex;
  align-items:center;
  gap:5px;
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.92);
  border-radius:999px;
  color:#625651;
  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,.78),
      rgba(246,239,234,.58)
    );
  box-shadow:
    0 10px 28px rgba(65,49,44,.065),
    inset 0 1px 0 rgba(255,255,255,.94);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  text-decoration:none;
  white-space:nowrap;
  transition:
    transform .36s cubic-bezier(.22,1,.36,1),
    box-shadow .36s ease,
    border-color .36s ease;
}

.nail-studio-entry::before {
  content:"";
  width:52px;
  height:120%;
  position:absolute;
  top:-10%;
  left:-70px;
  transform:skewX(-18deg);
  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255,255,255,.58),
      transparent
    );
  opacity:0;
  transition:
    left .72s cubic-bezier(.22,1,.36,1),
    opacity .3s ease;
  pointer-events:none;
}

.nail-studio-entry span {
  position:relative;
  z-index:1;
  color:#786b65;
  font-family:"Songti SC","STSong",serif;
  font-size:10px;
  font-weight:500;
  letter-spacing:.035em;
}

.nail-studio-entry i {
  position:relative;
  z-index:1;
  color:#a18b83;
  font:400 9px/1 Baskerville,Georgia,serif;
  font-style:normal;
  transform-origin:center;
  transition:
    transform .55s cubic-bezier(.22,1,.36,1),
    opacity .3s ease;
}

.nail-studio-entry strong {
  position:relative;
  z-index:1;
  color:#504642;
  font:500 9px/1 Baskerville,"Times New Roman",serif;
  letter-spacing:.055em;
}

@media (hover:hover) {
  .nail-studio-entry:hover {
    transform:translateY(-1px);
    border-color:rgba(255,255,255,1);
    box-shadow:
      0 15px 34px rgba(65,49,44,.09),
      inset 0 1px 0 rgba(255,255,255,1);
  }

  .nail-studio-entry:hover::before {
    left:115%;
    opacity:1;
  }

  .nail-studio-entry:hover i {
    transform:rotate(90deg) scale(1.08);
  }
}

.nail-studio-entry:active {
  transform:translateY(0) scale(.975);
}

@media (max-width:430px) {
  .world-header {
    grid-template-columns:minmax(105px,auto) 1fr auto;
    padding-left:12px;
    padding-right:12px;
  }

  .nail-studio-entry {
    min-height:36px;
    padding:6px 9px 6px 10px;
    gap:4px;
  }

  .nail-studio-entry span {
    font-size:9px;
  }

  .nail-studio-entry strong {
    font-size:8px;
    letter-spacing:.025em;
  }
}

@media (max-width:370px) {
  .nail-studio-entry {
    padding-left:9px;
    padding-right:9px;
  }

  .nail-studio-entry span {
    display:none;
  }
}

@media (prefers-reduced-motion:reduce) {
  .nail-studio-entry,
  .nail-studio-entry::before,
  .nail-studio-entry i {
    transition:none;
  }
}


/* LUNA REVIEW REPLY ART · 2026-09-01 */

#approved-reviews {
  display: grid;
  gap: 0;
}

#approved-reviews .experience-card {
  position: relative;
  padding: 22px 0 24px;
  border-bottom: 1px solid rgba(91, 76, 69, .15);
}

#approved-reviews .experience-card:first-child {
  padding-top: 12px;
}

#approved-reviews .experience-card-main {
  width: 100%;
  padding: 0;
  display: block;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: inherit;
  text-align: left;
  font: inherit;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
}

#approved-reviews .experience-card-main > header,
#approved-reviews .experience-reply > header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
}

#approved-reviews .experience-card-main > header b,
#approved-reviews .experience-reply > header b {
  color: rgba(78, 64, 58, .72);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .025em;
}

#approved-reviews .experience-card-main > header time,
#approved-reviews .experience-reply > header time {
  flex: 0 0 auto;
  color: rgba(105, 90, 83, .48);
  font-size: 10px;
  font-weight: 400;
  letter-spacing: .03em;
}

#approved-reviews .experience-meta {
  margin-top: 13px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

#approved-reviews .experience-stars {
  color: #b98370;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 17px;
  line-height: 1;
  letter-spacing: 1px;
}

#approved-reviews .experience-expectation {
  padding: 5px 9px;
  border: 1px solid rgba(117, 96, 87, .08);
  border-radius: 999px;
  background: rgba(255, 255, 255, .54);
  color: rgba(84, 68, 62, .65);
  font-size: 10px;
  line-height: 1;
}

#approved-reviews .experience-card-main > p {
  max-width: 760px;
  margin: 13px 0 0;
  color: rgba(62, 51, 47, .84);
  font-size: 13px;
  line-height: 1.85;
  letter-spacing: .015em;
}

#approved-reviews .experience-reply-hint {
  width: max-content;
  margin-top: 11px;
  display: inline-flex;
  align-items: center;
  color: rgba(83, 69, 63, .52);
  font-size: 10px;
  line-height: 1;
  letter-spacing: .04em;
  transition:
    color .25s ease,
    transform .25s ease;
}

@media (hover: hover) {
  #approved-reviews .experience-card-main:hover .experience-reply-hint {
    color: rgba(72, 57, 52, .86);
    transform: translateX(2px);
  }
}

#approved-reviews .experience-replies {
  margin: 17px 0 0 23px;
  padding-left: 15px;
  display: grid;
  gap: 8px;
  border-left: 1px solid rgba(122, 100, 91, .16);
}

#approved-reviews .experience-reply {
  width: 100%;
  padding: 11px 13px 10px;
  display: block;
  position: relative;
  border: 1px solid rgba(118, 96, 87, .09);
  border-radius: 12px;
  background: rgba(255, 255, 255, .36);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .5);
  color: inherit;
  text-align: left;
  font: inherit;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  transition:
    background .25s ease,
    border-color .25s ease,
    transform .25s cubic-bezier(.22, 1, .36, 1);
}

@media (hover: hover) {
  #approved-reviews .experience-reply:hover {
    transform: translateY(-1px);
    border-color: rgba(118, 96, 87, .15);
    background: rgba(255, 255, 255, .58);
  }
}

#approved-reviews .experience-reply-context {
  margin-top: 7px;
  display: block;
  color: rgba(111, 89, 80, .52);
  font-size: 9px;
  line-height: 1.4;
  letter-spacing: .025em;
}

#approved-reviews .experience-reply > p {
  margin: 7px 0 0;
  color: rgba(65, 53, 49, .78);
  font-size: 11px;
  line-height: 1.75;
}

#approved-reviews .experience-reply > span {
  margin-top: 8px;
  display: inline-block;
  color: rgba(91, 73, 67, .45);
  font-size: 9px;
  line-height: 1;
  letter-spacing: .035em;
}

#approved-reviews .experience-reply-form {
  margin: 16px 0 2px 23px;
  padding: 15px;
  display: grid;
  gap: 10px;
  border: 1px solid rgba(111, 89, 81, .11);
  border-radius: 15px;
  background:
    linear-gradient(
      145deg,
      rgba(255, 255, 255, .68),
      rgba(247, 241, 237, .5)
    );
  box-shadow:
    0 12px 28px rgba(72, 53, 46, .045),
    inset 0 1px 0 rgba(255, 255, 255, .72);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  transform-origin: top center;
  animation:
    lunaReviewReplyReveal
    320ms
    cubic-bezier(.22, 1, .36, 1)
    both;
}

#approved-reviews .experience-reply-form-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

#approved-reviews .experience-reply-form-heading > span {
  color: rgba(75, 61, 56, .72);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .035em;
}

#approved-reviews .experience-reply-form-heading > button {
  width: 24px;
  height: 24px;
  padding: 0;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: rgba(82, 68, 62, .48);
  font: 300 18px/1 Georgia, serif;
  cursor: pointer;
}

#approved-reviews .experience-reply-form input,
#approved-reviews .experience-reply-form textarea {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid rgba(111, 91, 82, .11);
  border-radius: 10px;
  outline: none;
  background: rgba(255, 255, 255, .54);
  color: rgba(59, 48, 44, .84);
  font: inherit;
  transition:
    border-color .22s ease,
    background .22s ease,
    box-shadow .22s ease;
}

#approved-reviews .experience-reply-form input {
  height: 38px;
  padding: 0 11px;
  font-size: 11px;
}

#approved-reviews .experience-reply-form textarea {
  min-height: 82px;
  padding: 10px 11px;
  resize: vertical;
  font-size: 11px;
  line-height: 1.7;
}

#approved-reviews .experience-reply-form input:focus,
#approved-reviews .experience-reply-form textarea:focus {
  border-color: rgba(136, 105, 93, .25);
  background: rgba(255, 255, 255, .78);
  box-shadow: 0 0 0 3px rgba(147, 112, 98, .045);
}

#approved-reviews .experience-reply-form input::placeholder,
#approved-reviews .experience-reply-form textarea::placeholder {
  color: rgba(90, 74, 68, .35);
}

#approved-reviews .experience-reply-submit {
  min-height: 37px;
  padding: 0 15px;
  justify-self: end;
  border: 1px solid rgba(75, 61, 56, .08);
  border-radius: 999px;
  background: rgba(73, 61, 56, .91);
  color: rgba(255, 255, 255, .94);
  box-shadow: none;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .045em;
  cursor: pointer;
  transition:
    transform .22s ease,
    background .22s ease;
}

@media (hover: hover) {
  #approved-reviews .experience-reply-submit:hover {
    transform: translateY(-1px);
    background: rgba(61, 50, 46, .96);
  }
}

@media (max-width: 640px) {
  #approved-reviews .experience-card {
    padding: 18px 0 20px;
  }

  #approved-reviews .experience-replies {
    margin-left: 10px;
    padding-left: 11px;
  }

  #approved-reviews .experience-reply-form {
    margin-left: 10px;
    padding: 13px;
  }

  #approved-reviews .experience-card-main > p {
    font-size: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  #approved-reviews .experience-reply-form {
    animation: none;
  }
}

/* END LUNA REVIEW REPLY ART */

/* LUNA COMMUNITY WINDOW · FINAL */

/* WORLD HOME / TAB STATE */
.world-panel:not(.active) {
  display: none;
}

.luna-community-stream.is-hidden-by-tab {
  display: none;
}


.luna-community-stream {
  position: relative;
  margin: 27px 0 43px;
  padding: 0 4px;
  transition:
    opacity .28s ease,
    transform .28s ease;
}

.luna-community-stream.is-hidden-by-tab {
  display: none;
}

.luna-community-stream-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin: 0 1px 15px;
}

.luna-community-stream-title {
  min-width: 0;
}

.luna-community-stream-title > span {
  display: block;
  margin-bottom: 5px;
  color: rgba(67, 55, 51, .42);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 7px;
  letter-spacing: .25em;
  line-height: 1.4;
}

.luna-community-stream-title h2 {
  margin: 0;
  color: rgba(54, 44, 41, .82);
  font-family:
    Georgia,
    "Songti SC",
    "STSong",
    serif;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: .09em;
  line-height: 1.4;
}

.luna-community-stream-title p {
  margin: 4px 0 0;
  color: rgba(67, 55, 51, .42);
  font-size: 8px;
  letter-spacing: .055em;
  line-height: 1.65;
}

.luna-community-salon-link {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 0;
  border: 0;
  color: rgba(65, 52, 48, .48);
  background: transparent;
  text-decoration: none;
}

.luna-community-salon-link span {
  font-family:
    Georgia,
    "Songti SC",
    serif;
  font-size: 8px;
  letter-spacing: .08em;
}

.luna-community-salon-link i {
  font-size: 9px;
  font-style: normal;
  opacity: .65;
}

/*
 * Fixed editorial window.
 * Two entries are visible at once.
 */
.luna-community-window {
  position: relative;
  height: 286px;
  overflow: hidden;
  border-top:
    1px solid rgba(78, 63, 58, .10);
  border-bottom:
    1px solid rgba(78, 63, 58, .10);
  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.12),
      rgba(255,255,255,.025)
    );
}

.luna-community-window::before,
.luna-community-window::after {
  content: "";
  position: absolute;
  z-index: 5;
  left: 0;
  right: 0;
  height: 15px;
  pointer-events: none;
}

.luna-community-window::before {
  top: 0;
  background:
    linear-gradient(
      to bottom,
      rgba(247,243,238,.88),
      transparent
    );
}

.luna-community-window::after {
  bottom: 0;
  background:
    linear-gradient(
      to top,
      rgba(247,243,238,.88),
      transparent
    );
}

.luna-community-track {
  display: flex;
  width: 100%;
  height: 100%;
  flex-direction: column;
  gap: 0;
  padding: 0;
  overflow-x: hidden;
  overflow-y: auto;
  scroll-snap-type: y mandatory;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  opacity: 1;
  transform: translateY(0);
  transition:
    opacity .36s ease,
    transform .36s
      cubic-bezier(.22,.7,.24,1);
}

.luna-community-track::-webkit-scrollbar {
  display: none;
}

.luna-community-track.is-changing {
  opacity: 0;
  transform: translateY(5px);
}

/* Each entry = half of the window */
.luna-community-card,
.luna-community-loading {
  position: relative;
  flex: 0 0 143px;
  width: 100%;
  height: 143px;
  min-height: 143px;
  overflow: hidden;
  scroll-snap-align: start;
  color: var(--ink);
  background: transparent;
}

.luna-community-card {
  display: grid;
  grid-template-columns: 116px 1fr;
  gap: 16px;
  align-items: center;
  padding: 13px 6px;
  border-bottom:
    1px solid rgba(78,63,58,.075);
  cursor: pointer;
}

.luna-community-card:nth-child(even) {
  grid-template-columns: 1fr 116px;
}

.luna-community-card-image {
  position: relative;
  grid-column: 1;
  grid-row: 1;
  width: 116px;
  height: 116px;
  overflow: hidden;
  border-radius: 16px;
  background: rgba(217,207,201,.45);
}

.luna-community-card:nth-child(even)
.luna-community-card-image {
  grid-column: 2;
}

.luna-community-card-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1);
  transition:
    transform .8s
      cubic-bezier(.2,.7,.2,1);
}

.luna-community-card:hover
.luna-community-card-image img {
  transform: scale(1.025);
}

.luna-community-card-image::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(
      180deg,
      transparent 65%,
      rgba(54,42,38,.055)
    );
}

.luna-community-card-body {
  position: relative;
  inset: auto;
  grid-column: 2;
  grid-row: 1;
  display: flex;
  min-width: 0;
  height: 116px;
  flex-direction: column;
  justify-content: center;
  padding: 0;
}

.luna-community-card:nth-child(even)
.luna-community-card-body {
  grid-column: 1;
  text-align: right;
}

.luna-community-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.luna-community-card:nth-child(even)
.luna-community-card-top {
  flex-direction: row-reverse;
}

.luna-community-kind {
  display: inline;
  padding: 0;
  border: 0;
  color: rgba(66,53,49,.38);
  background: transparent;
  font-family:
    Georgia,
    "Times New Roman",
    serif;
  font-size: 6px;
  letter-spacing: .18em;
  line-height: 1.2;
}

.luna-community-card-number {
  color: rgba(66,53,49,.28);
  font-family: Georgia, serif;
  font-size: 6px;
  letter-spacing: .13em;
}

.luna-community-card-copy {
  min-width: 0;
  margin: 0;
}

.luna-community-card h3,
.luna-community-card.is-review h3 {
  display: -webkit-box;
  margin: 0;
  overflow: hidden;
  color: rgba(49,40,37,.88);
  font-family:
    Georgia,
    "Songti SC",
    "STSong",
    serif;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: .025em;
  line-height: 1.55;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.luna-community-card p {
  display: -webkit-box;
  margin: 4px 0 0;
  overflow: hidden;
  color: rgba(66,53,49,.48);
  font-size: 7.5px;
  letter-spacing: .02em;
  line-height: 1.55;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.luna-community-card-meta {
  display: block;
  margin-top: 8px;
  padding-top: 6px;
  border-top:
    1px solid rgba(78,63,58,.075);
}

.luna-community-card-meta-copy strong {
  display: block;
  overflow: hidden;
  color: rgba(57,46,42,.62);
  font-family:
    Georgia,
    "Songti SC",
    serif;
  font-size: 7px;
  font-weight: 400;
  letter-spacing: .055em;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.luna-community-card-meta-copy small {
  display: block;
  margin-top: 2px;
  overflow: hidden;
  color: rgba(66,53,49,.32);
  font-family: Georgia, serif;
  font-size: 5px;
  letter-spacing: .14em;
  line-height: 1.3;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.luna-community-card-arrow {
  display: none;
}

/* Text-only notes */
.luna-community-card.is-text-only {
  display: flex;
  min-height: 143px;
  align-items: center;
  justify-content: center;
  padding: 18px 13%;
  text-align: center;
}

.luna-community-card.is-text-only
.luna-community-card-body {
  display: flex;
  width: 100%;
  height: auto;
}

.luna-community-card.is-text-only
.luna-community-card-top {
  justify-content: center;
  gap: 12px;
}

.luna-community-card.is-text-only
.luna-community-card-copy {
  width: 100%;
}

.luna-community-card.is-text-only h3,
.luna-community-card.is-text-only.is-review h3 {
  font-size: 12px;
  line-height: 1.65;
}

.luna-community-card.is-text-only
.luna-community-card-meta {
  margin-left: auto;
  margin-right: auto;
  max-width: 240px;
}

.luna-community-quote-mark {
  display: none;
}

.luna-community-text-orbit {
  position: absolute;
  width: 80px;
  height: 80px;
  right: 9%;
  top: 31px;
  border:
    1px solid rgba(105,83,77,.045);
  border-radius: 50%;
  pointer-events: none;
}

.luna-community-text-orbit::before {
  content: "";
  position: absolute;
  width: 54px;
  height: 54px;
  left: 12px;
  top: 12px;
  border:
    1px solid rgba(105,83,77,.04);
  border-radius: 50%;
}

.luna-community-text-orbit::after {
  content: "☾";
  position: absolute;
  left: 30px;
  top: 25px;
  color: rgba(91,70,65,.09);
  font-family: Georgia, serif;
  font-size: 15px;
}

.luna-community-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding: 20px;
}

.luna-community-loading span {
  color: rgba(67,55,51,.34);
  font-family: Georgia, serif;
  font-size: 6px;
  letter-spacing: .2em;
}

.luna-community-loading p {
  margin: 7px 0;
  font-family:
    Georgia,
    "Songti SC",
    serif;
  font-size: 11px;
}

.luna-community-loading i {
  font-size: 16px;
  font-style: normal;
  opacity: .13;
}

.luna-community-empty {
  flex: 0 0 100%;
  min-height: 286px;
  display: grid;
  place-items: center;
  padding: 30px;
  text-align: center;
}

.luna-community-empty div span {
  display: block;
  margin-bottom: 8px;
  font-family: Georgia, serif;
  font-size: 6px;
  letter-spacing: .2em;
  opacity: .4;
}

.luna-community-empty div p {
  margin: 0;
  font-family:
    Georgia,
    "Songti SC",
    serif;
  font-size: 12px;
  line-height: 1.7;
}

/* Old carousel footer is intentionally gone */
.luna-community-footer {
  display: none;
}

/* No default selected World section */
.world-content
.world-panel:not(.active) {
  display: none;
}

@media (max-width: 720px) {
  .luna-community-stream {
    margin: 22px 0 36px;
    padding: 0 3px;
  }

  .luna-community-stream-head {
    gap: 12px;
    margin-bottom: 12px;
  }

  .luna-community-stream-title > span {
    font-size: 5.5px;
    letter-spacing: .2em;
  }

  .luna-community-stream-title h2 {
    font-size: 14px;
  }

  .luna-community-stream-title p {
    font-size: 7px;
  }

  .luna-community-salon-link span {
    font-size: 7px;
  }

  .luna-community-window {
    height: 258px;
  }

  .luna-community-card,
  .luna-community-loading {
    flex-basis: 129px;
    height: 129px;
    min-height: 129px;
  }

  .luna-community-card {
    grid-template-columns: 100px 1fr;
    gap: 13px;
    padding: 12px 3px;
  }

  .luna-community-card:nth-child(even) {
    grid-template-columns: 1fr 100px;
  }

  .luna-community-card-image {
    width: 100px;
    height: 100px;
    border-radius: 14px;
  }

  .luna-community-card-body {
    height: 100px;
  }

  .luna-community-card-top {
    margin-bottom: 6px;
  }

  .luna-community-card h3,
  .luna-community-card.is-review h3 {
    font-size: 10px;
    line-height: 1.5;
  }

  .luna-community-card p {
    font-size: 6.5px;
  }

  .luna-community-card-meta {
    margin-top: 6px;
    padding-top: 5px;
  }

  .luna-community-card-meta-copy strong {
    font-size: 6px;
  }

  .luna-community-card-meta-copy small {
    font-size: 4.5px;
  }

  .luna-community-card.is-text-only {
    min-height: 129px;
    padding: 15px 12%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .luna-community-track {
    scroll-behavior: auto;
    transition: none;
  }

  .luna-community-card-image img {
    transition: none;
  }
}




/* LUNA PATRON IMAGE CARD · FINAL */

.luna-patron-overlay {
  position: fixed;

  z-index: 9999;

  inset: 0;

  padding: 22px;

  display: grid;

  place-items: center;

  background:
    rgba(54, 43, 39, .15);

  backdrop-filter:
    blur(5px);

  -webkit-backdrop-filter:
    blur(5px);

  opacity: 0;

  visibility: hidden;

  pointer-events: none;

  transition:
    opacity .72s ease,
    visibility .72s ease;
}

.luna-patron-overlay.is-visible {
  opacity: 1;

  visibility: visible;

  pointer-events: auto;
}

.luna-patron-overlay.is-leaving {
  opacity: 0;

  pointer-events: none;
}


.luna-patron-card {
  position: relative;

  width:
    min(430px, 91vw);

  padding:
    13px 13px 28px;

  border:
    1px solid
    rgba(125, 89, 87, .15);

  background:
    rgba(246, 237, 229, .98);

  box-shadow:
    0 35px 90px
    rgba(70, 49, 44, .17);

  text-align: center;

  transform:
    translateY(14px)
    scale(.988);

  transition:
    transform .78s
    cubic-bezier(.22,.7,.24,1);
}

.luna-patron-overlay.is-visible
.luna-patron-card {
  transform:
    translateY(0)
    scale(1);
}


.luna-patron-close {
  position: absolute;

  z-index: 5;

  top: 19px;

  right: 20px;

  width: 31px;

  height: 31px;

  padding: 0;

  border: 0;

  border-radius: 50%;

  color:
    rgba(69, 51, 48, .65);

  background:
    rgba(249, 243, 237, .74);

  backdrop-filter:
    blur(6px);

  -webkit-backdrop-filter:
    blur(6px);

  cursor: pointer;

  font-family:
    Georgia,
    serif;

  font-size: 23px;

  font-weight: 300;

  line-height: 28px;

  transition:
    background .2s ease,
    color .2s ease,
    transform .2s ease;
}

.luna-patron-close:hover {
  color:
    rgba(69,51,48,.92);

  background:
    rgba(249,243,237,.94);

  transform:
    rotate(4deg);
}


.luna-patron-art {
  width: 100%;

  overflow: hidden;

  background:
    #ead4c7;
}


.luna-patron-art img {
  width: 100%;
  height: auto;
  display: block;
  opacity: 1;
  filter: none;
  transform: none;
}



.luna-patron-button {
  width:
    min(200px, 72%);

  min-height: 45px;

  margin:
    22px auto 0;

  display:
    inline-flex;

  align-items: center;

  justify-content: center;

  gap: 17px;

  border:
    1px solid
    rgba(128,82,88,.72);

  color:
    #fffaf6;

  background:
    #8d5a61;

  text-decoration: none;

  transition:
    background .22s ease,
    transform .22s ease;
}

.luna-patron-button:hover {
  background:
    #7e5056;

  transform:
    translateY(-1px);
}

.luna-patron-button span {
  font-family:
    "Songti SC",
    "STSong",
    Georgia,
    serif;

  font-size: 11px;

  letter-spacing: .12em;
}

.luna-patron-button i {
  font-family:
    Georgia,
    serif;

  font-size: 15px;

  font-style: normal;
}


.luna-patron-caption {
  display: block;

  margin-top: 17px;

  color:
    rgba(78,61,56,.32);

  font-family:
    Georgia,
    serif;

  font-size: 5.5px;

  letter-spacing: .21em;
}


@media (max-width: 520px) {

  .luna-patron-overlay {
    padding: 15px;
  }

  .luna-patron-card {
    width:
      min(390px, 94vw);

    padding:
      9px 9px 23px;
  }

  .luna-patron-close {
    top: 15px;

    right: 15px;
  }

  .luna-patron-button {
    margin-top: 18px;
  }

}


@media (
  prefers-reduced-motion: reduce
) {

  .luna-patron-overlay,
  .luna-patron-card {
    transition: none;
  }

}



/* =========================================================
   LUNA WORLD · ROCOCO EDITORIAL REFINEMENT · 2026-09-07
   subtle rococo / pearl ivory / editorial restraint
   ========================================================= */

.luna-shell {
  background:
    radial-gradient(circle at 18% 8%, rgba(255,255,255,.82), transparent 24%),
    radial-gradient(circle at 82% 14%, rgba(244,221,220,.22), transparent 26%),
    radial-gradient(circle at 50% 54%, rgba(255,249,244,.42), transparent 44%),
    linear-gradient(155deg, rgba(252,248,244,.985), rgba(239,230,222,.975));
}

/* very subtle antique-paper sheen */
.luna-shell::before {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:0;
  opacity:.24;
  background:
    linear-gradient(90deg, rgba(255,255,255,.16), transparent 18%, transparent 82%, rgba(255,255,255,.12)),
    repeating-linear-gradient(
      0deg,
      rgba(118,91,82,.013) 0,
      rgba(118,91,82,.013) 1px,
      transparent 1px,
      transparent 5px
    );
}

.world-header,
.world-intro,
.world-nav,
.world-content {
  position:relative;
  z-index:1;
}

/* ---------- masthead ---------- */

.world-brand-title {
  min-width:158px;
  padding:8px 24px 9px;
}

.world-brand-title::before,
.world-brand-title::after {
  width:19px;
  background:linear-gradient(
    90deg,
    transparent,
    rgba(122,92,82,.36),
    transparent
  );
}

.world-header .world-brand-title span {
  color:#8d7c75;
  font-size:8px;
  letter-spacing:.36em;
}

.world-header .world-brand-title strong {
  color:#51423d;
  font-size:20px;
  font-weight:400;
  letter-spacing:.095em;
  text-shadow:
    0 1px rgba(255,255,255,.85),
    0 9px 24px rgba(91,62,55,.07);
}

/* small rococo flourish below title */
.world-brand-title::after {
  right:-4px;
}

.world-brand-title::before {
  left:-4px;
}

/* ---------- intro ---------- */

.world-intro {
  min-height:102px;
  padding-top:20px;
  padding-bottom:17px;
}

.world-intro::before {
  content:"❦";
  position:absolute;
  left:50%;
  top:1px;
  transform:translateX(-50%) scaleX(1.18);
  color:rgba(135,101,92,.12);
  font:14px Georgia,serif;
  letter-spacing:.12em;
  pointer-events:none;
}

.world-intro:after {
  right:22px;
  top:4px;
  color:rgba(125,96,88,.065);
  font-size:61px;
  filter:blur(.1px);
}

.world-intro>span {
  color:#9a8880;
  font-size:7.5px;
  letter-spacing:.30em;
}

.world-intro h1 {
  color:#54443e;
  font-weight:400;
  letter-spacing:.045em;
  text-shadow:0 1px rgba(255,255,255,.9);
}

.world-intro p {
  color:#94837b;
  letter-spacing:.035em;
}

/* ---------- navigation ---------- */

.world-nav {
  min-height:82px;
  margin-inline:16px;
  border-top:1px solid rgba(104,78,69,.18);
  border-bottom:1px solid rgba(104,78,69,.18);
  background:
    linear-gradient(
      180deg,
      rgba(255,252,249,.72),
      rgba(246,238,232,.68)
    );
  box-shadow:
    inset 0 1px rgba(255,255,255,.7),
    0 12px 34px rgba(78,54,48,.035);
}

/* fine ornamental edge */
.world-nav::before,
.world-nav::after {
  content:"";
  position:absolute;
  left:18px;
  right:18px;
  height:1px;
  pointer-events:none;
  background:linear-gradient(
    90deg,
    transparent,
    rgba(121,91,81,.13) 16%,
    rgba(121,91,81,.13) 84%,
    transparent
  );
}

.world-nav::before { top:5px; }
.world-nav::after { bottom:5px; }

.world-nav button {
  padding:14px 4px 12px;
  gap:4px;
  transition:
    background .28s ease,
    transform .28s ease,
    color .28s ease;
}

.world-nav button:not(:last-child):after {
  top:16px;
  bottom:16px;
  background:linear-gradient(
    180deg,
    transparent,
    rgba(107,80,70,.17) 23%,
    rgba(107,80,70,.17) 77%,
    transparent
  );
}

.world-nav button span {
  color:#a28d84;
  font-size:7px;
  letter-spacing:.18em;
}

.world-nav button strong {
  color:#75645d;
  font-size:12.5px;
  font-weight:400;
  letter-spacing:.075em;
}

.world-nav button small {
  color:#aa978e;
  font-size:5px;
  letter-spacing:.19em;
}

.world-nav button:hover {
  background:
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.52), transparent 72%);
  transform:translateY(-1px);
}

.world-nav button.active {
  color:#493b36;
  background:
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.67), transparent 70%);
}

.world-nav button.active::before {
  width:25px;
  height:1px;
  background:linear-gradient(
    90deg,
    transparent,
    #8a6d63,
    transparent
  );
}

/* ---------- community section ---------- */

.community-stream,
.world-community,
.community-window {
  border-color:rgba(105,80,70,.14);
}

.community-stream h2,
.world-community h2,
.community-window h2 {
  color:#55453f;
  font-weight:400;
  letter-spacing:.055em;
}

.community-stream::before,
.world-community::before,
.community-window::before {
  content:"";
  display:block;
  width:42px;
  height:1px;
  margin:0 0 14px;
  background:linear-gradient(
    90deg,
    rgba(125,92,83,.4),
    transparent
  );
}

/* editorial image refinement */
.community-stream img,
.world-community img,
.community-window img {
  box-shadow:
    0 16px 36px rgba(75,52,46,.07),
    inset 0 0 0 1px rgba(255,255,255,.18);
}

/* ---------- subtle interaction polish ---------- */

.world-share-entry {
  background:
    radial-gradient(circle at 35% 28%, rgba(255,255,255,.94), rgba(248,240,235,.66));
  border:1px solid rgba(255,255,255,.92);
  box-shadow:
    inset 0 1px rgba(255,255,255,.85),
    0 11px 28px rgba(73,50,45,.07);
}

.world-share-entry:hover {
  transform:translateY(-1px) rotate(1deg);
}

/* responsive */
@media (max-width: 520px) {
  .world-brand-title {
    min-width:146px;
    padding-inline:19px;
  }

  .world-header .world-brand-title strong {
    font-size:19px;
  }

  .world-intro {
    padding-top:18px;
    padding-bottom:15px;
  }

  .world-nav {
    margin-inline:12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .world-nav button,
  .world-share-entry {
    transition:none;
  }
}

/* LUNA VISION ENTRY · 2026-09-07 */
.luna-vision-entry {
  min-height:176px;
  margin:22px 18px 28px;
  padding:29px 68px 28px 31px;
  display:block;
  position:relative;
  overflow:hidden;
  color:#5c4942;
  text-decoration:none;
  border:3px double rgba(115,83,67,.3);
  border-radius:34px 34px 46px 46px;
  background:
    radial-gradient(circle at 86% 12%,rgba(255,255,255,.96),transparent 29%),
    radial-gradient(circle at 12% 100%,rgba(221,196,185,.34),transparent 38%),
    linear-gradient(145deg,rgba(250,247,242,.96),rgba(234,220,211,.9));
  box-shadow:
    inset 0 0 0 7px rgba(255,255,255,.38),
    0 23px 52px rgba(85,59,49,.1);
  transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease;
}

.luna-vision-entry::before,
.luna-vision-entry::after {
  content:"";
  position:absolute;
  pointer-events:none;
}

.luna-vision-entry::before {
  width:136px;
  height:136px;
  right:-35px;
  top:-47px;
  border:1px solid rgba(135,99,82,.17);
  border-radius:50%;
  box-shadow:
    0 0 0 17px rgba(255,255,255,.18),
    0 0 0 18px rgba(135,99,82,.08),
    0 0 0 38px rgba(255,255,255,.11);
}

.luna-vision-entry::after {
  left:30px;
  right:76px;
  bottom:19px;
  height:1px;
  background:linear-gradient(90deg,rgba(130,94,78,.34),rgba(130,94,78,.06),transparent);
}

.luna-vision-entry:hover,
.luna-vision-entry:focus-visible {
  transform:translateY(-3px);
  border-color:rgba(136,96,72,.46);
  box-shadow:
    inset 0 0 0 7px rgba(255,255,255,.44),
    0 28px 58px rgba(85,59,49,.14);
  outline:none;
}

.luna-vision-entry-copy {
  position:relative;
  z-index:2;
}

.luna-vision-entry-copy small {
  display:block;
  color:#9c8174;
  font:7px/1.2 Baskerville,"Times New Roman",serif;
  letter-spacing:.27em;
}

.luna-vision-entry-copy strong {
  display:block;
  margin-top:17px;
  color:#71584d;
  font:italic 20px/1 Baskerville,"Times New Roman",serif;
  font-weight:400;
  letter-spacing:.08em;
}

.luna-vision-entry-copy strong i {
  color:#b19077;
  font-size:11px;
  font-style:normal;
  vertical-align:middle;
}

.luna-vision-entry h2 {
  margin:8px 0 10px;
  color:#4e3f3a;
  font:400 27px/1.18 Baskerville,"Songti SC","STSong",serif;
  letter-spacing:.08em;
}

.luna-vision-entry p {
  max-width:330px;
  margin:0;
  color:#8c7870;
  font:9px/1.8 "Songti SC","STSong",serif;
  letter-spacing:.02em;
}

.luna-vision-entry>b {
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  position:absolute;
  right:22px;
  bottom:24px;
  z-index:2;
  border:1px solid rgba(120,87,71,.2);
  border-radius:50%;
  background:rgba(255,255,255,.55);
  color:#80685d;
  font:400 17px/1 Baskerville,serif;
  box-shadow:inset 0 1px rgba(255,255,255,.9);
}

.luna-vision-entry-ornament {
  position:absolute;
  right:30px;
  top:23px;
  color:rgba(147,107,84,.49);
  font:30px/1 Baskerville,serif;
  transform:rotate(45deg);
}

@media (max-width:390px) {
  .luna-vision-entry {
    min-height:166px;
    margin-inline:14px;
    padding:26px 59px 25px 25px;
    border-radius:30px 30px 40px 40px;
  }

  .luna-vision-entry h2 {
    font-size:24px;
  }

  .luna-vision-entry p {
    font-size:8px;
  }

  .luna-vision-entry>b {
    right:17px;
    bottom:22px;
  }
}

@media (prefers-reduced-motion:reduce) {
  .luna-vision-entry {
    transition:none;
  }
}


/* =========================================================
   LUNA WORLD · HALLOWEEN LIMITED EDITION
   2026

   IMPORTANT
   ---------
   Every visual rule below requires:

   html[data-luna-theme="halloween"]

   Classic Luna World therefore remains untouched.
   ========================================================= */


/* =========================================================
   01 · PALETTE

   Not orange Halloween.
   Antique wine / dried rose / cocoa / old silver.
   ========================================================= */

html[data-luna-theme="halloween"] {
  --hw-ink: #49383a;
  --hw-ink-deep: #38292c;
  --hw-wine: #6b4a50;
  --hw-wine-soft: #86676a;
  --hw-cocoa: #78645e;

  --hw-paper: #f6f0e9;
  --hw-paper-deep: #eee4dc;

  --hw-line: rgba(88, 57, 61, .16);
  --hw-faint: rgba(91, 55, 62, .055);
}


/* =========================================================
   02 · PAPER

   Preserve Luna's cream paper.
   Just make it feel slightly older and duskier.
   ========================================================= */

html[data-luna-theme="halloween"] body {
  background:
    radial-gradient(
      circle at 93% 7%,
      rgba(106, 61, 69, .055),
      transparent 24%
    ),
    radial-gradient(
      circle at 4% 66%,
      rgba(94, 74, 63, .035),
      transparent 27%
    ),
    linear-gradient(
      158deg,
      #faf6f1 0%,
      var(--hw-paper) 48%,
      var(--hw-paper-deep) 100%
    ) !important;

  color: var(--hw-ink);
}


html[data-luna-theme="halloween"]
.luna-shell,

html[data-luna-theme="halloween"]
.world-screen {
  background:
    linear-gradient(
      165deg,
      rgba(255,255,255,.22),
      rgba(115,73,77,.018)
    ) !important;
}


/* =========================================================
   03 · HEADER

   Same composition.
   Slightly deeper editorial ink.
   ========================================================= */

html[data-luna-theme="halloween"]
.world-header {
  border-bottom-color:
    var(--hw-line) !important;
}


html[data-luna-theme="halloween"]
.world-header .world-brand-title span {
  color:
    rgba(89, 57, 61, .67) !important;
}


html[data-luna-theme="halloween"]
.world-header .world-brand-title strong {
  color:
    var(--hw-ink-deep) !important;

  text-shadow:
    0 1px rgba(255,255,255,.78),
    0 8px 20px rgba(80,45,51,.07) !important;
}


html[data-luna-theme="halloween"]
.world-brand-title::before,

html[data-luna-theme="halloween"]
.world-brand-title::after {
  background:
    rgba(103,65,69,.28) !important;
}


/* =========================================================
   04 · NAIL STUDIO ENTRY

   Only tint the existing control.
   ========================================================= */

html[data-luna-theme="halloween"]
.world-studio-entry {
  color:
    var(--hw-ink) !important;

  border-color:
    rgba(103,68,70,.12) !important;

  box-shadow:
    0 9px 26px
    rgba(72,43,48,.055) !important;
}


/* =========================================================
   05 · INTRO

   One nearly invisible crescent watermark.
   ========================================================= */

html[data-luna-theme="halloween"]
.world-intro {
  position: relative;
  isolation: isolate;
}


html[data-luna-theme="halloween"]
.world-intro::after {
  content: "☾";

  position: absolute;

  z-index: -1;

  right: -5px;
  top: -6px;

  font-family:
    Baskerville,
    "Times New Roman",
    serif;

  font-size: 104px;
  font-weight: 400;
  line-height: 1;

  color:
    rgba(92,51,61,.042);

  transform:
    rotate(-12deg);

  pointer-events: none;
  user-select: none;
}


html[data-luna-theme="halloween"]
.world-intro > span {
  color:
    rgba(83,56,59,.62) !important;
}


html[data-luna-theme="halloween"]
.world-intro h1 {
  color:
    var(--hw-ink-deep) !important;
}


html[data-luna-theme="halloween"]
.world-intro p {
  color:
    rgba(86,66,65,.58) !important;
}


/* =========================================================
   06 · WORLD NAV

   Keep the glass.
   ========================================================= */

html[data-luna-theme="halloween"]
.world-nav {
  background:
    rgba(250,245,239,.53) !important;

  border-color:
    rgba(103,70,70,.10) !important;

  box-shadow:
    0 9px 28px
    rgba(74,44,49,.035);

  backdrop-filter:
    blur(18px)
    saturate(.92);
}


html[data-luna-theme="halloween"]
.world-nav button {
  color:
    rgba(105,82,79,.72) !important;
}


html[data-luna-theme="halloween"]
.world-nav button.active {
  color:
    var(--hw-ink-deep) !important;

  background:
    rgba(255,250,245,.78) !important;

  box-shadow:
    0 5px 17px
    rgba(74,44,49,.06) !important;
}


/* =========================================================
   07 · LUNA VISION

   Do NOT redesign the card.
   Only duskier shadow and faint wine glass.
   ========================================================= */

html[data-luna-theme="halloween"]
.luna-vision-card,

html[data-luna-theme="halloween"]
.vision-card {
  border-color:
    rgba(102,67,69,.17) !important;

  box-shadow:
    0 20px 44px
      rgba(70,42,47,.075),
    inset 0 0 34px
      rgba(111,67,72,.018) !important;
}


/*
  If the current Luna Vision implementation uses another
  wrapper, its typography still inherits the Halloween ink.
*/

html[data-luna-theme="halloween"]
.world-content h1,

html[data-luna-theme="halloween"]
.world-content h2,

html[data-luna-theme="halloween"]
.world-content h3 {
  color:
    var(--hw-ink-deep);
}


/* =========================================================
   08 · SECTION HEADINGS
   ========================================================= */

html[data-luna-theme="halloween"]
.section-heading h2 {
  color:
    var(--hw-ink-deep) !important;
}


html[data-luna-theme="halloween"]
.section-heading em,

html[data-luna-theme="halloween"]
.section-lead {
  color:
    rgba(100,77,73,.62) !important;
}


/* =========================================================
   09 · SEARCH
   ========================================================= */

html[data-luna-theme="halloween"]
.library-search {
  background:
    rgba(255,251,247,.67) !important;

  border-color:
    rgba(105,72,71,.10) !important;

  box-shadow:
    0 13px 32px
    rgba(72,43,48,.045) !important;
}


html[data-luna-theme="halloween"]
.library-search span,

html[data-luna-theme="halloween"]
.library-search i {
  color:
    rgba(104,75,75,.68) !important;
}


html[data-luna-theme="halloween"]
.library-search input {
  color:
    var(--hw-ink) !important;
}


html[data-luna-theme="halloween"]
.library-search input::placeholder {
  color:
    rgba(104,87,82,.52) !important;
}


/* =========================================================
   10 · FACET PLAQUES

   Existing ornamental images/layout remain.
   Active selection receives muted wine atmosphere.
   ========================================================= */

html[data-luna-theme="halloween"]
.facet-tabs button {
  color:
    rgba(89,67,66,.78) !important;

  filter:
    sepia(.06)
    saturate(.88);
}


html[data-luna-theme="halloween"]
.facet-tabs button.active {
  color:
    #f4eae1 !important;

  filter:
    sepia(.12)
    saturate(.86)
    brightness(.76)
    hue-rotate(318deg);

  text-shadow:
    0 1px
    rgba(44,25,28,.18);
}


/* =========================================================
   11 · FACET VALUE PILLS
   ========================================================= */

html[data-luna-theme="halloween"]
.facet-values button {
  color:
    rgba(81,62,61,.78);

  border-color:
    rgba(103,72,70,.11);

  background:
    rgba(252,247,241,.47);
}


html[data-luna-theme="halloween"]
.facet-values button.active {
  color:
    var(--hw-ink-deep);

  background:
    rgba(118,78,83,.10);

  border-color:
    rgba(108,68,73,.16);
}


/* =========================================================
   12 · PRODUCT CARDS

   Nail colours themselves are NEVER filtered.
   Only surrounding cards receive atmosphere.
   ========================================================= */

html[data-luna-theme="halloween"]
.product-card {
  border-color:
    rgba(103,69,70,.09);

  box-shadow:
    0 10px 27px
    rgba(73,44,48,.035);
}


/*
  Explicit safety:
  never recolour nail/product photography.
*/

html[data-luna-theme="halloween"]
.product-card img,

html[data-luna-theme="halloween"]
.product-grid img,

html[data-luna-theme="halloween"]
.detail-product-image {
  filter: none !important;
}


/* =========================================================
   13 · COMMUNITY STREAM
   ========================================================= */

html[data-luna-theme="halloween"]
.luna-community-stream {
  border-color:
    rgba(102,67,69,.12) !important;

  box-shadow:
    0 16px 38px
    rgba(73,43,48,.045) !important;
}


html[data-luna-theme="halloween"]
.luna-community-stream-title > span {
  color:
    rgba(102,65,70,.60) !important;
}


html[data-luna-theme="halloween"]
.luna-community-stream-title h2 {
  color:
    var(--hw-ink-deep) !important;
}


html[data-luna-theme="halloween"]
.luna-community-salon-link {
  color:
    var(--hw-wine) !important;
}


/* =========================================================
   14 · SECONDARY SCREENS

   Product detail / glossary / notes / news etc.
   Keep them cream, only give the paper a dusk tint.
   ========================================================= */

html[data-luna-theme="halloween"]
.product-screen,

html[data-luna-theme="halloween"]
.glossary-screen,

html[data-luna-theme="halloween"]
.news-screen,

html[data-luna-theme="halloween"]
.article-screen,

html[data-luna-theme="halloween"]
.share-luna-screen,

html[data-luna-theme="halloween"]
.support-screen {
  background:
    radial-gradient(
      circle at 92% 5%,
      rgba(103,59,67,.045),
      transparent 25%
    ),
    linear-gradient(
      160deg,
      #faf6f1,
      #f1e8e0
    ) !important;
}


/* =========================================================
   15 · MODALS / SHEETS
   ========================================================= */

html[data-luna-theme="halloween"]
.modal-card,

html[data-luna-theme="halloween"]
.sheet-card,

html[data-luna-theme="halloween"]
.product-sheet {
  border-color:
    rgba(100,66,68,.12) !important;

  box-shadow:
    0 24px 65px
    rgba(64,37,42,.11) !important;
}


/* =========================================================
   16 · BUTTONS

   Only generic dark CTA surfaces.
   Avoid altering branded image buttons.
   ========================================================= */

html[data-luna-theme="halloween"]
.world-content button:not(.facet-tabs button):not(.product-card) {
  --luna-halloween-button-ink:
    var(--hw-ink);
}


/* =========================================================
   17 · TINY EDITORIAL STARS

   Only around the main content.
   Very faint.
   ========================================================= */

html[data-luna-theme="halloween"]
.world-content {
  position: relative;
}


html[data-luna-theme="halloween"]
.world-content::before {
  content: "✦";

  position: absolute;

  top: 11px;
  right: 22px;

  color:
    rgba(99,59,67,.10);

  font-family: Georgia, serif;
  font-size: 10px;

  pointer-events: none;
}


html[data-luna-theme="halloween"]
.world-content::after {
  content: "☾";

  position: absolute;

  top: 48px;
  right: 16px;

  color:
    rgba(99,59,67,.055);

  font-family: Georgia, serif;
  font-size: 21px;

  pointer-events: none;
}


/* =========================================================
   18 · CLASSIC SAFETY

   These are deliberately redundant safety rules.
   ========================================================= */

html:not([data-luna-theme="halloween"])
.world-intro::after,

html:not([data-luna-theme="halloween"])
.world-content::before,

html:not([data-luna-theme="halloween"])
.world-content::after {
  content:
    none !important;
}


/* =========================================================
   19 · ACCESSIBILITY
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  html[data-luna-theme="halloween"] * {
    scroll-behavior:
      auto;
  }
}



/* =========================================================
   LUNA WORLD · HALLOWEEN VISIBLE LAYER 20260916-HW2

   ONLY ACTIVE WHEN:
   html.luna-halloween-world

   Classic does not match these selectors.
   ========================================================= */


/* ---------- PAGE PAPER ---------- */

html.luna-halloween-world body {
  background:
    #d7ccc6 !important;
}


html.luna-halloween-world .luna-shell,
html.luna-halloween-world .world-screen {
  background:
    radial-gradient(
      circle at 91% 6%,
      rgba(102, 50, 61, .10),
      transparent 26%
    ),
    radial-gradient(
      circle at 5% 72%,
      rgba(93, 66, 57, .055),
      transparent 29%
    ),
    linear-gradient(
      155deg,
      #f8f2eb 0%,
      #f2e8df 52%,
      #eaded6 100%
    ) !important;
}


/* ---------- AMBIENT BLOBS ---------- */

html.luna-halloween-world .ambient-one {
  background:
    #b98e93 !important;

  opacity:
    .43 !important;
}


html.luna-halloween-world .ambient-two {
  background:
    #b9a99e !important;

  opacity:
    .35 !important;
}


/* ---------- MAIN INK ---------- */

html.luna-halloween-world {
  --luna-hw-ink:
    #49363a;

  --luna-hw-wine:
    #704b53;

  --luna-hw-muted:
    #826b66;
}


html.luna-halloween-world
.world-brand-title strong,

html.luna-halloween-world
.world-intro h1,

html.luna-halloween-world
.world-content h1,

html.luna-halloween-world
.world-content h2,

html.luna-halloween-world
.world-content h3,

html.luna-halloween-world
.section-heading h2 {
  color:
    var(--luna-hw-ink) !important;
}


/* ---------- INTRO WATERMARK ---------- */

html.luna-halloween-world
.world-intro {
  position:
    relative;
}


html.luna-halloween-world
.world-intro::after {
  content:
    "☾";

  position:
    absolute;

  right:
    4px;

  top:
    -12px;

  font-family:
    Baskerville,
    Georgia,
    serif;

  font-size:
    102px;

  line-height:
    1;

  color:
    rgba(100, 50, 62, .065);

  transform:
    rotate(-12deg);

  pointer-events:
    none;
}


/* ---------- WORLD NAV ---------- */

html.luna-halloween-world
.world-nav {
  border-top-color:
    rgba(94, 54, 61, .17) !important;

  border-bottom-color:
    rgba(94, 54, 61, .17) !important;
}


html.luna-halloween-world
.world-nav button {
  color:
    rgba(92, 68, 67, .73) !important;
}


html.luna-halloween-world
.world-nav button.active {
  color:
    #49363a !important;
}


/* ---------- SEARCH ---------- */

html.luna-halloween-world
.library-search {
  background:
    rgba(255, 249, 244, .72) !important;

  border-color:
    rgba(103, 62, 67, .11) !important;

  box-shadow:
    0 13px 32px
    rgba(71, 38, 45, .055) !important;
}


/* ---------- FACET PILLS ---------- */

html.luna-halloween-world
.facet-values button {
  background:
    rgba(255, 249, 243, .52) !important;

  border-color:
    rgba(104, 67, 68, .12) !important;

  color:
    rgba(77, 58, 58, .82) !important;
}


html.luna-halloween-world
.facet-values button.active {
  color:
    #f7eee7 !important;

  background:
    linear-gradient(
      145deg,
      #554044,
      #73545a
    ) !important;

  border-color:
    rgba(75, 43, 49, .23) !important;
}


/* ---------- PRODUCT CARD ATMOSPHERE ---------- */

html.luna-halloween-world
.product-card {
  box-shadow:
    0 12px 30px
    rgba(72, 39, 45, .045) !important;
}


/* Never alter actual nail colours. */

html.luna-halloween-world
.product-card img,

html.luna-halloween-world
.product-grid img,

html.luna-halloween-world
.detail-product-image {
  filter:
    none !important;
}


/* ---------- SECONDARY SCREENS ---------- */

html.luna-halloween-world
.product-screen,

html.luna-halloween-world
.glossary-screen,

html.luna-halloween-world
.news-screen,

html.luna-halloween-world
.article-screen,

html.luna-halloween-world
.share-luna-screen,

html.luna-halloween-world
.support-screen {
  background:
    radial-gradient(
      circle at 94% 5%,
      rgba(104, 55, 66, .075),
      transparent 27%
    ),
    linear-gradient(
      155deg,
      #f9f4ee,
      #eee2d9
    ) !important;
}


/* =========================================================
   LOADING SCREEN
   ========================================================= */

.luna-world-loader {
  position:
    fixed;

  inset:
    0;

  z-index:
    999999;

  display:
    grid;

  place-items:
    center;

  background:
    rgba(247, 242, 236, .98);

  opacity:
    0;

  visibility:
    hidden;

  pointer-events:
    none;

  transition:
    opacity .42s ease,
    visibility .42s ease;
}


.luna-world-loader.is-visible {
  opacity:
    1;

  visibility:
    visible;

  pointer-events:
    auto;
}


.luna-world-loader.is-leaving {
  opacity:
    0;
}


.luna-world-loader-inner {
  width:
    min(78vw, 340px);

  display:
    flex;

  flex-direction:
    column;

  align-items:
    center;

  text-align:
    center;
}


/* CLASSIC */

.luna-world-loader-classic-mark {
  margin-bottom:
    16px;

  font-family:
    Baskerville,
    Georgia,
    serif;

  font-size:
    42px;

  color:
    #796a64;
}


.loader-classic-copy {
  display:
    inline;
}


.loader-halloween-copy,
.luna-world-loader-halloween-art {
  display:
    none;
}


/* HALLOWEEN */

html.luna-halloween-world
.luna-world-loader {
  background:
    radial-gradient(
      circle at 50% 42%,
      #fffaf4,
      #eee1d7
    );
}


html.luna-halloween-world
.luna-world-loader-halloween-art {
  display:
    block;

  width:
    min(44vw, 190px);

  max-height:
    46vh;

  object-fit:
    contain;

  mix-blend-mode:
    multiply;

  margin-bottom:
    18px;
}


html.luna-halloween-world
.luna-world-loader-classic-mark,

html.luna-halloween-world
.loader-classic-copy {
  display:
    none;
}


html.luna-halloween-world
.loader-halloween-copy {
  display:
    inline;

  color:
    #60434a;
}


/* TEXT */

.luna-world-loader-label {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    8px;

  font-family:
    -apple-system,
    BlinkMacSystemFont,
    "PingFang SC",
    sans-serif;

  font-size:
    10px;

  letter-spacing:
    .20em;

  color:
    #796b65;
}


/* DOTS */

.luna-world-loader-dots {
  display:
    inline-flex;

  gap:
    4px;
}


.luna-world-loader-dots i {
  width:
    3px;

  height:
    3px;

  border-radius:
    50%;

  background:
    currentColor;

  opacity:
    .2;

  animation:
    lunaHwDot
    1.1s
    infinite ease-in-out;
}


.luna-world-loader-dots i:nth-child(2) {
  animation-delay:
    .16s;
}


.luna-world-loader-dots i:nth-child(3) {
  animation-delay:
    .32s;
}


@keyframes lunaHwDot {

  0%,
  70%,
  100% {
    opacity:
      .2;

    transform:
      translateY(0);
  }

  35% {
    opacity:
      1;

    transform:
      translateY(-2px);
  }
}


/* PROGRESS */

.luna-world-loader-progress {
  position:
    relative;

  width:
    min(165px, 48vw);

  height:
    1px;

  margin-top:
    18px;

  overflow:
    hidden;

  background:
    rgba(107, 82, 75, .14);
}


.luna-world-loader-progress i {
  position:
    absolute;

  left:
    -45%;

  top:
    0;

  width:
    42%;

  height:
    100%;

  background:
    #8a756e;

  animation:
    lunaHwProgress
    1.35s
    infinite ease-in-out;
}


html.luna-halloween-world
.luna-world-loader-progress i {
  background:
    #79525a;
}


@keyframes lunaHwProgress {

  from {
    left:
      -45%;
  }

  to {
    left:
      110%;
  }
}


/* CLASSIC SAFETY */

html:not(.luna-halloween-world)
.world-intro::after {
  content:
    none !important;
}


@media (prefers-reduced-motion: reduce) {

  .luna-world-loader-dots i,
  .luna-world-loader-progress i {
    animation:
      none !important;
  }
}


/* ===== LUNA HALLOWEEN NIGHT EDITORIAL START ===== */

/*
  Halloween is deliberately scoped under
  html.luna-halloween-world.

  Classic Luna World is not affected.
*/

html.luna-halloween-world {
  --hw-wine: #5f2635;
  --hw-wine-dark: #352027;
  --hw-plum: #66505f;
  --hw-pumpkin: #b76536;
  --hw-pumpkin-soft: #d28a59;
  --hw-caramel: #a36b46;
  --hw-cream: #f5eadf;
  --hw-paper: #eee0d5;
  --hw-night: #332a31;
  --hw-muted: #8d7774;
}


/* -------------------------------------------------
   PAGE ATMOSPHERE
-------------------------------------------------- */

html.luna-halloween-world body {
  background:
    radial-gradient(
      circle at 15% 12%,
      rgba(98, 49, 64, .18),
      transparent 28%
    ),
    radial-gradient(
      circle at 88% 22%,
      rgba(181, 98, 52, .13),
      transparent 24%
    ),
    linear-gradient(
      155deg,
      #d5c8c5 0%,
      #c9b8b5 48%,
      #d7c7be 100%
    );
}


html.luna-halloween-world .luna-shell {
  background:
    radial-gradient(
      circle at 92% 5%,
      rgba(102, 43, 60, .15),
      transparent 23%
    ),
    radial-gradient(
      circle at 4% 35%,
      rgba(188, 101, 52, .09),
      transparent 25%
    ),
    linear-gradient(
      160deg,
      #f7eee5 0%,
      #f1e4da 43%,
      #ead8cf 100%
    );

  box-shadow:
    0 0 0 1px rgba(75, 45, 50, .06),
    0 28px 70px rgba(57, 37, 42, .18);
}


/* -------------------------------------------------
   DECOR LAYER
-------------------------------------------------- */

.luna-halloween-night-decor {
  display: none;
}


html.luna-halloween-world .luna-halloween-night-decor {
  display: block;

  position: fixed;
  inset: 0;

  width: min(100%, 520px);
  margin: auto;

  pointer-events: none;
  overflow: hidden;

  z-index: 5;
}


html.luna-halloween-world .luna-shell {
  position: relative;
  z-index: 4;
}


html.luna-halloween-world .luna-hw-corner {
  position: absolute;
  z-index: 10;

  color: rgba(91, 38, 52, .42);

  font-family:
    Georgia,
    "Times New Roman",
    serif;
}


html.luna-halloween-world .luna-hw-corner-left {
  top: 84px;
  left: 16px;

  transform: rotate(-8deg);
}


html.luna-halloween-world .luna-hw-corner-right {
  top: 78px;
  right: 17px;

  display: flex;
  align-items: flex-start;
  gap: 3px;

  transform: rotate(8deg);
}


html.luna-halloween-world .luna-hw-moon {
  display: block;

  font-size: 46px;
  line-height: 1;

  color: rgba(87, 37, 52, .25);

  text-shadow:
    0 0 18px rgba(166, 92, 61, .14);
}


html.luna-halloween-world .luna-hw-star {
  font-size: 15px;

  color: rgba(179, 91, 46, .62);
}


html.luna-halloween-world .luna-hw-star-small {
  margin-top: 3px;
  font-size: 9px;
}


html.luna-halloween-world .luna-hw-ghost {
  display: block;

  margin-top: 5px;

  font-size: 12px;
  letter-spacing: 1px;

  opacity: .55;
}


/* -------------------------------------------------
   CUTE EDITORIAL PUMPKINS
-------------------------------------------------- */

html.luna-halloween-world .luna-hw-pumpkin {
  position: absolute;

  width: 42px;
  height: 34px;

  border: 1px solid rgba(125, 63, 44, .24);
  border-radius: 46% 46% 44% 44%;

  background:
    radial-gradient(
      ellipse at center,
      rgba(205, 126, 73, .18) 0 28%,
      transparent 30%
    ),
    linear-gradient(
      90deg,
      rgba(188, 102, 55, .12),
      rgba(220, 150, 95, .22),
      rgba(180, 88, 48, .12)
    );

  color: rgba(86, 45, 43, .55);

  box-shadow:
    inset 7px 0 10px rgba(122, 62, 45, .04),
    inset -7px 0 10px rgba(122, 62, 45, .04),
    0 8px 22px rgba(80, 48, 49, .06);

  opacity: .82;
}


html.luna-halloween-world .luna-hw-pumpkin i {
  position: absolute;

  width: 5px;
  height: 8px;

  left: 50%;
  top: -7px;

  transform: translateX(-50%) rotate(8deg);

  border-radius: 5px 5px 1px 1px;

  background: rgba(87, 66, 47, .45);
}


html.luna-halloween-world .luna-hw-pumpkin b {
  display: none;
}


html.luna-halloween-world .luna-hw-pumpkin span {
  position: absolute;
  inset: 0;

  display: grid;
  place-items: center;

  padding-top: 3px;

  font-size: 8px;
  letter-spacing: 1px;
  font-weight: 500;
}


html.luna-halloween-world .luna-hw-pumpkin-one {
  top: 302px;
  right: 14px;

  transform: rotate(7deg);
}


html.luna-halloween-world .luna-hw-pumpkin-two {
  top: 715px;
  left: 10px;

  width: 34px;
  height: 28px;

  transform: rotate(-9deg);

  opacity: .54;
}


/* -------------------------------------------------
   GHOSTS
-------------------------------------------------- */

html.luna-halloween-world .luna-hw-floating-ghost {
  position: absolute;

  width: 34px;
  height: 40px;

  border: 1px solid rgba(92, 55, 62, .12);
  border-radius:
    48% 48% 38% 38% /
    38% 38% 22% 22%;

  background:
    linear-gradient(
      180deg,
      rgba(255, 252, 246, .72),
      rgba(246, 233, 226, .24)
    );

  box-shadow:
    0 9px 20px rgba(73, 46, 51, .05);

  color: rgba(80, 53, 59, .42);

  backdrop-filter: blur(3px);

  opacity: .66;
}


html.luna-halloween-world .luna-hw-floating-ghost::after {
  content: "";

  position: absolute;

  left: 2px;
  right: 2px;
  bottom: -5px;

  height: 11px;

  background:
    radial-gradient(
      circle at 17% 0,
      transparent 6px,
      rgba(247, 237, 230, .42) 6.5px
    ),
    radial-gradient(
      circle at 50% 0,
      transparent 6px,
      rgba(247, 237, 230, .42) 6.5px
    ),
    radial-gradient(
      circle at 83% 0,
      transparent 6px,
      rgba(247, 237, 230, .42) 6.5px
    );

  opacity: .7;
}


html.luna-halloween-world .luna-hw-floating-ghost span {
  position: absolute;
  inset: 0;

  display: grid;
  place-items: center;

  padding-top: 4px;

  font-size: 8px;
  letter-spacing: 1px;
}


html.luna-halloween-world .luna-hw-floating-ghost-one {
  top: 520px;
  right: 12px;

  transform: rotate(7deg);
}


html.luna-halloween-world .luna-hw-floating-ghost-two {
  top: 1080px;
  left: 12px;

  transform: rotate(-8deg);

  opacity: .45;
}


/* -------------------------------------------------
   SPARKS
-------------------------------------------------- */

html.luna-halloween-world .luna-hw-spark {
  position: absolute;

  color: rgba(173, 89, 51, .5);

  font-family: Georgia, serif;
}


html.luna-halloween-world .luna-hw-spark-a {
  top: 236px;
  left: 22px;

  font-size: 11px;
}


html.luna-halloween-world .luna-hw-spark-b {
  top: 390px;
  right: 26px;

  font-size: 16px;
}


html.luna-halloween-world .luna-hw-spark-c {
  top: 880px;
  right: 18px;

  font-size: 9px;
}


/* -------------------------------------------------
   HEADER
-------------------------------------------------- */

html.luna-halloween-world .world-header {
  border-bottom-color: rgba(91, 42, 52, .13);

  background:
    linear-gradient(
      180deg,
      rgba(249, 241, 233, .93),
      rgba(242, 228, 219, .83)
    );

  backdrop-filter: blur(18px);
}


html.luna-halloween-world .world-brand-title span {
  color: var(--hw-wine);

  letter-spacing: .17em;
}


html.luna-halloween-world .world-brand-title span::after {
  content: " · HALLOWEEN 2026";

  color: var(--hw-pumpkin);

  font-size: .74em;
  letter-spacing: .13em;
}


html.luna-halloween-world .world-brand-title strong {
  color: #3f3033;
}


html.luna-halloween-world .nail-studio-entry {
  border-color: rgba(91, 42, 52, .16);

  background:
    linear-gradient(
      145deg,
      rgba(255, 250, 245, .68),
      rgba(230, 210, 205, .54)
    );

  box-shadow:
    0 6px 20px rgba(69, 43, 48, .06);
}


html.luna-halloween-world .nail-studio-entry i {
  color: var(--hw-pumpkin);
}


/* -------------------------------------------------
   INTRO
-------------------------------------------------- */

html.luna-halloween-world .world-intro {
  position: relative;

  border-bottom-color: rgba(91, 42, 52, .12);

  background:
    radial-gradient(
      circle at 86% 12%,
      rgba(104, 47, 63, .13),
      transparent 27%
    ),
    radial-gradient(
      circle at 10% 92%,
      rgba(189, 103, 56, .09),
      transparent 30%
    );
}


html.luna-halloween-world .world-intro::before {
  content: "✦  ALL HALLOWS' EDITION  ·  31 OCT  ✦";

  display: block;

  margin-bottom: 13px;

  color: var(--hw-pumpkin);

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size: 9px;
  letter-spacing: .21em;

  opacity: .78;
}


html.luna-halloween-world .world-intro::after {
  content: "☾";

  position: absolute;

  top: -14px;
  right: 12px;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size: 102px;
  line-height: 1;

  color: rgba(86, 38, 52, .07);

  transform: rotate(-13deg);

  pointer-events: none;
}


html.luna-halloween-world .world-intro > span {
  color: rgba(99, 48, 57, .7);
}


html.luna-halloween-world .world-intro h1 {
  color: #443135;

  text-shadow:
    0 1px 0 rgba(255,255,255,.55);
}


html.luna-halloween-world .world-intro p {
  color: #8a716f;
}


/* -------------------------------------------------
   MAIN NAV
-------------------------------------------------- */

html.luna-halloween-world .world-nav {
  border-top: 1px solid rgba(89, 42, 53, .08);
  border-bottom: 1px solid rgba(89, 42, 53, .13);

  background:
    linear-gradient(
      180deg,
      rgba(237, 221, 214, .76),
      rgba(246, 237, 229, .72)
    );

  box-shadow:
    inset 0 1px rgba(255,255,255,.52),
    0 10px 28px rgba(67, 44, 49, .045);
}


html.luna-halloween-world .world-nav button {
  color: #766267;

  transition:
    background .25s ease,
    color .25s ease,
    transform .25s ease;
}


html.luna-halloween-world .world-nav button span {
  color: rgba(171, 90, 51, .75);
}


html.luna-halloween-world .world-nav button.active {
  color: #f7eee6;

  background:
    linear-gradient(
      145deg,
      #6a3443,
      #4c2934
    );

  box-shadow:
    0 7px 18px rgba(69, 36, 45, .18),
    inset 0 1px rgba(255,255,255,.09);

  transform: translateY(-1px);
}


html.luna-halloween-world .world-nav button.active span,
html.luna-halloween-world .world-nav button.active small {
  color: #d99b72;
}


/* -------------------------------------------------
   LUNA VISION
-------------------------------------------------- */

html.luna-halloween-world .luna-vision-entry {
  position: relative;

  overflow: hidden;

  border-color: rgba(91, 42, 54, .18);

  background:
    radial-gradient(
      circle at 90% 8%,
      rgba(207, 125, 75, .18),
      transparent 27%
    ),
    linear-gradient(
      135deg,
      rgba(83, 42, 53, .96),
      rgba(58, 39, 47, .95)
    );

  color: #f7ece4;

  box-shadow:
    0 18px 42px rgba(65, 36, 44, .18),
    inset 0 1px rgba(255,255,255,.07);
}


html.luna-halloween-world .luna-vision-entry::before {
  content: "☾";

  position: absolute;

  right: 25px;
  top: -36px;

  font-family: Georgia, serif;

  font-size: 138px;

  color: rgba(255, 222, 194, .055);

  transform: rotate(-15deg);
}


html.luna-halloween-world .luna-vision-entry::after {
  content: "HALLOWEEN VISION · COLOUR AFTER DARK";

  position: absolute;

  right: 18px;
  bottom: 12px;

  font-size: 7px;
  letter-spacing: .18em;

  color: rgba(228, 169, 126, .64);
}


html.luna-halloween-world .luna-vision-entry-copy small,
html.luna-halloween-world .luna-vision-entry-copy strong {
  color: #dba47e;
}


html.luna-halloween-world .luna-vision-entry-copy h2 {
  color: #fff7f0;
}


html.luna-halloween-world .luna-vision-entry-copy p {
  color: rgba(246, 231, 221, .69);
}


html.luna-halloween-world .luna-vision-entry-ornament {
  color: #d48654;

  text-shadow:
    0 0 18px rgba(213, 130, 79, .34);
}


/* -------------------------------------------------
   COMMUNITY — MIDNIGHT NOTICE BOARD
-------------------------------------------------- */

html.luna-halloween-world .luna-community-stream {
  border-color: rgba(92, 45, 56, .14);

  background:
    linear-gradient(
      155deg,
      rgba(244, 232, 223, .88),
      rgba(226, 207, 204, .72)
    );

  box-shadow:
    0 13px 34px rgba(65, 42, 47, .07);
}


html.luna-halloween-world .luna-community-stream-title span {
  color: var(--hw-wine);
}


html.luna-halloween-world .luna-community-stream-title span::after {
  content: " · MIDNIGHT BOARD";

  color: var(--hw-pumpkin);
}


html.luna-halloween-world .luna-community-stream-title h2 {
  color: #493438;
}


html.luna-halloween-world .luna-community-salon-link {
  border-color: rgba(91, 42, 53, .17);

  background:
    rgba(101, 48, 62, .08);

  color: #633a45;
}


html.luna-halloween-world .luna-community-progress {
  background: rgba(85, 51, 57, .09);
}


html.luna-halloween-world .luna-community-progress i {
  background:
    linear-gradient(
      90deg,
      var(--hw-wine),
      var(--hw-pumpkin-soft)
    );
}


/* -------------------------------------------------
   WORLD CONTENT
-------------------------------------------------- */

html.luna-halloween-world .world-content {
  background:
    linear-gradient(
      180deg,
      rgba(250, 244, 237, .24),
      rgba(232, 216, 208, .18)
    );
}


html.luna-halloween-world .section-heading > div > span {
  color: var(--hw-wine);
}


html.luna-halloween-world .section-heading h2 {
  color: #49363a;
}


html.luna-halloween-world .section-heading em {
  color: var(--hw-pumpkin);
}


html.luna-halloween-world .section-lead {
  color: #89716f;
}


/* -------------------------------------------------
   LIBRARY
-------------------------------------------------- */

html.luna-halloween-world .library-search {
  border-color: rgba(91, 44, 55, .16);

  background:
    linear-gradient(
      145deg,
      rgba(255, 250, 244, .76),
      rgba(235, 219, 211, .65)
    );

  box-shadow:
    inset 0 1px rgba(255,255,255,.55),
    0 8px 22px rgba(68, 43, 48, .045);
}


html.luna-halloween-world .library-search > span,
html.luna-halloween-world .library-search i {
  color: var(--hw-wine);
}


html.luna-halloween-world .facet-tabs {
  border-color: rgba(91, 43, 54, .11);

  background: rgba(112, 66, 73, .045);
}


html.luna-halloween-world .facet-tabs button {
  color: #786568;
}


html.luna-halloween-world .facet-tabs button.active {
  color: #fff4eb;

  background:
    linear-gradient(
      145deg,
      #71394a,
      #54303b
    );

  box-shadow:
    0 5px 15px rgba(76, 40, 50, .14);
}


html.luna-halloween-world .facet-tabs button.active small {
  color: #dca17a;
}


html.luna-halloween-world .brand-intro {
  border-color: rgba(93, 46, 57, .14);

  background:
    radial-gradient(
      circle at 92% 30%,
      rgba(186, 96, 50, .11),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      rgba(245, 232, 222, .86),
      rgba(226, 208, 203, .7)
    );
}


html.luna-halloween-world .brand-intro span {
  color: var(--hw-wine);
}


html.luna-halloween-world .brand-intro b {
  color: var(--hw-pumpkin);
}


/* Product photography MUST remain true to source. */

html.luna-halloween-world .product-grid img,
html.luna-halloween-world .detail-product-image,
html.luna-halloween-world .detail-product-gallery img {
  filter: none !important;
  mix-blend-mode: normal !important;
}


/* -------------------------------------------------
   SELECTS
-------------------------------------------------- */

html.luna-halloween-world .selects-coming-soon {
  border-color: rgba(91, 43, 55, .15);

  background:
    radial-gradient(
      circle at 50% 35%,
      rgba(179, 92, 52, .11),
      transparent 28%
    ),
    linear-gradient(
      155deg,
      rgba(246, 235, 226, .88),
      rgba(224, 205, 201, .72)
    );
}


html.luna-halloween-world .selects-coming-soon > span {
  color: var(--hw-wine);
}


html.luna-halloween-world .selects-orbit b {
  color: var(--hw-pumpkin);
}


/* -------------------------------------------------
   NOTES
-------------------------------------------------- */

html.luna-halloween-world .note-categories button {
  border-color: rgba(91, 44, 54, .12);

  background:
    linear-gradient(
      145deg,
      rgba(250, 243, 235, .76),
      rgba(232, 216, 208, .65)
    );
}


html.luna-halloween-world .note-categories button span {
  color: var(--hw-wine);
}


html.luna-halloween-world .note-categories button i {
  color: var(--hw-pumpkin);
}


html.luna-halloween-world .note-card {
  border-color: rgba(91, 44, 55, .13);

  background:
    linear-gradient(
      155deg,
      rgba(248, 239, 231, .9),
      rgba(229, 212, 206, .72)
    );

  box-shadow:
    0 10px 28px rgba(67, 42, 47, .055);
}


html.luna-halloween-world .note-card header span {
  color: var(--hw-wine);
}


html.luna-halloween-world .note-card footer span {
  color: #784656;
}


/* -------------------------------------------------
   BULLETIN — HALLOWEEN ISSUE
-------------------------------------------------- */

html.luna-halloween-world .bulletin-journal {
  position: relative;
}


html.luna-halloween-world .bulletin-masthead {
  border-color: rgba(84, 39, 50, .17);

  background:
    radial-gradient(
      circle at 88% 13%,
      rgba(196, 104, 57, .15),
      transparent 27%
    ),
    linear-gradient(
      155deg,
      rgba(237, 219, 210, .92),
      rgba(222, 199, 198, .82)
    );
}


html.luna-halloween-world .bulletin-masthead::before {
  content: "HALLOWEEN EDITION";

  display: block;

  margin-bottom: 8px;

  color: var(--hw-pumpkin);

  font-size: 8px;
  letter-spacing: .24em;
}


html.luna-halloween-world .bulletin-nameplate h2,
html.luna-halloween-world .bulletin-nameplate strong {
  color: #4e3139;
}


html.luna-halloween-world .bulletin-nameplate i {
  color: var(--hw-wine);
}


html.luna-halloween-world .bulletin-section-strip {
  border-color: rgba(89, 42, 53, .12);

  color: #704552;
}


html.luna-halloween-world .bulletin-section-rule span {
  color: var(--hw-wine);
}


html.luna-halloween-world .bulletin-section-rule em {
  color: var(--hw-pumpkin);
}


html.luna-halloween-world .bulletin-colophon i {
  color: var(--hw-pumpkin);
}


/* -------------------------------------------------
   RADAR
-------------------------------------------------- */

html.luna-halloween-world .radar-hero {
  border-color: rgba(91, 43, 54, .14);

  background:
    radial-gradient(
      circle at 82% 28%,
      rgba(191, 99, 53, .13),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      rgba(240, 225, 216, .88),
      rgba(222, 203, 201, .76)
    );
}


html.luna-halloween-world .radar-hero > span {
  color: var(--hw-wine);
}


html.luna-halloween-world .radar-types span {
  border-color: rgba(94, 44, 56, .13);

  color: #774554;

  background: rgba(106, 54, 67, .055);
}


html.luna-halloween-world .radar-event-card {
  border-color: rgba(94, 45, 56, .15);

  background:
    linear-gradient(
      145deg,
      rgba(248, 238, 230, .86),
      rgba(229, 211, 205, .72)
    );
}


/* -------------------------------------------------
   SECONDARY SCREENS
-------------------------------------------------- */

html.luna-halloween-world .world-screen {
  background:
    radial-gradient(
      circle at 92% 5%,
      rgba(102, 43, 60, .12),
      transparent 24%
    ),
    linear-gradient(
      155deg,
      #f6ede5,
      #eadbd3
    );
}


html.luna-halloween-world .detail-header {
  background:
    rgba(246, 236, 228, .88);

  border-bottom-color:
    rgba(91, 42, 54, .12);

  backdrop-filter: blur(16px);
}


html.luna-halloween-world .round-button {
  border-color: rgba(92, 43, 55, .14);

  background:
    rgba(103, 53, 66, .07);

  color: var(--hw-wine);
}


/* -------------------------------------------------
   LOADER
-------------------------------------------------- */

html.luna-halloween-world .luna-world-loader {
  background:
    radial-gradient(
      circle at 50% 38%,
      rgba(167, 79, 48, .13),
      transparent 27%
    ),
    linear-gradient(
      160deg,
      #f7eee6,
      #ead8d0
    );
}


html.luna-halloween-world
.luna-world-loader-halloween-art {
  display: block;

  width: min(43vw, 220px);
  max-height: 48vh;

  margin: 0 auto 18px;

  object-fit: contain;

  filter:
    drop-shadow(
      0 16px 24px rgba(71, 43, 47, .11)
    );
}


html.luna-halloween-world
.luna-world-loader-classic-mark {
  display: none !important;
}


html.luna-halloween-world
.loader-halloween-copy {
  display: block !important;
}


html.luna-halloween-world
.loader-classic-copy {
  display: none !important;
}


html.luna-halloween-world
.luna-world-loader-label {
  color: #593943;
}


html.luna-halloween-world
.luna-world-loader-dots i {
  background: var(--hw-pumpkin);
}


html.luna-halloween-world
.luna-world-loader-progress {
  background:
    rgba(86, 45, 54, .08);
}


html.luna-halloween-world
.luna-world-loader-progress span,
html.luna-halloween-world
.luna-world-loader-progress::after {
  background:
    linear-gradient(
      90deg,
      var(--hw-wine),
      var(--hw-pumpkin-soft)
    );
}


/* -------------------------------------------------
   SUBTLE MOTION
-------------------------------------------------- */

@media (prefers-reduced-motion: no-preference) {

  html.luna-halloween-world
  .luna-hw-floating-ghost-one {
    animation:
      lunaHalloweenGhostOne
      5.8s ease-in-out infinite;
  }

  html.luna-halloween-world
  .luna-hw-floating-ghost-two {
    animation:
      lunaHalloweenGhostTwo
      7.2s ease-in-out infinite;
  }

  html.luna-halloween-world
  .luna-hw-spark {
    animation:
      lunaHalloweenSpark
      3.2s ease-in-out infinite;
  }

  html.luna-halloween-world
  .luna-hw-pumpkin-one {
    animation:
      lunaHalloweenPumpkin
      6.4s ease-in-out infinite;
  }
}


@keyframes lunaHalloweenGhostOne {
  0%, 100% {
    transform:
      translateY(0)
      rotate(7deg);
  }

  50% {
    transform:
      translateY(-8px)
      rotate(3deg);
  }
}


@keyframes lunaHalloweenGhostTwo {
  0%, 100% {
    transform:
      translateY(0)
      rotate(-8deg);
  }

  50% {
    transform:
      translateY(-6px)
      rotate(-3deg);
  }
}


@keyframes lunaHalloweenSpark {
  0%, 100% {
    opacity: .3;
    transform: scale(.88);
  }

  50% {
    opacity: .75;
    transform: scale(1.08);
  }
}


@keyframes lunaHalloweenPumpkin {
  0%, 100% {
    transform:
      translateY(0)
      rotate(7deg);
  }

  50% {
    transform:
      translateY(-3px)
      rotate(4deg);
  }
}


/* -------------------------------------------------
   SMALL SCREENS
-------------------------------------------------- */

@media (max-width: 420px) {

  html.luna-halloween-world
  .world-brand-title span::after {
    content: " · HW 26";
  }

  html.luna-halloween-world
  .world-intro::before {
    font-size: 7px;
    letter-spacing: .15em;
  }

  html.luna-halloween-world
  .luna-hw-floating-ghost {
    opacity: .48;
  }
}


/* ===== LUNA HALLOWEEN NIGHT EDITORIAL END ===== */




/* ===== LUNA WORLD LOADER BASE 20260916 ===== */

.luna-world-loader {
  position: fixed;
  inset: 0;

  z-index: 99999;

  display: flex;
  align-items: center;
  justify-content: center;

  width: min(100%, 520px);
  min-height: 100dvh;

  margin: auto;

  background:
    linear-gradient(
      155deg,
      #f8f4ef,
      #ece4dd
    );

  transition:
    opacity .38s ease,
    visibility .38s ease;
}


.luna-world-loader.is-hidden {
  opacity: 0;
  visibility: hidden;

  pointer-events: none;
}


.luna-world-loader-inner {
  width: min(82%, 360px);

  text-align: center;
}


.luna-world-loader-halloween-art {
  display: none;
}


.luna-world-loader-classic-mark {
  margin-bottom: 18px;

  color: #746965;

  font-family: Georgia, serif;

  font-size: 52px;
}


.luna-world-loader-label {
  color: #6e625e;

  font-size: 11px;
  letter-spacing: .14em;
}


.loader-halloween-copy {
  display: none;
}


.luna-world-loader-dots {
  display: flex;
  justify-content: center;
  gap: 6px;

  margin-top: 12px;
}


.luna-world-loader-dots i {
  width: 4px;
  height: 4px;

  border-radius: 999px;

  background: #8d817c;

  animation:
    lunaLoaderDot
    1.05s ease-in-out infinite;
}


.luna-world-loader-dots i:nth-child(2) {
  animation-delay: .13s;
}


.luna-world-loader-dots i:nth-child(3) {
  animation-delay: .26s;
}


.luna-world-loader-progress {
  position: relative;

  width: 94px;
  height: 1px;

  margin: 17px auto 0;

  overflow: hidden;

  background:
    rgba(90, 76, 72, .1);
}


.luna-world-loader-progress span {
  position: absolute;

  left: -55%;
  top: 0;

  width: 55%;
  height: 100%;

  background: #897d78;

  animation:
    lunaLoaderProgress
    1.15s ease-in-out infinite;
}


@keyframes lunaLoaderDot {
  0%, 100% {
    opacity: .25;
    transform: translateY(0);
  }

  50% {
    opacity: 1;
    transform: translateY(-3px);
  }
}


@keyframes lunaLoaderProgress {
  0% {
    left: -55%;
  }

  100% {
    left: 105%;
  }
}



/* ==========================================================
   LUNA NAIL LIBRARY
   Restore original tab artwork.
   Selected state uses the corresponding DARK image asset.
   No synthetic dark rectangle.
   ========================================================== */

.library-tabs button,
.library-tab,
.filter-tab,
[data-library-tab],
[data-filter-tab] {
  background-color: transparent !important;
  box-shadow: none !important;
}

.library-tabs button::before,
.library-tabs button::after,
.library-tab::before,
.library-tab::after,
.filter-tab::before,
.filter-tab::after,
[data-library-tab]::before,
[data-library-tab]::after,
[data-filter-tab]::before,
[data-filter-tab]::after {
  background-color: transparent !important;
}

/* Never cover the original artwork with a Halloween fill. */
.library-tabs img,
.library-tab img,
.filter-tab img,
[data-library-tab] img,
[data-filter-tab] img {
  position: relative !important;
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  z-index: 2 !important;
  background: transparent !important;
  filter: none !important;
}


/* ==========================================================
   2026-09-17
   LUNA LIBRARY TAB FINAL ARTWORK FIX

   PNG artwork is the ONLY visual background.
   Remove every synthetic active/selected fill.
   ========================================================== */

.library-tabs button,
.library-tabs button.active,
.library-tabs button:hover,
.library-tabs button:focus,
.library-tabs button:focus-visible,
.library-tabs button[aria-selected="true"] {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
  outline: none !important;
  filter: none !important;
}

.library-tabs button::before,
.library-tabs button::after,
.library-tabs button.active::before,
.library-tabs button.active::after,
.library-tabs button[aria-selected="true"]::before,
.library-tabs button[aria-selected="true"]::after {
  content: none !important;
  display: none !important;
  background: none !important;
  background-image: none !important;
  box-shadow: none !important;
}

.library-tabs button > img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-width: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  object-fit: contain !important;
  background: transparent !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  pointer-events: none !important;
}

html[data-luna-theme="halloween"] .library-tabs button,
html[data-luna-theme="halloween"] .library-tabs button.active,
html[data-luna-theme="halloween"] .library-tabs button:hover,
html[data-luna-theme="halloween"] .library-tabs button:focus,
html[data-luna-theme="halloween"] .library-tabs button[aria-selected="true"] {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
}

html[data-luna-theme="halloween"] .library-tabs button::before,
html[data-luna-theme="halloween"] .library-tabs button::after {
  content: none !important;
  display: none !important;
}



/* =========================================================
   LUNA WORLD · ARTISAN OPEN CALL
   Temporary editorial hero placed before Luna Vision
   ========================================================= */

.artisan-open-call-section {
  position: relative;
  width: 100%;
  margin: 42px 0 52px;
  padding: 0 28px;
}

.artisan-open-call-card {
  --artisan-wine: #74554f;
  --artisan-ink: #423936;
  --artisan-muted: #9c8d87;
  --artisan-line: rgba(106, 82, 75, .20);

  position: relative;
  display: block;
  width: 100%;
  min-height: 500px;
  overflow: hidden;

  padding: 38px 48px 34px;

  color: var(--artisan-ink);
  text-decoration: none;

  border: 1px solid var(--artisan-line);
  border-radius: 42px;

  background:
    radial-gradient(
      circle at 86% 18%,
      rgba(174, 139, 126, .12),
      transparent 27%
    ),
    radial-gradient(
      circle at 8% 100%,
      rgba(210, 187, 174, .14),
      transparent 30%
    ),
    linear-gradient(
      125deg,
      rgba(255, 253, 249, .80),
      rgba(242, 233, 226, .68)
    );

  box-shadow:
    inset 0 0 0 7px rgba(255, 255, 255, .24),
    0 18px 55px rgba(95, 69, 60, .055);

  transition:
    transform .45s cubic-bezier(.2,.75,.25,1),
    box-shadow .45s ease,
    border-color .45s ease;
}

.artisan-open-call-card::before {
  content: "";
  position: absolute;
  inset: 10px;
  pointer-events: none;

  border: 1px solid rgba(113, 85, 77, .11);
  border-radius: 34px;
}

.artisan-open-call-card::after {
  content: "";
  position: absolute;
  left: 48px;
  right: 48px;
  bottom: 72px;
  height: 1px;

  background: linear-gradient(
    90deg,
    rgba(107, 82, 75, .24),
    rgba(107, 82, 75, .06)
  );
}

.artisan-open-call-card:hover {
  transform: translateY(-3px);

  border-color: rgba(107, 82, 75, .30);

  box-shadow:
    inset 0 0 0 7px rgba(255, 255, 255, .28),
    0 26px 70px rgba(95, 69, 60, .09);
}

.artisan-open-call-topline {
  position: relative;
  z-index: 3;

  display: flex;
  align-items: center;
  justify-content: space-between;

  font-family:
    -apple-system,
    BlinkMacSystemFont,
    "Helvetica Neue",
    "PingFang SC",
    sans-serif;

  font-size: 10px;
  letter-spacing: .24em;
  color: var(--artisan-muted);
}

.artisan-open-call-content {
  position: relative;
  z-index: 3;

  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(250px, .55fr);
  gap: 60px;

  min-height: 350px;

  align-items: end;
  padding: 66px 22px 55px;
}

.artisan-open-call-title small {
  display: block;

  margin-bottom: 24px;

  font-family:
    -apple-system,
    BlinkMacSystemFont,
    "Helvetica Neue",
    sans-serif;

  font-size: 10px;
  letter-spacing: .28em;

  color: var(--artisan-muted);
}

.artisan-open-call-title h2 {
  margin: 0;

  max-width: 760px;

  font-family:
    "Times New Roman",
    "Songti SC",
    "STSong",
    serif;

  font-size: clamp(50px, 6.1vw, 90px);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -.045em;

  color: var(--artisan-ink);
}

.artisan-open-call-title h2 span {
  display: block;
}

.artisan-open-call-title h2 em {
  font-weight: 400;
  font-style: italic;

  color: var(--artisan-wine);
}

.artisan-open-call-copy {
  position: relative;

  display: flex;
  flex-direction: column;
  justify-content: flex-end;

  min-height: 215px;
}

.artisan-open-call-copy p {
  margin: 0 0 36px;

  font-family:
    "Times New Roman",
    "Songti SC",
    "STSong",
    serif;

  font-size: 17px;
  line-height: 1.9;

  color: #776964;
}

.artisan-open-call-entry {
  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 25px;

  padding-top: 20px;

  border-top: 1px solid rgba(109, 83, 76, .18);
}

.artisan-open-call-entry > span {
  font-family:
    "Times New Roman",
    "Songti SC",
    "STSong",
    serif;

  font-size: 16px;
  line-height: 1.4;
}

.artisan-open-call-entry small {
  display: block;

  margin-top: 7px;

  font-family:
    -apple-system,
    BlinkMacSystemFont,
    "Helvetica Neue",
    sans-serif;

  font-size: 8px;
  letter-spacing: .18em;

  color: var(--artisan-muted);
}

.artisan-open-call-entry b {
  display: grid;
  place-items: center;

  width: 58px;
  height: 58px;
  flex: 0 0 58px;

  border: 1px solid rgba(104, 78, 71, .24);
  border-radius: 50%;

  background: rgba(255, 255, 255, .28);

  font-size: 22px;
  font-weight: 400;

  transition:
    transform .35s ease,
    background .35s ease;
}

.artisan-open-call-card:hover .artisan-open-call-entry b {
  transform: translate(3px, -3px);
  background: rgba(255, 255, 255, .52);
}

.artisan-open-call-footer {
  position: relative;
  z-index: 3;

  display: flex;
  gap: 42px;

  padding-top: 18px;

  font-family:
    -apple-system,
    BlinkMacSystemFont,
    "Helvetica Neue",
    sans-serif;

  font-size: 8px;
  letter-spacing: .22em;

  color: #aa9b95;
}

.artisan-open-call-atmosphere {
  position: absolute;
  inset: 0;

  overflow: hidden;
  pointer-events: none;
}

.artisan-open-call-moon {
  position: absolute;

  right: 6%;
  top: 7%;

  font-family:
    "Times New Roman",
    serif;

  font-size: clamp(220px, 26vw, 390px);
  line-height: 1;

  color: rgba(113, 82, 75, .052);

  transform: rotate(-11deg);
}

.artisan-open-call-orbit {
  position: absolute;

  border: 1px solid rgba(113, 82, 75, .07);
  border-radius: 50%;
}

.artisan-open-call-orbit.orbit-one {
  width: 420px;
  height: 420px;

  right: -115px;
  top: -145px;
}

.artisan-open-call-orbit.orbit-two {
  width: 330px;
  height: 330px;

  right: -70px;
  top: -100px;
}

.artisan-open-call-star {
  position: absolute;
  color: rgba(112, 81, 74, .16);
}

.artisan-open-call-star.star-one {
  top: 23%;
  right: 35%;
  font-size: 20px;
}

.artisan-open-call-star.star-two {
  bottom: 24%;
  left: 46%;
  font-size: 13px;
}

@media (max-width: 760px) {
  .artisan-open-call-section {
    margin: 28px 0 38px;
    padding: 0 12px;
  }

  .artisan-open-call-card {
    min-height: 570px;

    padding: 26px 24px 27px;

    border-radius: 31px;
  }

  .artisan-open-call-card::before {
    inset: 7px;
    border-radius: 25px;
  }

  .artisan-open-call-card::after {
    left: 24px;
    right: 24px;
    bottom: 66px;
  }

  .artisan-open-call-topline {
    font-size: 8px;
    letter-spacing: .15em;
  }

  .artisan-open-call-topline span:last-child {
    display: none;
  }

  .artisan-open-call-content {
    display: flex;
    flex-direction: column;

    min-height: 435px;

    gap: 42px;

    align-items: stretch;
    justify-content: space-between;

    padding: 64px 3px 38px;
  }

  .artisan-open-call-title h2 {
    font-size: clamp(45px, 13.5vw, 68px);
    line-height: 1.08;
  }

  .artisan-open-call-title h2 span {
    display: inline;
  }

  .artisan-open-call-title h2 span:first-child::after {
    content: "\\A";
    white-space: pre;
  }

  .artisan-open-call-copy {
    min-height: 0;
  }

  .artisan-open-call-copy p {
    margin-bottom: 27px;

    font-size: 15px;
    line-height: 1.8;
  }

  .artisan-open-call-entry b {
    width: 50px;
    height: 50px;
    flex-basis: 50px;
  }

  .artisan-open-call-footer {
    gap: 18px;
    overflow: hidden;
    white-space: nowrap;

    font-size: 7px;
  }

  .artisan-open-call-footer span:last-child {
    display: none;
  }

  .artisan-open-call-moon {
    right: -24%;
    top: 8%;
    font-size: 270px;
  }

  .artisan-open-call-star.star-one {
    right: 14%;
  }
}

/* =========================================================
   ARTISAN OPEN CALL · TYPE SCALE FIX
   2026-09-18
   ========================================================= */

/* Desktop / tablet */
.artisan-open-call-title h2 {
  max-width: 720px;
  font-size: clamp(42px, 4.8vw, 72px);
  line-height: 1.10;
  letter-spacing: -.035em;
}

.artisan-open-call-title h2 span {
  display: block;
}

.artisan-open-call-content {
  grid-template-columns:
    minmax(0, 1.35fr)
    minmax(260px, .65fr);
}

/* Mobile */
@media (max-width: 760px) {
  .artisan-open-call-card {
    min-height: 500px;
  }

  .artisan-open-call-content {
    min-height: 370px;
    padding-top: 50px;
    gap: 34px;
  }

  .artisan-open-call-title small {
    margin-bottom: 18px;
    font-size: 8px;
    line-height: 1.55;
    letter-spacing: .24em;
  }

  .artisan-open-call-title h2 {
    max-width: none;

    /*
      Important:
      no huge vw-based Chinese typography.
    */
    font-size: clamp(36px, 9.4vw, 48px);
    line-height: 1.13;
    letter-spacing: -.035em;
  }

  .artisan-open-call-title h2 span {
    display: block;
  }

  .artisan-open-call-title h2 span:first-child::after {
    content: none;
  }

  .artisan-open-call-copy p {
    font-size: 14px;
    line-height: 1.8;
  }

  .artisan-open-call-entry > span {
    font-size: 15px;
  }

  .artisan-open-call-moon {
    right: -15%;
    top: 17%;
    font-size: 230px;
  }
}

/* Narrow phones */
@media (max-width: 420px) {
  .artisan-open-call-title h2 {
    font-size: 36px;
  }

  .artisan-open-call-card {
    min-height: 485px;
  }
}

/* =========================================================
   LUNA ARTISAN OPEN CALL
   MOBILE EDITORIAL LAYOUT · CLEAN FINAL
   2026-09-18
   ========================================================= */

@media screen and (max-width: 760px) {

  .artisan-open-call-section {
    display: block !important;
    width: 100% !important;
    margin: 30px 0 42px !important;
    padding: 0 12px !important;
  }

  .artisan-open-call-card {
    display: block !important;
    position: relative !important;

    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;

    padding: 24px 22px 28px !important;

    overflow: hidden !important;
  }

  .artisan-open-call-content {
    display: block !important;
    position: relative !important;
    z-index: 2 !important;

    width: 100% !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 56px 0 40px !important;

    inset: auto !important;
    transform: none !important;

    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
  }

  .artisan-open-call-title {
    display: block !important;
    position: relative !important;

    width: 100% !important;
    height: auto !important;
    min-width: 0 !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    inset: auto !important;
    transform: none !important;
    float: none !important;

    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
  }

  .artisan-open-call-title small {
    display: block !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 0 22px !important;
    padding: 0 !important;

    color: inherit;

    font-size: 8px !important;
    line-height: 1.5 !important;
    letter-spacing: .22em !important;

    white-space: normal !important;

    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
  }

  .artisan-open-call-title h2 {
    display: block !important;
    position: static !important;

    width: 100% !important;
    height: auto !important;
    min-width: 0 !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    columns: auto !important;
    column-count: auto !important;

    font-size: clamp(27px, 7.8vw, 31px) !important;
    line-height: 1.30 !important;
    letter-spacing: -.025em !important;

    text-align: left !important;

    white-space: normal !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;

    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;

    transform: none !important;
  }

  .artisan-open-call-title h2 span {
    display: block !important;
    position: static !important;

    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    float: none !important;
    clear: both !important;

    flex: none !important;
    grid-column: auto !important;
    grid-row: auto !important;

    white-space: nowrap !important;

    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;

    transform: none !important;
  }

  .artisan-open-call-title h2 span:first-child::after {
    content: none !important;
    display: none !important;
  }

  .artisan-open-call-title h2 em {
    display: inline !important;
    position: static !important;

    width: auto !important;

    font-style: inherit;

    white-space: nowrap !important;

    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;

    transform: none !important;
  }

  .artisan-open-call-copy {
    display: block !important;
    position: static !important;

    width: 100% !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: none !important;

    margin: 42px 0 0 !important;
    padding: 0 !important;

    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;

    transform: none !important;
  }

  .artisan-open-call-copy p {
    display: block !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 0 27px !important;

    font-size: 14px !important;
    line-height: 1.82 !important;

    writing-mode: horizontal-tb !important;
  }

  .artisan-open-call-entry {
    display: flex !important;

    width: 100% !important;

    align-items: center !important;
    justify-content: space-between !important;

    writing-mode: horizontal-tb !important;
  }

  .artisan-open-call-footer {
    position: relative !important;

    width: 100% !important;

    writing-mode: horizontal-tb !important;
  }

  .artisan-open-call-moon {
    top: 12% !important;
    right: -20% !important;

    font-size: 190px !important;

    opacity: .68 !important;

    pointer-events: none !important;
  }
}

@media screen and (max-width: 390px) {

  .artisan-open-call-card {
    padding-left: 19px !important;
    padding-right: 19px !important;
  }

  .artisan-open-call-content {
    padding-top: 50px !important;
  }

  .artisan-open-call-title h2 {
    font-size: 27px !important;
    letter-spacing: -.03em !important;
  }

  .artisan-open-call-copy {
    margin-top: 38px !important;
  }

  .artisan-open-call-moon {
    right: -24% !important;
    font-size: 175px !important;
  }
}


/* =========================================================
   ARTISAN OPEN CALL · TEMPORARILY HIDE BIG CHINESE TITLE
   2026-09-18
   ========================================================= */

.artisan-open-call-title h2 {
  display: none !important;
}

@media screen and (max-width: 760px) {

  .artisan-open-call-title h2 {
    display: none !important;
  }

  .artisan-open-call-title small {
    margin-bottom: 0 !important;
  }

  .artisan-open-call-copy {
    margin-top: 52px !important;
  }

}