/* Paired, prescribed field experiments. Colors match the reference matrix. */
.jump-link{display:inline-block;margin:0 0 6px;font-weight:600;text-decoration-thickness:1px}
.example-lab{margin-top:44px;border-top:1px solid var(--line);padding-top:32px;scroll-margin-top:20px}
.example-lab h2{font-size:clamp(27px,3.5vw,38px);margin:8px 0 14px}
.example-lab .lab-intro{color:var(--muted);max-width:78ch;margin:0 0 22px}
.scene-nav{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:26px}
.scene-nav button{flex:1 1 125px;min-height:50px;text-align:left;padding:10px 14px;white-space:nowrap}
.scene-nav button[aria-pressed=true]{background:var(--capbg)}
.scene-header{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:end}
.scene-header h3{font-size:29px;margin:5px 0 10px}.scene-header p{margin:0;max-width:74ch}
.scene-number{font:14px ui-monospace,monospace;color:var(--muted)}
.change-strip{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:18px 0;margin:20px 0 8px;border-block:1px solid var(--line);font-size:15px}
.change-strip p{margin:4px 0 0}.change-strip strong{font-size:15px;font-weight:600}
.change-label{color:var(--electric)}
.worlds{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;margin-top:18px}
.world{min-width:0}.world-header{display:flex;gap:12px;align-items:baseline}.world-letter{font:24px Georgia,serif;color:var(--muted)}.world h4{font-size:18px;font-weight:600;margin:0}
.world-stage{background:#f3f2eb;border:1px solid #2026220c;border-radius:9px;margin:12px 0;overflow:hidden}
.world-stage svg{width:100%;height:auto;display:block;aspect-ratio:500/285}
.world-stage svg text{font:16px system-ui,sans-serif;fill:var(--ink)}
.world-stage svg .label-small{font-size:14px;fill:var(--muted)}
.world-stage svg .field{stroke:var(--electric);stroke-width:2.2;fill:none}
.world-stage svg .field-b{stroke:var(--magnetic);stroke-width:2;fill:none}
.world-stage svg .field-q{stroke:var(--capacity);stroke-width:2;fill:none}
.world-stage svg .solid{stroke:var(--ink);stroke-width:2.5;fill:none;stroke-linecap:round;stroke-linejoin:round}
.world-stage svg .needle{fill:var(--magnetic)}
.world-stage svg .ghost{opacity:.24;stroke-dasharray:6 5}
.world-stage svg [data-sample]{cursor:pointer}
.world-stage svg [data-sample]:focus-visible{outline:2px solid #1679ad;outline-offset:4px}
.world-stage svg .sample-dot{fill:var(--paper);stroke:var(--ink);stroke-width:2}
.world-stage svg .selected .sample-dot{fill:var(--ink)}
.sample-controls{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:20px;font-size:15px}
.sample-controls .sample-label{flex:1 0 100%;color:var(--muted)}
.sample-controls button{padding:8px 12px;min-height:44px}.sample-controls button[aria-pressed=true]{background:#20262209}
.reading-header{display:flex;align-items:baseline;justify-content:space-between;gap:10px;font-size:14px;color:var(--muted);margin:18px 0 8px}
.reading-header p{margin:0}.reading-location{font-weight:600;color:var(--ink)}
.numeric-matrix{position:relative;display:grid;grid-template-columns:18px repeat(4,minmax(0,1fr));gap:5px;font-variant-numeric:tabular-nums}
.numeric-matrix .axis{font-size:13px;height:20px}.numeric-cell{min-height:48px;padding:10px 0;text-align:center;font:19px Georgia,serif;border-radius:3px;background:#20262205;color:var(--muted);align-content:center}
.numeric-cell.cap{background:var(--capbg);color:var(--capacity)}.numeric-cell.elec{background:var(--elecbg);color:var(--electric)}.numeric-cell.mag{background:var(--magbg);color:var(--magnetic)}
.numeric-cell.changed{outline:2px solid currentColor;outline-offset:-2px;position:relative}.numeric-cell.changed:after{content:'•';position:absolute;top:-3px;right:4px;font:12px system-ui}
.reading-note{font-size:14px;color:var(--muted);min-height:25px;overflow-wrap:anywhere;margin:10px 0 0}
.diff-legend{font-size:14px;color:var(--muted);margin:12px 0 20px}.diff-symbol{display:inline-block;width:13px;height:13px;border:2px solid var(--electric);border-radius:2px;vertical-align:-1px;margin-right:4px}
.outcome{border-top:3px solid var(--capacity);padding-top:14px}.outcome h4{font-size:21px;margin:0 0 10px;font-weight:600}.outcome p{margin:0}
.takeaway{font-size:20px;max-width:76ch;margin:22px 0;padding:16px 20px;background:var(--capbg);border-radius:6px}
.story-method{margin:24px 0 0;border-block:1px solid var(--line);padding:15px 0}.story-method summary{cursor:pointer;font-size:15px;font-weight:600}.story-method p,.story-method li{font-size:15px}.story-method ul{padding-left:22px}
.story-method .method-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}.method-grid h4{font-size:16px;margin:20px 0 5px}.method-grid p{margin:5px 0}
.prediction{font-size:16px;border-left:3px solid var(--magnetic);padding:4px 0 4px 16px;margin:22px 0 0}
.reference-notes{margin-top:42px;border-top:1px solid var(--line);padding-top:22px}.reference-notes>summary{cursor:pointer;font-size:22px;font-weight:600}
[hidden]{display:none!important}
@media(max-width:760px){.example-lab{margin-top:30px;padding-top:26px}.scene-header{grid-template-columns:1fr}.scene-header h3{font-size:26px}.change-strip,.worlds,.story-method .method-grid{grid-template-columns:1fr;gap:22px}.change-strip{gap:10px}.worlds{gap:30px}.scene-nav{gap:7px}.scene-nav button{flex:1 1 130px;font-size:16px}.change-strip,.change-strip strong,.reading-header,.reading-note,.diff-legend,.sample-controls,.story-method summary,.story-method p,.story-method li{font-size:16px}.numeric-cell{font-size:20px}.sample-controls button{min-height:48px}.reading-header{align-items:start;flex-direction:column;gap:2px}.takeaway{font-size:19px}.world h4{font-size:20px}.outcome h4{font-size:22px}.method-grid h4{margin-top:8px}}
@media print{.example-lab{break-before:page;margin-top:0}.scene-nav,.sample-controls{display:none}.worlds{grid-template-columns:1fr 1fr;gap:18px}.numeric-cell{min-height:30px;padding:6px 0;font-size:15px}.scene-header h3{font-size:23px}.world-stage{break-inside:avoid}.change-strip{font-size:11px}.reference-notes{display:none}.example-lab h2{font-size:26px}.reading-note,.reading-header,.diff-legend,.story-method summary,.story-method p{font-size:11px}}

.world-stage svg .sample-ring{fill:transparent;stroke:var(--muted);stroke-width:1.5;stroke-dasharray:3 3}.world-stage svg .selected .sample-ring{stroke:var(--ink);stroke-width:2.5;stroke-dasharray:none}

/* Each story places physical cause before its numerical comparison. */
.causal-story{margin:24px 0 26px;padding:20px 0;border-top:1px solid var(--line)}
.cause-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}
.cause-grid article{min-width:0}.cause-grid h4{font-size:20px;font-weight:600;margin:16px 0 10px;letter-spacing:-.02em}.cause-grid p{font-size:16px;margin:0}
.cause-grid .world-stage{margin:0}.cause-bridge{font-size:17px;max-width:90ch;margin:24px 0 0}
.world-stage svg .pressure-top{stroke-width:4.5}.world-stage svg .pressure-bottom{stroke-width:2.5}
.world-stage svg .equal-push .pressure-top{stroke-width:2.5}
@media(max-width:760px){.cause-grid{grid-template-columns:1fr;gap:26px}.cause-grid .world-stage{max-width:420px}.cause-grid h4{font-size:22px}.cause-grid p{font-size:17px}}
@media print{.cause-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.cause-grid h4{font-size:14px}.cause-grid p,.cause-bridge{font-size:11px}.causal-story{break-inside:avoid}}

.cause-grid .world-stage svg text{font-size:22px}.cause-grid .world-stage svg .label-small{font-size:18px}

/* Hue identifies the tensor sector; light/dark identifies the entry's sign. */
.cell.cap[data-sign="negative"],.numeric-cell.cap[data-sign="negative"]{background:var(--capacity);color:var(--capbg)}
.cell.elec[data-sign="negative"],.numeric-cell.elec[data-sign="negative"]{background:var(--electric);color:var(--elecbg)}
.cell.mag[data-sign="negative"],.numeric-cell.mag[data-sign="negative"]{background:var(--magnetic);color:var(--magbg)}
.numeric-cell[data-sign="zero"]{background:#20262205;color:var(--muted)}
.numeric-cell.long-value{font-size:16px}
.sign-reference{margin:12px 0 0}
.sign-key{display:flex;flex-wrap:wrap;gap:10px 22px;margin:14px 0 22px;font-size:14px;color:var(--muted)}
.sign-key>span{display:flex;align-items:center;gap:7px}
.sign-swatch{display:inline-grid;place-items:center;width:25px;height:25px;border-radius:3px;font-weight:600}
.sign-positive{background:var(--capbg);color:var(--capacity)}.sign-negative{background:var(--capacity);color:var(--capbg)}.sign-zero{background:#20262205;color:var(--muted)}
@media(max-width:760px){.sign-key{font-size:16px}}

.world-stage svg .elapsed{font-size:48px;font-variant-numeric:tabular-nums;fill:var(--capacity)}
@media screen and (min-width:621px) and (max-width:1040px){.cause-grid{grid-template-columns:1fr;gap:24px}.cause-grid article{display:grid;grid-template-columns:minmax(240px,1fr) 1.3fr;column-gap:24px;align-items:center}.cause-grid .world-stage{grid-row:span 2;max-width:none}.cause-grid h4{margin:0 0 10px}.cause-grid p{font-size:17px}}

/* Follow the field from source charge to direction, then compare matrix jobs. */
.guide-links{display:flex;flex-wrap:wrap;gap:10px 24px;margin:36px 0 0;padding-top:22px;border-top:1px solid var(--line);font-size:16px}
.concept-guide{margin-top:44px;padding-top:28px;border-top:1px solid var(--line);scroll-margin-top:20px}
.concept-guide h2{font-size:clamp(27px,3.5vw,36px);line-height:1.2;max-width:35ch;margin:10px 0 20px}
.concept-guide h3{font-size:23px;line-height:1.3;margin:26px 0 12px}.concept-guide>p{max-width:90ch}
.explain-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px;align-items:start;margin:24px 0}.explain-pair>div,.explain-pair>article{min-width:0}.explain-pair h3{margin-top:0}.explain-pair p{margin-top:0}
.quantity-key{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:25px 0 32px}.quantity-key p{margin:0;padding:12px 0;border-top:3px solid var(--electric);font-size:16px}.quantity-key strong{display:block;margin-bottom:7px;font-size:18px}
.quantity-key p:first-child{border-color:var(--ink)}.quantity-key p:last-child{border-color:var(--capacity)}
.demo-controls{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0}.demo-controls button{min-height:46px;padding:10px 14px;font-size:16px}.demo-controls button[aria-pressed=true]{background:var(--elecbg);border-color:var(--electric)}
.vector-demo .world-stage{margin-top:0}.world-stage svg .electric-vector{stroke-width:5}
.concept-guide .world-stage svg text{font-size:21px}.concept-guide .world-stage svg .label-small{font-size:18px}
.component-readings p{display:flex;gap:12px;justify-content:space-between;flex-wrap:wrap;font-size:16px;border-bottom:1px solid var(--line);margin:0;padding:9px 0}.component-readings span{color:var(--muted)}
.flow-line{padding:14px 16px;border-radius:6px;background:var(--capbg);font-weight:600;font-size:17px}
.css-stage{position:relative;min-height:260px;border:1px solid var(--line);border-radius:9px;background:#f3f2eb;overflow:hidden}
.css-stage-label{position:absolute;left:20px;top:18px;font:17px ui-monospace,monospace}.css-stage-note{position:absolute;left:20px;bottom:16px;font-size:15px;color:var(--muted)}
.css-tile,.css-ghost{position:absolute;left:100px;top:90px;width:64px;height:64px;box-sizing:border-box;transform-origin:0 0}
.css-ghost{border:2px dashed var(--muted);opacity:.5}.css-tile{display:grid;place-items:center;background:var(--magbg);border:2px solid var(--magnetic);color:var(--magnetic);font-weight:600;font-size:16px}
.css-demo>div>p:not(.reading-location){margin:16px 0 0}.css-code{white-space:pre-wrap;overflow-wrap:anywhere;padding:14px 16px;background:#20262205;border-radius:6px;font-size:13px;line-height:1.6}
.numeric-cell.transform-cell{background:#20262209;color:var(--ink)}.numeric-cell.transform-cell[data-sign=negative]{background:var(--ink);color:var(--paper)}.numeric-cell.transform-cell[data-sign=zero]{background:#20262205;color:var(--muted)}
@media(max-width:760px){.explain-pair,.quantity-key{grid-template-columns:1fr;gap:22px}.concept-guide h2{font-size:28px}.concept-guide h3{font-size:23px}.concept-guide .small{font-size:16px}.quantity-key{gap:10px}.guide-links{flex-direction:column;gap:14px}.vector-demo .world-stage{max-width:500px}.css-code{font-size:14px}}
@media print{.guide-links,.demo-controls{display:none}.concept-guide{break-before:page}.concept-guide .explain-pair{grid-template-columns:1fr 1fr;gap:20px}.concept-guide h2{font-size:25px}.concept-guide h3{font-size:18px}.concept-guide p{font-size:12px}.css-stage,.numeric-matrix,.world-stage{break-inside:avoid}}

/* Keep the shared map gap fixed while comparing local watches and rulers. */
.winding-vocabulary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:26px 0}.winding-vocabulary p{margin:0;border-top:3px solid var(--capacity);padding-top:12px;font-size:16px}.winding-vocabulary p:first-child{border-color:#266982}.winding-vocabulary p:nth-child(2){border-color:#9b3e62}.winding-vocabulary strong{display:block;margin-bottom:7px;font-size:18px}
.winding-lab{border-block:1px solid var(--line);padding:0 0 22px;margin:30px 0}.winding-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}.winding-pair article{min-width:0}.winding-pair h4,.charge-exteriors h4{font-size:19px;margin:0 0 12px}
.winding-stage{background:#f3f2eb;border:1px solid var(--line);border-radius:9px;overflow:hidden}.winding-stage svg{display:block;width:100%;height:auto;aspect-ratio:5/4}.winding-stage svg text{font:19px system-ui,sans-serif;fill:var(--ink)}.winding-stage svg .label-small{font-size:16px;fill:var(--muted)}.winding-stage svg .charge-sign{font-size:29px}
.winding-status{margin:18px 0;padding:15px 18px;border-left:3px solid var(--capacity);background:var(--capbg)}.winding-status p{margin:0}.winding-status p:first-child{font-weight:600;font-size:19px}.winding-status p+p{margin-top:8px;font-size:15px}
.winding-sliders{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:24px 0}.winding-sliders label{font-size:16px;font-weight:600}.winding-sliders output{color:var(--muted);font-weight:400}.winding-sliders input{display:block;width:100%;min-height:40px;margin:4px 0 0;accent-color:var(--capacity)}
.winding-lab .demo-controls button[aria-pressed=true]{background:var(--capbg);border-color:var(--capacity)}.winding-lab button:disabled{opacity:.45;cursor:default}.rotation-bridge{border-left:3px solid var(--electric);padding:1px 0 1px 22px;margin-top:30px}
@media(max-width:760px){.winding-vocabulary,.winding-pair,.winding-sliders{grid-template-columns:1fr;gap:22px}.winding-vocabulary{gap:15px}.winding-stage{max-width:500px}.winding-sliders{gap:10px}.winding-status p+p{font-size:16px}.rotation-bridge{padding-left:16px}}
@media print{.winding-sliders{display:none}.winding-pair,.charge-exteriors{grid-template-columns:1fr 1fr;gap:18px}.winding-stage{break-inside:avoid}.winding-status p:first-child{font-size:15px}.winding-status p+p{font-size:12px}}

.clock-measures{margin:38px 0 28px;border-top:1px solid var(--line);padding-top:28px;scroll-margin-top:20px}
.clock-measures h3{font-size:clamp(27px,3.5vw,36px);line-height:1.2;margin:10px 0 20px}
.clock-measures h4{font-size:22px;line-height:1.3;margin:25px 0 12px}
.clock-measures>p{max-width:86ch}.ruler-pair h4{margin:0 0 12px;font-size:20px}.ruler-pair p{font-size:16px}
.ruler-pair .world-stage svg text{font-size:21px}.ruler-pair .world-stage svg .label-small{font-size:18px}
.ruler-pair .world-stage svg .ruler-total{font-size:29px;font-weight:650}.ruler-breakdown strong,.ruler-breakdown span{display:block}.ruler-breakdown strong{font-size:19px}
.metric-explanation{padding:5px 22px 10px;background:#20262205;border-radius:8px;margin:24px 0}
.metric-rule{font-size:18px;font-weight:600;color:var(--capacity)}
.metric-playground{margin:30px 0}.metric-playground .demo-controls button[aria-pressed=true]{background:var(--capbg);border-color:var(--capacity)}
.metric-demo-pair{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start}.metric-demo-pair>div{min-width:0}.metric-demo-pair .reading-location{margin-top:0}
.metric-readouts p{margin:0 0 16px;padding:0 0 15px;border-bottom:1px solid var(--line)}
.metric-readouts strong{display:block;font:clamp(23px,3vw,30px) Georgia,serif;color:var(--capacity);margin-bottom:5px;font-variant-numeric:tabular-nums}
.metric-readouts span{display:block;font-size:16px;color:var(--muted)}.metric-readouts .small{font-size:14px;border:0;padding:0}
.metric-limits{scroll-margin-top:20px}.limit-list{margin:20px 0}.limit-list>div{display:grid;grid-template-columns:minmax(140px,1fr) 3fr;gap:25px;padding:18px 0;border-top:1px solid var(--line)}
.limit-list dt{font-weight:600;font-size:17px}.limit-list dd{font-size:16px;margin:0}.clock-measures .small{color:var(--muted)}
@media(max-width:760px){.metric-demo-pair{grid-template-columns:1fr;gap:22px}.clock-measures h4{font-size:23px}.metric-explanation{padding:1px 16px 8px}.metric-rule{font-size:17px}.limit-list>div{grid-template-columns:1fr;gap:8px}.limit-list dd,.clock-measures .small,.ruler-pair p{font-size:16px}.metric-readouts strong{font-size:27px}.metric-readouts p:last-child{margin:0}.ruler-pair h4{font-size:21px}}
@media print{.clock-measures{break-before:page}.ruler-pair,.metric-demo-pair{grid-template-columns:1fr 1fr;gap:20px}.clock-measures h3{font-size:25px}.clock-measures h4{font-size:18px}.clock-measures p,.limit-list dt,.limit-list dd{font-size:12px}.metric-readouts strong{font-size:22px}.limit-list>div{break-inside:avoid}}
