/* Imported Bedrock figure styles; isolated from the article layout. */

:root{color-scheme:light;
  --ground:#f5f7f8; --panel:#fff; --panel-2:#f0f3f5; --ink:#14181d; --ink-2:#4d5866; --ink-3:#7d8894;
  --rule:#dee3e8; --rule-2:#eaeef1; --accent:#c9501f; --base:#2a78d6; --inst:#eb6834; --grid:#e4e9ed; --ok:#0d6b37; --maxw:72ch}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){color-scheme:dark;
  --ground:#0f1214; --panel:#161a1e; --panel-2:#1c2126; --ink:#eef1f4; --ink-2:#a7b2bd; --ink-3:#76818d;
  --rule:#252c32; --rule-2:#1e2429; --accent:#f08050; --base:#3987e5; --inst:#d95926; --grid:#222930; --ok:#4dbe7c;}}
:root[data-theme="dark"]{color-scheme:dark;
  --ground:#0f1214; --panel:#161a1e; --panel-2:#1c2126; --ink:#eef1f4; --ink-2:#a7b2bd; --ink-3:#76818d;
  --rule:#252c32; --rule-2:#1e2429; --accent:#f08050; --base:#3987e5; --inst:#d95926; --grid:#222930; --ok:#4dbe7c;}
*{box-sizing:border-box}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--font-sans);font-size:17px;line-height:1.66;-webkit-font-smoothing:antialiased}
.wrap{max-width:var(--maxw);margin:0 auto;padding:20px 22px 90px}
p{margin:0 0 1.2em}
a{color:var(--accent);text-decoration:none}
header{border-bottom:1px solid var(--rule);background:var(--panel)}
.head-in{max-width:var(--maxw);margin:0 auto;padding:52px 22px 36px}
.eyebrow{font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);font-weight:500}
h1{font-family:var(--font-heading);font-weight:500;font-size:clamp(34px,5.4vw,52px);line-height:1.08;letter-spacing:-.015em;margin:14px 0 0;text-wrap:balance}
.dek{font-family:var(--font-heading);font-size:clamp(18px,2.3vw,21px);line-height:1.5;color:var(--ink-2);margin:16px 0 0;max-width:54ch}
.byline{margin:12px 0 0;color:var(--ink-3);font-family:var(--font-mono);font-size:11px;line-height:1.4;letter-spacing:.04em}
h2{font-family:var(--font-heading);font-weight:500;font-size:clamp(25px,3.2vw,32px);line-height:1.15;margin:56px 0 18px;text-wrap:balance}
h2::before{content:"";display:block;width:36px;height:2px;background:var(--accent);margin-bottom:16px}
.lede{font-size:19px}
.copy-ai-fix-wrap{display:flex;align-items:center;justify-content:center;gap:16px;min-height:58px;margin:28px 0 24px}
.copy-ai-fix-button{-webkit-appearance:none;appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:13px 22px;border:1px solid #28566b;border-radius:999px;background:#102d3c;color:#eef8fb;font:600 15px/1.2 var(--font-sans);cursor:pointer;box-shadow:0 10px 28px rgba(4,24,34,.24);transform:scale(1);transition:transform .18s cubic-bezier(.2,.8,.2,1),background-color .18s ease,box-shadow .18s ease}
.copy-ai-fix-button svg{width:17px;height:17px;fill:none;stroke:#75c9e5;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.copy-ai-fix-button:hover{background:#15394b;box-shadow:0 14px 32px rgba(4,24,34,.3);transform:scale(1.04)}
.copy-ai-fix-button:focus-visible{outline:2px solid #75c9e5;outline-offset:3px}
.copy-ai-fix-button.is-clicking{animation:copy-ai-fix-click .24s cubic-bezier(.2,.8,.2,1)}
.copy-ai-fix-feedback{min-width:118px;font-family:var(--font-mono);font-size:12px;font-weight:500;color:var(--ok);opacity:0}
.copy-ai-fix-feedback strong{color:#dc4c4c}
.copy-ai-fix-feedback.is-visible{animation:copy-ai-fix-feedback 1.45s ease-out forwards}
@keyframes copy-ai-fix-click{0%,100%{transform:scale(1.04)}50%{transform:scale(.975)}}
@keyframes copy-ai-fix-feedback{0%{opacity:0}12%,68%{opacity:1}100%{opacity:0}}
.turn{font-family:var(--font-heading);font-size:clamp(22px,2.9vw,27px);line-height:1.34;font-style:italic;margin:0 0 1.2em}
.kicker{font-family:var(--font-heading);font-size:clamp(20px,2.5vw,24px);line-height:1.4;margin:30px 0 24px}
figure{margin:34px 0;background:var(--panel);border:1px solid var(--rule);border-radius:12px;padding:7px 8px 6px}
.figscroll{overflow-x:auto}
.figure-stage{width:var(--figure-width);margin:0 auto}
.figure-stage svg{display:block;width:100%;height:auto}
.motion-slot{margin:34px 0;min-width:0}
.motion-slot .fl-fig{margin:0;background:var(--panel);border:1px solid var(--rule);border-radius:12px;padding:0;overflow:hidden}
.motion-slot .fl-cap,.fix-contract-head{display:flex;align-items:baseline;justify-content:flex-start;padding:18px 20px;border-bottom:1px solid var(--rule);color:inherit}
.motion-slot .fl-root .fl-title,.fix-contract-head h3{margin:0;font-family:var(--font-heading);font-size:21px;font-weight:500;line-height:1.2;letter-spacing:-.01em}
.motion-slot .fl-root svg{width:calc(100% - 56px);margin:18px auto 0}
.tier-table-wrap{width:min(100%,360px);margin:14px auto 26px;overflow-x:auto}
.tier-table{width:100%;border:0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);border-radius:0;border-collapse:collapse;border-spacing:0;background:transparent}
.tier-table th,.tier-table td{padding:7px 4px;border-bottom:1px solid var(--rule-2);text-align:left}
.tier-table th{background:transparent;color:var(--ink-3);font-family:var(--font-mono);font-size:8.5px;font-weight:500;letter-spacing:.07em;text-transform:uppercase}
.tier-table td{color:var(--ink-2);font-size:12.5px;line-height:1.35}
.tier-table td:first-child{color:var(--ink);font-weight:500}
.tier-table th:last-child,.tier-table td:last-child{text-align:right}
.tier-table tbody tr:last-child td{border-bottom:0}
.fix-contract-walkthrough{width:min(98vw,1120px);margin-left:50%;padding:0;transform:translateX(-50%);overflow:visible}
.fix-contract-step-key{font-family:var(--font-mono);font-size:10px;line-height:1.3;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.fix-contract-grid{position:relative;display:grid;grid-template-columns:minmax(320px,1fr) minmax(0,1.28fr);column-gap:clamp(8px,2.4vw,32px);row-gap:10px;align-items:start;padding:16px 18px 20px}
.fix-column-label{position:relative;z-index:2;padding:0 2px 8px;border-bottom:1px solid var(--rule);font-family:var(--font-mono);font-size:11px;font-weight:500;line-height:1.35;letter-spacing:.05em;color:var(--ink-2)}
.fix-column-label-instruction{grid-column:1;grid-row:1}
.fix-column-label-code{grid-column:2;grid-row:1}
.fix-contract-steps{position:relative;z-index:2;display:grid;grid-column:1;grid-row:2;gap:11px}
.fix-contract-step{-webkit-appearance:none;appearance:none;position:relative;display:flex;min-width:0;min-height:150px;flex-direction:column;justify-content:center;gap:9px;padding:18px 28px 18px 17px;border:1px solid var(--rule);border-radius:9px;background:var(--panel-2);color:var(--ink);font:inherit;text-align:left;cursor:pointer;opacity:.48;transition:border-color .24s ease,background-color .24s ease,box-shadow .24s ease,opacity .24s ease,transform .24s ease}
.fix-contract-step.is-parent{min-height:158px}
.fix-contract-step.is-child{width:calc(100% - 18px);min-height:104px;margin-left:18px;padding:13px 26px 13px 14px;border-right-width:3px;border-radius:7px}
.fix-contract-step.is-child .fix-contract-step-key{font-size:9px}
.fix-contract-step.is-child .fix-contract-step-copy{font-size:14px;line-height:1.38}
.fix-contract-step:hover,.fix-contract-step:focus-visible{opacity:.8;border-color:color-mix(in srgb,var(--accent) 55%,var(--rule));outline:none}
.fix-contract-step.is-active{opacity:1;border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--panel));box-shadow:0 12px 30px color-mix(in srgb,var(--ground) 72%,transparent);transform:translateX(3px)}
.fix-contract-step-copy{font-size:15px;font-weight:600;line-height:1.45}
.fix-contract-step-copy code{font-family:var(--font-mono);font-size:.88em;font-weight:500;color:var(--accent)}
.fix-contract-step-dot{position:absolute;right:-5px;top:50%;width:9px;height:9px;border:2px solid var(--panel);border-radius:50%;background:var(--rule);transform:translateY(-50%);transition:background-color .2s ease,box-shadow .2s ease}
.fix-contract-step.is-active .fix-contract-step-dot{background:#53c8b7;box-shadow:0 0 0 2px rgba(83,200,183,.18)}
.fix-code-panel{position:sticky;top:18px;z-index:2;grid-column:2;grid-row:2;min-width:0;overflow:hidden;border:1px solid var(--rule);border-radius:10px;background:#11181d;color:#d9e1e6;box-shadow:0 16px 42px rgba(0,0,0,.18)}
.fix-code-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-bottom:1px solid #273139;background:#161e24}
.fix-code-head code{font-family:var(--font-mono);font-size:12px;color:#eef3f5}
.fix-code-head span{font-family:var(--font-mono);font-size:9px;letter-spacing:.09em;text-transform:uppercase;color:#71808b;white-space:nowrap}
.fix-code-scroll{overflow-x:auto;overscroll-behavior-inline:contain}
.fix-code{display:block;min-width:520px;padding:15px 0 17px;font-family:var(--font-mono);font-size:12px;line-height:1.72;color:#cbd4da}
.fix-code-line{display:grid;grid-template-columns:34px 17px minmax(max-content,1fr);min-height:21px;padding:0 14px 0 0;border-left:2px solid transparent;transition:background-color .24s ease,border-color .24s ease,color .24s ease}
.fix-code-line.is-active{border-left-color:#53c8b7;background:rgba(83,200,183,.14);color:#f4f8f8}
.fix-code-ln{text-align:right;color:#596873;user-select:none}
.fix-code-sign{text-align:center;color:#53c8b7;font-weight:600}
.fix-code-text{white-space:pre}
.fix-contract-arrows{position:absolute;inset:0;z-index:4;width:100%;height:100%;overflow:visible;pointer-events:none}
.fix-contract-arrow{fill:none;stroke:#53c8b7;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;opacity:0;stroke-dasharray:1;stroke-dashoffset:1;filter:drop-shadow(0 1px 2px rgba(0,0,0,.24));transition:opacity .24s ease,stroke-dashoffset .42s cubic-bezier(.2,.8,.2,1)}
.fix-contract-arrow.is-active{opacity:1;stroke-dashoffset:0}
.fix-contract-arrows marker path{fill:#53c8b7}
.motion-slot .fl-root .fl-note,.fix-contract-walkthrough figcaption{margin:0 18px 8px;padding:11px 2px 4px}
.dgm .box{fill:var(--panel-2); stroke:var(--rule); stroke-width:1.25}
.dgm .box.hot{stroke:var(--accent); stroke-width:1.75}
.dgm .ghost{fill:none; stroke:var(--rule); stroke-width:1.25; stroke-dasharray:4 4; opacity:.55}
.dgm .lbl{font-size:13px; font-weight:500; fill:var(--ink)}
.dgm .lbl.sm{font-size:12px}
.dgm .lbl.hi{fill:var(--accent)}
.dgm .ttl{font-size:14px; font-weight:600; fill:var(--ink)}
.dgm .sub{font-family:var(--font-mono); font-size:10.5px; fill:var(--ink-3); letter-spacing:.04em}
.dgm .edge{stroke:var(--ink-3); stroke-width:1.4; fill:none; color:var(--ink-3)}
.dgm .edge.thin{stroke-width:1; opacity:.5}
.dgm .edge.hot{stroke:var(--accent); stroke-width:1.8; color:var(--accent)}
.dgm .edge.dash{stroke-dasharray:5 4}
.dgm .etxt{font-family:var(--font-mono); font-size:10px; fill:var(--ink-3); letter-spacing:.03em}
.dgm .etxt.hi{fill:var(--accent)}
.dgm .lane{font-family:var(--font-mono); font-size:10px; letter-spacing:.12em; fill:var(--ink-3)}
.dgm .badtxt{font-size:13px; font-weight:600; fill:var(--accent)}
.dgm .badtxt.sm{font-family:var(--font-mono); font-size:11px; font-weight:400}
.dgm .ok{font-family:var(--font-mono); font-size:11px; fill:var(--ok)}

.chart .b{fill:var(--base)} .chart .c{fill:var(--inst)}
.chart .grid{stroke:var(--grid); stroke-width:1}
.chart .axis{stroke:var(--ink-3); stroke-width:1}
.chart .ax{font-family:var(--font-mono); font-size:11px; fill:var(--ink-3)}
.chart .ax.hi{fill:var(--accent)}
.chart .val{font-family:var(--font-mono); font-size:13px; font-weight:500; fill:var(--ink-2);
  paint-order:stroke; stroke:var(--panel); stroke-width:3.5px; stroke-linejoin:round}
.chart .val.hi{fill:var(--ink); font-weight:600}
.chart .grp{font-size:13px; font-weight:600; fill:var(--ink)}
.chart .d{font-family:var(--font-mono); font-size:11.5px; font-weight:500}
.chart .d.up{fill:var(--accent)} .chart .d.down,.chart .d.flat{fill:var(--ink-3)}
.chart .slope{stroke-width:2; fill:none}
.chart .slope.up{stroke:var(--accent)} .chart .slope.down{stroke:var(--ink-3)}
.chart .slope.dot.up{fill:var(--accent); stroke:none}
.chart .slope.dot.down{fill:var(--ink-3); stroke:none}
.chart .slbl{font-family:var(--font-mono); font-size:12px; fill:var(--ink-2)}
.chart .slbl.hi{fill:var(--ink); font-weight:600}
.chart .sname{font-size:12.5px; font-weight:500; fill:var(--ink)}
.chart .sdelta{font-family:var(--font-mono); font-size:11.5px; font-weight:500}
.chart .sdelta.up{fill:var(--accent)} .chart .sdelta.down{fill:var(--ink-3)}
.chart .etxt{font-family:var(--font-mono); font-size:10.5px; fill:var(--ink-3)}

/* verdict composition */
.chart .seg.m{fill:var(--inst)}
.chart .seg.p{fill:var(--inst); opacity:.42}
.chart .seg.x{fill:var(--ink-3); opacity:.30}
.chart .lgd{font-family:var(--font-mono); font-size:11px; fill:var(--ink-2)}
.chart .segv{font-family:var(--font-mono); font-size:11px; fill:#fff; font-weight:500}
.chart .segv.dk{fill:var(--ink)}
.chart .armlbl{font-family:var(--font-mono); font-size:10.5px; fill:var(--ink-3)}
/* coverage table */
.chart .th,.dgm .th{font-family:var(--font-mono); font-size:10px; letter-spacing:.1em; fill:var(--ink-3)}
.chart .thr{stroke:var(--ink-3); stroke-width:1}
.chart .tr{stroke:var(--rule); stroke-width:1}
.chart .tdname{font-size:13.5px; font-weight:500; fill:var(--ink)}
.chart .td{font-family:var(--font-mono); font-size:13.5px; fill:var(--ink-2)}
.chart .td.hi{fill:var(--ink); font-weight:600}
.chart .tdd{font-family:var(--font-mono); font-size:12.5px}
.chart .tdd.up{fill:var(--accent)} .chart .tdd.down,.chart .tdd.flat{fill:var(--ink-3)}
.chart .cellwin{fill:var(--accent); opacity:.07}
/* transition matrix */
.chart .mcell.up{fill:var(--accent)} .chart .mcell.down{fill:var(--ink-3)}
.chart .mcell.diag{fill:var(--rule)}
.chart .mout{fill:none; stroke:var(--rule); stroke-width:1}
.chart .mout.muted{opacity:.5}
.chart .mnum{font-family:var(--font-mono); font-size:16px; fill:var(--ink-2)}
.chart .mnum.hi{fill:var(--ink); font-weight:600}
.chart .mnum.muted{fill:var(--ink-3); opacity:.42; font-weight:400}
.chart .tier-focus{font-size:12.5px; font-weight:600; fill:var(--accent)}
.chart .tier-muted{font-size:11.5px; font-weight:500; fill:var(--ink-3)}
.chart .vert{letter-spacing:.1em}
/* per-finding movement */
.chart .mv.up{fill:var(--inst)} .chart .mv.down{fill:var(--ink-3)} .chart .mv.zero{fill:var(--rule)}

/* disposition map: one chip per illustrative file anchor */
.dgm .path{font-family:var(--font-mono); font-size:11.5px; fill:var(--ink-2)}
.dgm .chip{stroke-width:1.25}
.dgm .chip.t{fill:var(--accent); fill-opacity:.16; stroke:var(--accent)}
.dgm .chip.p{fill:var(--ink-3); fill-opacity:.12; stroke:var(--ink-3)}
.dgm .chip.u{fill:none; stroke:var(--rule); stroke-dasharray:3 3}
.dgm .chiptxt{font-family:var(--font-mono); font-size:9.5px; letter-spacing:.06em; font-weight:500}
.dgm .chiptxt.t{fill:var(--accent)} .dgm .chiptxt.p{fill:var(--ink-2)} .dgm .chiptxt.u{fill:var(--ink-3)}
/* transition matrix cell sublabel, and per-finding bar callouts */
.chart .mtag{font-family:var(--font-mono); font-size:9px; letter-spacing:.04em; fill:var(--ink-3)}
.chart .blbl{font-family:var(--font-mono); font-size:10px; fill:var(--ink-3)}
/* disposition map grouping panel */
.dgm .panel{fill:var(--ink-3); fill-opacity:.07; stroke:var(--rule); stroke-width:1}
.dgm .panellbl{font-size:12.5px; font-weight:500; fill:var(--ink-2)}
.chart .mtag.on{fill:#fff; opacity:.92}
.chart .bnum{font-family:var(--font-mono); font-size:8.5px; fill:var(--ink-3)}

/* ==== interaction layer ====
   Inert in the static harness and in the PNG exports: hit targets are transparent and the
   crosshair bands sit at zero opacity until the post's script turns one on. */
.zone{transition:opacity .18s ease}
.zone .hit{fill:transparent; stroke:none; pointer-events:all}
/* bar chart: each group is split into one target per arm. The centred labels are drawn after both
   bars so the neighboring bar cannot cover them. They stay hidden in PNG exports and the static
   harness. */
.zone .armhit{fill:transparent; stroke:none; pointer-events:all}
/* the block is black in both themes, so it needs a hairline to hold its edge against a
   dark background */
.chart .armchip{fill:#14181d; stroke:rgba(255,255,255,.22); stroke-width:1}
.chart .armtag{font-family:var(--font-mono); font-size:10px; font-weight:500;
  letter-spacing:.04em; fill:#fff}
.chart .val,.arm-label{transition:opacity .14s ease}
.arm-label{opacity:0;pointer-events:none}
/* the block is wider than the bar it labels, so the other arm's number gets out of its way */
.zone:has(.arm:hover) .arm:not(:hover) .val{opacity:.1}
.zone:has(.arm.b:hover) .arm-label.b,.zone:has(.arm.c:hover) .arm-label.c{opacity:1}
.zone:focus{outline:none}
.zone:focus-visible .hit{stroke:var(--accent); stroke-width:2; stroke-dasharray:3 3}
/* Dim-the-siblings is reserved for the figures where it carries meaning: the bar chart, where it
   is the only hover affordance, and the fix contract, where it groups rows by responsibility.
   The two grids use the crosshair instead — a ring on the square, a soft glow down its row and
   column — so hovering one cell never repaints the whole grid. */
.dim .zone.is-off{opacity:.3}
.band{fill-opacity:1; opacity:0; pointer-events:none; filter:blur(9px);
  transition:opacity .2s ease}
.band.is-on{opacity:1}
.is-on .mout{stroke:var(--accent); stroke-width:1.75}
.is-on .box{stroke:var(--accent); stroke-width:1.5}
.is-on .path{fill:var(--ink)}
.is-on .chip.u{stroke:var(--ink-3); stroke-dasharray:3 3}
.ax.is-on,.th.is-on,.sname.is-on,.grp.is-on,.tier-muted.is-on,.tier-focus.is-on{fill:var(--accent)}
.grp.is-on,.sname.is-on{font-weight:600}
/* the readout: one prerendered block per element, stacked in a single grid cell so swapping
   between them never moves the page */
.figure-readout{display:grid;width:min(100%,var(--figure-width));margin:6px auto 0;padding:8px 10px;border:1px solid var(--rule-2);border-radius:8px;background:var(--panel-2)}
.ro{grid-area:1/1;opacity:0;visibility:hidden;transition:opacity .15s ease}
.note{font-family:var(--font-mono);font-size:11px;color:var(--ink-3);padding-bottom:3px}
.ro.is-shown{opacity:1;visibility:visible}
.ro{display:flex;align-items:flex-end;gap:7px 12px;flex-wrap:wrap}
.figure-readout.mid .ro{justify-content:center}
.figure-readout.bare{background:none;border-color:transparent;padding:0 8px;margin-top:0}
/* tight shaves the chip so a bare strip sits close under the figure it annotates */
.figure-readout.tight .dc{padding:3px 8px}
.figure-readout.tight .note{padding-bottom:2px}
.st{display:flex;flex-direction:column;gap:4px}
.st em{font-family:var(--font-mono);font-size:9px;font-style:normal;line-height:1.1;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-3)}
.vc{font-family:var(--font-mono);font-size:12px;line-height:1.3;font-weight:500;padding:3px 9px;border-radius:5px;border:1px solid var(--rule);color:var(--ink-2);white-space:nowrap}
.vc.m{color:var(--panel);background:var(--accent);border-color:var(--accent)}
.vc.p{color:var(--accent);background:color-mix(in srgb,var(--accent) 15%,transparent);border-color:color-mix(in srgb,var(--accent) 50%,transparent)}
.num{font-family:var(--font-mono);font-size:15px;line-height:1.15;font-weight:500;color:var(--ink-2)}
.num.hi{color:var(--ink);font-weight:600}
.ar{font-size:16px;line-height:1;color:var(--ink-3);padding-bottom:5px}
.ar.up{color:var(--accent)}
.who{font-size:14px;font-weight:600;color:var(--ink);padding-bottom:2px}
code.who{font-family:var(--font-mono);font-size:12.5px;font-weight:500}
.tag{font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;padding:4px 9px;border-radius:20px;border:1px solid var(--rule);color:var(--ink-3);white-space:nowrap}
.tag.up{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 45%,transparent)}
.tag.plain{text-transform:none;letter-spacing:.02em;font-size:11px}
.dc{font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;padding:5px 9px;border-radius:4px;border:1px solid var(--rule);color:var(--ink-3)}
.dc.t{color:var(--accent);border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent)}
.dc.p{color:var(--ink-2);border-color:var(--ink-3)}
.dc.u{border-style:dashed}
@media (min-width:1000px){figure.visual:not(.fix-contract-walkthrough){width:min(94vw,var(--figure-shell));margin-left:50%;transform:translateX(-50%)}}
figcaption{font-size:13.5px;line-height:1.55;color:var(--ink-3);margin-top:10px;padding-top:9px;border-top:1px solid var(--rule-2)}
figcaption b{color:var(--ink-2);font-weight:600}
.figure-number{color:var(--ink-2);font-weight:600}
ul.disp{list-style:none;padding:0;margin:22px 0}
ul.disp li{border-left:2px solid var(--rule);padding:2px 0 2px 16px;margin-bottom:14px}
ul.disp li.t{border-left-color:var(--accent)}
ul.disp b{font-family:var(--font-mono);font-size:12.5px;letter-spacing:.08em;display:block;margin-bottom:2px}
ul.disp li.t b{color:var(--accent)}
.cta{display:inline-block;margin-top:6px;font-weight:600;font-size:15px;color:var(--panel);background:var(--accent);text-decoration:none;padding:12px 22px;border-radius:8px}
h2 .sn{font-family:var(--font-mono);font-size:0.52em;color:var(--accent);letter-spacing:.1em;margin-right:.7em;vertical-align:.18em}
ol.fail{padding-left:0;list-style:none;counter-reset:f;margin:22px 0}
ol.fail li{counter-increment:f;position:relative;padding-left:34px;margin-bottom:14px}
ol.fail li::before{content:counter(f);position:absolute;left:0;top:.05em;font-family:var(--font-mono);font-size:12px;font-weight:500;color:var(--accent);border:1px solid var(--rule);border-radius:5px;width:22px;height:22px;display:grid;place-items:center}
.imp{border-left:2px solid var(--accent);padding-left:16px;margin:24px 0}
.imp b{color:var(--ink)}
.draft-placeholder{margin:26px 0;padding:14px 16px;border:1px dashed var(--accent);border-radius:8px;color:var(--accent);font-family:var(--font-mono);font-size:12px;letter-spacing:.08em}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}.copy-ai-fix-feedback.is-visible{opacity:1!important}}
@media (max-width:620px){body{font-size:16px}.head-in{padding:36px 20px 28px}.copy-ai-fix-wrap{align-items:center;gap:10px}.copy-ai-fix-button{padding:12px 17px;font-size:14px}.copy-ai-fix-feedback{min-width:92px;font-size:10px}figure{padding:9px 8px 8px}.motion-slot .fl-fig{padding:0}.motion-slot .fl-cap,.fix-contract-head{display:block;padding:14px 12px}.motion-slot .fl-root .fl-title,.fix-contract-head h3{display:block;font-size:18px}.motion-slot .fl-root svg{width:calc(100% - 28px);margin-top:14px}.motion-slot .fl-root .fl-note,.fix-contract-walkthrough figcaption{margin:0 8px 6px;padding:10px 2px 4px}.tier-table th,.tier-table td{padding:6px 3px}.figure-readout{padding:7px 9px}.ro{gap:6px 10px}.fix-contract-walkthrough{padding:0}.fix-contract-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);column-gap:8px;row-gap:7px;padding:10px 8px 14px}.fix-column-label{padding-bottom:6px;font-size:9px}.fix-contract-step{padding:13px 16px 13px 10px}.fix-contract-step.is-parent{min-height:142px}.fix-contract-step.is-child{width:calc(100% - 10px);min-height:92px;margin-left:10px;padding:11px 14px 11px 9px}.fix-contract-step-copy{font-size:14px;line-height:1.38}.fix-contract-step-key{font-size:9px}.fix-code-panel{top:8px}.fix-code-head{display:block;padding:9px 10px}.fix-code-head span{display:block;margin-top:3px}.fix-code{font-size:12px}}
