/* Interactive guides, scoped to the Overview and Core Concepts learning pages. */
.aa-learning .aa-guide{color-scheme:light;--aa-paper:var(--paper);--aa-surface:var(--panel);--aa-ink:var(--ink);--aa-muted:var(--ink-2);--aa-line:var(--hairline);--aa-blue:var(--diagram-reference);--aa-blue-soft:var(--diagram-reference-soft);--aa-blue-pale:var(--diagram-reference-pale);--aa-amber:var(--diagram-prediction);--aa-amber-soft:var(--diagram-prediction-soft);--aa-frame:color-mix(in srgb,var(--ink-3) 20%,var(--paper));--aa-frame-top:var(--panel);--aa-quiet:var(--ink-3);background:var(--aa-paper);color:var(--aa-ink);font:15px/1.55 var(--sans);border:1px solid var(--aa-line);border-radius:20px;overflow:hidden;text-align:left}
.aa-learning .aa-guide *{box-sizing:border-box}.aa-learning .aa-guide [hidden]{display:none!important}.aa-learning .aa-guide button,.aa-learning .aa-guide input{font:inherit}.aa-learning .aa-guide button{cursor:pointer}.aa-learning .aa-guide button:disabled{cursor:default;opacity:.45}.aa-learning .aa-guide h2,.aa-learning .aa-guide h3,.aa-learning .aa-guide p{margin:0}.aa-learning .aa-guide strong{font-weight:500}.aa-learning .aa-guide .aa-kicker{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--aa-muted);margin-bottom:8px}.aa-learning .aa-guide .aa-guide-title{font:600 clamp(26px,4.2vw,36px)/1.25 var(--serif);letter-spacing:normal;max-width:650px;margin-bottom:12px}.aa-learning .aa-guide .aa-intro{max-width:650px;color:var(--aa-muted);margin-bottom:24px}.aa-learning .aa-guide .aa-intro strong{color:var(--aa-ink)}.aa-learning .aa-guide .aa-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.aa-learning .aa-guide .aa-stage{background:var(--aa-surface);border-radius:12px;padding:16px;min-width:0}.aa-learning .aa-guide .aa-stage-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;font-size:12px;color:var(--aa-muted);margin-bottom:8px}.aa-learning .aa-guide .aa-stage-top strong{color:var(--aa-ink)}.aa-learning .aa-guide .aa-svg{display:block;width:100%;overflow:visible}.aa-learning .aa-guide .aa-svg text{font:12px var(--sans);fill:var(--aa-ink)}.aa-learning .aa-guide .aa-svg [data-part]{cursor:pointer}.aa-learning .aa-guide .aa-tree-wrap{position:relative;height:270px;min-width:0}.aa-learning .aa-guide .aa-tree-svg{height:270px;position:absolute;inset:0}.aa-learning .aa-guide .aa-node{position:absolute;transform:translate(-50%,-50%);width:86px;min-height:37px;padding:6px 5px;font-size:12px;border:1px solid var(--aa-line);border-radius:7px;background:var(--aa-paper);color:var(--aa-ink);font-weight:500;text-align:center}.aa-learning .aa-guide .aa-node[aria-pressed="true"]{background:var(--accent-soft);color:var(--ink);border-color:var(--accent)}.aa-learning .aa-guide .aa-node[data-node="body"]{left:50%;top:29px}.aa-learning .aa-guide .aa-node[data-node="door"]{left:22%;top:132px}.aa-learning .aa-guide .aa-node[data-node="drawer"]{left:78%;top:132px}.aa-learning .aa-guide .aa-node[data-node="latch"]{left:78%;top:240px}.aa-learning .aa-guide .aa-caption{font-size:12px;color:var(--aa-muted);margin-top:9px}.aa-learning .aa-guide .aa-selected{display:flex;flex-wrap:wrap;gap:7px 12px;padding:17px 0 0;min-height:63px;align-items:baseline}.aa-learning .aa-guide .aa-selected strong{font-family:var(--serif);font-size:20px}.aa-learning .aa-guide .aa-selected span{color:var(--aa-muted);flex:1 1 270px}.aa-learning .aa-guide .aa-controls{display:flex;flex-wrap:wrap;gap:14px 22px;align-items:center;margin-top:17px}.aa-learning .aa-guide .aa-button{border:1px solid var(--aa-line);border-radius:7px;background:var(--aa-paper);color:var(--aa-ink);min-height:40px;padding:8px 14px;font-size:13px;font-weight:500}.aa-learning .aa-guide .aa-button[aria-pressed="true"]{color:var(--aa-paper);background:var(--aa-ink);border-color:var(--aa-ink)}.aa-learning .aa-guide .aa-button-primary{background:var(--aa-ink);color:var(--aa-paper);border-color:var(--aa-ink)}.aa-learning .aa-guide .aa-slider-group{flex:1 1 260px;min-width:0}.aa-learning .aa-guide .aa-slider-label{display:flex;justify-content:space-between;gap:14px;align-items:baseline;font-size:13px}.aa-learning .aa-guide output,.aa-learning .aa-guide .aa-number{font-variant-numeric:tabular-nums}.aa-learning .aa-guide input[type="range"]{width:100%;display:block;accent-color:var(--accent);height:28px;margin:6px 0 0;cursor:ew-resize}.aa-learning .aa-guide input[type="checkbox"]{width:18px;height:18px;accent-color:var(--accent);flex:0 0 auto;margin:0}.aa-learning .aa-guide .aa-check{display:flex;gap:10px;align-items:center;font-size:13px;cursor:pointer;min-height:44px}.aa-learning .aa-guide .aa-reading{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:18px 0 0}.aa-learning .aa-guide .aa-reading>div{border-left:2px solid var(--aa-line);padding-left:12px}.aa-learning .aa-guide .aa-reading small{display:block;font-size:11px;color:var(--aa-muted);margin-bottom:4px}.aa-learning .aa-guide .aa-reading span{font-size:13px}.aa-learning .aa-guide .aa-equation{font-family:var(--serif);font-size:18px;margin:10px 0;overflow-wrap:anywhere}.aa-learning .aa-guide .aa-details{border-top:1px solid var(--aa-line);margin-top:22px;padding-top:13px;font-size:13px}.aa-learning .aa-guide summary{cursor:pointer;font-weight:500;min-height:30px}.aa-learning .aa-guide .aa-details p{color:var(--aa-muted);margin-top:10px}.aa-learning .aa-guide .aa-details code{font-size:12px;overflow-wrap:anywhere;color:var(--aa-ink)}.aa-learning .aa-guide .aa-next-note{border-top:1px solid var(--aa-line);padding-top:16px;margin-top:22px;font-size:13px;color:var(--aa-muted)}.aa-learning .aa-guide .aa-next-note strong{color:var(--aa-ink)}.aa-learning .aa-guide .aa-legend{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:12px;color:var(--aa-muted);margin-bottom:15px}.aa-learning .aa-guide .aa-legend span{display:flex;align-items:center;gap:7px}.aa-learning .aa-guide .aa-swatch{width:18px;height:3px;background:var(--aa-blue)}.aa-learning .aa-guide .aa-swatch-pred{background:var(--aa-amber)}.aa-learning .aa-guide .aa-match-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:3px;font-size:13px}.aa-learning .aa-guide .aa-match-head output{font-weight:500}.aa-learning .aa-guide .aa-cost-line{text-align:center;font:15px var(--serif);min-height:25px}.aa-learning .aa-guide .aa-winning{font-size:11px;color:var(--aa-muted);min-height:20px;text-align:center;margin-top:8px}.aa-learning .aa-guide .aa-result{margin-top:18px;padding:16px 0;border-top:1px solid var(--aa-line);border-bottom:1px solid var(--aa-line);display:flex;align-items:center;gap:20px;flex-wrap:wrap}.aa-learning .aa-guide .aa-result-number{font:400 32px/1.2 var(--serif);white-space:nowrap}.aa-learning .aa-guide .aa-result-copy{font-size:13px;color:var(--aa-muted);flex:1 1 220px}.aa-learning .aa-guide .aa-result-copy strong{display:block;color:var(--aa-ink);margin-bottom:3px}.aa-learning .aa-guide .aa-encoding{font-size:12px;color:var(--aa-muted);margin:12px 0 18px;min-height:20px}.aa-learning .aa-guide .aa-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:20px}.aa-learning .aa-guide .aa-metric{border-top:1px solid var(--aa-line);padding-top:12px}.aa-learning .aa-guide .aa-metric-label{font-size:13px;margin-bottom:5px}.aa-learning .aa-guide .aa-metric-value{font:400 29px/1.2 var(--serif);margin-bottom:6px}.aa-learning .aa-guide .aa-metric-unit{font:12px var(--sans);color:var(--aa-muted)}.aa-learning .aa-guide .aa-metric p{font-size:12px;color:var(--aa-muted)}.aa-learning .aa-guide .aa-tree-scene{height:156px}.aa-learning .aa-guide .aa-compare-tree{height:226px;border-top:1px solid var(--aa-line);margin-top:8px}.aa-learning .aa-guide .aa-step-buttons{display:flex;flex-wrap:wrap;gap:7px;margin-top:17px}.aa-learning .aa-guide .aa-edit-detail{font-size:13px;margin-top:12px;min-height:64px;color:var(--aa-muted)}.aa-learning .aa-guide .aa-edit-detail strong{color:var(--aa-ink)}.aa-learning .aa-guide .aa-edit-ledger{display:flex;flex-wrap:wrap;gap:8px 28px;font-size:12px;margin-top:10px}.aa-learning .aa-guide .aa-fine{font-size:12px;color:var(--aa-muted);margin-top:14px}.aa-learning .aa-guide .aa-source{color:var(--aa-muted);text-decoration:underline;text-underline-offset:3px}.aa-learning .aa-guide .aa-source:hover{color:var(--aa-ink)}
@media(max-width:620px){.aa-learning .aa-guide .aa-two{grid-template-columns:1fr;gap:16px}.aa-learning .aa-guide .aa-stage{padding:13px}.aa-learning .aa-guide .aa-reading{grid-template-columns:1fr;gap:12px}.aa-learning .aa-guide .aa-reading small{display:inline;margin-right:10px}.aa-learning .aa-guide .aa-controls{gap:12px}.aa-learning .aa-guide .aa-metrics{gap:15px}.aa-learning .aa-guide .aa-metric-value{font-size:26px}}
@media(prefers-reduced-motion:reduce){.aa-learning .aa-guide *{scroll-behavior:auto!important;transition:none!important}}
@media(pointer:coarse){.aa-learning .aa-guide .aa-button,.aa-learning .aa-guide .aa-node{min-height:44px}.aa-learning .aa-guide input[type="range"]{height:36px}}
.aa-learning .aa-guide{padding:24px;margin:24px 0 36px;container-type:inline-size;border-radius:14px;font-family:var(--sans)}
.aa-learning .aa-guide .aa-guide-title{border:0;padding:0;margin:0 0 12px;font-size:clamp(25px,3vw,33px)}
.aa-learning .aa-guide button:focus-visible,.aa-learning .aa-guide input:focus-visible,.aa-learning .aa-guide summary:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
@container(max-width:580px){.aa-learning .aa-guide .aa-two{grid-template-columns:1fr}.aa-learning .aa-guide .aa-reading{grid-template-columns:1fr}.aa-learning .aa-guide .aa-reading small{display:inline;margin-right:10px}}
@media(max-width:500px){.aa-learning .aa-guide{padding:18px 12px}.aa-learning .aa-guide .aa-metrics{grid-template-columns:1fr}}

/* Keep each tree's score attached to its own object, including on narrow screens. */
.aa-learning .aa-guide .aa-tree-result{margin-top:12px;padding-top:16px;border-top:2px solid var(--diagram-reference)}
.aa-learning .aa-guide .aa-tree-prediction .aa-tree-result{border-color:var(--diagram-prediction)}
.aa-learning .aa-guide .aa-tree-result .aa-metric-label{font-size:13px;font-weight:500;margin-bottom:8px}
.aa-learning .aa-guide .aa-tree-result .aa-metric-value{display:block;font-size:36px;margin-bottom:10px}
.aa-learning .aa-guide .aa-tree-result p{font-size:13px;line-height:1.65;color:var(--ink-2)}
.aa-learning .aa-guide .aa-tree-score-key{font-size:12px;line-height:1.65;color:var(--ink-2);margin-top:14px}
.aa-learning .aa-guide .aa-joint-list-result{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center;margin-top:16px;padding:16px;background:var(--panel);border-radius:8px}
.aa-learning .aa-guide .aa-joint-list-result strong{font-size:13px;font-weight:500}
.aa-learning .aa-guide .aa-joint-list-result .aa-metric-value{margin:0;text-align:right}
.aa-learning .aa-guide .aa-pose-note{font-size:13px;line-height:1.7;color:var(--ink-2);margin-top:16px;padding-left:12px;border-left:2px solid var(--accent-soft)}
@media(max-width:420px){.aa-learning .aa-guide .aa-joint-list-result{grid-template-columns:1fr;gap:12px}.aa-learning .aa-guide .aa-joint-list-result .aa-metric-value{text-align:left}}

/* Preserve left/right comparison in the documentation's narrow preview pane. */
.aa-learning .aa-guide .aa-tree-comparison-scroll{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;padding-bottom:4px}
.aa-learning .aa-guide .aa-tree-comparison-scroll:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.aa-learning .aa-guide .aa-two.aa-tree-columns{grid-template-columns:repeat(2,minmax(230px,1fr));gap:16px}
.aa-learning .aa-guide .aa-tree-scroll-hint{display:none;font-size:12px;color:var(--ink-2);margin-top:8px}
@container(max-width:580px){
  .aa-learning .aa-guide .aa-tree-columns .aa-stage{padding:12px}
  .aa-learning .aa-guide .aa-tree-columns .aa-stage-top{min-height:42px;align-content:start}
  .aa-learning .aa-guide .aa-tree-columns .aa-metric-label{min-height:40px}
}
@container(max-width:475px){.aa-learning .aa-guide .aa-tree-scroll-hint{display:block}}