/* —— 黄历详情页专属 —— */
.hl-hero { background:
    radial-gradient(120% 120% at 100% 0, rgba(184,134,11,.07), transparent 60%),
    var(--c-paper-card); }
.hl-hero-top { display:flex; gap:var(--sp-5); padding:var(--sp-5); align-items:center; flex-wrap:wrap; }
.hl-bigdate { text-align:center; flex:none; }
.hl-bigdate .day { font-family:var(--font-serif); font-weight:900; color:var(--c-primary); font-size:var(--t-hero); line-height:1; }
.hl-bigdate .ym { font-size:var(--t-sm); color:var(--c-ink-2); margin-top:6px; }
.hl-bigdate .week { display:inline-block; margin-top:8px; font-size:var(--t-xs); background:var(--c-primary-soft); color:var(--c-primary-deep); padding:3px 10px; border-radius:var(--radius-pill); }
.hl-lunar { flex:1; min-width:220px; border-left:1px dashed var(--c-line); padding-left:var(--sp-5); }
.hl-lunar .nong { font-family:var(--font-serif); font-size:26px; font-weight:700; color:var(--c-ink); }
.hl-ganzhi { display:flex; gap:var(--sp-2); margin-top:var(--sp-3); flex-wrap:wrap; }
.gz-pillar { text-align:center; background:#fff; border:1px solid var(--c-line); border-radius:var(--radius); padding:8px 12px; min-width:64px; }
.gz-pillar small { display:block; color:var(--c-ink-3); font-size:11px; }
.gz-pillar b { font-family:var(--font-serif); font-size:18px; color:var(--c-primary-deep); }
.gz-pillar i { font-style:normal; display:block; font-size:11px; color:var(--c-gold); }
.hl-meta { display:flex; flex-wrap:wrap; gap:10px 18px; margin-top:var(--sp-3); font-size:var(--t-sm); color:var(--c-ink-2); }
.hl-meta b { color:var(--c-ink); font-weight:500; }

/* 宜忌双栏 */
.yiji { display:grid; grid-template-columns:1fr 1fr; }
.yiji > div { padding:var(--sp-4) var(--sp-5); }
.yiji .yi { border-right:1px solid var(--c-line); }
.yiji h3 { display:flex; align-items:center; gap:8px; font-size:var(--t-h2); margin-bottom:12px; }
.yiji .badge { width:34px; height:34px; border-radius:10px; display:grid; place-items:center; color:#fff; font-family:var(--font-serif); font-size:20px; flex:none; }
.yiji .yi .badge { background:var(--c-yi); }
.yiji .ji .badge { background:var(--c-ji); }
@media (max-width:560px){ .yiji { grid-template-columns:1fr; } .yiji .yi { border-right:0; border-bottom:1px solid var(--c-line); } }

/* 方位罗盘 */
.compass-wrap { display:flex; gap:var(--sp-5); flex-wrap:wrap; align-items:center; }
.compass { --s:160px; width:var(--s); height:var(--s); flex:none; position:relative; border-radius:50%;
  background:radial-gradient(circle, #fff 38%, var(--c-primary-soft) 39%, #fff 41%);
  border:2px solid var(--c-gold-light); box-shadow:inset 0 0 0 6px rgba(184,134,11,.06); margin:0 auto; }
.compass::before { content:""; position:absolute; inset:0; border-radius:50%;
  background:conic-gradient(from 0deg, transparent 0 11%, rgba(184,134,11,.12) 11% 14%, transparent 14% 100%); opacity:.5; }
.compass .pt { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); text-align:center; font-size:11px; color:var(--c-ink-3); }
.compass .pt b { display:block; font-family:var(--font-serif); color:var(--c-primary); font-size:13px; }
.compass .center { font-family:var(--font-serif); color:var(--c-gold); font-weight:700; }
.compass .n{top:14%} .compass .s{top:86%} .compass .w{left:14%} .compass .e{left:86%}
.compass .ne{top:26%;left:74%} .compass .nw{top:26%;left:26%} .compass .se{top:74%;left:74%} .compass .sw{top:74%;left:26%}
.fang-list { flex:1; min-width:200px; display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.fang-list .item { background:#fff; border:1px solid var(--c-line); border-radius:var(--radius); padding:8px 12px; font-size:var(--t-sm); }
.fang-list .item span { color:var(--c-ink-3); }
.fang-list .item b { color:var(--c-primary-deep); font-family:var(--font-serif); }

/* 时辰表 */
.shi-toolbar { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:var(--sp-3); font-size:var(--t-sm); }
.toggle { display:inline-flex; background:#f3efe6; border:1px solid var(--c-line); border-radius:var(--radius-pill); padding:3px; }
.toggle button { border:0; background:transparent; padding:6px 14px; border-radius:var(--radius-pill); font-size:var(--t-sm); color:var(--c-ink-2); cursor:pointer; }
.toggle button.on { background:var(--c-primary); color:#fff; }
.shi-toolbar select { font:inherit; font-size:var(--t-sm); padding:6px 10px; border:1px solid var(--c-line); border-radius:var(--radius); background:#fff; color:var(--c-ink); }
.shi-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:8px; }
@media (max-width:560px){ .shi-grid { grid-template-columns:repeat(3,1fr); } }
.shi-cell { border:1px solid var(--c-line); border-radius:var(--radius); padding:10px 6px; text-align:center; background:#fff; transition:.18s; }
.shi-cell .h { font-family:var(--font-serif); font-weight:700; font-size:15px; }
.shi-cell .t { font-size:11px; color:var(--c-ink-3); }
.shi-cell .dot { display:inline-block; width:8px; height:8px; border-radius:50%; margin-top:6px; }
.shi-cell.ji .dot { background:var(--c-luck); box-shadow:0 0 0 3px rgba(201,154,46,.18); }
.shi-cell.xiong .dot { background:var(--c-bad); }
.shi-cell.ji .res { color:var(--c-luck); } .shi-cell.xiong .res { color:var(--c-bad); }
.shi-cell .res { font-size:11px; margin-top:2px; }
.shi-cell.now { border-color:var(--c-primary); box-shadow:0 0 0 2px rgba(192,57,43,.15); background:var(--c-primary-soft); }
.shi-cell.now::after { content:"此刻"; display:block; font-size:10px; color:var(--c-primary); margin-top:2px; }

/* 信息块网格 */
.info-grid { display:grid; gap:var(--sp-3); grid-template-columns:1fr; }
@media (min-width:560px){ .info-grid.col2 { grid-template-columns:1fr 1fr; } }
.info-block { background:#fff; border:1px solid var(--c-line); border-radius:var(--radius); padding:var(--sp-3) var(--sp-4); }
.info-block h4 { font-size:var(--t-sm); color:var(--c-primary-deep); margin-bottom:6px; display:flex; gap:6px; align-items:center; }
.info-block p { margin:0; font-size:var(--t-sm); color:var(--c-ink-2); line-height:1.7; }
.info-block .em { color:var(--c-ink); font-family:var(--font-serif); }

.day-nav { display:flex; justify-content:space-between; gap:10px; }
.day-nav a { flex:1; }