/* Plan axis v4 — A区（上）：甘特图时间轴；B区（下）：学习任务。两个固定高度面板。 */
.main.plan-mode { overflow: hidden; min-width: 0; padding: 24px 28px; }
.main.plan-mode #view-root { flex: 1; min-height: 0; height: 100%; }
.pa-split {
  display: grid;
  grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px;
  height: 100%;
  min-height: 0;
  color: var(--text);
  font-variant-numeric: tabular-nums;
  --pa-rule: color-mix(in srgb, var(--text) 12%, transparent);
  --pa-faint: color-mix(in srgb, var(--text) 5%, transparent);
}
.pa-panel {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 2px;
  background: var(--card-bg);
}
.pa-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: 0 0 40px;
  min-width: 0;
  padding: 0 18px;
  gap: 12px;
  border-bottom: 1px solid var(--border);
}
.pa-heading, .pa-tools { display: flex; align-items: center; gap: 12px; min-width: 0; }
.pa-heading h2 { margin: 0; font-size: 14px; font-weight: 650; white-space: nowrap; text-wrap: balance; }
.pa-tools { gap: 8px; flex-shrink: 0; }
.pa-density { display: flex; align-items: center; }
.pa-density button, .pa-today-btn {
  padding: 2px 4px;
  font-size: 11px;
  color: var(--sub);
  border-radius: 1px;
  transition: color .15s ease;
}
/* 下划线挂在标签自己的 span 上：触屏下 button 会被 base.css 的 pointer:coarse
   抬到 44px 高，直接给 button 画 inset 底边会落到按钮盒底边，离文字 14–16px。 */
.pa-density button > span, .pa-today-btn > span { display: inline-block; padding-bottom: 1px; }
.pa-panel button:hover:not(:disabled) { color: var(--text); background: transparent; }
.pa-density button[aria-pressed="true"] { color: var(--text); }
.pa-density button[aria-pressed="true"] > span { box-shadow: inset 0 -2px var(--text); }
.pa-today-btn > span { box-shadow: inset 0 -2px var(--text); }
.pa-panel button:disabled { opacity: .35; cursor: default; }
.pa-panel button:disabled:active { transform: none; }
.pa-panel :focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }

/* A single scroll canvas owns every bar, connector, tick and date coordinate.
   只允许左右滑：纵向一律 hidden（泳道行距由 fitRow 压到装得下），
   触屏用 pan-x 锁死，斜着划也不会把时间轴顶去上下。 */
.pa-timeline-scroll {
  flex: 1;
  min-height: 0;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  touch-action: pan-x;
  cursor: grab;
  scrollbar-width: none;
}
.pa-timeline-scroll::-webkit-scrollbar { display: none; }
/* 极矮视口（横屏手机）下泳道实在装不下时才放开纵向，避免被 hidden 裁掉 */
.pa-timeline-scroll.is-overflow-y { overflow-y: auto; touch-action: pan-x pan-y; }
.pa-timeline-scroll.is-panning { cursor: grabbing; }
/* A single scroll canvas owns every bar, connector, tick and date coordinate.
   点状网格底纹：横向与日期列对齐（随密度变化），纵向与泳道行距一致。 */
.pa-canvas {
  height: 100%;
  position: relative;
  isolation: isolate;
  background-image: radial-gradient(circle, color-mix(in srgb, var(--sub) 28%, transparent) 1px, transparent 1.4px);
  background-size: var(--pa-dot-size, 56px) var(--pa-dot-row, 28px);
  background-position: 0 6px;
}
.pa-lanes { position: absolute; left: 0; right: 0; }
.pa-lanes-top { top: 0; bottom: 50%; }
.pa-lanes-bottom { top: 50%; bottom: 0; }
.pa-axis { position: absolute; top: 50%; left: 0; right: 0; height: 0; z-index: 2; }
.pa-axis::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  transform: translateY(-50%);
  background: color-mix(in srgb, var(--sub) 50%, transparent);
}
.pa-tick { position: absolute; top: 0; }
.pa-tick > i { position: absolute; width: 6px; height: 6px; border: 1px solid var(--sub); background: var(--card-bg); border-radius: 50%; transform: translate(-50%, -50%); }
.pa-tick > span {
  position: absolute;
  top: 3px;
  left: 0;
  transform: translateX(-50%);
  padding: 1px 5px;
  color: var(--sub);
  background: var(--card-bg);
  font-size: 10px;
  line-height: 14px;
  white-space: nowrap;
}
.pa-tick.is-today { z-index: 4; }
.pa-tick.is-today > i { background: var(--accent-orange); border-color: var(--accent-orange); width: 8px; height: 8px; }
.pa-tick.is-today > span { color: var(--text); box-shadow: inset 0 -1px var(--accent-orange); }
.pa-start-dot { position: absolute; top: 0; width: 6px; height: 6px; border-radius: 50%; background: var(--pa-deep); transform: translate(-50%, -50%); }
/* 柱条到中轴的距离 = 22px 起跳 + 泳道字号 × 行距；行距是 --pa-row（fitRow 会压），
   所以这里不能再写死 px，否则压缩后柱条会跑到轴线下方/卡到顶。 */
.pa-gantt-item { position: absolute; height: 22px; --pa-offset: calc(22px + var(--pa-lane, 0) * var(--pa-row, 32px)); }
.pa-lanes-top .pa-gantt-item { bottom: var(--pa-offset); }
.pa-lanes-bottom .pa-gantt-item { top: var(--pa-offset); }
.pa-connector { position: absolute; left: 0; width: 1px; height: var(--pa-offset); background: var(--pa-deep); opacity: .35; pointer-events: none; }
.pa-lanes-top .pa-connector { top: 100%; }
.pa-lanes-bottom .pa-connector { bottom: 100%; }
.pa-bar {
  position: relative;
  z-index: 3;
  height: 22px;
  width: 100%;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 0 9px;
  border-radius: 2px;
  background: var(--pa-light);
  color: #17202b;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--pa-deep) 20%, transparent), 0 1px 2px rgb(0 0 0 / 5%);
  overflow: clip;
  cursor: inherit;
  transition: box-shadow .15s ease, filter .15s ease;
}
.pa-bar > span { position: sticky; left: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; font-weight: 550; }
.pa-bar-dot { width: 5px; height: 5px; flex: 0 0 5px; border-radius: 50%; background: var(--pa-deep); }
.pa-bar:hover, .pa-bar:focus-visible { z-index: 5; filter: brightness(1.035); box-shadow: inset 0 0 0 1px var(--pa-deep), 0 2px 5px rgb(0 0 0 / 10%); }
.pa-month-rule { position: absolute; top: 0; bottom: 0; border-left: 1px dashed var(--pa-rule); pointer-events: none; z-index: -1; }
.pa-now { position: absolute; top: 0; bottom: 0; width: 1px; background: repeating-linear-gradient(to bottom, var(--accent-orange) 0 4px, transparent 4px 9px); opacity: .8; pointer-events: none; z-index: 1; }
.pa-tooltip {
  position: fixed;
  z-index: 100;
  max-width: min(420px, calc(100vw - 16px));
  padding: 10px 13px;
  background: var(--text);
  color: var(--card-bg);
  border-radius: 3px;
  box-shadow: 0 4px 16px rgb(0 0 0 / 16%);
  font-size: 12px;
  line-height: 1.7;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  pointer-events: none;
}
.pa-tooltip[hidden] { display: none; }

/* Six equal columns, never a second timeline or a derived progress dashboard. */
/* B区：两行三列。两组（周一～三 / 周四～六）各自绑定高度（各占面板一半，随窗口自适应）：
   组内最高的一列占满；任务超过组高（约 5–6 条）的那一列单独内部滚动，其余列完整展示。
   下排三列固定 2px 深色顶部横线，上排不加；六个日块相互独立成卡片，不共用分隔线。 */
.pa-days-scroll { flex: 1; min-height: 0; overflow: hidden; overscroll-behavior: contain; }
.pa-days { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 12px; height: 100%; }
.pa-day { display: flex; flex-direction: column; min-height: 0; min-width: 0; overflow: hidden; border: 1px solid var(--border); border-radius: 2px; }
.pa-day-head { display: flex; align-items: center; justify-content: center; flex: 0 0 64px; padding: 0 14px; gap: 7px; border-bottom: 1px solid var(--pa-faint); box-shadow: inset 0 2px transparent; }
.pa-day-date { font-size: 13px; font-weight: 600; letter-spacing: .01em; }
.pa-day-cn { font-size: 11px; color: var(--sub); }
.pa-day-scroll { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: var(--pa-rule) transparent; }
.pa-day-tasks { list-style: none; margin: 0; padding: 10px; display: flex; flex-direction: column; gap: 6px; }
.pa-day-task { position: relative; display: flex; align-items: baseline; padding: 8px 10px; background: var(--card-bg); border: 1px solid var(--pa-rule); border-radius: 3px; transition: border-color .15s ease, background-color .15s ease; }
.pa-day-task:hover { border-color: color-mix(in srgb, var(--text) 26%, transparent); background: var(--hover); }
.pa-task-text { min-width: 0; font-size: 12px; line-height: 1.7; overflow-wrap: anywhere; text-wrap: pretty; user-select: text; }
.pa-day-empty { padding: 24px 12px; display: flex; flex-direction: column; align-items: center; gap: 8px; color: var(--sub); font-size: 11px; }
.pa-day-empty > span { opacity: .5; font-size: 20px; }
.pa-message { display: flex; flex: 1; flex-direction: column; justify-content: center; align-items: center; gap: 8px; padding: 16px; min-height: 0; overflow: auto; font-size: 12px; color: var(--sub); text-align: center; }
.pa-message strong { color: var(--text); font-weight: 500; }
.pa-message.is-error strong { color: var(--red-500); }
.pa-message small { font-size: 10px; }
/* Weekly panel strictly follows the Notion ultra-minimal reference (light & dark tokens copied from it). */
#pa-weekly {
  --nw-text: #37352f; --nw-sub: #9b9a97; --nw-border: #e9e9e7; --nw-faint: #f2f1ee;
  --nw-col: #ffffff; --nw-col-today: #fcfcfa;
  --nw-hover-bg: #faf9f6; --nw-hover-border: #d3d3d0; --nw-indicator: #37352f;
  --nw-accent: #d9730d; --nw-accent-bg: #fbf3db; --nw-accent-border: #f4e0b9;
  --nw-soft: #f7f7f5;
  --nw-tag-text: #575653; --nw-tag-bg: #f2f1ee; --nw-tag-border: #e3e2de;
  color: var(--nw-text);
}
/* B区不再有外层容器：.pa-panel 的边框、白底、圆角全部显式归零，六张日卡片直接落在页面上。 */
#pa-weekly { background: transparent; border: 0; border-radius: 0; }
html[data-theme="dark"] #pa-weekly {
  --nw-text: #d4d4d4; --nw-sub: #8c8c8c; --nw-border: #2e2e2e; --nw-faint: #252525;
  --nw-col: #1c1c1c; --nw-col-today: #222222;
  --nw-hover-bg: #2a2a2a; --nw-hover-border: #4e4e4e; --nw-indicator: #ffffff;
  --nw-accent: #e28c38; --nw-accent-bg: #36271a; --nw-accent-border: #523a25;
  --nw-soft: #252525;
  --nw-tag-text: #a0a0a0; --nw-tag-bg: #2e2e2e; --nw-tag-border: #383838;
}
#pa-weekly .pa-day { position: relative; background: var(--nw-col); border-color: var(--nw-border); box-shadow: 0 1px 3px rgb(0 0 0 / 5%); }
#pa-weekly .pa-day-head { flex-basis: auto; padding: 6px 12px 4px; border-bottom-color: var(--nw-faint); }
#pa-weekly .pa-day-date { font-size: 13px; font-weight: 650; color: var(--nw-text); letter-spacing: 0; }
#pa-weekly .pa-day-cn { font-size: 11px; color: var(--nw-sub); }
#pa-weekly .pa-day.is-today { background: var(--nw-col-today); }
#pa-weekly .pa-day.is-today .pa-day-head { box-shadow: none; background: transparent; }
/* 今日徽标：黑底白字小按钮（深色模式反色）；顶部 2px 深色横线的样式用在下排三列的顶部。 */
#pa-weekly .pa-day-today-label { padding: 2px 8px; border-radius: 3px; background: var(--nw-indicator); color: var(--nw-col); font-size: 10px; line-height: 1.4; font-weight: 550; }
#pa-weekly .pa-day:nth-child(n+4) { border-top: 2px solid var(--nw-indicator); }
#pa-weekly .pa-day.is-today .pa-day-cn { color: var(--nw-text); font-weight: 650; }
#pa-weekly .pa-day-scroll { overflow-y: auto; scrollbar-width: thin; scrollbar-color: var(--nw-faint) transparent; }
#pa-weekly .pa-day-tasks { padding: 8px; gap: 4px; }
#pa-weekly .pa-day-task {
  display: flex; align-items: center; justify-content: space-between; gap: 6px;
  padding: 3px 8px;
  background: var(--nw-col);
  border: 1px solid var(--nw-border);
  border-radius: 2px;
  box-shadow: 0 1px 1px rgb(0 0 0 / 3%);
}
#pa-weekly .pa-day-task:hover { border-color: var(--nw-hover-border); background: var(--nw-hover-bg); }
#pa-weekly .pa-task-text { font-size: 12px; line-height: 1.5; font-weight: 550; color: var(--nw-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#pa-weekly .pa-task-main { display: flex; align-items: center; gap: 6px; min-width: 0; flex: 1; }
#pa-weekly .pa-task-subject { flex-shrink: 0; max-width: 88px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; line-height: 1.4; font-weight: 500; color: var(--nw-tag-text); background: var(--nw-tag-bg); border: 1px solid var(--nw-tag-border); border-radius: 3px; padding: 1px 6px; }
#pa-weekly .pa-task-meta { flex-shrink: 0; font-size: 10px; color: var(--nw-sub); }
#pa-weekly .pa-day-empty { color: var(--nw-sub); }
#pa-weekly .pa-message { color: var(--nw-sub); }
#pa-weekly .pa-message strong { color: var(--nw-text); }

/* Other views reuse these pre-existing empty-state classes. */
.plan-empty, .plan-axis-empty { padding: 28px; color: var(--sub); font-size: 13px; text-align: center; }

@media (max-width: 1200px) {
  .main.plan-mode { padding: 20px; }
  .pa-head { padding: 0 12px; }
}
@media (max-width: 900px) {
  .main.plan-mode, .shell.rail-collapsed .main.plan-mode { width: 100%; padding: 60px 12px 12px; }
  .pa-split { gap: 12px; }

  /* 手机：B区六天改竖排，一天一行。
     三列时每列只有 114px，任务标题全被挤没（实测「思想政治理论·马克思主义基本原理」
     只剩「思想政治理论20」）；竖排后每张卡占满宽度，六天往下滑看。 */
  .pa-days-scroll { overflow-x: hidden; overflow-y: auto; overscroll-behavior-y: contain; touch-action: pan-y; }
  .pa-days { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; grid-auto-rows: auto; height: auto; gap: 10px; }
  /* 一行就是整张卡：不再需要卡内二级滚动，任务有多少就长多高，滑动交给外层 */
  .pa-day, #pa-weekly .pa-day { overflow: visible; }
  .pa-day-scroll, #pa-weekly .pa-day-scroll { overflow: visible; }
  /* 2px 深色顶线是「下排三列」的分组记号，竖排后不存在上下排 */
  #pa-weekly .pa-day:nth-child(n+4) { border-top: 1px solid var(--nw-border); }
}
@media (max-width: 600px) {
  .pa-head { flex-basis: 40px; padding: 0 8px; gap: 4px; }
  .pa-heading { gap: 6px; }
  .pa-heading h2 { font-size: 12px; }
  .pa-tools { gap: 0; }
  .pa-density button, .pa-today-btn { padding: 0 5px; font-size: 10px; }
}
@media (max-height: 600px) {
  .main.plan-mode { padding-top: 12px; padding-bottom: 12px; }
  .pa-head { flex-basis: 36px; }
  #pa-weekly .pa-day-head { padding: 4px 12px; }
  .pa-day-head { flex-basis: 40px; }
  .pa-day-date { font-size: 12px; }
}
@media (max-height: 600px) and (max-width: 900px) {
  .main.plan-mode, .shell.rail-collapsed .main.plan-mode { padding-top: 58px; padding-bottom: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .pa-panel button, .pa-bar { transition: none; }
}