:root {
  --zw-bg:#f5f1ea; --zw-paper:#fffdf9; --zw-ink:#28231e; --zw-muted:#756c62;
  --zw-line:#ddd2c3; --zw-accent:#7b3f35; --zw-gold:#b48435; --zw-soft:#eee4d7;
  --zw-green:#397052; --zw-blue:#356b8c; --zw-red:#a9463d; --zw-shadow:0 16px 44px rgba(65,45,25,.10);
}
@media (prefers-color-scheme:dark) {
  :root { --zw-bg:#181614; --zw-paper:#24211e; --zw-ink:#eee7dd; --zw-muted:#a89d90; --zw-line:#413a33; --zw-accent:#d98775; --zw-gold:#d6aa5b; --zw-soft:#302b26; --zw-shadow:0 18px 48px rgba(0,0,0,.32); }
}
* { box-sizing:border-box; }
body { margin:0; color:var(--zw-ink); background:var(--zw-bg); font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Noto Sans SC",sans-serif; line-height:1.55; }
a { color:var(--zw-accent); }
.zw-page { max-width:1240px; margin:0 auto; padding:22px 20px 72px; }
.zw-top { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:16px; }
.zw-title { margin:0; font:700 26px/1.25 "Songti SC","Noto Serif SC",serif; letter-spacing:.08em; }
.zw-subtitle { margin:5px 0 0; color:var(--zw-muted); font-size:13px; }
.zw-nav { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.zw-nav a { border:1px solid var(--zw-line); border-radius:999px; padding:5px 11px; background:var(--zw-paper); text-decoration:none; font-size:12px; }
.zw-card { background:var(--zw-paper); border:1px solid var(--zw-line); border-radius:16px; box-shadow:0 2px 14px rgba(60,40,20,.04); padding:16px 18px; margin-bottom:16px; }
.zw-form { display:grid; grid-template-columns:minmax(150px,1.1fr) minmax(150px,1fr) minmax(140px,.8fr) auto; gap:12px; align-items:end; }
.zw-field label { display:block; margin-bottom:5px; color:var(--zw-muted); font-size:12px; }
.zw-field input,.zw-field select { width:100%; min-height:40px; border:1px solid var(--zw-line); border-radius:10px; padding:8px 10px; color:var(--zw-ink); background:var(--zw-bg); font:14px inherit; }
.zw-seg { display:flex; overflow:hidden; border:1px solid var(--zw-line); border-radius:10px; }
.zw-seg button { flex:1; min-height:38px; border:0; border-right:1px solid var(--zw-line); background:var(--zw-bg); color:var(--zw-ink); cursor:pointer; }
.zw-seg button:last-child { border-right:0; }
.zw-seg button.on { color:#fff; background:var(--zw-accent); }
.zw-button { min-height:40px; border:1px solid var(--zw-accent); border-radius:10px; padding:8px 20px; background:var(--zw-accent); color:#fff; font-weight:700; cursor:pointer; }
.zw-button.secondary { border-color:var(--zw-line); background:var(--zw-bg); color:var(--zw-ink); font-weight:500; }
.zw-advanced { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-top:11px; color:var(--zw-muted); font-size:12px; }
.zw-advanced label { display:inline-flex; align-items:center; gap:6px; cursor:pointer; }
.zw-style-picker { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:11px; color:var(--zw-muted); font-size:12px; }
.zw-style-picker>span { color:var(--zw-ink); font-weight:700; }
.zw-style-seg { width:min(430px,100%); }
.zw-style-seg button { padding:0 14px; white-space:nowrap; }
.zw-style-picker small { flex:1; min-width:220px; }
.zw-notice { border-left:3px solid var(--zw-gold); padding:8px 11px; border-radius:0 10px 10px 0; background:color-mix(in srgb,var(--zw-gold) 8%,var(--zw-paper)); color:var(--zw-muted); font-size:12px; }
.zw-error { min-height:18px; margin-top:8px; color:var(--zw-red); font-size:12px; }
.zw-chart-shell { min-width:860px; }
.zw-scroll { overflow-x:auto; border-radius:18px; box-shadow:var(--zw-shadow); }
.zw-grid { display:grid; grid-template-columns:repeat(4,1fr); grid-template-rows:repeat(4,minmax(164px,auto)); gap:1px; background:var(--zw-line); border:1px solid var(--zw-line); border-radius:18px; overflow:hidden; }
.zw-palace { position:relative; min-width:0; border:0; padding:10px 11px; background:var(--zw-paper); color:var(--zw-ink); text-align:left; cursor:pointer; transition:background .14s,box-shadow .14s; }
.zw-palace:hover { background:color-mix(in srgb,var(--zw-gold) 7%,var(--zw-paper)); }
.zw-palace.related { background:color-mix(in srgb,var(--zw-blue) 7%,var(--zw-paper)); box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--zw-blue) 48%,transparent); }
.zw-palace.selected { background:color-mix(in srgb,var(--zw-accent) 8%,var(--zw-paper)); box-shadow:inset 0 0 0 3px var(--zw-accent); }
.zw-palace-head { display:flex; align-items:baseline; justify-content:space-between; gap:7px; border-bottom:1px solid color-mix(in srgb,var(--zw-line) 75%,transparent); padding-bottom:5px; }
.zw-palace-name { color:var(--zw-accent); font:700 16px/1.2 "Songti SC","Noto Serif SC",serif; }
.zw-palace-branch { color:var(--zw-muted); font:700 13px/1.2 "Songti SC",serif; }
.zw-palace-flags { display:flex; gap:4px; flex-wrap:wrap; margin:5px 0; min-height:18px; }
.zw-flag { padding:1px 5px; border-radius:999px; background:var(--zw-soft); color:var(--zw-muted); font-size:10px; }
.zw-flag.body { background:color-mix(in srgb,var(--zw-blue) 14%,var(--zw-paper)); color:var(--zw-blue); }
.zw-flag.origin { background:color-mix(in srgb,var(--zw-gold) 14%,var(--zw-paper)); color:var(--zw-gold); }
.zw-major { display:flex; gap:6px; flex-wrap:wrap; margin-top:4px; }
.zw-star-major { color:var(--zw-accent); font:700 15px/1.35 "Songti SC",serif; white-space:nowrap; }
.zw-bright { margin-left:2px; color:var(--zw-gold); font-size:9px; vertical-align:2px; }
.zw-mutagen { display:inline-grid; place-items:center; width:16px; height:16px; margin-left:2px; border-radius:50%; color:#fff; font:700 10px/1 sans-serif; vertical-align:2px; }
.zw-mutagen.m-禄 { background:var(--zw-green); } .zw-mutagen.m-权 { background:var(--zw-gold); } .zw-mutagen.m-科 { background:var(--zw-blue); } .zw-mutagen.m-忌 { background:var(--zw-red); }
.zw-minor { display:block; margin-top:5px; color:var(--zw-blue); font-size:11px; line-height:1.45; }
.zw-tough { color:var(--zw-red); }
.zw-adjective { display:block; margin-top:4px; color:var(--zw-muted); font-size:10px; line-height:1.4; }
.zw-stage { position:absolute; right:9px; bottom:6px; color:var(--zw-muted); font-size:9px; opacity:.75; }
.zw-center { grid-column:2/4; grid-row:2/4; display:flex; flex-direction:column; justify-content:center; padding:22px 24px; background:radial-gradient(circle at 50% 20%,color-mix(in srgb,var(--zw-gold) 12%,var(--zw-paper)),var(--zw-paper) 64%); text-align:center; }
.zw-center h2 { margin:0; color:var(--zw-accent); font:700 26px/1.25 "Songti SC","Noto Serif SC",serif; letter-spacing:.08em; }
.zw-center-date { margin-top:8px; font-size:13px; }
.zw-center-lunar { color:var(--zw-muted); font-size:12px; }
.zw-center-bazi { margin:10px 0; color:var(--zw-accent); font:700 17px/1.5 "Songti SC",serif; word-spacing:7px; }
.zw-center-meta { display:flex; justify-content:center; gap:6px; flex-wrap:wrap; }
.zw-center-meta span { border:1px solid var(--zw-line); border-radius:999px; padding:2px 8px; background:color-mix(in srgb,var(--zw-paper) 86%,transparent); font-size:11px; }
.zw-center-note { margin-top:9px; color:var(--zw-muted); font-size:10px; }
.zw-detail { display:grid; grid-template-columns:minmax(180px,.75fr) 1.25fr; gap:14px; margin-top:16px; }
.zw-detail h3 { margin:0 0 7px; color:var(--zw-accent); font-size:15px; }
.zw-detail p { margin:0; color:var(--zw-muted); font-size:12px; }
.zw-detail-stars { font-size:12px; line-height:1.8; }
.zw-history-head { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:9px; }
.zw-history-list { display:flex; gap:7px; flex-wrap:wrap; }
.zw-history-item { border:1px solid var(--zw-line); border-radius:9px; padding:6px 9px; background:var(--zw-bg); color:var(--zw-ink); cursor:pointer; font-size:11px; }
.zw-history-item b { color:var(--zw-accent); }
.zw-library { display:grid; grid-template-columns:270px minmax(0,1fr); min-height:calc(100vh - 38px); gap:16px; }
.zw-side { position:sticky; top:16px; align-self:start; max-height:calc(100vh - 32px); display:flex; flex-direction:column; background:var(--zw-paper); border:1px solid var(--zw-line); border-radius:16px; overflow:hidden; }
.zw-side-head { padding:14px; border-bottom:1px solid var(--zw-line); }
.zw-search { width:100%; margin-top:8px; border:1px solid var(--zw-line); border-radius:9px; padding:8px 9px; color:var(--zw-ink); background:var(--zw-bg); }
.zw-chips { display:flex; gap:5px; flex-wrap:wrap; margin-top:8px; }
.zw-chip { border:1px solid var(--zw-line); border-radius:999px; padding:3px 7px; background:var(--zw-bg); color:var(--zw-muted); cursor:pointer; font-size:10px; }
.zw-chip.on { border-color:var(--zw-accent); background:var(--zw-accent); color:#fff; }
.zw-case-list { overflow-y:auto; padding:6px; }
.zw-case { width:100%; border:0; border-radius:9px; padding:8px 9px; background:transparent; color:var(--zw-ink); text-align:left; cursor:pointer; }
.zw-case:hover,.zw-case.on { background:var(--zw-soft); }
.zw-case b { display:block; font-size:13px; }
.zw-case small { color:var(--zw-muted); font-size:10px; }
.zw-case-meta { display:flex; align-items:center; gap:5px; margin-top:2px; }
.zw-rating { display:inline-block; min-width:22px; border-radius:5px; padding:0 4px; text-align:center; font-size:9px; font-weight:800; }
.zw-rating.high { background:color-mix(in srgb,var(--zw-green) 16%,var(--zw-paper)); color:var(--zw-green); }
.zw-rating.mid { background:color-mix(in srgb,var(--zw-gold) 17%,var(--zw-paper)); color:var(--zw-gold); }
.zw-rating.low { background:color-mix(in srgb,var(--zw-red) 14%,var(--zw-paper)); color:var(--zw-red); }
.zw-case-header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:12px; }
.zw-case-header h2 { margin:0; font:700 24px/1.25 "Songti SC",serif; }
.zw-tags { display:flex; gap:5px; flex-wrap:wrap; margin-top:6px; }
.zw-tag { border:1px solid var(--zw-line); border-radius:999px; padding:2px 8px; color:var(--zw-muted); font-size:10px; }
.zw-source { padding:11px 13px; border:1px solid var(--zw-line); border-radius:11px; background:var(--zw-paper); font-size:12px; }
.zw-source strong { color:var(--zw-accent); }
.zw-events { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:12px 0 16px; }
.zw-event { border-left:3px solid var(--zw-gold); border-radius:0 8px 8px 0; padding:7px 9px; background:var(--zw-paper); }
.zw-event b { display:block; color:var(--zw-accent); font-size:11px; }
.zw-event span { color:var(--zw-muted); font-size:11px; }
.zw-library-title { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.zw-library-title h1 { margin:0; font:700 22px/1.25 "Songti SC",serif; }
.zw-library-title strong { color:var(--zw-accent); font-size:12px; white-space:nowrap; }
.zw-kicker { color:var(--zw-gold); font-size:9px; font-weight:800; letter-spacing:.12em; }
.zw-muted { color:var(--zw-muted); } .zw-compact { margin:7px 0; font-size:10px; line-height:1.5; }
label.zw-search { display:flex; align-items:center; gap:6px; }
.zw-search input { width:100%; min-width:0; border:0; outline:0; color:var(--zw-ink); background:transparent; font:12px inherit; }
.zw-filter-row { display:flex; gap:5px; margin-top:8px; }
.zw-filter-row button,.zw-tags button { border:1px solid var(--zw-line); border-radius:999px; padding:3px 7px; background:var(--zw-bg); color:var(--zw-muted); cursor:pointer; font-size:9px; }
.zw-filter-row button.active,.zw-tags button.active { border-color:var(--zw-accent); background:var(--zw-accent); color:#fff; }
.zw-case-item { width:100%; display:flex; align-items:center; justify-content:space-between; gap:8px; border:0; border-radius:9px; padding:8px 9px; background:transparent; color:var(--zw-ink); text-align:left; cursor:pointer; }
.zw-case-item:hover,.zw-case-item.active { background:var(--zw-soft); }
.zw-case-item b,.zw-case-item small { display:block; } .zw-case-item b { font-size:13px; } .zw-case-item small { color:var(--zw-muted); font-size:9px; }
.zw-empty { padding:26px 12px; color:var(--zw-muted); text-align:center; font-size:12px; }
.zw-hero-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; }
.zw-hero-head h2 { margin:1px 0 3px; font:700 24px/1.25 "Songti SC",serif; } .zw-hero-head p { margin:0; color:var(--zw-muted); font-size:12px; }
.zw-rating.large { min-width:auto; padding:4px 8px; font-size:10px; }
.zw-facts { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; margin:13px 0; }
.zw-facts span { border:1px solid var(--zw-line); border-radius:9px; padding:7px 8px; color:var(--zw-muted); font-size:10px; }
.zw-facts b { display:block; color:var(--zw-ink); font-size:9px; }
.zw-source a { white-space:nowrap; }
.zw-events span { border-left:3px solid var(--zw-gold); border-radius:0 8px 8px 0; padding:7px 9px; background:var(--zw-bg); color:var(--zw-muted); font-size:10px; }
.zw-events span b { display:block; color:var(--zw-accent); font-size:10px; }
.zw-button.subtle { display:inline-flex; align-items:center; justify-content:center; text-decoration:none; background:var(--zw-paper); color:var(--zw-accent); font-size:11px; }
.zw-candidate-tools { width:min(392px,100%); display:flex; justify-content:space-between; gap:12px; margin:0 auto 8px; color:var(--zw-muted); font-size:11px; }
.zw-candidate-tools b { color:var(--zw-ink); }
.zw-candidate-shell,.zw-cece-shell { width:min(392px,100%); margin:0 auto 16px; overflow:hidden; border:1px solid var(--zw-line); border-radius:18px; background:#fff; box-shadow:var(--zw-shadow); }
.zw-candidate-frame,.zw-cece-frame { display:block; width:100%; height:842px; border:0; background:#fff; }
.zw-library-style { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 12px; }
.zw-library-style>span { color:var(--zw-muted); font-size:11px; white-space:nowrap; }
.zw-library-style .zw-style-seg { flex:1; max-width:430px; }
.zw-method-note h3 { margin:0 0 5px; font-size:13px; } .zw-method-note p { margin:0; color:var(--zw-muted); font-size:11px; }
.zwa { margin-top:18px; border:1px solid var(--zw-line); border-radius:18px; overflow:hidden; background:var(--zw-paper); box-shadow:var(--zw-shadow); }
.zwa-head { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; padding:18px 20px 15px; border-bottom:1px solid var(--zw-line); background:color-mix(in srgb,var(--zw-gold) 7%,var(--zw-paper)); }
.zwa-head span { color:var(--zw-accent); font-size:11px; font-weight:800; letter-spacing:.08em; }
.zwa-head h2 { margin:3px 0 0; font:700 22px/1.35 "Songti SC","Noto Serif SC",serif; }
.zwa-head p { max-width:390px; margin:0; color:var(--zw-muted); font-size:11px; text-align:right; }
.zwa-context { display:flex; flex-wrap:wrap; gap:5px; margin-top:8px; }
.zwa-context i { padding:3px 7px; border:1px solid color-mix(in srgb,var(--zw-gold) 35%,var(--zw-line)); border-radius:999px; background:var(--zw-paper); color:var(--zw-muted); font-size:10px; font-style:normal; font-weight:600; }
.zwa-tabs { display:flex; gap:5px; padding:8px 10px; border-bottom:1px solid var(--zw-line); background:var(--zw-bg); }
.zwa-tabs button { flex:1; min-height:36px; border:0; border-radius:8px; background:transparent; color:var(--zw-muted); cursor:pointer; font-size:13px; }
.zwa-tabs button.on { background:var(--zw-paper); color:var(--zw-accent); font-weight:800; box-shadow:0 1px 5px rgba(60,40,20,.09); }
.zwa-panel { padding:18px 20px 21px; }
.zwa-panel[hidden] { display:none; }
.zwa-panel h3 { margin:0 0 13px; color:var(--zw-accent); font:700 18px/1.3 "Songti SC","Noto Serif SC",serif; }
.zwa-panel h4 { margin:0 0 7px; color:var(--zw-ink); font-size:12px; }
.zwa-columns { display:grid; grid-template-columns:minmax(260px,.8fr) minmax(0,1.4fr); gap:22px; }
.zwa-list { margin:0; padding-left:19px; font-size:13px; line-height:1.75; }
.zwa-list li+li { margin-top:4px; }
.zwa-list .zwa-muted { color:var(--zw-muted); }
.zwa-columns>div:first-child .zwa-list { color:var(--zw-muted); font-size:12px; }
.zwa-rel-title { margin-top:18px!important; padding-top:14px; border-top:1px solid var(--zw-line); }
.zwa-relations { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 14px; }
.zwa-relation { padding:9px 10px; border-left:3px solid var(--zw-gold); background:var(--zw-bg); }
.zwa-relation b { display:block; color:var(--zw-accent); font-size:11px; }
.zwa-relation p { margin:3px 0 0; color:var(--zw-muted); font-size:11px; line-height:1.55; }
@media (max-width:820px) {
  .zw-form { grid-template-columns:1fr 1fr; }
  .zw-library { grid-template-columns:1fr; }
  .zw-side { position:static; max-height:42vh; }
  .zw-detail,.zw-events { grid-template-columns:1fr; }
  .zw-facts { grid-template-columns:1fr 1fr; }
  .zwa-columns,.zwa-relations { grid-template-columns:1fr; }
}
@media (max-width:520px) {
  .zw-page { padding:16px 12px 56px; }
  .zw-top { display:block; }
  .zw-nav { justify-content:flex-start; margin-top:10px; }
  .zw-form { grid-template-columns:1fr; }
  .zw-card { padding:14px; }
  .zwa-head { display:block; padding:15px; }
  .zwa-head p { margin-top:6px; text-align:left; }
  .zwa-tabs { overflow-x:auto; }
  .zwa-tabs button { min-width:62px; }
  .zwa-panel { padding:15px; }
}
