/* PART-D97, 2026-09-16. Brian review: clear choices and consistent hierarchy. */
:root { --ux-ink: #493b40; --ux-accent: #795219; }
[data-theme="dark"] { --ux-ink: #e4d8d1; --ux-accent: #f0c86e; }
[hidden] { display: none !important; }
.ux-reading-page { display:flex; flex-direction:column; min-height:100dvh; }
.ux-reading-page main { width:100%; flex:1; }
.ux-reading-page #stage-hero { min-height:calc(100dvh - var(--site-nav-h) - 2rem); }
.ux-help { margin-bottom:1.5rem; color:var(--ux-ink); }
.ux-features { display:flex; flex-wrap:wrap; gap:.65rem; margin:.75rem 0 1.5rem; }
.ux-features button, .ux-contact-paths a { padding:.7rem 1rem; min-height:44px; border:1px solid var(--ux-accent); border-radius:8px; background:transparent; color:var(--ux-ink); font:inherit; text-decoration:none; }
.ux-features button[aria-pressed="true"] { background:var(--ux-accent); color:#fff; }
[data-theme="dark"] .ux-features button[aria-pressed="true"] { color:#12090a; }
.ux-features button:focus-visible, .ux-contact-paths a:focus-visible { outline:3px solid var(--ux-accent); outline-offset:3px; }
.folio-ch .ro-head { margin-bottom:1rem; }
.folio-cover .ro-portrait { max-width:100%; }
.dv-controls { position:relative; margin-top:2.25rem !important; padding:.75rem 0; z-index:2; }
.dv-controls button { min-width:44px; min-height:44px; }
.folio-ch details > summary { min-height:44px; display:flex; align-items:center; width:fit-content; padding:.6rem 1rem; border:1px solid var(--ux-accent); color:var(--ux-accent); border-radius:8px; }
.ux-invitation { display:flex; align-items:center; justify-content:space-between; gap:1.5rem; padding:1.5rem; margin:2rem 0; border:1px solid var(--ux-accent); border-radius:12px; }
.ux-invitation p { margin:0; color:var(--ux-ink); }
.ux-invitation .btn { flex-shrink:0; }
.ux-platform { max-width:1100px; margin:3rem auto; padding:2rem; scroll-margin-top:100px; }
.ux-platform h2 { font-family:'Cormorant Garamond',serif; font-size:clamp(2rem,4vw,3rem); }
.ux-platform p { margin:1rem 0 1.5rem; }
.ux-platform form { max-width:720px; }
.ux-contact-paths { display:flex; flex-wrap:wrap; gap:1rem; margin-bottom:2rem; }
.ux-interest { margin:2rem 0; padding:1.5rem; border:1px solid var(--ux-accent); border-radius:12px; }
.ux-interest h2 { font-family:'Cormorant Garamond',serif; font-size:2rem; }
.ux-interest .hero-capture { margin:1rem auto !important; }
.ux-phase-summary { padding:1rem 1.5rem; color:var(--ux-ink); }
.ux-phase-summary p + p { margin-top:1rem; }
.pagination-dots { flex-wrap:wrap; gap:.6rem !important; }
.pagination-dot { width:auto !important; height:auto !important; border-radius:6px !important; min-height:44px; padding:.6rem .8rem; background:transparent !important; border:1px solid var(--ux-accent); color:var(--ux-ink); font-size:1rem; cursor:pointer; }
.pagination-dot.active { background:var(--ux-accent) !important; color:white; }
[data-theme="dark"] .pagination-dot.active { color:#12090a; }
.ux-slide-count { text-align:center; margin:1rem; color:var(--ux-ink); }
.team-card .role, .row-label, .stat-label { color:var(--ux-ink) !important; opacity:1 !important; }
.ux-story-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem; margin:1.5rem 0; }
.ux-story-grid figure { min-width:0; margin:0; }
.ux-story-grid img { display:block; width:100%; height:auto; border:1px solid var(--ux-accent); border-radius:8px; }
.ux-story-grid figcaption { margin:.75rem 0; font-size:1rem; }
.ux-story-actions { display:flex; flex-wrap:wrap; gap:1rem; margin:1rem 0; }
.ux-stories { text-align:left; padding:2rem 0; border-top:1px solid var(--border2, #b9a999); }
.ux-stories h2 { font-size:var(--fs-h2,2.5rem); }
.ux-stories p { color:var(--ux-ink); }
#share-section { max-width:100% !important; width:100%; }
#share-holder { max-width:540px; margin:1.5rem auto; }
@media(max-width:700px) { .ux-story-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .ux-invitation { flex-direction:column; align-items:stretch; } .slider-pagination { flex-wrap:wrap; } .ux-platform {padding:1rem;} }
@media(prefers-reduced-motion:reduce) { .ux-reading-page {scroll-behavior:auto;} }

/* PART-D97, 2026-09-16. Compact entry, visible disclosure and consent retained. */
#stage-entry .ln-cover { position:relative; top:auto; height:auto; min-height:0; padding:2rem 0; }
#stage-entry .ln-cover-inner { min-height:0; padding:0; }
#stage-entry .ln-cover-eye, #stage-entry .ln-scrollcue, #stage-entry .ln-cover .kicker { display:none; }
#stage-entry .ln-flow { margin-top:0; padding-top:1rem; }
#stage-entry .ln-cards { margin-bottom:2rem; }
#stage-entry .ln-card { margin-bottom:.75rem; }
#stage-entry .ln-entry { padding-top:1rem; }
#recoveryHolder { margin-block:2rem !important; }
.folio-cover .ro-portrait p { max-width:48rem; margin-inline:auto; }
.folio-cover .ro-portrait h3 { font-size:clamp(2.5rem,5vw,4rem); }
.terms-wrap h2, .terms-container h2, .legal h2 { color:var(--ux-accent); }
.ep-glyph-swatches { gap:.6rem; flex-wrap:wrap; }
.ep-glyph-swatches::before { content:'Card colour'; flex-basis:100%; font-size:1rem; color:var(--ux-ink); }
.ep-glyph-swatches .ep-sw { min-width:44px; min-height:44px; }
.ux-stories button, .ux-stories a { min-height:44px; }

/* PART-D97, 2026-09-16. The crowd remains wine-coloured, with readable text. */
[data-theme="dark"] .fig-key .fk-c { color:#e6a6ae; }
[data-theme="dark"] .pb-crowd-label, [data-theme="dark"] .db-lab-crowd { fill:#e6a6ae; }
.finer-control + .finer-result .finer-axis-title { margin-top:1rem; }

.ux-story-preview { display:block; padding:0; width:100%; border:0; border-radius:8px; background:transparent; cursor:zoom-in; }
.ux-story-preview:focus-visible { outline:3px solid var(--ux-accent); outline-offset:4px; }

/* PART-D97, 2026-09-16. Five bounded chapters use actual heights for reliable anchors. */
.folio-ch .folio-park-inner { content-visibility:visible !important; contain-intrinsic-size:none !important; }
/* PART-D98, 2026-09-16. Shared page track and three-level hierarchy. */
:root { --page-track:min(70vw,1200px); --ux-title:clamp(2rem,3.2vw,3.25rem); --ux-section:clamp(1.5rem,2.4vw,2.25rem); }
@media(max-width:1050px){:root{--page-track:calc(100% - 40px);}}
@media(max-width:600px){:root{--page-track:calc(100% - 32px);}}
#stage-readout, #readoutBody.folio-body { --ro-measure:var(--page-track); }
#stage-readout {width:var(--page-track);max-width:1200px;margin-inline:auto;padding-inline:0;}
#stage-readout #readoutBody {--ro-measure:100%;width:100%;}
#page-home .hero {width:var(--page-track);margin-inline:auto;padding-inline:0;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);}
#page-home .hero-content {min-width:0;width:100%;}
#page-home .ux-platform,.contact-section,.team-section,.why-section,.partnerships-section {width:var(--page-track);max-width:1200px;margin-inline:auto;padding-inline:0;}
#page-home .ux-platform {box-sizing:border-box;}
.team-slider-wrapper {width:100%;max-width:none;padding-inline:0;}
.team-header,.contact-header {text-align:left;max-width:none;}
.folio-cover {position:relative!important;top:auto!important;min-height:0!important;padding:3rem 0!important;}
.folio-cover .folio-cover-inner {animation:none!important;transform:none!important;opacity:1!important;}
.folio-cover .ro-scroll-hint {position:relative!important;inset:auto!important;margin:1rem 0 0;}
.folio-ch .folio-eyebrow {font-family:'Cormorant Garamond',serif;font-size:var(--ux-title);letter-spacing:0;text-transform:none;line-height:1.15;gap:.6rem;margin-bottom:2rem;}
.folio-ch {padding-block:3rem;}
.folio-ch h3,.ux-stories h2 {font-size:var(--ux-section)!important;}
.folio-ch p,.folio-ch button,.folio-ch summary,.folio-ch label {font-size:var(--fs-body,1.1875rem);}
.folio-ch .ro-head,.folio-ch .lede,.folio-ch .ro-meaning {max-width:100%;}
.consensus-value {display:none;}
.fig-pb,.fig-db,.consensus-curved,.scale-comparison,.ro-radar {margin-inline:auto;}
.fig-pb,.fig-db {max-width:850px;}
.dv-deck {max-width:410px;margin-inline:auto;}
.ux-invitation {position:relative!important;z-index:1;background:var(--bg,#faf6f1);isolation:isolate;box-sizing:border-box;width:100%;}
.ux-features {padding:1rem;border:1px solid var(--ux-accent);background:#f0e9df;border-radius:12px;}
[data-theme="dark"] .ux-features {background:#1c1214;}
.ux-pool-dialog {width:min(650px,calc(100% - 32px));max-height:85dvh;box-sizing:border-box;overflow:auto;background:var(--bg,#faf6f1);color:var(--fg,#33282b);border:1px solid var(--ux-accent);border-radius:16px;padding:1.5rem;}
.ux-pool-dialog::backdrop {background:rgba(0,0,0,.65);}
.ux-pool-dialog #signin-section {width:100%;margin:1rem 0!important;}
.ux-pool-dialog .panel {padding:0;background:transparent;border:0;}
.ux-pool-dialog button[data-pool-close] {display:block;margin-left:auto;min-height:44px;}
#poolName {width:100%;box-sizing:border-box;padding:.8rem;border:1px solid var(--ux-accent);border-radius:6px;background:var(--bg);color:var(--fg);font:inherit;}
.pool-name-note {font-size:1rem!important;line-height:1.5;}
.ux-contact-panel .ux-platform {width:100%;padding:0;margin:0;}
.ux-contact-paths {display:none;}
.contact-card[aria-pressed="true"] {border:2px solid var(--ux-accent);}
.ux-story-grid img {aspect-ratio:9/16;object-fit:contain;}
.hero-capture {display:flex;flex-wrap:wrap;gap:.75rem;}
.hero-capture #notifyName {font:inherit;min-width:0;padding:.8rem;flex:1;border:1px solid var(--ux-accent);border-radius:6px;background:var(--bg,#fff);color:var(--ux-ink);}
.hero-capture label {flex-basis:100%;text-align:left;}
.hero-capture input[type=email] {min-width:0;}
@media(max-width:700px){
 #page-home .hero {grid-template-columns:1fr;}
 .team-slider .team-card {width:calc(100vw - 56px)!important;min-width:calc(100vw - 56px)!important;max-width:none;flex:0 0 calc(100vw - 56px);box-sizing:border-box;padding:1.25rem;}
 .team-slider {padding-inline:0!important;scroll-padding-inline:0;}
 .team-slider-wrapper {overflow:hidden;}
 .ro-rail-label {display:none!important;}
 #roRail {display:none!important;}
 .folio-ch .folio-eyebrow {flex-wrap:wrap;}
 .hero-capture {flex-direction:column;align-items:stretch;}
}
/* PART-D98, 2026-09-16. Align introductions and visibly select the active enquiry. */
.contact-header p,.team-header p {margin-inline:0;text-align:left;}
.contact-card[aria-pressed="false"] {border:1px solid transparent;}
.contact-card[aria-pressed="true"] {border:2px solid var(--ux-accent)!important;}
@media(min-width:1051px) and (max-width:1300px){nav.site-header .nav-links {gap:.7rem;}nav.site-header .nav-links a {font-size:1rem;}}
/* PART-D98, 2026-09-16. Existing marketing containers use the same track. */
#why-harmonia > .container, #s-hero .p2p-inner {width:var(--page-track);max-width:1200px;margin-inline:auto;padding-inline:0;}
#why-harmonia,#s-hero {padding-inline:0;}
#why-harmonia .why-header-group {max-width:100%;}
.team-header h2,.contact-header h2,.p2p-headline,.section-title {font-size:var(--ux-title)!important;}
.ux-platform h2,.ux-interest h2,.regal-form h3,.team-card h3 {font-size:var(--ux-section)!important;}
#page-home .hero h1 {font-size:var(--ux-title);}
.ux-stories > h2 {text-align:left;}
.ux-pool-dialog input:focus-visible,.ux-pool-dialog button:focus-visible {outline:3px solid var(--ux-accent);outline-offset:3px;}
/* PART-D98, 2026-09-16. Align hero content while its decoration stays full width. */
#page-home .hero {width:100%;max-width:none;padding-inline:calc((100% - var(--page-track))/2);box-sizing:border-box;}
/* PART-D99, 2026-09-16. Third review: the Team band paints edge to edge with its content on the track; one-line founders sentence; Home lead on the column. */
.team-section {width:100%;max-width:none;padding-inline:calc((100% - var(--page-track))/2);box-sizing:border-box;}
.team-header p {max-width:none;}
#page-home .philosophy-block {max-width:none;margin-inline:0;text-align:left;}
@media(max-width:1024px){.team-header {padding-inline:0;}}
/* PART-D99, 2026-09-16. Centred figures in Folios II and III, text across the full box, one chapter heading size. */
.folio-ch .ro-card .dv-deck {margin-inline:auto;}
.folio-merged .ro-merged .ro-radar-wrap {margin-inline:auto;}
.folio-merged .ro-merged figure.ro-shape-fig {text-align:center;}
.folio-merged .ro-merged .folio-figcap {max-width:100%;margin-inline:auto;}
.folio-ch:not(.folio-cover) .ro-card .ro-head,.folio-ch .ro-card p.lede,.folio-ch .ro-card p.soft,.folio-ch .ro-meaning,.folio-ch .folio-figcap {max-width:100%;}
#stage-readout .folio-finer > .folio-real-title {font-family:'Cormorant Garamond',serif;font-size:var(--ux-title);line-height:1.15;margin-bottom:2rem;}
/* PART-D99, 2026-09-16. The card colours sit just before the keepsake card, with room beneath them. */
.ux-card-colour {margin:1rem auto 1.75rem;}
/* PART-D99, 2026-09-16. Second pass over the earlier reviews: a larger keepsake card, a larger centred consensus dial, finer descriptions across the box. */
#share-holder svg {width:min(440px,88vw);}
.consensus-curved {max-width:100%;}
.consensus-curved .consensus-dial {max-width:520px;margin-inline:auto;}
.consensus-curved .consensus-directions {max-width:520px;margin-inline:auto;}
.finer-feature-description {max-width:100%;}
/* PART-D100, 2026-09-16. The global margin reset in styles/demo.css removed the browser's own dialog centring; both readout dialogs take it back. */
.ux-pool-dialog, .story-dialog {margin:auto;}
/* PART-D100, 2026-09-16. The standalone reading-number line is removed at Avery's word; its block keeps no gap. */
.eye-print .ep-id {display:none;}
.eye-print {margin:0;}
/* PART-D101, 2026-09-16. Brian-lens review, Home: the slide on the track, one spacing rhythm, no repeated slide text, the type ladder, one left line, readable accents. */
@media(min-width:1051px){#why-harmonia .science-slider-wrapper {width:var(--page-track);max-width:1200px;margin-inline:auto;left:auto;right:auto;padding:0;overflow-x:hidden;} #why-harmonia .slider-track {padding-inline:0;} #why-harmonia .science-card {flex:0 0 var(--page-track);max-width:1200px;scroll-snap-align:start;}}
@media(min-width:1051px){#page-home .hero {min-height:0;padding-block:4rem;} #page-home #why-harmonia {margin-top:0;padding-top:4rem;padding-bottom:4rem;} #page-home .ux-platform {margin-block:0 4rem;padding-top:0;} #page-home .science-slider-wrapper {margin-bottom:0;}}
#why-harmonia .card-subtitle {display:none;}
#why-harmonia .card-title {font-size:var(--ux-section)!important;}
#why-harmonia .stat-number {font-size:var(--ux-title);}
#page-home .ux-platform p, #why-harmonia .lead-text {font-size:var(--fs-body,1.1875rem);}
#why-harmonia .lead-text {font-weight:500;}
#why-harmonia .why-header-group {align-items:stretch;text-align:left;} #why-harmonia .section-title, #why-harmonia .stat-card {text-align:left;} #why-harmonia .stats-grid {max-width:none;}
@media(min-width:1051px) and (max-width:1366px){#page-home .hero-ctas .btn {padding-inline:1.5rem;}}
#why-harmonia .section-title span {color:var(--ux-accent)!important;} #why-harmonia .comparison-column.highlight .comp-label {color:var(--ux-accent);} #why-harmonia .pagination-dot {opacity:1!important;} #why-harmonia .comparison-column.dim .comp-text {opacity:1;}
[data-theme="dark"] #why-harmonia .comp-label {color:rgba(255,255,255,.7);}
.ux-home-invitation {width:var(--page-track);max-width:1200px;margin:0 auto 4rem;}
.note-box {display:none;}
/* PART-D101, 2026-09-16. Testing Pool page on the lines; phases never dim; summaries as label and sentence. */
#s-hero .p2p-context, #s-hero .phase-tabs-wrapper, #s-hero .card-section, #s-hero .ux-interest .hero-capture {max-width:none;width:100%;}
#s-hero .p2p-headline, #s-hero .p2p-context {text-align:left;}
.card-section.has-active .phase-card:not(.is-active) {opacity:1!important;transform:none!important;filter:none!important;}
.phase-card:not([data-state="collapsed"]) .card-phase-subtitle {display:block!important;}
.ux-phase-summary {padding-inline:1.5rem;} .ux-phase-summary p {font-size:var(--fs-body,1.1875rem);text-align:left;}
.ux-phase-summary strong {display:block;font-family:'DM Sans',sans-serif;font-weight:600;font-size:var(--fs-label,1rem);text-transform:uppercase;letter-spacing:var(--ls-label,.06em);color:var(--p2p-gold-text,var(--ux-accent));margin-bottom:.3rem;}
.phase-card .more-info-btn {min-height:44px;}
.ux-interest .hero-capture input {flex:1 1 260px;}
@media(max-width:700px){#s-hero .phase-tabs-wrapper {display:none;} .ux-phase-summary {padding-inline:0;}}
/* PART-D101, 2026-09-16. Contact: one-line intro, aligned rows, one form language, even spacing. */
.contact-header p {max-width:none;}
.regal-form .form-row {align-items:end;}
.regal-form h3 {text-align:left;}
.regal-form .submit-btn, .regal-form .btn-regal-submit {display:flex;justify-content:center;align-items:center;gap:.5rem;width:100%;min-height:52px;padding:.9rem 1.5rem;font-family:'DM Sans',sans-serif;font-size:var(--fs-body,1.1875rem);letter-spacing:.02em;background:var(--ux-accent);color:#fff;border:1px solid var(--ux-accent);border-radius:8px;}
[data-theme="dark"] .regal-form .submit-btn, [data-theme="dark"] .regal-form .btn-regal-submit {color:#12090a;}
.card-indicator {display:none;}
.contact-card {padding-bottom:1.5rem;min-height:0;} .regal-form-container {padding-bottom:1.5rem;} .contact-layout {align-items:start;} .contact-section {padding-block:2.5rem;}
/* PART-D101, 2026-09-16. Team: three columns on desktop; the phone card on the track with reachable arrows and dots. */
@media(min-width:1025px){.team-slider {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem;} .team-slider .team-card {grid-column:auto!important;grid-row:auto!important;width:auto;max-width:none;}}
@media(max-width:700px){.team-slider .team-card {width:calc(100vw - 32px)!important;min-width:calc(100vw - 32px)!important;flex:0 0 calc(100vw - 32px);} .team-slider-wrapper {position:relative;} .team-slider-wrapper .slider-arrow {display:flex;position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;margin:0;z-index:2;} .team-slider-wrapper .slider-arrow.prev {left:0;} .team-slider-wrapper .slider-arrow.next {right:0;} .slider-dots {gap:24px;} .slider-dots .dot {position:relative;} .slider-dots .dot::after {content:'';position:absolute;inset:-20px -12px;}}
.ux-team-count {text-align:center;margin:0 0 1rem;color:var(--ux-ink);}
/* PART-D101, 2026-09-16. Terms on the track, its headings on the ladder, its back link readable. */
.legal {width:var(--page-track);max-width:1200px;margin-inline:auto;padding-inline:0;} .legal h1 {font-size:var(--ux-title);} .legal h2 {font-size:var(--ux-section);} .legal a.backlink {color:var(--ux-accent);}
/* PART-D101, 2026-09-16. Stage-1 corrections after measurement. */
.ux-home-invitation {margin:1rem auto 0;}
.contact-card .card-indicator {display:none!important;}
@media(min-width:1025px){.ux-team-count {display:none;}}
@media(max-width:700px){.team-slider-wrapper .slider-arrow {display:flex!important;}}
/* PART-D101, 2026-09-16. See Your Eye entry: every stage on the track, two columns on desktop, one Welcome back, no empty band, a still eye for reduced motion. */
.ux-reading-page #stage-hero {min-height:0;}
#stage-hero, #stage-entry, #stage-rate {width:var(--page-track);max-width:none;margin-inline:auto;}
#stage-entry .ln-flow {padding-inline:0;} #stage-entry .ln-flow > * {max-width:none;}
#stage-entry .entry-sub {display:none;}
@media(min-width:1051px){#stage-entry .ln-flow {display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:start;} #stage-entry .ln-cards {margin-bottom:0;}}
@media(max-width:600px){#stage-entry .panel {padding:1rem;} #stage-entry .dob-row {flex-wrap:nowrap;} #stage-entry .ln-cards, #stage-entry .panel {margin-inline:0;}}
.resume-note .btn {min-height:50px;padding:.6rem 1.4rem;font-size:1rem;}
@media(prefers-reduced-motion:reduce){.hero-eye .he-lid, .hero-eye .he-iris {stroke-dashoffset:0!important;animation:none!important;} .hero-eye .he-pupil, .hero-eye .he-glint {animation:none!important;opacity:1!important;}}
/* PART-D101, 2026-09-16. Readout: no doubled headings, one lead and one caption per figure, readable crowd colours in the dark, compact locked cards, the plate and the panels on the track, boilerplate said once. */
#stage-readout > .kicker {display:none;}
.folio-cover .hero-arch .kicker {font-size:var(--ux-title);}
.folio-cover .ro-hero, .folio-cover .ro-portrait p, .folio-cover .portrait-text {max-width:100%;}
.folio-merged .ro-merged > .ro-head, .folio-leaned .ro-card > .ro-head {display:none;}
.folio-ch .ro-card > .ro-meaning {display:none;}
.folio-room .ro-card:has(.consensus-curved) > p.lede {display:none;} .folio-fig:has(> .consensus-curved) > .folio-figcap {display:none;} .consensus-question {margin-top:1.5rem;}
.folio-room .ro-card:has(.fig-pb) > p.soft {display:none;}
[data-theme="dark"] .fig-pb .pb-val-c {fill:#e6a6ae;} [data-theme="dark"] .fig-pb .pb-crowd {fill:#c4626f;} [data-theme="dark"] .folio-figcap .fk-c {color:#c9606d;}
.folio-ch .ro-card:has(> .lock-note), .folio-ch .ro-card:has(> .guard-note) {display:flex;flex-wrap:wrap;align-items:baseline;gap:.25rem 1.5rem;}
.folio-ch .ro-card:has(> .lock-note) > .ro-head, .folio-ch .ro-card:has(> .guard-note) > .ro-head {margin:0;}
.folio-ch .ro-card:has(> .lock-note) h3, .folio-ch .ro-card:has(> .guard-note) h3 {font-size:var(--fs-body,1.1875rem)!important;}
.folio-ch .ro-card:has(> .lock-note) > .lock-note, .folio-ch .ro-card:has(> .guard-note) > .guard-note {margin:0;flex:1 1 20rem;}
@media(max-width:600px){#stage-readout {width:100%;} #stage-readout > h2, #readoutSub, .readout-disclaimer {margin-inline:0;max-width:100%;padding-inline:0;}}
.folio-merged .ro-merged .ro-radar-wrap {width:min(520px,100%);max-width:520px;} .folio-merged .ro-merged .ro-radar {width:100%;max-width:520px;height:auto;}
.folio-ch:not(.folio-cover) .ro-dd summary {margin-inline:0;} .folio-ch .lean-list li {max-width:100%;} .folio-cover .dd-nums li:first-child {display:none;}
.folio-finer .finer-control {max-width:100%;} .finer-chapter-intro, .bg-sortnote, .bg-confound, .finer-control-note {max-width:100%;}
.bg-sortnote {display:none;} .bg-confound-eyebrow {font-weight:400;text-transform:none;letter-spacing:0;font-size:var(--fs-body,1.1875rem);} .folio-ch details.ro-dd {margin-inline:0;}
.bg-count-number {display:none;}
.finer-family-card ~ .finer-family-card .finer-reading-guide, .finer-family-card ~ .finer-family-card .finer-illustration-note, .finer-family-card ~ .finer-family-card .finer-reading-note {display:none;}
.readout-disclaimer {text-align:left;padding-inline:0;font-size:var(--fs-body,1.1875rem);}
/* PART-D101, 2026-09-16. Keep your Eye: a chapter-size title on the left line, one order for the two action rows, the viewer without its third copy, the dialog opening on its Join button. */
#share-section {text-align:left;}
#share-section > .kicker {font-family:'Cormorant Garamond',serif;font-size:var(--ux-title);font-weight:600;text-transform:none;letter-spacing:0;line-height:1.15;text-align:left;color:var(--gold-text,var(--ux-accent));}
#share-section > .kicker::before, #share-section > .kicker::after {content:none;display:none;}
#share-section .ux-stories h2 {text-align:left!important;} .ux-stories {margin-top:2rem;}
.ux-keep-actions {display:flex;flex-wrap:wrap;gap:1rem;margin:1rem 0;justify-content:flex-start;}
.story-dialog .story-actions, .story-dialog .story-explanation {display:none;}
.story-dialog .story-view > img {max-height:calc(85dvh - 200px);width:auto;max-width:100%;margin:1rem auto;}
.ux-keep-link {display:inline-block;margin-top:1rem;min-height:44px;line-height:44px;color:var(--ux-accent);font-weight:600;text-decoration:underline;text-underline-offset:.2em;}
.ux-pool-dialog .reading-strength, .ux-pool-dialog .pool-link-line, .ux-pool-dialog .pool-name-note {display:none;}
.ux-pool-dialog .pool-form {max-width:100%!important;}
.ux-pool-dialog {max-height:92dvh;padding:1rem 1.5rem;}
.ux-pool-dialog button[data-pool-close] {background:transparent;border:1px solid var(--ux-accent);border-radius:8px;color:var(--ux-ink);font:inherit;padding:.6rem 1rem;cursor:pointer;}
@media(max-width:600px){.ux-keep-actions .btn, .ux-story-actions .btn {width:100%;} .ep-glyph-swatches {gap:.5rem;} .folio-ch {padding-block:2rem;} .ux-invitation {margin:2rem 0;}}
/* PART-D101, 2026-09-16. Phone: the See Your Eye stages take the site gutter that main already provides. */
@media(max-width:600px){#stage-hero, #stage-entry, #stage-rate {width:100%;}}
/* PART-D101, 2026-09-16. Phone: the dialog title carries the introduction; the Join button is on screen at open. */
@media(max-width:600px){.ux-pool-dialog #signin-section > .panel > p {display:none;}}
/* PART-D101, 2026-09-16. Visual pass: the Home invitation button in the marketing button style; the card colour label centred over its swatches. */
.ux-home-invitation .btn {white-space:nowrap;}
.ep-glyph-swatches::before {text-align:center;}
/* PART-D101, 2026-09-16. Visual pass: on phones the Team arrows sit under the card beside the dots, never over its text. */
@media(max-width:700px){.team-slider-wrapper {display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem 1rem;} .team-slider-wrapper .team-slider {order:1;flex:0 0 100%;width:100%;} .team-slider-wrapper .slider-arrow {position:static;transform:none;order:2;} .team-slider-wrapper .slider-arrow.next {order:3;}}
/* PART-D102, 2026-09-16. The Home invitation and the Testing Pool name field were written against the readout's --bg token, which the marketing stylesheet does not define, so the dark theme showed a cream box with pale text. Both now use the marketing page's own tokens in both themes. */
.ux-home-invitation {background:var(--cream,#faf6f1);}
.hero-capture #notifyName {background:var(--card-bg,#f0e8df);color:var(--navy,#1e293b);border:1px solid rgba(212,168,83,.3);border-radius:4px;}
.hero-capture #notifyName::placeholder {color:var(--p2p-text-3,#6b5d61);}
[data-theme="dark"] .hero-capture #notifyName {background:var(--dark-surface,#1e1013);color:var(--navy,#f5f0e8);border-color:rgba(240,200,110,.2);}
/* PART-D104, 2026-09-17. Fourth review, Home: the four slide controls are one segmented bar; the "1 of 4" line stays. */
#why-harmonia .pagination-dots {display:flex;flex-wrap:nowrap;gap:6px;width:420px;max-width:100%;margin-inline:auto;}
#why-harmonia .pagination-dot {position:relative;flex:1 1 0;width:auto!important;height:6px!important;min-height:0;padding:0;border:0;border-radius:3px!important;background:rgba(121,82,25,.22)!important;color:transparent;font-size:0;line-height:0;cursor:pointer;}
#why-harmonia .pagination-dot::before {content:'';position:absolute;inset:-19px 0;}
#why-harmonia .pagination-dot.active {background:var(--ux-accent)!important;}
[data-theme="dark"] #why-harmonia .pagination-dot {background:rgba(240,200,110,.25)!important;}
[data-theme="dark"] #why-harmonia .pagination-dot.active {background:var(--ux-accent)!important;}
#why-harmonia .pagination-dot:focus-visible {outline:3px solid var(--ux-accent);outline-offset:8px;}
#why-harmonia .slider-pagination {background:transparent;padding-block:1.25rem;width:100%;max-width:none;justify-content:center;}
/* PART-D104, 2026-09-17. Fourth review, See Your Eye: the questions on the left; a shorter lens shadow that ends above the count; the back arrow beside the count and clickable; the end labels outside 1 and 7 on desktop. */
@media(min-width:1051px){#stage-entry .ln-flow > .panel {order:-1;}}
.lens {box-shadow:0 10px 28px rgba(0,0,0,.28), inset 0 0 0 1px rgba(240,200,110,.18);}
.rate-tally {margin-top:1.6rem;align-items:center;}
.scale-back {z-index:2;}
.rate-tally .scale-back {position:static;transform:none;margin-right:.6rem;flex:none;}
.rate-tally .scale-back:hover {transform:scale(1.07);}
.rate-tally .scale-back:active {transform:scale(.93);}
.rate-tally .scale-back::after {top:auto;bottom:100%;margin-top:0;margin-bottom:.3rem;}
@media(min-width:700px){
 .scale-wrap {display:grid;grid-template-columns:1fr auto 1fr;grid-template-areas:"q q q" "left row right" ". mid ." "keys keys keys";align-items:center;column-gap:.8rem;max-width:820px;}
 .scale-wrap .scale-q {grid-area:q;margin-bottom:1.4rem;}
 .scale-wrap .scale-row-wrap {grid-area:row;}
 .scale-wrap .scale {margin-top:0;}
 .scale-wrap .scale-ends {display:contents;}
 .scale-wrap .scale-ends > :nth-child(1) {grid-area:left;justify-self:end;text-align:right;}
 .scale-wrap .scale-ends > :nth-child(2) {grid-area:mid;justify-self:center;text-align:center;margin-top:.55rem;}
 .scale-wrap .scale-ends > :nth-child(3) {grid-area:right;justify-self:start;text-align:left;}
 .scale-wrap .scale-hintkeys {grid-area:keys;}
}
/* PART-D104, 2026-09-17. Fourth review, readout: a tighter top so the first screen shows the faces and the Harmonia credit; "Your desire" and "Your disdain" at body size; no moving background; the Folio I eye faint on the left and its numeral on the right like every other chapter. */
#stage-readout, #stage-readout.folio {padding-top:1rem;}
#readoutSub {margin:.2rem 0 .4rem;}
.eye-print-faces {margin-top:.2rem;}
.epf-pole-label {font-size:var(--fs-body,1.1875rem);margin-bottom:.6rem;}
.epf-controls {margin-top:.6rem;}
@media(min-width:1051px){.epf-card {flex-basis:min(20rem,42vw);width:min(20rem,42vw);}}
.epf-note {margin-top:.6rem;}
.epf-credit {margin-top:.8rem;}
#readoutCanvas {display:none;}
.folio-cover-inner > .folio-background-eye {left:0;width:min(30%,280px);transform:translate(0,-50%);opacity:.06;}
:root[data-theme="light"] .folio-cover-inner > .folio-background-eye {opacity:.08;}
.folio-cover .folio-watermark {left:auto;right:-0.06em;transform:translateY(-52%);font-style:italic;color:rgba(240,200,110,.045);}
/* PART-D105, 2026-09-17. The keepsake card, its colour swatches, its two actions and the "Your story cards" heading return exactly as at PR 58, at Avery's word; the D104 rules that hid them stood here. The two-column card grid below stays. */
.ux-story-grid {grid-template-columns:repeat(2,minmax(0,1fr));max-width:920px;}
/* PART-D106, 2026-09-18. Home rhythm decompressed at the 17 September review's word ("I said to remove a bit of a space, not to compress everything ... there is a way between one and the other"): the desktop values sit between the pre-D101 full-viewport hero with its 144px chapter gap and the D101 content-tight band with one 64px step. The hero is the midpoint of those two at every window height, min(50vh + 15rem, 50rem): 780px at 1920x1080, 690px at 1440x900, 640px at 1280x800, capped at 800px on tall monitors, with a 5rem floor; the hero-to-chapter gap goes 64px to 96px, the lead-to-slider gap 48px to 64px, the "1 of 4" line-to-invitation gap 32px to 64px and the chapter's closing padding 64px to 96px. Phone and tablet rules are untouched. The D101 line above stays; its .ux-platform clause has been dead on Home since D104 removed that block, and its slider margin-bottom:0 is kept. */
@media(min-width:1051px){#page-home .hero {min-height:min(calc(50vh + 15rem),50rem);padding-block:5rem;} #page-home #why-harmonia {padding-top:6rem;padding-bottom:6rem;} #page-home .why-header-group {margin-bottom:4rem;} #page-home .ux-home-invitation {margin-top:3rem;}}
/* PART-D106, 2026-09-18. Readout invitations: four different sentences wrap differently, so each keeps more than one word on its last line (Chromium and Safari honour it, other engines ignore it; the boxes do not change). */
.ux-reading-page .ux-invitation p {text-wrap:pretty;}
/* PART-D106, 2026-09-18. 17 September video review, Keep your Eye: "This needs to be centered. Everything here needs to be centered" (video 1:29-1:35). The D101 left line is reversed for #share-section and the closing paragraph only; the folios above keep theirs. The two action rows, the Your story cards heading, notes and captions, the card grid and the closing paragraph sit on the section's centre line, and the centred sentences balance their lines as .readout-sub does. */
#share-section, #share-section > .kicker, #share-section .ux-stories, .readout-disclaimer {text-align:center;}
#share-section .ux-stories h2 {text-align:center!important;}
#share-section .ux-keep-actions, #share-section .ux-story-actions {justify-content:center;}
#share-section .ux-story-grid {margin-inline:auto;}
#share-section .ux-stories p, .readout-disclaimer {text-wrap:balance;}
/* PART-D106, 2026-09-18. Testing Pool page on one 860px column, centred on the track: the reviewer called the D101 full-track page wide, after the earlier mixed centred widths had read as poorly distributed. The cap sits on .p2p-inner, so the headline, context, notify panel and its fields, tabs, phase cards and closing line all keep filling one column (the D101 rule that spreads them across .p2p-inner stands) and the D101 checks against .p2p-inner still hold. 860px sits between the 760px column the page had before D98 and the 1200px track, brings the longest label and sentence line from 125 to 88 characters at 1920, and only bites above 1228px viewports, so phones, tablets and narrow laptops are unchanged. On desktop the headline now takes two lines, balanced so the second is never a single word. */
#s-hero .p2p-inner {max-width:860px;}
@media(min-width:1051px){#s-hero .p2p-headline {text-wrap:balance;}}