/* 部落格、分類、404（2026-11-02 老闆：一般訪客看不懂指令字樣，以為系統出錯）：區塊標題改白話、內容改卡片。深淺主題都走 token。 */
/* ide-legacy.css（產生器產出，不手改）替內文標題加了 ## 與 ###，分類頁導讀用同一套樣式，這裡蓋掉 */
html[data-theme] body.ide-body .article-prose :is(h2,h3)::before{content:none}
.pb-head{margin:0 0 16px;font:800 clamp(22px,2.4vw,28px)/1.35 var(--font-sans);letter-spacing:-.01em;color:var(--fg)}
.pb-meta{margin:10px 0 0;font-size:15.5px;line-height:1.7;color:var(--fg-2)}
.pb-meta a{color:var(--accent);font-weight:600}
.pb-meta a:hover{text-decoration:underline}
.pb-crumb{margin:0 0 14px;font-size:14.5px;color:var(--fg-2)}
.pb-crumb a{color:inherit}
.pb-crumb a:hover{color:var(--accent)}
.pb-crumb b{font-weight:600;color:var(--accent)}
.pb-crumb i{margin:0 6px;font-style:normal;opacity:.5}

/* article cards */
.pb-card .pb-card-t{font-size:18px;line-height:1.5}
.pb-card p{font-size:15.5px;line-height:1.7}
.pb-card .cmt,.pb-card .pb-date{font-size:14.5px}
.pb-go{display:inline-flex;align-items:center;gap:6px;font-size:15px;font-weight:700;color:var(--accent)}
.pb-card:hover .pb-go,.pb-tile:hover .pb-go{text-decoration:underline}
.pb-badge{display:inline-block;margin-right:8px;padding:2px 10px;border-radius:99px;background:var(--accent-soft);color:var(--accent);font-size:14.5px;font-weight:700}
.pb-chip{position:absolute;top:12px;left:12px;padding:3px 10px;border-radius:99px;background:#F5B83D;color:#1A1200;font-size:13px;font-weight:800}
.pb-tag{padding:2px 9px;border:1px solid var(--line);border-radius:99px;color:var(--fg-2);font-size:13px;white-space:nowrap}

/* picture tiles (404) */
.pb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:16px}
.pb-tile{display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line);border-radius:14px;background:var(--panel);box-shadow:var(--card-shadow);color:var(--fg);text-decoration:none;transition:border-color .2s,transform .2s,box-shadow .2s}
.pb-tile:hover{border-color:var(--accent);transform:translateY(-3px);box-shadow:var(--shadow)}
.pb-tile-img{display:block;aspect-ratio:16/9;overflow:hidden;background:color-mix(in srgb,var(--accent) 12%,var(--panel))}
.pb-tile-img img{display:block;width:100%;height:100%;object-fit:cover}
.pb-tile-body{display:flex;flex:1;flex-direction:column;gap:10px;padding:16px}
.pb-tile-t{font-size:17px;font-weight:700;line-height:1.5;color:var(--fg)}
.pb-tile .pb-go{margin-top:auto}

/* where to go next (404) */
.pb-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:24px}
.pb-action{display:flex;align-items:center;gap:14px;min-height:80px;padding:14px 16px;border:1px solid color-mix(in srgb,var(--c) 40%,var(--line));border-radius:14px;background:color-mix(in srgb,var(--c) 7%,var(--panel));color:var(--fg);text-decoration:none;transition:transform .2s,border-color .2s}
.pb-action:hover{border-color:var(--c);transform:translateY(-2px)}
.pb-ic{flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:12px;background:var(--c);color:#fff}
.pb-ic svg{width:24px;height:24px}
.pb-action span:last-child{display:grid;gap:2px;min-width:0}
.pb-action b{font-size:17px;font-weight:800;color:var(--fg)}
.pb-action small{font-size:14.5px;line-height:1.5;color:var(--fg-2)}
@media (max-width:760px){.pb-actions{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.pb-tile,.pb-action{transition:none}.pb-tile:hover,.pb-action:hover{transform:none}}