/* Editorial blocks extend the existing light design without changing shared UI. */
.content-block{max-width:1130px;margin:0 auto;padding:78px 30px;border-top:1px solid #ded9df;display:grid;gap:30px 64px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.content-block>*{min-width:0}.content-kicker{font-size:.875rem;line-height:1.4;color:#9c0043;margin-bottom:17px}
.content-block h2{font-size:clamp(1.85rem,2.75vw,2.45rem);line-height:1.2;letter-spacing:-.035em;text-wrap:balance}
.content-intro,.content-notes p{font-size:1rem;line-height:1.7;color:#59515f;text-wrap:pretty}
.content-notes{display:grid;gap:25px}.content-notes h3{font-size:1.125rem;line-height:1.35;letter-spacing:-.015em;color:#2e2735;margin-bottom:10px}
.content-visual{align-self:center}.content-visual figcaption{font-size:.8125rem;line-height:1.6;color:#68606d;margin-top:14px;max-width:720px}
.content-diagram{padding:30px;background:#eeebef;border:1px solid #d9d3dd;border-radius:16px;color:#38303e;overflow:hidden;display:grid;gap:22px}
.content-diagram strong{font-size:1rem;line-height:1.45;font-weight:500}.diagram-label{display:block;font-size:.8125rem;color:#675b6d;line-height:1.5;margin-bottom:12px}
.diagram-cell{background:#fff;border:1px solid #d9d3dd;padding:19px;border-radius:8px;min-width:0}.diagram-cell .diagram-label{margin-bottom:8px}.diagram-cell strong{display:block}
.diagram-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.diagram-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.content-diagram .rose{background:#f4e2eb;border-color:#d8a9bf;color:#832449}.content-diagram .teal{background:#e4eeeb;border-color:#b5ccc4;color:#24594b}
.diagram-chips{display:flex;flex-wrap:wrap;gap:8px}.diagram-chips span{border:1px solid #cbbac8;border-radius:999px;padding:7px 13px;font-size:.875rem;line-height:1.4;background:#f9f6f8;color:#753153}
.diagram-equation{display:grid;gap:10px}.diagram-equation .diagram-cell{border-left:3px solid #b92360}
.diagram-note{font-size:.875rem;line-height:1.6;color:#65596c}.diagram-flow{display:flex;gap:0}.diagram-step{flex:1;min-width:0;padding:0 18px 0 0;position:relative;border-top:1px solid #bdb0c4}.diagram-step:last-child{padding-right:0}.diagram-index{display:block;color:#a61b52;font-size:.8125rem;margin:13px 0 8px}.diagram-step:before{content:'';height:7px;width:7px;border-radius:50%;background:#a61b52;position:absolute;top:-4px;left:0}
.diagram-row{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:16px;padding:16px 0;border-bottom:1px solid #d9d1dd;align-items:start;font-size:.875rem;line-height:1.55}.diagram-row:last-child{border-bottom:0}.diagram-row>span{color:#6b5e71}.diagram-row strong{font-size:.9375rem}.diagram-row.rose,.diagram-row.teal{padding:16px 12px;border-radius:6px}
.diagram-sheet{background:#fff;border:1px solid #d9d3dd;border-radius:8px;padding:22px;min-width:0}.diagram-sheet>.diagram-label{color:#9c0043}.diagram-sheet .diagram-row{grid-template-columns:1fr;gap:3px}
.diagram-lane{display:grid;gap:8px}.diagram-lane>.diagram-label{margin:0}.diagram-lane>div{display:flex;gap:6px;min-height:47px}.lane-segment{background:#e2dce6;border:1px solid #cfc4d5;border-radius:5px;flex:1;min-width:0;font-size:.875rem;line-height:1.4;padding:12px;text-align:center;align-content:center}.lane-segment.quiet{background:#f8f6f8;color:#716478;border-style:dashed}.lane-segment.empty{background:#fff;border-color:#e0dce2;color:#786a80}.lane-segment.striped{background:repeating-linear-gradient(135deg,#e9d6df,#e9d6df 6px,#f2e7ec 6px,#f2e7ec 12px);color:#713249}
.diagram-wave{width:100%;height:auto;max-height:80px;display:block;overflow:visible;color:#b11a56}.diagram-wave path{stroke:currentColor;stroke-width:2.4;stroke-linecap:round}.diagram-wave.gray{color:#827189}.diagram-wave.teal{color:#2b7a66;background:none;border:0}.diagram-curve{display:block;width:100%;max-height:82px}.diagram-curve path{fill:none;stroke:#a93666;stroke-width:2}
.diagram-priority{display:flex;align-items:center;gap:20px;font-size:.875rem}.diagram-priority i{height:1px;background:#b7a8bf;flex:1}.diagram-priority span:first-child{color:#95244f}
.diagram-quote,.diagram-rewrite{padding:22px;border-radius:8px;background:#fff}.diagram-quote p,.diagram-rewrite p{font-size:1.15rem;line-height:1.65}.diagram-quote p{color:#766c7b}.diagram-rewrite{border-left:3px solid #ab1f58}.diagram-rewrite em{font-style:normal;color:#96234f}
.diagram-filetree{display:grid;gap:18px}.diagram-filetree>.diagram-cell{border-bottom:3px solid #b62760}.diagram-orbit{border-left:2px solid #cdb8c7;padding-left:23px}.diagram-center{display:inline-block;background:#fff;padding:13px 18px;border:1px solid #d4cbd9;border-radius:999px;margin-bottom:10px;font-size:1rem}
.diagram-junction{display:flex;align-items:center;gap:12px;color:#94254f;font-size:.9375rem}.diagram-junction i{height:1px;flex:1;background:#c2adbc}.diagram-passport{background:#fff;border-radius:10px;padding:24px}.passport-header{display:flex;align-items:center;gap:22px;border-bottom:1px solid #d6cfd9;padding-bottom:20px;margin-bottom:4px}.passport-header>span:last-child{font-size:.875rem;color:#6a6070}.diagram-filetype{font-size:2rem;letter-spacing:-.04em;color:#9c0043}
.diagram-bars{display:grid;gap:24px}.diagram-bars>div{display:grid;grid-template-columns:105px minmax(0,1fr) 100px;gap:20px;align-items:center;font-size:.875rem}.diagram-bars i{display:block;background:#b32860;width:var(--amount);height:28px;border-radius:3px}.diagram-bars>div:nth-child(2) i{background:#75607f}.channel-pair{display:grid;grid-template-columns:14px minmax(0,1fr);align-items:center;gap:6px;font-size:.875rem}.diagram-scriptline{font-size:1.7rem;line-height:1.3;letter-spacing:-.025em;padding:10px 0 18px;border-bottom:1px solid #d4c9d7}
.tone-lines{height:72px;display:flex;flex-direction:column;justify-content:center;gap:10px}.tone-lines i{height:2px;background:#b13463;width:65%}.tone-lines i:nth-child(2){width:45%}.tone-lines i:nth-child(3){width:85%}.tempo-dots{height:72px;font-size:1rem;line-height:2;color:#7d598c}.diagram-grid.three .diagram-cell .diagram-wave{height:72px}
.stereo-center{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:24px 0;font-size:1.2rem}.stereo-center em{font-size:.9375rem;font-style:normal;padding:18px 13px;background:#f4e2eb;border-radius:50%;color:#8e3458}.diagram-editions{display:grid;gap:12px}.diagram-editions>.diagram-cell:nth-child(2){margin-left:18px}.diagram-editions>.diagram-cell:nth-child(3){margin-left:36px}.diagram-seams{display:flex;justify-content:space-evenly;gap:20px;color:#912452;font-size:.875rem;text-align:center}
.content-split{grid-template-areas:'head visual' 'intro visual' 'notes visual'}.content-split .content-heading{grid-area:head}.content-split .content-intro{grid-area:intro}.content-split .content-visual{grid-area:visual}.content-split .content-notes{grid-area:notes}
.content-band{grid-template-columns:1fr 1fr}.content-band .content-intro{align-self:end}.content-band .content-visual,.content-band .content-notes{grid-column:1/-1}.content-band .content-notes{grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}.content-band .content-diagram{padding:32px 38px}
.content-compare .content-intro{align-self:end}.content-compare .content-visual,.content-compare .content-notes{grid-column:1/-1}.content-compare .content-notes{grid-template-columns:repeat(2,minmax(0,1fr));gap:44px}.content-compare .content-diagram{background:transparent;padding:0;border:0;border-radius:0}.content-compare .content-diagram>.diagram-grid{gap:24px}.content-compare .diagram-sheet,.content-compare .diagram-quote{background:#eeebef}.content-compare .diagram-rewrite{background:#f4e7ed}
.content-editorial{grid-template-areas:'head head' 'intro notes' 'visual notes';grid-template-rows:auto auto 1fr}.content-editorial .content-heading{grid-area:head;max-width:750px}.content-editorial .content-intro{grid-area:intro}.content-editorial .content-visual{grid-area:visual;align-self:start}.content-editorial .content-notes{grid-area:notes;border-left:1px solid #d9d1dd;padding-left:38px;align-content:start}.content-editorial .content-notes>div+div{border-top:1px solid #dfd8e2;padding-top:24px}
/* One entrance per diagram: no perpetual movement or hidden editorial text. */
@media(prefers-reduced-motion:no-preference){
 .content-block.motion-ready[data-motion=clip] .content-diagram{clip-path:inset(0 0 0 100%);transition:clip-path .75s cubic-bezier(.22,1,.36,1)}
 .content-block.motion-ready[data-motion=clip].is-seen .content-diagram{clip-path:inset(0)}
 .content-block.motion-ready[data-motion=shift] .content-diagram>*{opacity:0;transform:translateX(-16px);transition:opacity .5s ease,transform .65s cubic-bezier(.22,1,.36,1)}
 .content-block.motion-ready[data-motion=shift].is-seen .content-diagram>*{opacity:1;transform:none}
 .content-block.motion-ready[data-motion=stagger] .content-diagram>*{opacity:0;transform:scale(.98);transition:opacity .45s ease,transform .6s ease;transition-delay:calc(var(--part,0)*90ms)}
 .content-block.motion-ready[data-motion=stagger].is-seen .content-diagram>*{opacity:1;transform:none}
 .content-block.motion-ready[data-motion=trace] .content-diagram{opacity:.3;transition:opacity .6s ease}
 .content-block.motion-ready[data-motion=trace].is-seen .content-diagram{opacity:1}
 .content-block.motion-ready[data-motion=trace].is-seen .diagram-wave path,.content-block.motion-ready[data-motion=trace].is-seen .diagram-curve path{animation:content-draw .85s ease-out both}
 .content-block.motion-ready[data-motion=trace].is-seen .diagram-bars i,.content-block.motion-ready[data-motion=trace].is-seen .lane-segment{animation:content-span .65s cubic-bezier(.22,1,.36,1) both;transform-origin:left}
 @keyframes content-draw{from{stroke-dasharray:1;stroke-dashoffset:1}to{stroke-dasharray:1;stroke-dashoffset:0}}
 @keyframes content-span{from{transform:scaleX(.92);opacity:.4}to{transform:scaleX(1);opacity:1}}
}
@media(max-width:1024px){.content-block{gap:25px 36px;padding:64px 36px}.content-diagram{padding:24px}.content-editorial .content-notes{padding-left:28px}.content-band .content-diagram{padding:28px}.diagram-grid.three{gap:10px}.diagram-cell{padding:16px}}
@media(max-width:768px){.content-block{padding:58px 30px;column-gap:26px}.content-block h2{font-size:1.85rem}.content-split{grid-template-areas:'head head' 'intro visual' 'notes notes'}.content-split .content-notes{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.content-split .content-notes>div:last-child:nth-child(3){grid-column:1/-1}.content-diagram{padding:20px}.diagram-grid:not(.three){gap:10px}.diagram-row{gap:10px}.content-editorial{grid-template-columns:.9fr 1.1fr}.content-editorial .content-notes{padding-left:22px}.diagram-sheet{padding:18px}.content-compare .content-notes{gap:26px}.diagram-bars>div{gap:16px}}
@media(max-width:650px){.content-block{display:flex;flex-direction:column;padding:52px 24px;gap:24px}.content-block h2{font-size:1.8rem}.content-kicker{margin-bottom:14px}.content-visual{width:100%;order:0}.content-diagram{padding:20px;gap:20px;border-radius:12px}.content-notes,.content-split .content-notes,.content-band .content-notes,.content-compare .content-notes{display:grid;grid-template-columns:1fr;gap:24px}.content-editorial .content-notes{border:0;padding:0}.content-band .content-diagram{padding:22px}.content-visual figcaption{font-size:.8125rem}.diagram-grid.three{grid-template-columns:1fr}.diagram-grid:not(.three){grid-template-columns:1fr}.diagram-grid.three .diagram-cell{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1fr);gap:8px 18px;align-items:center}.diagram-grid.three .diagram-label{margin:0}.diagram-grid.three .diagram-cell:has(.diagram-wave),.diagram-grid.three .diagram-cell:has(.tone-lines),.diagram-grid.three .diagram-cell:has(.tempo-dots){display:block}.diagram-sheet{padding:20px}.diagram-flow{flex-direction:column;gap:0}.diagram-step{border-top:0;border-left:1px solid #bdb0c4;padding:0 0 22px 20px;display:flex;gap:14px;align-items:baseline}.diagram-step:last-child{padding-bottom:0}.diagram-step:before{top:7px;left:-4px}.diagram-index{margin:0}.diagram-step strong{font-size:.9375rem}.diagram-bars>div{grid-template-columns:1fr 1fr;gap:10px}.diagram-bars i{grid-column:1/-1;grid-row:2}.diagram-bars strong{text-align:right;font-size:.9375rem}.diagram-row{grid-template-columns:1fr;gap:4px}.diagram-lane>div{gap:4px}.lane-segment{padding:10px 6px;font-size:.8125rem;overflow-wrap:break-word}.diagram-seams{font-size:.8125rem;gap:10px}.diagram-passport{padding:18px}.passport-header{gap:16px}.diagram-filetype{font-size:1.8rem}.content-compare .content-diagram>.diagram-grid{gap:16px}.diagram-quote,.diagram-rewrite{padding:22px}.diagram-quote p,.diagram-rewrite p{font-size:1.0625rem}.diagram-priority{gap:12px}.diagram-editions>.diagram-cell:nth-child(2){margin-left:10px}.diagram-editions>.diagram-cell:nth-child(3){margin-left:20px}.diagram-scriptline{font-size:1.4rem}}
@media(max-width:359px){.content-block{padding:46px 18px}.content-block h2{font-size:1.7rem}.content-diagram,.content-band .content-diagram{padding:17px}.diagram-cell{padding:15px}.diagram-chips span{font-size:.8125rem;padding:6px 10px}.diagram-quote,.diagram-rewrite{padding:18px}.diagram-grid.three .diagram-cell{grid-template-columns:1fr}.diagram-seams{flex-direction:column;gap:5px}}
@media(max-width:1024px){.content-editorial .diagram-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.content-block .content-diagram,.content-block .content-diagram *{opacity:1;transform:none;clip-path:none;animation:none!important;transition:none!important}}
@media print{.content-block .content-diagram,.content-block .content-diagram *{opacity:1!important;transform:none!important;clip-path:none!important;animation:none!important;transition:none!important}.content-block{break-inside:avoid}}
