/* One viewport: text and controls keep their size, the drawing uses the remainder. */
.home-page{--home-graph-min-height:200px;height:var(--home-viewport-height,100svh);min-height:0;display:flex;flex-direction:column;background:#fff}
@supports(height:100dvh){.home-page{height:var(--home-viewport-height,100dvh)}}
.home-page .site-header{flex:0 0 auto;width:100%}
.home-page .header-inner{min-height:72px;padding-block:10px}
.home-page .page-shell{flex:1 1 0%;display:flex;min-height:0;width:100%;max-width:var(--page-width);padding-block:0}
.home-experience{position:relative;flex:1;min-width:0;min-height:0;width:100%;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto auto;gap:8px;padding:8px 0 0}
.home-graph-wrap{grid-column:1;grid-row:1;width:100%;max-width:none;height:auto;min-height:0;margin:0;overflow:hidden;isolation:isolate}
.home-graph{overflow:hidden}
.home-thread{stroke:var(--ink);stroke-width:1.4}
.home-thread-depth{fill:none;stroke:var(--ink);stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.home-experience[data-home-view="helix"] .home-graph-wrap{touch-action:pan-y pinch-zoom;cursor:grab}
.home-experience[data-home-view="helix"] .home-graph-wrap.is-dragging{cursor:grabbing;user-select:none}
.home-axis{stroke:var(--guide);opacity:.65}
.home-axis-label{font-size:11px;fill:var(--muted)}
.home-connection-edge{stroke:var(--ink);opacity:.18}
.home-connection-edge.is-related{stroke:var(--pink);stroke-width:1.6;opacity:.85}
.home-dot{width:9px;height:9px;background:#fff;border-width:1.3px;transform:scale(var(--home-point-scale,1))}
.home-point-label{font-size:12px;font-weight:600;letter-spacing:0;color:var(--blue)}
.home-context-label{font-size:11px;line-height:1.4;width:128px;color:var(--muted)}
.home-context-point .home-dot{border-color:var(--muted)}
.home-idea-point .home-dot{width:8px;height:8px}
.home-work-point:hover .home-dot,.home-work-point:focus-visible .home-dot{box-shadow:0 0 0 5px var(--surface)}
.home-tooltip{padding:10px 12px;border-color:var(--guide);border-radius:8px;font-size:12px;box-shadow:0 5px 20px #2426290b}
.home-tooltip strong{font-weight:600}
.home-fallback-timeline{position:absolute;inset:0;display:flex;align-items:center;justify-content:space-between;padding:0 28px;font-size:11px;color:var(--muted)}
.home-fallback-timeline::before{content:"";position:absolute;left:28px;right:28px;top:50%;border-top:1.4px solid var(--ink)}
.home-fallback-timeline span{position:relative;transform:translateY(20px)}
.home-ready .home-fallback-timeline{display:none}
.home-caption-stack{grid-column:1;grid-row:2;max-width:none;width:100%;margin:0;min-width:0}
.home-graph-caption{width:100%;max-width:none;min-height:24px;padding:0;gap:12px;align-items:center;justify-content:flex-end;margin:0}
.home-graph-caption .home-legend{position:static;flex:0 0 auto;font-size:10px;line-height:1.4;gap:12px}
.home-legend i{width:5px;height:5px}
.home-description{grid-column:1;grid-row:3;display:block;min-width:0;min-height:0;margin:0;padding:14px 0 8px;border:0;border-top:1px solid var(--line);border-radius:0;gap:0;background:transparent}
.home-description-inner{grid-column:auto;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto;align-items:center;gap:28px;padding:0;min-height:0;min-width:0}
.home-copy-stack{min-width:0;max-width:none;height:var(--home-copy-height,auto)}
.home-copy-stack>.home-copy{min-height:0}
.home-description h2{color:var(--ink);font:550 clamp(22px,2.2vw,32px)/1.15 var(--font);letter-spacing:-.045em;margin:0 0 8px}
.home-description p{color:var(--muted);font:400 15px/1.5 var(--font);max-width:none;margin:0}
.home-description .home-copy-detail:empty{display:none}
.home-copy-stack>.home-idea-detail{width:100%;height:var(--home-copy-height,auto);max-height:var(--home-copy-height,200px);overflow-y:auto;overscroll-behavior:contain;padding:0 8px 3px 0;scrollbar-width:thin;scrollbar-color:var(--guide) transparent}
.home-idea-heading h2{color:var(--pink);font-size:21px;padding-right:8px}
.home-note-close{margin-top:-6px;flex:0 0 36px;width:36px;height:36px;min-width:36px}
.home-related-works{display:flex;flex-wrap:wrap;gap:0 14px;margin-top:10px}
.home-related-works a{min-height:40px;font-size:12px}
.home-step-controls{position:static;display:flex;flex-wrap:nowrap;align-items:center;justify-content:flex-end;gap:8px;min-width:0;min-height:44px;margin:0;padding:0;align-self:center}
.home-step-controls output{font-size:11px;min-width:34px;line-height:1.3;color:var(--muted);font-variant-numeric:tabular-nums;text-align:center}
.home-step-controls>.icon-button{width:44px;min-width:44px;height:44px;flex:0 0 44px;padding:10px;border:1px solid var(--guide);background:#fff;color:var(--blue)}
.home-step-controls>.home-next-button{width:104px;min-width:104px;flex:0 0 104px;display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:0 16px;border-color:var(--blue);background:var(--blue);color:#fff;font:450 13px/1 var(--font);border-radius:999px}
.home-next-button .icon{color:#fff}
.home-step-controls>.home-next-button:not(:disabled):hover,.home-step-controls>.home-next-button:not(:disabled):focus-visible{background:#1737b8;border-color:#1737b8;color:#fff}
.home-step-controls>.icon-button:disabled{opacity:1;cursor:default;color:#838991;border-color:var(--line);background:var(--surface)}
.home-step-controls>.icon-button:disabled .icon{color:#838991}
.home-step-controls>.home-next-button:disabled{color:var(--muted);background:var(--surface)}
.home-orbit-controls{display:flex;flex:0 0 auto;margin:0 auto 0 0;gap:0}
.home-orbit-controls .icon-button{width:40px;min-width:40px;height:44px;flex:0 0 40px;padding:10px;border:0;background:transparent;color:var(--blue)}
.home-time-year{font:400 11px var(--font);fill:var(--muted)}
.home-time-tick{stroke:var(--muted);opacity:.55}
.home-now-window{fill:var(--pink);fill-opacity:.08;stroke:var(--pink)}
.home-experience[data-home-view="focus"] .home-point-label{font-size:12px}
.home-page .site-footer{flex:0 0 auto;width:100%;min-height:40px;gap:0 16px;margin:0 auto;padding-block:0;font-size:11px;color:var(--muted)}
.home-page .site-footer::before{display:none}
.home-page .site-footer>a{min-height:36px;color:var(--blue)}
.home-no-script{font-size:14px;line-height:1.5}

@media(max-width:760px){
 .home-page .header-inner{min-height:84px;row-gap:0;padding-block:4px}
 .home-page .identity{font-size:22px;min-height:40px}
 .home-page .utility-nav>a{min-height:40px}
 .home-page .view-nav a{min-height:32px}
 .home-experience{gap:6px;padding-top:6px}
 .home-description{padding:12px 0 6px}
 .home-description-inner{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto;gap:10px}
 .home-copy-stack{max-width:none}
 .home-description h2{font-size:24px;line-height:1.12;margin-bottom:7px}
 .home-description p{font-size:14px;line-height:1.45;max-width:none}
 .home-step-controls{width:100%}
 .home-orbit-controls{margin-right:auto}
 .home-graph-caption{min-height:24px;gap:8px}
 .home-graph-caption .home-legend{gap:10px;font-size:10px}
 .home-legend>span:nth-child(2){display:flex}
 .home-context-label{width:108px;font-size:10px;line-height:1.35}
 .home-experience[data-home-view="timeline"] .home-context-label{width:108px;font-size:10px}
 .home-point-label,.home-experience[data-home-view="focus"] .home-point-label{font-size:11px}
 .home-time-year{font-size:10px}
 .home-page .site-footer{min-height:36px;font-size:10px}
}
@media(max-width:760px) and (max-height:700px){
 .home-page .header-inner{min-height:80px}
 .home-description h2{font-size:22px;line-height:1.12;margin-bottom:6px}
 .home-description p{font-size:14px;line-height:1.42}
 .home-description{padding-top:10px;padding-bottom:4px}
 .home-description-inner{gap:8px}
 .home-experience{gap:5px;padding-top:4px}
}
/* Browser bars can leave a small phone with less height than its screen size. */
@media(max-height:560px){.home-page{--home-graph-min-height:160px}}
@media(max-width:760px) and (max-height:560px){
 .home-page .header-inner{min-height:72px;padding-block:2px}
 .home-page .identity,.home-page .utility-nav>a{min-height:36px}
 .home-page .view-nav a{min-height:28px}
 .home-experience{gap:4px;padding-top:4px}
 .home-description{padding:6px 0 4px}
 .home-description-inner{gap:4px}
 .home-description h2{font-size:20px;line-height:1.12;margin-bottom:5px}
 .home-description p{font-size:14px;line-height:1.4}
 .home-page .site-footer,.home-page .site-footer>a{min-height:32px}
}
/* Wide, short screens use a reading column beside the drawing. */
@media(min-width:640px) and (max-height:520px){
 .home-page .header-inner{grid-template-columns:minmax(115px,1fr) auto minmax(100px,1fr);min-height:52px;padding-block:3px;gap:16px}
 .home-page .identity{font-size:22px;grid-column:1;grid-row:1;min-height:40px}
 .home-page .view-nav{grid-column:2;grid-row:1;gap:20px;font-size:11px}
 .home-page .utility-nav{grid-column:3;grid-row:1;gap:20px;font-size:12px}
 .home-page .view-nav a,.home-page .utility-nav>a{min-height:36px}
 .home-experience{grid-template-columns:minmax(0,1fr) clamp(250px,34vw,320px);grid-template-rows:minmax(0,1fr) auto;gap:6px 24px;padding:6px 0}
 .home-graph-wrap{grid-column:1;grid-row:1}
 .home-caption-stack{grid-column:1;grid-row:2}
 .home-description{grid-column:2;grid-row:1/3;display:flex;flex-direction:column;justify-content:center;padding:8px 0 8px 20px;border-top:0;border-left:1px solid var(--line);min-height:0}
 .home-description-inner{display:flex;flex-direction:column;align-items:stretch;gap:18px}
 .home-description h2{font-size:24px}
 .home-description p{font-size:14px;line-height:1.45}
 .home-step-controls{width:100%;gap:6px}
 .home-step-controls output{min-width:28px}
 .home-step-controls>.home-next-button{width:98px;min-width:98px;flex-basis:98px}
 .home-orbit-controls .icon-button{width:36px;min-width:36px;flex-basis:36px}
 .home-page .site-footer{min-height:32px}
 .home-page .site-footer>a{min-height:32px}
 .home-graph-caption .home-legend{font-size:10px;gap:8px}
}
/* Content remains available when text enlargement or a very small screen cannot fit. */
.home-page.home-flow{height:auto;min-height:var(--home-viewport-height,100svh);display:block}
.home-page.home-flow .page-shell{display:block}
.home-page.home-flow .home-experience{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:var(--home-flow-graph-height,280px) auto auto;height:auto;gap:10px}
.home-page.home-flow .home-graph-wrap{grid-column:1;grid-row:1;min-height:180px}
.home-page.home-flow .home-caption-stack{grid-column:1;grid-row:2}
.home-page.home-flow .home-description{grid-column:1;grid-row:3;display:block;border-left:0;border-top:1px solid var(--line);padding:14px 0}
.home-page.home-flow .home-description-inner{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto;gap:12px}
.home-page.home-flow .home-copy-stack{height:auto;max-width:none}
.home-page.home-flow .home-idea-detail{height:auto;max-height:none;overflow:visible}
.home-page.home-flow .site-footer{margin-top:8px}
@media print{.home-page{display:block;height:auto}.home-page .home-graph-wrap{height:400px}.home-page .home-copy-stack{height:auto}}

/* Transition layers share the existing reserved story cell; they add no height. */
.home-copy-stack>.home-copy-ghost{grid-area:1/1;align-self:start;z-index:2;pointer-events:none;user-select:none}
.home-graph-wrap .home-point-label,.home-graph-wrap .home-context-label{opacity:var(--home-label-opacity,1);transition:transform .18s ease,margin-left .18s ease}
@media(prefers-reduced-motion:reduce){.home-graph-wrap .home-point-label,.home-graph-wrap .home-context-label{transition:none}}
