/* 都市更新學分學程 — 捲動敘事。全部樣式限定在 .ur 內，可併入 nigramotion.css */

.ur {
  --ur-bg: #f6f4f0;
  --ur-text: #222;
  --ur-sub: #8a8680;
  --ur-accent: #8a8680;
  --ur-body: #555;
  --ur-line: rgba(34,34,34,.09);
  position: relative;
  height: 1450vh; /* JS 會改成精確的 px */
  background: var(--ur-bg);
  color: var(--ur-text);
  font-family: Roboto, "Noto Sans TC", "PingFang TC", sans-serif;
  font-size: 18px;
  line-height: 1.8;
  text-align: left;
}
.ur *, .ur *::before, .ur *::after { box-sizing: border-box; }

.ur .ur-stage {
  position: sticky;
  top: 0;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  background: linear-gradient(180deg, #f8f6f3 0%, #efece6 100%);
}
/* sticky 被外層 overflow 破壞時，由 JS 改用這三個狀態 */
.ur.ur-js-pin .ur-stage { position: absolute; left: 0; top: 0; }
.ur.ur-js-pin.is-pinned .ur-stage { position: fixed; }
.ur.ur-js-pin.is-after .ur-stage { top: auto; bottom: 0; }

.ur .ur-canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }

/* ---- 文字 ---- */
.ur .ur-eyebrow, .ur .ur-num {
  margin: 0 0 18px; padding: 0;
  font-size: 13px; line-height: 1.8; font-weight: 400;
  letter-spacing: .12em;
  color: var(--ur-sub);
}
.ur .ur-eyebrow span, .ur .ur-num span, .ur .ur-hint span {
  margin-left: .6em; font-weight: 300; letter-spacing: .08em; text-transform: lowercase;
}
.ur .ur-num { color: var(--ur-accent); font-weight: 700; transition: color 1s ease; }
.ur .ur-num span { color: var(--ur-sub); }
.ur .ur-num::after {
  content: ""; display: block; width: 28px; height: 1px; margin-top: 14px;
  background: var(--ur-accent); transition: background-color 1s ease;
}

.ur .ur-title {
  margin: 0 0 24px; padding: 0;
  font-size: 55px; line-height: 1.25; font-weight: 700; letter-spacing: .06em;
  color: var(--ur-text);
}
.ur .ur-name {
  margin: 0 0 16px; padding: 0;
  font-size: 33px; line-height: 1.4; font-weight: 500; letter-spacing: .04em;
  color: var(--ur-text);
}
.ur .ur-lead, .ur .ur-desc {
  margin: 0 0 28px; padding: 0;
  font-size: 18px; line-height: 1.8; font-weight: 400; color: var(--ur-body);
}
.ur .ur-hint {
  position: relative; display: flex; align-items: center;
  margin: 44px 0 0; padding-left: 34px; min-height: 32px;
  font-size: 13px; letter-spacing: .12em; color: var(--ur-sub);
}
.ur a.ur-more {
  display: inline-block;
  padding: 8px 22px;
  border-radius: 999px;
  font-size: 15px; line-height: 1.8; letter-spacing: .08em;
  color: var(--ur-text); text-decoration: none;
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(255,255,255,.9);
  box-shadow: inset 0 1px 1px rgba(255,255,255,.95), 0 0 0 1px rgba(26,26,26,.05), 0 6px 16px rgba(26,26,26,.08);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  transition: background-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.ur a.ur-more:hover {
  background: rgba(255,255,255,.85); transform: translateY(-1px);
  box-shadow: inset 0 1px 1px rgba(255,255,255,.95), 0 0 0 1px rgba(26,26,26,.05), 0 10px 22px rgba(26,26,26,.12);
}

/* 手機上的字級（純文字後備清單用） */
@media (max-width: 768px) {
  .ur .ur-eyebrow, .ur .ur-num { margin-bottom: 10px; }
  .ur .ur-num::after { margin-top: 10px; }
  .ur .ur-title { font-size: 36px; margin-bottom: 14px; }
  .ur .ur-name { font-size: 24px; margin-bottom: 8px; }
  .ur .ur-lead, .ur .ur-desc { font-size: 15px; margin-bottom: 16px; }
}

/* ==================================================================
   索引與主題說明的卡片（由 JS 依 HTML 內容產生；data-layout、data-desk、data-mobile 由 JS 設定）
   ================================================================== */

.ur.ur-ready .ur-panels { display: none; }
.ur .ur-ui { position: absolute; inset: 0; pointer-events: none; }
.ur .ur-card {
  pointer-events: auto;
  border-radius: 10px;
  background-color: rgba(250,249,247,.68);
  border: 1px solid rgba(255,255,255,.85);
  box-shadow: inset 0 1px 1px rgba(255,255,255,.9), 0 10px 26px rgba(0,0,0,.06);
  -webkit-backdrop-filter: blur(14px) saturate(1.2); backdrop-filter: blur(14px) saturate(1.2);
  color: var(--ur-text);
  transition: background-color 1s ease, border-color 1s ease, box-shadow 1s ease, color 1s ease;
}

/* ---- 晚上：字卡改成深色、白字 ---- */
.ur.ur-night { --ur-text: #fff; --ur-sub: rgba(255,255,255,.62); --ur-body: rgba(255,255,255,.84); --ur-line: rgba(255,255,255,.14); }
.ur.ur-night .ur-card {
  background-color: rgba(18,22,36,.66);
  border-color: rgba(255,255,255,.14);
  box-shadow: inset 0 1px 1px rgba(255,255,255,.08), 0 10px 26px rgba(0,0,0,.35);
}
.ur.ur-night a.ur-more {
  color: #fff; background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.28);
  box-shadow: inset 0 1px 1px rgba(255,255,255,.12);
}
.ur.ur-night a.ur-more:hover { background: rgba(255,255,255,.22); }
/* 深色主題色在深色卡上太暗，提亮一階 */
.ur.ur-night .ur-menu-row b, .ur.ur-night .ur-num { color: color-mix(in srgb, var(--c, var(--ur-accent)) 58%, #fff); }
.ur.ur-night .ur-num::after { background: color-mix(in srgb, var(--ur-accent) 58%, #fff); }

/* ---- 共用：索引清單 ---- */
.ur .ur-menu { position: absolute; }
.ur .ur-menu-list { list-style: none; margin: 0; padding: 0; }
.ur .ur-menu-list li { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--ur-line); transition: border-color 1s ease; }
.ur a.ur-menu-row {
  display: flex; align-items: baseline; gap: 16px;
  padding: 8px 2px;
  font-size: 17px; line-height: 1.6; color: var(--ur-text); text-decoration: none; cursor: pointer;
  transition: color 1s ease, padding-left .2s ease;
}
.ur a.ur-menu-row:hover { padding-left: 6px; }
.ur a.ur-menu-row b { font-size: 13px; font-weight: 700; letter-spacing: .12em; color: var(--c); }
.ur .ur-menu-list li.is-on a.ur-menu-row span { font-weight: 700; }
.ur .ur-menu-body { overflow: hidden; max-height: 0; opacity: 0; padding-left: 38px; transition: max-height 1s ease, opacity 1s ease; }
.ur .ur-menu-body h3 { display: none; }
.ur .ur-menu-body p { margin: 0 0 12px; padding: 0; font-size: 15px; line-height: 1.8; color: var(--ur-body); }
.ur .ur-menu-body a.ur-more { margin-bottom: 16px; padding: 5px 18px; font-size: 13px; }
.ur .ur-menu-head { overflow: hidden; max-height: 0; opacity: 0; transition: max-height 1s ease, opacity 1s ease; }
.ur .ur-menu-head .ur-title { font-size: 33px; margin-bottom: 10px; }
.ur .ur-menu-head .ur-title br { display: none; }
.ur .ur-menu-head .ur-eyebrow { margin-bottom: 10px; }
.ur .ur-menu-head .ur-lead { font-size: 15px; margin-bottom: 0; }
.ur .ur-menu-head .ur-hint { margin: 18px 0 20px; }
.ur .ur-menu-toggle { display: none; }
.ur .ur-hint.ur-hint-m { display: none; }

/* ---- 卡片的基本位置 ---- */
.ur[data-layout="a"] .ur-menu { left: 5vw; top: 50%; transform: translateY(-50%); width: min(400px, 32vw); padding: 26px 30px 20px; }
.ur[data-layout="a"].is-intro .ur-menu-head { max-height: 300px; opacity: 1; }
.ur[data-layout="a"] li.is-on .ur-menu-body { max-height: 200px; opacity: 1; }

/* ---- 桌機：標題全程留著；當前主題的字放大，其餘縮小變淡；滑鼠移到哪一項，那一項平順地放大 ---- */
@media (min-width: 769px) {
  .ur[data-layout="a"] .ur-menu-head { max-height: none; opacity: 1; overflow: visible; }
  .ur[data-layout="a"] .ur-menu-head .ur-title { margin-bottom: 14px; }
  /* 引言與捲動提示只在開場出現，進入主題後收起，把空間讓給清單 */
  .ur[data-layout="a"] .ur-menu-head .ur-lead,
  .ur[data-layout="a"] .ur-menu-head .ur-hint {
    overflow: hidden; max-height: 0; min-height: 0; opacity: 0; margin-top: 0; margin-bottom: 0;
    transition: max-height .7s cubic-bezier(.22, .8, .2, 1), opacity .5s ease, margin .7s cubic-bezier(.22, .8, .2, 1);
  }
  .ur[data-layout="a"].is-intro .ur-menu-head .ur-lead { max-height: 90px; opacity: 1; }
  /* 引言固定一行：卡片寬度至少容得下這句話，視窗較窄時卡片跟著加寬而不是讓字換行。
     說明文字不參與寬度計算，否則卡片會被長句子撐開 */
  .ur[data-layout="a"] .ur-menu { width: fit-content; min-width: min(400px, 32vw); max-width: 92vw; }
  .ur[data-layout="a"] .ur-menu-head .ur-lead { white-space: nowrap; }
  .ur[data-layout="a"] .ur-menu-body p { width: 0; min-width: 100%; }

  /* 桌機不顯示捲動提示（文字與滑鼠圖示都不要） */
  .ur[data-layout="a"] .ur-menu-head .ur-hint { display: none; }
  .ur[data-layout="a"] .ur-menu-list { margin-top: 18px; }

  /* 每一列的高度固定，字級在固定的列高裡縮放，所以滑鼠移動時整份清單不會跟著跳動 */
  .ur[data-layout="a"] a.ur-menu-row {
    align-items: center; height: 40px; padding: 0 2px; line-height: 1.3; font-size: 17px;
    transition: height .55s cubic-bezier(.22, .8, .2, 1), font-size .45s cubic-bezier(.22, .8, .2, 1), color 1s ease;
  }
  .ur[data-layout="a"] a.ur-menu-row:hover { padding-left: 2px; }
  .ur[data-layout="a"] a.ur-menu-row span {
    display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    font-weight: 400; transition: opacity .45s ease;
  }
  .ur[data-layout="a"] a.ur-menu-row b { flex: 0 0 auto; transition: color 1s ease, opacity .45s ease; }
  /* 進入主題後：其餘項目縮小、變淡 */
  .ur[data-layout="a"]:not(.is-intro) a.ur-menu-row { height: 34px; font-size: 14px; }
  .ur[data-layout="a"]:not(.is-intro) a.ur-menu-row span { opacity: .5; }
  .ur[data-layout="a"]:not(.is-intro) a.ur-menu-row b { opacity: .7; }
  /* 滑鼠移上去：放大、恢復清楚 */
  .ur[data-layout="a"] li:not(.is-on) a.ur-menu-row:hover { font-size: clamp(16px, 1.55vw, 20px); }
  .ur[data-layout="a"] li a.ur-menu-row:hover span, .ur[data-layout="a"] li a.ur-menu-row:hover b { opacity: 1; }
  /* 當前主題：最大、最清楚 */
  .ur[data-layout="a"] li.is-on a.ur-menu-row { height: 56px; font-size: clamp(19px, 1.95vw, 25px); }
  .ur[data-layout="a"] li.is-on a.ur-menu-row span { opacity: 1; font-weight: 400; letter-spacing: .03em; }
  .ur[data-layout="a"] li.is-on a.ur-menu-row b { opacity: 1; }
  .ur[data-layout="a"] .ur-menu-body { transition: max-height .7s cubic-bezier(.22, .8, .2, 1), opacity .55s ease; }
}
/* ---- 桌機：兩欄清單，當前主題的說明固定在卡片底部 ---- */
@media (min-width: 769px) {
  .ur[data-layout="a"][data-desk="1"] .ur-menu {
    min-width: min(580px, 46vw); padding: 24px 30px 20px;
    transition: padding-bottom .6s cubic-bezier(.22, .8, .2, 1), background-color 1s ease, border-color 1s ease, box-shadow 1s ease, color 1s ease;
  }
  .ur[data-layout="a"][data-desk="1"]:not(.is-intro) .ur-menu { padding-bottom: 104px; }
  .ur[data-layout="a"][data-desk="1"] .ur-menu-list {
    display: grid; grid-template-rows: repeat(4, auto); grid-auto-flow: column; grid-auto-columns: 1fr; column-gap: 30px;
  }
  .ur[data-layout="a"][data-desk="1"] a.ur-menu-row,
  .ur[data-layout="a"][data-desk="1"]:not(.is-intro) a.ur-menu-row,
  .ur[data-layout="a"][data-desk="1"] li.is-on a.ur-menu-row { height: 36px; }          /* 列高一律固定，格線不會動 */
  /* 字級跟著視窗寬度縮放：欄寬變窄時，最長的標題也不會被截斷 */
  .ur[data-layout="a"][data-desk="1"] a.ur-menu-row,
  .ur[data-layout="a"][data-desk="1"]:not(.is-intro) a.ur-menu-row { font-size: clamp(13px, 1.25vw, 15px); }
  .ur[data-layout="a"][data-desk="1"] li:not(.is-on) a.ur-menu-row:hover { font-size: clamp(14px, 1.4vw, 17px); }
  .ur[data-layout="a"][data-desk="1"] li.is-on a.ur-menu-row { font-size: clamp(14px, 1.42vw, 19px); }
  .ur[data-layout="a"][data-desk="1"] .ur-menu-clip { width: 0; min-width: 100%; }   /* 清單不參與卡片寬度的計算，換主題時卡片寬度才不會跟著變 */
  /* 說明：每個主題的說明都疊在卡片底部同一個位置，只有當前主題的那一份顯示 */
  .ur[data-layout="a"][data-desk="1"] .ur-menu-body,
  .ur[data-layout="a"][data-desk="1"] li.is-on .ur-menu-body {
    position: absolute; left: 30px; right: 30px; bottom: 18px; height: 70px; max-height: none; padding: 14px 0 0;
    display: flex; align-items: center; gap: 22px; border-top: 1px solid var(--ur-line);
    opacity: 0; visibility: hidden; transform: translateY(8px);
    transition: opacity .5s ease, transform .5s cubic-bezier(.22, .8, .2, 1), visibility 0s linear .5s;
  }
  .ur[data-layout="a"][data-desk="1"] li.is-on .ur-menu-body { opacity: 1; visibility: visible; transform: none; transition-delay: .38s, .38s, 0s; }   /* 等卡片底部長出來、上一則淡出後才出現，避免疊字 */
  .ur[data-layout="a"][data-desk="1"] .ur-menu-body p { flex: 1; width: auto; min-width: 0; margin: 0; font-size: 14px; line-height: 1.7; }
  .ur[data-layout="a"][data-desk="1"] .ur-menu-body a.ur-more { flex: 0 0 auto; margin: 0; white-space: nowrap; }
}

@media (max-width: 768px) {
  /* 手機：底部一張卡，和桌機同一份清單 */
  .ur[data-layout="a"] .ur-menu { left: 12px; right: 12px; top: auto; bottom: 12px; width: auto; transform: none; padding: 14px 18px 12px; }
  .ur[data-layout="a"] a.ur-menu-row { font-size: 15px; padding: 7px 2px; gap: 14px; }
  .ur[data-layout="a"] a.ur-menu-row:hover { padding-left: 2px; }
  .ur[data-layout="a"] .ur-menu-body { padding-left: 34px; }
  .ur[data-layout="a"] .ur-menu-body p { font-size: 14px; margin-bottom: 10px; }
  .ur[data-layout="a"] .ur-menu-body a.ur-more { margin-bottom: 12px; }
  .ur .ur-menu-head .ur-title { font-size: 28px; margin-bottom: 6px; }
  .ur .ur-menu-head .ur-eyebrow { margin-bottom: 6px; }
  .ur .ur-menu-head .ur-lead { font-size: 14px; }
  .ur .ur-menu-head .ur-hint { margin: 10px 0 12px; }
  .ur[data-layout="a"].is-outro .ur-menu-head { max-height: 0; opacity: 0; }

  /* 抽屜：平常只有當前主題，按卡片右上方突出的 index 按鈕展開整份清單 */
  .ur[data-layout="a"][data-mobile="1"] .ur-menu-toggle {
    display: flex; align-items: center; gap: 10px; position: absolute; right: 0; top: -44px; z-index: 1;
    padding: 8px 16px 8px 18px; border-radius: 999px; border: 0;
    background: #222; color: #fff; box-shadow: 0 6px 16px rgba(0,0,0,.18);
    font: inherit; font-size: 13px; font-weight: 700; letter-spacing: .14em; line-height: 1.5; cursor: pointer;
    transition: background-color 1s ease, color 1s ease;
  }
  .ur.ur-night[data-layout="a"][data-mobile="1"] .ur-menu-toggle { background: #fff; color: #222; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu-toggle::after {
    content: ""; width: 7px; height: 7px; margin-top: 4px; border-left: 2px solid currentColor; border-top: 2px solid currentColor;
    transform: rotate(45deg); transition: transform .5s ease, margin .5s ease;
  }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-open .ur-menu-toggle::after { transform: rotate(225deg); margin-top: -4px; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu-clip { overflow: hidden; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu-list li { display: none; border-top: 0; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu-list li.is-on { display: block; }
  .ur[data-layout="a"][data-mobile="1"] li.is-on a.ur-menu-row { font-size: 20px; font-weight: 500; }
  .ur[data-layout="a"][data-mobile="1"] li.is-on a.ur-menu-row span { font-weight: 500; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu-body { transition: none; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-open .ur-menu-list li { display: block; border-top: 1px solid var(--ur-line); }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-open .ur-menu-list li:first-child { border-top: 0; }
  .ur[data-layout="a"][data-mobile="1"].is-intro .ur-menu.is-open .ur-menu-list li:first-child { border-top: 1px solid var(--ur-line); }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-open .ur-menu-body { display: none; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-open a.ur-menu-row { padding: 6px 2px; font-size: 15px; font-weight: 400; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-open li.is-on a.ur-menu-row span { font-weight: 700; }
  /* 手機抽屜的操作提示：不用滑鼠圖示，改用一句文字說明可以滑動或打開 index */
  .ur[data-layout="a"][data-mobile="1"] .ur-menu-head .ur-hint { display: none; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu-head .ur-hint.ur-hint-m {
    display: block; min-height: 0; margin: 10px 0 4px; padding-left: 0;
    font-size: 13px; line-height: 1.7; letter-spacing: .06em; color: var(--ur-sub);
  }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu-head .ur-hint-m::before,
  .ur[data-layout="a"][data-mobile="1"] .ur-menu-head .ur-hint-m::after { content: none; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu-head .ur-hint-m b { font-weight: 700; letter-spacing: .12em; color: var(--ur-text); }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-open .ur-menu-head .ur-hint.ur-hint-m { display: none; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-open .ur-menu-head .ur-lead { margin-bottom: 12px; }

  /* 抽屜收合：其他項目一列列收起，選中的那一項留在原地放大、展開說明。展開時反過來 */
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-closing .ur-menu-list li:not(.is-on),
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-opening .ur-menu-list li:not(.is-on) { overflow: hidden; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-closing .ur-menu-list li:not(.is-on) { animation: ur-row-fold .52s cubic-bezier(.4, 0, .2, 1) both; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-opening .ur-menu-list li:not(.is-on) { animation: ur-row-fold .52s cubic-bezier(.4, 0, .2, 1) reverse both; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-closing li.is-on .ur-menu-body,
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-opening li.is-on .ur-menu-body { display: block; overflow: hidden; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-closing li.is-on .ur-menu-body { animation: ur-body-unfold .52s cubic-bezier(.4, 0, .2, 1) both; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-opening li.is-on .ur-menu-body { animation: ur-body-unfold .52s cubic-bezier(.4, 0, .2, 1) reverse both; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-closing li.is-on a.ur-menu-row { animation: ur-row-grow .52s cubic-bezier(.4, 0, .2, 1) both; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-opening li.is-on a.ur-menu-row { animation: ur-row-grow .52s cubic-bezier(.4, 0, .2, 1) reverse both; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-closing li.is-on a.ur-menu-row span,
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-opening li.is-on a.ur-menu-row span { font-weight: 500; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-closing .ur-menu-list li,
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-opening .ur-menu-list li { border-top-color: transparent; }
  @media (prefers-reduced-motion: reduce) {
    .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-closing .ur-menu-list *, .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-opening .ur-menu-list * { animation: none !important; }
  }

  /* 換主題：內容像紙帶一樣上下滾動，位移、模糊與卡片高度由 JS 逐格設定。
     view 把滾動中的內容裁在卡片內，上下緣用漸層遮罩讓進出更柔和 */
  .ur[data-layout="a"][data-mobile="1"] .ur-menu-view { position: relative; overflow: hidden; margin: -14px -18px -12px; padding: 14px 18px 12px; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-rolling .ur-menu-view {
    -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 22px, #000 calc(100% - 22px), transparent 100%);
    mask-image: linear-gradient(180deg, transparent 0, #000 22px, #000 calc(100% - 22px), transparent 100%);
  }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu-inner { will-change: transform; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu-ghost { position: absolute; pointer-events: none; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu-head { transition: none; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-dealing .ur-menu-view { overflow: visible; }

  /* 開場的四個步驟（JS 在開場時加上 is-dealing，播完移除）：
     毛玻璃卡片由下往上長出來 → 主標題浮現 → 8 個項目像發牌一樣由螢幕下方一張張飛上來 → index 按鈕出現 */
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-dealing { animation: ur-grow .6s cubic-bezier(.3, .8, .3, 1) both; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-dealing .ur-menu-head {
    max-height: 300px; transition: none;
    animation: ur-rise .5s ease both; animation-delay: .45s;
  }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-dealing .ur-menu-clip { overflow: visible; }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-dealing .ur-menu-list li {
    animation: ur-deal .6s cubic-bezier(.2, .85, .25, 1) both;
    animation-delay: calc(var(--i) * .09s + .9s);
  }
  .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-dealing .ur-menu-toggle { animation: ur-rise .45s ease both; animation-delay: 2s; }
  @media (prefers-reduced-motion: reduce) {
    .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-dealing,
    .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-dealing .ur-menu-head,
    .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-dealing .ur-menu-toggle,
    .ur[data-layout="a"][data-mobile="1"] .ur-menu.is-dealing .ur-menu-list li { animation: none; }
  }

}

@keyframes ur-grow {
  from { clip-path: inset(100% -30px -30px -30px); }
  to { clip-path: inset(-60px -30px -30px -30px); }
}
@keyframes ur-rise {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}
@keyframes ur-deal {
  0% { transform: translateY(90vh) rotate(5deg); opacity: 0; }
  12% { opacity: 1; }
  100% { transform: none; opacity: 1; }
}
@keyframes ur-row-fold { from { max-height: 44px; opacity: 1; } to { max-height: 0; opacity: 0; } }
@keyframes ur-body-unfold { from { max-height: 0; opacity: 0; } to { max-height: 180px; opacity: 1; } }
@keyframes ur-row-grow { from { font-size: 15px; } to { font-size: 20px; } }

/* ==================================================================
   防止佈景主題的樣式蓋過來：系網的自訂樣式會把內容區的 h1 隱藏（.spage h1），
   Salient 也會把所有標題換成別的字體，這裡明確指定回來
   ================================================================== */
.ur h1.ur-title { display: block !important; font-weight: 700 !important; }
.ur h1.ur-title, .ur h2.ur-name, .ur .ur-menu-body h3 {
  font-family: Roboto, "Noto Sans TC", "PingFang TC", sans-serif !important;
  text-transform: none !important;
}
.ur button.ur-menu-toggle { border-radius: 999px !important; text-transform: none !important; }

/* ==================================================================
   後備：JavaScript 沒有執行、或瀏覽器不支援 WebGL 時，頁面是一份可讀可點的純文字清單
   （.ur-ready 是 JS 啟動成功後才加上的）
   ================================================================== */
.ur:not(.ur-ready) { height: auto; padding: 120px 24px 80px; }
.ur:not(.ur-ready) .ur-stage { position: static; height: auto; overflow: visible; background: none; }
.ur:not(.ur-ready) .ur-canvas { display: none; }
.ur:not(.ur-ready) .ur-panels { position: static; max-width: 640px; margin: 0 auto; }
.ur:not(.ur-ready) .ur-panel {
  margin: 0 0 20px; padding: 26px 30px; border-radius: 10px;
  background: #fff; box-shadow: 0 10px 26px rgba(0,0,0,.05);
}
.ur:not(.ur-ready) .ur-hint { display: none; }
.ur:not(.ur-ready) .ur-title { font-size: 40px; }