body {
            background-color: #FFFFFF; /* 改為純白 */
            font-family: 'PingFang TC', 'Microsoft JhengHei', sans-serif;
            overflow-x: hidden;
            color: #4A4542; 
        }

        /* 畫布模式防選取 */
        body.teaching-mode {
            user-select: none;
            -webkit-user-select: none;
        }

        /* 核心方陣排版 */
        .ziwei-board {
            --sscale: 1;
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            grid-template-rows: repeat(4, 1fr);
            gap: 1px;
            background-color: #D6CACA; /* 柔和的格線色 */
            border: 2px solid #C4B7B7;
            width: 100%;
            max-width: 680px; 
            aspect-ratio: 1 / 1;
            position: relative;
            margin: 0 auto;
            box-shadow: 0 8px 30px rgba(0,0,0,0.04);
            background-clip: padding-box;
        }

        .palace-cell {
            background-color: #FFFFFF;
            position: relative;
            /* 下緣列高只有一個來源，宮位列高與 footer 高度不可能對不上。
               所有尺寸一律乘 --sscale，匯出時整體等比放大，
               而不是只把盤面撐大、內容留在原尺寸。 */
            --frow: calc(17px * var(--sscale, 1));      /* 三列基準列高：流年／大限／本命 */
            --frow-top: calc(9px * var(--sscale, 1));   /* 最上方流月月干細列 */
            --footer-h: calc(var(--frow-top) + var(--frow) * 3);
            padding: calc(5px * var(--sscale, 1)) calc(6px * var(--sscale, 1));
            display: grid;
            grid-template-rows: minmax(0, 1fr) var(--footer-h);
            cursor: pointer;
            transition: all 0.2s ease;
            z-index: 10;
            overflow: hidden;
            min-height: 0;
            min-width: 0;
            box-sizing: border-box;
        }

        .palace-stars-area {
            width: 100%;
            min-width: 0;
            min-height: 0;
            overflow: hidden;
            padding: 3px 0 1px;
            display: flex;
            justify-content: flex-end;
            align-items: flex-start;
            position: relative;
        }

        /* 來因宮／生肖／身宮／七星：統一放在星曜區最左側 */
        .palace-star-meta {
            position: absolute;
            left: 0;
            top: 3px;
            z-index: 6;
            width: calc(var(--metaw) - 3px);
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            gap: 2px;
            pointer-events: none;
        }

        .palace-star-meta-tag {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: calc(29px * var(--sscale, 1));
            height: calc(15px * var(--sscale, 1));
            padding: 0 calc(3px * var(--sscale, 1));
            border-radius: 4px;
            border: 1px solid #E2DAD4;
            background: rgba(252, 251, 250, 0.94);
            font-size: calc(11px * var(--sscale, 1));
            font-weight: 700;
            line-height: 1;
            white-space: nowrap;
            box-sizing: border-box;
        }

        /* ═══ 宮位下緣：左資訊／中宮職／右干支 共用同一組列高，逐列對齊 ═══ */
        .palace-footer {
            width: 100%;
            min-width: 0;
            height: var(--footer-h);
            box-sizing: border-box;
            overflow: hidden;
            z-index: 20;
            border-top: 1px solid transparent;
            display: grid;
            grid-template-columns: calc(38px * var(--sscale, 1)) minmax(0, 1fr) calc(42px * var(--sscale, 1));
            grid-template-rows: var(--frow-top) var(--frow) var(--frow) var(--frow);
            column-gap: calc(1px * var(--sscale, 1));
            align-items: stretch;
        }
        .palace-footer > div { box-sizing: border-box; min-width: 0; }

        /* 左下：流月月干／流年歲數／西元／大限起歲 */
        .palace-age-block {
            position: static !important;
            grid-column: 1;
            grid-row: 1 / -1;
            width: 100%;
            min-width: 0;
            height: 100%;
            padding: 0 !important;
            margin: 0 !important;
            display: grid !important;
            grid-template-rows: var(--frow-top) var(--frow) var(--frow) var(--frow);
            align-items: stretch !important;
            justify-items: stretch !important;
            gap: 0 !important;
            overflow: hidden;
            line-height: 1 !important;
        }

        .palace-month-stem,
        .palace-current-age,
        .palace-current-year,
        .palace-decade-start-age {
            position: static !important;
            width: 100% !important;
            min-width: 0 !important;
            height: 100% !important;
            min-height: 0 !important;
            margin: 0 !important;
            padding: 0 1px !important;
            display: flex !important;
            align-items: center;
            justify-content: center;
            white-space: nowrap;
            line-height: 1 !important;
            text-align: center;
            box-sizing: border-box;
            overflow: hidden;
            border-radius: 3px;
            font-weight: 700 !important;
        }
        .palace-month-stem        { grid-row: 1 !important; font-size: calc(10px * var(--sscale, 1)) !important; color: #C58B3A !important; background: transparent; }
        .palace-current-age       { grid-row: 2 !important; font-size: calc(11px * var(--sscale, 1)) !important; color: #6A937C !important; background: transparent; }
        .palace-current-year      { grid-row: 3 !important; font-size: calc(11px * var(--sscale, 1)) !important; color: #8B6F47 !important; background: transparent; }
        .palace-decade-start-age  { grid-row: 4 !important; font-size: calc(14px * var(--sscale, 1)) !important; color: #61829E !important; background: transparent; letter-spacing: -0.02em; }

        /* 中欄宮職：左欄由下往上 本命→大限→流年，右欄由下往上 流月→流日→流時 */
        .palace-name-block {
            position: static !important;
            grid-column: 2;
            grid-row: 2 / -1;
            display: flex !important;
            flex-direction: row;
            align-items: stretch !important;
            justify-content: center !important;
            min-width: 0;
            padding: 0 !important;
            margin: 0 !important;
            overflow: hidden;
            line-height: 1 !important;
        }
        .palace-role-grid {
            display: grid;
            grid-template-columns: minmax(42px, 1fr) minmax(28px, .72fr);
            grid-template-rows: repeat(3, var(--frow));
            column-gap: 2px;
            row-gap: 0;
            align-items: center;
            justify-items: center;
            justify-content: center;
        }
        .palace-role-grid.role-single { grid-template-columns: minmax(44px, auto); width:auto; }
        .role-c1 { grid-column: 1 !important; }
        .role-c2 { grid-column: 2 !important; }
        .role-r1 { grid-row: 1 !important; }
        .role-r2 { grid-row: 2 !important; }
        .role-r3 { grid-row: 3 !important; }

        .palace-name-text {
            position: static !important;
            display: flex;
            align-items: center;
            justify-content: center;
            width: auto !important;
            min-width: 42px !important;
            height: auto !important;
            min-height: 0 !important;
            margin: 0 !important;
            padding: 0 !important;
            box-sizing: border-box;
            text-align: center;
            white-space: nowrap;
            overflow: visible;
            line-height: 1.08 !important;
            letter-spacing: 0 !important;
            font-size: calc(14.5px * var(--sscale, 1)) !important;
            z-index: 5;
            background: inherit;
        }
        .palace-layer-label {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: auto !important;
            min-width: calc(24px * var(--sscale, 1)) !important;
            max-width: calc(32px * var(--sscale, 1)) !important;
            height: auto !important;
            margin: 0 !important;
            padding: calc(1.5px * var(--sscale, 1)) calc(3px * var(--sscale, 1)) !important;
            border-radius: 3px;
            text-align: center;
            white-space: nowrap;
            overflow: hidden;
            font-size: calc(11.5px * var(--sscale, 1)) !important;
            font-weight: 700 !important;
            line-height: 1 !important;
        }

        /* 右下：方位、納音、宮位干支依流年／大限／本命三列水平對齊 */
        .palace-meta {
            position: static !important;
            grid-column: 3;
            grid-row: 2 / -1;
            width: 100%;
            height: 100%;
            min-width: 0;
            padding: 0 !important;
            overflow: visible;
            display: block !important;
        }

        .palace-nayin-ganzhi {
            width: 100%;
            height: calc(var(--frow) * 3);
            display: grid;
            grid-template-rows: repeat(3, var(--frow));
            align-items: center;
            justify-items: end;
            overflow: visible;
            line-height: 1 !important;
            white-space: nowrap;
        }

        /* 第1列＝方位（對齊流年）；第2列＝納音（對齊大限）；第3列＝干支（對齊本命） */
        .palace-direction,
        .palace-nayin,
        .palace-ganzhi {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            width: 100%;
            min-width: 0;
            height: 100%;
            padding: 0 1px;
            box-sizing: border-box;
            font-weight: 700;
            white-space: nowrap;
            overflow: visible;
            text-align: right;
        }
        .palace-direction { grid-row: 1; font-size: calc(var(--frow) * 0.62); color: #7B8C83; }
        .palace-nayin     { grid-row: 2; font-size: calc(var(--frow) * 0.62); color: #9B938D; }
        .palace-ganzhi    { grid-row: 3; font-size: calc(var(--frow) * 0.96); color: #4A4542; }

        .palace-cell:hover { background-color: #F4EFEB; box-shadow: inset 0 0 0 1px #D6CACA; }
        .palace-cell.active-source { background-color: #F8EBEB; box-shadow: inset 0 0 0 2px #CFA6A6; }
        .palace-cell.active-trine { background-color:#F4F0E8; box-shadow: inset 0 0 0 2px #C9B78E; }
        .palace-cell.active-opposite { background-color:#EDF2F5; box-shadow: inset 0 0 0 2px #9FB3C1; }
        .palace-cell.active-decade { background-color: #EFEBF4; box-shadow: inset 0 0 0 2px #BCABC4;}
        .palace-cell.active-liunian { background-color: #EBF4EE; box-shadow: inset 0 0 0 2px #A9C5B4;}

        /* 中宮設計 */
        .center-board {
            background-color: #FFFFFF; /* 改回純白 */
            grid-area: 2 / 2 / 4 / 4;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center; /* 改為置中，騰出上下空間 */
            position: relative;
            z-index: 5;
            padding: 30px 40px; /* 大幅增加 Padding，避免四化線條重疊 */
            border: 1px solid #D6CACA;
            overflow: hidden; /* 防止內容撐破網格 */
        }

        /* 中央八字與大運：統一格線、字級與留白 */
        #bazi-section, #xchexp-bazi-section {
            width: 100%;
            max-width: 310px;
            gap: 7px;
        }

        .bazi-grid {
            display: grid;
            grid-template-columns: repeat(5, minmax(0, 1fr));
            direction: ltr;
            justify-content: center;
            gap: 5px;
            width: 100%;
            margin-top: 4px;
            padding: 9px 8px;
            border: 1px solid #E4DEDA;
            border-radius: 7px;
            background: #FCFBFA;
            box-sizing: border-box;
        }
        .bazi-col {
            direction: ltr;
            height: 82px;
            display: grid;
            grid-template-rows: 18px 1fr;
            justify-items: center;
            align-items: center;
            gap: 3px;
            padding: 4px 3px;
            border-right: 0;
            border-left: 1px solid #EEE9E5;
            box-sizing: border-box;
        }
        .bazi-col:first-child { border-left: 0; }
        .bazi-col:last-child { border-right: 0 !important; }
        .bazi-title {
            font-size: 11px;
            line-height: 1;
            color: #9B938D;
            writing-mode: horizontal-tb;
            letter-spacing: 0.08em;
        }
        .bazi-text {
            min-height: 48px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 18px;
            line-height: 1.15;
            font-weight: 700;
            color: #5C5551;
            letter-spacing: 3px;
            writing-mode: vertical-rl;
        }
        .bazi-gender-col .bazi-text {
            writing-mode: vertical-rl;
            letter-spacing: 3px;
            color: #8A6F5A;
            font-size: 16px;
        }


        .dayun-list {
            display: grid;
            grid-template-columns: repeat(5, minmax(0, 1fr));
            grid-auto-rows: 48px;
            gap: 5px;
            margin-top: 1px;
            width: 100%;
            padding: 0;
            align-items: stretch;
        }
        .dayun-item {
            box-sizing: border-box;
            width: 100%;
            min-width: 0;
            height: 48px;
            display: grid;
            grid-template-rows: 16px 24px;
            align-content: center;
            justify-items: center;
            border: 1px solid #E4DEDA;
            border-radius: 5px;
            background-color: #FCFBFA;
            padding: 3px 2px;
            text-align: center;
            overflow: hidden;
        }
        .dayun-item > span {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 100%;
            height: 100%;
            margin: 0 !important;
            white-space: nowrap;
            line-height: 1;
        }

        /* 星曜欄寬／字級／四化大小，統一由 --sscale（盤面縮放）與宮內星數分級決定 */
        .palace-cell {
            /* 舒適閱讀版：星曜字級微幅放大，同步略增欄寬與間距，避免擠壓盤面 */
            --starw: calc(23px * var(--sscale, 1));
            --stargap: calc(3.75px * var(--sscale, 1));
            --starfs: calc(19.25px * var(--sscale, 1));
            --shb: calc(22px * var(--sscale, 1));   /* 本命四化 */
            --shs: calc(18px * var(--sscale, 1));   /* 其餘各層四化 */
            --shrow: calc(18px * var(--sscale, 1));
            --starrow: calc(40px * var(--sscale, 1));
            --metaw: calc(41px * var(--sscale, 1));
        }
        /* 6 顆以上的宮位自動縮排，避免星曜溢出宮位被裁掉 */
        .palace-cell.stars-d2 { --starw: calc(21px * var(--sscale,1)); --stargap: calc(2px * var(--sscale,1)); --starfs: calc(18px * var(--sscale,1)); --shb: calc(20px * var(--sscale,1)); --shs: calc(17px * var(--sscale,1)); }
        .palace-cell.stars-d3 { --starw: calc(19px * var(--sscale,1)); --stargap: calc(1.25px * var(--sscale,1)); --starfs: calc(16.25px * var(--sscale,1)); --shb: calc(18px * var(--sscale,1)); --shs: calc(16px * var(--sscale,1)); }
        .palace-cell.stars-d4 { --starw: calc(16.25px * var(--sscale,1)); --stargap: calc(0.75px * var(--sscale,1)); --starfs: calc(15px * var(--sscale,1)); --shb: calc(16px * var(--sscale,1)); --shs: calc(14px * var(--sscale,1)); }
        .palace-cell.stars-d5 { --starw: calc(14px * var(--sscale,1)); --stargap: calc(0.5px * var(--sscale,1)); --starfs: calc(12.75px * var(--sscale,1)); --shb: calc(14px * var(--sscale,1)); --shs: calc(12.25px * var(--sscale,1)); }

        .stars-container {
            display: flex;
            flex-direction: row-reverse;
            justify-content: flex-start;
            align-items: flex-start;
            gap: var(--stargap);
            width: 100%;
            height: 100%;
            min-height: 0;
            flex-wrap: nowrap;
            overflow: hidden;
            padding-left: var(--metaw);
            box-sizing: border-box;
        }

        .star-group {
            flex: 0 0 var(--starw);
            width: var(--starw);
            min-width: var(--starw);
            height: 100%;
            display: grid;
            /* 星名列可被壓縮，四化列高度固定保留，
               確保盤面縮小時第三層四化仍然完整顯示不被裁掉 */
            grid-template-rows: minmax(0, var(--starrow)) calc(var(--shrow) * 3 + 2px);
            justify-items: center;
            align-items: start;
            gap: 1px;
            overflow: visible;
        }
        .star-text {
            width: var(--starw);
            height: 100%;
            max-height: var(--starrow);
            writing-mode: horizontal-tb !important;
            text-orientation: upright;
            letter-spacing: 0;
            position: relative;
            display: flex !important;
            flex-direction: column !important;
            flex-wrap: nowrap !important;
            align-items: center;
            justify-content: flex-start;
            line-height: 1.05;
            white-space: nowrap;
            overflow: hidden;
            margin: 0 !important;
        }
        .star-text .star-char {
            display: block;
            flex: 0 0 auto;
            width: 1em;
            height: 1.05em;
            line-height: 1.05em;
            text-align: center;
        }
        .sihua-stack {
            display: grid;
            grid-template-rows: repeat(3, var(--shrow));
            row-gap: 1px;
            justify-items: center;
            align-items: center;
            width: var(--starw);
            min-height: calc(var(--shrow) * 3 + 2px);
        }
        .sihua-slot {
            display: flex;
            align-items: center;
            justify-content: center;
            width: var(--starw);
        }
        .sihua-slot.birth-slot { height: 20px; }
        .sihua-slot.decade-slot,
        .sihua-slot.liunian-slot { height: 18px; }

        /* 星辰大小與色彩統一規範 (大小一致，僅用顏色區分) */
        .main-star { font-weight: bold; font-size: var(--starfs); color: #4A4542; } /* 主星：深灰褐 */
        .aux-star { font-weight: bold; font-size: var(--starfs); color: #7B6882; } /* 輔星：莫蘭迪紫 */
        .small-star { font-weight: 600; font-size: var(--starfs); color: #9B938D; } /* 小星：淺灰褐 */

        /* 圖層控制 */
        /* 匯出副本的 id 會加上 xchexp- 命名空間（見 js/export/export-engine.js），以下同時保留兩種選擇器 */
        #svg-layer, #teaching-layer, #xchexp-svg-layer, #xchexp-teaching-layer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: visible; }
        #svg-layer, #xchexp-svg-layer { pointer-events: none; z-index: 25; }
        #teaching-layer, #xchexp-teaching-layer { z-index: 30; pointer-events: none; cursor: crosshair; }
        body.teaching-mode #teaching-layer { pointer-events: auto; }

        /* 四化柔和色系基準 */
        .color-A { fill: #6A937C; color: #6A937C; } /* 祿：莫蘭迪綠 */
        .color-B { fill: #8B6F47; color: #8B6F47; } /* 權：咖啡 */
        .color-C { fill: #79AFCB; color: #79AFCB; } /* 科：淺藍 */
        .color-D { fill: #B86B67; color: #B86B67; } /* 忌：磚紅/豆沙紅 */

        /* 文墨天機短版飛化：不畫跨宮飛線，受化星曜以祿、權、科、忌改變字體底色 */
        .star-text.fly-star-A,
        .star-text.fly-star-B,
        .star-text.fly-star-C,
        .star-text.fly-star-D {
            /* 僅疊加四化底色；完全沿用 .star-text 原本的直排、尺寸與 flex 方向。 */
            border-radius: 2px;
            color: #FFFFFF !important;
            font-weight: 900 !important;
            box-decoration-break: clone;
            -webkit-box-decoration-break: clone;
        }
        .star-text.fly-star-A { background-color:#188E46 !important; }
        .star-text.fly-star-B { background-color:#7E2F9D !important; }
        .star-text.fly-star-C { background-color:#168BC4 !important; }
        .star-text.fly-star-D { background-color:#D43B32 !important; }
        
        /* 生年四化 (實心放大) */
        .birth-sihua {
            display: inline-flex; align-items: center; justify-content: center;
            width: var(--shb); height: var(--shb); border-radius: 4px; color: white; font-size: calc(var(--shb) * 0.64); font-weight: bold;
        }
        .bg-color-A { background-color: #6A937C; color: white;}
        .bg-color-B { background-color: #8B6F47; color: white;}
        .bg-color-C { background-color: #79AFCB; color: white;}
        .bg-color-D { background-color: #B86B67; color: white;}

        /* 大限四化 (空心框) */
        .decade-sihua {
            display: inline-flex; align-items: center; justify-content: center;
            width: var(--shs); height: var(--shs); border-radius: 3px; font-size: calc(var(--shs) * 0.7); font-weight: bold; background-color: #FCFBF9;
        }
        .dec-color-A { border: 1.5px solid #6A937C; color: #6A937C; }
        .dec-color-B { border: 1.5px solid #8B6F47; color: #8B6F47; }
        .dec-color-C { border: 1.5px solid #79AFCB; color: #79AFCB; }
        .dec-color-D { border: 1.5px solid #B86B67; color: #B86B67; }

        /* 流年四化 (圓形底) */
        .liunian-sihua {
            display: inline-flex; align-items: center; justify-content: center;
            width: var(--shs); height: var(--shs); border-radius: 50%; font-size: calc(var(--shs) * 0.7); font-weight: bold;
        }
        .ln-color-A { background-color: #E2ECE5; color: #6A937C; }
        .ln-color-B { background-color: #EFE7DC; color: #8B6F47; }
        .ln-color-C { background-color: #E7F3F8; color: #79AFCB; }
        .ln-color-D { background-color: #F4E6E5; color: #B86B67; }


        /* 四化標示統一：粗體、置中；同宮多組時依槽位排列，不互相覆蓋 */
        .birth-sihua, .decade-sihua, .liunian-sihua {
            font-weight: 800 !important;
            line-height: 1 !important;
            flex: 0 0 auto;
        }
        .sihua-stack { overflow: visible; }
        .sihua-slot { overflow: visible; flex-wrap: wrap; align-content: center; row-gap: 1px; }

        .tool-btn.active { background-color: #B86B67; color: white; border-color: #B86B67; }

        /* 控制面板的柔和樣式 */
        .ctrl-panel {
            background-color: #FFFFFF;
            border: 1px solid #EAE6E1;
            box-shadow: 0 4px 20px rgba(0,0,0,0.02);
            border-radius: 12px;
            padding: 16px;
            margin-bottom: 12px;
        }
        .ctrl-group {
            background-color: #FAF8F5;
            border: 1px solid #EAE6E1;
            border-radius: 6px;
            padding: 6px 12px;
        }
        .ctrl-label {
            font-size: 12px;
            font-weight: bold;
            color: #8A837E;
        }
        .ctrl-input {
            border: 1px solid #D6CACA;
            border-radius: 4px;
            padding: 2px 6px;
            font-size: 13px;
            color: #5C5551;
            background-color: #FFFFFF;
            font-weight: bold;
        }



        /* 八字區與命盤整體留白微調 */
        #bazi-section, #xchexp-bazi-section { margin-top: 5px !important; gap: 6px !important; }
        .bazi-grid { margin-top: 2px !important; padding: 8px 7px !important; gap: 7px !important; }
        .dayun-list { margin-top: 3px !important; gap: 4px !important; }
        .center-board > div { width: 100%; }


        /* 本命至流日四化：盤面固定最多三層 */
        .sihua-slot { min-height: var(--shrow); }
        .sihua-layer-mark { display:inline-flex; align-items:center; justify-content:center; font-weight:800; line-height:1; }
        .month-sihua { width:var(--shs); height:var(--shs); border-radius:4px; font-size:calc(var(--shs) * 0.7); border:1.5px dashed currentColor; background:#FFFFFF; }
        .day-sihua { width:var(--shs); height:var(--shs); border-radius:50%; font-size:calc(var(--shs) * 0.7); color:#FFFFFF !important; }
        .hour-sihua { width:var(--shs); height:var(--shs); border-radius:2px; font-size:calc(var(--shs) * 0.7); color:#FFFFFF !important; transform:rotate(45deg); }
        .hour-sihua > span { transform:rotate(-45deg); display:inline-flex; align-items:center; justify-content:center; }
        .day-bg-A{background:#6A937C}.day-bg-B{background:#8B6F47}.day-bg-C{background:#79AFCB}.day-bg-D{background:#B86B67}
        .hour-bg-A{background:#6A937C}.hour-bg-B{background:#8B6F47}.hour-bg-C{background:#79AFCB}.hour-bg-D{background:#B86B67}
        .fly-mode-btn.active { background:#61829E; color:#fff; border-color:#61829E; }
        .month-color-A{color:#6A937C}.month-color-B{color:#8B6F47}.month-color-C{color:#79AFCB}.month-color-D{color:#B86B67}
        #yun-start-info:empty, #xchexp-yun-start-info:empty { display:none; }
        .bazi-grid { direction:ltr !important; }

        /* 中宮資訊精簡，避免八字與大運區過度擁擠 */
        .center-board { padding: 20px 28px !important; }
        .center-board .center-summary { margin-bottom: 4px !important; gap: 2px !important; }
        #bazi-section, #xchexp-bazi-section { margin-top: 2px !important; gap: 4px !important; }
        .bazi-grid { padding: 6px !important; gap: 5px !important; }
        .bazi-col { height: 70px !important; grid-template-rows: 15px 1fr !important; padding: 2px !important; }
        .bazi-text { min-height: 42px !important; font-size: 16px !important; }
        #yun-start-info, #xchexp-yun-start-info { font-size: 9px !important; line-height: 1.25 !important; padding: 3px 6px !important; }
        .dayun-list { grid-auto-rows: 42px !important; gap: 3px !important; }
        .dayun-item { height: 42px !important; grid-template-rows: 14px 20px !important; padding: 2px !important; cursor: pointer; transition: .15s ease; }
        .dayun-item:hover { background:#F3EFEA; border-color:#CFC4BC; }
        .dayun-item.active { background:#EEE8F1; border-color:#9D879F; box-shadow: inset 0 0 0 1px #9D879F; }
        .fly-sihua-label { font-size: 14px; font-weight: 900; paint-order: stroke; stroke: #fff; stroke-width: 3px; stroke-linejoin: round; }

        /* 中央國曆／農曆年月日時對齊 */
        .center-date-table { display:flex; flex-direction:column; gap:3px; min-width:285px; }
        .center-date-row { display:grid !important; grid-template-columns:42px 64px 46px 46px 64px; align-items:center; column-gap:3px; white-space:nowrap; }
        /* 年份欄靠右，國曆「1990年」與農曆「民79年」的「年」字才會上下對齊 */
        .center-date-row > span:nth-child(2) { text-align:right !important; padding-right:5px; }
        .center-date-row > span { text-align:center; font-variant-numeric: tabular-nums; }
        .center-date-row .date-year,
        .center-date-row .date-month,
        .center-date-row .date-day { display:flex; align-items:center; justify-content:flex-end; width:100%; box-sizing:border-box; }
        .center-date-row .date-month, .center-date-row .date-day { padding-right:4px; }
        .center-date-row .date-label { text-align:right; color:#8A837E; }

        /* fix33：第五欄（時間／時辰）三列左緣對齊。
           原本三列都是 text-align:center，但「05:32」是 5 個半形字（約 30px）、
           「午時」是 2 個全形字（約 24px），置中後兩者左右各差 3px，
           農曆那一列看起來就沒對齊。改為靠左並給同一組內距，三列由同一個 x 起排。 */
        .center-date-row > span:last-child {
            text-align: left !important;
            justify-content: flex-start;
            padding-left: 9px;
        }

        /* ═══ fix30：真太陽時列（夾在國曆與農曆之間）═══
           沿用 .center-date-row 的同一組格線，年／月／日／時間四欄與上下兩列逐欄對齊。
           「真太陽」是三個字，比「國曆／農曆」多一字，標籤欄縮字級避免撐開第一欄，
           其餘欄位維持 12px，上下三列的數字才會等寬對齊。 */
        .center-date-row-truesolar .date-label {
            font-size: 10.5px;
            letter-spacing: -0.04em;
            color: #8A6B49;
        }
        .center-date-row-truesolar { color: #8A6B49; }
        .center-date-row.is-hidden { display: none !important; }
        .center-date-row-truesolar .truesolar-time {
            display: inline-flex;
            align-items: baseline;
            justify-content: center;
            gap: 3px;
            white-space: nowrap;
        }
        .center-date-row-truesolar .truesolar-delta {
            font-size: 9px;
            font-style: normal;
            font-weight: 700;
            color: #A79A8C;
        }
        /* 中宮日期表由兩列變三列，整體高度增加，這裡把列距略收，
           避免在窄畫面把八字／大運區往下推。 */
        .center-date-table { gap: 2px; }
        .center-hour-row { display:grid; grid-template-columns:42px 1fr; align-items:center; column-gap:6px; margin-top:1px; }
        .center-hour-row .date-label { text-align:right; color:#8A837E; }
        .center-hour-value { text-align:left; color:#5C7482; letter-spacing:.06em; }

        /* 匯出模式的宮位尺寸全部由 --sscale 推導（見 .ziwei-board.export-mode），
           這裡只保留 html2canvas 需要的防裁切設定。 */
        .ziwei-board.export-mode .palace-layer-label { overflow: visible !important; }


        /* Sprint 1：獨立匯出舞台。副本在畫面外以固定桌機尺寸排版，不再改動手機上的原始命盤。 */
        .xch-export-stage {
            position: fixed;
            left: 0;
            top: 0;
            width: 1280px;
            height: 1280px;
            overflow: visible;
            pointer-events: none;
            opacity: 1;
            z-index: -2147483647;
            background: #fff;
            /* 不再把匯出副本放到 -20000px。部分手機瀏覽器搭配 html2canvas
               會以視窗邊界裁切，導致右側第四欄及底列遺失。 */
            contain: none;
        }
        .xch-export-stage .ziwei-board.export-render-copy {
            box-sizing: border-box !important;
            font-family: -apple-system, BlinkMacSystemFont, "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", sans-serif !important;
            font-stretch: normal !important;
            text-rendering: geometricPrecision;
            -webkit-font-smoothing: antialiased;
        }
        .xch-export-stage .ziwei-board.export-render-copy * {
            box-sizing: border-box;
            font-stretch: normal !important;
        }

        /* PNG 匯出模式：固定正方形高解析尺寸，避免文字與宮位資訊擠壓 */
        /* 匯出：盤面 1280px 是桌機 680px 的 1.892 倍，內容必須同倍率放大，
           否則字級停在原尺寸、資訊擠在四角、中間留下大片空白。 */
        .ziwei-board.export-mode {
            --sscale: 1.892;
            width: 1280px !important;
            max-width: none !important;
            height: 1280px !important;
            aspect-ratio: auto !important;
            box-shadow: none !important;
        }
        /* fix28：匯出時不再裁切宮格，並保留底部安全邊界。
           html2canvas 1.4.1 畫文字時用 fillText(text, bounds.left, bounds.top + fontMetrics.baseline)，
           而 fontMetrics 是用「沒有設定 line-height」的隱藏容器量出來的（等同 line-height: normal）。
           盤面下緣的欄位一律 line-height: 1，中日韓字型的 normal 行高約 1.4~1.5em，
           兩者的半行距差會讓每一行文字往下位移約 11px（1280px 版面），
           下緣最後一列（大限起歲／宮職／宮干支）因此落在 overflow: hidden 的裁切線上被切一半。
           行高改成 normal 沒有用（實測反而多切 4%），因為這些欄位是固定高的 flex 置中格子；
           唯一有效的做法是不要跟 html2canvas 的基線硬碰：解除裁切並預留底部空間。
           實測底部 60px 帶的墨量比：修正前 0.860（9/12 宮位缺墨）→ 修正後 1.038（0/12）。 */
        .ziwei-board.export-mode .palace-cell {
            overflow: visible !important;
            padding-bottom: calc(10px * var(--sscale, 1)) !important;
        }
        .ziwei-board.export-mode .palace-footer,
        .ziwei-board.export-mode .palace-age-block,
        .ziwei-board.export-mode .palace-name-block,
        .ziwei-board.export-mode .palace-role-grid,
        .ziwei-board.export-mode .palace-meta,
        .ziwei-board.export-mode .palace-nayin-ganzhi,
        .ziwei-board.export-mode .palace-month-stem,
        .ziwei-board.export-mode .palace-current-age,
        .ziwei-board.export-mode .palace-current-year,
        .ziwei-board.export-mode .palace-decade-start-age { overflow: visible !important; }

        /* fix29：宮職色籤（大限／流年／流月／流日／流時）內的白字置中。
           同樣是 html2canvas 的基線問題，但這裡不會被裁切，而是白字整體下移約
           8.5px（2048px 輸出），下半截落到彩色底之外的白色宮格上，看起來像被削掉。
           色籤是 inline-flex + align-items:center，把行高交還給 normal 後，
           文字框與 html2canvas 量測基線所用的模型一致，白字即回到正中央。
           實測白字中心偏移：+8.5px → +0.0px。
           代價是色籤高度由 43px 增為 54px（2048px 輸出），
           實測同欄相鄰色籤最小間隙仍為 6px，未產生重疊。
           注意：必須維持 height:auto，一旦把高度鎖回原尺寸，偏移會回到 +9.5px。 */
        .ziwei-board.export-mode .palace-layer-label {
            line-height: normal !important;
            overflow: visible !important;
        }
        .ziwei-board.export-mode .stars-container { overflow: visible !important; }
        .ziwei-board.export-mode .star-text,
        .ziwei-board.export-mode .star-char {
            line-height: 1.08 !important;
            letter-spacing: 0 !important;
        }
        .ziwei-board.export-mode .sihua-stack,
        .ziwei-board.export-mode .sihua-markers {
            gap: 1px !important;
        }
        .ziwei-board.export-mode .palace-meta { grid-row: 2 / -1; }
        .ziwei-board.export-mode .center-board {
            padding: calc(30px * var(--sscale)) calc(40px * var(--sscale)) !important;
        }
        .ziwei-board.export-mode .palace-footer .palace-nayin-ganzhi,
        .ziwei-board.export-mode .palace-footer .palace-name-block,
        .ziwei-board.export-mode .palace-footer .palace-layers {
            overflow: visible !important;
        }
    
        /* ═══ 命例查詢停靠面板：不覆蓋命盤，查資料時仍看得到盤 ═══ */
        .case-dock {
            position: fixed;
            right: 12px;
            bottom: 12px;
            z-index: 45;                 /* 低於 z-50 的個案／命例歷程視窗 */
            width: min(420px, calc(100vw - 24px));
            max-height: min(60vh, 520px);
            display: flex;
            flex-direction: column;
            overflow: hidden;
            background: #FFFFFF;
            border: 1px solid #E2DAD4;
            border-radius: 14px;
            box-shadow: 0 12px 32px rgba(60, 52, 46, .18);
        }
        .case-dock.hidden { display: none; }
        .case-dock-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            padding: 8px 10px 8px 14px;
            border-bottom: 1px solid #EDE7E2;
            background: #FBF9F7;
            cursor: default;
        }
        .case-dock-body {
            display: flex;
            flex-direction: column;
            min-height: 0;
            flex: 1;
        }
        .case-dock.is-collapsed { max-height: none; }
        .case-dock.is-collapsed .case-dock-body { display: none; }
        .case-dock.is-collapsed .case-dock-sub { display: none; }
        .case-dock.is-collapsed #case-search-collapse-icon { transform: rotate(180deg); }

        .case-dock-fab {
            position: fixed;
            right: 12px;
            bottom: 12px;
            z-index: 44;
            display: inline-flex;
            align-items: center;
            gap: 6px;
            padding: 9px 14px;
            border: 1px solid #75627B;
            border-radius: 999px;
            background: #85708C;
            color: #FFFFFF;
            font-size: 12px;
            font-weight: 700;
            box-shadow: 0 6px 18px rgba(60, 52, 46, .22);
            cursor: pointer;
        }
        .case-dock-fab:hover { background: #75627B; }
        .case-dock-fab.hidden { display: none; }

        @media (max-width: 767px) {
            .case-dock {
                right: 6px;
                left: 6px;
                bottom: 6px;
                width: auto;
                max-height: 52vh;
            }
            .case-dock-fab { right: 8px; bottom: 8px; padding: 8px 12px; }
        }

        /* 面板展開時，底部留出空間，命盤仍可完整捲到可視範圍 */
        body.case-dock-open { padding-bottom: calc(min(60vh, 520px) + 24px) !important; }
        @media (max-width: 767px) { body.case-dock-open { padding-bottom: calc(52vh + 20px) !important; } }
        body.case-dock-open.case-dock-collapsed { padding-bottom: 84px !important; }

        /* 匯出、列印與教學模式時不顯示 */
        @media print { .case-dock, .case-dock-fab { display: none !important; } }
        body.teaching-mode .case-dock-fab { display: none !important; }

        /* 工具列一致化：性別直接點選、星系與四化橫向排列 */
        .gender-choice, .toolbar-choice {
            display:inline-flex; align-items:center; gap:4px; cursor:pointer;
            font-size:12px; line-height:1; font-weight:700; color:#5F5955; white-space:nowrap;
        }
        .gender-choice input, .toolbar-choice input { margin:0; accent-color:#8A837E; }
        .sihua-horizontal { display:flex; align-items:center; gap:6px; flex-wrap:nowrap; }
        .sihua-layer-choice input:disabled + span, .sihua-layer-choice.is-locked { opacity:.45; }
        #sihua-limit-hint {
            font-size:11px; font-weight:700; color:#B86B67; white-space:nowrap;
            opacity:0; transition:opacity .18s ease; margin-left:2px;
        }
        #sihua-limit-hint.show { opacity:1; }
        .decade-compact-group { gap:3px !important; padding-left:8px !important; padding-right:8px !important; }
        .decade-compact-group .decade-nav-btn { padding-left:5px !important; padding-right:5px !important; min-width:24px; }
        #input-decade { min-width:128px !important; width:128px; font-size:11px !important; }
        .three-four-toggle { white-space:nowrap; }
        /* 下拉選單統一為單一小箭頭，避免原生箭頭撐寬、破壞工具列排版 */
        select.ctrl-input {
            -webkit-appearance: none; -moz-appearance: none; appearance: none;
            background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5'%3E%3Cpath d='M0 0l4 5 4-5z' fill='%23A39A94'/%3E%3C/svg%3E");
            background-repeat: no-repeat;
            background-position: right 5px center;
            padding-right: 16px !important;
            padding-left: 5px !important;
            text-align: left;
            text-align-last: left;
        }
        select.ctrl-input::-ms-expand { display: none; }
        select.ctrl-input.text-center { text-align: center; text-align-last: center; }
        .fly-mode-btn {
            height:24px; min-width:42px; padding:0 8px; border:1px solid #DED7D2; border-radius:5px;
            background:#F7F5F3; color:#625C58; font-size:12px; line-height:22px; font-weight:700;
            text-align:center; white-space:nowrap; transition:.15s ease;
        }
        .fly-mode-btn:hover { background:#EEE9E5; }
        .fly-mode-btn.active {
            background:#8A837E; border-color:#8A837E; color:#fff;
        }
        .toolbar-reset-btn {
            height:24px; padding:0 8px; border:1px solid #D8D0CA; border-radius:5px;
            background:#FFFFFF; color:#746C67; font-size:11px; line-height:22px; font-weight:700;
            display:inline-flex; align-items:center; justify-content:center; gap:4px;
            white-space:nowrap; transition:.15s ease;
        }
        .toolbar-reset-btn:hover { background:#F1EEEB; border-color:#BFB5AE; color:#5F5752; }
        .toolbar-reset-btn:active { transform:translateY(1px); }

        /* 視窗較窄時整體等比縮小：星曜、四化、宮職一起縮，確保不被裁切 */
        @media (max-width: 780px) {
            .ziwei-board { --sscale: 0.84; }
            .palace-cell { grid-template-rows: minmax(0, 1fr) 51px; padding: 4px 5px; }
            .palace-footer { height: 51px; --frow: 14px; --frow-top: 9px; grid-template-columns: 34px minmax(0, 1fr) 38px; }
            .palace-meta { grid-row: 2 / -1; }
            .palace-name-text { font-size: 11.5px !important; }
            .palace-layer-label { min-width: 21px !important; max-width: 28px !important; font-size: 9.5px !important; padding: 1px 2px !important; }
            .palace-decade-start-age { font-size: 11px !important; }
            .palace-current-age, .palace-current-year { font-size: 9px !important; }
            .palace-star-meta-tag { min-width: 24px; height: 13px; font-size: 8px; }
        }
        @media (max-width: 600px) {
            .ziwei-board { --sscale: 0.66; }
            .palace-cell { grid-template-rows: minmax(0, 1fr) 45px; padding: 3px 4px; }
            .palace-footer { height: 45px; --frow: 12px; --frow-top: 9px; grid-template-columns: 28px minmax(0, 1fr) 32px; }
            .palace-name-text { font-size: 10px !important; }
            .palace-layer-label { min-width: 18px !important; max-width: 24px !important; font-size: 8.5px !important; }
            .palace-decade-start-age { font-size: 9.5px !important; }
            .palace-star-meta-tag { min-width: 21px; height: 11px; font-size: 7px; }
        }


        /* 宮位星曜／四化防裁切：保留放大字級，但壓縮欄寬、間距與四化尺寸 */
        .palace-cell {
            --starw: calc(21.5px * var(--sscale, 1));
            --stargap: calc(2.25px * var(--sscale, 1));
            --starfs: calc(18.75px * var(--sscale, 1));
            --shb: calc(20px * var(--sscale, 1));
            --shs: calc(16.5px * var(--sscale, 1));
            --shrow: calc(17px * var(--sscale, 1));
            --starrow: calc(42px * var(--sscale, 1));
        }
        .palace-cell.stars-d2 { --starw:calc(19.5px * var(--sscale,1)); --stargap:calc(1.5px * var(--sscale,1)); --starfs:calc(17.5px * var(--sscale,1)); --shb:calc(18.5px * var(--sscale,1)); --shs:calc(15.5px * var(--sscale,1)); }
        .palace-cell.stars-d3 { --starw:calc(17.5px * var(--sscale,1)); --stargap:calc(1px * var(--sscale,1)); --starfs:calc(15.75px * var(--sscale,1)); --shb:calc(17px * var(--sscale,1)); --shs:calc(14.5px * var(--sscale,1)); }
        .palace-cell.stars-d4 { --starw:calc(15.25px * var(--sscale,1)); --stargap:calc(.5px * var(--sscale,1)); --starfs:calc(14.25px * var(--sscale,1)); --shb:calc(15px * var(--sscale,1)); --shs:calc(13px * var(--sscale,1)); }
        .palace-cell.stars-d5 { --starw:calc(13px * var(--sscale,1)); --stargap:0px; --starfs:calc(12px * var(--sscale,1)); --shb:calc(13px * var(--sscale,1)); --shs:calc(11.5px * var(--sscale,1)); }
        .palace-stars-area { padding-right:2px; }
        .stars-container { padding-left:calc(var(--metaw) - 2px); padding-right:1px; }
        .star-text { max-height:none; overflow:visible; }
        .sihua-stack { row-gap:0; }
        .sihua-slot { row-gap:0; column-gap:0; }
        .birth-sihua, .decade-sihua, .liunian-sihua, .sihua-layer-mark { box-sizing:border-box; }

        /* 2026-07-26：星曜與四化完整收納於宮格，避免貼邊或被裁切 */
        .palace-stars-area {
            padding: 2px 3px 2px 0 !important;
            overflow: hidden !important;
        }
        .stars-container {
            height: 100% !important;
            min-height: 0 !important;
            padding-right: 2px !important;
            overflow: hidden !important;
        }
        .star-group {
            height: 100% !important;
            min-height: 0 !important;
            grid-template-rows: minmax(0, 1fr) auto !important;
            overflow: hidden !important;
        }
        .star-text {
            max-height: 100% !important;
            min-height: 0 !important;
            overflow: hidden !important;
            padding-top: 1px;
            box-sizing: border-box;
        }
        .sihua-stack {
            min-height: 0 !important;
            max-height: calc(var(--shrow) * 3) !important;
            overflow: hidden !important;
            padding-bottom: 1px;
            box-sizing: border-box;
        }
        .sihua-slot {
            min-height: 0 !important;
            max-height: var(--shrow) !important;
            overflow: hidden !important;
        }

        /* 2026-07-26：本命四化固定顯示在各星曜名稱正下方 */
        .star-group {
            display: flex !important;
            flex-direction: column !important;
            align-items: center !important;
            justify-content: flex-start !important;
        }
        .star-text {
            flex: 0 0 auto !important;
            width: var(--starw) !important;
            height: auto !important;
            min-height: 0 !important;
            max-height: none !important;
            overflow: visible !important;
        }
        .sihua-stack {
            flex: 0 0 auto !important;
            width: var(--starw) !important;
            margin-top: 2px !important;
            align-content: start !important;
        }
        .sihua-slot {
            flex: 0 0 var(--shrow) !important;
        }


/* V2.3.2-alpha.2 多胞胎排盤 */
.multiple-birth-settings { box-sizing: border-box; }
.multiple-birth-member-row { display:grid; grid-template-columns:72px 78px minmax(150px,220px); gap:8px; align-items:center; }
@media (max-width:600px){ .multiple-birth-member-row{grid-template-columns:56px 68px minmax(130px,1fr);} .multiple-birth-settings{padding:8px!important;} }


/* V2.3.2-alpha.3：農曆時辰、校時與主工具列收合 */
.toolbar-collapse-strip { display:flex; justify-content:flex-end; margin-bottom:4px; }
.toolbar-collapse-btn { border:1px solid #D6CECA; background:#F8F6F4; color:#6F6863; border-radius:8px; padding:5px 10px; font-size:11px; font-weight:700; display:flex; align-items:center; gap:6px; }
#main-control-panel.main-toolbar-collapsed { display:none !important; }
.calibration-panel { width:100%; margin-top:6px; padding-top:5px; border-top:1px solid #E4DEDA; }
.calibration-five-grid { width:100%; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:3px; align-items:stretch; }
.calibration-five-grid > * { min-width:0; min-height:24px; display:flex; align-items:center; justify-content:center; border:1px solid #D8CFCA; border-radius:4px; background:#FAF8F6; color:#625B57; font-size:10px; font-weight:700; padding:2px; }
.calibration-five-grid button:hover { background:#EEE8E4; }
.calibration-label { background:#85708C !important; color:#fff !important; border-color:#75627B !important; }
.calibration-status { margin-top:4px; text-align:center; font-size:8.5px; line-height:1.35; color:#756E69; }
.calibration-actions { display:flex; justify-content:center; margin-top:3px; }
.calibration-actions button { border:1px solid #CFC5BF; background:#fff; color:#756E69; border-radius:4px; padding:2px 9px; font-size:9px; font-weight:700; }
.ziwei-board.export-mode .calibration-panel { display:none !important; }

/* V2.3.2-alpha.3.2：多胞胎改為性別後方彈窗入口 */
.multiple-birth-open-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 30px;
    padding: 4px 10px;
    border: 1px solid #C9B08F;
    border-radius: 7px;
    background: #F8F3EC;
    color: #7A6043;
    font-size: 11px;
    font-weight: 700;
    transition: background-color .18s ease, border-color .18s ease;
}
.multiple-birth-open-btn:hover { background: #F1E7DA; border-color: #B08C62; }
.multiple-birth-modal-card { max-height: min(86vh, 760px); overflow-y: auto; }

/* 收合後保留展開鍵，控制面板確實退出版面。 */
#main-control-panel.main-toolbar-collapsed {
    display: none !important;
}
.toolbar-collapse-strip {
    position: relative;
    z-index: 35;
}
.toolbar-collapse-btn {
    cursor: pointer;
    user-select: none;
}

/* 校時面板開啟時明確顯示，避免被其他 hidden/display 規則覆蓋。 */
#calibration-panel:not(.hidden) {
    display: block !important;
}

/* V2.3.2-alpha.3.4：工具按鈕作用中狀態 */
#calibration-toolbar-toggle.is-active,
#client-toolbar-toggle.is-active,
#case-toolbar-toggle.is-active,
#case-search-toolbar-toggle.is-active {
    background: #85708C !important;
    border-color: #75627B !important;
    color: #fff !important;
    box-shadow: 0 1px 3px rgba(70, 55, 75, .24);
}

/* 讓作用中的工具按鈕保持在彈窗遮罩上方，可再次點擊關閉 */
#client-toolbar-toggle.is-active,
#case-toolbar-toggle.is-active {
    position: relative;
    z-index: 60;
}

/* V2.3.2-alpha.3.5：教學列可獨立收合 */
#teaching-toolbar { transition: padding .18s ease, border-radius .18s ease; }
#teaching-toolbar .teaching-toolbar-title { background: transparent; border: 0; cursor: pointer; }
#teaching-toolbar .teaching-toolbar-title:hover { opacity: .92; }
#teaching-toolbar.is-collapsed { padding-top: 6px; padding-bottom: 6px; }
#teaching-toolbar.is-collapsed .teaching-toolbar-header { min-height: 28px; }
#teaching-toolbar-options.hidden { display: none !important; }
@media (max-width: 767px) {
  #teaching-toolbar .teaching-toolbar-header { align-items: flex-start; }
  #teaching-toolbar .teaching-toolbar-title { text-align: left; }
}

/* V2.3.2-alpha.3.6-fix4：介面操作修正 */
#multiple-birth-modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 70 !important;
    align-items: center !important;
    justify-content: center !important;
    overflow-y: auto;
}
#multiple-birth-modal.hidden { display: none !important; }
#multiple-birth-modal.flex { display: flex !important; }
.multiple-birth-modal-card { margin: auto; }
.teaching-toolbar-single-row {
    display: flex;
    align-items: center;
    gap: 5px;
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: thin;
}
.teaching-toolbar-single-row > button { flex: 0 0 auto; white-space: nowrap; }
.teaching-toolbar-label { white-space: nowrap; }


/* fix5：手機教學畫面鎖定，避免繪圖時頁面跟著滑動 */
body.teaching-screen-locked {
    overflow: hidden !important;
    overscroll-behavior: none;
    touch-action: none;
}
body.teaching-screen-locked #teaching-layer {
    touch-action: none;
}
body.teaching-screen-locked #teaching-toolbar,
body.teaching-screen-locked #teaching-toolbar button {
    touch-action: manipulation;
}
#teaching-screen-lock.is-locked {
    background: #4A4542 !important;
    border-color: #3E3A37 !important;
}


/* V2.3.2-alpha.3.6-fix16：校時還原狀態與介面修正 */
.calibration-five-grid {
  grid-template-columns: minmax(58px,.8fr) repeat(4,minmax(72px,1fr));
  gap: 6px;
}
.calibration-five-grid > * {
  min-height: 38px;
  font-size: 13px;
  border-radius: 7px;
  padding: 6px 8px;
  touch-action: manipulation;
}
.calibration-status {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 8px;
  margin-top: 7px;
  font-size: 11px;
  line-height: 1.35;
}
.calibration-time-item {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 6px 7px;
  border: 1px solid #E1D8D2;
  border-radius: 7px;
  background: #FCFAF8;
  white-space: nowrap;
}
.calibration-time-item span { color:#8A7D75; font-weight:700; }
.calibration-time-item strong { color:#5F5752; font-size:11.5px; }
#multiple-birth-modal {
  height: 100dvh !important;
  min-height: 100vh !important;
  padding: max(12px, env(safe-area-inset-top)) 12px max(12px, env(safe-area-inset-bottom)) !important;
  overflow: hidden !important;
}
#multiple-birth-modal.flex {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
#multiple-birth-modal .multiple-birth-modal-card {
  margin: 0 auto !important;
  max-height: calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
  overflow-y: auto;
  overscroll-behavior: contain;
}
@media (max-width: 640px) {
  .calibration-panel { overflow-x:auto; }
  .calibration-five-grid { min-width: 390px; }
  .calibration-status { min-width: 390px; }
  .calibration-time-item strong { font-size: 11px; }
}


/* V2.3.2-alpha.3.6-fix16：還原按鈕依校正狀態啟用 */
#calibration-restore-button:disabled {
  opacity: .42;
  cursor: default;
  background: #F1EFED;
  color: #9C9692;
  border-color: #DED9D5;
  box-shadow: none;
}
#calibration-restore-button.is-enabled {
  opacity: 1;
  cursor: pointer;
  background: #FAF8F6;
  color: #625B57;
}

/* V2.3.2 Alpha 3.6-fix16：教學列與命盤等寬，並上移保留離心自化箭頭空間 */
:root {
    --ziwei-board-max-width: 680px;
}
#teaching-toolbar {
    width: min(var(--ziwei-board-max-width), 100%) !important;
    max-width: var(--ziwei-board-max-width) !important;
    margin-left: auto;
    margin-right: auto;
    transform: translateY(-10px);
    box-sizing: border-box;
}
#teaching-toolbar .teaching-toolbar-single-row {
    width: 100%;
    max-width: 100%;
}
.ziwei-board {
    width: min(var(--ziwei-board-max-width), 100%);
    max-width: var(--ziwei-board-max-width);
}


/* V2.3.2 Alpha 3.6-fix16：多胞胎視窗強制以瀏覽器視窗置中並放大 */
#multiple-birth-modal {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: 100dvh !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: max(18px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) max(18px, env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left)) !important;
  box-sizing: border-box !important;
  z-index: 9999 !important;
  overflow: hidden !important;
  transform: none !important;
}
#multiple-birth-modal.flex {
  display: grid !important;
  place-items: center !important;
}
#multiple-birth-modal .multiple-birth-modal-card {
  position: relative !important;
  inset: auto !important;
  width: min(560px, calc(100vw - 36px)) !important;
  max-width: 560px !important;
  min-width: min(460px, calc(100vw - 36px)) !important;
  max-height: calc(100dvh - 36px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
  margin: 0 !important;
  transform: none !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  font-size: 15px;
}
#multiple-birth-modal .multiple-birth-modal-card h2 { font-size: 18px; }
#multiple-birth-modal .multiple-birth-modal-card .ctrl-input { min-height: 42px; font-size: 14px; }
#multiple-birth-modal .multiple-birth-modal-card button { min-height: 40px; font-size: 13px; }
#multiple-birth-modal .multiple-birth-member-row { gap: 10px; }
@media (max-width: 640px) {
  #multiple-birth-modal { padding: max(10px, env(safe-area-inset-top)) 10px max(10px, env(safe-area-inset-bottom)) !important; }
  #multiple-birth-modal .multiple-birth-modal-card {
    width: calc(100vw - 20px) !important;
    min-width: 0 !important;
    max-width: calc(100vw - 20px) !important;
    max-height: calc(100dvh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
  }
}

/* V2.3.2 Alpha 3.6-fix16：校時列切齊八字大運，展開時避免中宮文字被裁切 */
.center-board {
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: #D8CFCA transparent;
}
.center-board.calibration-open {
  justify-content: flex-start;
  padding-top: 18px;
  padding-bottom: 18px;
}
#calibration-panel {
  width: 100%;
  max-width: 310px;
  box-sizing: border-box;
  flex: 0 0 auto;
}
.calibration-five-grid {
  width: 100%;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 5px;
  box-sizing: border-box;
}
.calibration-five-grid > * {
  width: 100%;
  min-width: 0;
  min-height: 38px;
  padding: 5px 2px;
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
  box-sizing: border-box;
}
.calibration-status {
  width: 100%;
  max-width: 310px;
  box-sizing: border-box;
  gap: 5px;
}
.calibration-time-item {
  padding: 6px 4px;
  overflow: hidden;
}
.calibration-time-item strong {
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (max-width: 640px) {
  .center-board.calibration-open {
    padding-top: 12px;
    padding-bottom: 12px;
  }
  .calibration-panel,
  .calibration-five-grid,
  .calibration-status {
    min-width: 0 !important;
    max-width: 310px;
    overflow: visible;
  }
  .calibration-five-grid > * {
    min-height: 34px;
    font-size: 11px;
    padding-left: 1px;
    padding-right: 1px;
  }
  .calibration-time-item {
    white-space: normal;
    line-height: 1.25;
  }
}

/* V2.3.2 Alpha 3.6-fix16：多胞胎視窗加大，文字與選項不裁切 */
#multiple-birth-modal .multiple-birth-modal-card {
  width: min(720px, calc(100vw - 40px)) !important;
  max-width: 720px !important;
  min-width: min(600px, calc(100vw - 40px)) !important;
  max-height: calc(100dvh - 40px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
  display: flex;
  flex-direction: column;
  overflow: hidden !important;
}
#multiple-birth-modal .multiple-birth-modal-card > :first-child,
#multiple-birth-modal .multiple-birth-modal-card > :last-child {
  flex: 0 0 auto;
}
#multiple-birth-modal .multiple-birth-modal-card > .space-y-3 {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 18px !important;
}
#multiple-birth-modal .multiple-birth-modal-card h2 {
  font-size: 20px;
  line-height: 1.35;
}
#multiple-birth-modal .multiple-birth-modal-card .text-\[11px\],
#multiple-birth-modal .multiple-birth-modal-card .text-\[10px\],
#multiple-birth-modal .multiple-birth-modal-card .text-\[12px\] {
  line-height: 1.55;
}
#multiple-birth-modal .multiple-birth-member-row {
  grid-template-columns: 78px 96px minmax(260px, 1fr);
  gap: 12px;
  min-height: 48px;
  align-items: center;
}
#multiple-birth-modal .multiple-birth-member-row > * {
  min-width: 0;
}
#multiple-birth-modal .multiple-birth-member-row .ctrl-input,
#multiple-birth-modal select.ctrl-input {
  width: 100%;
  min-height: 44px;
  height: auto;
  padding: 8px 10px;
  font-size: 14px;
  line-height: 1.35;
  text-overflow: clip;
}
#multiple-birth-modal .multiple-birth-modal-card button {
  min-height: 42px;
  padding-top: 8px;
  padding-bottom: 8px;
  line-height: 1.25;
}
@media (max-width: 640px) {
  #multiple-birth-modal .multiple-birth-modal-card {
    width: calc(100vw - 16px) !important;
    min-width: 0 !important;
    max-width: calc(100vw - 16px) !important;
    max-height: calc(100dvh - 16px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
  }
  #multiple-birth-modal .multiple-birth-modal-card > .space-y-3 {
    padding: 12px !important;
  }
  #multiple-birth-modal .multiple-birth-member-row {
    grid-template-columns: 58px 72px minmax(0, 1fr);
    gap: 7px;
    min-height: 46px;
  }
  #multiple-birth-modal .multiple-birth-member-row .ctrl-input,
  #multiple-birth-modal select.ctrl-input {
    min-height: 42px;
    padding: 7px 5px;
    font-size: 12px;
  }
}
@media (max-width: 390px) {
  #multiple-birth-modal .multiple-birth-member-row {
    grid-template-columns: 1fr 1fr;
  }
  #multiple-birth-modal .multiple-birth-member-row > span {
    grid-column: 1 / -1;
  }
  #multiple-birth-modal .multiple-birth-member-row > select:last-child {
    grid-column: 1 / -1;
  }
}

/* fix16 */
.multiple-birth-guidance{display:flex;flex-wrap:wrap;gap:.25rem;align-items:baseline}
.palace-cell.teaching-fly-source{outline:3px solid rgba(133,112,140,.75);outline-offset:-4px;box-shadow:inset 0 0 0 2px rgba(255,255,255,.8)}
#tool-flystar.active{background:#5F5365!important;border-color:#4E4353!important}
@media (min-width:700px){.multiple-birth-guidance{flex-wrap:nowrap}}


/* V2.3.2 Alpha 3.6-fix16：多胞胎、校時、飛星與顯示控制 */
#multiple-birth-modal .multiple-birth-modal-card { width:min(760px, calc(100vw - 28px)) !important; }
#multiple-birth-modal label[for="multiple-birth-count"],
#multiple-birth-modal .multiple-birth-count-label { writing-mode:horizontal-tb !important; white-space:nowrap; }
#multiple-birth-modal .space-y-3 > .flex.flex-wrap { flex-wrap:nowrap; align-items:center; }
#multiple-birth-modal .space-y-3 > .flex.flex-wrap > label { flex-direction:row; white-space:nowrap; }
.multiple-birth-guidance { font-size:12px; line-height:1.55; align-items:baseline; }
.calibration-time-item { display:grid; grid-template-columns:18px minmax(0,1fr); gap:3px; padding:6px 3px; }
.calibration-time-item span { text-align:center; font-size:12px; }
.calibration-time-item strong { font-size:11px; overflow:visible; text-overflow:clip; white-space:nowrap; letter-spacing:-.15px; }
#dynamic-layer path { vector-effect:non-scaling-stroke; }
@media (max-width:640px) {
  #multiple-birth-modal .space-y-3 > .flex.flex-wrap { flex-wrap:wrap; }
  #multiple-birth-modal .multiple-birth-modal-card { width:calc(100vw - 18px) !important; }
  .calibration-time-item strong { font-size:10.5px; }
}


/* V2.3.2 Alpha 3.6-fix16：多胞胎操作列、拆分顯示與教學工具 */
.multiple-birth-top-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.multiple-birth-selectors{display:flex;align-items:center;gap:12px;flex-wrap:wrap;min-width:0;flex:1}
.multiple-birth-count-label{display:flex;align-items:center;gap:8px;white-space:nowrap}
.multiple-birth-inline-actions{display:flex;align-items:center;gap:8px;margin-left:auto}
#tool-selfhua.active{background:#5C7482;border-color:#4F6571;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
#bazi-section{min-width:0}
#bazi-columns,#dayun-list{max-width:100%}
@media(max-width:640px){
  .multiple-birth-top-row{align-items:flex-start}
  .multiple-birth-inline-actions{width:100%;justify-content:flex-end;margin-left:0}
  .multiple-birth-selectors{width:100%}
}


/* V2.3.2 Alpha 3.6-fix16：多胞胎按鈕、八字大運連動與教學飛星辨識 */
#multiple-birth-cancel-btn{
  min-width:88px;
  padding-left:18px!important;
  padding-right:18px!important;
  white-space:nowrap;
  flex:0 0 auto;
}
#multiple-birth-apply-btn{
  min-width:118px;
  padding-left:20px!important;
  padding-right:20px!important;
  white-space:nowrap;
  flex:0 0 auto;
}
.multiple-birth-inline-actions{flex-wrap:nowrap;min-width:max-content}
#dynamic-layer text{pointer-events:none}
@media(max-width:640px){
  #multiple-birth-cancel-btn{min-width:82px;padding-left:14px!important;padding-right:14px!important}
  #multiple-birth-apply-btn{min-width:110px;padding-left:16px!important;padding-right:16px!important}
}

/* fix17：三方／四正分離與多胞胎表單向下延伸 */
.palace-cell.active-three-basis{box-shadow:inset 0 0 0 3px rgba(126,103,78,.58)}
#three-four-layer{pointer-events:none}
#multiple-birth-modal .multiple-birth-modal-card{overflow:hidden;display:flex;flex-direction:column;max-height:min(88vh,780px)}
#multiple-birth-modal .multiple-birth-modal-card>.space-y-3{overflow-y:auto;overscroll-behavior:contain;padding-top:12px!important;padding-bottom:18px!important}
#multiple-birth-modal .multiple-birth-top-row{position:sticky;top:-12px;z-index:4;background:#fff;padding-top:12px;padding-bottom:10px;margin-bottom:0}
#multiple-birth-modal .multiple-birth-selectors{align-items:center}
#multiple-birth-modal #multiple-birth-summary{min-height:0;margin-top:2px}
#multiple-birth-modal .rounded-lg.border{margin-top:4px}
#multiple-birth-cancel-btn,#multiple-birth-apply-btn{white-space:nowrap;flex:none}
@media (min-width:700px){
 #multiple-birth-modal .multiple-birth-top-row{flex-wrap:nowrap}
 #multiple-birth-modal .multiple-birth-inline-actions{width:auto;justify-content:flex-end}
}


/* V2.3.2 Alpha 3.6-fix18：多胞胎模組結構重整與取消四正 */
#multiple-birth-modal .multiple-birth-modal-card{
  width:min(780px,calc(100vw - 28px))!important;
  max-height:min(88vh,780px);
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
#multiple-birth-modal .multiple-birth-modal-header,
#multiple-birth-modal .multiple-birth-fixed-controls{flex:0 0 auto;background:#fff}
#multiple-birth-modal .multiple-birth-fixed-controls{border-bottom:1px solid #eee7df}
#multiple-birth-modal .multiple-birth-top-row{position:static!important;top:auto!important;padding:0!important;margin:0!important;display:flex;align-items:center;gap:12px;flex-wrap:nowrap}
#multiple-birth-modal .multiple-birth-selectors{display:flex;align-items:center;gap:10px;flex:1 1 auto;min-width:0;flex-wrap:wrap}
#multiple-birth-modal .multiple-birth-inline-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto;margin-left:auto;white-space:nowrap}
#multiple-birth-modal #multiple-birth-summary{margin-top:6px;min-height:14px}
#multiple-birth-modal .multiple-birth-scroll-body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-top:12px;padding-bottom:18px!important}
#multiple-birth-modal .multiple-birth-editor-panel{margin:0!important}
#multiple-birth-modal .multiple-birth-guidance{margin:0 0 10px 0!important}
#multiple-birth-modal #multiple-birth-member-editor{align-content:start}
#multiple-birth-modal .multiple-birth-member-row:last-child{margin-bottom:2px}
@media(max-width:699px){
  #multiple-birth-modal .multiple-birth-modal-card{width:calc(100vw - 18px)!important;max-height:92vh}
  #multiple-birth-modal .multiple-birth-top-row{flex-wrap:wrap}
  #multiple-birth-modal .multiple-birth-selectors{width:100%;flex-basis:100%}
  #multiple-birth-modal .multiple-birth-inline-actions{width:100%;justify-content:flex-end;margin-left:0}
}

/* ═══ fix27：淨空中宮 ═══
   只讓中宮的文字內容不可見，方框、格線與版面高度全部維持原狀。
   刻意使用 visibility 而非 display:none —— 中宮方框的實際矩形是
   向心自化夾制與箭頭端點的計算基準，用 display:none 會讓內容抽離
   而改變 .center-board 的量測結果。校時面板仍可正常開啟使用。 */
.ziwei-board.center-blank .center-board .center-summary,
.ziwei-board.center-blank .center-board #bazi-section,
.ziwei-board.center-blank .center-board #xchexp-bazi-section {
    visibility: hidden !important;
}

/* ═══ fix32：流運快選列（橫式、可鎖定置頂）═══
   主工具列位於頁面上方，切換流月／流日時必須往回捲，手機與平板尤其不便。
   這一列把五個流運選單以橫式排在最上方，每個都附上一步鍵；按「鎖定」後
   改為 position:fixed 常駐畫面頂端，並以等高佔位元素補回文件流高度。 */
.flow-dock {
    width: 100%;
    /* 快選列可比主面板略寬，桌機才不必橫捲 */
    max-width: min(64rem, calc(100vw - 16px));
    margin: 0 auto 6px;
    background: #FFFFFF;
    border: 1px solid #E7E2DD;
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(120, 110, 100, 0.08);
    z-index: 45;
}
.flow-dock.is-locked {
    position: fixed;
    top: 4px;
    width: min(64rem, calc(100vw - 16px));
    left: 50%;
    transform: translateX(-50%);
    box-shadow: 0 4px 14px rgba(120, 110, 100, 0.18);
}
.flow-dock-inner {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 4px;
    padding: 5px 6px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}
.flow-dock-group {
    display: flex;
    align-items: center;
    gap: 2px;
    flex: 0 0 auto;
    padding-right: 4px;
    border-right: 1px solid #F0EBE6;
}
.flow-dock-group:last-of-type { border-right: none; }
.flow-dock-label {
    font-size: 11px;
    font-weight: 800;
    color: #8A837E;
    letter-spacing: 0.04em;
    white-space: nowrap;
}
.flow-dock-select {
    font-size: 12px;
    font-weight: 700;
    color: #6F6863;
    background: #FAF8F6;
    border: 1px solid #E7E2DD;
    border-radius: 6px;
    padding: 4px 2px;
    min-width: 54px;
    text-align: center;
    text-align-last: center;
}
.flow-dock-select-wide { min-width: 78px; }
.flow-dock-select:disabled { opacity: 0.45; }
/* 觸控目標維持 30px 以上，手機單手也點得到 */
.flow-dock-nav,
.flow-dock-btn {
    min-width: 28px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 0 4px;
    font-size: 12px;
    font-weight: 700;
    color: #6F6863;
    background: #F3EFEB;
    border: 1px solid #E7E2DD;
    border-radius: 6px;
    cursor: pointer;
}
.flow-dock-nav:hover,
.flow-dock-btn:hover { background: #E9E3DD; }
.flow-dock-actions {
    display: flex;
    align-items: center;
    gap: 4px;
    flex: 0 0 auto;
    margin-left: auto;
    padding-left: 6px;
}
.flow-dock-lock[aria-pressed="true"] {
    background: #6A937C;
    border-color: #5D8570;
    color: #FFFFFF;
}
#flow-dock-spacer { width: 100%; height: 0; }

@media (max-width: 780px) {
    .flow-dock { border-radius: 8px; margin-bottom: 4px; }
    .flow-dock.is-locked { top: 0; left: 0; transform: none; max-width: 100%; border-radius: 0; }
    .flow-dock-inner { gap: 4px; padding: 4px 6px; }
    .flow-dock-label { font-size: 10px; }
    .flow-dock-select { font-size: 11px; min-width: 54px; padding: 4px 2px; }
    .flow-dock-select-wide { min-width: 74px; }
    .flow-dock-actions { margin-left: 6px; }
}


/* V2.3.2 Alpha 3.6-fix34：日曆比較盤、星組與教學三合快捷列 */
.toolbar-collapse-strip{display:flex;gap:8px;align-items:center;justify-content:space-between}.compare-toolbar-actions{display:flex;gap:6px;flex-wrap:wrap}.compare-action-btn{width:auto;padding:6px 10px}.custom-star-panel{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;padding:8px;border:1px solid #e7e5e4;border-radius:8px;background:#fafaf9}.custom-star-panel.hidden{display:none}.custom-star-panel label{font-size:11px;font-weight:700;color:#625b56;border:1px solid #ddd6d0;border-radius:6px;padding:4px 7px;background:white;white-space:nowrap}.teaching-sanhe-panel{position:absolute;left:50%;bottom:100%;transform:translateX(-50%);z-index:24;display:grid;grid-template-columns:repeat(8,minmax(42px,1fr));gap:4px;width:min(100%,560px);padding:6px;border-radius:8px;background:rgba(74,69,66,.97);box-shadow:0 5px 16px rgba(0,0,0,.22)}.teaching-sanhe-panel.hidden{display:none}.teaching-sanhe-panel button{border:1px solid #a39a94;border-radius:5px;background:#f7f5f3;color:#5f5854;font-size:11px;font-weight:800;padding:5px 3px}.compare-workspace{width:100%;max-width:1400px;display:flex;flex-direction:column;gap:10px;align-items:center}.compare-primary{min-width:0}.compare-secondary{width:100%;min-width:0;border:1px solid #d6d3d1;border-radius:10px;background:white;overflow:hidden}.compare-secondary-header{height:36px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;background:#f5f5f4;color:#625b56;font-size:12px}.compare-secondary-header button{font-size:11px;font-weight:700}.compare-secondary iframe{display:block;width:100%;height:min(78vw,840px);border:0;background:white}.compare-workspace.is-side-by-side{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}.compare-workspace.is-side-by-side .compare-primary,.compare-workspace.is-side-by-side .compare-secondary{width:100%}.compare-workspace.layout-locked{touch-action:none;overscroll-behavior:contain}.calendar-compare-modal{position:fixed;inset:0;z-index:90;display:flex;align-items:flex-start;justify-content:center;padding:7vh 12px 12px;background:rgba(0,0,0,.42)}.calendar-compare-modal.hidden{display:none}.calendar-compare-card{width:min(620px,100%);border-radius:14px;background:white;box-shadow:0 18px 50px rgba(0,0,0,.3);overflow:hidden}.calendar-compare-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid #e7e5e4;color:#625b56}.calendar-compare-header h2{font-weight:800}.calendar-compare-body{padding:14px}.calendar-compare-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.calendar-compare-fields label{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:#625b56}.calendar-compare-fields label.wide{grid-column:1/-1}.calendar-compare-fields input,.calendar-compare-fields select{min-width:0;flex:1;border:1px solid #d6d3d1;border-radius:6px;padding:7px;background:white}.calendar-compare-fields .check input{flex:0 0 auto}.calendar-compare-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}.calendar-compare-actions button{border:1px solid #a8a29e;border-radius:6px;padding:7px 12px;font-size:12px;font-weight:800;color:#625b56}.calendar-compare-actions button.primary{background:#6a937c;color:white;border-color:#6a937c}.compare-embedded{padding:4px!important}.compare-embedded>body{}.compare-embedded #flow-dock,.compare-embedded #flow-dock-spacer,.compare-embedded .toolbar-collapse-strip,.compare-embedded #main-control-panel,.compare-embedded #teaching-toolbar,.compare-embedded #pinned-project-sidebar,.compare-embedded footer,.compare-embedded body>div[aria-label="網站品牌"],.compare-embedded .compare-toolbar-actions{display:none!important}.compare-embedded #capture-area{margin-top:0!important}.compare-embedded #ziwei-board{max-width:100%!important}
@media(max-width:900px){.compare-workspace.is-side-by-side{grid-template-columns:1fr}.teaching-sanhe-panel{grid-template-columns:repeat(4,1fr);width:min(96%,360px)}.compare-secondary iframe{height:900px}}
@media(max-width:560px){.toolbar-collapse-strip{align-items:stretch;flex-direction:column}.compare-toolbar-actions{width:100%}.compare-action-btn{flex:1}.calendar-compare-fields{grid-template-columns:1fr}.calendar-compare-fields label.wide{grid-column:auto}}

.compare-embedded > div[aria-label="網站品牌"]{display:none!important}
/* V2.3.2 Alpha 3.6-fix35：比較盤快速日期碼 */
.teaching-sanhe-wrap{position:relative;display:inline-flex}.compare-quick-label{display:block;font-size:12px;font-weight:800;color:#625b56;margin-bottom:6px}.compare-quick-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}.compare-quick-row input{min-width:0;border:2px solid #b9aea6;border-radius:8px;padding:11px 12px;font-size:18px;font-weight:800;letter-spacing:.08em;font-variant-numeric:tabular-nums}.compare-quick-row button,.compare-shortcuts button{border:1px solid #a8a29e;border-radius:7px;padding:8px 12px;font-size:12px;font-weight:800;color:#625b56;background:white}.compare-quick-row button.primary{background:#6a937c;color:white;border-color:#6a937c}.compare-quick-help{margin-top:6px;font-size:11px;line-height:1.5;color:#78716c}.compare-quick-error{margin-top:7px;padding:7px 9px;border:1px solid #efc7c5;border-radius:7px;background:#fdf5f5;color:#a9504c;font-size:12px;font-weight:700}.compare-shortcuts{display:flex;gap:7px;margin-top:11px}.compare-advanced{margin-top:12px;padding-top:12px;border-top:1px solid #e7e5e4}.compare-embedded #calendar-compare-modal,.compare-embedded #compare-secondary{display:none!important}.compare-embedded #compare-workspace{display:block!important}.compare-embedded #capture-area{width:100%!important}
@media(max-width:560px){.calendar-compare-modal{padding-top:3vh}.compare-quick-row{grid-template-columns:1fr}.compare-quick-row input{font-size:16px}.compare-quick-row button{width:100%}.compare-shortcuts button{flex:1}}

/* fix38：單盤工具列／命盤並排與可鎖定版面 */
.main-work-layout{width:100%;max-width:1400px;display:flex;flex-direction:column;align-items:center;gap:10px}
.work-layout-controls{width:100%;display:flex;flex-direction:column;align-items:center;min-width:0}
.work-layout-chart{width:100%;min-width:0}
.main-work-layout.is-side-layout{display:grid;grid-template-columns:var(--controls-width,420px) minmax(0,1fr);align-items:start;gap:12px}
.main-work-layout.is-side-layout .work-layout-controls{width:var(--controls-width,420px);max-width:55vw;min-width:300px;resize:horizontal;overflow:auto;align-items:stretch}
.main-work-layout.is-side-layout .work-layout-controls>.max-w-4xl,.main-work-layout.is-side-layout #main-control-panel,.main-work-layout.is-side-layout #teaching-toolbar{max-width:none;width:100%}
.main-work-layout.is-side-layout .work-layout-chart{align-self:start}
.main-work-layout.is-side-layout.is-layout-locked .work-layout-controls{resize:none;overflow:hidden}
.main-work-layout.is-layout-locked{user-select:none}
#compare-layout-lock.active{background:#6a937c;color:#fff;border-color:#5c7d6a}

/* fix38：三合展開列，以畫圈至清除框線作為左右邊界 */
.teaching-sanhe-panel{position:fixed;left:0;bottom:auto;transform:none;z-index:95;display:flex;flex-direction:column;gap:4px;width:560px;max-width:calc(100vw - 12px);padding:6px;border-radius:8px;background:rgba(74,69,66,.98);box-shadow:0 5px 18px rgba(0,0,0,.26)}
.teaching-sanhe-panel.hidden{display:none}
.teaching-flow-dock-host{width:100%}
.teaching-flow-dock-host .flow-dock{display:block!important;position:static!important;transform:none!important;left:auto!important;top:auto!important;width:100%;max-width:none;margin:0;border-radius:6px;box-shadow:none}
.teaching-flow-dock-host .flow-dock-inner{width:100%;justify-content:space-between;overflow-x:auto}
.teaching-sanhe-quick-row{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:4px;width:100%}
.teaching-sanhe-quick-row button{border:1px solid #a39a94;border-radius:5px;background:#f7f5f3;color:#5f5854;font-size:11px;font-weight:800;padding:5px 2px;white-space:nowrap}
#flow-dock:not(.inside-sanhe){display:none}
#flow-dock-spacer{display:none!important}

/* fix38：比較盤固定左右並列且上緣對齊 */
.compare-workspace.has-compare{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:10px}
.compare-workspace.has-compare .compare-primary,.compare-workspace.has-compare .compare-secondary{width:100%;margin-top:0!important;align-self:start}
.compare-secondary{margin-top:0}
.compare-secondary iframe{height:min(70vw,820px)}

/* fix38：獨立日曆 */
.calendar-only-card{width:min(720px,100%)}
.calendar-query-row{display:grid;grid-template-columns:auto minmax(160px,1fr) auto;gap:8px;align-items:center;margin-bottom:10px}
.calendar-query-row button{border:1px solid #a8a29e;border-radius:6px;padding:7px 10px;font-size:12px;font-weight:800;color:#625b56;background:#fff}
.calendar-query-row input{border:1px solid #d6d3d1;border-radius:6px;padding:7px;background:#fff}
.calendar-query-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-top:1px solid #e7e5e4;border-left:1px solid #e7e5e4}
.calendar-query-grid .cal-head,.calendar-query-grid button{min-height:58px;border:0;border-right:1px solid #e7e5e4;border-bottom:1px solid #e7e5e4;background:#fff;padding:5px;text-align:left}
.calendar-query-grid .cal-head{min-height:auto;text-align:center;font-size:11px;font-weight:800;background:#f5f5f4;color:#625b56}
.calendar-query-grid button{font-size:12px;color:#4a4542;cursor:pointer}
.calendar-query-grid button:hover,.calendar-query-grid button.selected{background:#f0ebe6}
.calendar-query-grid button.other-month{opacity:.35}
.calendar-query-grid .lunar{display:block;margin-top:4px;font-size:10px;color:#85708c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.calendar-selected-info{margin-top:10px;border-radius:8px;background:#fafaf9;border:1px solid #e7e5e4;padding:9px 10px;font-size:12px;color:#625b56;line-height:1.6}

@media(max-width:900px){
  .main-work-layout.is-side-layout{grid-template-columns:minmax(260px,38vw) minmax(0,1fr);gap:8px}
  .main-work-layout.is-side-layout .work-layout-controls{min-width:260px;max-width:45vw}
  .teaching-sanhe-panel{padding:4px}
  .teaching-sanhe-quick-row{gap:2px}
  .teaching-sanhe-quick-row button{font-size:10px;padding:4px 1px}
}
.main-work-layout.is-side-layout{grid-template-columns:var(--controls-width,420px) 10px minmax(0,1fr)}
.work-layout-divider{display:none}
.main-work-layout.is-side-layout .work-layout-divider{display:block;align-self:stretch;min-height:240px;border-radius:6px;background:linear-gradient(90deg,transparent 3px,#d6d3d1 3px,#d6d3d1 7px,transparent 7px);cursor:col-resize;touch-action:none}
.main-work-layout.is-side-layout .work-layout-divider:hover{background:linear-gradient(90deg,transparent 2px,#8a837e 2px,#8a837e 8px,transparent 8px)}
.main-work-layout.is-side-layout.is-layout-locked .work-layout-divider{cursor:not-allowed;opacity:.35}
@media(max-width:900px){.main-work-layout.is-side-layout{grid-template-columns:var(--controls-width,36vw) 8px minmax(0,1fr)}}

/* fix38：比較盤各自宮職／四化切換工具列 */
.compare-pane{min-width:0}.compare-primary-pane{width:100%;min-width:0}.compare-pane-flowbar{box-sizing:border-box;width:100%;margin:0 0 6px;padding:6px;border:1px solid #d6d3d1;border-radius:9px;background:#fafaf9;box-shadow:0 2px 7px rgba(74,69,66,.08)}
.compare-pane-flowbar.hidden{display:none}.compare-layer-row{display:grid;grid-template-columns:52px repeat(5,minmax(0,1fr));gap:4px;margin-bottom:4px}.compare-layer-title,.compare-layer-row button{min-height:29px;display:flex;align-items:center;justify-content:center;border:1px solid #cfc8c3;border-radius:5px;font-size:11px;font-weight:800;color:#625b56;background:white}.compare-layer-title{background:#eee9e5;color:#514b47}.compare-layer-row button.is-active{border-color:#6a937c;background:#e9f2ed;color:#466a58;box-shadow:inset 0 0 0 1px #6a937c}.compare-layer-row button[data-kind="sihua"].is-active{border-color:#85708c;background:#f1edf3;color:#66536e;box-shadow:inset 0 0 0 1px #85708c}.compare-step-row{display:grid;grid-template-columns:42px minmax(0,1fr) 42px;gap:4px;margin-left:56px}.compare-step-row button,.compare-step-value{min-height:29px;display:flex;align-items:center;justify-content:center;border:1px solid #cfc8c3;border-radius:5px;background:white;color:#625b56;font-size:11px;font-weight:800}.compare-step-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 6px;background:#f7f5f3}.compare-secondary-header{border-radius:9px 9px 0 0}.compare-secondary iframe{border-top:1px solid #ebe7e4}.compare-workspace.has-compare .compare-primary-pane,.compare-workspace.has-compare .compare-secondary{align-self:start}.compare-workspace.has-compare #capture-area{margin-top:0!important}.compare-workspace.has-compare{align-items:start}.compare-workspace.has-compare .compare-primary-pane{display:flex;flex-direction:column}.compare-workspace.has-compare .compare-secondary{display:flex;flex-direction:column}.compare-embedded .compare-pane-flowbar{display:none!important}
@media(max-width:900px){.compare-layer-row{grid-template-columns:46px repeat(5,minmax(0,1fr));gap:3px}.compare-step-row{margin-left:49px}.compare-pane-flowbar{padding:5px}}

/* fix38：紫微＋八字比較盤 */
.compare-mode-switch{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:12px;padding:4px;border:1px solid #ddd6d0;border-radius:9px;background:#f7f5f3}.compare-mode-switch button{border:1px solid transparent;border-radius:6px;padding:8px;font-size:12px;font-weight:800;color:#625b56}.compare-mode-switch button.is-active{border-color:#6a937c;background:#fff;color:#466a58;box-shadow:0 1px 5px rgba(74,69,66,.12)}.compare-bazi-note{margin:8px 0 12px;padding:10px;border:1px solid #d8e5dd;border-radius:8px;background:#f2f8f4;color:#52695b;font-size:12px;font-weight:700}.compare-bazi-panel{display:flex;flex-direction:column;gap:8px;width:100%;padding:10px;background:#fff;overflow:auto}.compare-bazi-panel.hidden{display:none}.compare-secondary.is-bazi #compare-secondary-flowbar,.compare-secondary.is-bazi #compare-chart-frame{display:none!important}.compare-secondary.is-bazi .compare-bazi-panel{display:flex}.bazi-compare-meta{display:flex;justify-content:space-between;gap:8px;align-items:center;padding:7px 9px;border:1px solid #ddd6d0;border-radius:7px;background:#fafaf9;color:#625b56;font-size:11px}.bazi-compare-table{display:grid;grid-template-columns:50px repeat(4,minmax(0,1fr));border-top:1px solid #cfc8c3;border-left:1px solid #cfc8c3}.bazi-compare-cell{min-height:34px;padding:5px 3px;border-right:1px solid #cfc8c3;border-bottom:1px solid #cfc8c3;display:flex;align-items:center;justify-content:center;text-align:center;font-size:11px;line-height:1.35;color:#514b47;background:#fff;word-break:break-word}.bazi-compare-cell.head,.bazi-compare-cell.label{background:#eee9e5;font-weight:800}.bazi-compare-cell.pillar{font-size:20px;font-weight:900;letter-spacing:.08em}.bazi-compare-cell.shensha{font-size:10px;align-items:flex-start;min-height:62px}.wx-wood{color:#2f8a4b!important}.wx-fire{color:#cf3f35!important}.wx-earth{color:#ad7627!important}.wx-metal{color:#8a7b55!important}.wx-water{color:#2671a8!important}.bazi-dayun-wrap{border:1px solid #d6d3d1;border-radius:8px;overflow:hidden}.bazi-dayun-title,.bazi-liunian-title{padding:7px 9px;background:#eee9e5;color:#514b47;font-size:12px;font-weight:900}.bazi-dayun-grid,.bazi-liunian-grid{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(58px,1fr);overflow-x:auto}.bazi-dayun-item,.bazi-liunian-item{display:grid;grid-template-rows:repeat(3,minmax(28px,auto));border-right:1px solid #ddd6d0;background:#fff;cursor:pointer}.bazi-dayun-item span,.bazi-liunian-item span{display:flex;align-items:center;justify-content:center;padding:4px 2px;border-bottom:1px solid #eee9e5;font-size:10px;white-space:nowrap}.bazi-dayun-item span:first-child,.bazi-liunian-item span:first-child{font-size:15px;font-weight:900}.bazi-dayun-item.is-active,.bazi-liunian-item.is-active{background:#eaf3ed;box-shadow:inset 0 0 0 2px #6a937c}.bazi-liunian-wrap{border-top:1px solid #d6d3d1}.bazi-liunian-grid{grid-auto-columns:minmax(56px,1fr)}@media(max-width:900px){.compare-workspace.has-compare{grid-template-columns:1fr}.compare-bazi-panel{max-height:none}.bazi-compare-cell{font-size:10px}.bazi-compare-cell.pillar{font-size:18px}}