#walkthrough{padding-top:50px}.animation-card{border:1px solid var(--line);border-radius:12px;background:#fff;padding:27px;margin-top:24px;overflow:hidden;--policy-accent:#9b710c}
.animation-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:23px}.animation-heading h3{margin:0;font-size:1.55rem;letter-spacing:-.025em}.animation-heading .eyebrow{margin:0 0 7px}.animation-heading>a{font-size:.8125rem;white-space:nowrap}
.animation-options{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-bottom:16px}.animation-options label{font-size:.875rem;font-weight:600}.animation-options select{max-width:100%}
.loop-example{display:flex;justify-content:space-between;align-items:center;gap:20px;border:1px solid #dce6f7;border-left:3px solid #2c60bf;border-radius:7px;background:#f5f8ff;padding:16px 18px;margin-bottom:14px}.loop-example h4{margin:6px 0 0;font-size:1rem;line-height:1.5}.loop-example .eyebrow{font-size:.68rem}.loop-example-confidence{flex-shrink:0;text-align:right}.loop-example-confidence strong,.loop-example-confidence span{display:block}.loop-example-confidence strong{font-size:.875rem;color:#285bb2}.loop-example-confidence span{font:.75rem/1.6 var(--mono);color:var(--muted);margin-top:4px;overflow-wrap:anywhere}.loop-example[data-confidence=low]{background:#fff8f3;border-color:#eed7c9;border-left-color:#bd4e37}.loop-example[data-confidence=low] strong{color:#a7402b}
.animation-canvas{overflow-x:auto;background:linear-gradient(135deg,#f9fbff,#fff);border:1px solid #e5ebf4;border-radius:8px;scrollbar-width:thin}.flow-svg{width:100%;min-width:760px;display:block;overflow:visible}.flow-svg text{font-family:var(--sans);fill:#26354d;font-size:17px}.flow-svg .svg-title{font-size:20px;font-weight:700}.flow-svg .svg-small{font-size:15px;fill:#5e6e84}.flow-svg .svg-code{font-family:var(--mono);font-size:23px}.flow-svg .svg-node rect{fill:#fff;stroke:#c9d4e5;stroke-width:1.5;transition:fill .3s,stroke .3s}.flow-svg .svg-node.active rect,.flow-svg .svg-node.selected rect{fill:#eaf0ff;stroke:#2c60bf;stroke-width:2.5}.flow-svg .svg-node.run.active rect{fill:#fff0e9;stroke:#bd4e37}.flow-svg .svg-node.feedback.active rect{fill:#eaf6f0;stroke:#26836c}.flow-svg .svg-node.future{opacity:.3}.flow-svg .svg-node.selected text{fill:var(--policy-accent)}
.flow-edge{fill:none;stroke:#c5cfde;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}.flow-edge.active{stroke:#2c60bf;stroke-width:3;stroke-dasharray:8 5}.flow-edge.run.active{stroke:#bd4e37}.flow-edge.policy-edge.active{stroke:var(--policy-accent)}.animation-card[data-playing=true] .flow-edge.active{animation:flow-travel .85s linear infinite}.svg-node.active{animation:node-arrive .4s ease-out}.flow-svg .gate-diamond{fill:#f1f5fd;stroke:#a5b7d4;stroke-width:2}.flow-svg .gate-diamond.active{fill:#d9e7ff;stroke:#2c60bf}.flow-svg .policy-bar{fill:#9eb4d3;transition:width .5s ease,opacity .3s}.flow-svg .policy-bonus{fill:url(#bonus-stripes);stroke:#8053ac;stroke-width:1;transition:width .5s ease,opacity .3s}.flow-svg .winner-outline{fill:none;stroke:var(--policy-accent);stroke-width:2.5}.flow-svg .judge-circle{fill:#fdf0eb;stroke:#bf5645;stroke-width:2}.flow-svg .report-label{fill:#2c60bf}.flow-svg .decision-box{fill:#f5f8fd;stroke:var(--policy-accent);stroke-width:2}
.verification-ribbon{display:flex;align-items:center;gap:14px;border:1px solid #d7e6df;background:#f5faf7;border-radius:7px;padding:15px 19px;margin-top:14px;color:#356b56;transition:background .3s,box-shadow .3s}.verification-ribbon>span{font-size:1.65rem}.verification-ribbon strong,.verification-ribbon div>span{display:block}.verification-ribbon strong{font-size:.9rem}.verification-ribbon div>span{font-size:.8rem;margin-top:3px}.verification-ribbon.active{background:#deefe5;box-shadow:inset 0 0 0 2px #35835f}
.animation-story{display:grid;grid-template-columns:auto 1fr;gap:30px;padding:24px 0 18px;align-items:start}.playback-controls{display:flex;gap:7px;flex-wrap:wrap}.playback-controls .button{font-size:.8125rem;padding:9px 13px;min-height:40px}.step-caption{min-height:96px}.step-caption .eyebrow{font-size:.7rem}.step-caption h4{margin:5px 0;font-size:1rem}.step-caption p{font-size:.875rem;line-height:1.65;color:var(--muted);margin:0;max-width:710px}
.animation-steps{display:flex;gap:6px;flex-wrap:wrap}.animation-steps button{border:1px solid #d5deeb;background:#f9fbff;color:#62728a;border-radius:5px;font-size:.75rem;padding:7px 10px}.animation-steps button[aria-pressed=true]{background:#e9f0ff;border-color:#8aa9de;color:#1f4eae;font-weight:650}.animation-note{font-size:.8rem;color:var(--muted);line-height:1.7;margin:20px 0 0;max-width:1040px}
.animation-policy-buttons{display:flex;gap:8px;flex-wrap:wrap}.animation-policy-buttons button{border:1px solid var(--line);border-radius:6px;background:#fff;color:#3c4a61;font-size:.875rem;font-weight:600;padding:9px 15px}.animation-policy-buttons button[aria-pressed=true]{border-color:var(--policy-accent);color:var(--policy-accent);box-shadow:inset 0 0 0 1px var(--policy-accent);background:#f8f9fc}.policy-animation-intro{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:14px 0}.policy-animation-intro p{color:var(--muted);font-size:.875rem;margin:0;max-width:840px}.policy-animation-intro .tag{white-space:nowrap}
.ucb-controls{display:grid;grid-template-columns:auto minmax(130px,220px) 1fr;gap:18px;align-items:center;background:#f7f3fb;border:1px solid #e5d9ef;padding:14px 18px;border-radius:6px;margin:14px 0}.ucb-controls[hidden]{display:none}.ucb-controls label{font-size:.875rem;font-weight:600}.ucb-controls output{font-family:var(--mono);color:#7650a2;margin-left:8px}.ucb-controls input{width:100%;accent-color:#8053ac}.ucb-controls p{margin:0;font-size:.8rem;color:#655378}
.policy-return-ribbon{display:flex;align-items:center;gap:22px;padding:15px 19px;margin-top:14px;background:#f7f9fc;border:1px solid var(--line);border-radius:7px}.policy-return-ribbon>div{min-width:130px}.policy-return-ribbon span{display:block;font-size:.75rem;color:var(--muted)}.policy-return-ribbon strong{font-size:1.4rem;font-family:var(--mono);color:var(--policy-accent)}.policy-return-ribbon p{font-size:.8125rem;color:var(--muted);flex:1;margin:0}.policy-return-ribbon button{font-size:.8125rem;padding:9px 12px}
@keyframes flow-travel{to{stroke-dashoffset:-26}}@keyframes node-arrive{from{opacity:.6}to{opacity:1}}
@media(max-width:900px){.animation-story{grid-template-columns:1fr;gap:18px}.ucb-controls{grid-template-columns:1fr 1fr}.ucb-controls p{grid-column:1/-1}.policy-return-ribbon{flex-wrap:wrap}.policy-return-ribbon>p{flex-basis:55%}}
@media(max-width:620px){.animation-card{padding:18px 14px}.animation-heading{align-items:flex-start;gap:10px;flex-wrap:wrap}.animation-heading h3{font-size:1.3rem}.animation-heading>a{font-size:.75rem}.animation-options{gap:8px}.animation-options select{width:100%;font-size:.8125rem}.policy-animation-intro{display:block}.policy-animation-intro .tag{display:inline-block;margin-top:11px}.animation-policy-buttons{gap:6px}.animation-policy-buttons button{padding:8px 10px;font-size:.8125rem}.flow-svg{min-width:730px}.ucb-controls{padding:12px;gap:12px;grid-template-columns:1fr}.ucb-controls p{grid-column:auto}.policy-return-ribbon{padding:12px;gap:12px}.policy-return-ribbon>p{flex-basis:100%}.verification-ribbon{padding:12px}.animation-story{padding-top:19px}.step-caption{min-height:128px}.animation-steps button{padding:7px 8px}.animation-note{font-size:.75rem}}
@media(prefers-reduced-motion:reduce){.animation-card *{animation:none!important;transition:none!important}}
@media(max-width:760px){.loop-example{align-items:flex-start;flex-direction:column;gap:10px}.loop-example-confidence{flex-shrink:1;text-align:left;max-width:100%}}
.paper-figure{margin:30px 0 0;padding:28px;border:1px solid #dbe4f2;border-radius:22px;background:#fff;box-shadow:0 12px 44px #25457408}
.paper-figure-image{display:block;background:#fff;border-radius:8px}.paper-figure-image img{display:block;width:100%;height:auto}.paper-figure figcaption{margin:18px 0 0;font-size:.875rem;line-height:1.7;color:#62728a}.paper-figure figcaption strong{color:#334663}
@media(max-width:760px){.paper-figure{padding:20px 14px;border-radius:17px}.paper-figure figcaption{font-size:.8125rem}}
