/* kanban-lanes · 看板 —— 灰色泳道、彩色标签胶囊与日期徽章贯穿全站 */
:root {
    --kb-board: #dfe7dc;
    --kb-lane: #f1f4f0;
    --kb-card: #ffffff;
    --kb-ink: #1c2620;
    --kb-soft: #4f5a53;
    --kb-line: #cfd8cc;
    --kb-accent: #c2410c;
    --kb-display: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
    --kb-body: Overpass, system-ui, -apple-system, "Segoe UI", sans-serif;
    --kb-r: 12px;
    --pagination-accent: #c2410c;
}

body.theme-kanban { margin: 0; background: var(--kb-board); color: var(--kb-ink); font-family: var(--kb-body); font-size: 16px; }
:where(.theme-kanban) a { color: inherit; text-decoration: none; }
.theme-kanban :focus-visible { outline: 3px solid var(--kb-accent); outline-offset: 3px; }
.kb-skip { position: absolute; left: -9999px; }
.kb-skip:focus { left: 12px; top: 12px; z-index: 50; padding: 10px 14px; background: var(--kb-card); border-radius: 8px; font-weight: 700; }
.kb-board:focus { outline: none; }

/* ---------- 母题：标签胶囊、日期徽章、计数 ---------- */
.kb-label { display: inline-block; justify-self: start; max-width: 100%; padding: 3px 10px; border-radius: 999px; font-size: .78rem; font-weight: 700; line-height: 1.35; color: #fff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kb-label-0, .kb-edge-0 { --kb-tone: #2563eb; }
.kb-label-1, .kb-edge-1 { --kb-tone: #b4236b; }
.kb-label-2, .kb-edge-2 { --kb-tone: #15803d; }
.kb-label-3, .kb-edge-3 { --kb-tone: #7c3aed; }
.kb-label-4, .kb-edge-4 { --kb-tone: #b45309; }
.kb-label { background: var(--kb-tone); }
.kb-due { display: inline-flex; align-items: center; gap: 6px; padding: 2px 8px; border-radius: 6px; background: #e9eee7; font-size: .8rem; font-weight: 600; color: var(--kb-soft); }
.kb-due::before { content: ""; width: 10px; height: 10px; border: 2px solid currentColor; border-top-width: 4px; border-radius: 2px; }
.kb-count { display: inline-grid; place-items: center; min-width: 24px; height: 24px; padding: 0 6px; border-radius: 999px; background: var(--kb-line); font-size: .8rem; font-weight: 700; }

/* ---------- 顶栏 ---------- */
.kb-topbar { background: var(--kb-ink); color: #fff; }
.kb-topbar-inner { display: flex; align-items: center; gap: 20px; max-width: 1360px; margin: 0 auto; padding: 10px 24px; }
.kb-workspace { display: inline-flex; align-items: center; gap: 12px; margin-right: auto; min-width: 0; }
.kb-workspace-icon { display: inline-grid; grid-template-columns: repeat(3, 8px); align-items: start; gap: 3px; padding: 6px; border-radius: 8px; background: var(--kb-accent); }
.kb-workspace-icon i { display: block; border-radius: 2px; background: #fff; }
.kb-workspace-icon i:nth-child(1) { height: 18px; }
.kb-workspace-icon i:nth-child(2) { height: 12px; }
.kb-workspace-icon i:nth-child(3) { height: 15px; }
.kb-workspace-name { font-family: var(--kb-display); font-weight: 800; font-size: 1.4rem; letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kb-tabs { display: flex; gap: 4px; }
.kb-tabs a { padding: 8px 14px; border-radius: 8px; font-weight: 700; font-size: .95rem; }
.kb-tabs a:hover { background: rgba(255, 255, 255, .12); }
.kb-tabs a.is-on { background: #fff; color: var(--kb-ink); }
.kb-menu-toggle { display: none; color: inherit; }

/* ---------- 版心 ---------- */
.kb-board { min-height: 60vh; padding-bottom: 48px; }
.kb-board-inner { max-width: 1360px; margin: 0 auto; padding: 24px 24px 0; }
.kb-crumb { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 0 8px; font-size: .9rem; color: var(--kb-soft); }
.kb-crumb a { color: var(--kb-accent); font-weight: 700; }
.kb-empty { margin: 32px 0; text-align: center; color: var(--kb-soft); }
.kb-pager { margin-top: 32px; }

/* ---------- 泳道 ---------- */
.kb-lane { padding: 12px; border-radius: 16px; background: var(--kb-lane); }
.kb-lane + .kb-lane, .kb-pinned + .kb-lane { margin-top: 20px; }
.kb-lane-head { display: flex; align-items: center; gap: 10px; margin: 2px 4px 12px; font-family: var(--kb-display); font-weight: 800; font-size: 1.1rem; }
.kb-lane-cards { display: grid; gap: 12px; }
.kb-lane-three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.kb-lane-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* 卡片 */
.kb-card { min-width: 0; }
.kb-card-link { display: grid; grid-template-rows: auto auto 1fr auto; gap: 10px; height: 100%; padding: 10px 10px 12px; border-radius: var(--kb-r); background: var(--kb-card); box-shadow: 0 1px 0 var(--kb-line); }
.kb-card-link:hover { box-shadow: 0 0 0 2px var(--kb-accent); }
.kb-card-link img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 8px; background: var(--kb-line); }
.kb-card-title { font-family: var(--kb-display); font-weight: 700; font-size: 1.05rem; line-height: 1.3; }
.kb-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.kb-card-id { font-size: .8rem; font-weight: 700; color: var(--kb-soft); }

/* ---------- 首页头条：置顶卡 ---------- */
.kb-pinned-link { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); overflow: hidden; border-radius: 16px; background: var(--kb-card); box-shadow: 0 1px 0 var(--kb-line); border-top: 6px solid var(--kb-accent); }
.kb-pinned-link img { display: block; width: 100%; height: 100%; aspect-ratio: 8 / 3; object-fit: cover; background: var(--kb-line); }
.kb-pinned-body { display: grid; gap: 14px; align-content: center; padding: 24px 28px; }
.kb-pinned-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.kb-flag { padding: 3px 10px; border-radius: 999px; background: #fde4d6; color: #8a2c08; font-size: .78rem; font-weight: 700; }
.kb-pinned-title { font-family: var(--kb-display); font-weight: 800; font-size: clamp(1.6rem, 2.6vw, 2.35rem); line-height: 1.12; letter-spacing: -.01em; }
.kb-pinned-link:hover .kb-pinned-title { color: var(--kb-accent); }
.kb-pinned-excerpt { color: var(--kb-soft); line-height: 1.6; }

/* ---------- 分类页：单条泳道里的任务卡 ---------- */
.kb-cat-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.kb-task { min-width: 0; }
.kb-task-link { display: grid; grid-template-rows: auto 1fr; height: 100%; overflow: hidden; border-radius: var(--kb-r); background: var(--kb-card); border-left: 6px solid var(--kb-tone); box-shadow: 0 1px 0 var(--kb-line); }
.kb-task-link:hover { box-shadow: 0 0 0 2px var(--kb-accent); }
.kb-task-link img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; background: var(--kb-line); }
.kb-task-text { display: grid; gap: 8px; align-content: start; padding: 12px 14px 14px; }
.kb-task-title { font-family: var(--kb-display); font-weight: 700; font-size: 1.12rem; line-height: 1.28; }
.kb-task-excerpt { color: var(--kb-soft); font-size: .94rem; line-height: 1.5; }
.kb-task-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.kb-cat-list > .kb-ad { margin: 12px 0; }
.kb-cat-list > .kb-ad:not(:has(.ad)) { display: none; }

/* ---------- 泳道索引 ---------- */
.kb-board-title { margin: 8px 0 20px; font-family: var(--kb-display); font-weight: 800; font-size: clamp(2rem, 4vw, 2.8rem); letter-spacing: -.02em; }
.kb-lane-index { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.kb-lane-tile { display: grid; gap: 10px; align-content: start; padding: 12px; border-radius: 16px; background: var(--kb-lane); }
.kb-lane-tile-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.kb-lane-tile-head .kb-label { font-size: .9rem; padding: 4px 12px; }
.kb-lane-open { font-weight: 700; color: var(--kb-soft); }
.kb-lane-tile-card { padding: 12px; border-radius: var(--kb-r); background: var(--kb-card); box-shadow: 0 1px 0 var(--kb-line); font-size: .92rem; line-height: 1.45; color: var(--kb-soft); }
.kb-lane-tile:hover .kb-lane-tile-card { box-shadow: 0 0 0 2px var(--kb-accent); }

/* ---------- 广告壳：无广告时塌陷 ---------- */
.kb-ad:has(.ad) { margin: 24px 0; }
.kb-ad:has(.ad) .ad { min-height: 250px; margin: 0 !important; }

/* ---------- 页脚：已完成泳道 ---------- */
.kb-footer { max-width: 1360px; margin: 0 auto; padding: 8px 24px 96px; }
.kb-footer-lane { padding: 12px; border-radius: 16px; background: var(--kb-lane); }
.kb-footer-head { display: flex; align-items: center; gap: 10px; margin: 2px 4px 12px; font-family: var(--kb-display); font-weight: 800; font-size: 1.05rem; }
.kb-footer-cards { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.kb-footer-card { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 8px 12px; border-radius: 10px; background: var(--kb-card); font-weight: 700; color: var(--kb-soft); box-shadow: 0 1px 0 var(--kb-line); }
.kb-footer-card:hover { color: var(--kb-accent); }
.kb-check { flex: none; width: 18px; height: 18px; border-radius: 50%; background: #15803d; box-shadow: inset 0 0 0 4px #15803d, inset 0 0 0 6px #fff; }
.kb-footer-owner { margin: 12px 4px 0; font-size: .85rem; color: var(--kb-soft); }

/* ---------- 共享页面调色 ---------- */
.theme-kanban .site-menu, .theme-kanban .site-search, .theme-kanban .static-page { --menu-accent: var(--kb-accent); }

/* ---------- 断点 ---------- */
@media (min-width: 1600px) {
    .kb-board-inner, .kb-topbar-inner, .kb-footer { max-width: 1560px; }
    .kb-lane-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

@media (max-width: 1023px) {
    .kb-pinned-link { grid-template-columns: minmax(0, 1fr); }
    .kb-pinned-link img { aspect-ratio: 16 / 7; }
    .kb-lane-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .kb-task-excerpt { display: none; }
    .kb-footer-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
    .kb-topbar-inner { min-height: 56px; padding: 4px 12px; gap: 10px; }
    .kb-workspace-icon { padding: 5px; grid-template-columns: repeat(3, 6px); }
    .kb-workspace-name { font-size: 1.2rem; }
    .kb-menu-toggle { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 8px; background: rgba(255, 255, 255, .12); }
    .kb-board-inner { padding: 12px 10px 0; }
    .kb-pinned-link img { aspect-ratio: 16 / 9; }
    .kb-pinned-body { padding: 14px; gap: 10px; }
    .kb-pinned-title { font-size: 1.45rem; }
    .kb-pinned-excerpt { display: none; }
    .kb-lane { padding: 8px; }
    .kb-lane-three, .kb-lane-grid { grid-template-columns: minmax(0, 1fr); gap: 8px; }
    .kb-card-link { grid-template-columns: 104px minmax(0, 1fr); grid-template-rows: auto 1fr auto; gap: 6px 12px; padding: 8px; }
    .kb-card-link img { grid-row: 1 / span 3; height: 100%; aspect-ratio: auto; min-height: 80px; }
    .kb-card-title { font-size: 1rem; }
    .kb-cat-list { grid-template-columns: minmax(0, 1fr); gap: 8px; }
    .kb-task-link { grid-template-columns: 96px minmax(0, 1fr); grid-template-rows: auto; border-left-width: 4px; }
    .kb-task-link img { width: 96px; height: 100%; min-height: 96px; aspect-ratio: auto; }
    .kb-task-text { padding: 10px 12px; gap: 6px; }
    .kb-task-title { font-size: 1rem; }
    .kb-lane-index { grid-template-columns: minmax(0, 1fr); }
    .kb-footer { padding: 8px 10px 96px; }
    .kb-footer-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* 移动端：泳道导航只在 /menu 出现，隐藏规则放在全局规则之后 */
@media (max-width: 767px) {
    .kb-tabs { display: none; }
}
