/* A calmer, legible map. Node heights are measured before drawing connections. */
nav{background:#f0edfa;border-color:#e1daef}nav a{color:#61596f}nav a.active{color:#6554c0}.local-label{color:#6554c0;background:#f0edfa;border-color:#d9d1eb}.workspace-meta strong{color:#6554c0}.workspace-meta .dot{background:#e9785b}.card-body p{font-size:15px;line-height:1.6}.card-bottom{font-size:11px;color:#696573}.paper>p,.section-note p{font-size:16px;line-height:1.6}.sticky p{font-size:15px;line-height:1.6}.source-line{font-size:13px}.source-card .fine{font-size:12px}.eyebrow{font-size:11px;letter-spacing:1.2px}.node.dim{opacity:.16;pointer-events:none}.board-cover{height:180px;background:#f9f8f3}.atlas-diagram{padding:18px;height:100%;background-image:radial-gradient(#d8d2df .7px,transparent .7px);background-size:14px 14px}.mini-kicker{display:block;font-size:8px;letter-spacing:1px;text-transform:uppercase;color:#726887}.atlas-diagram>b{font:700 16px var(--head);display:block;margin:12px 0;color:#39323f}.mini-nodes{display:flex;gap:12px;align-items:center}.mini-nodes>span{position:relative;flex:1;background:#fffefa;border:1px solid #dbd6e5;font-size:8px;line-height:1.3;border-radius:4px;padding:10px 4px;text-align:center}.mini-nodes>span+span:before{content:'→';position:absolute;left:-11px;color:#a89ab8}.mini-nodes .selected{background:#f0edfa;border-color:#6554c0;color:#514290}.atlas-diagram>i{display:block;font:20px 'Caveat',cursive;color:#b56954;margin-top:12px}.search-trigger,.rail button,.zoom button{min-height:44px}.frame-trigger{min-height:44px}.branch h2{line-height:1.25}.board-head p{font-size:17px}.bottom-note{font-size:12px}.reading .board-card{width:100%!important}.reading .board-cover{height:200px}.reading .atlas-diagram{padding:24px}.reading .mini-nodes{max-width:520px}.reading .mini-nodes>span{font-size:13px}.reading .atlas-diagram>b{font-size:22px}
@media(max-width:600px){.card-body p{font-size:16px}.node.dim{display:none}.workspace-meta{top:137px}.frame-trigger{top:127px}.canvas-window{padding-top:190px}.board-dock .dock-label{display:none}.card-body h3{font-size:24px}.branch{font-size:21px}.bottom-note>div{flex-wrap:wrap;gap:14px}.reading .canvas-window{padding-top:190px}.atlas-diagram>b{font-size:19px}.mini-nodes>span{font-size:10px}}

/* ── Legibility floor (audit 2026-10-06). Labels were 8-11px in greys near 3:1 on paper.
   Nothing here is under 12px except the miniature board diagrams, and every colour clears 4.5:1. ── */
#app .eyebrow{font-size:12px;color:#566050}
#app .sticky .eyebrow{color:#62531f}
#app .manifesto .eyebrow,#app .manifesto .meta-row{color:#e9e6f6}
#app .manifesto .meta-row{font-size:12px}
#app .mini-kicker{font-size:10px;letter-spacing:.6px;color:#544c69}
#app .mini-nodes span{font-size:10px}
#app .card-bottom{font-size:12.5px;color:#55515f}
#app .workspace-meta,#app .workspace-meta span,#app .workspace-meta strong{font-size:12.5px}
#app .workspace-meta span{color:#545d73}
#app .hint{padding:4px 8px;border-radius:6px;background:#f5f5efe6;font-size:12px;color:#566050}
#app .board-dock a{font-size:13px}
#app .board-dock .dock-label{font-size:11.5px;color:#566050}
#app .source-card .fine{font-size:12.5px;color:#5f655d}
#app .bottom-note,#app .bottom-note a,#app .bottom-note>span{font-size:13px;color:#565c54}
#app .portrait p{color:#5f655d}
#app .network-person .number,#app .workflow-row span{font-size:12px;color:#5f655d}
#app .filters button{font-size:12.5px}
#app .atlas-diagram i{color:#9a4a34}
#app .branch span{font-size:12px}
#app .timeline-row span{font-size:12.5px;color:#5f655d}
#app .zoom output{font-size:12.5px}
#app .frame-trigger{font-size:13px}
#app .filter-status,#app [aria-live] {font-size:12.5px}
/* The map is scaled to the window. With 90px gutters it fell to 59% on a 1040px laptop window (16px text
   drawn at 9px); narrow gutters keep it at 69% there and 97% at 1440. */
@media (min-width:601px){#app .canvas-window{padding-left:24px;padding-right:24px}}
/* the "scroll to explore" line sat on top of the cards and the board dock on anything but a wide screen */
body.reading #app .hint{display:none}
@media (max-width:1280px){#app .hint{display:none}}
/* the search phrase is the H1's first line, set as the eyebrow label */
#app h1:has(> .eyebrow){margin-top:0}
#app h1 > .eyebrow{margin-bottom:22px;font-family:var(--body);font-weight:700;line-height:1.3;letter-spacing:1.2px}