/* ============================================================================
   almanark — "quiet observatory" design language

   Night-blue chrome · warm almanac paper for content · one muted brass accent ·
   hairline rules, no rounded cards, no decorative shadows. Times and 干支 sit in
   a tabular monospace so columns line up like a printed ephemeris.

   Deliberately NOT the two neighbours: speccalcs is warm-white + print blue +
   Source Serif (a printed data handbook); pixiroll is cream + brown + teal +
   rounded Nunito (an island). This one is nocturnal and instrument-like.

   Deliberately NOT a 算命站: no red/gold, no gradients, no glow, no emoji.
   The only saturated surface on the page is the header.

   CJK deliberately uses the system stack. A traditional-Chinese serif webfont is
   several MB even chunked; PingFang TC / Microsoft JhengHei / Songti render this
   content well at zero cost. Only the Latin monospace is self-hosted, because the
   thing that must look exact is the numerals.
   ============================================================================ */
:root{
  --paper:#fbfaf7;        /* almanac paper — warm off-white */
  --panel:#ffffff;
  --well:#f4f2ec;         /* inset surfaces: form wells, result blocks */
  --ink:#1f2430;          /* ink blue-black — 13.9:1 on paper */
  --ink-2:#4d5666;        /* secondary text — 6.9:1 on paper */
  --ink-3:#6d7788;        /* DECORATIVE only (crumb separators). 4.3:1 — never
                             put readable content in it; use --ink-2. */
  --rule:#d9d5cb;         /* hairlines */
  --rule-2:#b3ab9b;       /* heavier rules (table head/foot) */

  --night:#1b2233;        /* header / footer ground */
  --night-2:#2a3348;
  --on-night:#f2f0ea;     /* text on night — 13.6:1 */
  --on-night-2:#b6bccb;   /* secondary on night — 6.4:1 */

  --brass:#7f6029;        /* the single accent: 節 marks, rules, emphasis */
  --brass-lit:#c9a25c;    /* brass on dark grounds */
  --link:#2f4a78;         /* muted indigo — 7.3:1 on paper */
  --link-lit:#9fb8e0;     /* link on night grounds */

  /* 五行 — traditional assignments, desaturated so a chart of five bars still
     reads as a document rather than a pie of primary colours. */
  --el-mu:#4f7a43; --el-huo:#a44a3f; --el-tu:#8a6a2f; --el-jin:#7c7f88; --el-shui:#3d5f86;

  --max:1180px;
  --measure:64ch;
  --serif:'Songti TC','Songti SC','Noto Serif CJK TC','Noto Serif TC',
          'PMingLiU','SimSun',Georgia,serif;
  --sans:system-ui,-apple-system,'PingFang TC','PingFang SC','Microsoft JhengHei',
         'Microsoft YaHei','Noto Sans CJK TC','Helvetica Neue',sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,'Cascadia Mono','SFMono-Regular',Menlo,monospace;
}
@media (prefers-color-scheme:dark){:root{
  --paper:#14181f;--panel:#1a1f28;--well:#1f242e;
  --ink:#e9e7e1;--ink-2:#b0b7c3;--ink-3:#8d95a3;
  --rule:#2e3542;--rule-2:#454e5e;
  --night:#0f131b;--night-2:#1a2030;--on-night:#e9e7e1;--on-night-2:#a8b0be;
  --brass:#c9a25c;--brass-lit:#d9b878;--link:#9fb8e0;--link-lit:#b8cbeb;
  --el-mu:#7fae6f;--el-huo:#cf7c6f;--el-tu:#c9a25c;
  --el-jin:#a8abb4;--el-shui:#7099c4;
}}
:root[data-theme="dark"]{
  --paper:#14181f;--panel:#1a1f28;--well:#1f242e;
  --ink:#e9e7e1;--ink-2:#b0b7c3;--ink-3:#8d95a3;
  --rule:#2e3542;--rule-2:#454e5e;
  --night:#0f131b;--night-2:#1a2030;--on-night:#e9e7e1;--on-night-2:#a8b0be;
  --brass:#c9a25c;--brass-lit:#d9b878;--link:#9fb8e0;--link-lit:#b8cbeb;
  --el-mu:#7fae6f;--el-huo:#cf7c6f;--el-tu:#c9a25c;--el-jin:#a8abb4;--el-shui:#7099c4;
}
:root[data-theme="light"]{
  --paper:#fbfaf7;--panel:#ffffff;--well:#f4f2ec;
  --ink:#1f2430;--ink-2:#4d5666;--ink-3:#6d7788;
  --rule:#d9d5cb;--rule-2:#b3ab9b;
  --night:#1b2233;--night-2:#2a3348;--on-night:#f2f0ea;--on-night-2:#b6bccb;
  --brass:#7f6029;--brass-lit:#c9a25c;--link:#2f4a78;--link-lit:#9fb8e0;
  --el-mu:#4f7a43;--el-huo:#a44a3f;--el-tu:#8a6a2f;--el-jin:#7c7f88;--el-shui:#3d5f86;
}

*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);
  font:17px/1.75 var(--sans);-webkit-text-size-adjust:100%;
  text-underline-offset:3px}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.3;letter-spacing:.01em}
h1{font-size:clamp(1.7rem,4.2vw,2.4rem);margin:.1em 0 .5em}
h2{font-size:1.4rem;margin:2.2em 0 .7em;padding-bottom:.3em;border-bottom:1px solid var(--rule)}
h3{font-size:1.1rem;margin:1.8em 0 .5em}
a{color:var(--link);text-decoration:underline;text-decoration-color:var(--rule-2);
  text-decoration-thickness:1px}
a:hover{text-decoration-color:currentColor;text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 22px}
.num,time,td.n,.tst{font-family:var(--mono);font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1}

/* ---- chrome ---------------------------------------------------------- */
.site-head{background:var(--night);color:var(--on-night);
  border-bottom:2px solid var(--brass)}
.site-head .wrap{display:flex;align-items:baseline;gap:22px;padding:16px 22px;flex-wrap:wrap}
.brand{font-family:var(--serif);font-size:1.5rem;font-weight:600;color:var(--on-night);
  text-decoration:none;letter-spacing:.04em}
.brand small{display:block;font-family:var(--sans);font-size:.72rem;font-weight:400;
  letter-spacing:.18em;color:var(--on-night-2);margin-top:2px}
.mainnav{display:flex;gap:20px;margin-left:auto;flex-wrap:wrap}
.mainnav a{color:var(--on-night);font-size:.95rem;text-decoration:none;
  padding-bottom:3px;border-bottom:1px solid transparent}
.mainnav a:hover{border-bottom-color:var(--brass-lit)}
.mainnav a[aria-current]{border-bottom-color:var(--brass-lit);color:var(--brass-lit)}

main{padding:28px 0 72px}
.crumbs{font-size:.88rem;color:var(--ink-2);margin:0 0 18px}
.crumbs a{color:var(--ink-2)}
.crumbs span{color:var(--ink-3);padding:0 .4em}
.lead{font-size:1.12rem;line-height:1.8;color:var(--ink-2);max-width:var(--measure);
  margin:0 0 26px}
.lead strong{color:var(--ink);font-weight:600}
.prose{max-width:var(--measure);color:var(--ink-2)}
.prose p{margin:0 0 1.25em}
.prose strong{color:var(--ink);font-weight:600}
.prose .lead-in{font-family:var(--serif);color:var(--ink);font-weight:600}

.site-foot{background:var(--night);color:var(--on-night-2);margin-top:56px;
  border-top:2px solid var(--brass)}
.site-foot .wrap{padding:26px 22px;font-size:.9rem}
.site-foot a{color:var(--link-lit)}
.site-foot strong{color:var(--on-night);font-family:var(--serif);font-weight:600}
.site-foot .disclaimer{margin:.9em 0 0;font-size:.82rem;color:var(--on-night-2);
  max-width:78ch;line-height:1.7}

/* ---- tables: hairline ephemeris, not zebra stripes ------------------- */
table{width:100%;border-collapse:collapse;margin:1.2em 0;font-size:.96rem}
caption{text-align:left;font-family:var(--serif);font-size:1rem;color:var(--ink-2);
  padding-bottom:.5em}
thead th{border-top:2px solid var(--rule-2);border-bottom:1px solid var(--rule-2);
  text-align:left;font-weight:600;font-size:.86rem;letter-spacing:.05em;
  color:var(--ink-2);padding:.55em .7em}
tbody td,tbody th{border-bottom:1px solid var(--rule);padding:.5em .7em;
  text-align:left;font-weight:400}
tbody th{color:var(--ink-2);font-size:.92rem;white-space:nowrap}
tbody tr:last-child td,tbody tr:last-child th{border-bottom:2px solid var(--rule-2)}
td.n,th.n{text-align:right;white-space:nowrap}
.jie-mark{display:inline-block;font-size:.74rem;line-height:1;padding:.25em .45em;
  border:1px solid var(--brass);color:var(--brass);margin-left:.4em;vertical-align:.1em}
tr.is-lichun td,tr.is-lichun th{background:var(--well)}
tr.is-lichun th:first-child{box-shadow:inset 3px 0 0 var(--brass)}
.tscroll{overflow-x:auto}

/* ---- 命盤: four columns read top-to-bottom, 干 above 支 --------------- */
.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin:1.4em 0;
  background:var(--rule);border:1px solid var(--rule)}
.pillar{background:var(--panel);padding:16px 12px;text-align:center}
.pillar .cap{font-size:.82rem;letter-spacing:.1em;color:var(--ink-2);margin-bottom:10px}
.pillar .gz{font-family:var(--serif);font-size:clamp(1.9rem,6vw,2.7rem);line-height:1.12;
  display:block;color:var(--ink)}
.pillar .gz i{display:block;font-style:normal}
.pillar .tg{font-size:.9rem;color:var(--brass);margin-top:8px}
.pillar .ny{font-size:.82rem;color:var(--ink-2);margin-top:4px}
.pillar .hid{margin-top:12px;padding-top:10px;border-top:1px solid var(--rule);
  font-size:.84rem;color:var(--ink-2);line-height:1.85}
.pillar .hid b{font-family:var(--serif);font-weight:600;color:var(--ink);font-size:.95rem}
.pillar.is-dm{background:var(--well)}
.pillar.is-dm .cap{color:var(--brass)}

/* ---- 五行 bars ------------------------------------------------------- */
.elements{list-style:none;padding:0;margin:1.2em 0;max-width:520px}
.elements li{display:grid;grid-template-columns:2.2em 1fr 3em;align-items:center;
  gap:10px;margin:0 0 7px}
.elements .el{font-family:var(--serif);font-size:1.05rem}
.elements .bar{height:12px;background:var(--well);position:relative}
.elements .bar i{position:absolute;inset:0 auto 0 0;display:block}
.elements .v{font-family:var(--mono);font-size:.86rem;color:var(--ink-2);text-align:right}
.el-木 .bar i{background:var(--el-mu)} .el-火 .bar i{background:var(--el-huo)}
.el-土 .bar i{background:var(--el-tu)} .el-金 .bar i{background:var(--el-jin)}
.el-水 .bar i{background:var(--el-shui)}
.elements li.is-none .v{color:var(--brass)}

/* ---- form ------------------------------------------------------------ */
.calc{background:var(--well);border:1px solid var(--rule-2);padding:22px;margin:0 0 30px}
.crow{display:flex;flex-wrap:wrap;gap:18px 22px;margin-bottom:16px}
.cf{display:flex;flex-direction:column;gap:6px;font-size:.9rem;color:var(--ink-2)}
.cf input,.cf select{font:1rem var(--sans);color:var(--ink);background:var(--panel);
  border:1px solid var(--rule-2);padding:9px 11px;min-width:9.5rem}
.cf input[type=number],.cf input[type=date],.cf input[type=time]{font-family:var(--mono)}
.cf input:focus,.cf select:focus{outline:none;border-color:var(--brass);
  box-shadow:0 0 0 3px rgba(138,106,47,.22)}
.cf .hint{font-size:.8rem;color:var(--ink-2);max-width:26rem;line-height:1.6}
.cinline{flex-direction:row;align-items:center;gap:9px}
.cinline input[type=checkbox]{width:18px;height:18px;min-width:0;accent-color:var(--brass)}
.btn{font:600 1rem var(--sans);cursor:pointer;background:var(--night);color:var(--on-night);
  border:1px solid var(--night);padding:11px 26px;transition:background .12s}
.btn:hover{background:var(--night-2)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--rule-2)}
.btn.ghost:hover{background:var(--panel)}
.btn.sm{font-size:.86rem;padding:6px 14px}
.cactions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.cnote{font-size:.86rem;color:var(--brass);margin:10px 0 0}

.result{margin:0 0 34px}
.result[hidden]{display:none}
.rmeta{list-style:none;padding:0;margin:1em 0;display:flex;flex-wrap:wrap;gap:0 30px;
  font-size:.9rem;color:var(--ink-2)}
.rmeta li{padding:3px 0}
.rmeta b{color:var(--ink);font-weight:600}
.rtext{font-family:var(--serif);font-size:1.3rem;letter-spacing:.12em;color:var(--ink)}

/* ---- lists of links (60 日柱, years, terms) -------------------------- */
.gzgrid{list-style:none;padding:0;margin:1.2em 0;display:grid;
  grid-template-columns:repeat(auto-fill,minmax(5.4rem,1fr));gap:1px;
  background:var(--rule);border:1px solid var(--rule)}
.gzgrid a{display:block;background:var(--panel);padding:11px 6px;text-align:center;
  text-decoration:none;color:var(--ink);font-family:var(--serif);font-size:1.15rem}
.gzgrid a:hover{background:var(--well);color:var(--brass)}
.gzgrid a small{display:block;font-family:var(--mono);font-size:.68rem;color:var(--ink-2);
  margin-top:3px}
.chips{list-style:none;padding:0;margin:1em 0;display:flex;flex-wrap:wrap;gap:8px}
.chips a{display:inline-block;border:1px solid var(--rule-2);padding:5px 13px;
  text-decoration:none;color:var(--ink);font-size:.95rem}
.chips a:hover{border-color:var(--brass);color:var(--brass)}
.chips .now{background:var(--night);color:var(--on-night);border-color:var(--night);
  padding:5px 13px;font-size:.95rem}

/* ---- claims / sources ------------------------------------------------ */
.claims{list-style:none;padding:0;margin:1.6em 0;display:grid;gap:1px;
  grid-template-columns:repeat(auto-fit,minmax(17rem,1fr));
  background:var(--rule);border:1px solid var(--rule)}
.claims li{background:var(--panel);padding:20px}
.claims h3{margin:0 0 .5em;font-size:1.02rem;color:var(--ink)}
.claims p{margin:0;font-size:.94rem;color:var(--ink-2);line-height:1.75}
.claims strong{color:var(--ink);font-weight:600}
.sources{border-top:2px solid var(--rule-2);margin-top:44px;padding-top:20px;
  max-width:78ch}
.sources h2{border:0;margin:0 0 .6em;font-size:1.05rem}
.sources ol{margin:0;padding-left:1.4em;font-size:.9rem;color:var(--ink-2);line-height:1.8}
.sources .reviewed{margin:1em 0 0;font-size:.86rem;color:var(--ink-2)}
.ctas{display:flex;gap:14px;flex-wrap:wrap;margin:1.8em 0 0}

@media (max-width:640px){
  body{font-size:16px}
  .pillars{grid-template-columns:repeat(2,1fr)}
  .mainnav{width:100%;margin-left:0;gap:14px}
  .site-head .wrap{gap:12px}
}
@media print{
  .site-head,.site-foot,.calc,.ctas{display:none}
  body{background:#fff;color:#000;font-size:11pt}
  a{color:#000;text-decoration:none}
}
