/* SAME SUM · study 19. Builds on the shared LAW tokens; every rule is scoped. */
:root{--third:#8fb8ff}
:root[data-theme=paper]{--third:#2f5d9a}
body.exhibit-page.same-sum{background:var(--field)}
.same-sum .exhibit-stage{--case:var(--accent)}
.same-sum .exhibit-stage[data-order="1"]{--case:var(--summary)}
.same-sum .exhibit-stage[data-order="2"]{--case:var(--third)}

body.exhibit-page.same-sum .wrap{max-width:none;margin:0;padding:0}
body.exhibit-page.same-sum .exhibit-stage{height:100svh;min-height:740px;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,2fr) minmax(0,.9fr);grid-template-rows:40px minmax(0,1fr) auto 64px;gap:16px 32px;padding:max(22px,env(safe-area-inset-top)) clamp(22px,4vw,76px) max(16px,env(safe-area-inset-bottom))}
.same-sum .utility{grid-column:1/-1;grid-row:1;justify-content:flex-start;gap:22px;font:11px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.1em;text-transform:uppercase}
.same-sum .utility a{color:var(--muted)}
.same-sum .utility #theme{margin-left:auto;border:0;padding:8px 4px;min-width:60px;min-height:40px;font-size:11px;letter-spacing:.1em}

.same-sum .exhibit-heading{grid-column:1;grid-row:2;display:block;align-self:start;margin:30px 0 0;min-width:0}
.same-sum .eyebrow{margin:0 0 28px;font-size:10px;letter-spacing:.09em}
.same-sum .hero h1{font-size:clamp(46px,4.9vw,94px);line-height:.96;letter-spacing:-.065em;max-width:6ch;margin:0 0 24px}
.same-sum .subtitle{font-size:clamp(15px,1.2vw,20px);line-height:1.5;max-width:22ch}
.same-sum .frozen-caption{margin:44px 0 0;font:11px/1.8 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--muted);max-width:30ch}
.same-sum .frozen-caption span{display:block;color:var(--summary);font-size:10px;text-transform:uppercase;letter-spacing:.1em;margin-bottom:7px}

.same-sum .sum-field{grid-column:2;grid-row:2;display:flex;flex-direction:column;justify-content:center;gap:22px;min-height:0;min-width:0}
.same-sum .sum-field figure{margin:0;min-width:0;min-height:0;display:flex;flex-direction:column}
.same-sum .panel-head{display:flex;justify-content:space-between;flex-wrap:wrap;gap:4px 16px;font:11px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--muted);margin-bottom:6px}
.same-sum .panel-head span+span{color:var(--faint);font-size:10px}
.same-sum .sum-field svg{width:100%;height:auto;min-height:0;overflow:visible;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
.same-sum #bitsPlot{max-height:calc((100svh - 300px) * .52)}
.same-sum #driftPlot{max-height:calc((100svh - 300px) * .40);touch-action:none;cursor:crosshair}
.same-sum .step-line,.same-sum .drift-legend{font:10px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--faint);margin:6px 0 0;font-variant-numeric:tabular-nums}
.same-sum .step-line{color:var(--muted);min-height:2lh}
.same-sum .drift-legend{display:flex;justify-content:space-between;flex-wrap:wrap;gap:2px 14px}
.same-sum .legend-held{color:var(--case)}

/* Bit ruler */
.same-sum .ruler text{fill:var(--faint);font-size:10px}
.same-sum .ruler-line{stroke:var(--grid);stroke-width:.7}
.same-sum .row-label{fill:var(--faint);font-size:10px}
.same-sum .row-sign{fill:var(--muted);font-size:13px}
.same-sum .bit{fill:transparent;stroke:var(--grid);stroke-width:.6}
.same-sum .bit.on{fill:var(--muted);stroke:none}
.same-sum .bit.on.kept{fill:var(--case)}
.same-sum .bit.on.lost{fill:var(--warm)}
.same-sum .shed-zone{fill:color-mix(in srgb,var(--warm) 12%,transparent)}
.same-sum .window-frame{fill:none;stroke:var(--case);stroke-width:1.3}
.same-sum .window-frame.open{stroke-dasharray:5 3}
.same-sum .window-label{fill:var(--case);font-size:10px}
.same-sum .tray-line{stroke:var(--rule);stroke-dasharray:2 3}

/* Drift chart */
.same-sum .drift-axes text{fill:var(--faint);font-size:10px}
.same-sum .drift-axes .axis-title{fill:var(--faint);font-size:9px}
.same-sum .grid-line{stroke:var(--grid);stroke-width:.7}
.same-sum .zero-line{stroke:var(--rule);stroke-width:1}
.same-sum .tick-line{stroke:var(--rule)}
.same-sum .held-band{fill:color-mix(in srgb,var(--case) 11%,transparent)}
.same-sum .trace{fill:none;stroke-width:1;opacity:.34;vector-effect:non-scaling-stroke}
.same-sum .trace.selected{opacity:1;stroke-width:1.7}
.same-sum .trace-0{stroke:var(--accent)}
.same-sum .trace-1{stroke:var(--summary)}
.same-sum .trace-2{stroke:var(--third)}
.same-sum .cursor-line{stroke:var(--ink);stroke-width:.8;stroke-dasharray:2 3}
.same-sum .cursor-dot{fill:var(--case);stroke:var(--field);stroke-width:2}

/* Reading */
.same-sum .exhibit-reading{grid-column:3;grid-row:2;align-self:end;min-width:0;padding:0 0 26px}
.same-sum .exhibit-reading .small-label{font-size:10px;color:var(--summary)}
.same-sum .exhibit-reading>h2{font-size:clamp(28px,2.5vw,44px);line-height:1.1;letter-spacing:-.045em;margin:14px 0 16px}
.same-sum .exhibit-reading>p{font-size:14px;line-height:1.62;color:var(--muted);margin:0 0 14px}
.same-sum .exhibit-reading .values{display:grid;grid-template-columns:1fr;gap:12px;margin:20px 0 0;padding-top:16px;border-top:1px solid var(--rule)}
.same-sum .exhibit-reading .values dt{font-size:10px;color:var(--faint)}
.same-sum .exhibit-reading .values dd{font-size:clamp(20px,1.7vw,27px);line-height:1.15;margin:2px 0 0;font-variant-numeric:tabular-nums}
.same-sum .exhibit-reading .values div:nth-child(2) dd{color:var(--case)}
.same-sum .exact-line{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 10px;font:10px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace!important;color:var(--faint)!important;margin:16px 0 0!important}
.same-sum .exact-line output{color:var(--muted);overflow-wrap:anywhere}
.same-sum .invariant-line{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 12px;font:11px/1.7 ui-monospace,SFMono-Regular,Consolas,monospace;border-top:1px solid var(--rule);padding-top:12px;margin-top:12px;color:var(--muted)}
.same-sum .invariant-line strong{color:var(--summary);font-weight:400}
.same-sum .invariant-line strong.failed{color:var(--warm)}

/* Tools and switcher */
.same-sum .exhibit-tools{grid-column:1/-1;grid-row:3;display:grid;grid-template-columns:minmax(280px,1fr) auto auto;align-items:center;gap:10px 26px;font:11px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--faint);min-width:0}
.same-sum .exhibit-tools button{border:0;border-bottom:1px solid var(--rule);border-radius:0;min-height:40px;padding:6px 10px;font:11px/1.3 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:nowrap}
.same-sum .exhibit-tools button:disabled{opacity:.4;cursor:default}
.same-sum .time-controls{display:grid;grid-template-columns:auto auto minmax(100px,1fr) auto;gap:10px;align-items:center;margin:0;min-width:0}
.same-sum .time-controls input{width:100%;height:34px;accent-color:var(--case,var(--accent));margin:0}
.same-sum .time-controls output{font-size:11px;min-width:128px;text-align:right;font-variant-numeric:tabular-nums}
.same-sum .jump-controls{display:flex;gap:6px}
.same-sum .study-link{font-size:11px;white-space:nowrap;min-height:44px;display:inline-flex;align-items:center;color:var(--muted);text-decoration:none}
.same-sum .exhibit-switcher{grid-column:1/-1;grid-row:4;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin:0;border:0;align-items:stretch}
.same-sum .exhibit-switcher button{display:flex;align-items:center;gap:14px;text-align:left;border:0;border-top:1px solid var(--rule);border-radius:0;background:transparent;padding:12px 0;min-width:0;font-size:15px;color:var(--faint)}
.same-sum .exhibit-switcher button[aria-pressed=true]{border-top:2px solid var(--ink);color:var(--ink);background:transparent}
.same-sum .exhibit-switcher button span{font:10px ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--accent);margin:0}
.same-sum .exhibit-switcher button small{font:11px ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--faint);margin-left:auto;margin-right:12px;font-variant-numeric:tabular-nums}

/* Study notes */
body.exhibit-page.same-sum>.wrap>#study-notes,body.exhibit-page.same-sum>.wrap>.footer,body.exhibit-page.same-sum>.wrap>noscript{max-width:1160px;margin:30px auto;padding:20px clamp(22px,4.2vw,70px)}
.same-sum .study-intro{max-width:72ch;color:var(--muted);font-size:17px;line-height:1.7;margin:18px 0}
.same-sum #study-notes .contract{margin-top:22px}
.same-sum .readout .values{display:grid;grid-template-columns:1fr;gap:12px}
.same-sum .readout .values dd{font-size:17px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere}
.same-sum .readout .values div.trace-0 dd{color:var(--accent)}
.same-sum .readout .values div.trace-1 dd{color:var(--summary)}
.same-sum .readout .values div.trace-2 dd{color:var(--third)}
.same-sum .audit{margin:22px 0}
.same-sum .audit h3{font-size:16px}
.same-sum .audit-table{padding:18px 20px;border:1px solid var(--rule);background:var(--panel)}
.same-sum .audit-table dl{display:grid;grid-template-columns:1fr 1fr;gap:12px 30px;margin:0}
.same-sum .audit-table dl>div{min-width:0}
.same-sum .audit-table dt{font-size:12px;color:var(--muted);margin-bottom:3px}
.same-sum .audit-table dd{font:13px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;font-variant-numeric:tabular-nums;margin:0;overflow-wrap:anywhere}
.same-sum .check-list{list-style:none;padding:0;margin:0;display:grid;gap:6px;font-size:14px;color:var(--muted)}
.same-sum .check-list .pass{color:var(--muted)}
.same-sum .check-list .fail{color:var(--warm)}
.same-sum .fallback{padding:18px;border:1px solid var(--rule);color:var(--muted)}

@media(max-width:1279px),(max-height:799px){
body.exhibit-page.same-sum .exhibit-stage{height:auto;min-height:100svh;grid-template-columns:minmax(0,1fr);grid-template-rows:auto;gap:18px;padding:max(18px,env(safe-area-inset-top)) clamp(18px,4vw,48px) max(20px,env(safe-area-inset-bottom))}
.same-sum .utility{grid-row:1;gap:14px}
.same-sum .exhibit-heading{grid-column:1;grid-row:2;margin:6px 0 0}
.same-sum .eyebrow{margin:0 0 14px}
.same-sum .hero h1{font-size:clamp(38px,7vw,72px);max-width:none;margin:0 0 10px;line-height:1}
.same-sum .subtitle{font-size:16px;max-width:none}
.same-sum .frozen-caption{margin:14px 0 0;max-width:none;font-size:10px}
.same-sum .frozen-caption span{display:inline;margin-right:10px;font-size:9px}
.same-sum .sum-field{grid-column:1;grid-row:3;width:min(820px,100%);justify-self:center;gap:18px}
.same-sum #bitsPlot,.same-sum #driftPlot{max-height:none}
.same-sum .exhibit-switcher{grid-column:1;grid-row:4;gap:14px}
.same-sum .exhibit-tools{grid-column:1;grid-row:5;display:flex;flex-wrap:wrap;gap:6px 16px}
.same-sum .time-controls{flex-basis:100%}
.same-sum .exhibit-tools>.study-link{margin-left:auto}
.same-sum .exhibit-reading{grid-column:1;grid-row:6;padding:0;max-width:none}
.same-sum .exhibit-reading>h2{display:inline-block;font-size:28px;margin:0 16px 8px 0}
.same-sum .exhibit-reading>.small-label{display:inline-block;margin-right:10px}
.same-sum .exhibit-reading .values{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:620px){
.same-sum .utility{font-size:10px;letter-spacing:.05em;gap:12px}
.same-sum .hero h1{font-size:clamp(34px,10vw,46px);letter-spacing:-.06em}
.same-sum .subtitle{font-size:14px}
.same-sum .exhibit-switcher{gap:10px}
.same-sum .exhibit-switcher button{flex-direction:column;align-items:flex-start;gap:3px;font-size:13px;padding:10px 0}
.same-sum .exhibit-switcher button small{margin:0;font-size:10px}
.same-sum .time-controls{grid-template-columns:auto auto 1fr}
.same-sum .time-controls input{grid-column:1/-1;grid-row:2;height:30px}
.same-sum .time-controls output{grid-column:3;grid-row:1;min-width:0}
.same-sum .jump-controls{flex:1}
.same-sum .jump-controls button{flex:1;padding:6px 4px;font-size:10px}
.same-sum .exhibit-tools>.study-link{margin-left:0}
.same-sum .exhibit-reading .values{grid-template-columns:1fr 1fr}
.same-sum .exhibit-reading .values div:first-child{grid-column:1/-1}
.same-sum .exhibit-reading>p{font-size:13px}
.same-sum .panel-head span+span{display:none}
.same-sum .audit-table dl{grid-template-columns:1fr}
body.exhibit-page.same-sum>.wrap>#study-notes,body.exhibit-page.same-sum>.wrap>.footer{margin:20px auto;padding:16px 18px}
}
@media(max-width:620px){
.same-sum .ruler text,.same-sum .row-label,.same-sum .window-label,.same-sum .drift-axes text{font-size:19px}
.same-sum .drift-axes .axis-title{font-size:17px}
.same-sum .row-sign{font-size:22px}
}

.same-sum .rounding-note{font-size:11px;line-height:1.6;color:var(--muted);margin:4px 0 0;max-width:76ch}