/* 页级样式：luopan
   本页专属的页级规则写在此处，不写进 assets/style.css 的页级段（那一段是存量，只减不增）。
   引用在本页 HTML 内，紧随 assets/style.css 之后；版本串由内容派生，不必手改。
   本档内 @media 块须排在顶层声明之后，否则窄屏终值被源序压掉。 */

.page-lp .page h1{color:var(--lp-deep);font-family:var(--lp-serif);font-size:23px;letter-spacing:.3em;text-indent:.3em;text-align:center;line-height:1.3}

.page-lp .page h1::before{content:'';display:block;width:88px;height:1px;background:var(--lp-line);margin:0 auto var(--sp-3)}

.page-lp .page h1::after{content:'';display:block;width:88px;height:1px;background:var(--lp-line);margin:var(--sp-3) auto 0}

.page-lp .page .lead{color:var(--lp-ink2);text-align:center;font-size:12.5px;letter-spacing:.22em;text-indent:.22em;margin-top:var(--sp-3)}

.page-lp .page .lead::after{background:var(--lp-line)}

.page-lp .rel-title{color:var(--lp2);font-family:var(--lp-serif)}

.page-lp .lp-tip{margin:var(--sp-3) 0 0;padding:var(--sp-2) 0;border-bottom:1px solid var(--lp-line);
  font-size:12.5px;line-height:1.8;letter-spacing:.04em;color:var(--lp-ink2);text-align:center}

.lp-cat-switch{display:flex;justify-content:center;flex-wrap:wrap;gap:var(--sp-3);margin:var(--sp-2) 0 var(--sp-4)}

.lp-mode-switch{display:flex;justify-content:center;flex-wrap:wrap;gap:var(--sp-4);margin:var(--sp-2) 0 var(--sp-2)}

.page-lp .wheel-luo{max-width:400px}

.page-lp #lpZong svg,.page-lp #lpZhen svg{max-width:460px}

.page-lp #baseDecl{width:117px}

.page-lp .wheel-block h4{font-family:var(--lp-serif);color:var(--lp2)}

.page-lp .lp-block{margin-top:var(--sp-4);text-align:center}

.page-lp .lp-guide{text-align:left;margin:var(--sp-3) auto 0;max-width:560px}

.page-lp .lp-guide-step{padding:var(--sp-2) 0;border-top:1px solid var(--lp-line)}

.page-lp .lp-guide-step:first-child{border-top:0}

.page-lp .lp-guide-body{font-size:12.5px;line-height:1.8;letter-spacing:.03em;color:var(--lp-ink)}

.page-lp .lp-guide-t{margin-right:.4em}

.page-lp .lp-guide-inline{max-width:560px;margin:var(--sp-3) auto 0}

.page-lp .lp-compass{margin-top:var(--sp-3);text-align:center}

.page-lp .lp-compass-read{margin-top:var(--sp-2);font-size:13px;color:var(--lp-ink);letter-spacing:.04em}

.page-lp #lpRealZoom{position:relative; display:inline-block; overflow:visible; touch-action:pan-x pan-y}

.page-lp #lpRealHost{position:relative; display:block; overflow:hidden; transform-origin:50% 50%}

.page-lp #lpRealWrap{touch-action:pan-x pan-y}

.page-lp #lpReal{position:relative; display:block}

.page-lp #lpReal .rd-wheel{width:min(96vw,450px)}

@media (min-width:1025px){
  .page-lp #lpReal .rd-wheel{width:550px}
}

.page-lp #lpRealWheel{position:relative; z-index:1; display:block}

.page-lp #lpCrossFixed{position:absolute; inset:0; z-index:3; pointer-events:none}

.page-lp #lpCrossFixed svg{width:100%; height:100%; display:block}

.page-lp .lp-yun-tbl{margin-top:var(--sp-3)}

.page-lp .lp-inline-btn{border:0;background:none;padding:0;font:inherit;font-size:11.5px;color:var(--lp);text-decoration:underline;cursor:pointer}

.page-lp .field label{color:var(--lp2);font-weight:400}

.page-lp .field select,.page-lp .field input{border-color:var(--lp-line);background:var(--card);color:var(--lp-deep)}

.page-lp .field select:focus,.page-lp .field input:focus{border-color:var(--lp);outline:none}

.page-lp .btn{background:var(--lp);border-color:var(--lp);color:#fff;box-shadow:none}

.page-lp .btn:hover{background:var(--lp2);border-color:var(--lp2);color:#fff;box-shadow:none}

.page-lp .ai-block .btn{background:var(--lp);color:#fff;box-shadow:none}

.page-lp .ai-block .btn:hover{background:var(--lp2)}

.page-lp .ai-block .btn.gold,.page-lp .ai-block .btn.soft{background:var(--lp-tint);border-color:var(--lp-line);color:var(--lp-ink);box-shadow:none}

.page-lp .ai-block .btn.gold:hover,.page-lp .ai-block .btn.soft:hover{background:var(--card);border-color:var(--lp);color:var(--lp2)}

.page-lp .fs-base{margin-bottom:var(--sp-4)}

.page-lp .fs-row{display:flex;flex-wrap:wrap;gap:var(--sp-3);align-items:flex-end}

.page-lp .fs-board-title{color:var(--gold2);text-align:center;font-size:14px;line-height:1.7;margin-bottom:var(--sp-2)}

.page-lp .fs-title-left{text-align:left}

.page-lp .fs-inp-w100{width:100px}

.page-lp .fs-inp-w90{width:90px}

.page-lp .fs-hint{font-size:12px;color:var(--lp-ink2);line-height:1.6;margin:var(--sp-2) 0 var(--sp-3);
  padding-bottom:var(--sp-2);border-bottom:1px solid var(--lp-line)}

.page-lp .fs-mean-tbl{width:100%;border-collapse:collapse;font-size:13px;border-top:1px solid var(--lp-line)}

.page-lp .fs-mean-tbl th,.page-lp .fs-mean-tbl td{border:0;border-bottom:1px solid var(--lp-line);padding:var(--sp-2) var(--sp-2);text-align:left;vertical-align:top;color:var(--lp-ink)}

.page-lp .fs-mean-tbl th{background:var(--lp-tint);font-weight:400;color:var(--lp2);white-space:nowrap}

.page-lp .fs-mean-tbl .lbl-1{white-space:nowrap;color:var(--lp-ink2)}

.page-lp [data-mode-block="fen"] .wheel-block:last-child:nth-child(odd){grid-column:1 / -1;justify-self:center;width:calc(50% - var(--sp-2)/2)}

.page-lp .fs-tbl-scroll{overflow-x:auto}

.page-lp .birth-group,.page-lp .birth-group.compact{background:transparent;border:0;border-top:1px solid var(--lp-line);padding:var(--sp-3) 0;margin-top:var(--sp-3)}

@media(max-width:640px){.page-lp .birth-group,.page-lp .birth-group.compact{padding-top:var(--sp-2)}}

@media print{
  .page-lp .fs-mean-tbl th{background:var(--card) !important}
}

.rd-skin-black{
  --rd-face:#0d0d0d; --rd-rim:#000; --rd-band:#161616; --rd-cell:#0d0d0d; --rd-cell-yang:#a3241a;
  --rd-line:#3d372a; --rd-grid:#33302a; --rd-grid-j:#55503f;
  --rd-gold:#f0c75e; --rd-dim:#b3a877;
  --rd-red:#e05038; --rd-tick:#7a6f52; --rd-num:#f0c75e;
  --rd-shan-yang:#ffe9b0; --rd-shan-yin:#f0c75e;
  --rd-chi:#f8f4e8; --rd-chi-rim:#c29a3a; --rd-haixian:#c0392b;
  --rd-dot-yang:#f8f4e8; --rd-dot-yin:#8a8070;
  --rd-jewel:#3f9d4a; --rd-pit:#7a1a10; --rd-sha:#e05038;
  --rd-ink-inv:#ffe9b0;
}

.rd-skin-gold{
  --rd-face:#d2b158; --rd-rim:#7c6320; --rd-band:#c8a54a; --rd-cell:#d2b158; --rd-cell-yang:#9e2418;
  --rd-line:#8a7130; --rd-grid:#8a7130; --rd-grid-j:#5c4a16;
  --rd-gold:#201a10; --rd-dim:#5c4a16;
  --rd-red:#7d1c12; --rd-tick:#4a3c12; --rd-num:#201a10;
  --rd-shan-yang:#ffe9b0; --rd-shan-yin:#201a10;
  --rd-chi:#f8f4e8; --rd-chi-rim:#7c6320; --rd-haixian:#c0392b;
  --rd-dot-yang:#fbf6e6; --rd-dot-yin:#4a3c12;
  --rd-jewel:#1f6b2a; --rd-pit:#7d1c12; --rd-sha:#9e2418;
  --rd-ink-inv:#ffe9b0;
}

.rd-skin-white{
  --rd-face:#f7f2e5; --rd-rim:#b3a88c; --rd-band:#efe9d8; --rd-cell:#f7f2e5; --rd-cell-yang:#9e2418;
  --rd-line:#a89d82; --rd-grid:#a89d82; --rd-grid-j:#6f6448;
  --rd-gold:#26221a; --rd-dim:#6f6448;
  --rd-red:#9e2418; --rd-tick:#6f6448; --rd-num:#26221a;
  --rd-shan-yang:#ffe9b0; --rd-shan-yin:#26221a;
  --rd-chi:#ffffff; --rd-chi-rim:#8a6d2c; --rd-haixian:#c0392b;
  --rd-dot-yang:#ffffff; --rd-dot-yin:#3a352c;
  --rd-jewel:#2e7d32; --rd-pit:#9e2418; --rd-sha:#b84a3a;
  --rd-ink-inv:#ffe9b0;
}

.lp-yun-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-2);margin:var(--sp-3) 0 0}

.lp-yun-cell{border:1px solid var(--lp-line);background:var(--lp-tint);padding:var(--sp-2);min-height:96px}

.lp-yun-hd{font-size:12px;color:var(--lp-ink2);line-height:1.5}

.lp-yun-hd b{font-size:16px;color:var(--lp)}

.lp-yun-star{font-size:14px;color:var(--lp);line-height:1.7}

.lp-yun-jx{font-size:12px;line-height:1.6}

.lp-yun-mean{font-size:12px;color:var(--lp-ink2);line-height:1.6}

@media(max-width:640px){
  .lp-yun-cell{min-height:0;padding:var(--sp-1)}
  .lp-yun-mean{display:none}
}

.lp-real-tools .lp-lock{font:inherit;font-size:13px;line-height:1;height:30px;cursor:pointer;padding:0 var(--sp-3);
  border:1px solid var(--lp-line);border-radius:0;background:var(--lp-tint);color:var(--lp);
  letter-spacing:.06em;transition:.15s}

.lp-real-tools .lp-lock:hover{border-color:var(--lp);color:var(--lp2)}

.lp-real-tools .lp-lock.active{background:var(--lp);border-color:var(--lp);color:#fff}

.lp-real-tools{display:flex;justify-content:center;flex-wrap:wrap;gap:var(--sp-2);margin:var(--sp-2) 0 var(--sp-2)}

.lp-real-tools .lp-tool{font:inherit;font-size:13px;height:30px;cursor:pointer;padding:0 var(--sp-3);
  border:0;border-radius:0;background:transparent;color:var(--lp);transition:.15s}

.lp-real-tools .lp-tool:hover{background:var(--lp-tint);color:var(--lp2)}

.lp-real-tools .lp-tool.active{background:var(--lp);color:#fff}

@media print{
  .rd-wheel .rd-face{fill:#fff;stroke:#888}
}

@media(max-width:640px){
  .lp-mode-switch{gap:var(--sp-2);justify-content:center}
  .page-lp [data-mode-block="fen"] .wheel-block:last-child:nth-child(odd){grid-column:auto;justify-self:stretch;width:auto}
  .page-lp .fs-row{gap:var(--sp-2)}
  .page-lp .wheel-luo{max-width:340px}
  /* 真实罗盘为全页主器，窄屏下破例通栏：盘宽随屏，容器不再二重内缩，
     使二十四层之字得以尽用屏宽。左右各以半个视口宽负边距抵掉两级内边距。 */
  .page-lp #lpRealWrap{width:100vw;margin-left:calc(50% - 50vw)}
  /* 通栏后详情条回收两级内边距，字行落回与各查询盘详情条对齐之正文区 */
  .page-lp #lpRealWrap .wheel-detail{padding-left:calc(var(--sp-4)*2);padding-right:calc(var(--sp-4)*2)}
  .page-lp #lpZong svg,.page-lp #lpZhen svg{max-width:390px}
}
