/* 五芒星航品牌語言（2026-10）：墨、銅、紙。規則見 release/BRAND-GUIDE.md。
   這支最後載入，只改 token 和需要換掉的部分；其他版面沿用原本的樣式表。 */

/* ---------- 1. Token：配色依 Codex「星圖與日常」（深海墨、紙、黃銅、鼠尾草、朱砂）；便條的粉與綠保留 ---------- */
:root{--paper:#eee8dc;--paper-2:#e3ddcf;--sheet:#f8f4eb;--ink:#203a43;--ink-2:#344d53;--mute:#596662;--rule:#c7c8bc;--rule-strong:#203a43;--copper:#76502d;--copper-soft:#c4a574;--gold:#c4a574;--sage:#ccd2c2;--seal:#203a43;--seal-hover:#36545c;--seal-ink:#f8f4eb;--wine:#203a43;--wine-dark:#192e35;--sea:#203a43;--brass:#c4a574;--clay:#a64f3d;--night:#203a43;--on-night:#eee8dc;--night-mute:#c9d1c8;--copper-line:#c4a574;--note-pink:#f2c6b6;--note-mint:#cfe5c3;--on-note:#2a2420;--focus:#9a6535;--display:'Cormorant Garamond',Georgia,serif;--latin:'Cormorant Garamond',Georgia,serif}
:root[data-theme=dark]{--paper:#192e35;--paper-2:#1f363e;--sheet:#253e46;--ink:#eee8dc;--ink-2:#dedbcc;--mute:#b7c5c1;--rule:#466069;--rule-strong:#d4d9cf;--copper:#d5b688;--copper-soft:#5a4a36;--gold:#d5b688;--sage:#2a4048;--seal:#d5b688;--seal-hover:#e6ccab;--seal-ink:#203a43;--night:#25434c;--night-mute:#c9d1c8;--note-pink:#e8b9a8;--note-mint:#c3dab7;--focus:#d5b688;color-scheme:dark}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--paper:#192e35;--paper-2:#1f363e;--sheet:#253e46;--ink:#eee8dc;--ink-2:#dedbcc;--mute:#b7c5c1;--rule:#466069;--rule-strong:#d4d9cf;--copper:#d5b688;--copper-soft:#5a4a36;--gold:#d5b688;--sage:#2a4048;--seal:#d5b688;--seal-hover:#e6ccab;--seal-ink:#203a43;--night:#25434c;--night-mute:#c9d1c8;--note-pink:#e8b9a8;--note-mint:#c3dab7;--focus:#d5b688;color-scheme:dark}}

/* ---------- 2. 字型與排版：依 Codex 品牌手冊「星圖與日常」 ----------
   中文標題思源宋體 500、內文與介面思源黑體；英文簽名 Cormorant Garamond。
   英文頁用兩套思源字型的西文原型（Source Serif 4／Source Sans 3），避免思源黑體把 ’ 排成全形。 */
html[lang=en]{--sans:"Source Sans 3","Noto Sans TC","PingFang TC",sans-serif;--display:"Source Serif 4","Noto Serif TC",Georgia,serif}
body{font-size:16px;line-height:1.9;text-spacing-trim:trim-start;text-autospace:normal;line-break:strict}
h1,h2,h3{font-weight:500;letter-spacing:.015em;font-feature-settings:"palt";text-wrap:balance}
h1{max-width:100%}
figcaption{font-size:12px;line-height:1.65;color:var(--mute)}
:focus-visible{outline:2px solid var(--focus);outline-offset:5px}
a{text-underline-offset:.3em}
a:hover{color:var(--copper)}
::selection{background:#c4a574;color:#152c34}
.page-head{padding-top:54px;padding-bottom:54px}
.page-head h1{font-weight:500;font-size:clamp(34px,4vw,52px)}
.prose{max-width:680px;line-height:2}
.prose>p,.prose>ul,.prose>ol{font-size:17px;line-height:2.1}
.prose>p{margin-bottom:26px}
.prose h2{margin-top:44px;font-weight:500}
.prose>blockquote{font-family:var(--serif)}
.section{padding-block:72px}
.tint{background:var(--paper-2)}
.btn,.theme-toggle{border-radius:0;box-shadow:none!important}
.journal-entry-copy h3{font-weight:500}
.eyebrow,.section-overline{display:none}
.footer-signature,.footer-signature .sig-word{font-family:"Cormorant Garamond",Georgia,serif}
html[lang=en] :is(h1,h2,h3,h4){font-family:var(--display);font-weight:500;letter-spacing:0}
@media(max-width:560px){.page-head{padding-top:32px;padding-bottom:40px}.page-head h1{font-size:34px}.section{padding-block:48px}.prose>p,.prose>ul,.prose>ol{font-size:16px;line-height:2}}

/* ---------- 3. 按鈕與連結 ---------- */
.btn{border-radius:2px;letter-spacing:.04em;font-weight:500;transition:background-color .18s ease-out,color .18s ease-out,border-color .18s ease-out}
.btn-seal{background:var(--seal);background-image:none;color:var(--seal-ink);border:1px solid var(--seal)}
.btn-seal:hover,.motion-ok .btn-seal:hover{background:transparent;background-image:none;color:var(--ink);border-color:var(--ink)}
.salon-textlink,.textlink{text-decoration-color:var(--copper);text-underline-offset:6px}

/* ---------- 4. 頁首、頁尾：Codex「星圖與日常」格式（純文字選單、手機「選單＋」、頁尾大字）。logo 用原圖，不套濾鏡。 ---------- */
.b-shell{width:min(100% - 104px,1248px);margin-inline:auto}
.b-button{display:inline-flex;gap:30px;align-items:center;justify-content:space-between;min-height:52px;padding:13px 23px;background:var(--sea);color:#f8f4eb;text-decoration:none;font-size:14px}
.b-button:hover{background:#36545c;color:#fff}
.b-button.light{background:#eee8dc;color:#203a43}
.b-button.light:hover{background:#d7cbb4;color:#203a43}
.brand-header{background:var(--paper);border-bottom:1px solid var(--rule);position:relative;z-index:40}
.b-nav{min-height:104px;display:flex;align-items:center;gap:36px}
.b-logo{display:flex;align-items:center;gap:14px;color:var(--ink);text-decoration:none;margin-right:auto;flex-shrink:0}
.b-logo img{border-radius:50%;display:block}
.b-logo b{font-family:var(--serif);font-size:25px;font-weight:700;letter-spacing:.2em}
.b-logo small{display:block;font-family:Georgia,serif;font-size:9px;letter-spacing:.15em;line-height:1.6}
.b-desktop{display:flex;gap:29px}
.b-desktop a{color:var(--ink);text-decoration:none;font-size:14px}
.b-desktop a[aria-current="page"]{text-decoration:underline;text-decoration-color:var(--copper);text-underline-offset:10px}
.b-utilities{display:flex;align-items:center;gap:22px}
.b-utilities button{font-size:12px;padding:10px 0;background:none;border:0;color:var(--ink);min-height:0}
.b-utilities .lang-switch{font-size:12px;letter-spacing:.08em;color:var(--ink);text-decoration:none;padding:10px 0}
.b-utilities .lang-switch:hover{text-decoration:underline}
.b-book{font-size:14px;color:var(--ink);border-bottom:1px solid var(--ink);text-decoration:none;padding:6px 0}
.b-menu{display:none}
.brand-footer{background:#203a43;color:#eee8dc;padding:75px 0 25px}
.b-footer-top{display:grid;grid-template-columns:1.5fr .65fr .8fr;gap:64px}
.b-footer-top>div:first-child>img{border-radius:50%}
.b-footer-top h2{font-size:34px;font-weight:500;line-height:1.6;margin:24px 0 32px;color:#eee8dc}
.b-footer-top nav,.b-social{display:flex;flex-direction:column;align-items:flex-start;gap:13px;padding-top:12px;font-size:13px}
.b-footer-top a:not(.b-button){color:#eee8dc;text-decoration:none}
.b-footer-top a:hover{text-decoration:underline}
.b-social span{color:#bdccc6;line-height:2;margin-top:18px;font-size:12px}
.b-footer-word{font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(52px,10.4vw,146px);line-height:1.3;margin:72px 0 30px;letter-spacing:-.035em;white-space:nowrap;border-bottom:1px solid #6d827b66;padding-bottom:16px;color:#c4a574}
.b-notice{font-size:11px;line-height:1.8;color:#bccbc4;margin:0 0 12px}
.b-bottom{display:flex;justify-content:space-between;gap:20px;font-size:11px;color:#bccbc4}
.b-bottom a{color:inherit}
@media(max-width:1050px){.b-shell{width:calc(100% - 64px)}.b-nav{gap:25px}.b-desktop{gap:20px}.b-utilities{gap:15px}.b-footer-top{gap:40px}.b-logo b{font-size:22px}.b-logo img{width:42px;height:42px}}
@media(max-width:800px){.b-desktop{display:none}.b-nav{min-height:86px;gap:22px}.b-menu{display:block}.b-menu summary{font-size:13px;list-style:none;cursor:pointer;padding:12px 0}.b-menu summary::-webkit-details-marker{display:none}.b-menu summary:after{content:'＋';margin-left:7px}.b-menu[open] summary:after{content:'−'}.b-menu nav{position:absolute;top:100%;left:0;right:0;background:var(--paper);padding:20px 32px 35px;display:grid;grid-template-columns:1fr 1fr;gap:20px;border-bottom:1px solid var(--rule);box-shadow:0 20px 30px #142c3522}.b-menu a{font-size:15px;color:var(--ink)}.b-footer-top{grid-template-columns:1.4fr 1fr;gap:40px}.b-social{grid-column:2;grid-row:1}.b-footer-top nav{grid-column:2;grid-row:2;padding:0}.b-footer-top>div:first-child{grid-row:1/3}}
@media(max-width:560px){.b-shell{width:calc(100% - 40px)}.b-nav{min-height:78px;gap:16px}.b-logo{gap:8px}.b-logo img{width:34px;height:34px}.b-logo b{font-size:20px;letter-spacing:.12em}.b-logo small{font-size:7px;letter-spacing:.1em}.b-utilities{gap:12px}.b-utilities button,.b-utilities .lang-switch{font-size:11px}.b-book{display:none}.b-menu summary{font-size:12px}.brand-footer{padding:45px 0 24px}.b-footer-top{grid-template-columns:1fr 1fr;gap:40px 22px}.b-footer-top>div:first-child{grid-row:1;grid-column:1/3}.b-footer-top h2{font-size:31px;margin-top:18px}.b-footer-top>div:first-child>img{width:48px;height:48px}.b-footer-top nav{grid-column:1;grid-row:2}.b-social{grid-column:2;grid-row:2;padding-top:0}.b-footer-top nav,.b-social{font-size:12px;gap:13px}.b-social span{font-size:10px}.b-footer-word{font-size:12.8vw;margin:48px 0 20px;white-space:normal;line-height:1.1}.b-bottom{display:block;font-size:10px}.b-bottom>span{display:block;margin-top:10px}}
@media print{.brand-header,.brand-footer{display:none}}


/* 舊樣式殘留：EN 切換不要框；舊頁首的標題進場與圖帶動畫關掉，內容一進來就看得到 */
.b-utilities .lang-switch{border:0;background:none;min-height:0;min-width:0;border-radius:0;font-family:var(--sans)}
.motion-ok .page-head>*,.motion-ok .page-head>div>*,.motion-ok .page-ribbon img,.page-ribbon img{animation:none!important;opacity:1!important;transform:none!important;clip-path:none!important}

/* ---------- 5. 首頁開場：夜色牌桌＋市集照片 ---------- */
.page-home .salon-hero{max-width:none;background:var(--night);color:var(--on-night);padding:0 clamp(16px,5.6vw,90px)}
.page-home .salon-topline{max-width:1440px;margin:0 auto;padding:18px 0;color:var(--night-mute);border-bottom:1px solid rgba(208,160,131,.32);letter-spacing:.12em}
.page-home .salon-layout{max-width:1440px;margin:0 auto;grid-template-columns:1fr minmax(0,560px);gap:6%;padding:64px 0 80px}
.page-home .salon-copy h1{color:var(--on-night);font-size:clamp(44px,5.4vw,84px);letter-spacing:.04em;line-height:1.3;font-weight:600;margin-bottom:28px}
.page-home .salon-intro{color:var(--on-night);opacity:.86;font-size:17px}
.page-home .salon-invite{color:var(--on-night);font-family:var(--serif);font-size:20px}
.page-home .salon-hero .btn-seal{background:var(--on-night);color:var(--night);border-color:var(--on-night)}
.page-home .salon-hero .btn-seal:hover{background:transparent;color:var(--on-night)}
.page-home .salon-hero .salon-textlink{color:var(--on-night);text-decoration-color:var(--copper-line)}
.page-home .salon-price{color:var(--night-mute);letter-spacing:.04em}
.salon-photo{margin:0;justify-self:end;width:100%;max-width:560px}
.salon-photo img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover}
.salon-photo figcaption{margin-top:12px;display:flex;justify-content:space-between;gap:16px;font-size:13px;line-height:1.7;color:var(--night-mute)}
.salon-photo figcaption a{color:var(--on-night);white-space:nowrap;text-decoration:underline;text-decoration-color:var(--copper-line);text-underline-offset:4px}
@media(max-width:860px){
  .page-home .salon-layout{grid-template-columns:1fr;gap:40px;padding:40px 0 56px}
  .salon-photo{justify-self:stretch;max-width:none}
  .salon-photo figcaption{flex-direction:column;gap:4px}
}

/* ---------- 6. 品牌儀式：問題 → 牌 → 行動 ---------- */
.ritual{max-width:1240px;margin:0 auto;padding:112px clamp(16px,5vw,64px) 120px;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:72px;align-items:center}
.ritual h2{font-size:clamp(30px,3.4vw,46px);line-height:1.35;margin:0}
.ritual-steps{list-style:none;margin:32px 0 28px;padding:0;display:grid;gap:0}
.ritual-steps li{display:grid;grid-template-columns:3.4em 1fr;gap:12px;padding:16px 0;border-top:1px solid var(--rule);line-height:1.8}
.ritual-steps li:last-child{border-bottom:1px solid var(--rule)}
.ritual-steps b{font-family:var(--serif);font-size:19px;font-weight:600}
.ritual-table{position:relative;padding-bottom:40px}
.qcard{background:var(--sheet);border:1px solid var(--rule-strong);outline:1px solid var(--rule-strong);outline-offset:3px;padding:34px 36px 30px;margin:4px;max-width:560px}
.qcard-label{font-size:13px;letter-spacing:.12em;font-weight:500;color:var(--mute);margin:0 0 10px}
.qline{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;font-size:20px;line-height:2.15;margin:0}
.qblank{border:0;border-bottom:1px solid var(--rule-strong);border-radius:0;background:transparent;color:var(--ink);font:500 20px/1.4 var(--sans);padding:2px 4px;width:6.5em;max-width:100%}
.qblank.wide{width:9.5em}
.qblank::placeholder{color:var(--mute);opacity:1}
.qend{margin:18px 0 0;padding-top:18px;border-top:1px solid var(--rule);font-family:var(--serif);font-weight:600;font-size:22px;line-height:1.7}
.qactions{display:flex;align-items:center;gap:18px;margin-top:22px;flex-wrap:wrap}
.qhint{font-size:13px;color:var(--mute)}
.action-note{position:absolute;right:0;bottom:0;width:min(340px,82%);background:var(--note-pink);color:var(--on-note);box-shadow:0 1px 0 rgba(22,19,17,.06),0 14px 26px -14px rgba(22,19,17,.55);padding:22px 24px 20px;transform:rotate(-1.4deg)}
.action-note[hidden]{display:none}
.action-note.drop{animation:note-drop .42s cubic-bezier(.2,.8,.2,1) both}
@keyframes note-drop{from{opacity:0;transform:translateY(-32px) rotate(-5deg)}to{opacity:1;transform:translateY(0) rotate(-1.4deg)}}
.note-label{font-size:13px;letter-spacing:.12em;font-weight:500;margin:0 0 6px}
.note-text{font-size:17px;line-height:1.8;margin:0 0 14px}
.note-actions{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:15px}
.note-actions a,.note-copy{color:var(--on-note);text-decoration:underline;text-decoration-color:rgba(42,36,32,.45);text-underline-offset:5px;background:none;border:0;padding:0;font:inherit;cursor:pointer}
.note-copy[data-done]{text-decoration:none}
@media(prefers-reduced-motion:reduce){.action-note.drop{animation:none}}
@media(max-width:860px){
  .ritual{grid-template-columns:1fr;gap:36px;padding:72px 16px 80px}
  .qcard{padding:26px 22px 24px}
  .qline,.qblank{font-size:18px}
  .ritual-table{padding-bottom:0}
  .action-note{position:relative;right:auto;bottom:auto;margin:-18px 0 0 auto}
}

/* ---------- 7. 客人回饋：穿插在各頁的一則原文留言 ---------- */
.client-voice{margin:0;padding:28px 0 0;border-top:1px solid var(--rule)}
.client-voice blockquote{margin:0;padding:0;border:0;font-family:var(--serif);font-size:clamp(19px,1.6vw,23px);line-height:1.8;font-weight:500;color:var(--ink);text-align:left}
.client-voice blockquote p{margin:0;text-align:left}
.client-voice figcaption{margin-top:14px;display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13px;color:var(--mute)}
.client-voice figcaption a{color:var(--mute);text-decoration:underline;text-decoration-color:var(--rule-strong);text-underline-offset:4px}
.client-voice figcaption a:hover{color:var(--ink)}
.prose .client-voice,.section .client-voice{margin:44px 0;max-width:36em}
.conversation .client-voice{align-self:center}

/* ---------- 8. 客人回饋頁 ---------- */
.reviews-wall{list-style:none;margin:0;padding:0;columns:3 300px;column-gap:28px}
.reviews-wall li{break-inside:avoid;margin:0 0 28px;padding:22px 0 0;border-top:1px solid var(--rule)}
.reviews-wall blockquote{margin:0;font-size:17px;line-height:1.85;color:var(--ink)}
.reviews-wall .src{display:inline-block;margin-top:8px;font-size:13px;color:var(--mute);text-decoration:underline;text-decoration-color:var(--rule-strong);text-underline-offset:4px}
.reviews-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:28px}
.reviews-cards figure{margin:0}
.reviews-cards img{display:block;width:100%;height:auto;border:1px solid var(--rule)}
.reviews-cards figcaption{margin-top:10px;font-size:15px;line-height:1.8;color:var(--ink-2)}
.reviews-cards figcaption a{display:inline-block;margin-top:4px;font-size:13px;color:var(--mute)}

/* ---------- 9. 拿掉的裝飾：英文斜體句、大引號、花飾、背景動態 ---------- */
.salon-script,.salon-flower,.review-mark,.motes,.constellation{display:none!important}
.page-home .salon-review blockquote{font-family:var(--serif);font-weight:500}
.rise,.will-reveal{opacity:1!important;transform:none!important;clip-path:none!important}
.parallax{transform:none!important}

/* ---------- 10. 浮動客服 ---------- */
.contact-fab{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));z-index:60;display:flex;flex-direction:column;align-items:flex-end;gap:12px;font-family:var(--sans)}
.contact-fab-btn{display:inline-flex;align-items:center;gap:10px;padding:5px 18px 5px 5px;border-radius:999px;background:var(--night);color:var(--on-night);border:1px solid var(--copper-line);font:500 15px/1 var(--sans);letter-spacing:.06em;cursor:pointer;box-shadow:0 10px 24px -14px rgba(0,0,0,.6)}
.contact-fab-btn img{width:38px;height:38px;border-radius:999px;display:block}
.contact-fab-btn:hover{border-color:var(--on-night)}
.contact-panel{width:min(330px,calc(100vw - 32px));max-height:min(70vh,560px);overflow:auto;background:var(--sheet);color:var(--ink);border:1px solid var(--rule-strong);padding:20px 20px 16px;box-shadow:0 18px 40px -24px rgba(0,0,0,.55)}
.contact-panel[hidden]{display:none}
.contact-panel h2{font-size:19px;line-height:1.5;margin:0 0 2px;font-family:var(--serif)}
.contact-panel .lead{margin:0 0 10px;font-size:13px;line-height:1.7;color:var(--mute)}
.contact-panel details{border-top:1px solid var(--rule);padding:9px 0}
.contact-panel summary{cursor:pointer;font-weight:500;font-size:15px;line-height:1.7;list-style:none;display:flex;justify-content:space-between;gap:12px}
.contact-panel summary::-webkit-details-marker{display:none}
.contact-panel summary::after{content:"＋";color:var(--copper)}
.contact-panel details[open] summary::after{content:"－"}
.contact-panel details p{margin:6px 0 2px;font-size:14px;line-height:1.8;color:var(--ink-2)}
.contact-panel details a{color:var(--copper)}
.contact-links{display:grid;gap:8px;margin-top:12px}
.contact-links a{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;border:1px solid var(--rule-strong);border-radius:2px;color:var(--ink);text-decoration:none;font-size:15px}
.contact-links a:hover{border-color:var(--ink)}
.contact-links a.primary{background:var(--seal);color:var(--seal-ink);border-color:var(--seal)}
.contact-links small{font-size:12px;color:inherit;opacity:.8}
@media(max-width:600px){.contact-fab-btn{padding:4px}.contact-fab-btn .fab-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}}
@media print{.contact-fab{display:none}}

@media(prefers-reduced-motion:reduce){.b-card-front{animation:none}}

/* 首頁「也可以，自己翻開一張牌」：夜讀時改成深色底、淺色字 */
:root[data-theme=dark] .b-learn-band{background:#253e46;color:#eee8dc}
:root[data-theme=dark] .b-learn-band .b-text{color:#eee8dc}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .b-learn-band{background:#253e46;color:#eee8dc}:root:not([data-theme=light]) .b-learn-band .b-text{color:#eee8dc}}

/* 首頁「不用整理得很好」背景的星圖（上一版的 p5 動畫） */
.b-intro{position:relative;isolation:isolate}
.b-intro>*:not(.intro-orrery){position:relative;z-index:1}
.intro-orrery{position:absolute;z-index:0;left:-3%;top:50%;width:min(560px,46vw);aspect-ratio:1;transform:translateY(-50%);color:var(--copper-line);opacity:.42;pointer-events:none}
.intro-orrery .orrery-fallback{width:100%;height:100%;opacity:.6}
.intro-orrery canvas{position:absolute;inset:0;width:100%!important;height:100%!important;pointer-events:none}
.intro-orrery[data-ready] .orrery-fallback{visibility:hidden}
:root:not([data-theme=dark]) .intro-orrery{opacity:.55;color:#9a7a4c}
@media(max-width:560px){.intro-orrery{left:50%;top:0;width:88vw;transform:translateX(-50%);opacity:.3}}
/* 首頁市集照片：黃銅雙線外框 */
.b-field figure img{padding:9px;border:1px solid var(--copper-line);outline:1px solid var(--copper-line);outline-offset:5px;background:var(--paper)}
@media(max-width:560px){.b-field figure img{padding:6px;outline-offset:4px}}
/* 手機版浮標也顯示「問問題」 */
@media(max-width:600px){.contact-fab-btn{padding:4px 14px 4px 4px;font-size:14px}.contact-fab-btn .fab-label{position:static;width:auto;height:auto;overflow:visible;clip:auto}}

/* 首頁「也可以，自己翻開一張牌」：三張牌＋背景的星座連線與金色光塵 */
.b-learn-band{position:relative;overflow:hidden;padding:72px 0}
.learn-sky{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
.b-learn-band>.learn-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:48px}
.learn-copy h2{font-size:clamp(25px,2.6vw,36px);line-height:1.6;margin:0}
.learn-copy p{font-size:14px;margin:10px 0 26px}
.b-learn-band .learn-copy .b-text{margin-left:0}
.b-learn-band .cabinet-cards{min-height:380px;padding:30px 20px 40px}
.b-learn-band .cabinet-card img{border-color:#eee3ca;box-shadow:0 18px 30px #10252b55}
.b-learn-band .cabinet-card figcaption{color:inherit;opacity:.8}
.b-learn-band{--sky-ink:32,58,67;--sky-dust:154,122,76}
:root[data-theme=dark] .b-learn-band{--sky-ink:196,165,116;--sky-dust:214,186,140}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .b-learn-band{--sky-ink:196,165,116;--sky-dust:214,186,140}}
@media(max-width:800px){.b-learn-band>.learn-grid{grid-template-columns:1fr;gap:12px}.b-learn-band .cabinet-cards{min-height:330px;max-width:440px;width:100%;margin:auto}}
@media(max-width:560px){.b-learn-band{padding:52px 0 20px}.b-learn-band .cabinet-cards{min-height:290px}}
@media(max-width:800px){.b-learn-band .cabinet-cards{width:100%;padding:30px 0 40px}.b-learn-band .cabinet-card{width:29vw;max-width:150px}}

/* 市集段 Codex 的極簡星形符號：夜讀時換成淺色（只套在這個符號，主 logo 不改色） */
:root[data-theme=dark] .b-field-mark img{filter:brightness(0) saturate(100%) invert(87%) sepia(13%) saturate(328%) hue-rotate(353deg) brightness(105%) contrast(94%)}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .b-field-mark img{filter:brightness(0) saturate(100%) invert(87%) sepia(13%) saturate(328%) hue-rotate(353deg) brightness(105%) contrast(94%)}}
.b-learn-band .cabinet-card img{width:100%}

/* 首頁客人回饋：主標＋月桂花環。兩枝月桂從底部交叉往上長、合攏，葉子由下往上描出來再填色，最後五芒星轉進來。
   SVG 由 _build/wreath_20261002.py 產生；捲到時 atelier.js 第 11 段加 sig-play。開了「減少動態」就直接顯示完成的樣子。 */
.salon-review .review-ornament{max-width:760px;margin:0 auto 26px}
.salon-review .review-title{font-size:clamp(29px,3vw,42px);line-height:1.6;font-weight:500;letter-spacing:.02em;margin:0 auto 34px;text-align:center}
.review-ornament .wreath{--wreath:#9a7646;width:clamp(96px,10vw,128px);height:auto;flex:none;overflow:visible;fill:var(--wreath);stroke:var(--wreath);stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round}
:root[data-theme=dark] .review-ornament .wreath{--wreath:#c4a574}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .review-ornament .wreath{--wreath:#c4a574}}
.wreath-stem{fill:none}
.wreath-leaf{fill-opacity:.16}
.wreath-star{fill:none;stroke-width:1.2;transform-origin:60px 58px}
.wreath-l{transform-origin:60px 100px}
.wreath-r{transform-origin:60px 100px}
.sig-ready .wreath-stem,.sig-ready .wreath-leaf{stroke-dasharray:1;stroke-dashoffset:1}
.sig-ready .wreath-leaf{fill-opacity:0}
.sig-ready .wreath-l{transform:rotate(-14deg)}
.sig-ready .wreath-r{transform:rotate(14deg)}
.sig-ready .wreath-star{opacity:0;transform:rotate(-72deg) scale(.55)}
.sig-play .wreath-branch{animation:wreath-close 2.4s .2s cubic-bezier(.22,.7,.12,1) forwards}
.sig-play .wreath-stem{animation:sig-draw 1.5s .2s cubic-bezier(.45,.05,.2,1) forwards}
.sig-play .wreath-leaf{animation:sig-draw .8s cubic-bezier(.45,.05,.2,1) forwards,wreath-fill 1s ease forwards;animation-delay:calc(.5s + var(--i,0) * .14s),calc(1.2s + var(--i,0) * .14s)}
.sig-play .wreath-star{animation:sig-rosette 1.5s 1.5s cubic-bezier(.22,.7,.12,1) forwards}
@keyframes wreath-close{to{transform:none}}
@keyframes wreath-fill{to{fill-opacity:.16}}
@media(max-width:560px){.review-ornament .wreath{width:88px}}

/* 占卜師手記的版面（2026-10-02）
   分類列捲動時固定在畫面上方；桌機左欄的小標跟著捲；手機版列表標題在左、縮圖在右、摘要在下面。
   中文標題只在標點後換行（atelier.js 第 12 段把標題切成 .ph）。 */
.ph{display:inline-block}
.notes-jump{position:sticky;top:0;z-index:30;background:var(--paper);border-block:1px solid var(--rule)}
.notes-jump .wrap{display:flex;gap:28px;overflow-x:auto;scrollbar-width:none;white-space:nowrap;font-size:14px;padding-block:13px}
.notes-jump .wrap::-webkit-scrollbar{display:none}
.notes-jump a{color:var(--mute);text-decoration:none;padding-bottom:3px;border-bottom:1px solid transparent;transition:color .3s,border-color .3s}
.notes-jump a:hover,.notes-jump a[aria-current]{color:var(--ink);border-bottom-color:var(--copper-line)}
#journal,#questions,#learning,#monthly{scroll-margin-top:56px}
@media(min-width:761px){.journal-columns>.journal-side-note{position:sticky;top:84px;align-self:start}}
@media(max-width:760px){
  .journal-cover-image img{aspect-ratio:3/2}
  .journal-columns>.journal-side-note:has(.journal-still){display:grid;grid-template-columns:1fr 104px;gap:0 18px;align-items:start}
  .journal-side-note:has(.journal-still)>*{grid-column:1}
  .journal-side-note h2{font-size:30px;margin-bottom:16px}
  .journal-side-note .journal-still{grid-column:2;grid-row:1/4;margin:8px 0 0;max-width:none}
  .journal-side-note .journal-still figcaption{font-size:11px;line-height:1.5}
  .journal-index li{padding:20px 0}
  .journal-index li>a,.journal-compact li>a{grid-template-columns:1fr 96px;gap:6px 16px;align-items:start}
  .journal-index .journal-entry-copy,.journal-compact .journal-entry-copy{display:contents}
  .journal-index .journal-entry-kind,.journal-compact .journal-entry-kind{grid-column:1;grid-row:1}
  .journal-index h3,.journal-compact h3{grid-column:1;grid-row:2;font-size:19px;line-height:1.6;margin:0}
  .journal-index .journal-thumb,.journal-compact .journal-thumb{grid-column:2;grid-row:1/3;align-self:start}
  .journal-index .journal-entry-copy p,.journal-compact .journal-entry-copy p{grid-column:1/-1;grid-row:3;margin:6px 0 0;font-size:14px;line-height:1.85;color:var(--mute);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
  .journal-index .journal-entry-arrow,.journal-compact .journal-entry-arrow{display:none}
  .page-head h1{line-height:1.45}
}

/* 占卜師手記的影像動態（atelier.js 第 12 段加 class，每張圖只播一次；開了「減少動態」就不加，圖直接顯示）
   列表縮圖：先是牌背（深海墨＋黃銅五芒星），捲到時翻成文章的圖。
   油畫與照片：由上往下展開，從泛黃、模糊慢慢顯影，最後一道光掃過。
   文章裡的塔羅牌：一張一張從側面翻上來。 */
.nx-frame{display:block;position:relative;overflow:hidden}
.journal-cover-image>.nx-frame{margin:0;font-size:inherit}
.nx-paint img{clip-path:inset(0 0 100% 0);transform:scale(1.06);filter:sepia(.65) saturate(.5) brightness(.92) blur(6px)}
.nx-paint.nx-in img{animation:nx-develop 2.2s var(--d,0s) cubic-bezier(.22,.7,.12,1) forwards}
.nx-paint::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 36%,rgba(255,238,205,.32) 50%,transparent 64%);transform:translateX(-115%)}
.nx-paint.nx-in::after{animation:nx-gleam 1.6s calc(var(--d,0s) + 1.3s) cubic-bezier(.45,.05,.3,1) forwards}
@keyframes nx-develop{0%{clip-path:inset(0 0 100% 0);transform:scale(1.06);filter:sepia(.65) saturate(.5) brightness(.92) blur(6px)}45%{clip-path:inset(0 0 0 0)}100%{clip-path:inset(0 0 0 0);transform:none;filter:none}}
@keyframes nx-gleam{to{transform:translateX(115%)}}
.nx-card{opacity:0;transform:perspective(900px) rotateY(-88deg)}
.nx-card.nx-in{animation:nx-turn 1.1s var(--d,0s) cubic-bezier(.2,.75,.25,1) forwards}
@keyframes nx-turn{0%{opacity:0;transform:perspective(900px) rotateY(-88deg) translateY(12px)}12%{opacity:1}100%{opacity:1;transform:none}}
.journal-thumb{position:relative}
.nx-thumb{perspective:640px}
.nx-thumb img{transform:rotateY(180deg);backface-visibility:hidden}
.nx-thumb::before{content:"";position:absolute;inset:4px;z-index:1;backface-visibility:hidden;background:#203a43 url(/assets/img/brand/star-mark.svg) center/auto 58% no-repeat;box-shadow:inset 0 0 0 1px #c4a574,inset 0 0 0 4px #203a43,inset 0 0 0 5px rgba(196,165,116,.45)}
.nx-thumb.nx-in img{animation:nx-front 1s var(--d,0s) cubic-bezier(.35,.6,.2,1) forwards}
.nx-thumb.nx-in::before{animation:nx-back 1s var(--d,0s) cubic-bezier(.35,.6,.2,1) forwards}
@keyframes nx-front{from{transform:rotateY(180deg)}to{transform:rotateY(0)}}
@keyframes nx-back{from{transform:rotateY(0)}to{transform:rotateY(-180deg)}}

/* 首頁開場的牌（2026-10-02 補，手機也有）：牌背從正中滑到右後方，星星牌從上方落下、轉到定位，之後兩張牌輕輕浮著；
   後面的航線星圖像羅盤刻度盤一樣慢慢轉。開了「減少動態」就全部靜止。 */
.b-cardpair{--back-x:29px}
@media(max-width:560px){.b-cardpair{--back-x:19px}}
@media(prefers-reduced-motion:no-preference){
  .b-chart{animation:hero-chart 220s linear infinite}
  .b-card-back{animation:hero-back 1.3s .15s cubic-bezier(.16,1,.3,1) both}
  .b-card-front{animation:hero-front 1.4s .35s cubic-bezier(.16,1,.3,1) both}
  .b-cardpair{animation:hero-float 7s 1.9s ease-in-out infinite}
}
@keyframes hero-chart{to{transform:rotate(360deg)}}
@keyframes hero-back{from{opacity:0;transform:rotate(0deg) translate(0,14px)}to{opacity:1;transform:rotate(13deg) translate(var(--back-x),3px)}}
@keyframes hero-front{from{opacity:0;transform:rotate(-1deg) translate(-2px,-44px) scale(1.04)}to{opacity:1;transform:rotate(-9deg) translate(-15px,1px)}}
@keyframes hero-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}

/* 「從一個問題／到一次嘗試」和線條五芒星靠右（主理人要求） */
.b-field-mark{justify-content:flex-end;text-align:right}

/* 首頁客人留言：拿掉框和底色（看起來像模板），改成細線分隔的引文，點文字到 Instagram 原文 */
.comment-list{columns:3 250px;column-gap:44px}
.comment-list li{margin:0;padding:22px 0 24px;border-top:1px solid var(--rule)}
.comment-list a,.comment-list a:hover{padding:0;border:0;background:none;font-size:17px;line-height:1.95}
.comment-list a span{display:block}
.comment-list a small{margin-top:10px;font-family:var(--sans);font-size:12px;letter-spacing:.02em;color:var(--mute)}
.comment-list a:hover span{text-decoration:underline;text-decoration-thickness:1px;text-decoration-color:var(--copper-line);text-underline-offset:6px}
.motion-ok .comment-list a:hover{transform:none}
@media(max-width:760px){.comment-list a,.comment-list a:hover{font-size:16px}}