/* 島引屏東：在島引馬祖的設計系統（vendor/portal.css、tokens、bundle）之上，只補屏東專用的元件。
   顏色一律用島引馬祖的變數（--dl-*、--surface、--ink…），不另訂一套。 */

/* 首頁活圖 */
.pt-hero .dl-hero__stage { background: var(--dl-paper); }
.pt-lg { display: inline-block; width: 14px; height: 10px; margin-right: 6px; vertical-align: -1px; }
.pt-lg--wind { border-top: 1.4px solid #0a4e55; height: 0; width: 14px; position: relative; top: -3px; }
.pt-lg--boat { width: 10px; height: 6px; background: #c2560c; clip-path: polygon(0 0, 100% 0, 80% 100%, 20% 100%); }
.pt-lg--pin { width: 8px; height: 8px; border-radius: 50%; background: #c2560c; box-shadow: 0 0 0 1.5px #fff; }

/* 頁首橫幅（統一後台設定） */
.ptbanner { padding: 10px 0; font-weight: 700; font-size: 15px; }
.ptbanner .dl-wrap { display: flex; gap: 8px; align-items: center; }
.ptbanner.is-info { background: var(--surface-tint); color: var(--tide); }
.ptbanner.is-warn { background: var(--hold-tint); color: var(--hold); }
.ptbanner.is-stop { background: var(--stop-tint); color: var(--stop); }

/* 首頁公告列 */
.pt-notice { display: grid; gap: 8px; padding-top: 24px; }
.pt-notice a { display: flex; gap: 10px; align-items: center; padding: 10px 14px; border: 1px solid var(--dl-hair); border-radius: 10px; text-decoration: none; color: var(--dl-ink); background: var(--dl-paper2, #fff); }
.pt-notice .dy-chip { pointer-events: none; }

.pt-rt { font-size: 18px !important; color: var(--dl-deep, #0a4e55); }
.dl-row__s.is-mut { color: var(--dl-ink3, #82949a); font-weight: 600; }
.pt-empty { list-style: none; padding: 16px 0; color: var(--dl-ink3, #82949a); font-size: 14px; }
.pt-art { position: absolute; inset: 0; }
.pt-art svg { width: 100%; height: 100%; display: block; }

/* 景點照片列 */
.pt-picks { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 16px; border-top: 2px solid var(--dl-ink); padding-top: 18px; }
@media (max-width: 1000px) { .pt-picks { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 560px) { .pt-picks { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } }
.pt-pick { display: flex; flex-direction: column; gap: 4px; text-decoration: none; color: var(--dl-ink); min-width: 0; }
.pt-pick__img { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 2px; background: #e6ebea; }
.pt-pick__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.pt-pick:hover .pt-pick__img img { transform: scale(1.04); }
.pt-pick b { font: 700 16px/1.35 var(--dl-serif); margin-top: 6px; }
.pt-pick small { color: var(--dl-ink3, #82949a); font-size: 13px; }

.pt-entpick { margin-top: 56px; }

/* 內頁標題（數據語言：紙白、粗襯線大標、一句結論） */
.pt-head { padding: 36px 0 8px; }
.pt-head .dl-eyebrow { margin-bottom: 10px; }
.pt-head .dl-title { font-size: clamp(30px, 5vw, 46px); }
.pt-head .pt-lead { margin: 12px 0 0; color: var(--dl-ink2, #56676c); font-size: 16px; max-width: 760px; line-height: 1.7; }
.pt-stamp { margin-top: 14px; font-size: 12.5px; color: var(--dl-ink3, #82949a); }
.pt-stamp a { color: inherit; }
.pt-stamp.is-stale { color: var(--dl-hold); }

/* 篩選列 */
.pt-chips { display: flex; gap: 6px; flex-wrap: wrap; margin: 4px 0 18px; }
.pt-chips .dy-chip { text-decoration: none; }

/* 地點卡片（景點、餐飲、住宿） */
.pt-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px 20px; border-top: 2px solid var(--dl-ink); padding-top: 20px; }
@media (max-width: 1000px) { .pt-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .pt-cards { grid-template-columns: minmax(0, 1fr); gap: 18px; } }
.pt-card { display: grid; grid-template-rows: auto 1fr; text-decoration: none; color: var(--dl-ink); min-width: 0; }
.pt-card__img { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; border-radius: 2px; background: #e6ebea; }
.pt-card__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pt-card__b { padding-top: 10px; min-width: 0; }
.pt-card__b h3 { font: 700 19px/1.35 var(--dl-serif); margin: 0; }
.pt-card__m { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 4px; font-size: 13px; color: var(--dl-ink3, #82949a); }
.pt-card__x { margin: 6px 0 0; font-size: 14px; line-height: 1.65; color: var(--dl-ink2, #56676c); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 560px) {
  .pt-card { grid-template-columns: 112px minmax(0, 1fr); grid-template-rows: none; gap: 12px; }
  .pt-card__img { aspect-ratio: 1 / 1; }
  .pt-card__b { padding-top: 0; }
  .pt-card__b h3 { font-size: 16px; }
  .pt-card__x { -webkit-line-clamp: 2; font-size: 13px; }
}

/* 清單表（住宿、測站） */
.pt-tbl { width: 100%; border-collapse: collapse; font-size: 14px; border-top: 2px solid var(--dl-ink); }
.pt-tbl th, .pt-tbl td { text-align: left; padding: 10px 8px; border-bottom: 1px solid var(--dl-hair); vertical-align: top; }
.pt-tbl th { font-size: 12px; color: var(--dl-ink3, #82949a); font-weight: 600; }
.pt-tbl td.num { font-family: var(--dl-mono); white-space: nowrap; }
.pt-scroll { overflow-x: auto; }

/* 地點詳細頁 */
.pt-place { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 40px; padding-top: 8px; }
@media (max-width: 900px) { .pt-place { grid-template-columns: minmax(0, 1fr); gap: 24px; } }
.pt-gal { display: grid; gap: 8px; }
.pt-gal img { width: 100%; border-radius: 2px; display: block; background: #e6ebea; }
.pt-gal .pt-gal__more { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.pt-gal .pt-gal__more img { aspect-ratio: 4 / 3; object-fit: cover; }
.pt-facts { border-top: 2px solid var(--dl-ink); }
.pt-facts dl { margin: 0; display: grid; grid-template-columns: 76px minmax(0, 1fr); }
.pt-facts dt, .pt-facts dd { padding: 10px 0; border-bottom: 1px solid var(--dl-hair); margin: 0; font-size: 15px; }
.pt-facts dt { color: var(--dl-ink3, #82949a); font-size: 13px; padding-top: 12px; }
.pt-desc { font-size: 16px; line-height: 1.9; color: var(--dl-ink); margin: 18px 0 0; }
.pt-map { height: 280px; border-radius: 2px; margin-top: 18px; border: 1px solid var(--dl-hair); }

/* 一般內文區塊（文史、生活、節慶…） */
.pt-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 40px; border-top: 2px solid var(--dl-ink); }
@media (max-width: 760px) { .pt-grid { grid-template-columns: minmax(0, 1fr); } }
.pt-item { padding: 18px 0; border-bottom: 1px solid var(--dl-hair); min-width: 0; }
.pt-item h3 { font: 700 20px/1.35 var(--dl-serif); margin: 0; }
.pt-item .pt-item__k { font: 600 13px/1.5 var(--dl-sans); color: var(--dl-warm, #c2560c); margin-top: 4px; }
.pt-item p { margin: 8px 0 0; font-size: 15px; line-height: 1.8; color: var(--dl-ink2, #56676c); }
.pt-src { font-size: 12px; color: var(--dl-ink3, #82949a); margin-left: 6px; white-space: nowrap; }
.pt-tbd { color: var(--dl-hold); }

/* 大數字格（天氣、空品） */
.pt-nums { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 2px solid var(--dl-ink); }
@media (max-width: 760px) { .pt-nums { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.pt-num { padding: 16px 14px 16px 0; border-bottom: 1px solid var(--dl-hair); min-width: 0; }
.pt-num + .pt-num { padding-left: 14px; border-left: 1px solid var(--dl-hair); }
@media (max-width: 760px) { .pt-num:nth-child(2n+1) { padding-left: 0; border-left: 0; } }
.pt-num__k { font-size: 13px; color: var(--dl-ink3, #82949a); display: flex; gap: 6px; align-items: center; }
.pt-num__v { font: 600 32px/1.15 var(--dl-mono); margin-top: 6px; color: var(--dl-ink); }
.pt-num__v small { font: 500 13px/1 var(--dl-sans); color: var(--dl-ink3, #82949a); margin-left: 4px; }
.pt-num__v.is-go { color: var(--dl-go, #186b43); } .pt-num__v.is-hold { color: var(--dl-hold); } .pt-num__v.is-stop { color: var(--dl-stop); }
.pt-num__l { font-size: 13px; margin-top: 4px; color: var(--dl-ink2, #56676c); }

/* 鄉鎮逐 3 小時 */
.pt-hours { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(64px, 1fr); overflow-x: auto; border-bottom: 1px solid var(--dl-hair); }
.pt-hour { padding: 10px 6px; text-align: center; border-left: 1px solid var(--dl-hair); min-width: 0; }
.pt-hour:first-child { border-left: 0; }
.pt-hour__t { font: 600 13px/1 var(--dl-mono); color: var(--dl-ink3, #82949a); }
.pt-hour__w { font-size: 13px; margin-top: 6px; min-height: 2.6em; line-height: 1.3; }
.pt-hour__v { font: 600 20px/1 var(--dl-mono); margin-top: 4px; }
.pt-hour__p { font-size: 12px; margin-top: 4px; color: var(--tide); }
.pt-town { padding: 18px 0 6px; }
.pt-town h3 { font: 700 20px/1.3 var(--dl-serif); margin: 0 0 8px; }

/* 船班時刻表 */
.pt-sched { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 40px; }
@media (max-width: 760px) { .pt-sched { grid-template-columns: minmax(0, 1fr); } }
.pt-times { display: flex; flex-wrap: wrap; gap: 6px; padding: 12px 0; }
.pt-time { display: inline-flex; flex-direction: column; align-items: flex-start; padding: 6px 10px; border: 1px solid var(--dl-hair); border-radius: 8px; min-width: 76px; }
.pt-time b { font: 600 17px/1.1 var(--dl-mono); }
.pt-time small { font-size: 11px; color: var(--dl-ink3, #82949a); margin-top: 3px; }
.pt-time.is-past { opacity: .42; }
.pt-time.is-next { border-color: var(--dl-warm, #c2560c); box-shadow: inset 0 0 0 1px var(--dl-warm, #c2560c); }
.pt-time.is-next b { color: var(--dl-warm, #c2560c); }

/* 路線卡 */
.pt-routes { border-top: 2px solid var(--dl-ink); }
.pt-route { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 14px; padding: 18px 0; border-bottom: 1px solid var(--dl-hair); }
.pt-route__ic { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--surface-tint); color: var(--tide); }
.pt-route h3 { font: 700 19px/1.35 var(--dl-serif); margin: 0; }
.pt-route__ft { font-size: 14px; color: var(--dl-ink2, #56676c); margin-top: 2px; }
.pt-route__k { display: flex; flex-wrap: wrap; gap: 4px 18px; margin-top: 8px; font-size: 14px; }
.pt-route__k span { color: var(--dl-ink3, #82949a); }
.pt-route__k b { color: var(--dl-ink); font-weight: 600; margin-left: 4px; }
.pt-route__n { font-size: 13.5px; color: var(--dl-ink2, #56676c); margin-top: 8px; line-height: 1.7; }

/* 搜尋 */
.pt-search { display: flex; gap: 8px; max-width: 640px; }
.pt-search input { flex: 1; min-height: 44px; padding: 0 14px; font: inherit; font-size: 16px; border: 1px solid var(--line-strong); border-radius: 10px; background: var(--surface-raised); color: var(--ink); }

/* 電話 */
.pt-tel { font: 600 22px/1.2 var(--dl-mono); color: var(--dl-ink); text-decoration: none; }

/* 島引馬祖這些元件是按鈕，這裡是連結：拿掉底線 */
a.viewtab, a.botnav__b, a.subnav__t, a.dl-cell, a.entpick__t, a.srchbtn, a.console-toggle, a.dl-btn, a.sharefab, .dl-alist__t, .dl-news__t a, .booklink, .dl-sh__go { text-decoration: none; }
a.dl-cell { color: var(--dl-ink); }
a.dl-cell:hover { background: rgba(12,112,120,.05); }
@media (max-width: 760px) { .pt-hero .dl-hero__spacer.has-fig { min-height: 330px; } }
/* 篩選鈕：照介面標準 36px 高（島引馬祖的 dy-chip 在這裡是連結，會被撐高） */
.pt-chips .dy-chip { display: inline-flex; align-items: center; gap: 6px; height: 36px; min-height: 36px; padding: 0 14px; line-height: 1; white-space: nowrap; }
@media (max-width: 560px) { .pt-chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; } .pt-chips::-webkit-scrollbar { display: none; } }
.pt-lg--flow { width: 16px; height: 0; border-top: 1.2px dashed rgba(10,78,85,.6); position: relative; top: -3px; }

/* 三個入口 */
.pt-entpick__grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
@media (max-width: 760px) { .pt-entpick__grid { grid-template-columns: minmax(0, 1fr) !important; } }
.pt-entsw__m { position: absolute; top: calc(100% + 6px); left: 0; z-index: 60; width: min(340px, calc(100vw - 24px)); background: var(--surface-raised, #fff); border: 1px solid var(--line-strong); border-radius: 14px; box-shadow: 0 10px 28px rgba(16,36,42,.14); padding: 6px; display: grid; gap: 2px; }
.pt-entsw__m[hidden] { display: none; }
.pt-entsw__m a { display: grid; grid-template-columns: 36px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 10px; align-items: center; padding: 10px; border-radius: 10px; text-decoration: none; color: var(--ink); }
.pt-entsw__m a:hover, .pt-entsw__m a.is-on { background: color-mix(in srgb, var(--ent-c) 9%, transparent); }
.pt-entsw__m .entbdg { grid-row: 1 / span 2; }
.pt-entsw__m b { font-family: var(--font-serif, serif); font-size: 17px; }
.pt-entsw__m small { color: var(--ink-muted); font-size: 12.5px; }
.pt-entsw__m a.entsw__all { display: block; color: var(--ink-muted); font-size: 13px; border-top: 1px solid var(--line); border-radius: 0; margin-top: 4px; }
.pt-entsw .entsw__b { color: var(--ent-c); }
@media (max-width: 760px) { .pt-entsw__m { position: fixed; left: 12px; right: 12px; width: auto; top: 64px; } }

/* 文史入口主視覺 */
.pt-hhero { min-height: 640px; }
.pt-hhero .dl-hero__stage { background: var(--dl-paper); }
.pt-hhero__sp { flex: 1; min-height: 40px; }
@media (max-width: 760px) { .pt-hhero { min-height: 0; } .pt-hhero__sp { min-height: 520px; } }
.pt-say--mtn { color: #9c3a2c; } .pt-say--hakka { color: #0c7078; }
.pt-sw { display: inline-block; width: 12px; height: 12px; border-radius: 2px; margin-right: 6px; vertical-align: -1px; }
.pt-tip { position: absolute; z-index: 3; pointer-events: none; background: #10242a; color: #fff; font-size: 13px; padding: 5px 9px; border-radius: 6px; white-space: nowrap; }
.pt-how { margin-top: 14px; font-size: 13.5px; color: var(--dl-ink2, #56676c); max-width: 460px; position: relative; z-index: 2; }
.pt-how summary { cursor: pointer; display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border: 1px solid var(--dl-hair); border-radius: 999px; background: rgba(255,255,255,.7); font-weight: 600; color: var(--dl-ink); list-style: none; }
.pt-how summary::-webkit-details-marker { display: none; }
.pt-how ul { margin: 10px 0 0; padding: 12px 14px 12px 28px; background: rgba(255,255,255,.92); border: 1px solid var(--dl-hair); border-radius: 10px; line-height: 1.75; }

/* 數據藝廊（同島引馬祖 /art 的作品集版面） */
.pt-arthero { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 48px; align-items: end; padding: 56px 0 36px; }
@media (max-width: 860px) { .pt-arthero { grid-template-columns: minmax(0, 1fr); gap: 18px; padding: 36px 0 24px; } }
.pt-arthero__k { margin: 0 0 14px; font: 500 13px/1 var(--dl-mono); letter-spacing: .2em; color: var(--tide); }
.pt-arthero__h { margin: 0; font: 900 clamp(40px, 6vw, 80px)/1.08 var(--dl-serif); }
.pt-arthero__h span { white-space: nowrap; }
.pt-arthero__lead { margin: 0; font-size: 17px; line-height: 1.95; color: var(--dl-ink2, #56676c); }
.pt-arthero__lead b { color: var(--dl-ink); }
.pt-artrules { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 2px solid var(--dl-ink); border-bottom: 1px solid var(--dl-hair); margin-bottom: 48px; }
.pt-artrules div { padding: 18px 20px 20px 0; min-width: 0; }
.pt-artrules div + div { padding-left: 20px; border-left: 1px solid var(--dl-hair); }
.pt-artrules b { display: block; font: 700 19px/1.4 var(--dl-serif); margin-bottom: 4px; }
.pt-artrules span { font-size: 14px; color: var(--dl-ink2, #56676c); line-height: 1.75; }
@media (max-width: 860px) { .pt-artrules { grid-template-columns: minmax(0, 1fr); } .pt-artrules div + div { padding-left: 0; border-left: 0; border-top: 1px solid var(--dl-hair); } }
.pt-artlist { display: flex; flex-direction: column; gap: 28px; padding-bottom: 32px; }
.pt-pc { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); background: #fbfcfb; border: 1px solid var(--dl-hair); border-radius: 4px; overflow: hidden; text-decoration: none; color: var(--dl-ink); transition: border-color .2s; }
.pt-pc:hover { border-color: var(--tide); }
.pt-pc:nth-child(even) { grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); }
.pt-pc:nth-child(even) .pt-pc__im { order: 2; }
.pt-pc__im { position: relative; background: #e6ecea; aspect-ratio: 16 / 10; }
.pt-pc__im img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pt-pc__tx { padding: 28px 30px; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.pt-pc__no { font: 500 13px/1 var(--dl-mono); letter-spacing: .18em; color: var(--tide); }
.pt-pc h3 { margin: 0; font: 900 clamp(26px, 2.6vw, 34px)/1.25 var(--dl-serif); }
.pt-pc p { margin: 0; font-size: 15.5px; line-height: 1.85; color: var(--dl-ink2, #56676c); }
.pt-pc__ly { display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; padding-top: 8px; }
.pt-pc__ly span { font-size: 12.5px; padding: 3px 10px; border: 1px solid var(--dl-hair); border-radius: 999px; color: var(--dl-ink2, #56676c); background: #fff; }
.pt-pc__go { font-size: 14px; font-weight: 700; color: var(--tide); }
@media (max-width: 860px) { .pt-pc, .pt-pc:nth-child(even) { grid-template-columns: minmax(0, 1fr); } .pt-pc:nth-child(even) .pt-pc__im { order: 0; } .pt-pc__tx { padding: 20px; } }

/* 各頁主視覺活圖 */
.pt-pghero { min-height: 520px; height: auto; }
.pt-pghero .dl-hero__stage { background: var(--dl-paper); }
.pt-pghero__sp { flex: 1; min-height: 40px; }
.pt-pghero .pt-lead { max-width: 440px; position: relative; z-index: 2; }
@media (max-width: 760px) { .pt-pghero { min-height: 0; } .pt-pghero__sp { min-height: 380px; } .pt-pghero .pt-lead { max-width: none; } }
a.subnav__t, a.viewtab, a.botnav__b, a.dl-btn, a.dl-cell, a.entpick__t, a.srchbtn, a.sharefab, a.console-toggle { box-sizing: border-box; }
a.subnav__t { display: inline-flex; align-items: center; flex: none; line-height: 1.2; }

/* 開場動畫與等待畫面（照搬島引馬祖 app.html 的 .boot／.splash，2026-11-06） */
  .boot { position: fixed; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 24px;
          background: #f4f6f4; color: #10242a; font-family: var(--font-sans); overflow: hidden; z-index: 1; }
  /* 2026-10-18 換成標誌〈潮汐之 W〉的動態版（app/utils/brand_mark.py 的 full，伺服器組好 SVG，樣式在頁面裡的 brand_full_css）：
     今天福澳港的潮位曲線由左畫到右、收進圓裡成為標誌、橘點落在現在；約 3 秒播完停住。島嶼剪影與流線拿掉了 */
  .bootmark { width: min(440px, 90vw); }
  .boot__name { font-family: var(--font-serif); font-size: 30px; font-weight: 900; letter-spacing: .14em; margin: 4px 0 0; }
  .boot__line { margin: 0; font-family: var(--font-serif); font-size: 18px; color: #08484f; text-align: center; max-width: 30em; text-wrap: balance; }
  .boot__when { margin: -6px 0 0; font-size: 12.5px; color: #56676c; letter-spacing: .06em; }
  .boot__tips { position: relative; height: 22px; width: min(360px, 90vw); text-align: center; font-size: 14px; color: #56676c; }
  .boot__tips span { position: absolute; inset: 0; opacity: 0; animation: boottip 9s infinite; }
  .boot__tips span:nth-child(2) { animation-delay: 3s; } .boot__tips span:nth-child(3) { animation-delay: 6s; }
  @keyframes boottip { 0% { opacity: 0; transform: translateY(6px); } 6%, 30% { opacity: 1; transform: none; } 36%, 100% { opacity: 0; transform: translateY(-6px); } }
  .boot__bar { width: min(220px, 60vw); height: 2px; background: #d3dcda; overflow: hidden; border-radius: 2px; }
  .boot__bar i { display: block; width: 30%; height: 100%; background: #c8532a; animation: bootbar 1.6s ease-in-out infinite; }
  @keyframes bootbar { from { transform: translateX(-100%); } to { transform: translateX(340%); } }
  @media (prefers-reduced-motion: reduce) { .boot__tips span:first-child { opacity: 1; } }
  .splash { position: fixed; inset: 0; z-index: 9999; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 24px;
            background: #f4f6f4; color: #10242a; overflow: hidden; animation: splashout .5s ease-in 2.1s forwards; }
  @keyframes splashout { to { opacity: 0; visibility: hidden; } }
  .splash .boot__name, .splash .boot__line, .splash .boot__when { animation: splashup .6s ease-out 1.25s both; }
  @keyframes splashup { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
  @media (prefers-reduced-motion: reduce) { .splash { animation: splashout .3s ease-in .6s forwards; } }

.pt-splash .boot__line { max-width: 22em; }
.pt-wmark { display: block; width: 44px; height: 44px; }
.pt-wmark svg { width: 100%; height: 100%; }
@media (max-width: 760px) { .pt-wmark { width: 40px; height: 40px; } }
/* 等待中（活圖資料還沒到）：畫面中間一個小的動態標誌 */
.pt-wait { position: absolute; left: 50%; top: 50%; width: 64px; height: 64px; margin: -32px 0 0 -32px; opacity: .8; pointer-events: none; }

/* 夜間：內頁跟著網站日夜色（島引馬祖 .dlh__body 的做法），活圖（.dl-hero）維持淺底 */
[data-theme="dark"] body { background: var(--surface); color: var(--ink); }
[data-theme="dark"] .pt-pc, [data-theme="dark"] .pt-notice a { background: var(--surface-raised); }
[data-theme="dark"] .pt-pc__ly span { background: transparent; }
[data-theme="dark"] .pt-search input { background: var(--surface-raised); color: var(--ink); }
[data-theme="dark"] .pt-hero .dl-hero__stage { background: #f4f6f4; }

/* 選單面板 */
.navg-w { position: relative; }
.pt-navpanel { position: absolute; top: calc(100% + 2px); left: 0; z-index: 70; }
.pt-navpanel a.navpanel__i { text-decoration: none; color: var(--ink); }
@media (max-width: 760px) { .pt-navpanel { display: none !important; } }
/* 資料狀態列展開 */
.pt-console__list { display: flex; flex-wrap: wrap; gap: 4px 16px; width: 100%; padding: 4px 0 10px; font-size: 12.5px; }
.pt-console__list[hidden] { display: none; }
.pt-console__list span { display: inline-flex; align-items: center; gap: 6px; color: var(--hd-ink, var(--ink)); }
.pt-console__list span i { width: 6px; height: 6px; border-radius: 50%; background: var(--hd-go, var(--go)); }
.pt-console__list span.is-stale i { background: var(--hd-hold, var(--hold)); }
.pt-console__list b { font-weight: 500; color: var(--hd-mut, var(--ink-muted)); font-family: var(--dl-mono); }
.pt-console__list a { color: var(--hd-sea, var(--tide)); font-weight: 600; }
.pt-console .console-toggle { min-height: 36px; }

/* 颱風卡、今天卡 */
.pt-typhoon { margin-top: 28px; padding: 16px 18px; border: 1px solid var(--dl-stop, #b42318); border-left-width: 4px; border-radius: 10px; background: color-mix(in srgb, var(--dl-stop, #b42318) 5%, transparent); }
.pt-typhoon__k { display: inline-flex; gap: 6px; align-items: center; font-weight: 700; color: var(--dl-stop, #b42318); font-size: 13px; }
.pt-typhoon h3 { margin: 6px 0 0; font: 900 24px/1.3 var(--dl-serif); }
.pt-typhoon h3 span { font: 600 15px/1 var(--dl-sans); color: var(--dl-ink2, #56676c); margin-left: 10px; }
.pt-typhoon p { margin: 6px 0 0; font-size: 15px; line-height: 1.7; }
.pt-typhoon__m { font-size: 12.5px !important; color: var(--dl-ink3, #82949a); }
.pt-seasonal { display: flex; flex-wrap: wrap; gap: 4px 14px; font: 700 22px/1.3 var(--dl-serif) !important; }
@media (max-width: 760px) { .pt-today .pt-num[style] { grid-column: 1 / -1 !important; } }
.pt-err { max-width: 640px; margin: 0 auto; padding: 40px 0 60px; text-align: left; }
.pt-err__mark { width: min(440px, 100%); margin: 0 0 18px -6px; }
.pt-crumb { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding-top: 20px; font-size: 13.5px; color: var(--dl-ink3, #82949a); }
.pt-crumb a { color: var(--tide); text-decoration: none; font-weight: 600; }
.pt-crumb b { color: var(--dl-ink2, #56676c); font-weight: 500; }