/* The experience owns one viewport; only long page content scrolls internally. */
body { height: 100svh; min-height: 0; display: grid; grid-template-rows: auto minmax(0, 1fr) auto auto; overflow: hidden; }
.site-header { height: clamp(64px, 10svh, 96px); }
#experience, body.view-active #experience { height: auto; min-height: 0; max-height: none; }
.conversation { margin-top: 8px; }
.site-footer { margin-top: 10px; padding: 10px 0; }
.hero { top: 7%; }
.view-panel { top: 3%; max-height: 94%; display: flex; flex-direction: column; overflow: hidden; }
.view-content { min-height: 0; overflow: auto; scrollbar-width: none; }
.view-toolbar { margin-bottom: 12px; }
.view-content h2 { margin: 10px 0 14px; }
.view-content p { margin: 10px 0; }
body[data-current-view="origin"] .view-panel, body[data-current-view="orbit"] .view-panel { max-height: 94%; overflow: hidden; }
.companion-activity { bottom: 5px; }
.orbit-object-link { position: absolute; pointer-events: auto; border-radius: 50%; cursor: pointer; }
.reply-line { min-height: 30px; }
#reply { max-height: 68px; }
.voice-status { position: absolute; bottom: 100%; right: 0; max-width: 65%; background: #f4f6eff2; border-radius: 8px; padding: 6px 10px; }
@media (max-width: 1100px) {
  #experience, .view-active #experience { grid-template-rows: auto minmax(0, 1fr); }
  .hero { margin: 14px 7% 0; }
  h1 { font-size: clamp(34px, 5.7svh, 58px); margin: 10px 0; }
  .lead { margin: 7px 0; line-height: 1.4; }
  .passages { margin-top: 10px; }
  .companion-scene, .view-active .companion-scene { height: 100%; min-height: 0; }
  .view-panel, .view-active .view-panel { margin: 12px 7% 0; max-height: 43svh; padding: 0; }
  body[data-current-view="origin"] .view-panel, body[data-current-view="orbit"] .view-panel { max-height: 43svh; }
  .view-content h2 { font-size: clamp(28px, 4svh, 40px); margin: 8px 0 10px; }
  .view-toolbar { margin-bottom: 9px; padding-bottom: 8px; gap: 8px; }
  .view-navigation { gap: 10px; }
  .creation-list { --wheel-row-height: 58; height: 174px; flex-basis: 174px; margin-top: 4px; }
  .creation-row { height: 58px; padding: 6px 0; }
  .connection-branches { --wheel-row-height: 52; height: 156px; }
  .connection-link { height: 52px; }
  .connection-map { margin: 12px 0 0; }
  .view-next { margin-top: 5px; padding: 4px 0; }
  .conversation { margin-top: 5px; }
  .site-footer { margin-top: 4px; padding: 6px 0 max(6px, env(safe-area-inset-bottom)); }
  .conversation-meta { margin: 6px 10px; }
  #chat-form { min-height: 52px; padding: 5px 12px; }
  .reply-line { margin-bottom: 6px; font-size: 12px; }
  .orbit-link { font-size: 10px; padding: 4px; }
  .orbit-link small { font-size: 7px; margin-top: 3px; }
  .companion-activity { bottom: 0; font-size: 9px; }
}
@media (max-width: 600px) and (max-height: 700px) {
  .site-header { height: 54px; }
  .wordmark { font-size: 19px; }
  .wordmark span { font-size: 8px; margin-top: 3px; }
  .hero { margin-top: 8px; }
  h1 { font-size: 34px; margin: 7px 0; }
  .lead { font-size: 12px; }
  .eyebrow { font-size: 8px; }
  .passages { margin-top: 6px; }
  .passage-links { margin-top: 5px; }
  .view-panel, .view-active .view-panel { margin-top: 6px; }
  .view-content h2 { font-size: 25px; margin: 5px 0 7px; }
  .view-toolbar { margin-bottom: 6px; padding-bottom: 5px; }
  .view-navigation { gap: 8px; font-size: 9px; }
  .creation-list { --wheel-row-height: 44; height: 132px; flex-basis: 132px; }
  .creation-row { height: 44px; padding: 4px 0; }
  .creation-name { font-size: 14px; }
  .creation-summary { font-size: 10px; -webkit-line-clamp: 1; }
  .creation-row-copy { gap: 2px; }
  .connection-branches { --wheel-row-height: 44; height: 132px; }
  .connection-link { height: 44px; }
  .site-footer > span { display: none; }
  .site-footer { display: none; }
  .conversation-meta { font-size: 8px; gap: 5px; }
  .conversation-controls { gap: 8px; }
  .view-navigation { font-size: 8px; gap: 6px; }
  .reply-line { font-size: 11px; }
  #reply { max-height: 44px; }
}
@media (orientation: landscape) and (max-height: 600px) {
  .site-header { height: 46px; }
  #experience, .view-active #experience { display: block; }
  .hero { position: absolute; top: 3%; left: 5%; margin: 0; max-width: 43%; }
  h1 { font-size: 32px; }
  .companion-scene, .view-active .companion-scene { position: absolute; left: 47%; width: 50%; top: 0; height: 100%; }
  .view-panel, .view-active .view-panel { position: absolute; left: 5%; width: 43%; top: 0; margin: 0; max-height: 100%; }
  body[data-current-view="origin"] .view-panel, body[data-current-view="orbit"] .view-panel { max-height: 100%; }
  .conversation { width: 70%; }
  .site-footer, .companion-activity { display: none; }
  .view-toolbar { flex-wrap: nowrap; margin-bottom: 4px; padding-bottom: 4px; }
  .view-content h2 { font-size: 24px; margin: 4px 0; }
  .creation-list { --wheel-row-height: 36; height: 108px; flex-basis: 108px; margin-top: 2px; }
  .creation-row { height: 36px; padding: 3px 0; }
  .creation-summary { display: none; }
  .connection-branches { --wheel-row-height: 36; height: 108px; }
  .connection-link { height: 36px; padding: 2px 0; }
  .connection-map { margin-top: 4px; }
}

/* Compact page rhythm; lists reserve three rows, prose uses its natural height. */
.edition-number { display: inline; margin-left: 0; }
.view-heading { flex: 0 0 auto; margin-bottom: 12px; }
.view-heading .tiny-label { display: block; font-size: 9px; font-weight: 500; letter-spacing: .14em; line-height: 16px; text-transform: uppercase; }
.view-content .view-heading h2 { font-size: clamp(28px, 2.5vw, 40px); line-height: 1.15; margin: 8px 0 10px; }
.view-content .view-heading p, .view-content .view-heading .view-deck { font-size: 12px; line-height: 1.5; margin: 0; max-width: 100%; }
.view-content--origin .view-heading p, .view-content--orbit .view-heading p { min-height: 36px; }
.view-content > p { margin: 0 0 12px; line-height: 1.65; }
.view-content > .creation-note { margin: 0 0 12px; }
.creation-actions, .creation-detail .creation-actions { margin: 6px 0 0; }
.view-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-shrink: 0; padding-top: 10px; }
.view-footer .view-next, .view-footer .creation-visit { margin: 0; }
.connection-map { margin: 16px 0 0; flex-shrink: 0; }
.connection-link > .connection-creation { margin-left: 0; font-size: 13px; }
.connection-branches.item-wheel { display: block; }
.connection-branches .wheel-track { width: 100%; }
@media (max-width: 1100px) {
 .view-panel, .view-active .view-panel,
 body[data-current-view="origin"] .view-panel, body[data-current-view="orbit"] .view-panel { max-height: 58svh; }
 .view-heading { margin-bottom: 10px; }
 .view-content .view-heading h2 { font-size: 28px; margin: 6px 0 8px; }
 .view-content--origin .view-heading p, .view-content--orbit .view-heading p { min-height: 54px; }
 .creation-list, .connection-branches { --wheel-row-height: 52; height: 156px; flex: 0 0 156px; }
 .creation-row, .connection-link { height: 52px; }
 .creation-list, .connection-map { margin: 4px 0 0; }
 .view-content > p { font-size: 12px; margin-bottom: 10px; }
 .view-content > .creation-note { font-size: 11px; margin-bottom: 8px; }
 .view-footer { padding-top: 6px; }
 .view-footer .creation-visit { padding: 5px 0; }
}
@media (max-width: 600px) {
 .edition-number { font-size: 8px; }
 .view-content .view-heading h2 { font-size: 26px; }
}
@media (max-width: 600px) and (max-height: 700px) {
 .creation-list, .connection-branches { --wheel-row-height: 44; height: 132px; flex-basis: 132px; }
 .creation-row, .connection-link { height: 44px; }
 .view-heading { margin-bottom: 6px; }
 .view-content .view-heading h2 { font-size: 24px; margin: 4px 0 6px; }
 .view-heading .tiny-label { line-height: 14px; }
}
@media (orientation: landscape) and (max-height: 600px) {
 .view-panel, .view-active .view-panel,
 body[data-current-view="origin"] .view-panel, body[data-current-view="orbit"] .view-panel { max-height: 100%; }
 .view-heading { margin-bottom: 6px; }
 .view-content .view-heading h2 { font-size: 24px; margin: 4px 0 6px; }
 .view-content--origin .view-heading p, .view-content--orbit .view-heading p { min-height: 0; }
 .creation-list, .connection-branches { --wheel-row-height: 36; height: 108px; flex-basis: 108px; }
 .creation-row, .connection-link { height: 36px; }
}

@media (orientation: landscape) and (max-height: 600px) {
 .view-content--origin, .view-content--orbit { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); column-gap: 14px; align-items: start; }
 .view-content--origin .view-heading, .view-content--orbit .view-heading { margin: 0; }
 .view-content--origin .view-heading p, .view-content--orbit .view-heading p { font-size: 11px; line-height: 1.35; }
 .view-content--origin .creation-list { margin: 0; }
 .view-content--orbit .connection-map { display: block; margin: 0; }
 .view-content--orbit .connection-root { display: block; font-size: 10px; margin-bottom: 6px; }
 .view-content--origin .creation-category { display: none; }
}

/* Stable scene geometry and a deliberate reading/action rhythm. */
.creation-orbits { visibility: hidden; opacity: 0; transition: opacity .35s ease; }
body.scene-positioned .creation-orbits { visibility: visible; opacity: 1; }
.companion-scene canvas { opacity: 0; transition: opacity .35s ease; }
.companion-scene.scene-ready canvas { opacity: 1; }
.scene-loading { pointer-events: none; }
.view-toolbar { gap: 20px; }
.view-navigation a { position: relative; min-height: 32px; display: inline-flex; align-items: center; }
.view-navigation a[aria-current="page"] { box-shadow: none; }
.view-navigation a[aria-current="page"]::after { content: ''; position: absolute; bottom: 2px; left: 0; width: 100%; height: 5px; border-bottom: 1px solid #758a72; border-radius: 50%; }
.view-navigation a[aria-current="page"]::before { content: ''; width: 3px; height: 3px; border-radius: 50%; background: #758a72; position: absolute; left: -7px; top: 14px; }
.view-content .view-heading { margin-bottom: 20px; }
.view-content > p { margin-bottom: 16px; }
.view-content .view-heading p { line-height: 1.65; }
.view-content--org, .view-content--org + .view-footer { max-width: 480px; }
.view-footer { padding-top: 18px; }
.view-footer a { min-height: 36px; display: inline-flex; align-items: center; }
.view-footer .creation-visit { font-size: 12px; border-bottom-color: #81947370; }
.creation-actions { padding-top: 5px; }
.contact-submit button { min-height: 42px; padding: 9px 16px; border: 1px solid #8b9c8066; border-radius: 6px; background: #ffffff40; }
.contact-form input { min-height: 40px; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 2px solid #6d8666; outline-offset: 4px; }
/* The document has one pixel of root scroll range for native pull-to-refresh.
   All interface regions fit the viewport; long prose scrolls inside its panel. */
html { overflow-x: clip; overflow-y: auto; overscroll-behavior-y: auto; }
body { height: 100svh; min-height: 0; overflow: visible; display: grid; grid-template-rows: auto minmax(0,1fr) auto auto; }
body::after { content: ''; position: absolute; top: 100%; left: 0; width: 1px; height: 1px; pointer-events: none; }
.view-content--org + .view-footer { justify-content: flex-start; gap: 36px; }
@media (max-width: 1100px) and (orientation: portrait), (max-width: 600px) {
 .site-header { height: clamp(54px,9svh,78px); }
 #experience, body.view-active #experience { display: grid; grid-template-columns: minmax(0,1fr); grid-template-rows: auto minmax(0,1fr); padding-bottom: 22px; }
 body.view-active #experience { grid-template-rows: minmax(0,1fr) clamp(84px,23svh,240px); }
 .hero { margin: 14px 7% 8px; }
 h1 { font-size: clamp(32px,6svh,53px); }
 .companion-scene, body.view-active .companion-scene { height: 100%; min-height: 0; width: 100%; }
 .view-panel, body.view-active .view-panel,
 body[data-current-view="origin"] .view-panel, body[data-current-view="orbit"] .view-panel { margin: 8px 7% 0; max-height: calc(100% - 8px); height: calc(100% - 8px); overflow: hidden; padding: 0; }
 .view-content { overflow: auto; }
 .view-content .view-heading { margin-bottom: 12px; }
 .view-content .view-heading h2 { font-size: clamp(23px,3.5svh,29px); margin: 6px 0 8px; }
 .view-content .view-heading p, .view-content > p { font-size: 12px; line-height: 1.55; }
 .view-content > p { margin-bottom: 12px; }
 .view-content--origin .view-heading p, .view-content--orbit .view-heading p { min-height: 0; }
 .view-content--org, .view-content--org + .view-footer { max-width: none; }
 .view-content--org + .view-footer { justify-content: space-between; }
 .view-toolbar { gap: 10px; margin-bottom: 10px; flex-wrap: nowrap; padding-bottom: 6px; flex-shrink: 0; }
 .view-navigation { gap: 16px; }
 .back-link { min-height: 30px; }
 .creation-list, .connection-branches { --wheel-row-height: 48; height: calc(var(--wheel-row-height)*3px); flex-basis: calc(var(--wheel-row-height)*3px); }
 .creation-row, .connection-link { height: calc(var(--wheel-row-height)*1px); }
 .creation-list { max-height: none; }
 .view-footer { padding-top: 6px; }
 .view-footer a { min-height: 28px; }
 .view-footer .creation-visit { padding: 3px 0; }
 .orbit-link { font-size: 9px; gap: 5px; padding: 4px; }
 .orbit-link small { font-size: 6.5px; letter-spacing: .02em; }
 .orbit-link > span:last-child { max-width: 100px; }
 .orbit-link--third > span:last-child, .orbit-link--fourth > span:last-child { max-width: 86px; }
 .companion-activity { bottom: 0; }
 .conversation { margin-top: 3px; }
 .conversation-meta { min-height: 24px; margin: 4px 8px; gap: 8px; }
 .conversation-controls { gap: 12px; }
 .conversation-controls button { min-height: 28px; }
 .site-footer { margin-top: 4px; padding-top: 6px; padding-bottom: max(6px,env(safe-area-inset-bottom)); }
 .reply-line { margin-bottom: 6px; min-height: 26px; }
 #chat-form { min-height: 52px; }
}
@media (max-width:600px) and (max-height:700px){
 .view-content .view-heading p, .view-content > p { font-size: 11px; line-height: 1.45; }
 .view-content .view-heading { margin-bottom: 8px; }
 .view-content .view-heading h2 { margin: 4px 0 6px; }
 .creation-list, .connection-branches { --wheel-row-height: 38; }
 .view-toolbar { margin-bottom: 6px; padding-bottom: 4px; }
 .view-navigation a { min-height: 26px; }
}
@media (max-width: 360px) {
 .view-navigation { gap: 12px; }
 .view-toolbar { gap: 8px; }
 .back-link { font-size: 9px; gap: 5px; }
 .orbit-link > span:last-child { max-width: 96px; }
 .orbit-link { font-size: 9px; }
 .orbit-link small { font-size: 6.5px; }
}
@media (prefers-reduced-motion: reduce) {
 .creation-orbits, .companion-scene canvas { transition: none; }
}

.scene-loading { inset: auto; left: 45%; top: 48%; width: 150px; height: 150px; transform: translate(-50%,-50%); }
body:not(.scene-positioned) .companion-activity { visibility: hidden; }

@media (max-width:600px) and (min-height:701px) and (max-height:800px){
 body.view-active #experience { grid-template-rows: minmax(0,1fr) clamp(96px,19svh,160px); }
}
@media (max-width:600px) and (max-height:700px){
 body.view-active #experience { grid-template-rows: minmax(0,1fr) 90px; }
 .orbit-link small { display: none; }
 .orbit-link { padding: 3px; font-size: 8px; gap: 4px; }
}
@media (orientation:landscape) and (max-height:600px) and (min-width:601px){
 .wordmark { font-size: 20px; }
 .wordmark span { font-size: 8px; margin-top: 3px; }
}

@media (max-width:1100px){
 .creation-list[data-density="compact"] .creation-summary,
 .creation-list[data-density="compact"] .creation-category { display: none; }
 .creation-list[data-density="compact"] .creation-name { font-size: 13px; }
 .creation-list[data-density="compact"] .creation-row { padding: 3px 0; }
 .creation-list[data-density="normal"] .creation-row-copy { gap: 3px; }
}

@media (orientation:landscape) and (max-height:600px) and (min-width:601px){
 .view-content--orbit .connection-map { display: flex; gap: 10px; align-items: center; }
 .view-content--orbit .connection-root { margin: 0; flex-shrink: 0; font-size: 9px; }
 .view-content--orbit .connection-branches { flex: 1; height: calc(var(--wheel-row-height)*3px); }
 .view-content--orbit .connection-link { height: calc(var(--wheel-row-height)*1px); }
}

@media (max-width:1100px){
 .view-content--origin:has(.creation-search) .collection-note { display: none; }
 .view-content--origin .creation-search { padding: 7px 0; min-height: 32px; }
 .view-content--origin .creation-count { font-size: 9px; margin: 4px 0; }
}

@media (max-width:600px) and (max-height:700px){
 .view-content--origin:has(.creation-search) .view-heading { margin-bottom: 6px; }
 .view-content--origin .creation-search { min-height: 26px; padding: 4px 0; font-size: 12px; line-height: 18px; }
 .view-content--origin .creation-count { margin: 2px 0; }
}
