/* ============================================================
   登山計畫書產生器（page-hiking-plan-generator.hbs）
   整頁是砂岩色的桌面上一疊 A4：左邊設定、右邊紙。紙上的欄位直接填，
   印出來就是那份計畫書（@media print 在檔尾）。只有這一頁載。
   1rem = 10px（全站 html 62.5%），這裡一律寫 px。
   ============================================================ */

.sy-plan {
  --plan-rail: 300px;
  --plan-sheet: 880px;
  --plan-pad: clamp(20px, 4.4vw, 60px);
  background: var(--sy-paper);
  color: var(--sy-ink);
}

.sy-plan ::selection { background: var(--sy-terracotta-tint); color: var(--sy-ink); }
.sy-plan input, .sy-plan select, .sy-plan textarea { caret-color: var(--sy-terracotta-text); }

.sy-plan__wrap {
  width: 100%;
  max-width: var(--sy-page-max);
  margin: 0 auto;
  padding: 0 var(--sy-gutter);
}

/* ── 頁首 ── */
.sy-plan__head { padding: clamp(24px, 3vw, 40px) 0 clamp(24px, 2.6vw, 36px); }
.sy-plan__head-in {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0 40px;
}
.sy-plan__title {
  margin: 0;
  font-family: var(--sy-font-display);
  font-weight: 900;
  font-size: var(--sy-text-3xl);
  line-height: 1.2;
  letter-spacing: -0.01em;
  word-break: keep-all;
  overflow-wrap: anywhere;
  text-wrap: balance;
}
.sy-plan__title-pre {
  display: block;
  margin-bottom: 6px;
  font-size: 0.42em;
  letter-spacing: 0.08em;
  color: var(--sy-terracotta-text);
}
.sy-plan__lede {
  max-width: 640px;
  margin: 16px 0 0;
  font-size: clamp(17px, 0.5vw + 15px, 20px);
  line-height: 1.75;
  color: var(--sy-ink-2);
}
.sy-plan__lede-note { color: var(--sy-muted); }
.sy-plan__lede-end { display: none; }
@media (min-width: 761px) {
  .sy-plan.has-route .sy-plan__head { padding: 16px 0 18px; }
  .sy-plan.has-route .sy-plan__title { font-size: clamp(28px, 1.4vw + 16px, 36px); }
  .sy-plan.has-route .sy-crumb { margin-bottom: 6px; }
  .sy-plan.has-route .sy-plan__lede { font-size: 15px; }
}

@media (min-width: 1100px) {
  .sy-plan__head-in { grid-template-columns: auto minmax(0, 1fr); align-items: end; }
  .sy-plan__head-in .sy-crumb { grid-column: 1 / -1; }
  .sy-plan__title { grid-column: 1; }
  .sy-plan__lede { grid-column: 2; max-width: 600px; margin: 0 0 6px; justify-self: end; font-size: 17px; }
  .sy-plan.is-share .sy-plan__lede { grid-column: 1 / -1; }
}

/* ── 桌面：砂岩色整塊區域，上下各一條墨線／細線 ── */
.sy-plan__desk {
  background: var(--sy-sand);
  border-top: 1px solid var(--sy-ink);
  padding: clamp(20px, 3vw, 48px) 0 clamp(48px, 6vw, 96px);
}
.sy-plan__desk-in {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
}
@media (min-width: 1100px) {
  .sy-plan__desk-in { grid-template-columns: var(--plan-rail) minmax(0, 1fr); gap: 40px; align-items: start; }
  .sy-plan__rail {
    position: sticky;
    top: calc(var(--header-h) + 20px);
    max-height: calc(100vh - var(--header-h) - 40px);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: var(--sy-line-strong) transparent;
  }
  .sy-plan.is-share .sy-plan__desk-in { grid-template-columns: minmax(0, 1fr); }
  .sy-plan.is-share .sy-plan__main { margin: 0 auto; }
}
.sy-plan.is-share .sy-plan__rail, .sy-plan.is-share .sy-plan__bar, .sy-plan.is-share .sy-plan__tools { display: none; }
.sy-plan__rail.is-pending { min-height: 760px; }
.sy-sheet--pending { min-height: 1400px; }
@media (max-width: 760px) {
  .sy-plan__rail.is-pending { min-height: 150px; }
  .sy-sheet--pending { min-height: 1200px; }
}
.sy-plan__bar { display: none; }

/* ══════════════════════════════════════════════════════════════
   左欄（設定）
   ══════════════════════════════════════════════════════════════ */
.sy-rail__sec { padding: 18px 0 20px; border-top: 1px solid var(--sy-line-strong); }
.sy-rail__sec:first-child { border-top: 0; padding-top: 0; }
.sy-rail__h {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  font: 700 15px/1.4 var(--sy-font-text);
  letter-spacing: 0.04em;
  color: var(--sy-ink);
}
.sy-rail__h::before {
  content: "";
  width: 9px; height: 8px;
  background: var(--sy-terracotta);
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}

.sy-rail__route {
  display: grid;
  gap: 4px;
  width: 100%;
  padding: 14px 16px 12px;
  border: 1px solid var(--sy-line-strong);
  border-radius: var(--sy-radius);
  background: var(--sy-surface);
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: border-color var(--sy-dur-1) ease, background-color var(--sy-dur-1) ease;
}
.sy-rail__route:hover { border-color: var(--sy-terracotta-text); background: var(--sy-terracotta-wash); }
.sy-rail__route:focus-visible { outline: 2px solid var(--sy-terracotta-text); outline-offset: 2px; }
.sy-rail__route-name { font: 700 20px/1.35 var(--sy-font-text); }
.sy-rail__route-meta { font-size: 14px; line-height: 1.55; color: var(--sy-ink-3); }
.sy-rail__route-num { font: 500 15px/1.4 var(--sy-font-data); letter-spacing: 0.02em; font-variant-numeric: tabular-nums; color: var(--sy-ink-2); }
.sy-rail__route-swap {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 6px;
  font-size: 14px; font-weight: 700; color: var(--sy-terracotta-text);
}
.sy-rail__route-swap .sy-icon { width: 16px; height: 16px; }

.sy-rail__grid { display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: end; }
.sy-rail__field { display: grid; gap: 6px; min-width: 0; }
.sy-rail__field--row { grid-template-columns: auto 1fr; align-items: center; gap: 12px; }
.sy-rail__label { font-size: 13px; font-weight: 700; color: var(--sy-ink-3); letter-spacing: 0.02em; }
.sy-rail__hint { margin: 8px 0 0; font-size: 13px; line-height: 1.6; color: var(--sy-muted); }
.sy-rail__hint a { color: var(--sy-terracotta-deep); }

/* 輸入框：細框膠囊感但仍是表單（工具元件克制、44px 觸控） */
.sy-plan input[type="date"], .sy-plan input[type="time"], .sy-plan select,
.sy-rail input, .sy-search input, .sy-share__url input {
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid var(--sy-line-strong);
  border-radius: var(--sy-radius);
  background: var(--sy-surface);
  color: var(--sy-ink);
  font: 500 16px/1 var(--sy-font-data);
  letter-spacing: 0.02em;
  font-variant-numeric: tabular-nums lining-nums;
  width: 100%;
}
.sy-plan select { padding-right: 32px; appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235C5751' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 10px center; background-size: 16px;
  font-family: var(--sy-font-digits); }
.sy-plan input:focus-visible, .sy-plan select:focus-visible, .sy-plan textarea:focus-visible,
.sy-plan-dialog input:focus-visible {
  outline: 2px solid var(--sy-terracotta-text);
  outline-offset: 1px;
  border-color: var(--sy-terracotta-text);
}

.sy-stepper {
  display: inline-grid;
  grid-template-columns: 44px auto 44px;
  align-items: center;
  border: 1px solid var(--sy-line-strong);
  border-radius: var(--sy-radius);
  background: var(--sy-surface);
  height: 44px;
}
.sy-stepper button {
  display: grid; place-items: center;
  width: 44px; height: 42px;
  border: 0; background: none; color: var(--sy-ink-2); cursor: pointer;
  border-radius: var(--sy-radius);
}
.sy-stepper button:hover:not(:disabled) { color: var(--sy-terracotta-text); background: var(--sy-terracotta-wash); }
.sy-stepper button:disabled { color: var(--sy-line-strong); cursor: default; }
.sy-stepper button:focus-visible { outline: 2px solid var(--sy-terracotta-text); outline-offset: -2px; }
.sy-stepper .sy-icon { width: 18px; height: 18px; }
.sy-stepper__val { min-width: 52px; text-align: center; font: 600 20px/1 var(--sy-font-data); font-variant-numeric: tabular-nums; }
.sy-stepper__val i { font-style: normal; font: 500 13px var(--sy-font-text); color: var(--sy-muted); }

.sy-rail__pace { margin: 16px 0 0; padding: 0; border: 0; }
.sy-rail__pace legend { margin-bottom: 6px; padding: 0; }
.sy-seg {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border: 1px solid var(--sy-line-strong);
  border-radius: var(--sy-radius);
  background: var(--sy-surface);
  overflow: hidden;
}
.sy-seg button {
  display: grid;
  gap: 2px;
  justify-items: center;
  min-height: 52px;
  padding: 6px 2px;
  border: 0;
  border-left: 1px solid var(--sy-line);
  background: none;
  color: var(--sy-ink-2);
  font: inherit;
  cursor: pointer;
  transition: background-color var(--sy-dur-1) ease, color var(--sy-dur-1) ease;
}
.sy-seg button:first-child { border-left: 0; }
.sy-seg b { font-size: 15px; }
.sy-seg i { font: 500 13px/1 var(--sy-font-data); font-style: normal; letter-spacing: 0.02em; color: var(--sy-muted); }
.sy-seg button:hover { background: var(--sy-terracotta-wash); }
.sy-seg button[aria-pressed="true"] { background: var(--sy-ink); color: var(--sy-paper); }
.sy-seg button[aria-pressed="true"] i { color: var(--sy-on-dusk-muted); }
.sy-seg button:focus-visible { outline: 2px solid var(--sy-terracotta-text); outline-offset: -3px; }

.sy-rail__days { display: grid; gap: 8px; margin-top: 16px; }
.sy-rail__day {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 6px 8px;
  padding-top: 10px;
  border-top: 1px solid var(--sy-line);
}
.sy-rail__day:first-child { border-top: 0; padding-top: 0; }
.sy-rail__dayhead { grid-column: 1 / -1; display: flex; align-items: baseline; gap: 8px; margin: 0; }
.sy-rail__dayend { margin-left: auto; font-size: 12px; color: var(--sy-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 12em; }
.sy-rail__dayn { font: 600 18px/1 var(--sy-font-data); color: var(--sy-terracotta-text); }
.sy-rail__daydate { font-size: 13px; color: var(--sy-ink-3); white-space: nowrap; }
.sy-rail__field--time input, .sy-rail__field--pace select { padding: 0 8px; font-size: 15px; }
.sy-rail__field--pace select { padding-right: 26px; background-position: right 6px center; }

.sy-rail__alert { margin: 12px 0 0; font-size: 15px; line-height: 1.6; color: var(--sy-ink-2); }
.sy-rail__alert-time {
  display: block;
  font: 600 26px/1.2 var(--sy-font-data);
  letter-spacing: 0.01em;
  font-variant-numeric: tabular-nums;
  color: var(--sy-ink);
}

.sy-rail__out { display: grid; gap: 10px; }
.sy-rail__out .sy-btn { width: 100%; justify-content: flex-start; padding: 0 20px; }
.sy-rail__privacy { margin: 4px 0 0; font-size: 13px; line-height: 1.6; color: var(--sy-muted); }
.sy-rail__flash { margin: 10px 0 0; font-size: 14px; line-height: 1.6; color: var(--sy-terracotta-deep); }

.sy-plan__textbtn, .sy-plan__textlink {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  padding: 0;
  border: 0;
  background: none;
  color: var(--sy-terracotta-deep);
  font: 700 15px/1.4 var(--sy-font-text);
  text-decoration: underline;
  text-decoration-color: var(--sy-terracotta-tint);
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
  cursor: pointer;
}
.sy-plan__textbtn:hover, .sy-plan__textlink:hover { text-decoration-color: currentColor; }
.sy-plan__textbtn .sy-icon, .sy-plan__textlink .sy-icon { width: 17px; height: 17px; }
.sy-rail__privacy .sy-plan__textbtn { min-height: 0; font-size: 13px; }

/* ── 紙上方的工具列：桌機跟著捲，主要動作永遠看得到 ── */
.sy-plan__tools:empty { display: none; }
.sy-plan__tools {
  position: sticky;
  top: var(--header-h);
  z-index: 6;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
  padding: 10px 0;
  background: var(--sy-sand);
  border-bottom: 1px solid var(--sy-line-strong);
}
/* 通報晶片：計畫書最重要的一個時間，捲到哪都在視線內 */
.sy-tools__alert, .sy-plan__bar-alert {
  display: inline-flex; align-items: baseline; gap: 10px;
  margin: 0; padding: 8px 14px 7px;
  background: var(--sy-dusk); color: var(--sy-on-dusk-muted);
  border-radius: var(--sy-radius);
  font-size: 13px; letter-spacing: 0.04em; white-space: nowrap;
}
.sy-tools__alert b, .sy-plan__bar-alert b { font: 600 20px/1 var(--sy-font-data); letter-spacing: 0.01em; color: var(--sy-on-dusk-accent); font-variant-numeric: tabular-nums; }
.sy-plan__bar-alert { display: none; }
.sy-tools__acts { display: flex; align-items: center; gap: 10px; }
.sy-tools__acts .sy-plan__textbtn { min-height: 44px; margin-right: 6px; }

/* ── 手機：時間設定可以收起來 ── */
.sy-rail__summary { display: none; }
.sy-rail__csv { display: none; }
.sy-rail__misc { padding-top: 10px; }
.sy-rail__more > .sy-rail__sec:first-of-type { border-top: 1px solid var(--sy-line-strong); }

/* ══════════════════════════════════════════════════════════════
   紙
   ══════════════════════════════════════════════════════════════ */
.sy-plan__main { min-width: 0; max-width: var(--plan-sheet); }
.sy-plan__stack {
  display: grid;
  gap: clamp(16px, 2.4vw, 32px);
  min-width: 0;
  max-width: var(--plan-sheet);
  counter-reset: sheet;
}
.sy-sheet {
  position: relative;
  min-width: 0;
  padding: var(--plan-pad);
  padding-bottom: calc(var(--plan-pad) * 0.7);
  background: var(--sy-surface);
  border-radius: var(--sy-radius-sm);
  /* 紙放在桌上：很淡的暖色落影，第一層帶赭紅暈（DESIGN：Warm-Shadow Rule） */
  box-shadow: 0 1px 2px rgba(154, 62, 34, 0.08), 0 18px 40px -26px rgba(154, 62, 34, 0.32);
}
.sy-sheet--note { padding: 24px; font-size: 16px; line-height: 1.7; }

.sy-sheet__foot {
  display: flex;
  justify-content: space-between;
  margin-top: 36px;
  padding-top: 10px;
  border-top: 1px solid var(--sy-line);
  font-size: 12px;
  color: var(--sy-muted);
  letter-spacing: 0.04em;
}
.sy-sheet__page { font-family: var(--sy-font-data); font-weight: 600; letter-spacing: 0.06em; }
.sy-sheet__footnote { display: block; margin-bottom: 4px; font: 700 14px/1.5 var(--sy-font-digits); color: var(--sy-ink); letter-spacing: 0.02em; }
.sy-sheet__safety { margin: 28px 0 0; font-size: 13px; line-height: 1.7; color: var(--sy-ink-3); }
.sy-sheet__h { margin: 0; font: 700 clamp(22px, 1.2vw + 16px, 28px)/1.3 var(--sy-font-text); }
.sy-sheet__head--sm { margin-bottom: 20px; padding-bottom: 14px; border-bottom: 1px solid var(--sy-ink); }

/* ── 範例提示（第一次來、還沒選路線時攤開的那份） ── */
.sy-demo {
  display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px;
  margin: calc(var(--plan-pad) * -0.5) 0 28px;
  padding: 0 0 12px;
  border-bottom: 1px dashed var(--sy-line-strong);
  font-size: 15px; color: var(--sy-ink-2);
}
.sy-demo .sy-icon { width: 18px; height: 18px; color: var(--sy-terracotta-text); }
.sy-demo .sy-plan__textbtn { min-height: 36px; }

/* ── 封面 ── */
.sy-cover__titlewrap { display: block; }
.sy-cover__title {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0 0 4px;
  border: 0;
  border-bottom: 1px dashed transparent;
  background: none;
  color: var(--sy-ink);
  font-family: var(--sy-font-display);
  font-weight: 900;
  font-size: clamp(32px, 3.2vw + 14px, 56px);
  line-height: 1.2;
  letter-spacing: -0.01em;
  transition: border-color var(--sy-dur-1) ease;
}
.sy-cover__title::placeholder { color: var(--sy-ink); opacity: 1; }
.sy-cover__title:hover { border-bottom-color: var(--sy-line-strong); }
.sy-cover__title:focus { outline: none; border-bottom-color: var(--sy-terracotta-text); }
.sy-cover__title:focus::placeholder { color: var(--sy-line-strong); }
.sy-cover__route { margin: 10px 0 0; font-size: 16px; line-height: 1.6; color: var(--sy-ink-3); }

/* 數據圖例：小標在上、窄體數字在下，欄與欄之間一條細線 */
.sy-pfacts {
  display: grid;
  grid-template-columns: repeat(6, auto);
  justify-content: start;
  margin: 28px 0 0;
  padding: 14px 0 0;
  border-top: 1px solid var(--sy-ink);
}
.sy-fact { padding: 0 22px; border-left: 1px solid var(--sy-line); }
.sy-fact:first-child { padding-left: 0; border-left: 0; }
.sy-fact dt { font-size: 13px; color: var(--sy-muted); letter-spacing: 0.04em; }
.sy-fact dd { margin: 4px 0 0; white-space: nowrap; }
.sy-fact b { font: 600 clamp(20px, 0.8vw + 16px, 26px)/1.1 var(--sy-font-data); letter-spacing: 0.01em; font-variant-numeric: tabular-nums lining-nums; }
.sy-fact__u, .sy-fact__pre { font-style: normal; font-size: 13px; color: var(--sy-ink-3); margin-left: 3px; }
.sy-fact__pre { margin: 0 3px 0 0; }

/* ── 剖面 ── */
.sy-prof { margin: 26px 0 0; }
.sy-prof--route .sy-prof__plot { margin-top: 44px; }
.sy-prof__plot { position: relative; height: clamp(120px, 14vw, 176px); }
.sy-prof--day .sy-prof__plot { height: clamp(96px, 10vw, 128px); margin-top: 34px; }
.sy-prof__plot > svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.sy-prof__area { fill: var(--sy-terracotta-tint); }
.sy-prof__line { fill: none; stroke: var(--sy-terracotta); stroke-width: 2; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.sy-prof__grid { stroke: var(--sy-line-strong); stroke-width: 1; stroke-dasharray: 3 4; vector-effect: non-scaling-stroke; }
.sy-prof__daybound { stroke: var(--sy-ink); stroke-width: 1; stroke-dasharray: 2 3; vector-effect: non-scaling-stroke; opacity: 0.55; }
.sy-prof__tick {
  position: absolute; left: -10px; transform: translate(-100%, -50%);
  text-shadow: 0 0 2px var(--sy-surface), 0 0 4px var(--sy-surface);
  font: 500 12px/1 var(--sy-font-data); letter-spacing: 0.02em; color: var(--sy-muted);
}
.sy-prof__days { position: relative; height: 22px; margin-top: 6px; border-top: 1px solid var(--sy-ink); }
.sy-prof__day {
  position: absolute; top: 4px; transform: translateX(-50%);
  font: 600 14px/1 var(--sy-font-data); letter-spacing: 0.06em; color: var(--sy-ink-2);
}
.sy-prof__axis { display: flex; justify-content: space-between; margin-top: 2px; font: 500 13px/1.2 var(--sy-font-data); color: var(--sy-muted); }
.sy-prof--day .sy-prof__axis { border-top: 1px solid var(--sy-ink); padding-top: 4px; margin-top: 0; }

.sy-prof__tent {
  position: absolute;
  display: grid; justify-items: center;
  transform: translate(-50%, calc(-100% - 6px));
  color: var(--sy-terracotta-deep);
}
.sy-prof__tent .sy-icon { width: 18px; height: 18px; background: var(--sy-surface); border-radius: 50%; padding: 1px; }
.sy-prof__tent i {
  position: absolute; bottom: 100%; margin-bottom: 2px;
  font-style: normal; font-size: 12px; font-weight: 700; white-space: nowrap; color: var(--sy-ink-2);
  text-shadow: 0 0 2px var(--sy-surface), 0 0 2px var(--sy-surface), 0 0 4px var(--sy-surface), 0 0 6px var(--sy-surface);
}
.sy-prof__tent.is-l i { right: 50%; margin-right: 6px; }
.sy-prof__tent.is-r i { left: 50%; margin-left: 6px; }
.sy-prof__tent.is-below i { bottom: auto; top: 100%; margin-top: 8px; margin-bottom: 0; }
/* 最高點：三角形的尖端正好落在山頭上，數字寫在它旁邊 */
.sy-prof__spot { position: absolute; width: 0; height: 0; }
.sy-prof__spot-mark { position: absolute; left: -6px; bottom: 7px; width: 12px; height: 11px; fill: var(--sy-terracotta); }
.sy-prof__spot-t {
  position: absolute; left: 10px; bottom: 6px;
  white-space: nowrap; font-size: 14px; font-weight: 700; color: var(--sy-ink);
  text-shadow: 0 0 2px var(--sy-surface), 0 0 4px var(--sy-surface), 0 0 6px var(--sy-surface);
}
.sy-prof__spot.is-left .sy-prof__spot-t { left: auto; right: 10px; }
.sy-prof__spot-t b { font: 600 16px/1 var(--sy-font-data); letter-spacing: 0.01em; }
.sy-prof__spot-t i { font-style: normal; font-size: 12px; color: var(--sy-ink-3); }

.sy-prof__pt {
  position: absolute; width: 7px; height: 7px; margin: -3.5px 0 0 -3.5px;
  border-radius: 50%; background: var(--sy-surface); border: 1.5px solid var(--sy-terracotta);
}
.sy-prof__pt--hut, .sy-prof__pt--camp { background: var(--sy-terracotta-deep); border-color: var(--sy-terracotta-deep); }
.sy-prof__pt--peak { width: 9px; height: 8px; margin: -6px 0 0 -4.5px; border: 0; border-radius: 0; background: var(--sy-terracotta); clip-path: polygon(50% 0, 100% 100%, 0 100%); }
.sy-prof__lab {
  position: absolute;
  display: grid;
  justify-items: center;
  transform: translate(-50%, calc(-100% - 8px));
  white-space: nowrap;
  pointer-events: none;
}
.sy-prof__lab.is-start { justify-items: start; transform: translate(0, calc(-100% - 8px)); }
.sy-prof__lab.is-end { justify-items: end; transform: translate(-100%, calc(-100% - 8px)); }
.sy-prof__lab { text-shadow: 0 0 2px var(--sy-surface), 0 0 4px var(--sy-surface); }
.sy-prof__lab b { font: 600 15px/1.1 var(--sy-font-data); letter-spacing: 0.02em; font-variant-numeric: tabular-nums; display: inline-block; }
.sy-prof__lab i { font-style: normal; font-size: 12px; line-height: 1.3; color: var(--sy-ink-3); max-width: 9em; overflow: hidden; text-overflow: ellipsis; }

.sy-cover__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; margin-top: 32px; }

/* 逾時通報：整張紙寬的黃昏色帶，計畫書裡最大的一個數字 */
.sy-alert {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: end;
  gap: 4px 32px;
  margin: 34px calc(var(--plan-pad) * -1) 0;
  padding: 22px var(--plan-pad) 24px;
  background: var(--sy-dusk);
  color: var(--sy-on-dusk);
}
.sy-alert__h { grid-column: 1 / -1; margin: 0; font: 700 14px/1.4 var(--sy-font-text); letter-spacing: 0.06em; color: var(--sy-on-dusk-muted); }
.sy-alert__t { display: flex; align-items: baseline; gap: 14px; margin: 0; white-space: nowrap; }
.sy-alert__d { font: 500 clamp(18px, 1vw + 12px, 24px)/1 var(--sy-font-data); letter-spacing: 0.02em; color: var(--sy-on-dusk); }
.sy-alert__t b { font: 600 clamp(56px, 4vw + 30px, 88px)/0.86 var(--sy-font-data); letter-spacing: -0.02em; color: var(--sy-on-dusk-accent); font-variant-numeric: tabular-nums; display: inline-block; }
.sy-alert__side { display: grid; gap: 8px; min-width: 0; padding-bottom: 4px; }
.sy-alert__pick { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: 14px; color: var(--sy-on-dusk-muted); }
.sy-alert__pick select {
  width: auto; min-height: 40px; padding: 0 32px 0 12px;
  border: 1px solid rgba(242, 237, 230, 0.32); border-radius: var(--sy-radius);
  background-color: var(--sy-dusk-2); color: var(--sy-on-dusk);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F2EDE6' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  font: 600 16px/1 var(--sy-font-digits);
}
.sy-alert__pick select:hover { border-color: var(--sy-on-dusk-accent); }
.sy-alert__pick select:focus-visible { outline: 2px solid var(--sy-on-dusk-accent); outline-offset: 2px; border-color: var(--sy-on-dusk-accent); }
.sy-alert__p { margin: 0; max-width: 30em; font-size: 15px; line-height: 1.7; color: var(--sy-on-dusk); }
.sy-alert__p b { color: var(--sy-on-dusk-accent); }

/* 區塊：上墨線、無框 */
.sy-block { min-width: 0; padding-top: 12px; border-top: 1px solid var(--sy-ink); }
.sy-block__bar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 4px 16px; }
.sy-block__h { margin: 0 0 12px; font: 700 18px/1.4 var(--sy-font-text); }
.sy-block__bar .sy-block__h { margin: 0; }
.sy-block__count { font: 500 15px var(--sy-font-data); color: var(--sy-muted); margin-left: 4px; }
.sy-block__p { margin: 0 0 10px; font-size: 15px; line-height: 1.7; color: var(--sy-ink-2); }
.sy-block__p--muted { color: var(--sy-ink-3); font-size: 14px; }
.sy-pre { white-space: pre-line; }

/* 紙上的欄位：底線式，印出來就是可以手寫的格線 */
.sy-pform { display: grid; gap: 12px 16px; }
.sy-pform--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sy-pform--3 { grid-template-columns: 1.1fr 1.2fr 0.9fr; }
.sy-field { display: grid; gap: 2px; min-width: 0; align-content: start; }
.sy-field__l { font-size: 13px; color: var(--sy-muted); letter-spacing: 0.02em; }
.sy-field input, .sy-field textarea, .sy-team__table input, .sy-team__table select {
  width: 100%;
  min-height: 40px;
  padding: 6px 0;
  border: 0;
  border-bottom: 1px solid var(--sy-line-strong);
  border-radius: 0;
  background: transparent;
  color: var(--sy-ink);
  font: 400 16px/1.5 var(--sy-font-digits);
}
.sy-field textarea { resize: none; overflow: hidden; line-height: 1.7; min-height: 90px; }
.sy-field input::placeholder, .sy-field textarea::placeholder, .sy-team__table input::placeholder { color: var(--sy-muted); }
.sy-field input:hover, .sy-field textarea:hover, .sy-team__table input:hover { border-bottom-color: var(--sy-ink-3); }
.sy-field input:focus, .sy-field textarea:focus, .sy-team__table input:focus, .sy-team__table select:focus {
  outline: none;
  border-bottom: 2px solid var(--sy-terracotta-text);
  padding-bottom: 5px;
}
.sy-field select { min-height: 40px; }

.sy-alertline {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 2px 14px;
  align-items: baseline;
  margin: 18px 0 0;
  padding: 14px 16px;
  background: var(--sy-dusk);
  color: var(--sy-on-dusk);
  border-radius: var(--sy-radius-sm);
}
.sy-alertline__label { font-size: 13px; color: var(--sy-on-dusk-muted); letter-spacing: 0.04em; }
.sy-alertline__time { font: 600 26px/1.15 var(--sy-font-data); letter-spacing: 0.01em; font-variant-numeric: tabular-nums; color: var(--sy-on-dusk); }
.sy-alertline__text { grid-column: 1 / -1; font-size: 14px; line-height: 1.65; color: var(--sy-on-dusk-muted); }
.sy-alertline__text b { color: var(--sy-on-dusk-accent); }

/* 隊伍 */
.sy-team { margin-top: 36px; }
.sy-team__scroll { margin-top: 8px; overflow-x: auto; }
.sy-team__table { width: 100%; border-collapse: collapse; font-size: 15px; }
.sy-team__table th { padding: 6px 8px 6px 0; text-align: left; font-size: 13px; font-weight: 700; color: var(--sy-muted); border-bottom: 1px solid var(--sy-ink); white-space: nowrap; }
.sy-team__table td { padding: 2px 10px 2px 0; vertical-align: middle; }
.sy-team__table tbody th { border-bottom: 0; vertical-align: middle; font: 600 14px var(--sy-font-data); color: var(--sy-terracotta-text); }
.sy-team__table td:nth-child(2) { width: 18%; }
.sy-team__table td:nth-child(3), .sy-team__table td:nth-child(6) { width: 18%; }
.sy-team__blood { width: 64px; }
.sy-team__blood select { min-width: 56px; padding-right: 18px; background-position: right 0 center; border: 0; border-bottom: 1px solid var(--sy-line-strong); border-radius: 0; background-color: transparent; }
.sy-team__more { position: relative; width: 150px; white-space: nowrap; }
.sy-team__more > * { vertical-align: middle; }
.sy-team__private { display: inline-block; }
.sy-team__private summary {
  display: inline-flex; align-items: center; min-height: 40px;
  font-size: 13px; font-weight: 700; color: var(--sy-terracotta-deep); cursor: pointer;
  list-style: none;
}
.sy-team__private summary::-webkit-details-marker { display: none; }
.sy-team__private summary::after { content: ""; width: 6px; height: 6px; margin-left: 6px; border-right: 1.5px solid; border-bottom: 1.5px solid; transform: rotate(45deg) translateY(-2px); }
.sy-team__private[open] summary::after { transform: rotate(-135deg); }
.sy-team__private[open] .sy-pform {
  position: absolute; z-index: 3; right: 0; top: 44px;
  width: min(460px, 80vw);
  padding: 16px 18px;
  background: var(--sy-surface);
  border: 1px solid var(--sy-line-strong);
  border-radius: var(--sy-radius);
  box-shadow: var(--sy-shadow-pop);
  white-space: normal;
}
.sy-iconbtn {
  display: inline-grid; place-items: center;
  width: 40px; height: 40px;
  border: 0; border-radius: 50%;
  background: none; color: var(--sy-ink-3); cursor: pointer;
  vertical-align: middle;
}
.sy-iconbtn:hover { background: var(--sy-sand); color: var(--sy-ink); }
.sy-iconbtn:focus-visible { outline: 2px solid var(--sy-terracotta-text); outline-offset: 1px; }
.sy-iconbtn .sy-icon { width: 18px; height: 18px; }
.sy-team__add { margin-top: 6px; }
.sy-team__note { margin: 4px 0 0; font-size: 13px; line-height: 1.6; color: var(--sy-muted); }
.sy-check { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; font-size: 14px; color: var(--sy-ink-2); cursor: pointer; }
.sy-check input { flex: none; width: 18px; height: 18px; margin: 0; accent-color: var(--sy-terracotta-text); }

/* ── 每天一頁 ── */
.sy-day__head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 4px 20px;
  align-items: end;
}
.sy-day__n {
  grid-row: span 2;
  margin: 0;
  font: 600 clamp(56px, 4vw + 30px, 84px)/0.82 var(--sy-font-data);
  letter-spacing: -0.02em;
  color: var(--sy-terracotta);
}
.sy-day__date { margin: 0; font: 500 16px/1.3 var(--sy-font-data); letter-spacing: 0.04em; color: var(--sy-ink-3); }
.sy-day__route {
  display: flex; flex-wrap: wrap; align-items: center; gap: 2px 10px;
  margin: 4px 0 0;
  font: 700 clamp(20px, 1vw + 15px, 26px)/1.3 var(--sy-font-text);
}
.sy-day__route .sy-icon { width: 20px; height: 20px; color: var(--sy-terracotta); }
.sy-day__facts {
  grid-column: 1 / -1;
  display: flex; flex-wrap: wrap;
  margin: 16px 0 0; padding-top: 12px;
  border-top: 1px solid var(--sy-ink);
}
.sy-day__facts .sy-fact b { font-size: 21px; }
.sy-day__warn {
  display: flex; gap: 10px; align-items: flex-start;
  margin: 20px 0 0;
  padding: 12px 0;
  border-top: 1px solid var(--sy-terracotta);
  border-bottom: 1px solid var(--sy-line);
  font-size: 15px; line-height: 1.65; color: var(--sy-terracotta-deep);
}
.sy-day__warn .sy-icon { width: 16px; height: 16px; margin-top: 4px; fill: var(--sy-terracotta); stroke: none; }
.sy-day__note { margin: 14px 0 0; font-size: 13px; line-height: 1.6; color: var(--sy-muted); }
.sy-day__memo { display: none; }

/* 時間表 */
.sy-tt { width: 100%; margin-top: 22px; border-collapse: collapse; font-variant-numeric: tabular-nums lining-nums; }
.sy-tt th {
  padding: 8px 10px 8px 0;
  border-bottom: 1px solid var(--sy-ink);
  text-align: left;
  font-size: 13px; font-weight: 700; color: var(--sy-muted); letter-spacing: 0.02em;
  white-space: nowrap;
}
.sy-tt th:nth-child(3), .sy-tt th:nth-child(4) { text-align: right; }
.sy-tt th .sy-icon { width: 16px; height: 16px; vertical-align: -3px; }
.sy-tt td { padding: 6px 10px 6px 0; border-bottom: 1px solid var(--sy-line); vertical-align: middle; }
.sy-tt__time { white-space: nowrap; width: 1%; }
.sy-eta {
  display: inline-block;
  font: 600 22px/1.15 var(--sy-font-data);
  letter-spacing: 0.01em;
  color: var(--sy-ink);
  text-decoration: underline dotted var(--sy-line-strong);
  text-decoration-thickness: 1.5px;
  text-underline-offset: 5px;
}
.sy-eta.is-fixed { color: var(--sy-terracotta-text); text-decoration: none; }
.sy-eta i { font: 500 12px var(--sy-font-text); font-style: normal; color: var(--sy-terracotta-deep); margin-right: 4px; vertical-align: 3px; }
.sy-tt__tag { display: inline-block; margin-left: 8px; font-size: 12px; font-weight: 700; color: var(--sy-terracotta-deep); letter-spacing: 0.06em; vertical-align: 3px; }
.sy-tt__pl { display: flex; align-items: center; gap: 10px; min-height: 44px; }
.sy-tt__ico { flex: none; display: grid; place-items: center; width: 26px; height: 26px; color: var(--sy-ink-3); }
.sy-tt__ico .sy-icon { width: 18px; height: 18px; }
.sy-tt__row--peak .sy-tt__ico .sy-icon { fill: var(--sy-terracotta); stroke: var(--sy-terracotta); width: 14px; height: 14px; }
.sy-tt__row--hut .sy-tt__ico, .sy-tt__row--camp .sy-tt__ico { color: var(--sy-terracotta-deep); }
.sy-tt__name { font-size: 16px; line-height: 1.45; }
.sy-tt__meta { display: none; }
.sy-tt__row--peak .sy-tt__name, .sy-tt__row--hut .sy-tt__name, .sy-tt__row--camp .sy-tt__name { font-weight: 700; }
.sy-tt__num { text-align: right; white-space: nowrap; font: 500 16px/1 var(--sy-font-data); color: var(--sy-ink-2); width: 1%; }
.sy-tt__num i { font: 400 12px var(--sy-font-text); font-style: normal; color: var(--sy-muted); }
.sy-tt__rest { width: 1%; }
.sy-tt__rest select { min-height: 36px; width: 84px; padding: 0 22px 0 8px; font-size: 14px; border-color: var(--sy-line); background-position: right 4px center; background-size: 14px; }
.sy-tt__night { width: 1%; text-align: center; }
.sy-tt__row.is-dark .sy-eta { color: var(--sy-terracotta-deep); }
.sy-tt__row.is-night td { background: var(--sy-terracotta-wash); }
.sy-tt tr:last-child td { border-bottom: 1px solid var(--sy-ink); }

.sy-night {
  display: inline-grid; place-items: center;
  width: 44px; height: 40px;
  border: 1px solid transparent; border-radius: var(--sy-radius);
  background: none; color: var(--sy-line-strong); cursor: pointer;
  transition: color var(--sy-dur-1) ease, background-color var(--sy-dur-1) ease, border-color var(--sy-dur-1) ease;
}
.sy-night.is-sleepable { color: var(--sy-ink-3); }
.sy-tt tr:hover .sy-night:not([aria-pressed="true"]), .sy-night:focus-visible { color: var(--sy-ink-2); }
.sy-night:hover { color: var(--sy-terracotta-deep); border-color: var(--sy-line-strong); }
.sy-night[aria-pressed="true"] { color: var(--sy-surface); background: var(--sy-terracotta-text); border-color: var(--sy-terracotta-text); }
.sy-night:focus-visible { outline: 2px solid var(--sy-terracotta-text); outline-offset: 1px; }
.sy-night .sy-icon { width: 20px; height: 20px; }

/* 數字改了：那一格往下翻一下（只翻有變的；減少動態時不翻） */
@keyframes sy-tick {
  0% { transform: translateY(-0.45em); opacity: 0; color: var(--sy-terracotta-text); }
  60% { opacity: 1; color: var(--sy-terracotta-text); }
  100% { transform: none; }
}
.is-tick { animation: sy-tick 520ms var(--sy-ease-out); }
@keyframes sy-roll {
  0% { transform: translateY(0.55em); opacity: 0; color: var(--sy-terracotta-text); }
  70% { opacity: 1; color: var(--sy-terracotta-text); }
  100% { transform: none; }
}
.sy-roll { display: inline-block; animation: sy-roll 300ms cubic-bezier(0.16, 1, 0.3, 1) both; }
.sy-alert .sy-roll, .sy-tools__alert .sy-roll, .sy-plan__bar-alert .sy-roll { animation-name: sy-roll-dusk; }
@keyframes sy-roll-dusk { 0% { transform: translateY(0.55em); opacity: 0; } 100% { transform: none; opacity: 1; } }

/* ── 應變與裝備 ── */
.sy-plan2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 32px; }
.sy-plan2__col { display: grid; gap: 14px; align-content: start; }
.sy-field--wide { grid-row: span 1; }
.sy-gear { margin-top: 36px; padding-top: 12px; border-top: 1px solid var(--sy-ink); }
/* 裝備：所有項目在三欄裡連續往下流（兩天的行程只有兩組，也不會空出一整欄） */
.sy-gear__grid { display: block; columns: 3; column-gap: 28px; margin-top: 10px; }
.sy-gear__col { display: contents; }
.sy-gear__lv { break-after: avoid; }
.sy-gear__col + .sy-gear__col .sy-gear__lv { margin-top: 14px; }
.sy-gear li { break-inside: avoid; }
.sy-gear__lv { margin: 0 0 4px; font: 700 14px/1.5 var(--sy-font-text); color: var(--sy-terracotta-deep); }
.sy-gear ul { margin: 0; padding: 0; list-style: none; }
.sy-gear li { border-bottom: 1px solid var(--sy-line); line-height: 1.4; }
.sy-field__print { display: none; }
.sy-gear .sy-check { min-height: 38px; font-size: 14px; line-height: 1.4; align-items: center; }
.sy-plan__textlink .sy-icon { transition: transform var(--sy-dur-2) var(--sy-ease-out); }
.sy-plan__textlink:hover .sy-icon { transform: translateX(3px); }

/* ── 空狀態／載入中 ── */
.sy-empty__h { margin: 0; font-family: var(--sy-font-display); font-weight: 900; font-size: clamp(30px, 2.6vw + 14px, 48px); line-height: 1.2; }
.sy-empty__p { margin: 12px 0 0; max-width: 34em; font-size: 17px; line-height: 1.75; color: var(--sy-ink-2); }
.sy-empty__more { margin: 14px 0 0; }
.sy-skel { display: grid; gap: 12px; margin-top: 32px; }
.sy-skel span { height: 14px; border-radius: var(--sy-radius-sm); background: linear-gradient(90deg, var(--sy-sand), #F8F4EF, var(--sy-sand)); background-size: 200% 100%; animation: sy-skel 1.2s linear infinite; }
.sy-skel span:nth-child(1) { height: 120px; }
.sy-skel span:nth-child(3) { width: 60%; }
@keyframes sy-skel { to { background-position: -200% 0; } }

/* 路線清單（空狀態與對話框共用） */
.sy-routes { margin: 24px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--sy-ink); }
.sy-routes li { border-bottom: 1px solid var(--sy-line); }
.sy-routes__row {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) auto;
  gap: 2px 16px;
  width: 100%;
  min-height: 60px;
  padding: 10px 8px;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: background-color var(--sy-dur-1) ease;
}
.sy-routes__row:hover { background: var(--sy-terracotta-wash); }
.sy-routes__row:focus-visible { outline: 2px solid var(--sy-terracotta-text); outline-offset: -2px; }
.sy-routes__row.is-current { background: var(--sy-sand); }
.sy-routes__name { font: 700 17px/1.4 var(--sy-font-text); }
.sy-routes__prof { grid-column: 1; grid-row: 1 / span 2; align-self: center; height: 34px; border-bottom: 1px solid var(--sy-line-strong); }
.sy-routes__prof svg { display: block; width: 100%; height: 100%; overflow: visible; }
.sy-routes__area { fill: var(--sy-terracotta-tint); }
.sy-routes__line { fill: none; stroke: var(--sy-terracotta); stroke-width: 1.5; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.sy-routes__name { grid-column: 2; }
.sy-routes__peaks { grid-column: 2; font-size: 14px; line-height: 1.5; color: var(--sy-ink-3); }
.sy-routes__num { grid-column: 3; grid-row: 1 / span 2; align-self: center; display: flex; gap: 4px; align-items: baseline; font-size: 13px; color: var(--sy-muted); white-space: nowrap; }
.sy-routes__num b { font: 600 19px/1 var(--sy-font-data); color: var(--sy-ink); margin-left: 10px; }
.sy-routes__num b:first-child { margin-left: 0; }
.sy-routes__none { padding: 16px 8px; font-size: 15px; color: var(--sy-ink-3); }
.sy-routes--featured { columns: 2; column-gap: 32px; border-top: 1px solid var(--sy-ink); }
.sy-routes--featured li { break-inside: avoid; }

/* ── 時間怎麼算 ── */
.sy-plan__how { display: grid; gap: 0 40px; padding-top: clamp(40px, 5vw, 72px); padding-bottom: clamp(48px, 6vw, 96px); }
.sy-plan__h2 { margin: 0 0 12px; padding-top: 12px; border-top: 1px solid var(--sy-ink); font: 700 clamp(22px, 1vw + 17px, 28px)/1.35 var(--sy-font-text); }
.sy-plan__how-body { max-width: 720px; }
.sy-plan__how-body p { margin: 0 0 14px; font-size: 17px; line-height: 1.85; color: var(--sy-ink-2); }
@media (min-width: 1100px) {
  .sy-plan__how { grid-template-columns: var(--plan-rail) minmax(0, 1fr); }
  .sy-plan__how-body { padding-top: 12px; border-top: 1px solid var(--sy-ink); }
}
.sy-plan.is-share .sy-plan__how { display: none; }

/* ══════════════════════════════════════════════════════════════
   對話框（選路線、給留守人）
   ══════════════════════════════════════════════════════════════ */
.sy-plan-dialog { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 24px 24px calc(24px + var(--plan-bar-lift, 0px)); }
.sy-plan-dialog[hidden] { display: none; }
html.sy-plan--dialog { overflow: hidden; }
.sy-dlg__scrim { position: absolute; inset: 0; background: rgba(31, 23, 19, 0.46); animation: sy-fade var(--sy-dur-2) ease; }
.sy-dlg {
  position: relative;
  width: min(640px, 100%);
  max-height: min(84vh, 760px);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 32px clamp(20px, 3vw, 36px) 28px;
  background: var(--sy-paper);
  border-radius: var(--sy-radius-lg);
  box-shadow: var(--sy-shadow-pop);
  animation: sy-rise var(--sy-dur-3) var(--sy-ease-out);
  scrollbar-width: thin;
  scrollbar-color: var(--sy-line-strong) transparent;
}
.sy-dlg__close { position: absolute; top: 14px; right: 14px; width: 44px; height: 44px; }
.sy-dlg__h { margin: 0 48px 6px 0; font: 700 24px/1.35 var(--sy-font-text); }
.sy-dlg__lede, .sy-dlg__hint { margin: 0 0 16px; font-size: 15px; line-height: 1.7; color: var(--sy-ink-2); }
.sy-dlg__hint { margin: 12px 0 0; color: var(--sy-muted); font-size: 14px; }
.sy-dlg .sy-routes { margin-top: 14px; }
@keyframes sy-fade { from { opacity: 0; } }
@keyframes sy-rise { from { opacity: 0; transform: translateY(16px); } }

.sy-search { position: relative; display: block; margin-top: 8px; }
.sy-search .sy-icon { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); width: 18px; height: 18px; color: var(--sy-ink-3); }
.sy-search input { padding-left: 42px; font-family: var(--sy-font-text); font-weight: 400; min-height: 48px; border-radius: var(--sy-radius-pill); }

.sy-share__url { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.sy-share__url input { font: 400 14px/1 var(--sy-font-data); color: var(--sy-ink-2); }
.sy-share__status { min-height: 1.6em; margin: 8px 0 0; font-size: 14px; color: var(--sy-terracotta-deep); }
.sy-share__acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.sy-share__what { display: grid; grid-template-columns: 1.4fr 1fr; gap: 0 24px; margin-top: 22px; padding-top: 4px; border-top: 1px solid var(--sy-ink); }
.sy-share__fine { grid-column: 1 / -1; }
.sy-share__line { text-decoration: none; }
.sy-share__line[aria-disabled="true"] { pointer-events: none; opacity: 0.5; }
.sy-share__whath { margin: 10px 0 4px; font-size: 14px; font-weight: 700; color: var(--sy-ink); }
.sy-share__what ul { margin: 0; padding-left: 1.1em; font-size: 14px; line-height: 1.75; color: var(--sy-ink-2); list-style: disc; }
.sy-share__what ul.is-no { list-style: none; padding-left: 0; }
.sy-share__what ul.is-no li::before { content: ""; display: inline-block; width: 10px; height: 0; margin-right: 8px; vertical-align: middle; border-top: 2px solid var(--sy-terracotta-text); }
.sy-share__fine { margin: 14px 0 0; font-size: 13px; line-height: 1.7; color: var(--sy-muted); }

/* ── 傳給隊友（可編輯連結）── */
.sy-pteam-alt {
  display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px;
  margin: 20px 0 0; padding-top: 14px; border-top: 1px dashed var(--sy-line-strong);
  font-size: 14px; color: var(--sy-ink-2);
}
.sy-pteam-alt .sy-icon, .sy-pteam-note .sy-icon { width: 18px; height: 18px; color: var(--sy-terracotta-text); flex: none; }
.sy-pteam-alt .sy-plan__textbtn { min-height: 44px; }
.sy-demo + .sy-pteam-note { margin-top: 0; }
.sy-pteam-note span { flex: 1 1 260px; }
.sy-pteam-cmp { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 4px 0 18px; }
.sy-pteam-cmp__col { padding: 12px 14px 14px; border: 1px solid var(--sy-line-strong); border-radius: var(--sy-radius); }
.sy-pteam-cmp__col.is-new { border-color: var(--sy-terracotta-text); box-shadow: inset 0 0 0 1px var(--sy-terracotta-text); }
.sy-pteam-cmp__col .sy-share__whath { margin-top: 0; }
.sy-pteam-cmp__t { display: block; margin-top: 2px; font: 400 12px/1.4 var(--sy-font-data); color: var(--sy-muted); }
.sy-pteam-cmp__dl { margin: 8px 0 0; font-size: 14px; line-height: 1.6; }
.sy-pteam-cmp__dl div { display: grid; grid-template-columns: 3em minmax(0, 1fr); gap: 8px; padding: 3px 0; }
.sy-pteam-cmp__dl dt { color: var(--sy-muted); }
.sy-pteam-cmp__dl dd { margin: 0; color: var(--sy-ink); overflow-wrap: anywhere; }
.sy-pteam-cmp__acts { margin-top: 0; }
@media (max-width: 560px) { .sy-pteam-cmp { grid-template-columns: minmax(0, 1fr); } }

/* ══════════════════════════════════════════════════════════════
   留守人卡
   ══════════════════════════════════════════════════════════════ */
.sy-gcard { padding: 0; overflow: hidden; }
.sy-gcard__alert {
  padding: clamp(24px, 4vw, 48px) var(--plan-pad);
  background: var(--sy-dusk);
  color: var(--sy-on-dusk);
}
.sy-gcard__alert-l { margin: 0; font-size: 15px; font-weight: 700; color: var(--sy-on-dusk); letter-spacing: 0.06em; }
.sy-gcard__alert-t { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 16px; margin: 6px 0 0; }
.sy-gcard__alert-t span { font: 500 clamp(22px, 1.4vw + 16px, 32px)/1 var(--sy-font-data); color: var(--sy-on-dusk); }
.sy-gcard__alert-t b { font: 600 clamp(64px, 6vw + 30px, 112px)/0.9 var(--sy-font-data); letter-spacing: -0.02em; color: var(--sy-on-dusk-accent); font-variant-numeric: tabular-nums; }
.sy-gcard__alert-p { max-width: 38em; margin: 16px 0 0; font-size: 17px; line-height: 1.75; color: var(--sy-on-dusk); }
.sy-gcard__alert-p a { color: var(--sy-on-dusk-accent); font-weight: 700; }
.sy-gcard__acts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.sy-btn--ghost.sy-btn--dusk { color: var(--sy-on-dusk); background: transparent; border-color: rgba(242, 237, 230, 0.4); }
.sy-btn--ghost.sy-btn--dusk:hover { background: var(--sy-dusk-2); color: #fff; border-color: var(--sy-on-dusk-muted); }
.sy-gcard__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 36px; padding: 32px var(--plan-pad) 0; }
.sy-gcard__people { margin: 0; padding: 0; list-style: none; }
.sy-gcard__people li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; padding: 8px 0; border-bottom: 1px solid var(--sy-line); font-size: 16px; }
.sy-gcard__who i { font-style: normal; font-size: 13px; color: var(--sy-muted); margin-left: 8px; }
.sy-gcard__tel { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; font: 600 17px var(--sy-font-data); color: var(--sy-terracotta-deep); text-decoration: none; }
.sy-gcard__tel .sy-icon { width: 16px; height: 16px; }
.sy-gcard__days { display: grid; grid-template-columns: repeat(var(--cols, 2), minmax(0, 1fr)); gap: 28px 32px; align-items: start; padding: 32px var(--plan-pad) 0; }
.sy-gcard__make { margin: 0; padding: 0 var(--plan-pad) var(--plan-pad); }
.sy-gday__h { display: flex; align-items: baseline; gap: 10px; margin: 0; padding-top: 10px; border-top: 1px solid var(--sy-ink); font: 500 15px var(--sy-font-data); color: var(--sy-ink-3); }
.sy-gday__h b { font-size: 26px; font-weight: 600; color: var(--sy-terracotta); }
.sy-gday ol { margin: 6px 0 0; padding: 0; list-style: none; }
.sy-gday li.is-hut .sy-gday__n, .sy-gday li.is-camp .sy-gday__n, .sy-gday li.is-peak .sy-gday__n { font-weight: 700; }
.sy-gday__all { margin-top: 6px; }
.sy-gday__all summary { display: inline-flex; align-items: center; min-height: 40px; font-size: 14px; font-weight: 700; color: var(--sy-terracotta-deep); cursor: pointer; }
.sy-gday__all[open] + * { margin-top: 0; }
.sy-gday__all[open] ~ .sy-gday__key, .sy-gday:has(.sy-gday__all[open]) .sy-gday__key { display: none; }
.sy-gday li { display: grid; grid-template-columns: 4.4em minmax(0, 1fr); gap: 10px; padding: 6px 0; border-bottom: 1px solid var(--sy-line); font-size: 15px; align-items: baseline; }
.sy-gday__t { font: 600 17px var(--sy-font-data); font-variant-numeric: tabular-nums; }
.sy-gday__e { font: 500 13px var(--sy-font-data); color: var(--sy-muted); }
.sy-gcard .sy-sheet__safety { padding: 0 var(--plan-pad) 20px; }

/* ══════════════════════════════════════════════════════════════
   窄螢幕
   ══════════════════════════════════════════════════════════════ */
@media (max-width: 1099px) {
  .sy-plan__stack { max-width: none; }
  .sy-plan__rail { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 32px; }

  .sy-rail__more { grid-column: 1 / -1; }
  .sy-rail__more[open] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 32px; }
  .sy-rail__more[open] > .sy-rail__summary { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  .sy-plan__rail { grid-template-columns: minmax(0, 1fr); }

  .sy-rail__more[open] { grid-template-columns: minmax(0, 1fr); }
  /* 輸出按鈕在手機貼底，捲到哪都按得到 */
  .sy-plan__bar {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 40;
    display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
    background: var(--sy-paper);
    border-top: 1px solid var(--sy-ink);
  }
  .sy-plan__tools { display: none !important; }
  .sy-rail__csv { display: inline-flex; }
  .sy-rail__summary {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 2px 12px;
    min-height: 56px; padding: 10px 0; border-top: 1px solid var(--sy-line-strong);
    cursor: pointer; list-style: none;
  }
  .sy-rail__summary::-webkit-details-marker { display: none; }
  .sy-rail__summary::after { content: ""; grid-row: 1 / span 2; grid-column: 2; width: 8px; height: 8px; margin-right: 6px; border-right: 1.75px solid var(--sy-ink-2); border-bottom: 1.75px solid var(--sy-ink-2); transform: rotate(45deg); }
  .sy-rail__more[open] .sy-rail__summary::after { transform: rotate(-135deg); }
  .sy-rail__sumh { font-weight: 700; font-size: 15px; }
  .sy-rail__sumv { font: 500 15px/1.3 var(--sy-font-data); color: var(--sy-ink-3); }
  .sy-rail__more > .sy-rail__sec:first-of-type { border-top: 0; }
  .sy-plan__head { padding-bottom: 20px; }
  .sy-plan__lede { font-size: 16px; line-height: 1.7; margin-top: 8px; }
  .sy-plan__lede-more { display: none; }
  .sy-plan__lede-end { display: inline; }
  .sy-plan__title { font-size: 30px; }
  .sy-plan__head { padding-top: 16px; }
  .sy-crumb { margin-bottom: 8px; }
  .sy-plan__desk { padding-top: 14px; }
  .sy-rail__sec:first-child .sy-rail__h { display: none; }
  .sy-rail__route { grid-template-columns: minmax(0, 1fr) auto; align-items: center; padding: 10px 14px; gap: 2px 12px; }
  .sy-rail__route-name { font-size: 17px; }
  .sy-rail__route-meta { display: none; }
  .sy-rail__route-num { grid-column: 1; font-size: 14px; }
  .sy-rail__route-swap { grid-column: 2; grid-row: 1 / span 2; margin: 0; }
  .sy-rail__summary { min-height: 48px; padding: 6px 0; }
  .sy-plan__desk-in { gap: 12px; }
  .sy-sheet--cover { padding-top: 22px; }
  .sy-cover__title { font-size: 28px; }
  .sy-pfacts { margin-top: 16px; }
  .sy-alert { grid-template-columns: minmax(0, 1fr); }
  .sy-share__what { grid-template-columns: minmax(0, 1fr); }
  .sy-gcard__days { grid-template-columns: minmax(0, 1fr); }
  .sy-plan__bar .sy-btn { width: 100%; padding: 0 12px; }
  .sy-plan__bar-alert { display: flex; grid-column: 1 / -1; justify-content: center; padding: 4px 12px; font-size: 12px; }
  .sy-plan__bar-alert b { font-size: 16px; }
  .sy-plan__bar.is-band-visible .sy-plan__bar-alert { display: none; }
  .sy-plan { padding-bottom: 120px; }
  .sy-pfacts { display: flex; flex-wrap: wrap; row-gap: 14px; }
  .sy-pfacts .sy-fact { flex: 1 1 30%; min-width: 0; padding: 0 10px; }
  .sy-pfacts .sy-fact:first-child { flex-basis: 100%; padding-left: 0; border-left: 0; }
  .sy-pfacts .sy-fact:nth-child(2), .sy-pfacts .sy-fact:nth-child(5) { padding-left: 0; border-left: 0; }
  .sy-pfacts .sy-fact b { font-size: 20px; }
  /* 手機：天數已寫在標題、最高點標在剖面上，這兩格收掉，其餘排一列 */
  .sy-pfacts .sy-fact:nth-child(2), .sy-pfacts .sy-fact:nth-child(5) { display: none; }
  .sy-pfacts .sy-fact:nth-child(3) { padding-left: 0; border-left: 0; }
  .sy-pfacts .sy-fact:first-child { display: flex; align-items: baseline; gap: 10px; }
  .sy-pfacts .sy-fact:first-child dd { margin: 0; }
  .sy-pfacts { row-gap: 8px; padding-top: 10px; }
  .sy-cover__route { margin-top: 4px; font-size: 14px; }
  .sy-day__facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 12px; }
  .sy-day__facts .sy-fact { padding: 0; border-left: 0; }
  .sy-cover__grid, .sy-plan2, .sy-gcard__grid { grid-template-columns: minmax(0, 1fr); }
  .sy-pform--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sy-pform--3 .sy-field:first-child { grid-column: 1 / -1; }
  .sy-gear__grid { columns: 1; }
  .sy-routes--featured { columns: 1; }
  .sy-prof__lab i { display: none; }
  .sy-prof__tent i { display: none; }
  .sy-prof { padding-left: 34px; }
  .sy-prof__tick { left: -6px; transform: translate(-100%, -50%); font-size: 11px; }
  /* 時間表：手機上把海拔／里程收進地點底下，表格不必左右捲 */
  /* 一列＝時間｜地點（下面一行海拔與里程、再下面休息）｜過夜 */
  .sy-tt, .sy-tt tbody { display: block; }
  .sy-tt thead { display: none; }
  .sy-tt tr {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr) 44px;
    grid-template-areas: "t p n" "t r n";
    column-gap: 10px;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid var(--sy-line);
  }
  .sy-tt tr:last-child { border-bottom: 1px solid var(--sy-ink); }
  .sy-tt td, .sy-tt tr:last-child td { padding: 0; border: 0; }
  .sy-tt td.sy-tt__num { display: none; }
  .sy-tt__time { grid-area: t; align-self: start; width: auto; padding-top: 4px !important; }
  .sy-tt__place { grid-area: p; }
  .sy-tt__rest { grid-area: r; width: auto; }
  .sy-tt__rest:empty { display: none; }
  .sy-tt__night { grid-area: n; width: auto; }
  .sy-tt__pl { min-height: 0; gap: 8px; align-items: flex-start; }
  .sy-tt__ico { margin-top: 1px; }
  .sy-tt__meta { display: block; font: 500 13px/1.4 var(--sy-font-data); color: var(--sy-muted); letter-spacing: 0.02em; }
  .sy-tt__rest select { width: auto; min-height: 34px; margin: 4px 0 0 34px; font-size: 13px; }
  .sy-tt__row.is-night { background: var(--sy-terracotta-wash); }
  .sy-eta { font-size: 19px; }
  .sy-tt__tag { display: block; margin: 2px 0 0; vertical-align: 0; }
  .sy-tt__name { font-size: 15px; }
  /* 隊伍：一人一張堆疊卡 */
  .sy-team__table, .sy-team__table tbody, .sy-team__table tr, .sy-team__table td, .sy-team__table th { display: block; width: auto !important; }
  .sy-team__table thead { display: none; }
  .sy-team__table tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; padding: 8px 0 12px; border-bottom: 1px solid var(--sy-line); }
  .sy-team__table tbody th { grid-column: 1 / -1; padding: 4px 0 0; }
  .sy-team__table td { padding: 0; }
  .sy-team__table td:nth-child(2) { grid-column: 1 / -1; }
  .sy-team__more { grid-column: 1 / -1; display: flex !important; justify-content: space-between; align-items: center; }
  .sy-team__private[open] .sy-pform { position: static; width: auto; margin-top: 4px; box-shadow: none; }
  .sy-team__private[open] { width: 100%; }
  .sy-dlg { max-height: calc(88vh - var(--plan-bar-lift, 0px)); }
  .sy-plan-dialog { place-items: end center; padding: 0 0 var(--plan-bar-lift, 0px); }
  .sy-plan-dialog .sy-dlg { border-radius: var(--sy-radius-lg) var(--sy-radius-lg) 0 0; }
}

/* ══════════════════════════════════════════════════════════════
   v2（2026-10）：完成度、目錄、路線圖、出發前、日出日落、留守人儀表
   ══════════════════════════════════════════════════════════════ */

/* ── 計畫書完成度：六格刻度＋「下一步」 ── */
.sy-rail__sec--progress { padding-bottom: 16px; }
.sy-prog__h { display: flex; align-items: baseline; justify-content: space-between; margin: 0 0 8px; font-size: 13px; font-weight: 700; letter-spacing: 0.04em; color: var(--sy-ink-3); }
.sy-prog__h b { font: 600 24px/1 var(--sy-font-data); color: var(--sy-ink); letter-spacing: 0.01em; }
.sy-prog__h b i { font-style: normal; font-size: 15px; color: var(--sy-muted); }
.sy-prog__bar { display: grid; grid-template-columns: repeat(6, 1fr); gap: 4px; margin: 0; padding: 0; list-style: none; }
.sy-prog__bar li { height: 6px; border-radius: 3px; background: var(--sy-line-strong); transition: background-color var(--sy-dur-3) var(--sy-ease-out); }
.sy-prog__bar li.is-ok { background: var(--sy-terracotta); }
.sy-prog__next {
  display: flex; align-items: center; gap: 10px; width: 100%;
  min-height: 48px; margin-top: 12px; padding: 8px 14px;
  border: 1px solid var(--sy-terracotta-tint); border-radius: var(--sy-radius);
  background: var(--sy-terracotta-wash); color: var(--sy-terracotta-deep);
  font: 700 15px/1.35 var(--sy-font-text); text-align: left; cursor: pointer;
  transition: border-color var(--sy-dur-1) ease, background-color var(--sy-dur-1) ease;
}
.sy-prog__next span { flex: none; padding-right: 10px; border-right: 1px solid var(--sy-terracotta-tint); font-size: 12px; letter-spacing: 0.08em; color: var(--sy-terracotta-text); }
.sy-prog__next .sy-icon { width: 17px; height: 17px; margin-left: auto; transition: transform var(--sy-dur-2) var(--sy-ease-out); }
.sy-prog__next:hover { border-color: var(--sy-terracotta-text); }
.sy-prog__next:hover .sy-icon { transform: translateX(3px); }
.sy-prog__next:focus-visible { outline: 2px solid var(--sy-terracotta-text); outline-offset: 2px; }
.sy-prog__done { display: flex; gap: 8px; align-items: flex-start; margin: 12px 0 0; font-size: 14px; line-height: 1.6; color: var(--sy-ink-2); }
.sy-prog__done .sy-icon { flex: none; width: 18px; height: 18px; margin-top: 2px; color: var(--sy-terracotta-text); }
/* 「下一步」帶過去的欄位：閃一下赭紅底線 */
@keyframes sy-flag { 0%, 60% { box-shadow: 0 2px 0 var(--sy-terracotta); background-color: var(--sy-terracotta-wash); } 100% { box-shadow: none; } }
.is-flag { animation: sy-flag 1.6s var(--sy-ease-out); }

/* ── 目錄：每張紙一格（左欄＝一排頁籤；窄螢幕＝紙堆上方黏著的捲動列） ── */
.sy-pidx ol { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.sy-pidx a {
  display: inline-flex; align-items: baseline; gap: 6px;
  min-height: 36px; padding: 8px 12px 6px;
  border: 1px solid var(--sy-line-strong); border-radius: var(--sy-radius-pill);
  background: var(--sy-surface); color: var(--sy-ink-2); text-decoration: none; white-space: nowrap;
  transition: background-color var(--sy-dur-1) ease, color var(--sy-dur-1) ease, border-color var(--sy-dur-1) ease;
}
.sy-pidx b { font: 600 15px/1 var(--sy-font-data); letter-spacing: 0.02em; }
.sy-pidx a:not(.is-day) b { font: 700 14px/1 var(--sy-font-text); }
.sy-pidx i { display: none; font: 500 12px/1 var(--sy-font-data); font-style: normal; color: var(--sy-muted); }
.sy-pidx a:hover { border-color: var(--sy-ink-3); color: var(--sy-ink); }
.sy-pidx a[aria-current="true"] { background: var(--sy-ink); border-color: var(--sy-ink); color: var(--sy-paper); }
.sy-pidx a[aria-current="true"] i { color: var(--sy-on-dusk-muted); }
.sy-pidx a:focus-visible { outline: 2px solid var(--sy-terracotta-text); outline-offset: 2px; }
.sy-pidx--rail { padding: 14px 0 16px; }
.sy-plan__tocbar { display: none; }
.sy-sheet[id] { scroll-margin-top: calc(var(--header-h) + 76px); }
@media (max-width: 1099px) {
  .sy-pidx--rail { display: none; }
  .sy-plan__tocbar {
    display: block; position: sticky; top: var(--header-h); z-index: 6;
    margin: 0 calc(var(--sy-gutter) * -1) 12px; padding: 8px var(--sy-gutter);
    background: color-mix(in srgb, var(--sy-sand) 92%, transparent);
    -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
    border-bottom: 1px solid var(--sy-line-strong);
  }
  .sy-pidx--bar ol { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; scroll-snap-type: x proximity; }
  .sy-pidx--bar ol::-webkit-scrollbar { display: none; }
  .sy-pidx--bar li { scroll-snap-align: start; }
  .sy-pidx--bar a.is-day i { display: inline; }
  .sy-sheet[id] { scroll-margin-top: calc(var(--header-h) + 64px); }
}
@media (min-width: 761px) and (max-width: 1099px) { .sy-plan__tocbar { margin-left: 0; margin-right: 0; border-radius: var(--sy-radius); } }

/* ── 倍率：個人校準 ── */
.sy-rail__calib { min-height: 40px; margin-top: 4px; font-size: 14px; }
.sy-rail__mine { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; margin: 10px 0 0; padding: 10px 12px; border-radius: var(--sy-radius); background: var(--sy-surface); border: 1px solid var(--sy-ink); font-size: 13px; color: var(--sy-ink-3); }
.sy-rail__mine b { font: 600 22px/1 var(--sy-font-data); color: var(--sy-ink); }
.sy-rail__mine i { flex-basis: 100%; order: 3; font-style: normal; font-size: 12px; color: var(--sy-muted); }
.sy-rail__mine .sy-plan__textbtn { min-height: 0; margin-left: auto; font-size: 13px; }
.sy-calib__std { font: 600 18px var(--sy-font-data); color: var(--sy-ink); }
.sy-calib__in { display: flex; align-items: center; gap: 10px; margin-top: 18px; font-size: 16px; font-weight: 700; }
.sy-calib__in input { width: 120px !important; min-height: 52px; font: 600 26px/1 var(--sy-font-data) !important; text-align: center; border: 1px solid var(--sy-ink-3); border-radius: var(--sy-radius); background: var(--sy-surface); }
.sy-calib__out { min-height: 3.4em; margin: 18px 0 0; padding: 14px 16px; border-left: 3px solid var(--sy-terracotta); background: var(--sy-surface); font-size: 16px; line-height: 1.6; color: var(--sy-ink-2); }
.sy-calib__out b { font: 600 28px/1 var(--sy-font-data); color: var(--sy-terracotta-deep); }
.sy-calib__out span { display: block; font-size: 13px; color: var(--sy-terracotta-deep); }
.sy-calib__acts { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 20px; }

/* ── 封面：標題右邊一枚路線形狀（像地圖的位置圖） ── */
.sy-cover__head { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 28px; align-items: start; }
.sy-cover__titles { min-width: 0; }
.sy-cover__glyph {
  position: relative; display: grid; grid-template-rows: 1fr auto; width: 148px; height: 148px; margin-top: 2px; padding: 10px 10px 8px;
  border-radius: var(--sy-radius); background: var(--sy-terracotta-wash); color: var(--sy-terracotta-deep); text-decoration: none;
  transition: background-color var(--sy-dur-1) ease, transform var(--sy-dur-2) var(--sy-ease-out);
}
.sy-cover__glyph::after { content: "路線圖 →"; font: 700 12px/1 var(--sy-font-text); letter-spacing: 0.06em; text-align: right; }
.sy-cover__glyph:hover { background: var(--sy-terracotta-tint); transform: translateY(-2px); }
.sy-cover__glyph:focus-visible { outline: 2px solid var(--sy-terracotta-text); outline-offset: 2px; }
.sy-cover__glyph svg { display: block; width: 100%; height: 100%; min-height: 0; }
.sy-cover__glyph .pm-casing { stroke: var(--sy-terracotta-wash); stroke-width: 7; }
.sy-cover__glyph .pm-day { stroke-width: 3; }
.sy-cover__glyph .pm-start, .sy-cover__glyph .pm-end { stroke: var(--sy-terracotta-wash); }

/* ── 路線略圖（plan-map.js）：線條與標記 ── */
.pm { display: block; width: 100%; height: auto; overflow: visible; font-family: var(--sy-font-text); }
.pm-grid { fill: none; stroke: var(--sy-line); stroke-width: 1; }
.pm-tick { font: 500 10.5px var(--sy-font-data); letter-spacing: 0.02em; fill: var(--sy-muted); paint-order: stroke; stroke: var(--sy-surface); stroke-width: 3px; }
.pm-casing { fill: none; stroke: var(--sy-surface); stroke-width: 9; stroke-linejoin: round; stroke-linecap: round; }
.pm-day { fill: none; stroke-width: 3.4; stroke-linejoin: round; stroke-linecap: round; }
.pm-day--1 { stroke: var(--sy-terracotta); }
.pm-day--2 { stroke: var(--sy-ink); }
.pm-day--3 { stroke: var(--sy-terracotta-deep); stroke-dasharray: 9 5; }
.pm-day--4 { stroke: var(--sy-ink-3); stroke-dasharray: 2 5; }
.pm-start { fill: var(--sy-ink); stroke: var(--sy-surface); stroke-width: 2.5; }
.pm-end { fill: var(--sy-surface); stroke: var(--sy-ink); stroke-width: 2.5; }
.pm-mark { fill: none; stroke: var(--sy-ink); stroke-width: 1.6; stroke-linejoin: round; stroke-linecap: round; }
.pm-mark__bg { fill: var(--sy-surface); stroke: var(--sy-ink); stroke-width: 1.2; }
.pm-mark--access path, .pm-mark--access circle:not(.pm-mark__bg) { fill: var(--sy-ink); stroke: none; }
.pm-mark.is-top { stroke: var(--sy-terracotta-deep); }
.pm-mark.is-top .pm-mark__bg { stroke: var(--sy-terracotta); stroke-width: 1.6; }
.pm-mark.is-top path { fill: var(--sy-terracotta); stroke: var(--sy-terracotta); }
.pm-mark.is-night { stroke: var(--sy-surface); }
.pm-mark.is-night .pm-mark__bg { fill: var(--sy-terracotta-text); stroke: var(--sy-terracotta-text); }
.pm-dot { fill: var(--sy-surface); stroke: var(--sy-ink-3); stroke-width: 1.4; }
.pm-label { font-size: 13.5px; font-weight: 700; fill: var(--sy-ink); paint-order: stroke; stroke: var(--sy-surface); stroke-width: 4px; stroke-linejoin: round; }
.pm-label.is-top { fill: var(--sy-terracotta-deep); }
.pm-label.is-night { fill: var(--sy-terracotta-deep); }
.pm-label__ele { font: 600 13.5px var(--sy-font-data); }
.pm-tag rect { fill: var(--sy-terracotta); }
.pm-tag--2 rect { fill: var(--sy-ink); }
.pm-tag--3 rect { fill: var(--sy-terracotta-deep); }
.pm-tag--4 rect { fill: var(--sy-ink-3); }
.pm-tag text { font: 700 11.5px var(--sy-font-data); letter-spacing: 0.04em; fill: var(--sy-surface); }
.pm-scale path { fill: none; stroke: var(--sy-ink); stroke-width: 1.5; }
.pm-scale text, .pm-north text { font: 600 11px var(--sy-font-data); letter-spacing: 0.04em; fill: var(--sy-ink); }
.pm-north path { fill: var(--sy-ink); }
.pm-walked { fill: none; stroke: var(--sy-terracotta); stroke-width: 7; stroke-linejoin: round; stroke-linecap: round; opacity: 0.35; }
.pm-now__dot { fill: var(--sy-terracotta-text); stroke: var(--sy-surface); stroke-width: 3; }
.pm-now__ring { fill: none; stroke: var(--sy-ink); stroke-width: 1.5; }
.pm-now__t { font: 700 13px var(--sy-font-text); fill: var(--sy-ink); paint-order: stroke; stroke: var(--sy-surface); stroke-width: 4px; stroke-linejoin: round; }
.pm-now__halo { fill: var(--sy-terracotta); opacity: 0.35; transform-box: fill-box; transform-origin: center; animation: pm-pulse 2.2s ease-out infinite; }
@keyframes pm-pulse { 0% { transform: scale(0.5); opacity: 0.5; } 100% { transform: scale(1.6); opacity: 0; } }

/* ── 路線圖這一頁 ── */
.sy-map__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 24px; }
.sy-map__note { margin: 0; max-width: 30em; font-size: 13px; line-height: 1.6; color: var(--sy-muted); }
.sy-map { margin: 0; }
.sy-map__plot { min-height: 240px; margin: 0 calc(var(--plan-pad) * -0.35); }
.sy-map__lg { text-align: left; display: grid; gap: 10px; margin-top: 10px; padding-top: 12px; border-top: 1px solid var(--sy-ink); }
.sy-maplg { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.sy-maplg__i { display: grid; grid-template-columns: 34px auto auto minmax(0, 1fr) auto; gap: 12px; align-items: baseline; padding: 8px 0; border-bottom: 1px solid var(--sy-line); font-size: 15px; }
.sy-maplg__sw { align-self: center; height: 0; border-top: 3.4px solid var(--sy-terracotta); border-radius: 2px; }
.sy-maplg__i--2 .sy-maplg__sw { border-top-color: var(--sy-ink); }
.sy-maplg__i--3 .sy-maplg__sw { border-top: 3.4px dashed var(--sy-terracotta-deep); }
.sy-maplg__i--4 .sy-maplg__sw { border-top: 3.4px dotted var(--sy-ink-3); }
.sy-maplg__i b { font: 600 18px/1 var(--sy-font-data); color: var(--sy-terracotta-text); }
.sy-maplg__d { font: 500 14px var(--sy-font-data); color: var(--sy-ink-3); white-space: nowrap; }
.sy-maplg__r { min-width: 0; color: var(--sy-ink); font-weight: 700; }
.sy-maplg__k { font: 600 16px var(--sy-font-data); white-space: nowrap; }
.sy-maplg__k i { font: 400 12px var(--sy-font-text); font-style: normal; color: var(--sy-muted); }
.sy-map__keys { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 18px; margin: 0; font-size: 13px; color: var(--sy-ink-3); }
.sy-map__k { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.sy-map__key { display: inline-grid; place-items: center; width: 18px; height: 18px; margin-left: 0; border-radius: 50%; border: 1.4px solid var(--sy-ink); background: var(--sy-surface); color: var(--sy-ink); }
.sy-map__key:first-child { margin-left: 0; }
.sy-map__key .sy-icon { width: 11px; height: 11px; stroke-width: 2.2; }
.sy-map__key--start { width: 11px; height: 11px; background: var(--sy-ink); }
.sy-map__key--end { width: 11px; height: 11px; border-width: 2.4px; }
.sy-map__key--camp { background: var(--sy-terracotta-text); border-color: var(--sy-terracotta-text); color: var(--sy-surface); }
.sy-map__key--peak { border-color: var(--sy-terracotta); color: var(--sy-terracotta); }
.sy-map__key--peak .sy-icon { fill: var(--sy-terracotta); }

/* ── 出發前倒數 ── */
.sy-pprep { margin-top: 36px; padding-top: 12px; border-top: 1px solid var(--sy-ink); }
.sy-pprep__sub { margin: 0; font: 500 14px var(--sy-font-data); color: var(--sy-muted); letter-spacing: 0.02em; }
.sy-pprep__list { margin: 8px 0 0; padding: 0; list-style: none; counter-reset: prep; }
.sy-pprep__i { position: relative; display: grid; grid-template-columns: 30px 104px minmax(0, 1fr) auto; gap: 4px 14px; align-items: start; padding: 12px 0; border-bottom: 1px solid var(--sy-line); }
.sy-pprep__chk { display: grid; place-items: center; min-height: 28px; cursor: pointer; }
.sy-pprep__chk input { width: 20px; height: 20px; margin: 0; accent-color: var(--sy-terracotta-text); cursor: pointer; }
.sy-pprep__date { display: grid; gap: 3px; }
.sy-pprep__date b { font: 600 20px/1.1 var(--sy-font-data); letter-spacing: 0.01em; }
.sy-pprep__date i { font: 500 12px/1.2 var(--sy-font-text); font-style: normal; color: var(--sy-muted); }
.sy-pprep__body { display: grid; gap: 3px; min-width: 0; }
.sy-pprep__body b { font-size: 16px; line-height: 1.45; }
.sy-pprep__body > span { font-size: 14px; line-height: 1.65; color: var(--sy-ink-3); }
.sy-pprep__body a { display: inline-flex; align-items: center; gap: 4px; color: var(--sy-terracotta-deep); font-weight: 700; text-decoration: underline; text-decoration-color: var(--sy-terracotta-tint); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.sy-pprep__body a .sy-icon { width: 15px; height: 15px; }
.sy-pprep__when { padding: 4px 10px; border-radius: var(--sy-radius-pill); background: var(--sy-sand); font: 600 13px/1.3 var(--sy-font-digits); color: var(--sy-ink-2); white-space: nowrap; }
.sy-pprep__i.is-today .sy-pprep__when { background: var(--sy-ink); color: var(--sy-paper); }
.sy-pprep__i.is-past:not(.is-done) .sy-pprep__when { background: var(--sy-terracotta-wash); color: var(--sy-terracotta-deep); }
.sy-pprep__i.is-done .sy-pprep__when { background: none; color: var(--sy-muted); padding-left: 0; padding-right: 0; }
.sy-pprep__i.is-done .sy-pprep__body b { color: var(--sy-muted); text-decoration: line-through; text-decoration-color: var(--sy-line-strong); }
.sy-pprep__i.is-done .sy-pprep__date b { color: var(--sy-muted); }

/* ── 每天一頁：日出日落與頭燈 ── */
.sy-day__sun { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 22px; margin: 14px 0 0; font-size: 14px; color: var(--sy-ink-3); }
.sy-day__sun > span { display: inline-flex; align-items: center; gap: 6px; }
.sy-day__sun .sy-icon { width: 17px; height: 17px; color: var(--sy-ink-3); }
.sy-day__sun b { font: 600 17px/1 var(--sy-font-data); letter-spacing: 0.02em; color: var(--sy-ink); }
.sy-day__sun .is-lamp, .sy-day__sun .is-lamp .sy-icon, .sy-day__sun .is-lamp b { color: var(--sy-terracotta-deep); }
.sy-day__dawn, .sy-day__fix {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 36px; padding: 0 14px;
  border: 1px solid var(--sy-line-strong); border-radius: var(--sy-radius-pill);
  background: var(--sy-surface); color: var(--sy-ink-2);
  font: 700 13px/1.2 var(--sy-font-text); cursor: pointer;
  transition: border-color var(--sy-dur-1) ease, background-color var(--sy-dur-1) ease, color var(--sy-dur-1) ease;
}
.sy-day__dawn { margin-left: auto; }
.sy-day__dawn .sy-icon { color: var(--sy-terracotta); }
.sy-day__dawn:hover, .sy-day__fix:hover { border-color: var(--sy-terracotta-text); background: var(--sy-terracotta-wash); color: var(--sy-terracotta-deep); }
.sy-day__dawn:focus-visible, .sy-day__fix:focus-visible { outline: 2px solid var(--sy-terracotta-text); outline-offset: 2px; }
.sy-day__warn { align-items: center; flex-wrap: wrap; }
.sy-day__warn > span { flex: 1 1 20em; }
.sy-day__warn .sy-icon { fill: none; stroke: var(--sy-terracotta-deep); width: 18px; height: 18px; margin-top: 0; align-self: flex-start; }
.sy-day__fix { border-color: var(--sy-terracotta-text); color: var(--sy-terracotta-deep); }
.sy-day__head:focus { outline: none; }
.sy-tt__lamp { display: inline-grid; place-items: center; width: 20px; height: 20px; margin-left: 4px; vertical-align: 1px; color: var(--sy-terracotta-deep); }
.sy-tt__lamp .sy-icon { width: 15px; height: 15px; }
.sy-prof__dark { fill: rgba(31, 23, 19, 0.07); }
.sy-prof__sunline { stroke: var(--sy-terracotta); stroke-width: 1; stroke-dasharray: 2 3; vector-effect: non-scaling-stroke; }
.sy-prof__sun {
  position: absolute; bottom: 6px; transform: translateX(5px);
  display: inline-flex; align-items: center; gap: 3px;
  font: 600 12px/1 var(--sy-font-data); letter-spacing: 0.02em; color: var(--sy-terracotta-deep); white-space: nowrap;
  text-shadow: 0 0 2px var(--sy-surface), 0 0 4px var(--sy-surface);
}
.sy-prof__sun.is-left { transform: translateX(calc(-100% - 5px)); }
.sy-prof__sun .sy-icon { width: 13px; height: 13px; }
.sy-prof--day .sy-prof__plot { margin-top: 40px; }

/* ── 休息：小晶片（點了就是原生選單；不停＝虛線淡色） ── */
.sy-tt__rest .sy-tt__meta { display: none; }
.sy-rest { display: inline-block; }
.sy-tt__rest .sy-rest select {
  width: auto; min-height: 32px; padding: 0 24px 0 11px;
  border: 1px solid var(--sy-line-strong); border-radius: var(--sy-radius-pill);
  background-color: var(--sy-terracotta-wash); background-position: right 6px center; background-size: 13px;
  font: 600 13px/1 var(--sy-font-digits); color: var(--sy-terracotta-deep);
}
.sy-tt__rest .sy-rest.is-zero select { background-color: transparent; border-style: dashed; color: var(--sy-muted); font-weight: 500; }
.sy-tt__rest .sy-rest select:hover { border-color: var(--sy-terracotta-text); }

/* ── 給留守人：訊息＋對方畫面的預覽 ── */
.sy-share__grid { display: grid; grid-template-columns: minmax(0, 1fr) 168px; gap: 18px; align-items: start; }
.sy-share__msgwrap .sy-share__whath { margin-top: 0; }
.sy-share__msg {
  display: block; width: 100%; margin-bottom: 8px; padding: 12px 14px;
  border: 1px solid var(--sy-line-strong); border-radius: var(--sy-radius);
  background: var(--sy-surface); color: var(--sy-ink); resize: none;
  font: 400 14px/1.7 var(--sy-font-text);
}
.sy-share__peek { margin: 0; }
.sy-share__peek figcaption { margin-top: 6px; font-size: 12px; text-align: center; color: var(--sy-muted); }
.sy-peek { padding: 14px 12px 12px; border-radius: 14px; background: var(--sy-dusk); color: var(--sy-on-dusk); box-shadow: 0 0 0 5px var(--sy-ink), var(--sy-shadow-pop); }
.sy-peek__l { margin: 0; font-size: 10px; letter-spacing: 0.08em; color: var(--sy-on-dusk-muted); }
.sy-peek__t { margin: 2px 0 0; display: grid; }
.sy-peek__t span { font: 500 11px var(--sy-font-data); color: var(--sy-on-dusk); }
.sy-peek__t b { font: 600 30px/1 var(--sy-font-data); color: var(--sy-on-dusk-accent); letter-spacing: -0.01em; }
.sy-peek__now { display: flex; align-items: center; gap: 6px; margin: 10px 0 6px; font-size: 10.5px; color: var(--sy-on-dusk); }
.sy-peek__now i { width: 7px; height: 7px; border-radius: 50%; background: var(--sy-on-dusk-accent); box-shadow: 0 0 0 3px rgba(240, 161, 132, 0.3); }
.sy-peek__map { position: relative; height: 4px; border-radius: 2px; background: rgba(242, 237, 230, 0.2); }
.sy-peek__map span { position: absolute; left: 0; top: 0; bottom: 0; width: 42%; border-radius: 2px; background: var(--sy-on-dusk-accent); }
.sy-peek__call { display: flex; align-items: center; gap: 5px; margin: 12px 0 0; padding: 6px 8px; border-radius: 6px; background: var(--sy-dusk-2); font-size: 10.5px; color: var(--sy-on-dusk); }
.sy-peek__call .sy-icon { width: 11px; height: 11px; color: var(--sy-on-dusk-accent); }

/* ══════════════════════════════════════════════════════════════
   留守人卡 v2（plan-guardian.js）
   ══════════════════════════════════════════════════════════════ */
.sy-g { padding: 0; overflow: hidden; }
.sy-g__stamp { display: block; margin-top: 6px; font-size: 13px; color: var(--sy-muted); }
.sy-g__now { padding: clamp(22px, 4vw, 44px) var(--plan-pad) clamp(22px, 3vw, 36px); background: var(--sy-dusk); color: var(--sy-on-dusk); }
.sy-g__phase { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0; font-size: 14px; font-weight: 700; letter-spacing: 0.06em; color: var(--sy-on-dusk); }
.sy-g__phase span { margin-left: auto; font: 500 13px var(--sy-font-data); color: var(--sy-on-dusk-muted); letter-spacing: 0.04em; }
.sy-g__pulse { position: relative; width: 9px; height: 9px; border-radius: 50%; background: var(--sy-on-dusk-accent); }
.sy-g__pulse::after { content: ""; position: absolute; inset: -5px; border-radius: 50%; border: 2px solid var(--sy-on-dusk-accent); opacity: 0; animation: sy-gpulse 2.4s ease-out infinite; }
@keyframes sy-gpulse { 0% { transform: scale(0.4); opacity: 0.8; } 100% { transform: scale(1.5); opacity: 0; } }
.sy-g__now.is-before .sy-g__pulse, .sy-g__now.is-camp .sy-g__pulse { background: var(--sy-on-dusk-muted); }
.sy-g__now.is-before .sy-g__pulse::after, .sy-g__now.is-camp .sy-g__pulse::after { display: none; }
.sy-g__big { margin: 14px 0 0; font: 700 clamp(24px, 2vw + 16px, 36px)/1.35 var(--sy-font-text); letter-spacing: -0.005em; text-wrap: balance; }
.sy-g__big b { color: var(--sy-on-dusk-accent); font-weight: 800; }
.sy-g__arrow { margin: 0 0.3em; color: var(--sy-on-dusk-muted); font-weight: 400; }
.sy-g__sub { max-width: 34em; margin: 8px 0 0; font-size: 15px; line-height: 1.7; color: var(--sy-on-dusk-muted); }
.sy-g__bar { margin-top: 22px; }
.sy-g__track { position: relative; height: 6px; border-radius: 3px; background: rgba(242, 237, 230, 0.16); }
.sy-g__fill { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 3px; background: linear-gradient(90deg, rgba(240, 161, 132, 0.5), var(--sy-on-dusk-accent)); transition: width 900ms var(--sy-ease-out); }
.sy-g__tick { position: absolute; top: -4px; bottom: -4px; width: 2px; margin-left: -1px; background: var(--sy-dusk); }
.sy-g__dot { position: absolute; top: 50%; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%; background: var(--sy-on-dusk-accent); border: 3px solid var(--sy-dusk); box-shadow: 0 0 0 2px var(--sy-on-dusk-accent); transition: left 900ms var(--sy-ease-out); }
.sy-g__dlabels { position: relative; height: 20px; margin-top: 8px; }
.sy-g__dayl { position: absolute; transform: translateX(-50%); font: 600 13px var(--sy-font-data); letter-spacing: 0.06em; color: var(--sy-on-dusk-muted); }
.sy-g__ends { display: flex; justify-content: space-between; gap: 12px; margin: 0; font-size: 12px; color: var(--sy-on-dusk-muted); }
.sy-g__alertrow { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 14px 28px; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--sy-dusk-line); }
.sy-g__cd, .sy-g__alert { display: grid; gap: 6px; margin: 0; }
.sy-g__cd span, .sy-g__alert span { font-size: 13px; letter-spacing: 0.06em; color: var(--sy-on-dusk-muted); }
.sy-g__cd b { font: 600 clamp(26px, 2vw + 18px, 38px)/1 var(--sy-font-digits); color: var(--sy-on-dusk); }
.sy-g__alert { text-align: right; }
.sy-g__now.is-overdue .sy-g__alert { text-align: left; }
.sy-g__alert b { font: 600 clamp(26px, 2vw + 18px, 40px)/1 var(--sy-font-data); color: var(--sy-on-dusk-accent); letter-spacing: 0.01em; }
.sy-g__acts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
/* 逾時：整塊轉成暗赭，三步驟放大 */
.sy-g__now.is-overdue { background: var(--sy-terracotta-deep); }
.sy-g__now.is-overdue .sy-g__big b { color: #fff; }
.sy-g__now.is-overdue .sy-g__sub, .sy-g__now.is-overdue .sy-g__phase span, .sy-g__now.is-overdue .sy-g__alert span { color: #F6D9CE; }
.sy-g__now.is-overdue .sy-g__pulse { background: #fff; }
.sy-g__now.is-overdue .sy-g__pulse::after { border-color: #fff; }
.sy-g__now.is-overdue .sy-g__alert b { color: #fff; }
.sy-g__now.is-overdue .sy-g__track { background: rgba(255, 255, 255, 0.22); }
.sy-g__now.is-overdue .sy-g__fill, .sy-g__now.is-overdue .sy-g__dot { background: #fff; }
.sy-g__now.is-overdue .sy-g__dot { border-color: var(--sy-terracotta-deep); box-shadow: 0 0 0 2px #fff; }
.sy-g__now.is-overdue .sy-g__tick { background: var(--sy-terracotta-deep); }
.sy-g__now.is-overdue .sy-g__alertrow { border-top-color: rgba(255, 255, 255, 0.25); }
.sy-g__steps { display: grid; gap: 10px; margin: 20px 0 0; padding: 0; list-style: none; counter-reset: gs; }
.sy-g__steps li > div { display: grid; gap: 2px; align-content: center; }
.sy-g__steps li { counter-increment: gs; display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 2px 12px; align-items: center; padding: 14px 16px; border-radius: var(--sy-radius); background: rgba(31, 23, 19, 0.28); font-size: 15px; line-height: 1.6; }
.sy-g__steps li::before { content: counter(gs); display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #fff; color: var(--sy-terracotta-deep); font: 700 18px/1 var(--sy-font-data); }
.sy-g__steps b { font-size: 17px; }
.sy-g__steps a { color: #fff; font-weight: 700; font-family: var(--sy-font-data); font-size: 17px; }
.sy-g__route { padding: 28px var(--plan-pad) 0; }
.sy-g__prof:empty { display: none; }
.sy-g__map { margin: 0 calc(var(--plan-pad) * -0.35); }
.sy-g__prof { margin-top: 10px; }
.sy-g__profplot { position: relative; height: 84px; }
.sy-g__profplot svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.sy-g__walked { fill: var(--sy-terracotta); opacity: 0.08; }
.sy-g__pnow { position: absolute; top: 0; bottom: 0; display: flex; align-items: flex-start; gap: 4px; padding-left: 6px; border-left: 1.5px solid var(--sy-terracotta-text); font: 600 11px var(--sy-font-data); color: var(--sy-terracotta-deep); white-space: nowrap; }
.sy-g__prof .sy-prof__axis { border-top: 1px solid var(--sy-ink); padding-top: 4px; }
.sy-g__call { margin: 28px var(--plan-pad) 0; padding: 18px 20px 16px; border: 1px solid var(--sy-ink); border-radius: var(--sy-radius); background: var(--sy-paper); }
.sy-g__callhead { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.sy-g__h { margin: 0; font: 700 18px/1.4 var(--sy-font-text); }
.sy-g__callacts { display: flex; gap: 8px; }
.sy-g__script { margin: 12px 0 0; padding-left: 14px; border-left: 3px solid var(--sy-terracotta); font-size: 16px; line-height: 1.85; color: var(--sy-ink); }
.sy-g__copied { min-height: 1.4em; margin: 6px 0 0; font-size: 13px; color: var(--sy-terracotta-deep); }
.sy-g__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 36px; padding: 32px var(--plan-pad) 0; }
.sy-g__days { padding: 32px 0 0; }
.sy-g__days > .sy-g__h { padding: 0 var(--plan-pad); }
.sy-g__days .sy-gcard__days { padding-top: 12px; }
.sy-g .sy-sheet__safety { padding: 0 var(--plan-pad) 20px; }

/* ── 進場：紙一張張落到桌上；剖面從左畫到右；路線從起點畫到終點（只在第一次與換路線時） ── */
@keyframes sy-sheet-in { from { opacity: 0; transform: translateY(26px) rotate(-0.35deg); } to { opacity: 1; transform: none; } }
@keyframes sy-wipe { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes pm-draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes sy-pop { from { opacity: 0; transform: scale(0.6); } to { opacity: 1; transform: none; } }
.is-entering > .sy-sheet { animation: sy-sheet-in 760ms var(--sy-ease-out) both; animation-delay: calc(min(var(--i, 0), 4) * 90ms); }
.is-entering .sy-prof__plot > svg { animation: sy-wipe 1300ms cubic-bezier(0.65, 0, 0.35, 1) both; animation-delay: 360ms; }
.is-entering .pm-day--1, .is-entering .pm-day--2 { stroke-dasharray: 1; animation: pm-draw 1500ms cubic-bezier(0.65, 0, 0.35, 1) both; animation-delay: calc(500ms + var(--i, 0) * 600ms); }
.is-entering .pm-day--3, .is-entering .pm-day--4, .is-entering .pm-casing { animation: sy-fade 600ms ease both; animation-delay: 1400ms; }
.is-entering .pm-mark, .is-entering .pm-tag, .is-entering .pm-labels { animation: sy-fade 500ms ease both; animation-delay: 1500ms; }
.is-entering .sy-cover__glyph .pm-day { animation-delay: 300ms; }
.sy-g__now { animation: sy-fade 500ms ease both; }

@media (max-width: 760px) {
  .sy-cover__head { grid-template-columns: minmax(0, 1fr) 76px; gap: 6px 14px; }
  .sy-cover__glyph { width: 84px; height: 84px; padding: 6px; }
  .sy-cover__glyph::after { display: none; }
  .sy-map__plot { margin: 0 -8px; }
  .sy-maplg__i { grid-template-columns: 26px auto minmax(0, 1fr) auto; gap: 2px 10px; }
  .sy-maplg__d { display: none; }
  .sy-maplg__r { font-size: 14px; }
  .sy-map__keys { display: grid; grid-template-columns: repeat(3, auto); justify-content: start; gap: 8px 18px; }
  .sy-pprep__i { grid-template-columns: 28px minmax(0, 1fr) auto; }
  .sy-pprep__date { grid-column: 2; grid-row: 1; display: flex; align-items: baseline; gap: 8px; }
  .sy-pprep__date b { font-size: 17px; }
  .sy-pprep__body { grid-column: 2 / -1; grid-row: 2; }
  .sy-pprep__when { grid-column: 3; grid-row: 1; justify-self: end; }
  .sy-day__sun { gap: 6px 16px; }
  .sy-day__dawn { margin-left: 0; }
  /* 時間表：海拔里程與休息晶片同一行 */
  .sy-tt tr { padding: 5px 0; row-gap: 1px; grid-template-areas: "t p n" "t r r"; }
  .sy-tt__name { line-height: 1.35; }
  .sy-tt .sy-night { width: 40px; height: 30px; }
  .sy-tt__night { align-self: start; display: flex !important; justify-content: center; }
  .sy-tt__rest .sy-rest { display: inline-flex; }
  .sy-tt__rest { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; padding-left: 34px !important; }
  .sy-tt__rest .sy-tt__meta { display: inline; }
  .sy-tt__rest .sy-rest select { min-height: 28px; margin: 0; font-size: 12.5px; }
  .sy-tt__rest:empty { display: block; }
  .sy-tt__lamp { display: block; margin: 2px 0 0; }
  .sy-share__grid { grid-template-columns: minmax(0, 1fr); }
  .sy-share__peek { display: none; }
  .sy-g__grid { grid-template-columns: minmax(0, 1fr); }
  .sy-g__alert { text-align: left; }
  .sy-g__call { margin-left: 16px; margin-right: 16px; padding: 16px; }
  .sy-g__callacts .sy-btn { padding: 0 14px; }
  .sy-g__script { font-size: 15px; }
  /* 手機：完成度壓成一行（數字｜刻度｜下一步），第一屏要看得到紙 */
  .sy-rail__sec--progress { padding: 0 0 10px; }
  /* 底部按鈕列：通報時間＋兩顆按鈕排成一列；Cookie 橫幅還在時往上推 */
  .sy-plan__bar { bottom: var(--plan-bar-lift, 0px); grid-template-columns: auto 1fr 1fr; align-items: center; padding-top: 8px; padding-bottom: calc(8px + env(safe-area-inset-bottom)); transition: bottom var(--sy-dur-2) var(--sy-ease-out); }
  .sy-plan__bar .sy-plan__bar-alert { grid-column: auto; display: grid; gap: 3px; justify-content: start; padding: 6px 10px; font-size: 11px; letter-spacing: 0.04em; }
  .sy-plan__bar .sy-plan__bar-alert b { font-size: 15px; }
  .sy-plan__bar.is-band-visible { grid-template-columns: 1fr 1fr; }
  .sy-plan { padding-bottom: 84px; }
  .sy-prog { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "h bar" "next next"; gap: 8px 12px; align-items: center; }
  .sy-prog__h { grid-area: h; margin: 0; gap: 6px; }
  .sy-prog__h span { display: none; }
  .sy-prog__h b { font-size: 20px; }
  .sy-prog__bar { grid-area: bar; }
  .sy-prog__next, .sy-prog__done { grid-area: next; margin: 0; min-height: 40px; padding: 6px 12px; font-size: 14px; }
  .sy-pidx--rail + .sy-rail__sec .sy-rail__h { display: none; }
  .sy-pidx--rail + .sy-rail__sec { padding-top: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  .is-tick, .sy-roll, .sy-dlg, .sy-dlg__scrim, .sy-skel span { animation: none; }
  .is-entering > .sy-sheet, .is-entering .sy-prof__plot > svg, .is-entering .pm-day, .is-entering .pm-casing,
  .is-entering .pm-mark, .is-entering .pm-tag, .is-entering .pm-labels, .pm-now__halo, .sy-g__pulse::after, .sy-g__now, .is-flag { animation: none; }
  .sy-g__fill, .sy-g__dot { transition: none; }
}

/* ══════════════════════════════════════════════════════════════
   列印：A4，一張紙一頁；空白欄位印成可以手寫的底線
   ══════════════════════════════════════════════════════════════ */
@media print {
  @page { size: A4; margin: 12mm 12mm 14mm; }
  html, body { background: #fff !important; }
  #hk-cookie-banner, .sy-plan__bar, .sy-plan__tools, .sy-demo, .sy-prof__tick, .sy-header, .sy-footer, .sy-skip, .sy-plan__head, .sy-plan__rail, .sy-plan__how, .sy-plan-dialog,
  .sy-team__add, .sy-team__note, .sy-iconbtn, .sy-block__bar .sy-check, .sy-day__note,
  .sy-tt__rest select, .sy-tt th:nth-child(5), .sy-tt__rest, .sy-plan__textlink, .sy-share__acts { display: none !important; }
  .site-content { padding: 0 !important; margin: 0 !important; }
  .sy-plan, .sy-plan__desk { background: #fff; border: 0; padding: 0; }
  .sy-plan__wrap { padding: 0; max-width: none; }
  .sy-plan__desk-in { display: block; }
  .sy-plan__stack { display: block; max-width: none; }
  .sy-sheet { box-shadow: none; padding: 0; border-radius: 0; break-after: page; }
  .sy-sheet:last-child { break-after: auto; }
  .sy-sheet__foot { margin-top: 18px; }
  .sy-plan input, .sy-plan select, .sy-plan textarea { border-color: var(--sy-line-strong) !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .sy-plan ::placeholder { color: transparent !important; }
  .sy-cover__title::placeholder { color: var(--sy-ink) !important; }
  .sy-cover__title { border: 0 !important; font-size: 34px; }
  .sy-plan select { background-image: none !important; }
  .sy-team__table td:last-child { display: none; }
  .sy-team__private[data-print] { display: block; }
  .sy-team__private[data-print] summary { display: none; }
  .sy-team__private[open] .sy-pform { position: static; box-shadow: none; border: 0; padding: 4px 0 0; width: auto; }
  .sy-team__table tr { break-inside: avoid; }
  .sy-tt thead { display: table-header-group; }
  .sy-eta { text-decoration: none; }
  .sy-day__memo { display: block; margin-top: 14px; border-top: 1px solid var(--sy-ink); font-size: 11px; color: var(--sy-muted); padding-top: 2px; break-inside: avoid; }
  .sy-day__memo i { display: block; height: 8mm; border-bottom: 1px solid var(--sy-line-strong); }
  /* 封面收緊，一張 A4 放得下剖面＋通報＋留守人＋隊伍 */
  .sy-sheet--cover .sy-cover__title { font-size: 30px; }
  .sy-sheet--cover .sy-pfacts { margin-top: 12px; padding-top: 8px; }
  .sy-sheet--cover .sy-prof--route .sy-prof__plot { margin-top: 34px; height: 104px; }
  .sy-sheet--cover .sy-alert { margin-top: 16px; }
  .sy-sheet--cover .sy-alert__t b { font-size: 40px; }
  .sy-sheet--cover .sy-cover__grid { margin-top: 16px; gap: 20px; }
  .sy-sheet--cover .sy-team { margin-top: 16px; }
  .sy-sheet--cover .sy-field input, .sy-team__table input, .sy-team__table select { min-height: 28px; padding: 2px 0; font-size: 13px; }
  .sy-sheet--cover .sy-block__h { margin-bottom: 6px; font-size: 15px; }
  .sy-sheet--cover .sy-block__p { font-size: 12px; margin-bottom: 4px; }
  .sy-alert { margin-left: 0; margin-right: 0; padding: 12px 16px; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .sy-alert__t b { font-size: 48px; }
  .sy-alert__pick select { border: 0 !important; background: none !important; padding: 0 !important; min-height: 0; color: var(--sy-on-dusk); font-weight: 700; }
  .sy-plan2 { gap: 10px 24px; }
  .sy-field textarea { min-height: 60px; font-size: 13px; line-height: 1.55; }
  .sy-gear { margin-top: 16px; }
  .sy-gear li { border-bottom: 0; line-height: 1.3; }
  .sy-field textarea { display: none; }
  .sy-field__print { display: block; min-height: 18mm; padding: 2px 0 4px; border-bottom: 1px solid var(--sy-line-strong); font-size: 12px; line-height: 1.6; white-space: pre-wrap; }
  .sy-gear .sy-check { min-height: 0; padding: 1px 0; font-size: 11px; }
  .sy-gear .sy-check input { width: 12px; height: 12px; }
  .sy-sheet__safety { margin-top: 12px; font-size: 11px; }
  .sy-tt tr { break-inside: avoid; }
  .sy-tt td { padding-top: 3px; padding-bottom: 3px; }
  .sy-tt__pl { min-height: 28px; }
  .sy-night { width: 28px; height: 24px; border: 0; }
  .sy-night:not([aria-pressed="true"]) { visibility: hidden; }
  .sy-night[aria-pressed="true"] { background: none; color: var(--sy-terracotta-deep); }
  .sy-alertline, .sy-gcard__alert, .sy-prof__area, .sy-tt__row.is-night td { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .sy-alert, .sy-prof, .sy-day__head, .sy-gear__col, .sy-team__table tr, .sy-field { break-inside: avoid; }
  .sy-block__h, .sy-block__bar, .sy-gear .sy-block__bar { break-after: avoid; }
  .sy-sheet--day.is-long .sy-day__memo { display: none; }
  .sy-prof--route .sy-prof__plot { height: 130px; }
  .sy-prof--day .sy-prof__plot { height: 96px; }
  .sy-gear__grid { columns: 3; }
  .sy-pfacts { grid-template-columns: repeat(6, auto); }
  .sy-cover__grid { grid-template-columns: 1.25fr 1fr; }
  .sy-plan2 { grid-template-columns: 1fr 1fr; }
  .sy-field textarea { overflow: visible; }
  a { text-decoration: none; color: inherit; }
}

/* 列印 v2：路線圖一頁（略圖＋圖例＋出發前清單）；按鈕類收掉；線條顏色照印 */
@media print {
  .sy-plan__tocbar, .sy-day__dawn, .sy-day__fix, .sy-cover__glyph, .sy-map__note, .sy-pprep__chk input { display: none !important; }
  .sy-cover__head { grid-template-columns: 1fr; }
  .sy-map__plot { margin: 0; }
  .sy-map__plot .pm { max-height: 150mm; width: 100%; }
  .pm-day, .pm-tag rect, .pm-mark__bg, .sy-maplg__sw, .sy-prof__dark, .sy-pprep__when { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .sy-maplg__i { padding: 4px 0; font-size: 12px; }
  .sy-map__keys { font-size: 11px; }
  .sy-pprep { margin-top: 14px; }
  .sy-pprep__i { grid-template-columns: 14px 80px minmax(0, 1fr) auto; padding: 5px 0; break-inside: avoid; }
  .sy-pprep__chk::before { content: ""; width: 10px; height: 10px; border: 1px solid var(--sy-ink-3); }
  .sy-pprep__date b { font-size: 14px; }
  .sy-pprep__body b { font-size: 12.5px; }
  .sy-pprep__body > span { font-size: 11px; line-height: 1.5; }
  .sy-pprep__when { font-size: 10px; padding: 2px 6px; }
  .sy-day__sun { margin-top: 8px; font-size: 11px; }
  .sy-day__sun b { font-size: 13px; }
  .sy-tt__lamp { width: 14px; height: 14px; }
  .sy-tt__lamp .sy-icon { width: 11px; height: 11px; }
}
.sy-g__sos { min-width: 160px; font-size: 18px; }
.sy-g__now.is-overdue .sy-g__sos { background: #fff; color: var(--sy-terracotta-deep); }
.sy-g__call { scroll-margin-top: calc(var(--header-h) + 16px); }

/* 時間表 ↔ 剖面連動游標（滑過一列，剖面上那一站亮起來） */
.sy-prof__cursor { position: absolute; top: 0; bottom: 0; width: 0; border-left: 1.5px solid var(--sy-ink); pointer-events: none; z-index: 2; }
.sy-prof__cursor[hidden] { display: none; }
.sy-prof__cursor i { position: absolute; left: -6px; top: var(--y); width: 11px; height: 11px; margin-top: -5.5px; border-radius: 50%; background: var(--sy-ink); box-shadow: 0 0 0 3px var(--sy-surface); }
.sy-prof__cursor b { position: absolute; left: 8px; top: -4px; transform: translateY(-100%); padding: 4px 8px; border-radius: var(--sy-radius-sm); background: var(--sy-ink); color: var(--sy-paper); font: 600 12px/1.2 var(--sy-font-data); letter-spacing: 0.02em; white-space: nowrap; }
.sy-prof__cursor.is-left b { left: auto; right: 8px; }
.sy-prof--day.is-cursor .sy-prof__lab { opacity: 0.25; transition: opacity var(--sy-dur-1) ease; }
.sy-tt__row:hover td, .sy-tt__row:focus-within td { background-color: var(--sy-terracotta-wash); }
.sy-tt__row.is-night:hover td { background-color: var(--sy-terracotta-tint); }
@media (hover: none) { .sy-prof__cursor { display: none !important; } }
@media print { .sy-prof__cursor { display: none !important; } }
/* 列印：站點多（>11）的那一天收緊，整天塞進一張 A4（頁尾不要孤單跑到下一頁） */
@media print {
  .sy-sheet--day.is-long .sy-prof--day .sy-prof__plot { height: 72px; margin-top: 30px; }
  .sy-sheet--day.is-long .sy-tt td { padding-top: 1px; padding-bottom: 1px; }
  .sy-sheet--day.is-long .sy-tt__pl { min-height: 24px; }
  .sy-sheet--day.is-long .sy-eta { font-size: 17px; }
  .sy-sheet--day.is-long .sy-day__facts { margin-top: 8px; padding-top: 6px; }
  .sy-sheet--day.is-long .sy-tt { margin-top: 12px; }
  .sy-sheet--day.is-long .sy-sheet__foot { margin-top: 10px; }
  .sy-sheet__foot { break-before: avoid; break-inside: avoid; }
}

@media print {
  .sy-field select { min-height: 26px; padding: 0 !important; border: 0 !important; border-bottom: 1px solid var(--sy-line-strong) !important; border-radius: 0 !important; background: none !important; font-size: 13px; }
}