/* Source measurements: docs/design/plasma/DESIGN.md.
   Chinese text uses a separate system sans fallback; native App metrics are not claimed. */
:root {
  --type-hero:64px;--type-closing:80px;--type-display:48px;--type-section:40px;
  --type-heading:32px;--type-card:28px;--type-title:22px;
  --type-body:16px;--type-ui:14px;--type-meta:12px;
  --text-primary:#0f0f0f;--text-secondary:#686868;--text-muted:#727272;
  --surface:#fcfcfc;--surface-app:#f2f2f2;--surface-group:#fff;
  --accent:lab(77.1061 -50.9511 37.5955);--accent-hover:#46c95f;
  --leading-body:1.5;--font-cn:"PingFang SC","Microsoft YaHei",Arial,sans-serif;
}
body{font-size:var(--type-body);line-height:var(--leading-body);color:var(--text-primary);letter-spacing:0}
h1{font-size:var(--type-display);line-height:1.15;letter-spacing:-.01em}
h2{font-size:var(--type-heading);line-height:1.25;letter-spacing:-.01em}
h3,h4{font-size:var(--type-title);line-height:1.4;letter-spacing:0}
p,li,input,select,textarea,blockquote{font-size:var(--type-body);line-height:var(--leading-body)}
p,blockquote{color:var(--text-secondary)}
small,time,figcaption,.eyebrow,.v2-overline,.brand-kicker,.v2-kicker,.hint,.field-tip,.footer-note,.collection-more,.cl-foot{font-size:var(--type-meta);line-height:1.5;color:var(--text-muted)}
button,.button,.btn,.v2-btn,.v2-nav__action{font-size:var(--type-ui);line-height:1.28571}
.v2-brand strong,.brand-symbol{font-size:var(--type-title)}
.v2-nav__links,.v2-nav__tools{font-size:var(--type-ui)}
.muted,.subtle,.secondary{color:var(--text-muted)}
.personal-hero,.announcement,.site-footer,.faq-section,.phone-chart,.art-core .reading-card,.v2-ending,.app-account-card{--text-primary:#fff;--text-secondary:#d1d1d1;--text-muted:#bcbcbc;color:var(--text-primary)}
.button,.btn,.v2-btn,.v2-nav__action{color:#fff}
.button-green,.btn-ghost,.v2-btn--silk,.hero-sample{color:#0f0f0f}
.phone-status,.phone-actions,.phone-list,.phone-bottom,.phone-balance>span{font-size:var(--type-meta);line-height:1.5}
.phone-balance strong,.app-account-value strong{font-size:var(--type-display);line-height:1.15;font-weight:400}
.phone-chart b{font-size:var(--type-body);font-weight:400}
.phone-chart small{font-size:var(--type-meta)}
.phone-list small{color:var(--text-secondary)}
.app-toolbar h1,.app-form-intro h2,.app-page .v2-cast-panel__heading h2,.app-report-account h1{font-size:var(--type-title);line-height:1.4;letter-spacing:0}
.app-bottom a{font-size:var(--type-meta);line-height:1.5}
.app-bottom a>span{font-size:var(--type-title)}
.v2-pillars strong,.v2-dm-pillar strong,.v2-dm-pillar>b,.v2-summary-lead>div>span,.bz-ganzhi,.tarot-card .symbol{font-size:var(--type-title)}
::placeholder{color:var(--text-muted);opacity:1}
@media(max-width:639px){:root{--type-hero:32px;--type-closing:40px;--type-section:36px}h1{font-size:var(--type-heading)}}
@media print{.v2-ending{--text-primary:#0f0f0f;--text-secondary:#686868;--text-muted:#727272}}
/* PC workspace semantic typography; source hierarchy plus documented Chinese adaptation. */
@media(min-width:1024px){
  body.app-page .app-toolbar h1,body.app-page .app-report-account h1{font-size:var(--type-heading);line-height:1.25;letter-spacing:-.01em}
  body.app-page .app-form-intro h2{font-size:var(--type-card);line-height:1.142857}
  body.app-page .app-account-value strong{font-size:var(--type-hero);line-height:1;letter-spacing:-.01em}
  body.app-page .v2-cast-summary b{font-size:var(--type-body);line-height:1.5;font-weight:400}
}
/* User-confirmed filled form treatment; values are implementation tokens, not DOM measurements. */
:root{--field-surface:#ebebeb;--field-surface-active:#d8d8d8;--field-radius:20px;--field-focus-ring:#9b9b9b}
@media(min-width:1024px){body.app-page .filled-field>label{font-size:var(--type-ui);line-height:20px}body.app-page .filled-field>label small{font-size:var(--type-meta)}body.app-page .field-select,body.app-page .field-options [role=option]{font-size:var(--type-body);line-height:24px}}

/* PC reading rhythm: product adaptation, PRODUCT_RULES §11. */
:root{--space-related:8px;--space-paragraph:16px;--space-component:24px;--space-group:32px;--space-section:64px;--space-page:80px}
.cl-list{display:grid;gap:var(--space-paragraph,16px);list-style:none;padding:0;margin:var(--space-component,24px) 0}
.cl-list .cl-item{display:grid;grid-template-columns:20px minmax(0,1fr);align-items:start;column-gap:12px;padding:0;font-size:var(--type-body,16px);line-height:1.5}
.cl-list .cl-item::before{content:none}
.cl-list .cl-mark{display:flex;align-items:center;justify-content:center;width:20px;min-height:24px;font-size:16px;color:var(--text-secondary)}
.cl-list .cl-item>span:last-child{min-width:0;overflow-wrap:anywhere}
/* Upstream feature workflows, mapped to the shared PC spacing system. */
.parity-page{max-width:1120px;margin:64px auto 80px;padding:0 32px}.parity-page>p{margin:24px 0 32px}.parity-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.parity-wide,.parity-actions,.parity-targets{grid-column:1/-1}.parity-wide{margin:32px 0}.parity-wide h3{margin-bottom:16px}.parity-wide p{margin-bottom:24px}.parity-actions{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin:24px 0}.parity-targets{border:0;padding:0;margin:24px 0;display:flex;gap:24px;flex-wrap:wrap}.parity-targets legend{margin-bottom:16px}.parity-targets label{display:flex;gap:8px;align-items:center}.parity-chart{margin:32px 0}.parity-chart table{width:100%;border-collapse:collapse}.parity-chart th,.parity-chart td{padding:16px;text-align:left;border-bottom:1px solid #e5e5e5}.parity-page #extra-reading{margin-top:64px}.parity-page #extra-text{margin-top:32px}

/* Complete chart data: business adaptation of shared spacing and neutral surfaces. */
.chart-details { margin-block:var(--space-section,64px); min-width:0; }
.chart-details > h3 { margin-bottom:var(--space-component,24px); }
.chart-detail-section { margin-block:var(--space-paragraph,16px); background:var(--surface-soft,#f0f0f0); border-radius:16px; }
.chart-detail-section > summary { padding:20px 24px; font-size:var(--font-body,16px); cursor:pointer; }
.chart-detail-content { padding:0 24px 24px; min-width:0; }
.chart-data-scroll { max-width:100%; overflow-x:auto; }
.chart-data-table { width:100%; border-collapse:collapse; font-size:14px; line-height:1.6; }
.chart-data-table th,.chart-data-table td { padding:12px 16px; text-align:left; vertical-align:top; border-bottom:1px solid #dedede; min-width:64px; overflow-wrap:anywhere; }
.chart-data-table th { background:#e5e5e5; font-weight:500; }
.chart-data-list { margin:0; }
.chart-data-list > div { display:grid; grid-template-columns:minmax(80px,140px) minmax(0,1fr); gap:16px; padding-block:12px; }
.chart-data-list dt { color:var(--text-secondary); }
.chart-data-list dd { margin:0; min-width:0; overflow-wrap:anywhere; }
.chart-data-table .chart-data-list > div { display:block; }
.chart-data-table .chart-data-list dt { margin-bottom:4px; }
.chart-data-table .chart-data-list dd { min-width:100px; }
.parity-palaces { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-block:24px; }
.parity-palace { padding:20px; border-radius:16px; background:#ebebeb; display:flex; flex-direction:column; gap:8px; min-width:0; }
.parity-palace strong { font-size:24px; }
.parity-palace-center { grid-area:2 / 2 / 4 / 4; justify-content:center; text-align:center; }
.parity-three { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin-block:32px; }
.parity-three article { background:#ebebeb; border-radius:16px; padding:24px; }
.parity-three article p { line-height:1.75; }
.qm-cell .qm-detail { font-size:14px; line-height:1.6; margin-top:8px; color:var(--text-secondary); }
.zw-palace .zw-detail { font-size:12px; line-height:1.75; margin-top:12px; overflow-wrap:anywhere; }
.bz-table [data-fortune-column] { background:#ebebeb; }
.zw-grid.zw-grid-traditional { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.zw-grid-traditional .zw-palace { min-width:0; height:auto; padding:20px; }
.zw-grid-traditional .zw-center { grid-area:2 / 2 / 4 / 4; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; padding:24px; text-align:center; }
.zw-grid-traditional .zw-center p { margin:0; }
.liuri-card.active { background:#d8d8d8; }
.chart-details > .plasma-ui { display:block; margin-block:16px; background:#f0f0f0; border-radius:16px; }
.chart-details .ui-detail-trigger { padding:20px 24px; }
.zw-grid-traditional .zw-palace.is-related { background:#ebebeb; }
.zw-grid-traditional .zw-palace.is-selected { background:#d8d8d8; }
/* Generated boards must share the same rhythm as their input pages. */
:root { --space-related:8px;--space-paragraph:16px;--space-component:24px;--space-group:32px;--space-section:64px;--space-page:80px; }
.zw-board,.qm-board,.hx-panel.reading-board { display:grid; gap:var(--space-section); }
.zw-board section,.qm-board section,.hx-panel section { min-width:0; }
.section-label-row { display:flex; align-items:center; justify-content:space-between; gap:var(--space-component); margin-bottom:var(--space-component); }
.section-label-row h4,.zw-board h3,.qm-board h3 { margin:0; }
.zw-summary,.qm-summary { display:grid; gap:var(--space-component); }
.zw-summary p,.qm-summary p { margin-block:var(--space-paragraph); }
.zw-muta-row,.zw-decadal-list { display:flex; gap:var(--space-related); flex-wrap:wrap; }
.zw-ph,.qm-cell-h { display:flex; justify-content:space-between; gap:var(--space-related); margin-bottom:var(--space-paragraph); }
.zw-grid-traditional .zw-palace.is-selected { border:1px solid #d8d8d8; }
.zw-stars,.qm-deity,.qm-star,.qm-gate,.qm-stems { margin-block:var(--space-related); }
.zw-dec { margin-bottom:var(--space-paragraph); color:var(--text-secondary); }
.zw-timeline { display:grid; gap:var(--space-component); }
.zw-tl-bar,.zw-tl-grid { display:flex; flex-wrap:wrap; gap:var(--space-related); }
.plasma-ui .ui-action.zw-decadal-item,.plasma-ui .ui-action.zw-tl-seg,.plasma-ui .ui-action.dayun-card,.plasma-ui .ui-action.liunian-card,.plasma-ui .ui-action.liuyue-card,.plasma-ui .ui-action.liuri-card { background:#ebebeb;color:var(--text-primary);border:0;border-radius:14px;height:auto;white-space:normal;padding:16px;gap:8px; }
.plasma-ui .ui-action.dayun-card,.plasma-ui .ui-action.liunian-card,.plasma-ui .ui-action.liuyue-card,.plasma-ui .ui-action.liuri-card { display:flex;flex-direction:column;width:100%; }
.plasma-ui .ui-action.active,.plasma-ui .ui-action.is-selected { background:#d8d8d8;color:var(--text-primary); }
.dayun-scroll > .ui-adapter { flex:0 0 128px; }
.qm-compass { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-paragraph); }
.qm-dir { display:flex;gap:var(--space-related);align-items:center;background:#ebebeb;padding:16px;border-radius:12px; }
.qm-orient-legend { margin-block:var(--space-component);font-size:var(--type-meta); }
.qm-timing-list { display:grid;gap:var(--space-related);padding-left:20px; }
.parity-chart > h3 { margin-top:var(--space-section);margin-bottom:var(--space-component); }
.zw-flow-tags { display:flex;gap:8px;flex-wrap:wrap;margin-block:16px; }
.zw-horoscope { display:grid;gap:var(--space-group); }
.zw-period-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-component); }
.zw-period-card { padding:24px;border-radius:16px;background:#ebebeb;display:grid;gap:12px; }
.zw-transit-block { display:grid;gap:var(--space-component); }
.zw-year-axis { display:flex;gap:24px;align-items:center;flex-wrap:wrap; }
.zw-ya-item { display:grid;gap:8px; }

/* Birth input: a single time entry and direct short choices. */
@media(min-width:1024px){
 body.app-page :is(.field,.v2-field).birth-time-source{display:none}
 .birth-name-field{grid-column:1/-1}
 .birth-calendar-choice{grid-column:1}
 .plasma-ui .ui-choice-tabs{width:100%;padding:0;gap:var(--space-related,8px);background:transparent}
 .plasma-ui .ui-choice-tabs button{min-height:40px;font-size:var(--type-ui,14px);box-shadow:none}
 .plasma-ui .ui-choice-tabs button[data-state=active]{background:var(--field-surface-active,#d8d8d8)}
 .plasma-ui.ui-dialog.birth-time-dialog{width:min(720px,90vw);max-width:720px;gap:var(--space-component,24px)}
 .birth-known{display:flex;align-items:center;justify-content:space-between}
 .birth-clock-label{display:grid;gap:var(--space-related,8px);font-size:var(--type-ui,14px)}
 .birth-clock-label input{background:var(--field-surface,#ebebeb);border:0;border-radius:12px;padding:12px 16px;height:48px;font-size:var(--type-body,16px)}
 .birth-slot-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--space-related,8px)}
 .birth-slot-grid button{display:flex;flex-direction:column;height:auto;gap:8px;padding:14px 4px;background:var(--field-surface,#ebebeb);border:0;border-radius:12px;color:var(--text-primary)}
 .birth-slot-grid button[aria-pressed=true]{background:var(--field-surface-active,#d8d8d8)}
 .birth-slot-grid small{font-size:var(--type-meta,12px);white-space:nowrap}
 .birth-shortcuts>p{margin:0 0 16px;font-size:var(--type-ui,14px)}
 .birth-time-actions{display:flex;justify-content:flex-end;gap:16px}
}

/* Short choices are compact segmented controls, not nested input cards. */
@media(min-width:1024px){
 body.app-page :is(.field,.v2-field).filled-field.choice-field{background:transparent;padding:0;min-height:0;box-shadow:none;align-self:center;border-radius:0;gap:var(--space-related)}
 body.app-page .choice-field>label{margin:0 0 var(--space-related);color:var(--text-secondary)}
 .choice-field .plasma-ui .ui-choice-tabs{box-sizing:border-box;width:100%;max-width:100%;height:44px;display:flex;flex-wrap:nowrap;gap:4px;padding:4px;background:var(--field-surface);border-radius:12px}
 .choice-field .plasma-ui .ui-choice-tabs button{flex:1 1 0;min-width:0;height:36px;min-height:36px;padding:8px 20px;border-radius:8px;background:transparent;color:var(--text-secondary)}
 .choice-field .plasma-ui .ui-choice-tabs button[data-state=active]{background:var(--surface);color:var(--text-primary);box-shadow:0 1px 3px #00000012}
 #pillars-input>h3{margin-top:0}
}

.birth-confirm-actions{display:flex;align-items:center;justify-content:flex-start;gap:var(--space-paragraph);flex-wrap:wrap}

/* Report reading hierarchy: one identity summary, distinct content sections. */
@media(min-width:1024px){
 .v2-live-report .v2-report-shell{width:calc(100% - 96px);max-width:1200px;margin-inline:auto}
 .v2-live-report #report-name{margin:0 0 16px;font-size:32px}
 .v2-live-report #report-birth{margin:0 0 24px;color:var(--text-secondary);line-height:1.75}
 .v2-live-report .app-account-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
 .v2-live-report #report-save-status:empty{display:none}
 .report-section-nav,.report-chapter-nav{display:flex;flex-wrap:wrap;gap:12px;margin:32px 0}
 .report-section-nav a,.report-chapter-nav a{padding:12px 18px;background:var(--field-surface);border-radius:12px;font-size:var(--type-ui)}
 .v2-live-report :is(#bazi-pro-mount,#dayun-section,#report-knowledge,#bazi-narrative-mount,[id^=report-chapter]){scroll-margin-top:100px}
 .v2-live-report .bz-chart{display:grid;gap:32px}
 .v2-live-report .bz-daymaster{display:flex;align-items:center;gap:24px;padding:24px 32px;background:var(--field-surface);border-radius:20px}
 .v2-live-report .bz-dm-badge{display:grid;place-items:center;flex:0 0 64px;height:64px;border-radius:16px;font-size:32px;color:#171717}
 .v2-live-report .bz-dm-meta h3{margin:0 0 8px;font-size:24px}
 .v2-live-report .bz-dm-meta p{margin:0;font-size:var(--type-ui);line-height:1.75}
 .v2-live-report .bz-table-wrap{overflow:auto;border-radius:16px;background:#fff}
 .v2-live-report .bz-table{width:100%;table-layout:fixed;margin:0;font-size:var(--type-ui)}
 .v2-live-report .bz-table :is(th,td){padding:16px 10px;line-height:1.7;vertical-align:top}
 .v2-live-report .bz-table .bz-row-label{width:64px;white-space:nowrap;color:var(--text-secondary)}
 .v2-live-report .bz-section{padding:32px;background:#f5f5f5;border-radius:20px;margin:0}
 .v2-live-report .bz-section h4{margin:0 0 24px;font-size:24px}
 .v2-live-report .bz-section h5{margin:24px 0 16px;font-size:var(--type-body)}
 .v2-live-report .dayun-current-banner{background:#ebebeb;padding:24px;border-radius:16px;margin-bottom:24px}
 .v2-live-report .dayun-scroll{display:flex;gap:12px;overflow:auto;padding-bottom:12px}
 .v2-live-report :is(.liunian-grid,.liuyue-grid,.liuri-grid){display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
 .v2-live-report .oracle-card-head{display:flex;justify-content:flex-start;align-items:center;gap:16px;margin-bottom:24px}
 .v2-live-report .oracle-card-head h4{margin:0;font-size:24px}
 .v2-live-report .oracle-card{padding:32px;margin-bottom:24px;background:#f5f5f5;border-radius:20px}
 .v2-live-report :is(#report-knowledge,#bazi-narrative-mount){margin-top:64px}
 .report-knowledge header{margin-bottom:24px}
 .report-knowledge header h2{font-size:28px;margin:0 0 12px}
 .report-knowledge header p{color:var(--text-secondary);font-size:var(--type-ui)}
 .report-knowledge [data-slot=accordion]{border-radius:16px;overflow:hidden;background:#f5f5f5}
 .knowledge-name{display:flex;align-items:center;gap:12px}
 .knowledge-hit{font-size:var(--type-meta);background:#d8d8d8;padding:4px 8px;border-radius:6px}
 .knowledge-short{margin-left:auto;font-size:var(--type-ui);color:var(--text-secondary)}
 .report-knowledge dl{display:grid;gap:16px;margin:24px 0 0}
 .report-knowledge dl>div{display:grid;grid-template-columns:80px 1fr;gap:16px;line-height:1.75}
 .report-knowledge dd{margin:0}.report-knowledge dt{color:var(--text-secondary)}
}
@media(min-width:1024px){
 .v2-live-report .bz-chart{grid-template-columns:minmax(0,1fr)}
 .v2-live-report .bz-chart>*{min-width:0}
 .v2-live-report .bz-section{box-sizing:border-box}
}

/* Report workspace: shared homepage accent, desktop reading hierarchy. */
:root{--report-accent:lab(77.1061 -50.9511 37.5955);--report-accent-ink:#174d2e;--report-accent-soft:#e6f3e9}
.v2-live-report .report-tools{gap:12px}
.v2-live-report .report-tools .ui-action,.v2-live-report .report-tools a{font-size:14px;padding:10px 16px;background:transparent;color:var(--text-primary)}
.v2-live-report .report-tools .ui-action:hover,.v2-live-report .report-tools a:hover{background:var(--field-surface)}
.v2-live-report #report-save-status:empty{display:none}
#report-workspace{scroll-margin-top:100px;margin-top:32px}
.report-reading-layout{display:grid;grid-template-columns:176px minmax(0,1fr);gap:40px;align-items:start;margin-top:32px}
.report-side-nav{position:sticky;top:176px;max-height:calc(100vh - 200px);overflow:auto;padding-right:8px}
.report-side-title{font-size:14px;font-weight:600;display:block;margin-bottom:16px;color:var(--report-accent-ink)}
.report-side-nav nav{display:grid;gap:4px}
.report-side-nav a{display:block;padding:10px 12px;border-radius:10px;color:var(--text-secondary);font-size:14px;text-decoration:none;line-height:1.5}
.report-side-nav a[aria-current]{background:var(--report-accent-soft);color:var(--report-accent-ink);font-weight:600}
.report-panels{min-width:0}
.report-panels [role=tabpanel][hidden]{display:none}
.v2-live-report .report-panels #report-knowledge,.v2-live-report .report-panels #bazi-narrative-mount{margin-top:0}
.report-panels h2,.report-panels h3,.report-panels h4,.report-panels [data-slot=accordion-item]{scroll-margin-top:180px}
.report-tabs-bar{position:sticky;top:76px;z-index:20;padding:12px 0;background:var(--page-bg,#fafafa)}
.report-tabs-bar [data-slot=tabs-list]{display:flex;width:100%;height:52px;box-sizing:border-box}
.report-tabs-bar [data-slot=tabs-trigger]{flex:1;font-size:16px}
.report-tabs-bar [data-slot=tabs-trigger][data-state=active]{background:var(--report-accent);color:var(--report-accent-ink);box-shadow:none}
.dayun-core-text{white-space:pre-wrap;line-height:1.85;font-size:16px}
.v2-live-report .report-panels .bz-section{padding:24px}
.v2-live-report .report-panels .liunian-grid,.v2-live-report .report-panels .liuyue-grid,.v2-live-report .report-panels .liuri-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.v2-live-report .report-panels .bz-table{font-size:14px}
.v2-live-report .report-panels .bz-table th,.v2-live-report .report-panels .bz-table td{padding:14px 6px}
@media print{
 .report-tabs-bar,.report-side-nav,.report-tools{display:none}
 .report-reading-layout{display:block}
 .report-panels [role=tabpanel][hidden]{display:block}
 .report-panels [role=tabpanel]{break-before:page}
}
.v2-live-report .v2-nav .report-tools button,.v2-live-report .v2-nav .report-tools a{background:transparent;color:var(--text-primary);border:0;box-shadow:none}
.v2-live-report .v2-nav .report-tools button:hover,.v2-live-report .v2-nav .report-tools a:hover{background:var(--field-surface)}