/* V1.4 peripheral editorial fields; the Principles index uses native anchors. */
.edge-rail,.outer-tributaries{display:none}
.principle-index{margin-block:30px 0;border-top:1px solid var(--border);padding-top:18px;font-family:var(--sans)}
.principle-index h2{font:12px/1.5 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0 0 10px}
.principle-index ul{display:flex;flex-wrap:wrap;gap:4px 18px;list-style:none;padding:0;margin:0}
.principle-index a{display:flex;align-items:center;min-height:44px;padding:8px 4px;color:var(--navy);font-size:14px;text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:5px}
.principle-index a:hover{color:var(--gold);text-decoration-thickness:2px}
.principle-index a:focus{outline:3px solid var(--gold);outline-offset:2px;text-decoration-thickness:2px}
.principle-content{min-width:0}
.principle-content>.composition-section[id]{scroll-margin-top:48px}
.principle-content>.composition-section[id]>.composition-heading{position:relative}
.principle-content>.composition-section:target>.composition-heading::after{content:"";position:absolute;left:0;top:-16px;width:64px;height:3px;background:var(--gold)}
@media(min-width:1440px){
 .principles-canvas{display:grid;grid-template-columns:minmax(0,1fr)}
 .principle-content,.principle-index{grid-column:1;grid-row:1}
 .principle-index{position:sticky;top:32px;align-self:start;width:var(--edge-width);margin:75px 0 0 calc(-1 * var(--edge-width) - 38px);max-height:calc(100svh - 64px);overflow:auto;padding:12px 6px 8px;border-color:#8c562b55}
 .principle-index h2{font-size:10px;letter-spacing:.07em}
 .principle-index ul{display:block}
 .principle-index a{font-size:12px}
}
@media(min-width:1440px){
 .without-rail.page-grid>.lower{width:min(1480px,calc(100% - clamp(380px,28vw,600px)));--edge-space:calc((100vw - 100%) / 2);--edge-width:clamp(140px,11vw,260px)}
 .edge-rail{display:block;position:absolute;width:var(--edge-width);top:120px;pointer-events:none;color:#766653;font:12px/1.65 var(--sans);letter-spacing:.035em}
 .edge-left{right:calc(100% + 38px)}.edge-right{left:calc(100% + 38px)}
 .edge-drawing{display:block;fill:none;stroke:#8c562b;stroke-width:1;opacity:.34;width:100%;height:auto;overflow:visible}
 .edge-drawing circle{fill:var(--ivory)}.edge-drawing .edge-person{fill:#8c562b}.edge-drawing .edge-clear{stroke-width:2;stroke:#285d80}.edge-open{stroke-dasharray:3 8}
 .edge-label{display:block;margin:20px 0;text-wrap:balance;max-width:23ch}
 .learning-trail{top:95px}.learning-trail .edge-drawing{position:absolute;inset:0}.learning-markers{position:relative;padding-top:10px}.learning-markers .edge-label{font-size:10px;text-transform:uppercase;letter-spacing:.12em;margin:0 0 53px;padding-left:15px}.learning-markers .edge-label:nth-child(n+3){padding-left:35px}
 .trail-extension{top:46%}.family-traces{top:180px}.family-traces .edge-drawing{position:absolute;top:-18px;left:-12px;opacity:.2}.family-traces .edge-label{position:relative;padding-left:25px;margin:35px 0;font-size:11px}
 .home-begin>.landmark{grid-column:1/-1;padding-block:30px}.home-begin>.landmark p:first-child{font-size:clamp(48px,4.3vw,74px);max-width:27ch}
 .home-opening>.editorial-map{width:calc(100% + var(--edge-width));margin-left:calc(-1 * var(--edge-width));max-width:none}
 .composition-section,.river-reach,.notebook-zone{isolation:isolate}
 .home-begin::before,.aim-clarity::before,.principle-humanity::before,.zone-1::before,.reach-2::before{content:"";position:absolute;z-index:-2;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent,#e8e5dd70 18%,#e8e5dd70 80%,transparent)}
 .aim-clarity::before{background:linear-gradient(180deg,transparent,#e4e9e740 20%,#e4e9e740 80%,transparent)}
 .aim-usefulness>.question-field{grid-column:1/-1;width:calc(100% + 2 * var(--edge-width) + 76px);margin-left:calc(-1 * var(--edge-width) - 38px);grid-template-columns:repeat(4,minmax(0,1fr));gap:38px}
 .aim-usefulness>.question-field p{font-size:23px;line-height:1.4;grid-column:auto;max-width:20ch;border-color:#8c562b40}.aim-usefulness>.question-field p:nth-child(2){margin-top:40px}.aim-usefulness>.question-field p:nth-child(3){margin-top:80px}.aim-usefulness>.question-field p:nth-child(4){margin-top:120px;justify-self:end}
 .principle-symbol{top:180px}.principle-symbol .edge-label{font-size:10px;text-transform:uppercase}.principle-next-person .edge-drawing{transform:scaleX(-1)}
 .notebook-canvas{padding-inline:0;background:linear-gradient(90deg,transparent 49.9%,#8c562b10 50%,transparent 50.1%)}
 .notebook-left{top:210px;transform:rotate(-2deg);right:calc(100% + 25px)}.notebook-right{top:115px;transform:rotate(2deg);left:calc(100% + 25px)}.notebook-zone>.edge-rail{width:clamp(130px,10vw,240px)}.edge-note{display:block;font:italic 20px/1.45 Georgia,serif;letter-spacing:0;color:#766653;max-width:15ch}.edge-circled{border:1px solid #8c562b66;border-radius:50%;padding:24px 12px;transform:rotate(-8deg)}.edge-strike{text-decoration:line-through;text-decoration-color:#8c562b80}
 .notebook-left .edge-drawing{margin-bottom:-40px}.notebook-right .edge-drawing{margin-top:30px}.notebook-sketch{transform:rotate(.8deg);position:relative}.zone-1 .notebook-sketch,.zone-3 .notebook-sketch{transform:rotate(-1deg);margin-left:-35px}.zone-0 .notebook-sketch,.zone-2 .notebook-sketch{margin-right:-30px}.notebook-sketch .pencil-trail{width:calc(100% + 70px);max-width:none}.zone-3 .notebook-right{top:65%}.zone-1 .notebook-right .edge-drawing{height:120px;transform:rotate(45deg)}.zone-2 .notebook-left .edge-drawing{height:150px}.zone-3 .notebook-right .edge-drawing{display:none}
 .outer-tributaries{display:block;stroke:#285d80;stroke-width:1.25;opacity:.35}.outer-tributaries .failed-end{stroke:#8c562b;stroke-width:2}.outer-tributaries .rejoining{stroke-dasharray:2 7;opacity:.5}
 .tributary-words{top:180px}.tributary-words .edge-label{font-size:10px;text-transform:uppercase;letter-spacing:.13em;margin-block:45px}.reach-2 .tributary-words{top:100px}.reach-2 .tributary-words .edge-label:nth-child(2n){margin-left:25px}.reach-2 .composition-heading{grid-column:1/-1}.reach-2 .composition-heading h2{max-width:28ch;font-size:clamp(55px,4.1vw,74px)}.reach-4 .tributary-words{top:27%}.reach-4 .tributary-words .edge-label+ .edge-label{margin-top:240px}
}
/* Mid-size screens retain only the existing central marks. Mobile inherits V1.3. */
@media(min-width:1024px) and (max-width:1439px){.editorial-map{opacity:.5}.river-branch{opacity:.2}}
@media(prefers-reduced-motion:reduce){.edge-rail,.edge-drawing,.outer-tributaries{animation:none;transition:none}}