/* 古星圖（sky.mjs）：深靛藍紙、金色刻線、雙線刻度圖框、角落卷草花框；細節是一張羊皮紙卡。
   不用霓虹、不用大片光暈；星只有細細的刻線光芒。閒置時不動，過場只在 body[data-motion="on"] 時才有。 */

/* ── 刊頭：深靛加金線 ── */
body[data-view="sky"] .ld-mast {
  background: linear-gradient(180deg, #172650, #101B3A);
  border-bottom: 1px solid #C9A45C;
  box-shadow: 0 1px 0 rgba(201, 164, 92, .35), 0 3px 0 #0C1530, 0 4px 0 rgba(201, 164, 92, .4), 0 8px 18px rgba(0, 0, 0, .4);
}
body[data-view="sky"] .mast-title, body[data-view="sky"] .mast-sa { color: #F3E6C4; }
body[data-view="sky"] .mast-db { color: #E2BE72; }
body[data-view="sky"] .mast-sub { color: rgba(238, 224, 190, .8); }
body[data-view="sky"] .mast-btn, body[data-view="sky"] .mast-select {
  color: #F3E6C4; background-color: #13204A; border-color: #C9A45C;
}
body[data-view="sky"] .mast-btn { background-image: linear-gradient(180deg, #1D2D5C, #13204A); }
body[data-view="sky"] .mast-select {
  background-image: linear-gradient(45deg, transparent 50%, #E2BE72 50%), linear-gradient(135deg, #E2BE72 50%, transparent 50%), linear-gradient(180deg, #1D2D5C, #13204A);
}
body[data-view="sky"] .mast-tables, body[data-view="sky"] .mast-modes { color: #14213D; background-image: linear-gradient(180deg, #EDD493, #CBA75E); border-color: #8C6A2C; }
body[data-view="sky"] .mast-btn:hover { border-color: #F0D58F; }
body[data-view="sky"] .mast-btn:focus-visible, body[data-view="sky"] .mast-select:focus-visible { outline: 2px solid #F3D27A; outline-offset: 2px; }

/* ── 根元素與紙 ── */
.mode-sky {
  --sky-paper: #14213D;
  --sky-deep: #0E1730;
  --sky-margin: #0B1229;
  --sky-gold: #C9A45C;
  --sky-gold-hi: #E8CB88;
  --sky-gold-lo: rgba(201, 164, 92, .3);
  --sky-cream: #F0E4C4;
  --sky-cream-soft: rgba(240, 228, 196, .78);
  --sky-atlas: #F2CE73;
  --sky-usdc: #BCD6F7;
  --sky-gbp: #EC9F7C;
  --sky-eur: #9FD9B8;
  --sky-grey: #9AA0B2;
  --sky-alert: #F08A6C;
  --parch-ink: #2E200C;
  --parch-soft: #5C4626;
  --sky-serif: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, "Songti TC", "Noto Serif TC", "Source Han Serif TC", serif;
  --sky-sans: ui-sans-serif, system-ui, -apple-system, "PingFang TC", "Noto Sans TC", sans-serif;
  color: var(--sky-cream);
  font-family: var(--sky-serif);
  background:
    repeating-linear-gradient(0deg, rgba(255, 240, 200, .018) 0 1px, transparent 1px 3px),
    radial-gradient(ellipse at 52% 46%, #1A2B55 0%, #14213D 48%, #0E1730 100%);
  -webkit-font-smoothing: antialiased;
}
.mode-sky.page-chart { overflow: hidden; }
.mode-sky [hidden] { display: none !important; }
.mode-sky .num { font-variant-numeric: lining-nums tabular-nums; }
.mode-sky button { font-family: inherit; }
.mode-sky :focus-visible { outline: 2px solid #F3D27A; outline-offset: 2px; }
.sky-chart { position: absolute; inset: 0; overflow: hidden; }

/* ── 證據按鈕：暗底上是淡金字＋點線底線；羊皮紙上是深褐字 ── */
.mode-sky .ev {
  font-size: inherit; font-weight: 700; color: var(--sky-cream); padding: 0 1px;
  border-bottom: 1.5px dotted rgba(232, 203, 136, .7); line-height: 1.25; font-family: var(--sky-serif);
  font-variant-numeric: lining-nums tabular-nums;
}
.mode-sky .ev:hover { color: #FFF4D6; border-bottom-style: solid; }
.mode-sky .ev .unit { font-size: .8em; font-weight: 600; color: var(--sky-cream-soft); }
.mode-sky .socket {
  background: transparent; color: var(--sky-cream-soft); box-shadow: none; border: 1px dashed rgba(232, 203, 136, .55);
  border-radius: 4px; font-size: 13.5px; font-weight: 600; padding: 1px 7px; font-family: var(--sky-sans);
}

/* ── 圖框（刻度帶） ── */
.sky-frame { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 2; }
.fr-mask { fill: var(--sky-margin); }
.fr-out { fill: none; stroke: var(--sky-gold); stroke-width: 1.6; }
.fr-in { fill: none; stroke: var(--sky-gold); stroke-width: 1; }
.fr-band rect { fill: rgba(201, 164, 92, .55); }
.fr-ticks line { stroke: rgba(201, 164, 92, .75); stroke-width: 1; }
.fr-corner rect { fill: var(--sky-margin); stroke: var(--sky-gold); stroke-width: 1; }
.fr-corner path { fill: var(--sky-gold-hi); }

/* ── 星圖 SVG ── */
.sky-svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; overflow: visible; touch-action: none; cursor: grab; user-select: none; -webkit-user-select: none; z-index: 1; }
.sky-svg.dragging { cursor: grabbing; }
.sky-svg text { font-family: var(--sky-serif); fill: var(--sky-gold-hi); }
.sky-svg [role="button"] { cursor: pointer; outline: none; }
.sky-svg.dragging [role="button"] { cursor: grabbing; }
.l-grid circle, .l-grid line { fill: none; vector-effect: non-scaling-stroke; }
.gr-main { stroke: var(--sky-gold); stroke-width: 1.1; }
.gr-thin { stroke: rgba(201, 164, 92, .6); stroke-width: .7; }
.gr-faint { stroke: rgba(201, 164, 92, .17); stroke-width: .8; }
.gr-tick { stroke: rgba(201, 164, 92, .55); stroke-width: .8; }
.band-fill { fill: rgba(201, 164, 92, .07); }
.band-line { fill: none; stroke: var(--sky-gold); stroke-width: 1.1; vector-effect: non-scaling-stroke; }
.band-thin { fill: none; stroke: rgba(201, 164, 92, .55); stroke-width: .7; vector-effect: non-scaling-stroke; }
.band-div { stroke: rgba(201, 164, 92, .6); stroke-width: .8; vector-effect: non-scaling-stroke; }
.band-year { stroke: var(--sky-gold-hi); stroke-width: 1.6; vector-effect: non-scaling-stroke; }
.band-sub { stroke: rgba(201, 164, 92, .45); stroke-width: .7; vector-effect: non-scaling-stroke; }
.band-unpub { fill: url(#sky-hatch); }
.hatch-l { stroke: rgba(232, 203, 136, .55); stroke-width: 1.1; }
.tk { fill: #E2BE72; }
.tk-nc { stroke: rgba(232, 203, 136, .6); stroke-width: 1.3; stroke-dasharray: 2.5 3; vector-effect: non-scaling-stroke; fill: none; }
.tk-none { fill: none; stroke: rgba(232, 203, 136, .85); stroke-width: 1.2; }
.tk-break { stroke: var(--sky-paper); stroke-width: 2.6; stroke-linecap: square; vector-effect: non-scaling-stroke; }
.sky-legend .tk-break, .sky-card .tk-break { stroke: #101B38; }
.tk-val { font-size: 12px; font-weight: 700; text-anchor: middle; dominant-baseline: central; fill: #F3D78F; }
.mlab { font-size: 11px; text-anchor: middle; dominant-baseline: central; fill: rgba(232, 203, 136, .9); }
.mlab.is-jan { font-weight: 700; fill: #F6DE9E; }
.mlab.q-off { display: none; }
.ylab { font-size: 13px; font-style: italic; font-weight: 700; text-anchor: middle; dominant-baseline: central; fill: #F3D78F; }
.clasp path { fill: var(--sky-paper); stroke: var(--sky-gold-hi); stroke-width: 1.2; }
.clasp circle { fill: var(--sky-gold-hi); }
.mc { fill: transparent; stroke: none; }
.mc:hover { fill: rgba(232, 203, 136, .07); }
.mc.is-sel { fill: rgba(232, 203, 136, .14); stroke: var(--sky-gold-hi); stroke-width: 1.3; vector-effect: non-scaling-stroke; }
.mc:focus-visible { stroke: #FFF2C9; stroke-width: 1.6; stroke-dasharray: 4 3; vector-effect: non-scaling-stroke; }

/* 星座連線與星 */
.cl line { stroke: rgba(214, 180, 108, .6); stroke-width: 1.1; vector-effect: non-scaling-stroke; }
.cl.is-sel line { stroke: var(--sky-gold-hi); stroke-width: 1.7; }
.g-body { stroke: #0B1430; stroke-width: .9; }
.c-atlas { fill: var(--sky-atlas); }
.c-usdc { fill: var(--sky-usdc); }
.c-gbp { fill: var(--sky-gbp); }
.c-eur { fill: var(--sky-eur); }
.g-core { fill: rgba(11, 20, 48, .35); }
.g-rays line { stroke-width: .9; stroke-linecap: round; opacity: .75; }
.g-rays.c-atlas line { stroke: var(--sky-atlas); }
.g-rays.c-usdc line { stroke: var(--sky-usdc); }
.g-dot { fill: #EDE3C6; }
.g-ring { fill: none; stroke: #EDE3C6; stroke-width: 1.3; }
.g-wd { fill: rgba(154, 160, 178, .08); stroke: var(--sky-grey); stroke-width: 1.4; }
.g-auth { fill: none; stroke: var(--sky-atlas); stroke-width: 1.3; stroke-dasharray: 2.6 2.4; }
.g-strike { stroke: var(--sky-alert); stroke-width: 2.2; stroke-linecap: round; }
.st-hit { fill: transparent; }
.st-sel { display: none; }
.st-sel circle { fill: none; stroke: #FFF0C4; stroke-width: 1.3; }
.st-sel circle.thin { stroke-width: .7; stroke: rgba(255, 240, 196, .7); }
.st-sel line { stroke: #FFF0C4; stroke-width: 1.2; }
.st.is-sel .st-sel { display: inline; }
.st-foc { display: none; fill: none; stroke: #FFF4D2; stroke-width: 1.6; stroke-dasharray: 3 2.5; }
.st:focus-visible .st-foc { display: inline; }
.st-num { font-size: 11.5px; font-style: italic; fill: #DCC89A; dominant-baseline: central; pointer-events: none; }
.st.is-sel .st-num { fill: #FFF0C4; font-weight: 700; }
.st.k-none .st-num, .st.k-failed .st-num { fill: rgba(220, 200, 154, .75); }
.st.k-withdrawn .st-num { fill: var(--sky-grey); }
.st:hover .g-body { stroke: #FFF4D2; }
.cn-hit { fill: none; stroke: transparent; stroke-width: 28px; stroke-linecap: round; vector-effect: non-scaling-stroke; pointer-events: stroke; }
.cn-arc { pointer-events: none; }
.cn-la { font-style: italic; font-weight: 600; fill: #EED7A0; letter-spacing: .02em; }
.cn-tm { font-family: var(--sky-sans) !important; font-weight: 600; fill: rgba(238, 224, 190, .85); }
.cn:hover .cn-la, .cn.is-sel .cn-la { fill: #FFF0C4; }
.cn:hover .cn-hit, .cn.is-sel .cn-hit { stroke: rgba(232, 203, 136, .1); }
.cn:focus-visible .cn-hit { stroke: rgba(255, 240, 196, .2); }
.pl-body { fill: #101B3A; stroke: #DDBA6E; stroke-width: 1.4; vector-effect: non-scaling-stroke; }
.pl-hatch line { stroke: rgba(221, 186, 110, .5); stroke-width: .75; vector-effect: non-scaling-stroke; }
.pl-band { fill: none; stroke: rgba(221, 186, 110, .55); stroke-width: .8; vector-effect: non-scaling-stroke; }
.pl-ring { fill: none; stroke: #DDBA6E; stroke-width: 1.3; vector-effect: non-scaling-stroke; }
.pl-crater { fill: none; stroke: rgba(221, 186, 110, .6); stroke-width: .8; vector-effect: non-scaling-stroke; }
.pl-foc, .pl-sel { display: none; fill: none; vector-effect: non-scaling-stroke; }
.pl:focus-visible .pl-foc { display: inline; stroke: #FFF4D2; stroke-width: 1.6; stroke-dasharray: 4 3; }
.pl.is-sel .pl-sel { display: inline; stroke: #FFF0C4; stroke-width: 1.3; }
.pl:hover .pl-body { stroke: #FFF0C4; }

/* 行星旁的小字（HTML 疊在星圖上，固定像素大小） */
.sky-pl-layer { position: absolute; inset: 0; pointer-events: none; z-index: 1; }
.sky-pl { position: absolute; left: 0; top: 0; display: flex; flex-direction: column; align-items: center; gap: 1px; text-align: center; white-space: nowrap; }
.sky-pl-fund { flex-direction: column; }
.pl-name {
  pointer-events: auto; border: 0; background: none; padding: 0 2px; cursor: pointer; color: #F6E3AE;
  font: italic 700 14px/1.2 var(--sky-serif); text-shadow: 0 1px 2px #0B1430, 0 0 6px #0B1430;
}
.pl-bal { display: flex; gap: 8px; font-size: 13px; text-shadow: 0 1px 2px #0B1430, 0 0 5px #0B1430; }
.pl-bal .ev { pointer-events: auto; font-size: 13px; }
.sky-pl-treasury .pl-name { order: 0; }
.sky-pl-treasury .pl-bal { order: 1; }
.sky-pl-fund .pl-name { order: 0; }
.mode-sky.pl-compact .pl-bal { display: none; }
.mode-sky.pl-compact .pl-name { font-size: 12px; }
.cart-planets { display: none; }
.mode-sky.pl-compact .cart-planets { display: grid; }

/* 懸停小籤 */
.sky-tip {
  position: absolute; left: 0; top: 0; z-index: 4; pointer-events: none; max-width: 260px; padding: 5px 9px;
  background: #F1E5C6; color: var(--parch-ink); border: 1px solid #8C6A2C; border-radius: 3px; font-size: 13.5px; line-height: 1.3;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .4);
}
.sky-tip strong { font-weight: 800; }

/* ── 花框（刊頭花框、圖例、星表頁首共用） ── */
.sky-cart, .sky-legend, .cat-head {
  position: absolute; z-index: 3;
  background: linear-gradient(180deg, #162448, #101B38);
  border: 1px solid var(--sky-gold);
  box-shadow: inset 0 0 0 3px #101B38, inset 0 0 0 4px rgba(201, 164, 92, .55), 0 10px 24px rgba(0, 0, 0, .35);
  border-radius: 2px;
}
.sky-orn { position: absolute; width: 30px; height: 30px; pointer-events: none; }
.sky-orn.tl { left: -7px; top: -7px; }
.sky-orn.tr { right: -7px; top: -7px; transform: scaleX(-1); }
.sky-orn.bl { left: -7px; bottom: -7px; transform: scaleY(-1); }
.sky-orn.br { right: -7px; bottom: -7px; transform: scale(-1, -1); }
.o-l { fill: none; stroke: var(--sky-gold-hi); stroke-width: 1.6; }
.o-l.thin { stroke-width: .9; stroke: var(--sky-gold); }
.o-f { fill: var(--sky-gold); }
.o-d { fill: #FFF0C4; }
.cart-latin { margin: 0; font-style: italic; font-size: 14px; letter-spacing: .04em; color: var(--sky-gold-hi); }
.cart-title { margin: 2px 0 0; font: 700 22px/1.2 var(--sky-serif); color: #F6E8C3; }
.cart-sub { margin: 5px 0 0; font-size: 14px; line-height: 1.4; color: var(--sky-cream-soft); }
.cart-time { margin: 7px 0 0; font: 600 13px/1.35 var(--sky-sans); color: #E8CB88; }
.cart-planets { margin-top: 6px; gap: 2px; font-size: 13px; }
.cp-row { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 9px; }
.cp-k { font-weight: 700; color: #F6E3AE; font-style: italic; }
.cp-row .ev { font-size: 13.5px; }

/* ── 工具列 ── */
.sky-tools { position: absolute; z-index: 3; display: flex; gap: 6px; }
.sky-tool {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 40px; height: 40px; padding: 0 10px; cursor: pointer;
  color: #F3E6C4; background: linear-gradient(180deg, #1D2D5C, #13204A); border: 1px solid var(--sky-gold); border-radius: 3px;
  box-shadow: inset 0 0 0 2px #13204A, inset 0 0 0 3px rgba(201, 164, 92, .35), 0 4px 10px rgba(0, 0, 0, .3);
  font: 700 15px/1 var(--sky-sans);
}
.sky-tool .tg { font: 700 20px/1 var(--sky-serif); color: #F6DE9E; }
.sky-tool.t-fit .tg { font-size: 17px; }
.sky-tool.t-cat { padding: 0 14px; }
.sky-tool.t-cat .tg { font-size: 15px; }
.sky-tool:hover { border-color: #F0D58F; color: #FFF4D6; }
/* 兩顆旋轉鈕（拖曳旋轉的點擊替代）：跟縮放鈕之間空一格。 */
.sky-tool { flex: none; }
.sky-tool .tt { white-space: nowrap; }
.sky-tool.t-rot .tg { font: 700 19px/1 var(--sky-sans); }
.sky-tool.t-rl { margin-left: 8px; }
.sky-tool.t-cat { margin-left: 8px; }
.mode-sky.is-phone :is(.sky-tool.t-rl, .sky-tool.t-cat) { margin-left: 0; }

/* ── 圖例 ── */
.sky-legend { padding: 6px 14px 10px; display: flex; flex-direction: column; min-height: 0; }
.lg-toggle {
  display: flex; align-items: baseline; justify-content: space-between; gap: 10px; width: 100%; border: 0; background: none; color: inherit; padding: 4px 0; cursor: pointer; text-align: left;
}
.lg-title { display: flex; align-items: baseline; gap: 8px; }
.lg-la { font-style: italic; font-size: 15px; color: var(--sky-gold-hi); }
.lg-tx { font: 700 16px/1.2 var(--sky-serif); color: #F6E8C3; }
.lg-caret { color: var(--sky-gold-hi); font-size: 14px; }
.sky-legend:not(.open) .lg-caret { transform: rotate(180deg); }
.lg-body { overflow-y: auto; min-height: 0; padding-right: 2px; }
.lg-mag { width: 100%; border-collapse: collapse; margin: 2px 0 4px; font-size: 13px; }
.lg-cap { caption-side: top; text-align: left; font-size: 13px; color: var(--sky-cream-soft); padding-bottom: 4px; }
.lg-mag th { font: italic 700 13px/1.2 var(--sky-serif); color: var(--sky-gold-hi); text-align: center; padding: 0 2px; }
.lg-mag td { text-align: center; vertical-align: bottom; padding: 0 1px 2px; width: 25%; }
.lg-mag td small { display: block; font: 600 11.5px/1.2 var(--sky-sans); color: var(--sky-cream-soft); white-space: nowrap; }
.lg-mag .sky-glyph { display: block; margin: 0 auto; }
.lg-list { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 1px; }
.lg-list li { display: grid; grid-template-columns: 26px 1fr; gap: 6px; align-items: center; font: 500 12.5px/1.25 var(--sky-sans); color: var(--sky-cream); min-height: 22px; }
.lg-list li > svg { width: 24px; height: 24px; }
.lg-list li > svg, .lg-list li > .lg-pair { justify-self: center; }
.lg-pair { display: inline-flex; margin-left: -6px; }
.lg-pair .sky-glyph { width: 18px; height: 24px; }
.lg-sub { margin: 6px 0 2px; font: italic 700 13.5px/1.3 var(--sky-serif); color: var(--sky-gold-hi); border-top: 1px solid rgba(201, 164, 92, .35); padding-top: 7px; }
.lg-how { margin: 9px 0 0; font: 500 12.5px/1.4 var(--sky-sans); color: var(--sky-cream-soft); border-top: 1px solid rgba(201, 164, 92, .35); padding-top: 7px; }
.lg-cl { stroke: rgba(214, 180, 108, .8); stroke-width: 1.2; }
.sky-glyph { overflow: visible; flex: none; }

/* ── 羊皮紙卡 ── */
.sky-card {
  position: absolute; z-index: 5; color: var(--parch-ink); display: flex; flex-direction: column; min-height: 0;
  background:
    radial-gradient(ellipse at 22% 12%, rgba(255, 252, 240, .55), transparent 55%),
    radial-gradient(ellipse at 80% 90%, rgba(160, 110, 50, .16), transparent 60%),
    linear-gradient(180deg, #F2E7CB, #E6D5AA);
  border-radius: 3px;
  box-shadow: inset 0 0 0 1px rgba(110, 76, 30, .45), inset 0 0 28px rgba(130, 90, 35, .28), 0 14px 32px rgba(0, 0, 0, .5);
}
.sky-card::before { content: ''; position: absolute; inset: 6px; border: 1px solid rgba(110, 76, 30, .4); border-radius: 2px; pointer-events: none; }
.sc-body {
  overflow-y: auto; min-height: 0; padding: 16px 20px 28px; display: grid; gap: 10px; align-content: start; font-size: 15px; line-height: 1.45;
  -webkit-mask-image: linear-gradient(180deg, #000 calc(100% - 26px), transparent); mask-image: linear-gradient(180deg, #000 calc(100% - 26px), transparent);
}
.sc-close {
  position: absolute; top: 10px; right: 10px; z-index: 1; width: 34px; height: 34px; border-radius: 50%; cursor: pointer;
  border: 1px solid rgba(110, 76, 30, .55); background: rgba(255, 250, 236, .7); color: var(--parch-ink); font: 700 20px/1 var(--sky-sans);
}
.mode-sky[data-layout="side"]:not(.has-sel) .sc-close { display: none; }
.sky-card :focus-visible { outline: 2px solid #7A4A12; outline-offset: 2px; }
.sky-card .ev { color: var(--parch-ink); font-size: 16.5px; border-bottom: 1.5px dotted rgba(92, 64, 24, .65); }
.sky-card .ev:hover { color: #000; }
.sky-card .ev.big { font-size: 25px; letter-spacing: -.01em; }
.sky-card .ev .unit { color: var(--parch-soft); font-size: 13px; }
.sky-card .ev.warn-ink, .cat-table .ev.warn-ink { color: #8A2E12; }
.sky-card .socket { color: var(--parch-soft); border-color: rgba(92, 64, 24, .55); }
.sc-head { display: grid; gap: 2px; padding-right: 34px; }
.sc-kick { margin: 0; font-size: 13.5px; color: var(--parch-soft); }
.sc-kick .la { font-style: italic; }
.sc-title { margin: 0; display: flex; align-items: center; gap: 8px; font: 700 24px/1.15 var(--sky-serif); color: #24180A; outline: none; }
.sc-title:focus-visible { outline: 2px dashed #7A4A12; outline-offset: 3px; }
.sc-title .sky-glyph { filter: drop-shadow(0 0 0 #24180A); }
.sky-card .g-dot, .sky-card .g-ring { fill: #3A2A12; stroke: #3A2A12; }
.sky-card .g-ring { fill: none; }
.sky-card .c-atlas { fill: #C9932A; }
.sky-card .g-rays.c-atlas line { stroke: #C9932A; }
.sky-card .c-usdc { fill: #4F7FBF; }
.sky-card .g-rays.c-usdc line { stroke: #4F7FBF; }
.sky-card .c-gbp { fill: #B5583A; }
.sky-card .c-eur { fill: #3E8E66; }
.sky-card .g-wd { stroke: #6E7385; }
.sky-card .g-auth { stroke: #9A6A1A; }
.sky-card .g-strike { stroke: #B23A1E; }
.sky-card .pl-body { fill: #E9DAB0; stroke: #7A5A22; }
.sky-card .tk { fill: #A9802F; }
.sc-sub { margin: 2px 0 0; font-size: 15.5px; line-height: 1.35; color: #3B2A12; font-weight: 600; }
.sc-alt { margin: -4px 0 0; font-size: 13.5px; color: var(--parch-soft); }
.sc-sec { display: grid; gap: 5px; padding-top: 8px; border-top: 1px solid rgba(110, 76, 30, .3); }
.sc-h { margin: 0; font: italic 700 14px/1.3 var(--sky-serif); color: #6A4B1C; }
.sc-row { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 12px; }
.sc-k { font: 600 13.5px/1.3 var(--sky-sans); color: var(--parch-soft); }
.sc-v { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; justify-content: flex-end; text-align: right; min-width: 0; }
.sc-big { align-items: center; }
.sc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 14px; margin-top: 2px; }
.sc-cell { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.sc-note { margin: 0; font-size: 14.5px; line-height: 1.45; color: #3B2A12; }
.sc-note.small { font-size: 13.5px; color: var(--parch-soft); }
.sc-lead { font-size: 15px; }
.sc-flag { font-weight: 700; color: #7A3E0E; }
.sc-facts { font: 600 13.5px/1.4 var(--sky-sans); color: var(--parch-soft); border-top: 1px solid rgba(110, 76, 30, .3); padding-top: 8px; }
.sc-dim { color: var(--parch-soft); font-size: 13.5px; }
.sc-state { margin: 0; font-weight: 700; font-size: 15px; display: inline-flex; align-items: center; gap: 6px; }
.sc-state::before { content: ''; width: 9px; height: 9px; border-radius: 50%; background: #6A5433; flex: none; }
.sc-state.st-complete::before { background: #3E7D4F; }
.sc-state.st-in-progress::before { background: #C08A2A; }
.sc-state.st-reconcile::before { background: transparent; border: 1.5px dashed #9A6A1A; }
.sc-state.st-attention::before { background: #B23A1E; border-radius: 1px; transform: rotate(45deg); }
.sc-state.st-withdrawn::before { background: transparent; border: 1.5px solid #6E7385; }
.sc-chip { display: inline-block; padding: 1px 9px; border-radius: 10px; font: 700 13px/1.45 var(--sky-sans); border: 1px solid rgba(92, 64, 24, .4); background: rgba(92, 64, 24, .08); color: #4A3718; white-space: normal; }
.sc-chip.ok { background: rgba(46, 110, 64, .13); color: #1F5432; border-color: rgba(46, 110, 64, .45); }
.sc-chip.no { background: rgba(160, 50, 25, .1); color: #7E2410; border-color: rgba(160, 50, 25, .4); }
.sc-chip.warn { background: rgba(192, 138, 42, .18); color: #6E4310; border-color: rgba(192, 138, 42, .55); }
.sc-result { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; }
.sc-votes { display: grid; grid-template-columns: auto auto auto; justify-content: start; gap: 2px 18px; align-items: baseline; font-size: 14.5px; }
.sv-h { font: 600 12.5px/1.2 var(--sky-sans); color: var(--parch-soft); }
.sv-k { font-weight: 700; }
.sv-p .ev { font-size: 15px; }
.sc-why { margin: 0; font-size: 13.5px; line-height: 1.4; color: #3B2A12; }
.sc-story summary { cursor: pointer; font: italic 700 14px/1.4 var(--sky-serif); color: #6A4B1C; padding: 4px 0; }
.sc-p { margin: 4px 0 0; font-size: 14px; line-height: 1.45; color: #3B2A12; }
.sc-actions { display: flex; flex-wrap: wrap; gap: 4px 16px; padding-top: 8px; border-top: 1px solid rgba(110, 76, 30, .3); }
.sc-link {
  display: inline-flex; align-items: center; gap: 5px; padding: 0; min-height: 30px; border: 0; background: none; cursor: pointer; text-align: left;
  color: #5A2E8A; font: 700 15px/1.3 var(--sky-sans); text-decoration: underline; text-underline-offset: 3px;
}
.sc-pips { display: flex; flex-wrap: wrap; gap: 4px 14px; }
.sc-checks, .sc-members, .sc-picks { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.sc-checks li { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 10px; }
.sc-members li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 2px 8px; align-items: center; font-size: 14px; }
.sc-members .sm-t { color: #3B2A12; line-height: 1.3; overflow-wrap: anywhere; }
.sc-members .ev { font-size: 14.5px; }
.sc-members .sc-link { min-height: 26px; font-size: 14px; }
.sc-pick {
  display: flex; align-items: center; gap: 10px; width: 100%; padding: 7px 10px; cursor: pointer; text-align: left; border-radius: 3px;
  border: 1px solid rgba(110, 76, 30, .35); background: rgba(255, 250, 236, .45); color: var(--parch-ink); font: 600 14.5px/1.35 var(--sky-sans);
}
.sc-pick:hover { background: rgba(255, 250, 236, .85); border-color: rgba(110, 76, 30, .65); }
.sc-pick .sky-glyph { flex: none; }
.sc-addr { color: #5A2E8A; font: 600 14px/1.3 var(--sky-sans); }

/* ── 版面：桌機左右欄 ── */
.mode-sky[data-layout="side"] .sky-cart { left: calc(var(--F) + 12px); top: calc(var(--F) + 12px); width: var(--colL); padding: 12px 16px 12px; box-sizing: border-box; }
.mode-sky[data-layout="side"] .sky-legend { left: calc(var(--F) + 12px); width: var(--colL); top: calc(var(--F) + 24px + var(--cartH)); bottom: auto; max-height: calc(100% - 2 * var(--F) - 36px - var(--cartH)); box-sizing: border-box; }
/* 工具列靠右上，寬度跟著按鈕走（多了四顆平移鈕，右欄寬度放不下），往左延伸到星圖上方的空白。 */
.mode-sky[data-layout="side"] .sky-tools { right: calc(var(--F) + 12px); top: calc(var(--F) + 12px); justify-content: flex-end; }
.mode-sky[data-layout="side"] .sky-card { right: calc(var(--F) + 12px); top: calc(var(--F) + 64px); width: var(--colR); max-height: calc(100% - 2 * var(--F) - 76px); }
.mode-sky[data-layout="side"] .lg-toggle { cursor: pointer; }

/* ── 版面：平板與手機（上方花框、下方工具列、卡片是底部抽屜） ── */
.mode-sky[data-layout="stack"] .sky-cart { left: calc(var(--F) + 8px); right: calc(var(--F) + 8px); top: calc(var(--F) + 8px); padding: 10px 14px 10px; }
.mode-sky[data-layout="stack"].card-open .sky-cart, .mode-sky[data-layout="stack"].card-open .sky-legend { display: none; }
.mode-sky[data-layout="stack"] .cart-title { font-size: 20px; }
.mode-sky[data-layout="stack"] .cart-sub { font-size: 14px; margin-top: 3px; }
.mode-sky[data-layout="stack"] .cart-time { margin-top: 4px; }
.mode-sky[data-layout="stack"] .sky-tools { right: calc(var(--F) + 8px); bottom: calc(var(--F) + 8px); }
.mode-sky[data-layout="stack"] .sky-legend { left: calc(var(--F) + 8px); bottom: calc(var(--F) + 8px); padding: 2px 12px; max-width: min(420px, calc(100% - 2 * var(--F) - 16px)); }
.mode-sky[data-layout="stack"] .sky-legend .sky-orn { display: none; }
.mode-sky[data-layout="stack"] .lg-toggle { min-height: 36px; align-items: center; }
.mode-sky[data-layout="stack"] .sky-legend.open { max-height: calc(100% - 2 * var(--F) - 16px - var(--cartH) - 12px); }
.mode-sky[data-layout="stack"] .sky-legend.open { z-index: 6; }
.mode-sky[data-layout="stack"] .sky-card {
  left: 0; right: 0; bottom: 0; max-height: 58%; border-radius: 10px 10px 0 0;
  box-shadow: inset 0 0 0 1px rgba(110, 76, 30, .45), inset 0 0 28px rgba(130, 90, 35, .28), 0 -10px 28px rgba(0, 0, 0, .5);
}
.mode-sky[data-layout="stack"] .sky-card::before { inset: 6px 6px 0; border-bottom: 0; border-radius: 6px 6px 0 0; }
.mode-sky[data-layout="stack"] .sc-body { padding: 16px 18px 22px; }
body[data-motion="on"] .mode-sky[data-layout="stack"] .sky-card:not([hidden]) { animation: sky-drawer .22s cubic-bezier(.2, .8, .2, 1); }
@keyframes sky-drawer { from { transform: translateY(24px); opacity: .4; } to { transform: none; opacity: 1; } }
.mode-sky.is-phone .sky-cart { padding: 8px 12px 9px; }
.mode-sky.is-phone .cart-latin { font-size: 12.5px; }
.mode-sky.is-phone .cart-title { font-size: 18px; }
.mode-sky.is-phone .cart-sub { font-size: 13px; line-height: 1.4; }
.mode-sky.is-phone .cart-time { font-size: 13px; margin-top: 2px; }
.mode-sky.is-phone .sky-orn { width: 22px; height: 22px; }
.mode-sky.is-phone .sky-tool { min-width: 38px; height: 38px; padding: 0 8px; }
.mode-sky.is-phone .sky-tool.t-cat { padding: 0 10px; }
.mode-sky.is-phone .sky-tools { gap: 5px; }
.mode-sky.is-phone .sc-title { font-size: 21px; }
.mode-sky.is-phone .st-num { font-size: 10.5px; }
.mode-sky.is-phone .mlab { font-size: 9.5px; }
.mode-sky.is-phone .ylab { font-size: 11px; }
.mode-sky.is-phone .tk-val { font-size: 10.5px; }

/* ── 星表（目錄頁） ── */
.sky-cat { position: relative; max-width: 1200px; margin: 0 auto; padding: 26px 26px 60px; box-sizing: border-box; }
.cat-head { position: relative; padding: 16px 22px 16px; margin-bottom: 22px; }
.cat-back {
  float: right; margin: 0 0 8px 12px; min-height: 38px; padding: 0 14px; cursor: pointer; border-radius: 3px;
  color: #14213D; background: linear-gradient(180deg, #EDD493, #CBA75E); border: 1px solid #8C6A2C; font: 700 15px/1 var(--sky-sans);
}
.cat-title { margin: 2px 0 0; font: 700 26px/1.2 var(--sky-serif); color: #F6E8C3; outline: none; }
.cat-sub { margin: 6px 0 0; font-size: 15px; line-height: 1.5; color: var(--sky-cream-soft); max-width: 70ch; }
.cat-group { margin: 0 0 26px; }
.cat-h { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; padding-bottom: 4px; border-bottom: 1px solid var(--sky-gold); font: italic 700 20px/1.25 var(--sky-serif); color: #F1D99A; }
.cat-hn { font: 700 16px/1.25 var(--sky-sans); font-style: normal; color: var(--sky-cream); }
.cat-meta { margin: 6px 0 8px; font: 500 14px/1.45 var(--sky-sans); color: var(--sky-cream-soft); }
.cat-table { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.cat-table thead th { text-align: left; font: italic 700 13.5px/1.3 var(--sky-serif); color: var(--sky-gold-hi); padding: 6px 8px; border-bottom: 1px solid rgba(201, 164, 92, .55); }
.cat-table td, .cat-table tbody th { padding: 7px 8px; border-bottom: 1px dotted rgba(201, 164, 92, .35); vertical-align: top; text-align: left; font-weight: 400; }
.cat-table .ev { font-size: 15px; }
.cat-glyph { width: 40px; }
.cat-pip .sc-link, .cat-month .sc-link { color: #F1D99A; font-size: 15px; white-space: nowrap; }
.cat-ttl { font-weight: 600; color: var(--sky-cream); }
.cat-alt { display: block; font-size: 12.5px; color: var(--sky-cream-soft); margin-top: 2px; }
.cat-vote { display: block; }
.cat-ballots { display: inline-flex; gap: 4px; align-items: baseline; margin-top: 3px; }
.cat-ballots small { font: 500 12.5px var(--sky-sans); color: var(--sky-cream-soft); }
.cat-stack { display: flex; flex-direction: column; gap: 2px; align-items: flex-start; }
.cat-dim { color: var(--sky-cream-soft); font: 500 13.5px/1.3 var(--sky-sans); }
.cat-state { font: 600 13.5px/1.35 var(--sky-sans); color: var(--sky-cream); }
.cat-state.st-reconcile { color: #F6D58A; }
.cat-state.st-attention { color: #F5A68D; }
.cat-state.st-withdrawn { color: var(--sky-grey); }
.cat-table .sc-chip { color: var(--sky-cream); background: rgba(240, 228, 196, .08); border-color: rgba(240, 228, 196, .35); }
.cat-table .sc-chip.ok { color: #BFE6C8; border-color: rgba(150, 210, 165, .5); background: rgba(80, 160, 100, .12); }
.cat-table .sc-chip.no { color: #F5B9A6; border-color: rgba(240, 150, 120, .5); background: rgba(200, 90, 60, .12); }
.cat-table tr.k-withdrawn td, .cat-table tr.k-withdrawn th { opacity: .8; }
.cat-table .g-dot { fill: #EDE3C6; }
.cat-foot { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 10px; }
.cat-foot .sc-link, .sky-cat .sc-link { color: #F1D99A; }
.cat-mt td { white-space: nowrap; }
.sky-cat .cart-time { margin-top: 8px; }

/* 手機：表格改成一列一張卡，每格前面帶欄名 */
@media (max-width: 760px) {
  .sky-cat { padding: 16px 12px 48px; }
  .cat-head { padding: 12px 14px; }
  .cat-title { font-size: 21px; }
  .cat-back { float: none; display: inline-flex; align-items: center; margin: 0 0 8px; }
  .cat-table thead { display: none; }
  .cat-table, .cat-table tbody, .cat-table tr { display: block; width: 100%; }
  .cat-table tr { position: relative; padding: 8px 4px 8px 52px; border-bottom: 1px dotted rgba(201, 164, 92, .45); box-sizing: border-box; }
  .cat-table td, .cat-table tbody th { display: flex; gap: 10px; align-items: baseline; padding: 2px 0; border: 0; }
  .cat-table td[data-label]::before, .cat-table tbody th[data-label]::before { content: attr(data-label); flex: 0 0 76px; font: 600 12.5px/1.4 var(--sky-sans); color: var(--sky-cream-soft); }
  .cat-table td:empty { display: none; }
  .cat-table td.cat-glyph { position: absolute; left: 4px; top: 8px; width: 40px; padding: 0; }
  .cat-table td.cat-glyph::before { display: none; }
  .cat-mt tr { padding-left: 4px; }
  .cat-mt td { white-space: normal; }
  .cat-ttl { overflow-wrap: anywhere; }
}

.lg-mag th.lg-curh { text-align: left; padding: 4px 0 0; border-top: 1px dotted rgba(201, 164, 92, .3); }
.lg-cur { font: 700 13px/1.2 var(--sky-sans); color: var(--sky-cream); font-style: normal; }
.lg-curh small { font: italic 500 12.5px/1.2 var(--sky-serif); color: var(--sky-cream-soft); }
.mode-sky[data-layout="side"] .lg-how { display: none; }

/* 星表：每屆一張表，欄寬固定，各屆的欄才對得齊 */
.cat-pt { table-layout: fixed; }
.cat-pt th:nth-child(1) { width: 48px; }
.cat-pt th:nth-child(2) { width: 76px; }
.cat-pt th:nth-child(4) { width: 96px; }
.cat-pt th:nth-child(5) { width: 15%; }
.cat-pt th:nth-child(6) { width: 13%; }
.cat-pt th:nth-child(7) { width: 13%; }
.cat-pt th:nth-child(8) { width: 15%; }
.cat-table .sc-chip { white-space: nowrap; }
.cat-tbox { display: flex; flex-direction: column; min-width: 0; }
.cat-pt td, .cat-pt th { overflow-wrap: anywhere; }
.cat-table .ev { white-space: normal; text-align: left; }
.sc-num { font-weight: 700; font-size: 16px; }

/* 平板與手機：圖例按鈕只佔工具列左邊剩下的寬度；打開後才往上展開蓋住星圖 */
.mode-sky[data-layout="stack"] .sky-legend:not(.open) { max-width: calc(100% - 2 * var(--F) - 30px - var(--toolsW, 200px)); box-sizing: border-box; }
.mode-sky[data-layout="stack"] .lg-title { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.mode-sky.is-phone .lg-la { display: none; }
.lg-body { -webkit-mask-image: linear-gradient(180deg, #000 calc(100% - 18px), transparent); mask-image: linear-gradient(180deg, #000 calc(100% - 18px), transparent); padding-bottom: 14px; }
.ct-brand, .ct-name { white-space: nowrap; }
.ct-name { color: #F1D99A; }
.sky-pl-layer, .sky-pl-layer * { touch-action: none; }
.mode-sky.is-phone .sky-legend:not(.open) { padding: 2px 8px; }
.mode-sky.is-phone .lg-toggle { gap: 5px; }
.mode-sky.is-phone .lg-tx { font-size: 15px; }
.mode-sky.is-phone .sky-tool { min-width: 36px; }