/* A portrait first, followed by the chart and its element relationships. */
body[data-stage=result]{background:#faf7f1}
.result-heading{margin:0 0 26px;align-items:center}
.result-heading h2{font-size:clamp(34px,4vw,48px);margin:9px 0 13px;color:#294d3d}
.result-heading #result-caption{font:14px/1.6 Arial,sans-serif;color:#687064}
.reading-nav{display:flex;gap:25px;border-bottom:1px solid var(--line);padding:0 0 17px;margin-bottom:30px;flex-wrap:wrap}
.reading-nav button{padding:8px 0;border:0;background:transparent;font:14px/1.5 Arial,sans-serif;color:#526652;text-underline-offset:6px}
.reading-nav button:hover{text-decoration:underline}
.personal-portrait{--portrait-ink:color-mix(in srgb,var(--element-color) 72%,#24251f);--portrait-tint:color-mix(in srgb,var(--element-color) 16%,#f7f2e8);display:grid;grid-template-columns:1fr 1.18fr;gap:0;background:#f2eee4;border:1px solid #ded5c6;align-items:center}
.portrait-scene{position:relative;aspect-ratio:1;align-self:start;width:100%;overflow:hidden}
.portrait-scene .atlas-art{position:absolute;inset:0;aspect-ratio:1}
.portrait-character{position:absolute;top:22px;left:24px;font:70px/1 'Kaiti SC','STKaiti',serif;color:#fff7e5;text-shadow:0 2px 15px #26322670}
.portrait-art-label{position:absolute;bottom:0;left:0;right:0;padding:34px 24px 18px;color:#fff9eb;background:linear-gradient(transparent,#1d2a25bb);font:12px/1.5 Arial,sans-serif;letter-spacing:.15em}
.portrait-copy{padding:30px 34px}
.daymaster-kicker{display:inline-block;padding:8px 13px;background:var(--portrait-ink);color:#fff8e9;font:600 12px/1.4 Arial,sans-serif;letter-spacing:.14em;margin-bottom:20px}
.portrait-copy h2.portrait-identity{display:flex;align-items:baseline;flex-wrap:wrap;gap:5px 10px;font:clamp(42px,4.6vw,58px)/1.12 Georgia,serif;letter-spacing:-.025em;margin:0 0 24px;color:var(--portrait-ink)}
.portrait-identity .portrait-element{font:28px/1.35 Georgia,serif;letter-spacing:0;color:var(--portrait-ink);white-space:nowrap}
.portrait-identity .portrait-polarity{display:inline-flex;align-items:center;gap:8px;align-self:center;font:19px/1.35 Georgia,serif;letter-spacing:0;color:var(--portrait-ink);white-space:nowrap}
.polarity-mark{width:45px;height:45px;flex:none}
.portrait-copy h2{font-size:clamp(30px,3.4vw,43px);line-height:1.13;margin:0 0 20px;color:#304436}
.portrait-traits{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:25px;font:600 15px/1.4 Arial,sans-serif;color:var(--portrait-ink)}
.portrait-traits span{padding:10px 13px;background:var(--portrait-tint)}
.portrait-description{font-size:16px;line-height:1.7;color:#5e6259;margin-bottom:21px}
.portrait-definition{border-top:1px solid #dcd3c4;padding-top:17px;font:14px/1.65 Arial,sans-serif;color:#64695d}
.portrait-definition b{display:block;color:#454e41;font-weight:400;margin-bottom:5px}
.portrait-note{font:12px/1.6 Arial,sans-serif;color:#737569;margin:17px 0 0}
/* Match the image to the copy height. Keep the atlas tile square internally,
   centered and cropped, so neither the illustration nor adjacent tiles stretch. */
@media(min-width:701px){
  #daymaster-profile .personal-portrait{align-items:stretch}
  #daymaster-profile .portrait-scene{aspect-ratio:auto;align-self:stretch;container-type:size;min-height:320px}
  #daymaster-profile .portrait-scene .atlas-art{
    inset:auto;top:50%;left:50%;
    width:max(100cqw,100cqh);height:max(100cqw,100cqh);
    aspect-ratio:1;transform:translate(-50%,-50%);
  }
}
.reading-section{margin-top:55px;padding-top:10px;scroll-margin-top:28px}
.reading-section-heading{display:flex;gap:23px;align-items:flex-start;max-width:850px;margin-bottom:25px}
.reading-number{font:30px/1.2 Georgia,serif;color:#ad9571;padding-top:7px}
.reading-section-heading h2{font-size:32px;margin:7px 0 13px;color:#304b3b}
.reading-section-heading p{font-size:16px;line-height:1.7;color:#666b60;margin:0}
.result-section .pillars{gap:14px;margin:25px 0 17px}
.result-section .pillar{border:0;background:#f3efe5;padding:0;overflow:hidden}
.result-section .pillar.day{background:#eaf0e7}
.result-section .pillar h3{padding:14px 8px;margin:0;border-bottom:0;background:#ede8dc;font:16px/1.5 Georgia,serif}
.pillar-symbol{display:flex;flex-direction:column;align-items:center;position:relative;min-height:163px;padding:18px 6px 28px}
.pillar-han{font:46px/1.1 'Kaiti SC','STKaiti',serif}
.pillar-symbol-name{font:17px/1.6 Georgia,serif;margin-top:5px}
.pillar-element{font:12px/1.4 Arial,sans-serif;color:#6a7065}
.branch-symbol{border-top:1px solid #ded5c6;min-height:145px;padding-bottom:16px}
.day-master-tag{position:absolute;bottom:7px;font:11px/1.3 Arial,sans-serif;color:#345d42}
.pillar-pending{padding:32px 12px;min-height:308px;display:flex;flex-direction:column;justify-content:center;color:#777b70}
.pillar-pending>span{font:42px Georgia,serif}
.pillar-pending p{font:14px/1.6 Arial,sans-serif;margin:15px 0}
.pillar-pending small{font:12px/1.5 Arial,sans-serif}
.reading-details{font:14px/1.7 Arial,sans-serif;border-top:1px solid #ddd5c7;border-bottom:1px solid #ddd5c7;padding:16px 0;color:#60685c}
.reading-details summary{color:#405745;min-height:24px}
.reading-details p{margin:17px 0 0;max-width:840px}
.result-element-choices{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:0 0 18px}
.result-element-choices button{display:flex;align-items:center;flex-direction:column;padding:17px 6px 14px;border:1px solid #ded5c6;background:transparent;color:#566051;gap:5px;border-radius:2px}
.result-element-choices button[aria-pressed=true]{border-color:var(--element-color);background:#f0ede3;box-shadow:inset 0 -3px var(--element-color)}
.choice-han{font:30px/1.3 'Kaiti SC','STKaiti',serif;color:var(--element-color)}
.result-element-choices strong{font:18px/1.4 Georgia,serif;color:var(--element-color)}
.result-element-choices small{font:11px/1.5 Arial,sans-serif;color:#6d7065}
.element-relationship{display:grid;grid-template-columns:1.1fr 1fr;gap:36px;padding:29px 32px;background:#f2eee4;border-left:3px solid var(--element-color);min-height:300px}
.relationship-copy .eyebrow{color:var(--element-color)}
.relationship-copy h3{font-size:29px;line-height:1.2;margin:12px 0 16px;color:#354a3b}
.relationship-copy p,.relationship-evidence p{font-size:16px;line-height:1.65;color:#62695c}
.generation-chain{display:flex;gap:14px;align-items:center;font:16px/1.5 Georgia,serif;flex-wrap:wrap;color:#6e7568;margin-top:22px}
.generation-chain strong{font-weight:400;color:var(--element-color);border-bottom:1px solid var(--element-color)}
.relationship-evidence{border-left:1px solid #dcd4c5;padding-left:30px}
.relationship-evidence .symbol-count{font:14px/1.5 Arial,sans-serif;margin:11px 0 13px}
.symbol-count strong{font:35px/1 Georgia,serif;margin-right:7px;color:var(--element-color)}
.relationship-evidence ul{padding:0;list-style:none;margin:0;color:#59604f;font:14px/1.7 Arial,sans-serif}
.relationship-evidence li{padding:6px 0;border-bottom:1px solid #e0d9cb}
.relationship-evidence .evidence-note{font:12px/1.6 Arial,sans-serif;margin:14px 0 0}
.interpretation-note{font:13px/1.7 Arial,sans-serif;color:#75776a;margin:15px 0 24px;max-width:880px}
.counts-details #element-counts{max-width:700px;margin:25px 0 0}
.portrait-reflection{padding:29px 34px;background:#edf0e7;border-left:3px solid #8aa08b}
.portrait-reflection blockquote{font:27px/1.45 Georgia,serif;color:#37513d;margin:16px 0;max-width:800px}
.portrait-reflection p{font:14px/1.6 Arial,sans-serif;color:#6d7367;margin:0}
.practice-link{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-top:23px}
.practice-link p{font:14px/1.6 Arial,sans-serif;color:#687064;margin:0}
.practice-link .primary-button{font:14px/1.5 Arial,sans-serif;flex-shrink:0}
.result-method{margin-top:48px;padding-top:20px;border-top:1px solid #dcd4c5}
.result-method details{background:transparent;margin:12px 0 0;border:0;border-bottom:1px solid #dcd4c5;padding:15px 0}
#hidden-stems-record h3{font-size:20px;margin:28px 0 12px}
.uncertain-portrait{padding:35px;background:#f2eee4;border:1px solid #ded5c6}
.uncertain-portrait h2{margin-top:14px}
.uncertain-portrait>div{display:flex;gap:12px;flex-wrap:wrap}
#master-dialog .personal-portrait{display:block}#master-dialog .portrait-scene{max-width:420px;margin:auto}
@media(max-width:950px){.personal-portrait{grid-template-columns:.9fr 1.1fr}.portrait-copy{padding:24px}.portrait-copy h2{font-size:33px}.portrait-traits{font-size:12px;gap:5px 13px}.element-relationship{gap:23px;padding:25px}.relationship-evidence{padding-left:23px}}
@media(max-width:700px){.personal-portrait{grid-template-columns:1fr}.portrait-scene{max-width:500px;margin:auto}.portrait-copy{padding:26px 23px}.portrait-copy h2{font-size:35px}.result-heading{gap:15px}.result-heading .outline-button{padding:9px 12px;font-size:13px}.result-heading h2{font-size:35px}.reading-nav{gap:8px 19px;margin-bottom:22px;padding-bottom:13px}.reading-nav button{font-size:13px}.reading-section{margin-top:38px}.reading-section-heading{gap:14px}.reading-number{font-size:24px}.reading-section-heading h2{font-size:28px}.reading-section-heading p{font-size:15px}.result-section .pillars{gap:6px}.result-section .pillar h3{font-size:15px;padding:11px 3px}.pillar-symbol{min-height:145px;padding:16px 3px 31px}.pillar-han{font-size:36px}.pillar-symbol-name{font-size:15px}.pillar-element{font-size:12px}.branch-symbol{min-height:123px;padding-bottom:13px}.day-master-tag{font-size:10px;line-height:1.2;max-width:65px}.pillar-pending{min-height:268px;padding:18px 5px}.pillar-pending p{font-size:12px}.result-element-choices{gap:5px}.result-element-choices button{padding:12px 3px}.choice-han{font-size:26px}.result-element-choices strong{font-size:14px}.result-element-choices small{display:none}.element-relationship{grid-template-columns:1fr;gap:23px;padding:24px 21px;min-height:0}.relationship-copy h3{font-size:27px}.relationship-evidence{border-left:0;border-top:1px solid #dcd4c5;padding:21px 0 0}.portrait-reflection{padding:25px 23px}.portrait-reflection blockquote{font-size:25px}.practice-link{align-items:stretch;flex-direction:column;gap:16px}.result-method{margin-top:35px}.uncertain-portrait{padding:25px}}

.cycles-preview{display:grid;grid-template-columns:1.5fr 1fr;gap:40px;align-items:center;margin-top:48px;padding:32px;border:1px solid #d8cfbd;background:#f0eadf}.cycles-preview h2{margin:10px 0 14px}.cycles-preview p{font:14px/1.65 Arial,sans-serif;color:var(--muted);margin-bottom:18px}.cycles-topics{display:flex;flex-wrap:wrap;gap:10px 24px;list-style:none;padding:0;margin:0;font:13px/1.5 Arial,sans-serif;color:var(--green)}.cycles-preview-action{display:flex;align-items:flex-start;flex-direction:column;gap:14px;border-left:1px solid #d8cfbd;padding-left:30px}.cycles-status{font:11px/1.5 Arial,sans-serif;text-transform:uppercase;letter-spacing:.13em;color:var(--bronze)}.cycles-preview-action p{font-size:12px;margin:0}@media(max-width:700px){.cycles-preview{grid-template-columns:1fr;padding:24px;gap:25px}.cycles-preview-action{border-left:0;border-top:1px solid #d8cfbd;padding:22px 0 0}.cycles-preview h2{font-size:28px}}

/* Solid element marks and branch hidden stems. */
.result-section .pillar.day h3{background:#dee8db;color:#345840}
.pillar-element{display:inline-flex;align-items:center;justify-content:center;margin-top:4px}
.pillar-element svg{width:21px;height:21px;display:block}
.pillar-hidden{background:#ffffff4d;min-height:133px;padding:14px 7px 18px}
.pillar-hidden h4{font:10px/1.4 Arial,sans-serif;letter-spacing:.06em;font-weight:400;color:#777b70;margin:0 0 12px;text-align:center}
.pillar-hidden h4 span{white-space:nowrap}
.pillar-hidden ul{display:flex;justify-content:center;gap:8px;list-style:none;margin:0;padding:0}
.pillar-hidden li{display:flex;flex-direction:column;align-items:center;flex:1;min-width:0;max-width:65px}
.pillar-hidden-han{font:25px/1.2 'Kaiti SC','STKaiti',serif}
.pillar-hidden-name{font:13px/1.5 Georgia,serif;margin:4px 0 2px}
.pillar-hidden .pillar-element svg{width:18px;height:18px}
.pillar-element-legend{display:flex;justify-content:center;flex-wrap:wrap;gap:14px 25px;list-style:none;padding:8px 0 21px;margin:0;font:12px/1.5 Arial,sans-serif}
.pillar-element-legend li{display:flex;align-items:center;gap:7px}
.pillar-element-legend svg{width:20px;height:20px;flex:none}
@media(max-width:700px){.result-section .pillar h3{font-size:13px}.pillar-hidden{padding:12px 3px 14px;min-height:126px}.pillar-hidden h4{font-size:9px;letter-spacing:0}.pillar-hidden ul{gap:3px}.pillar-hidden-han{font-size:22px}.pillar-hidden-name{font-size:11px}.pillar-element-legend{gap:10px 16px}}
@media(max-width:420px){.pillar-hidden ul{flex-direction:column;align-items:center;gap:12px}.pillar-hidden li{max-width:none;display:grid;grid-template-columns:22px 1fr;column-gap:3px;width:100%;text-align:center}.pillar-hidden-han{grid-row:1 / 3}.pillar-hidden-name{font-size:11px;margin:0}.pillar-hidden .pillar-element{margin:0}.pillar-hidden .pillar-element svg{width:16px;height:16px}.pillar-hidden{min-height:178px}}

.pillar-distribution{background:#f1ede3;padding:27px 30px;margin:5px 0 25px}
.distribution-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}
.distribution-heading h3{font:26px/1.3 Georgia,serif;color:#344e3f;margin:7px 0 0}
.distribution-heading .eyebrow{font-size:10px;letter-spacing:.12em}
.distribution-total{font:13px/1.5 Arial,sans-serif;color:#79705d;white-space:nowrap}
.distribution-method{font:13px/1.6 Arial,sans-serif;color:#777b70;margin:13px 0 22px}
.distribution-bars{list-style:none;padding:0;margin:0;display:grid;gap:17px}
.distribution-bars li{display:grid;grid-template-columns:90px minmax(0,1fr) 85px;align-items:center;gap:17px}
.distribution-label{display:flex;align-items:center;gap:9px;color:var(--count-color);font:14px/1.5 Arial,sans-serif}
.distribution-label svg{width:23px;height:23px;flex:none}
.distribution-track{height:15px;background:#e5e0d5;overflow:hidden;border-radius:2px}
.distribution-track>span{height:100%;display:block;background:var(--count-color);border-radius:2px}
.distribution-value{display:flex;align-items:baseline;justify-content:space-between;gap:10px;font:12px/1.5 Arial,sans-serif;color:#777b70;font-variant-numeric:tabular-nums}
.distribution-value strong{font-size:16px;font-weight:500;color:#404a3f}
.distribution-caution{font:14px/1.6 Arial,sans-serif;color:#405745;margin:25px 0 7px}
.distribution-footnote{font:11px/1.6 Arial,sans-serif;color:#777b70;margin:0}
@media(max-width:700px){.pillar-distribution{padding:23px 18px}.distribution-heading{align-items:flex-start;flex-direction:column;gap:8px}.distribution-heading h3{font-size:24px}.distribution-bars li{grid-template-columns:73px minmax(0,1fr) 70px;gap:9px}.distribution-label{font-size:12px;gap:6px}.distribution-label svg{width:20px;height:20px}.distribution-track{height:13px}}

/* Show one reading chapter at a time. */
.reading-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:5px;border:1px solid #dcd4c5;border-radius:8px;background:#f0ede3;max-width:640px;scroll-margin-top:20px}
.reading-nav button{min-width:0;min-height:48px;padding:12px 16px;border-radius:5px;font:15px/1.4 Arial,sans-serif;color:#526652;cursor:pointer}
.reading-nav button:hover{background:#e6e7db;text-decoration:none}
.reading-nav button[aria-selected="true"]{background:#304e3e;color:#fffaf0}
.reading-nav button:focus-visible,.reading-panel:focus-visible{outline:2px solid #9a8251;outline-offset:4px}
.reading-panel[hidden]{display:none!important}
.reading-panel>.reading-section:first-child{margin-top:0;padding-top:0}
.reading-next{margin-top:32px}
@media(max-width:700px){.reading-nav{gap:3px;padding:4px;width:100%;max-width:none}.reading-nav button{font-size:13px;padding:11px 5px;min-height:46px}.reading-next .outline-button{width:100%;min-height:48px}}

/* The next chapter: a single, prominent entrance to the element reading. */
.elements-entry{position:relative;isolation:isolate;width:100%;display:grid;grid-template-columns:180px minmax(0,1fr) 64px;align-items:center;gap:38px;padding:38px 42px;text-align:left;border:1px solid #466454;border-radius:4px;background:#244638;color:#faf5e9;cursor:pointer;overflow:hidden;box-shadow:0 8px 22px #243c2f12;transition:background .2s,box-shadow .2s}
.elements-entry:before{content:"";position:absolute;inset:9px;border:1px solid #c5b58a45;border-radius:1px;z-index:-1;pointer-events:none}
.elements-entry:hover{background:#2d5142;box-shadow:0 10px 28px #243c2f24}
.elements-entry:focus-visible{outline:3px solid #9f8650;outline-offset:5px}
.entry-copy{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.entry-kicker{font:11px/1.4 Arial,sans-serif;letter-spacing:.2em;color:#d3c297}
.entry-title{font:36px/1.13 Georgia,serif;letter-spacing:-.02em;color:#faf5e9}
.entry-description{font:14px/1.65 Arial,sans-serif;color:#d3ddd2;max-width:360px}
.entry-arrow{display:grid;place-items:center;width:60px;height:60px;border:1px solid #c5b58a99;border-radius:50%;color:#e0cf9e;transition:transform .2s}
.entry-arrow svg{width:30px;height:30px}
.elements-entry:hover .entry-arrow{transform:translateX(4px)}
.entry-symbols{position:relative;display:block;width:180px;height:160px}
.entry-symbols:before{content:"";position:absolute;inset:22px 30px 11px;border:1px solid #c5b58a45;border-radius:50%}
.entry-symbol{position:absolute;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;border:1px solid #eadfc345;box-shadow:0 0 0 5px #244638}
.entry-symbol svg{width:25px;height:25px}
.entry-symbol-wood{top:0;left:66px;background:#d6e2d1;color:#547963}
.entry-symbol-fire{top:48px;right:0;background:#eed3c4;color:#b36050}
.entry-symbol-earth{bottom:0;right:25px;background:#dfd0bb;color:#907258}
.entry-symbol-metal{bottom:0;left:25px;background:#ede1bb;color:#a88343}
.entry-symbol-water{top:48px;left:0;background:#cddfe5;color:#548399}
@media(max-width:700px){.reading-next{margin-top:24px}.elements-entry{grid-template-columns:minmax(0,1fr) 46px;gap:22px 14px;padding:28px}.entry-symbols{grid-column:1/-1;display:flex;gap:10px;width:auto;height:auto}.entry-symbols:before{display:none}.entry-symbol{position:static;width:34px;height:34px;box-shadow:none}.entry-symbol svg{width:21px;height:21px}.entry-title{font-size:30px}.entry-description{font-size:13px}.entry-arrow{width:46px;height:46px}.entry-arrow svg{width:24px;height:24px}.entry-kicker{font-size:10px;letter-spacing:.16em}}
@media(prefers-reduced-motion:reduce){.elements-entry,.entry-arrow{transition:none}}

/* Approved six-motif full print: fixed order, half-drop rows, common 35° direction. */
.entry-pattern{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;opacity:.216;fill:none}
.entry-pattern .even-motif path,.entry-pattern .even-motif circle{stroke:#d9c594;stroke-width:2.75px;vector-effect:non-scaling-stroke;stroke-linejoin:round;stroke-linecap:round;fill:none}
.entry-kicker{font-size:14px;line-height:1.5;letter-spacing:.17em}
.entry-description{color:#e8ebdf}
.entry-arrow{position:relative;background:#e5c991;color:#244638;box-shadow:0 0 0 7px #e5c99113,0 4px 18px #102b2544;border-color:#e5c991}
.entry-arrow:before{content:"";position:absolute;inset:-7px;border:1px solid #e5c99188;border-radius:50%;pointer-events:none}
.entry-arrow:after{content:"";position:absolute;inset:-15px;border:1px solid #ddc59055;border-radius:50%;opacity:0;pointer-events:none}
.elements-entry:hover .entry-arrow{transform:none}
.elements-entry:is(:hover,:focus-visible) .entry-arrow:after{animation:entry-halo 1.7s ease-out 2}
.elements-entry:is(:hover,:focus-visible) .entry-arrow svg{animation:entry-nudge 1.7s ease-in-out 2}
@keyframes entry-halo{0%{transform:scale(.8);opacity:0}25%{opacity:.6}100%{transform:scale(1.28);opacity:0}}
@keyframes entry-nudge{0%,100%{transform:translateX(0)}50%{transform:translateX(5px)}}
@media(max-width:700px){.entry-kicker{font-size:13px;letter-spacing:.14em}}
@media(prefers-reduced-motion:reduce){.elements-entry .entry-arrow:after,.elements-entry .entry-arrow svg{animation:none}}

/* Three main steps: info, BaZi, then the independent element reading. */
.reading-nav{grid-template-columns:repeat(2,minmax(0,1fr));max-width:480px}
body[data-stage=elements]{background:#faf7f1}
.elements-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:16px}
#elements-caption{font:14px/1.6 Arial,sans-serif;color:#687064;margin:0}
.elements-section #relationships-section{margin-top:0;padding-top:0}
.elements-section #relationships-section .ef-page{padding-top:12px}
@media(max-width:700px){.reading-nav{max-width:none}.elements-toolbar{align-items:flex-start;gap:14px}.elements-toolbar .outline-button{font-size:13px;padding:9px 12px;flex-shrink:0}#elements-caption{font-size:13px}}

/* The cycles chapter shares the approved entry design in warm bronze. */
.cycles-next{margin-top:48px}
.cycles-entry{--cycles-bg:#544f46;--cycles-hover:#625c51;--cycles-border:#8a8273;background:var(--cycles-bg);border-color:var(--cycles-border)}
.cycles-entry:hover{background:var(--cycles-hover)}
.cycles-entry .entry-symbol{box-shadow:0 0 0 5px var(--cycles-bg)}
.cycles-entry .entry-description{color:#f2e7d8}
.cycles-entry .entry-arrow{color:var(--cycles-bg)}
.entry-availability{font:11px/1.5 Arial,sans-serif;letter-spacing:.09em;color:#e5c991}
@media(max-width:700px){.cycles-next{margin-top:32px}.cycles-entry .entry-symbol{box-shadow:none}}

/* Day Master determines the cycles card hue; deeper tones keep cream copy legible. */
.cycles-entry[data-element="Wood"]{--cycles-bg:#345642;--cycles-hover:#3f634d;--cycles-border:#537860}
.cycles-entry[data-element="Fire"]{--cycles-bg:#824838;--cycles-hover:#925341;--cycles-border:#b66451}
.cycles-entry[data-element="Earth"]{--cycles-bg:#70563c;--cycles-hover:#806347;--cycles-border:#957453}
.cycles-entry[data-element="Metal"]{--cycles-bg:#76602e;--cycles-hover:#846d36;--cycles-border:#a9813f}
.cycles-entry[data-element="Water"]{--cycles-bg:#365b70;--cycles-hover:#416b80;--cycles-border:#507f99}

/* Default reading continues from the portrait into the same Four Pillars chart. */
#inline-pillars #chart-section{border-top:1px solid #dcd4c5;padding-top:40px}
#reading-panel-pillars #chart-section{margin-top:0;padding-top:0}
@media(max-width:700px){#inline-pillars #chart-section{padding-top:28px}}

/* Match the preceding chapter card without an extra title line on phones. */
@media(max-width:700px){.cycles-entry .entry-title{font-size:clamp(20px,calc(8.6vw - 7.5px),30px);line-height:33.9px}}

/* Optional hidden stems: one control keeps all four columns aligned. */
.hidden-stems-controls{position:relative;display:grid;grid-template-columns:max-content 44px minmax(0,1fr);align-items:center;gap:0;margin:-16px 0 18px;background:#e0e7da;border-radius:5px;font:15px/1.5 Arial,sans-serif;color:#304e3e}
#hidden-stems-toggle{grid-column:1 / -1;grid-row:1;display:flex;justify-content:flex-end;align-items:center;gap:12px;min-height:56px;padding:12px 20px;border:0;border-radius:5px;background:transparent;color:inherit;font:inherit;text-align:left;font-weight:500}
#hidden-stems-toggle:hover{background:#dfe5d7}
.hidden-stems-chevron{font-size:20px;line-height:1;transition:transform .15s}
#hidden-stems-toggle[aria-expanded=true] .hidden-stems-chevron{transform:rotate(180deg)}
.hidden-stems-help{grid-column:2;grid-row:1;z-index:1;display:inline-flex;align-items:center}
#hidden-stems-info{display:grid;place-items:center;width:44px;height:44px;border:0;background:transparent;color:#6a765f;padding:10px}
#hidden-stems-info>span{border:1px solid #939d85;border-radius:50%;width:22px;height:22px;font:italic 16px/20px Georgia,serif}
#hidden-stems-tooltip{position:absolute;z-index:10;bottom:calc(100% + 8px);left:14px;width:min(300px,calc(100vw - 64px));padding:15px 17px;border:1px solid #d5dccb;border-radius:8px;background:#fffdf6;color:#40533f;font:14px/1.65 Arial,sans-serif;box-shadow:0 6px 20px #263e251a}
#hidden-stems-tooltip:before{content:"";position:absolute;bottom:-6px;left:120px;width:10px;height:10px;background:#fffdf6;border-right:1px solid #d5dccb;border-bottom:1px solid #d5dccb;transform:rotate(45deg)}
@media(prefers-reduced-motion:reduce){.hidden-stems-chevron{transition:none}}

#hidden-stems-label{grid-column:1;grid-row:1;z-index:1;pointer-events:none;padding-left:20px;font-weight:500}
.hidden-stems-help{margin:0}
#hidden-stems-content{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:-10px 0 18px}
#hidden-stems-content .pillar-hidden{background:#f0ede4}
#hidden-stems-content .pillar-hidden.day{background:#e7eee3}
.pillar-hidden-empty{display:grid;place-items:center;color:#777b70}
@media(max-width:700px){#hidden-stems-content{gap:6px}#hidden-stems-toggle{padding:10px 14px}}

@media(max-width:700px){#hidden-stems-label{padding-left:14px}}

.reading-owner,#cycle-reading header .reading-owner{font:500 17px/1.5 Arial,sans-serif;color:#405c48;margin:0 0 14px;overflow-wrap:anywhere}
#result-caption,#elements-caption{overflow-wrap:anywhere}
.elements-toolbar>div{min-width:0}