/* hallmark: restyle-r1 · theme: custom(本站奶油/墨綠/薄荷/暖黃) · shape: 需求入口→核心架構→Podcast→影音→Tony · 2026-11-09 */
/* restyle-r1 · 2026-11-09 · 只換皮：不動內容、連結、功能。
   參考 lil-fulfillment.com 的版面節奏（kicker→大標局部螢光→副標、2px 框線卡片、點陣格紋底、硬陰影按鈕），
   色系維持本站：奶油紙、深墨綠、薄荷、暖黃。插畫全部用本站東尼素材。
   critique: 原版區塊間距不一、卡片無框、標題無節奏、首屏整幅橫幅文圖不對話。 */
/* html:root 提高優先權：Astro 把 journey.css 排在本檔之後，它的 :root 會蓋掉純 :root 的 token */
:root,html:root{
  --paper:#FAF7F2;--paper-2:#F3EEE4;--card:#FFFFFF;--dot:#E7DCCC;--tint-blue:#EEF3F7;--highlight:#FFD98A;--kicker:#6F6559;
  --ink:#283E50;--ink-2:#3E5163;--muted:#5B6B7A;
  --mint:#CFE0EA;--mint-soft:#EEF3F7;--yellow:#FD9919;--yellow-soft:#FFF3DF;--rust:#C2410C;
  --line:var(--ink);--radius:16px;--radius-sm:10px;
  --shadow-hard:4px 4px 0 var(--ink);--shadow-hard-sm:3px 3px 0 var(--ink);
  --font-heading:'Noto Serif TC','Noto Sans TC','PingFang TC','Microsoft JhengHei',serif;
  --font-body:'Noto Sans TC','PingFang TC','Microsoft JhengHei',system-ui,sans-serif;
  --display:var(--font-heading);
  --sec:clamp(64px,9vw,112px);--wrap:1120px;
}
html{overflow-x:clip}
body{overflow-x:clip;margin:0;color:var(--ink);background:var(--paper);
  background-image:radial-gradient(circle at 1px 1px,var(--dot) 1.1px,transparent 0);background-size:22px 22px;
  font-family:var(--font-body);font-size:16px;line-height:1.85;letter-spacing:.3px}
body.reading{font-size:16px}
h1,h2,h3{font-family:var(--font-heading);font-weight:700;color:var(--ink);letter-spacing:.3px;text-wrap:balance;overflow-wrap:break-word;min-width:0}
h1{font-size:clamp(34px,4.4vw,54px);line-height:1.3}
h2{font-size:clamp(28px,3.2vw,40px);line-height:1.4}
h3{font-size:21px;line-height:1.5}
p{margin:0}
a{color:inherit}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--rust);outline-offset:4px}
mark{background:none;color:inherit;background-image:linear-gradient(transparent 58%,var(--highlight) 58%);padding:0 .08em}
.sheet,header,main,footer{max-width:var(--wrap)}
.sheet{margin:0 auto;padding:0 24px}
main{padding:0 24px var(--sec)}
section[id]{scroll-margin-top:24px}

/* 標題節奏：小字 kicker → 大標 → 副標 */
.label,.eyebrow,.kicker{display:inline-flex;align-items:center;gap:8px;margin:0 0 16px;color:var(--kicker);font:700 14px/1.6 var(--font-body);letter-spacing:2px}
.label::before,.eyebrow::before,.kicker::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 2px var(--ink)}
.sub{margin-top:12px;max-width:40em;color:var(--muted);font-size:17px}

/* 導覽 */
#listen-nav{max-width:var(--wrap);margin:0 auto;padding:16px 24px;border-bottom:2px solid var(--ink);font-family:var(--font-body);gap:16px;background:transparent}
@media(max-width:1159px){#listen-nav{margin-left:0;margin-right:0}}
#listen-nav .ln-brand{font-family:var(--font-heading);font-size:18px}
#listen-nav .ln-brand img{width:52px;height:52px}
#listen-links>a{min-height:48px;padding:8px 16px;border-radius:99px;border:2px solid transparent;font-size:15px}
#listen-links>a[aria-current]{background:var(--yellow);box-shadow:none;border-color:var(--ink)}
#listen-links .ln-hint{font-size:11px;letter-spacing:.12em}
#listen-nav .ln-search,#listen-nav .ln-toggle{border:2px solid var(--ink);border-radius:99px;background:var(--card);font-weight:700;box-shadow:var(--shadow-hard-sm);padding:8px 16px}
#listen-nav .ln-search{background:var(--yellow)}
#listen-nav .ln-search:active,#listen-nav .ln-toggle:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
@media(max-width:850px){#listen-links>a{background:var(--card);border-color:var(--ink);border-radius:var(--radius-sm);min-height:60px}}

/* 按鈕 */
.start-link,.need-result a,.channel-action,.card-read,.entry a,.host-intro a,.button,.journey-actions>a:not(.button){
  display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:12px 24px;
  border:2px solid var(--ink);border-radius:99px;background:var(--yellow);color:var(--ink);text-decoration:none;
  font:700 15px/1.4 var(--font-body);box-shadow:var(--shadow-hard);transition:transform .15s,box-shadow .15s}
.start-link:hover,.need-result a:hover,.channel-action:hover,.card-read:hover,.entry a:hover,.host-intro a:hover{background:var(--yellow);transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--ink)}
.start-link:active,.need-result a:active,.channel-action:active,.card-read:active,.entry a:active,.host-intro a:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink);filter:none}
.entry a,.host-intro a,.card-read{background:var(--card);box-shadow:var(--shadow-hard-sm)}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* ===== 首頁 ===== */
.intro{aspect-ratio:auto;margin:40px 0 var(--sec);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:48px;align-items:center;isolation:isolate}
.intro>div{width:auto;padding:0;order:0}
.hero-image{order:1}
.intro h1{margin-top:14px}
.hero-image{position:static;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;object-position:62% center;border:2px solid var(--ink);border-radius:var(--radius);box-shadow:var(--shadow-hard);z-index:0;background:var(--paper-2)}
.lead{margin-top:20px;max-width:30em;color:var(--muted);font-size:18px}
.start-link{margin-top:28px}
.needs{padding:var(--sec) 0;border-top:2px solid var(--ink);background:linear-gradient(var(--tint-blue),var(--tint-blue));margin:0 -24px;padding-left:24px;padding-right:24px}
.needs>h2,.needs>p:not(.label),.needs>.label{text-align:center}
.needs>p:not(.label){max-width:40em;margin:12px auto 0;color:var(--muted)}
.need-explorer{grid-template-columns:1fr 1fr;gap:32px;margin-top:40px}
.need-options article{grid-template-columns:1fr;gap:0;padding:0;border:0;margin:0 0 16px}
.need-options article:last-child{border:0}
.need-number{display:none}
.need-select{margin:0;min-height:84px;padding:16px 20px 16px 64px;border:2px solid var(--ink);border-radius:var(--radius);background:var(--card);position:relative;counter-increment:need;box-shadow:var(--shadow-hard-sm);transition:transform .15s,box-shadow .15s,background .15s}
.need-select::before{content:counter(need,decimal-leading-zero);position:absolute;left:18px;top:50%;transform:translateY(-50%);width:32px;height:32px;display:grid;place-items:center;border:2px solid var(--ink);border-radius:50%;background:var(--yellow-soft);font:700 13px/1 var(--font-body)}
.need-options{counter-reset:need}
.need-select[aria-pressed=true]{background:var(--yellow);padding-left:64px;transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
.need-title{font-family:var(--font-heading);font-size:21px}
.need-hint{color:var(--muted);font-size:15px}
.need-result{padding:36px;border:2px solid var(--ink);border-radius:var(--radius);background:var(--mint-soft);box-shadow:var(--shadow-hard)}
.need-result h3{font-size:26px}
.need-result p{color:var(--muted);margin-top:10px}
.overview{padding:var(--sec) 0;border:0}
.overview-head{align-items:end}
.overview-head h2 .label{display:inline-flex}
.status{display:inline-flex;align-items:center;gap:8px;max-width:none;padding:6px 14px;border:2px dashed var(--ink);border-radius:99px;background:var(--card);font-weight:700;font-size:13px;color:var(--ink)}
.stages{gap:20px;margin-top:40px;grid-template-columns:repeat(4,minmax(0,1fr))}
.stage{padding:16px 16px 24px;border:2px solid var(--ink);border-radius:var(--radius);background:var(--card);display:flex;flex-direction:column}
.stage-art{aspect-ratio:1/1;object-fit:contain;border-radius:var(--radius-sm);background:var(--paper-2);border:2px solid var(--ink)}
.index{display:inline-block;margin:16px 0 6px;padding:2px 10px;border-radius:99px;background:var(--yellow-soft);border:2px solid var(--ink);font:700 12px/1.6 var(--font-body);color:var(--ink);align-self:flex-start}
.stage h3{font-size:20px}
.meaning{color:var(--muted);font-size:15px}
.latest-podcast{padding:var(--sec) 0;border-top:2px solid var(--ink)}
.latest-podcast .latest-card,.latest-podcast>div:not(.label){padding:28px;border:2px solid var(--ink);border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow-hard)}
.latest-podcast h2{font-size:clamp(24px,2.6vw,32px)}
.latest-podcast audio{width:100%;margin-top:16px}
.latest-podcast a{font-weight:700;text-underline-offset:.25em}
.video-wrap{padding:var(--sec) 0;border-top:2px solid var(--ink)}
.video-wrap>p:not(.label){color:var(--muted)}
.player-box{border:2px solid var(--ink);box-shadow:var(--shadow-hard);border-radius:var(--radius)}
.action-play{color:var(--yellow)}
.entry{padding:40px 32px;border:2px solid var(--ink);border-radius:var(--radius);background:var(--mint-soft);gap:8px 32px;margin-top:var(--sec)}
.entry h2{font-size:clamp(22px,2.4vw,28px)}
.entry>p{font-size:15px}
.host-intro{padding:var(--sec) 0 0;border:0;gap:48px;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}
.host-intro img{width:240px;height:240px;border:2px solid var(--ink);box-shadow:var(--shadow-hard);background:var(--paper-2)}
.host-intro p{color:var(--muted);font-size:17px}
footer{border-top:2px solid var(--ink);padding:28px 0;font-size:13px;color:var(--muted)}

@media(max-width:900px){.intro{grid-template-columns:minmax(0,1fr);gap:28px}.intro>div{order:1}.hero-image{order:0;aspect-ratio:16/10}.stages{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){
  .sheet{padding:0 18px}main{padding:0 18px var(--sec)}
  .intro{margin:24px 0 var(--sec)}.hero-image{order:0;aspect-ratio:4/3;object-position:60% center}
  .needs{margin:0 -18px;padding-left:18px;padding-right:18px}.need-explorer{grid-template-columns:1fr;gap:20px}
  .need-select{min-height:76px;padding:16px 16px 16px 60px}.need-result{padding:24px}
  .stages{grid-template-columns:minmax(0,1fr);gap:14px}.stage{display:grid;grid-template-columns:96px minmax(0,1fr);column-gap:14px;align-items:center;padding:14px}
  .stage-art{grid-row:1/4;width:96px}.stage .index{grid-column:2;margin:0 0 4px}.stage h3{grid-column:2;font-size:19px}.stage .meaning{grid-column:2;font-size:14px}
  .entry{display:block;padding:28px 20px}.entry nav{margin-top:16px}
  .host-intro{grid-template-columns:minmax(0,1fr);gap:24px}.host-intro img{width:160px;height:160px;justify-self:start}
}

/* ===== 文章列表 ===== */
.article-index>h1{font-family:var(--font-heading);font-weight:700;font-size:clamp(34px,4vw,48px);margin:24px 0 8px}
.archive-opening{padding:40px 0 24px}
.archive-opening p:not(.eyebrow){font-size:17px;color:var(--muted);max-width:40em}
.article-index .topic-nav,.topic-nav{display:flex;flex-wrap:wrap;gap:10px}
.topic-nav a{display:inline-flex;align-items:center;min-height:44px;padding:6px 16px;border:2px solid var(--ink);border-radius:99px;background:var(--card);text-decoration:none;font-weight:700;font-size:15px}
.topic-nav a:hover{background:var(--yellow-soft)}
.article-index .topic-directory{margin:24px 0 8px;padding:18px 22px;border:2px solid var(--ink);border-radius:var(--radius);background:var(--card)}
.article-index .topic-directory>summary{font-family:var(--font-heading);font-size:18px}
.article-search{margin:24px 0}
.article-search input{min-height:52px;padding:10px 18px;border:2px solid var(--ink);border-radius:99px;background:var(--card);font:inherit;width:100%;max-width:520px}
.article-index .topic-group{margin:var(--sec) 0 0;counter-reset:card}
.article-index .topic-group>h2{border:0;padding:0;font-size:clamp(26px,3vw,36px);display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.article-index .topic-group>h2::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 2px var(--ink);align-self:center}
.article-index .topic-group>h2 .count,.article-index .topic-group>p{color:var(--muted);font-size:15px;margin-top:6px}
.article-list,.results,.topic-group>ul,.topic-group>div{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px;margin-top:28px;list-style:none;padding:0}
.content-card,.article-result{position:relative;display:flex;flex-direction:column;border:2px solid var(--ink);border-radius:var(--radius);background:var(--card);overflow:hidden;counter-increment:card;transition:transform .15s,box-shadow .15s}
.content-card:hover{transform:translate(-2px,-2px);box-shadow:var(--shadow-hard)}
.content-card .card-image{position:relative;display:block;border-bottom:2px solid var(--ink);background:var(--paper-2)}
.content-card .card-image img{display:block;width:100%;aspect-ratio:16/9;height:auto;object-fit:contain;background:var(--paper-2)}
.content-card .card-image::before{content:counter(card,decimal-leading-zero);position:absolute;left:14px;top:14px;z-index:1;width:38px;height:38px;display:grid;place-items:center;border:2px solid var(--ink);border-radius:50%;background:var(--yellow);font:700 14px/1 var(--font-heading);box-shadow:var(--shadow-hard-sm)}
.content-card .image-label{position:absolute;right:12px;bottom:12px;padding:2px 12px;border:2px solid var(--ink);border-radius:99px;background:var(--card);font:700 12px/1.8 var(--font-body);color:var(--ink);letter-spacing:.5px}
.content-card .card-copy{display:flex;flex-direction:column;flex:1;padding:16px 20px 20px}
.content-card .card-copy .small{order:3;margin-top:auto;padding-top:14px;font-size:13px;color:var(--muted)}
.article-index .article-result h3,.content-card h3{order:1;margin:0 0 8px;font-size:20px;line-height:1.5}
.content-card h3 a{text-decoration:none}
.content-card .card-summary{order:2;color:var(--muted);font-size:15px;line-height:1.75;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.content-card .card-read{order:4;align-self:flex-start;margin-top:14px;min-height:42px;padding:6px 16px;font-size:14px}
.more-topics,.topics-more{margin-top:var(--sec)}
@media(max-width:700px){.article-list,.results,.topic-group>ul,.topic-group>div{grid-template-columns:1fr;gap:18px}.article-index .topic-group{margin-top:64px}}

/* ===== 文章頁 ===== */
.prose,.article-detail{max-width:760px;margin:40px auto;line-height:1.95}
.article-detail>a:first-child{display:inline-flex;align-items:center;min-height:40px;padding:4px 14px;border:2px solid var(--ink);border-radius:99px;background:var(--card);text-decoration:none;font-weight:700;font-size:14px}
.article-detail>.eyebrow,.prose .eyebrow{margin:28px 0 10px;color:var(--muted)}
.article-detail h1,.prose h1{font-family:var(--font-heading);font-weight:700;font-size:clamp(30px,4vw,44px);line-height:1.45;letter-spacing:.3px}
.article-detail>.small{display:inline-flex;align-items:center;gap:8px;margin:16px 8px 0 0;padding:4px 12px;border:2px solid var(--ink);border-radius:99px;background:var(--card);font-size:13px;color:var(--ink)}
.article-detail>.small a{font-weight:700}
.article-detail>.article-description{margin:24px 0 0;padding:20px 24px;border-left:8px solid var(--yellow);background:var(--paper-2);border-radius:0 var(--radius-sm) var(--radius-sm) 0;font-size:17px;color:var(--ink)}
.article-cover{margin:32px 0}
.article-cover img{border:2px solid var(--ink);border-radius:var(--radius);box-shadow:var(--shadow-hard);background:var(--paper-2)}
.article-cover figcaption{margin-top:12px;font-size:13px;color:var(--muted)}
.notice,.link-notice{margin:28px 0;padding:16px 24px;border:2px dashed var(--ink);border-radius:var(--radius);background:var(--card);font-size:15px}
.notice strong{font-family:var(--font-heading);font-size:16px}
.notice ul{margin:8px 0;padding-left:1.2em}
.article-body{margin-top:40px;font-size:17.5px;line-height:1.95}
.article-body p{margin:1.5em 0}
.article-body h2{border-top:2px solid var(--ink);margin-top:2.4em;padding-top:28px;font-size:clamp(24px,2.6vw,30px)}
.article-body h3{margin-top:2em;font-size:21px}
.article-body blockquote{margin:32px 0;padding:16px 24px;border:2px solid var(--ink);border-left-width:8px;border-radius:var(--radius-sm);background:var(--yellow-soft);color:var(--ink)}
.article-body figure{margin:40px 0}
.article-body figure img{border:2px solid var(--ink);border-radius:var(--radius);background:var(--paper-2)}
.article-body figcaption{color:var(--muted);text-align:center;margin-top:10px;font-size:13px}
.article-body a{text-decoration-thickness:2px;text-underline-offset:.22em;text-decoration-color:var(--yellow)}
.article-body a:hover{text-decoration-color:var(--ink)}
.article-players{margin:32px 0;padding:20px 24px;border:2px solid var(--ink);border-radius:var(--radius);background:var(--mint-soft)}
.editorial-notes,.journey-actions{margin-top:var(--sec);padding:24px;border:2px solid var(--ink);border-radius:var(--radius);background:var(--card)}
@media(max-width:700px){.prose,.article-detail{margin-top:20px}.article-body{font-size:17px}.article-detail>.article-description{padding:16px 18px}}

/* ===== r2（2026-11-10）：照 lil-fulfillment /for-schools/ 的版面搬過來微調：整幅大圖面板在上、標題在下；段落標題置中；階段卡進度線；東尼介紹雙欄卡；封面統一裁切 ===== */
.intro{display:block;margin:28px 0 var(--sec)}
.hero-panel{position:relative;margin:0;border:2px solid var(--ink);border-radius:24px;overflow:hidden;box-shadow:var(--shadow-hard);background:var(--paper-2)}
.hero-panel .hero-image{display:block;width:100%;aspect-ratio:21/9;height:auto;object-fit:cover;object-position:50% 48%;border:0;border-radius:0;box-shadow:none;order:initial}
.hero-chip{position:absolute;left:20px;top:20px;padding:4px 16px;border:2px solid var(--ink);border-radius:99px;background:var(--yellow);color:var(--ink);font:700 13px/1.8 var(--font-body);letter-spacing:.5px;box-shadow:var(--shadow-hard-sm)}
.hero-copy{max-width:760px;margin:44px 0 0;padding:0;order:initial}
.hero-copy h1{font-size:clamp(34px,4.6vw,56px)}
.hero-copy .lead{font-size:18px}
.needs>.label,.overview-head .label,.video-wrap>.label{display:inline-flex}
.needs>.label{display:flex;justify-content:center}
.overview-head{display:block;text-align:center;max-width:740px;margin:0 auto}
.overview-head .label{display:inline-flex}
.overview-head .status{margin-top:16px}
.video-wrap{text-align:center}
.video-wrap>p:not(.label){margin-left:auto;margin-right:auto}
.video-section{margin:40px auto 0}
.video-actions{justify-content:center;gap:24px}
.stages{position:relative;padding-top:32px}
.stages::before{content:"";position:absolute;left:12.5%;right:12.5%;top:8px;height:2px;background:var(--ink)}
.stage{position:relative}
.stage::before{content:"";position:absolute;left:50%;top:-32px;transform:translate(-50%,0);width:16px;height:16px;border-radius:50%;background:var(--yellow);border:2px solid var(--ink)}
.need-select{padding-right:60px}
.need-select::after{content:"›";position:absolute;right:16px;top:50%;transform:translateY(-50%);width:28px;height:28px;display:grid;place-items:center;border:2px solid var(--ink);border-radius:50%;background:var(--yellow-soft);font:700 18px/1 var(--font-body);color:var(--ink)}
.need-select[aria-pressed=true]::after{background:var(--card)}
.host-intro{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:40px;align-items:center;margin-top:var(--sec);padding:36px;border:2px solid var(--ink);border-radius:var(--radius);background:var(--card)}
.host-intro p:not(.label){position:relative;padding-left:24px;margin-top:10px}
.host-intro p:not(.label)::before{content:"";position:absolute;left:0;top:.8em;width:9px;height:9px;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 2px var(--ink)}
.host-intro img{box-shadow:none}
footer{text-align:center;padding:40px 0;margin-top:var(--sec)}
.article-index .topic-nav{justify-content:center}
.article-index .archive-opening,.article-index>.eyebrow,.article-index>h1,.article-index>h1+p{text-align:center}
.article-index>h1+p{margin-left:auto;margin-right:auto}
.article-index .topic-directory{max-width:760px;margin-left:auto;margin-right:auto}
.article-search{display:flex;flex-direction:column;align-items:center}
.content-card .card-image img,.card-image img.stock-cover{object-fit:cover;aspect-ratio:16/9;width:100%;height:auto;background:var(--paper-2)}
.article-cover img{aspect-ratio:16/9;object-fit:cover;max-height:none}
@media(max-width:900px){.stages{padding-top:0}.stages::before,.stage::before{display:none}.host-intro{grid-template-columns:minmax(0,1fr);padding:24px}}
@media(max-width:700px){.hero-panel{border-radius:18px}.hero-panel .hero-image{aspect-ratio:4/3;object-position:42% 50%}.hero-chip{left:12px;top:12px;font-size:12px}.hero-copy{margin-top:24px}.hero-copy h1{font-size:34px}.video-wrap{text-align:left}.video-actions{justify-content:flex-start}}
/* r2 修：主題標籤回到緊湊膠囊置中；搜尋列一行（標籤在上，輸入框＋清除鈕同列） */
.article-index .topic-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.article-index .topic-nav a{width:auto;flex:0 0 auto;text-align:center;padding:6px 18px}
.article-index .article-search{display:grid;grid-template-columns:minmax(0,520px) auto;gap:12px 10px;justify-content:center;align-items:center;margin:28px auto 0}
.article-index .article-search label{grid-column:1/-1;text-align:center;font-weight:700;font-size:15px}
.article-index .article-search input{max-width:none;width:100%}
.article-index .article-search button{min-height:52px;padding:8px 18px;border:2px solid var(--ink);border-radius:99px;background:var(--mint-soft);font:700 15px/1.4 var(--font-body);box-shadow:var(--shadow-hard-sm)}
.article-index .article-search #search-status{grid-column:1/-1;text-align:center;color:var(--muted);font-size:14px;margin:0}
@media(max-width:700px){.article-index .article-search{grid-template-columns:minmax(0,1fr)}.article-index .article-search button{justify-self:start}}

/* r3：色票、字級照 lil-fulfillment 整套搬（見 :root）。選中的需求鈕用淡橘底，而不是主橘 */
.need-select[aria-pressed=true]{background:var(--yellow-soft)}
.content-card .card-image::before{background:var(--yellow-soft)}
#listen-links>a[aria-current]{background:var(--yellow-soft)}
.index{background:var(--yellow-soft)}
.hero-chip{background:var(--yellow-soft)}
.stage::before{background:var(--yellow)}
/* r3 修：journey.css 排在本檔之後，等權重的規則會輸；文章頁這幾條加 html 前綴提高權重 */
html .article-index .topic-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;grid-template-columns:none}
html .article-index .topic-nav a{width:auto;flex:0 0 auto;min-width:0;padding:6px 18px;border:2px solid var(--ink);border-radius:99px;background:var(--card);font-weight:700;font-size:15px}
html .article-index .article-search button{background:var(--yellow-soft);border:2px solid var(--ink);border-radius:99px;color:var(--ink)}
html .article-index .topic-directory>summary{color:var(--ink)}
html .content-card,html .article-result{border-color:var(--ink)}
html .content-card .card-read,html .card-read{background:var(--card);color:var(--ink);border-color:var(--ink)}

/* ===== r4（2026-11-10）：其他頁套同一套——路徑、搜尋、小卡、Podcast 頁首、關於、404、指南；規則加 html 前綴壓過各頁自己的樣式 ===== */
html .button,html a.button,html .journey a.button,html .journey-actions a.button,html .site-search button[type=submit],html .cards-fallback-links a,html .app .primary,html dialog button{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:12px 24px;border:2px solid var(--ink);border-radius:99px;background:var(--yellow);color:var(--ink);text-decoration:none;font:700 15px/1.4 var(--font-body);box-shadow:var(--shadow-hard);cursor:pointer}
html .journey-actions>a:not(.button),html .path-return,html .journey-reading>a,html #search-clear,html #search-more,html .search-browse a,html .app .secondary,html .subactions button,html .history button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:8px 18px;border:2px solid var(--ink);border-radius:99px;background:var(--card);color:var(--ink);text-decoration:none;font:700 14px/1.4 var(--font-body);box-shadow:var(--shadow-hard-sm);cursor:pointer}
html .button:hover,html .app .primary:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--ink);background:var(--yellow)}
html .eyebrow.ruled,html .ruled{display:inline-flex;align-items:center;gap:8px;color:var(--kicker);font:700 14px/1.6 var(--font-body);letter-spacing:2px}
html .eyebrow.ruled::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 2px var(--ink);flex:0 0 auto}
html .archive-mark{display:none}
/* 路徑頁 */
html body>header.path-header{border-bottom:2px solid var(--ink)}
html .journey{max-width:var(--wrap);margin:0 auto;padding:32px 24px var(--sec)}
html .path-kicker,html .eyebrow.path-kicker{display:inline-flex;align-items:center;gap:8px;padding:4px 16px;border:2px solid var(--ink);border-radius:99px;background:var(--yellow-soft);color:var(--ink);font:700 13px/1.8 var(--font-body);letter-spacing:.5px}
html .eyebrow.path-kicker::before{content:none}
html .journey-header h1{font-family:var(--font-heading);font-weight:700;font-size:clamp(34px,4.4vw,52px);line-height:1.3}
html .path-hero-art{border:2px solid var(--ink);border-radius:var(--radius);box-shadow:var(--shadow-hard);background:var(--card);overflow:hidden;padding:0}
html .path-hero-art img{display:block;width:100%;height:auto;border-radius:0}
html .path-hero-art figcaption{padding:10px 16px;border-top:2px solid var(--ink);background:var(--yellow-soft);color:var(--ink);font-size:13px;text-align:center}
html .journey-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:32px 0 20px}
html .journey-steps a{display:flex;align-items:center;gap:12px;min-height:56px;padding:10px 16px;border:2px solid var(--ink);border-radius:var(--radius-sm);background:var(--card);color:var(--ink);text-decoration:none;font-weight:700}
html .journey-steps a[aria-current=step]{background:var(--yellow-soft);box-shadow:var(--shadow-hard-sm)}
html .step-no{display:grid;place-items:center;width:30px;height:30px;border:2px solid var(--ink);border-radius:50%;background:var(--card);font:700 12px/1 var(--font-body)}
html .journey-steps a[aria-current=step] .step-no{background:var(--yellow)}
html .journey-panel{border:2px solid var(--ink);border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow-hard);padding:32px}
html .journey-panel>.eyebrow{color:var(--kicker)}
html .journey-panel h2{font-family:var(--font-heading);font-weight:700}
html .journey-reading{border:2px solid var(--ink);border-left-width:8px;border-radius:var(--radius-sm);background:var(--yellow-soft);padding:20px 24px}
html .journey-note{color:var(--muted)}
html .journey footer{border-top:2px solid var(--ink);text-align:center;color:var(--muted)}
/* 搜尋頁 */
html .site-search h1{font-family:var(--font-heading);font-weight:700;font-size:clamp(34px,4.4vw,52px)}
html .site-search input,html .site-search select{min-height:52px;padding:10px 18px;border:2px solid var(--ink);border-radius:14px;background:var(--card);font:inherit;color:var(--ink)}
html .search-input-row{display:flex;gap:10px;flex-wrap:wrap}
html .search-input-row input{flex:1 1 320px}
html .search-result{border:2px solid var(--ink);border-radius:var(--radius);background:var(--card);padding:20px 24px;margin-top:16px}
html .search-result-kind{display:inline-block;padding:2px 12px;border:2px solid var(--ink);border-radius:99px;background:var(--yellow-soft);font:700 12px/1.8 var(--font-body);color:var(--ink);letter-spacing:.5px;margin:0 0 8px}
html .search-result h2{font-family:var(--font-heading);font-size:22px;margin:4px 0 8px}
html .search-browse{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
/* Podcast 頁首 */
html .archive-opening{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:40px;align-items:center;padding:32px 0 8px}
html .archive-opening h1{font-family:var(--font-heading);font-weight:700;font-size:clamp(36px,4.6vw,56px);line-height:1.3}
html .archive-opening>div:last-child,html .archive-opening figure,html .archive-opening .archive-art{border:2px solid var(--ink);border-radius:24px;background:var(--yellow-soft);box-shadow:var(--shadow-hard)}
html .podcast-cards .card-external{font-weight:700;text-decoration-color:var(--yellow)}
/* 小卡頁 */
html .app{max-width:var(--wrap);margin:0 auto;padding:24px 24px var(--sec)}
html .cards-label{display:inline-flex;align-items:center;gap:8px;color:var(--kicker);font:700 14px/1.6 var(--font-body);letter-spacing:2px}
html .cards-label::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 2px var(--ink)}
html .cards-context h2{font-family:var(--font-heading);font-weight:700;font-size:clamp(28px,3.4vw,40px);color:var(--ink)}
html .app>.notice{color:var(--muted)}
html .app .card{border:2px solid var(--ink);border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow-hard);color:var(--ink)}
html .app .card h1{font-family:var(--font-heading);color:var(--ink)}
html .app .back{border:2px solid var(--ink);border-radius:var(--radius);background:var(--yellow-soft);box-shadow:var(--shadow-hard);color:var(--ink)}
html .card-edition{color:var(--muted)}
html .landing-mark .mini{border:2px solid var(--ink);border-radius:var(--radius-sm);background:var(--card)}
html .app footer button,html #about{border:0;background:none;box-shadow:none;color:var(--muted);text-decoration:underline;text-underline-offset:.25em;font:600 14px/1.6 var(--font-body);min-height:0;padding:0}
html dialog{border:2px solid var(--ink);border-radius:var(--radius);background:var(--paper);color:var(--ink);box-shadow:var(--shadow-hard)}
html dialog h2{font-family:var(--font-heading)}
/* 關於頁 */
html .about-opening h1{font-family:var(--font-heading);font-weight:700}
html .about-opening img,html .about-opening figure img{border:2px solid var(--ink);border-radius:24px;box-shadow:var(--shadow-hard)}
html .about-opening figcaption{border:2px solid var(--ink);border-radius:var(--radius-sm);background:var(--card);padding:8px 16px}
html .brand-bio{border:2px solid var(--ink);border-radius:var(--radius);background:var(--card);padding:24px}
/* 404、指南、版權：標題統一 */
html .prose h1,html main>h1{font-family:var(--font-heading);font-weight:700}
@media(max-width:900px){html .journey-steps{grid-template-columns:repeat(2,minmax(0,1fr))}html .archive-opening{grid-template-columns:minmax(0,1fr)}}
@media(max-width:700px){html .journey{padding:20px 18px var(--sec)}html .journey-panel{padding:20px}html .app{padding:16px 18px var(--sec)}}

/* ===== r5（2026-11-10）：首頁首屏照參考站首頁——整塊框起來、左圖右字、右邊角落兩塊色塊；手機圖在上字在下。全站右下浮動圓鈕的樣式放在 navigation-r1.css ===== */
html .intro{position:relative;display:grid;grid-template-columns:minmax(0,1.22fr) minmax(0,1fr);gap:0;align-items:stretch;margin:28px 0 var(--sec);border:2px solid var(--ink);border-radius:24px;background:var(--yellow-soft);box-shadow:0 12px 32px rgba(40,62,80,.14);overflow:hidden;isolation:isolate}
html .intro::before,html .intro::after{content:"";position:absolute;z-index:0;border:2px solid var(--ink);border-radius:50%;pointer-events:none}
html .intro::before{right:-90px;top:-170px;width:320px;height:320px;background:#BFDFF2}
html .intro::after{right:-80px;bottom:-250px;width:470px;height:330px;background:#B9E0D6}
html .hero-panel{position:static;order:0;z-index:2;margin:0;border:0;border-right:2px solid var(--ink);border-radius:0;box-shadow:none;overflow:hidden;background:var(--paper-2)}
html .hero-panel .hero-image{display:block;width:100%;height:100%;min-height:440px;aspect-ratio:auto;object-fit:cover;object-position:26% 60%;border:0;border-radius:0;box-shadow:none}
html .hero-chip{left:auto;right:16px;top:16px;z-index:3;padding:5px 14px;border:1.5px solid var(--dot);border-radius:13px;background:#fff;color:var(--ink);font:700 14px/26px var(--font-heading);letter-spacing:.5px;box-shadow:0 12px 32px rgba(40,62,80,.14)}
html .hero-copy{position:relative;order:0;z-index:1;align-self:center;width:auto;max-width:none;margin:0;padding:72px 44px 52px}
html .hero-copy .label{display:inline-block;margin:0 0 14px;padding:5px 14px;border-radius:999px;background:var(--ink);color:#fff;font:700 13.5px/1.5 var(--font-body);letter-spacing:.5px}
html .hero-copy .label::before{content:none}
html .hero-copy h1{margin:0 0 14px;font-size:clamp(30px,3.3vw,40px);line-height:1.38}
html .hero-copy .lead{margin:0;max-width:none;font-size:16.5px;line-height:1.85;color:var(--muted)}
html .hero-copy .start-link{margin-top:24px}
@media(max-width:900px){html .intro{grid-template-columns:minmax(0,1fr);background:var(--paper)}html .intro::before,html .intro::after{content:none}html .hero-panel{border-right:0;border-bottom:2px solid var(--ink)}html .hero-panel .hero-image{height:auto;min-height:0;aspect-ratio:4/3;object-position:30% 55%}html .hero-chip{right:auto;left:10px;top:10px}html .hero-copy{padding:22px 18px 28px}html .hero-copy h1{font-size:28px}html .hero-copy .lead{font-size:15.5px}}
/* ===== r6（2026-11-10）：導航列鎖定在上方、文章頁照參考站（標題帶＋雙欄＋內容目錄＋標籤＋分享＋上下篇＋相關文章）、Podcast 與主題頁改成文章卡片排版、頁尾 ===== */
html{scroll-padding-top:96px}
html #listen-nav{position:sticky;top:0;z-index:800;background:#fff;border-bottom:0;box-shadow:0 0 0 100vmax #fff;clip-path:inset(0 -100vmax);padding-top:10px;padding-bottom:10px}
html #listen-nav::after{content:"";position:absolute;left:calc(50% - 50vw);bottom:0;width:100vw;height:2px;background:var(--ink);pointer-events:none}
@media(min-width:851px){html #listen-nav{flex-wrap:nowrap;gap:16px}html #listen-nav .ln-brand{flex:0 0 auto;margin-right:auto}html #listen-nav .ln-brand img{width:44px;height:44px}html #listen-links{order:0;width:auto;flex:0 1 auto;justify-content:flex-end;gap:4px}html #listen-links>a{min-height:44px;padding:6px 14px}html #listen-links .ln-hint{display:none}html #listen-nav .ln-search{order:0;margin-left:0}}
@media(min-width:851px) and (max-width:1000px){html #listen-links>a{padding:6px 9px;font-size:14px}html #listen-nav .ln-brand small{display:none}}
@media(max-width:850px){html #listen-nav{flex-wrap:wrap;gap:8px;padding:8px 18px}html #listen-nav:not([data-ready]){position:static}html #listen-nav .ln-brand{flex:0 1 auto;margin-right:auto;gap:8px}html #listen-nav .ln-brand img{width:40px;height:40px}html #listen-nav .ln-brand span{font-size:0;line-height:0}html #listen-nav .ln-brand small{display:block;margin:0;font:700 16px/1.3 var(--font-heading);color:var(--ink);letter-spacing:.5px}html #listen-nav .ln-search,html #listen-nav .ln-toggle{min-height:40px;padding:6px 12px;font-size:14px;box-shadow:2px 2px 0 var(--ink)}html #listen-nav .ln-search{margin-left:0}html #listen-links{max-height:calc(100dvh - 72px);overflow:auto;padding-bottom:8px}}
@media(max-width:350px){html #listen-nav .ln-brand img{display:none}}
/* 文章頁 */
html .art-r6{max-width:none;margin:0;line-height:1.95}
html .art-band{position:relative;text-align:center;padding:24px 0 32px;background:var(--yellow-soft);box-shadow:0 0 0 100vmax var(--yellow-soft);clip-path:inset(0 -100vmax)}
html .art-band::after{content:"";position:absolute;left:calc(50% - 50vw);bottom:0;width:100vw;height:2px;background:var(--ink)}
html .art-band .art-back{display:inline-flex;align-items:center;min-height:40px;padding:4px 16px;border:2px solid var(--ink);border-radius:99px;background:var(--card);color:var(--ink);text-decoration:none;font:700 14px/1.6 var(--font-body)}
html .art-band .art-back:hover{background:var(--yellow)}
html .art-band .eyebrow{display:flex;justify-content:center;margin:18px 0 6px;color:var(--kicker)}
html .art-band h1{max-width:900px;margin:0 auto 18px;font-family:var(--font-heading);font-weight:700;font-size:clamp(28px,3.6vw,42px);line-height:1.45;letter-spacing:.3px;text-wrap:balance}
html .art-band .compact-notice{max-width:760px;margin:14px auto 0;text-align:left}
html .art-meta{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 14px;margin:0;font:500 14px/1.7 var(--font-body);color:var(--ink-2)}
html .art-meta>span+span::before{content:"/";margin-right:14px;color:var(--muted)}
html .art-pill{display:inline-flex;align-items:center;min-height:32px;padding:2px 14px;border:2px solid var(--ink);border-radius:99px;background:var(--card);color:var(--ink);text-decoration:none;font:700 13px/1.6 var(--font-body)}
html .art-pill:hover{background:var(--yellow)}
html .art-cols{display:grid;grid-template-columns:minmax(0,1fr) 288px;gap:48px;align-items:start;margin-top:40px}
html .art-main{min-width:0}
html .art-main>.article-cover{margin:0 0 28px}
html .art-main>.article-description{margin:0 0 28px;padding:16px 20px;border-left:8px solid var(--yellow);border-radius:0 var(--radius-sm) var(--radius-sm) 0;background:var(--paper-2);font-size:17px;line-height:1.9}
html .art-toc{margin:0 0 32px;padding:20px 24px;border:2px solid var(--ink);border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow-hard)}
html .art-toc>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:12px;border-bottom:2px dashed var(--yellow);cursor:pointer;list-style:none;font:700 20px/1.5 var(--font-heading);color:var(--ink)}
html .art-toc>summary::-webkit-details-marker{display:none}
html .art-toc>summary::after{content:"收合";flex:0 0 auto;padding:8px 14px;border:2px solid var(--ink);border-radius:99px;background:var(--card);font:700 13px/1 var(--font-body)}
html .art-toc:not([open])>summary{padding-bottom:0;border-bottom:0}
html .art-toc:not([open])>summary::after{content:"顯示"}
html .art-toc ol{list-style:none;margin:0;padding:0}
html .art-toc>ol{display:grid;gap:6px;margin-top:14px}
html .art-toc li{margin:0}
html .art-toc a{display:flex;align-items:flex-start;gap:10px;padding:4px 0;color:var(--ink);text-decoration:none;font-weight:700;line-height:1.6}
html .art-toc a:hover>span:last-child{text-decoration:underline;text-decoration-color:var(--yellow);text-decoration-thickness:2px;text-underline-offset:.2em}
html .art-toc .toc-no{flex:0 0 auto;display:grid;place-items:center;min-width:28px;height:28px;margin-top:1px;padding:0 6px;border-radius:99px;background:var(--ink);color:#fff;font:700 13px/1 var(--font-body)}
html .art-toc ol ol{display:grid;gap:2px;margin:4px 0 6px 13px;padding-left:20px;border-left:2px dashed var(--yellow)}
html .art-toc ol ol a{font-weight:500;font-size:15px}
html .art-toc ol ol .toc-no{min-width:0;height:auto;margin-top:6px;padding:0;background:none;color:var(--rust);font-size:14px}
html .art-main>.article-body{margin-top:32px}
html .art-tags,html .art-share{margin-top:40px}
html .art-tags>h2,html .art-share>h2{margin:0 0 12px;padding:0;border:0;font:700 15px/1.6 var(--font-body);letter-spacing:1px;color:var(--kicker)}
html .art-tags ul{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none}
html .art-tags li{margin:0}
html .art-tags a{display:inline-flex;align-items:center;min-height:44px;padding:4px 16px;border:2px solid var(--dot);border-radius:99px;background:var(--card);color:var(--ink);text-decoration:none;font:500 14px/1.6 var(--font-body)}
html .art-tags a:hover{border-color:var(--ink);background:var(--yellow-soft)}
html .art-share-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
html .art-share-row a,html .art-share-row button{display:grid;place-items:center;width:44px;height:44px;min-height:0;padding:0;border:0;border-radius:50%;background:var(--ink);color:#fff;text-decoration:none;font:700 10px/1 var(--font-body);letter-spacing:.3px;cursor:pointer;box-shadow:none}
html .art-share-row a:hover,html .art-share-row button:hover{background:var(--yellow);color:var(--ink)}
html .art-share-row svg{width:20px;height:20px}
html .art-share-row [hidden]{display:none}
html .share-status{font-size:14px;color:var(--muted)}
html .art-pn{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);margin-top:40px;border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}
html .art-pn a{display:flex;align-items:center;gap:14px;min-width:0;padding:20px 16px 20px 0;color:var(--ink);text-decoration:none}
html .art-pn .art-pn-prev{grid-column:1}
html .art-pn .art-pn-next{grid-column:2;flex-direction:row-reverse;padding:20px 0 20px 16px;border-left:2px solid var(--dot);text-align:right}
html .art-pn img{flex:0 0 auto;width:64px;height:64px;border:2px solid var(--ink);border-radius:50%;object-fit:cover}
html .art-pn .pn-label{display:block;font:700 13px/1.6 var(--font-body);color:var(--kicker)}
html .art-pn .pn-title{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font:700 16px/1.5 var(--font-heading)}
html .art-pn a:hover .pn-title{text-decoration:underline;text-decoration-color:var(--yellow);text-decoration-thickness:2px}
html .art-main>.editorial-notes{margin-top:40px}
html .art-side{position:sticky;top:96px}
html .side-card{padding:24px;border:2px solid var(--ink);border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow-hard);font-size:15px;line-height:1.8;text-align:center}
html .side-card>img{display:block;width:112px;height:112px;margin:0 auto 12px;border:2px solid var(--ink);border-radius:50%;object-fit:cover}
html .side-card h2{margin:0 0 8px;padding:0;border:0;font:700 20px/1.5 var(--font-heading)}
html .side-card p{margin:0 0 8px;color:var(--ink-2);text-align:left}
html .side-card .side-more{font-weight:700}
html .side-card hr{margin:18px 0;border:0;border-top:2px dashed var(--dot)}
html .side-links{display:grid;gap:8px;margin:0 0 16px;padding:0;list-style:none}
html .side-links li{margin:0}
html .side-links a{display:flex;align-items:center;justify-content:space-between;min-height:44px;padding:6px 14px;border:2px solid var(--ink);border-radius:var(--radius-sm);background:var(--card);color:var(--ink);text-decoration:none;font-weight:700}
html .side-links a::after{content:"→"}
html .side-links a:hover{background:var(--yellow-soft)}
html .side-card .side-listen{display:flex;align-items:center;justify-content:center;min-height:48px;border:2px solid var(--ink);border-radius:99px;background:var(--ink);color:#fff;text-decoration:none;font-weight:700}
html .side-card .side-listen:hover{background:var(--yellow);color:var(--ink)}
html .art-related{position:relative;margin-top:64px;padding:48px 0 56px;background:var(--paper-2);box-shadow:0 0 0 100vmax var(--paper-2);clip-path:inset(0 -100vmax);counter-reset:card}
html .art-related>h2{margin:0 0 24px;padding:0;border:0;font:700 26px/1.4 var(--font-heading);text-align:center}
html .art-related .unified-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:0}
html main:has(.art-related){padding-bottom:0}
html main:has(.art-related)+footer{margin-top:0}
@media(max-width:960px){html .art-cols{grid-template-columns:minmax(0,1fr);gap:40px}html .art-side{position:static}html .side-card{max-width:520px;margin:0 auto}}
@media(max-width:700px){html .art-band{padding:16px 0 24px}html .art-cols{margin-top:28px}html .art-toc{padding:16px 18px}html .art-pn{grid-template-columns:minmax(0,1fr)}html .art-pn .art-pn-prev,html .art-pn .art-pn-next{grid-column:1}html .art-pn .art-pn-next{border-left:0;border-top:2px solid var(--dot);padding:20px 0}html .art-pn a{padding:20px 0}html .art-related .unified-grid{grid-template-columns:minmax(0,1fr)}html .art-related{padding:36px 0 40px}}
/* Podcast 頁：跟文章列表同一套卡片 */
html .episode.content-card{padding:0;scroll-margin-top:24px}
html .episode .card-copy .small{order:3}
html .episode .card-copy details{order:4;margin-top:12px}
html .episode .card-copy .card-read{order:5;margin-top:12px}
html .episode .card-copy .card-external{order:6;margin-top:10px;align-self:flex-start}
html .episode .card-copy summary{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:6px 18px;border:2px solid var(--ink);border-radius:99px;background:var(--yellow);font:700 14px/1.4 var(--font-body);cursor:pointer;list-style:none;box-shadow:var(--shadow-hard-sm)}
html .episode .card-copy summary::-webkit-details-marker{display:none}
html .episode .card-copy summary::before{content:"▶";font-size:11px}
html .episode .card-copy details[open] summary{background:var(--card);box-shadow:none}
html .episode .card-copy audio{display:block;width:100%;margin-top:12px}
html .card-image.ep-brand{display:grid;place-items:center;align-content:center;gap:8px;aspect-ratio:16/9;background:var(--tint-blue)}
html .episode:nth-child(3n+1) .card-image.ep-brand{background:var(--yellow-soft)}
html .episode:nth-child(3n+2) .card-image.ep-brand{background:var(--paper-2)}
html .card-image.ep-brand img{width:88px;height:88px;aspect-ratio:1;object-fit:contain;border:0;border-radius:0}
html .card-image.ep-brand .ep-brand-text{font:700 15px/1.4 var(--font-heading);letter-spacing:2px;color:var(--ink)}
/* 主題頁：卡片標題是 h2，長相跟文章列表的 h3 一樣 */
html .topic-page .unified-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px;margin-top:32px;counter-reset:card}
html .topic-page .card-copy h2{order:1;margin:0 0 8px;padding:0;border:0;font-family:var(--font-heading);font-weight:700;font-size:20px;line-height:1.5}
html .topic-page .card-copy h2 a{text-decoration:none}
html .topic-page .search-browse{justify-content:center}
@media(max-width:700px){html .topic-page .unified-grid{grid-template-columns:minmax(0,1fr)}}
/* 頁尾：白底通欄 */
html body>footer{position:relative;border-top:0;background:#fff;box-shadow:0 0 0 100vmax #fff;clip-path:inset(0 -100vmax)}
html body>footer::before{content:"";position:absolute;left:calc(50% - 50vw);top:0;width:100vw;height:2px;background:var(--ink)}
html .art-share-row .share-glyph{font-size:18px;line-height:1}

/* ===== r6 修正一（2026-11-10）：舊樣式殘留——小標置中、卡片等高、Podcast 品牌封面、搜尋框、路徑頁、頁尾 ===== */
html .article-index>.eyebrow{display:flex;justify-content:center}
html .unified-grid{align-items:stretch}
html .episode.content-card{content-visibility:visible;contain-intrinsic-size:auto}
html .card-image.ep-brand img{position:static;inset:auto;width:88px;height:88px}
html .article-search input{min-height:52px;padding:10px 18px;border:2px solid var(--ink);border-radius:99px;background:var(--card);color:var(--ink);font:inherit}
html .article-search input:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}
html #podcast-search-clear{min-height:52px;margin-top:0;padding:8px 18px;border:2px solid var(--ink);border-radius:99px;background:var(--yellow-soft);color:var(--ink);font:700 15px/1.4 var(--font-body);box-shadow:var(--shadow-hard-sm)}
html .article-index .article-search #podcast-status{grid-column:1/-1;text-align:center;color:var(--muted);font-size:14px;margin:0}
@media(min-width:961px) and (max-width:1360px){html .art-cols{gap:36px;padding-right:44px}}
/* 路徑頁 */
html main:has(.journey){max-width:none;padding:0 20px}
html .journey-header{max-width:var(--wrap);margin:0 auto;padding:48px 24px 36px;gap:48px;align-items:center}
html .journey-header a{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;margin-top:20px;padding:8px 18px;border:2px solid var(--ink);border-radius:99px;background:var(--card);color:var(--ink);text-decoration:none;font:700 14px/1.4 var(--font-body);box-shadow:var(--shadow-hard-sm)}
html .journey-header .journey-intro-copy>p:not(.eyebrow){color:var(--muted)}
html .journey{border-top:0;padding:8px 24px 72px}
html .journey-steps,html .journey-panel{max-width:920px;margin-left:auto;margin-right:auto}
html .journey-steps{margin-top:16px;margin-bottom:24px;border-bottom:0;padding-bottom:0}
html .journey-panel{margin-top:0;margin-bottom:0}
html .journey-panel>p>a{display:inline-flex;align-items:center;min-height:44px;padding:8px 18px;border:2px solid var(--ink);border-radius:99px;background:var(--card);color:var(--ink);text-decoration:none;font:700 14px/1.4 var(--font-body);box-shadow:var(--shadow-hard-sm)}
html .journey-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:20px 0}
html .journey-options a{display:flex;flex-direction:column;gap:6px;padding:18px 20px;border:2px solid var(--ink);border-radius:var(--radius-sm);background:var(--card);color:var(--ink);text-decoration:none;font:700 17px/1.5 var(--font-heading);box-shadow:var(--shadow-hard-sm)}
html .journey-options a span{font:500 13px/1.6 var(--font-body);color:var(--muted)}
html .journey-options a:hover{background:var(--yellow-soft)}
html .journey-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:24px;border:0;border-radius:0;background:none;box-shadow:none;padding:0}
html .journey-options a::after{content:none}
@media(max-width:900px){html .journey-header{grid-template-columns:minmax(0,1fr);gap:20px;padding:28px 4px 24px}html .journey{padding:8px 4px 56px}}
@media(max-width:700px){html .journey-options{grid-template-columns:minmax(0,1fr)}}
/* 頁尾：全站同一個樣子（置中直排） */
html body>footer{display:flex;flex-direction:column;align-items:center;gap:10px;max-width:none;margin-left:0;margin-right:0;padding:44px 24px;text-align:center;font-size:14px;color:var(--muted)}
html body>footer p{margin:0}
html body>footer>p:first-child{font:700 18px/1.5 var(--font-heading);color:var(--ink)}
html body>footer>a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 20px;border:2px solid var(--ink);border-radius:99px;background:var(--yellow-soft);color:var(--ink);text-decoration:none;font:700 14px/1.4 var(--font-body);box-shadow:var(--shadow-hard-sm)}
html body>footer p a{background:none;padding:4px 6px;color:var(--ink)}
html body>footer .small{font-size:12px;letter-spacing:2px}
/* 首頁導航列跟其他頁同寬（首頁的導航列包在有留白的外框裡） */
html .sheet>#listen-nav{margin-left:-24px;margin-right:-24px}
@media(max-width:700px){html .sheet>#listen-nav{margin-left:-18px;margin-right:-18px}html .art-meta>span+span::before{content:none}}
/* 卡片圖上的分類小牌：靠右下、不拉滿；延伸閱讀區直接接頁尾 */
html .image-label{left:auto;right:12px;max-width:calc(100% - 24px)}
html .art-related{margin-bottom:0}
/* ===== r7：首頁首屏改成分層（底圖＋大 Logo＋頭像＋小雞），做法照參考站首屏 ===== */
/* r9 改版：Logo 是只有字的版本，頭像和小雞放大疊在原本的位置（不重複）；底圖是自己的形狀和顏色（天藍大色塊、草綠小山丘、星星、虛線路徑，終點一顆橘球），不用紫色 */
html .hero-stage{position:relative;min-height:480px;border-right:0;overflow:hidden;background-color:transparent;background-repeat:no-repeat;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-2 -2 28 28'%3E%3Cpath d='M12 0C13 8 16 11 24 12 16 13 13 16 12 24 11 16 8 13 0 12 8 11 11 8 12 0Z' fill='%23FFDE78' stroke='%23283E50' stroke-width='1.6' stroke-linejoin='round'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-2 -2 28 28'%3E%3Cpath d='M12 0C13 8 16 11 24 12 16 13 13 16 12 24 11 16 8 13 0 12 8 11 11 8 12 0Z' fill='%23FFFFFF' stroke='%23283E50' stroke-width='1.6' stroke-linejoin='round'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 140'%3E%3Cpath d='M6 132C66 134 70 70 122 68S180 52 196 30' fill='none' stroke='%23283E50' stroke-width='3' stroke-linecap='round' stroke-dasharray='1 11'/%3E%3Ccircle cx='200' cy='18' r='13' fill='%23FDB14A' stroke='%23283E50' stroke-width='2.5'/%3E%3C/svg%3E"),radial-gradient(circle at 12% 6%,var(--ink) 0 3.5px,transparent 4.1px);background-position:4% 5%,93% 52%,97% 93%,0 0;background-size:34px 34px,22px 22px,31% auto,auto}
html .hero-stage::before,html .hero-stage::after{content:"";position:absolute;border:2px solid var(--ink);pointer-events:none}
html .hero-stage::before{left:3%;top:3%;width:82%;height:86%;z-index:0;border-radius:44% 56% 61% 39%/52% 44% 56% 48%;background:#BFE3F5;transform:rotate(5deg)}
html .hero-stage::after{left:-20%;bottom:-27%;width:94%;height:52%;z-index:1;border-radius:50%;background:#CBE7B4;transform:rotate(4deg)}
html .hero-stage img{position:absolute;display:block;height:auto;max-width:none;margin:0;border:0;border-radius:0;box-shadow:none;object-fit:contain;transition:transform .25s ease}
html .hero-stage .stage-logo{left:12%;top:11%;width:60%;z-index:2;border-radius:50%;box-shadow:var(--shadow-hard);outline:2px solid var(--ink);transform:rotate(-4deg)}
html .hero-stage .stage-tony{left:57%;top:1%;width:40%;z-index:3;filter:drop-shadow(0 10px 12px rgba(40,62,80,.22));transform:rotate(7deg);animation:stage-float-a 7s ease-in-out infinite}
html .hero-stage .stage-chick{left:3.5%;top:63%;width:22%;z-index:4;filter:drop-shadow(0 8px 10px rgba(40,62,80,.22));transform:rotate(-8deg);animation:stage-float-b 6s ease-in-out infinite}
html .hero-stage .stage-logo:hover{transform:rotate(-1deg) scale(1.02)}
html .intro::before{background:#FFD98C;border-radius:44% 56% 52% 48%/54% 46% 54% 46%}
html .intro::after{background:#CBE7B4;border-radius:52% 48% 50% 50%/60% 52% 48% 40%}
@keyframes stage-float-a{0%,100%{transform:rotate(7deg) translateY(0)}50%{transform:rotate(5deg) translateY(-8px)}}
@keyframes stage-float-b{0%,100%{transform:rotate(-8deg) translateY(0)}50%{transform:rotate(-5deg) translateY(-6px)}}
@media(prefers-reduced-motion:reduce){html .hero-stage .stage-tony,html .hero-stage .stage-chick{animation:none}}
@media(max-width:900px){html .hero-stage{min-height:0;aspect-ratio:5/4;border-bottom:2px solid var(--ink);background-color:var(--yellow-soft)}html .intro>.hero-chip{left:auto;right:12px;top:12px}}
@media(min-width:701px) and (max-width:900px){html .hero-stage{aspect-ratio:16/9}html .hero-stage::before{left:13%;top:3%;width:60%;height:90%}html .hero-stage::after{left:-8%;bottom:-32%;width:66%;height:58%}html .hero-stage .stage-logo{left:22%;top:11%;width:42%}html .hero-stage .stage-tony{left:54%;top:2%;width:28%}html .hero-stage .stage-chick{left:15.5%;top:62%;width:15%}}
@media(max-width:700px){html .intro>.hero-chip{left:10px;right:auto;top:10px;padding:3px 11px;font-size:12.5px;line-height:22px}html .hero-stage{aspect-ratio:6/5}html .hero-stage::before{top:9%;height:84%}html .hero-stage .stage-logo{top:16%;width:58%}html .hero-stage .stage-tony{top:7%;width:38%}html .hero-stage .stage-chick{left:4%;top:66%;width:20%}}
/* r9：首頁「最近，你想先照顧哪件事」三張卡片一樣寬、文字齊左（原本按鈕被排到第二欄，寬度跟著字數變） */
html .need-options article{grid-template-columns:minmax(0,1fr)}
html .need-options .need-select{grid-column:1;width:100%;box-sizing:border-box;text-align:left;align-items:flex-start}
/* r9：路徑頁切換步驟時，標題不要出現綠色外框（標題不是按鈕，鍵盤操作按鈕和連結的外框照舊保留） */
html .journey-panel h2:focus,html .journey-panel h2:focus-visible{outline:none}
/* r9：首頁新增「看看聽眾怎麼說」，六則留言照舊站首頁原文 */
html .voices{margin:0;padding:var(--sec) 0 0;border-top:2px solid var(--ink);text-align:center}
html .voices>.label{display:flex;justify-content:center}
html .voices-stars{margin:14px 0 0;color:var(--yellow);font-size:28px;line-height:1;letter-spacing:6px;-webkit-text-stroke:2px var(--ink);paint-order:stroke fill}
html .voices-list{list-style:none;margin:48px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 24px;text-align:left}
html .voices-list li{position:relative;display:flex;flex-direction:column;margin:0;padding:36px 24px 18px;border:2px solid var(--ink);border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow-hard-sm)}
html .voices-list li::before{content:"\201C";position:absolute;left:20px;top:-22px;box-sizing:border-box;width:42px;height:42px;padding-top:7px;border:2px solid var(--ink);border-radius:50%;background:var(--yellow);color:var(--ink);font:700 40px/1 Georgia,"Times New Roman",serif;text-align:center;overflow:hidden}
html .voices-list li:nth-child(3n+2)::before{background:#BFE3F5}
html .voices-list li:nth-child(3n)::before{background:#CBE7B4}
html .voices-list blockquote{flex:1;margin:0;padding:0;border:0;background:none}
html .voices-list h3{margin:0 0 10px;color:var(--ink);font:700 19px/1.5 var(--font-heading)}
html .voices-list blockquote p{margin:0;color:var(--muted);font-size:15.5px;line-height:1.85}
html .voices-list time{display:block;margin-top:16px;padding-top:12px;border-top:1px dashed rgba(40,62,80,.3);color:var(--kicker);font-size:13px;letter-spacing:1px}
@media(max-width:900px){html .voices-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){html .voices{text-align:left}html .voices>.label{justify-content:flex-start}html .voices-list{grid-template-columns:minmax(0,1fr)}}
/* r9：「認識東尼」頁放回舊站關於頁的文字（三大主題核心、嗨我是東尼哥、適合什麼人），文字照舊站原文 */
html .about-opening .about-lead{margin:18px 0 0;color:var(--ink);font:700 clamp(18px,1.7vw,22px)/1.6 var(--font-heading)}
html .about-core{max-width:1000px;margin:clamp(48px,6vw,72px) auto 0;padding:clamp(24px,4vw,44px);border:2px solid var(--ink);border-radius:24px;background:var(--yellow-soft);box-shadow:var(--shadow-hard);text-align:center;box-sizing:border-box}
html .about-core h2{margin:0;font:700 clamp(24px,2.6vw,32px)/1.4 var(--font-heading)}
html .about-core>p{max-width:34em;margin:12px auto 0;color:var(--muted)}
html .about-core-list{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;text-align:left;counter-reset:core}
html .about-core-list li{margin:0;padding:22px 20px;border:2px solid var(--ink);border-radius:var(--radius);background:var(--card);counter-increment:core}
html .about-core-list h3{display:flex;align-items:center;gap:10px;margin:0 0 10px;font:700 20px/1.4 var(--font-heading)}
html .about-core-list h3::before{content:counter(core,decimal-leading-zero);display:grid;place-items:center;flex:none;width:34px;height:34px;border:2px solid var(--ink);border-radius:50%;background:var(--yellow);font:700 13px/1 var(--font-body)}
html .about-core-list li:nth-child(2) h3::before{background:#BFE3F5}
html .about-core-list li:nth-child(3) h3::before{background:#CBE7B4}
html .about-core-list p{margin:0;color:var(--muted);font-size:15.5px;line-height:1.85}
html .about-prose>p+p{margin-top:16px}
html .about-prose .about-quote{margin:28px 0;padding:18px 22px;border-left:6px solid var(--yellow);border-radius:0 var(--radius-sm) var(--radius-sm) 0;background:var(--yellow-soft);font:700 19px/1.8 var(--font-heading)}
html .about-fit{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
html .about-fit li{position:relative;margin:0;padding:14px 16px 14px 42px;border:2px solid var(--ink);border-radius:var(--radius-sm);background:var(--card);line-height:1.7}
html .about-fit li::before{content:"";position:absolute;left:16px;top:23px;width:11px;height:11px;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 2px var(--ink)}
html .about-prose .about-more{margin:10px 0 24px;color:var(--muted);text-align:right;letter-spacing:1px}
html .about-prose .about-closing{margin:32px 0 0;padding:22px 24px;border:2px solid var(--ink);border-radius:var(--radius);background:var(--yellow-soft);box-shadow:var(--shadow-hard-sm);font:700 20px/1.7 var(--font-heading);text-align:center}
html .about-prose .about-note{margin-top:40px;color:var(--muted);font-size:14.5px}
@media(max-width:800px){html .about-core-list{grid-template-columns:minmax(0,1fr)}html .about-fit{grid-template-columns:minmax(0,1fr)}html .about-core{text-align:left}html .about-core>p{margin-left:0}}
/* r10：小卡改成「照需求抽卡」。先選需求（五個按鈕），抽一張，翻面是一個提問加一句說明，卡片下面帶去一篇文章 */
html .app .cards-needs{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:14px;width:100%;max-width:560px}
html .app .cards-needs li{margin:0;padding:0}
html .app .cards-need{display:grid;grid-template-columns:46px minmax(0,1fr) auto;align-items:center;gap:6px 14px;width:100%;min-height:72px;padding:12px 18px 12px 14px;border:2px solid var(--ink);border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow-hard-sm);color:var(--ink);text-align:left;font:700 17px/1.6 var(--font-body);cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background-color .15s ease}
@media (hover:hover) and (pointer:fine){html .app .cards-need:hover{background:var(--yellow-soft);border-color:var(--ink);transform:translate(-2px,-2px);box-shadow:var(--shadow-hard)}}
html .app .cards-need:not(:disabled):active{background:var(--yellow-soft);transform:translate(1px,1px);box-shadow:1px 1px 0 var(--ink)}
html .cards-need-icon{display:grid;place-items:center;width:46px;height:46px;border:2px solid var(--ink);border-radius:50%;background:#FFD98C}
html .cards-need[data-need=start] .cards-need-icon{background:#BFE3F5}
html .cards-need[data-need=stuck] .cards-need-icon{background:#CBE7B4}
html .cards-need[data-need=people] .cards-need-icon{background:#FDB14A}
html .cards-need[data-need=self] .cards-need-icon{background:#EEF3F7}
html .cards-need-symbol{display:block;width:28px;height:28px;color:var(--ink)}
html .cards-need-name{min-width:0}
html .cards-need-count{color:var(--muted);font:600 13px/1.4 var(--font-body);white-space:nowrap}
html .app .cards-kicker{margin:0 0 6px;color:var(--kicker);font:700 14px/1.6 var(--font-body);letter-spacing:1px;text-align:center}
html .app .back .symbol{color:var(--ink)}
html .app .card-edition{gap:16px;align-items:baseline;border-bottom:2px dashed var(--ink);color:var(--muted);font:600 13px/1.6 var(--font-body);letter-spacing:0}
html .app .card-edition>span:first-child{flex:none;color:var(--ink);font:700 15px/1.6 var(--font-body)}
html .app .card-edition>span:last-child{text-align:right}
html .app .card .card-name{display:inline-block;margin:0 0 14px;padding:3px 16px;border:2px solid var(--ink);border-radius:99px;background:#FFD98C;color:var(--ink);font:700 15px/1.7 var(--font-body);letter-spacing:2px}
html .app .card[data-need=start] .card-name{background:#BFE3F5}
html .app .card[data-need=stuck] .card-name{background:#CBE7B4}
html .app .card[data-need=people] .card-name{background:#FDB14A}
html .app .card[data-need=self] .card-name{background:#EEF3F7}
html .app .card h1{margin:0 0 16px;font-size:clamp(23px,2.5vw,29px);font-weight:700;line-height:1.65;letter-spacing:0;text-align:left}
html .app .card .card-note{color:var(--muted);font-size:17px;font-weight:500;line-height:1.9}
html .app .cards-read{box-sizing:border-box;width:100%;max-width:560px;margin-top:24px;padding:14px 20px 12px;border:2px dashed var(--ink);border-radius:var(--radius);background:var(--paper-2);text-align:left}
html .app .cards-read-label{margin:0;color:var(--kicker);font:700 13px/1.6 var(--font-body);letter-spacing:1px}
html .app .cards-read .reading-link{display:inline-block;width:auto;min-height:0;margin:0;padding:6px 0;color:var(--ink);font:700 17px/1.7 var(--font-body);text-decoration:underline;text-decoration-color:var(--yellow);text-decoration-thickness:3px;text-underline-offset:.3em}
html .app .cards-read .reading-link::after{content:" →"}
html .app .round-note{margin-top:18px;color:var(--muted);font-size:14px}
html .app .subactions{justify-content:center}
html .app .back+.subactions{margin-top:26px}
html .app>.notice{box-sizing:border-box;justify-self:center;width:100%;max-width:560px;padding:10px 18px;text-align:center}
html .cards-context h2{font-size:clamp(28px,2.5vw,34px);line-height:1.5;text-wrap:balance}
@media(max-width:700px){html .app>.notice{width:auto;max-width:100%;padding:8px 14px;font-size:13px}}
@media(max-width:420px){html .app .cards-need{grid-template-columns:40px minmax(0,1fr);gap:0 12px;padding:10px 14px 10px 12px;font-size:16px}html .cards-need-icon{grid-row:1/3;width:40px;height:40px}html .cards-need-count{grid-column:2}html .cards-need-symbol{width:24px;height:24px}}