:root{--accent:#6b4c9a;--accent-bg:#6b4c9a1a;--ratio:#6b4c9a;--ratio-bg:#6b4c9a1a;--angle:#c07a2a;--angle-bg:#c07a2a1a;--side-opposite:#c04e4e;--side-adjacent:#3a7a5a;--side-hypotenuse:#6b4c9a;--sine:#c04e4e;--sine-bg:#c04e4e1a;--cosine:#3a7a5a;--cosine-bg:#3a7a5a1a;--wave-stroke:#6b4c9a;--wave-fill:#6b4c9a14;--circle-stroke:var(--ink-light);--circle-fill:transparent;--radius-stroke:#6b4c9a;--spring:#6b4c9a;--pressure-high:#6b4c9a;--pressure-low:#6b4c9a26;--interactive:#6b4c9a;--interactive-hover:#553d7a;--gate-bg:var(--bg-subtle);--gate-border:var(--rule);--gate-correct:var(--success);--gate-incorrect:var(--angle)}blockquote.formula{border-left-color:var(--accent)}.sin-color{color:var(--sine)}.cos-color{color:var(--cosine)}.ratio-color{color:var(--ratio)}.angle-color{color:var(--angle)}.ratio-lock{max-width:960px;margin:0 auto}.ratio-lock-layout{gap:var(--space-lg);align-items:flex-start;display:flex}.ratio-lock-triangle{flex:2;min-width:280px}.ratio-lock-triangle svg{width:100%;height:auto;display:block}.ratio-lock-readouts{gap:var(--space-md);flex-direction:column;flex:1;min-width:200px;display:flex}.readout-row{gap:var(--space-xs);padding:var(--space-sm) var(--space-md);background:0 0;border-radius:4px;flex-direction:column;transition:background-color .2s ease-out;display:flex}.readout-row.locked{background:var(--ratio-bg)}.readout-label{color:var(--ink-light);font-family:"Source Sans 3",system-ui,sans-serif;font-size:.8125rem;font-weight:500}.readout-value{font-variant-numeric:tabular-nums;color:var(--ratio);font-family:Source Code Pro,Menlo,monospace;font-size:1.125rem;transition:color .2s ease-out}.readout-row:not(.locked) .readout-value{color:var(--angle)}.readout-lock{color:var(--ratio);opacity:.6;transition:opacity .2s ease-out}.readout-row:not(.locked) .readout-lock{opacity:0}.ratio-lock-controls{margin-top:var(--space-md);justify-content:center;display:flex}.viz-label{fill:var(--ink);font-family:"Source Sans 3",system-ui,sans-serif;font-size:12px}.viz-label-mono{fill:var(--ink);font-family:Source Code Pro,Menlo,monospace;font-size:11px}.drag-handle{cursor:grab}.reflective-pause{text-align:center}.pause-text{color:var(--ink-light);max-width:480px;margin:0 auto var(--space-md);font-style:italic}.name-triangle-figure{max-width:300px;margin:0 auto var(--space-md)}.name-triangle-figure svg{width:100%;height:auto}.name-ratios{gap:var(--space-sm);text-align:left;flex-direction:column;max-width:400px;margin:0 auto;display:flex}.name-ratio-row{color:var(--ink);padding:var(--space-xs) 0;font-family:"Source Serif 4",Georgia,serif;font-size:1rem}.name-blank{border-bottom:2px solid var(--rule);text-align:center;min-width:60px;color:var(--ratio);font-weight:600;transition:color .3s ease-out;display:inline-block}.name-blank.revealed{border-bottom-color:var(--ratio)}.name-notation{margin-top:var(--space-md);gap:var(--space-sm);flex-direction:column;align-items:center;display:flex}.name-notation-row{opacity:0;font-size:1.125rem;transition:opacity .3s ease-out}.name-notation-row.visible{opacity:1}.tree-callback{border-left:3px solid var(--angle);background:var(--angle-bg);padding:var(--space-md) var(--space-lg);max-width:640px;margin:var(--space-md) auto;opacity:0;border-radius:0 4px 4px 0;transition:opacity .3s ease-out}.tree-callback.visible{opacity:1}.guess-gate{padding:var(--space-lg);text-align:center;background:var(--gate-bg);border:1px solid var(--gate-border);border-radius:4px}.guess-gate-prompt{color:var(--ink);max-width:480px;margin:0 auto var(--space-md);font-family:"Source Serif 4",Georgia,serif;font-size:1.0625rem;line-height:1.55}.guess-gate-options{gap:var(--space-sm);flex-wrap:wrap;justify-content:center;display:flex}.guess-gate-options .guess-option{min-width:120px}.walk-circle{max-width:960px;margin:0 auto}.walk-circle-panels{border:1px solid var(--rule);border-radius:4px;gap:0;display:flex;overflow:hidden}.walk-circle-left{border-right:1px solid var(--rule);flex:1;min-width:280px;max-width:400px;position:relative}.walk-circle-left svg{width:100%;height:auto;display:block}.walk-circle-right{flex:1.5;min-width:300px;position:relative}.walk-circle-right canvas{width:100%;height:100%;display:block}.walk-circle-info{padding:var(--space-xs) var(--space-sm);background:var(--bg-subtle);border-top:1px solid var(--rule);justify-content:space-between;display:flex}.angle-readout{color:var(--angle);font-variant-numeric:tabular-nums;font-family:Source Code Pro,Menlo,monospace;font-size:.875rem}.coord-readout{color:var(--ink-light);font-variant-numeric:tabular-nums;font-family:Source Code Pro,Menlo,monospace;font-size:.8125rem}.coord-readout .cos-val{color:var(--cosine)}.coord-readout .sin-val{color:var(--sine)}.walk-circle-controls{gap:var(--space-sm);margin-top:var(--space-md);flex-wrap:wrap;justify-content:center;align-items:center;display:flex}.pyth-identity{max-width:640px;margin:0 auto}.pyth-circle-panel{max-width:360px;margin:0 auto}.pyth-circle-panel svg{width:100%;height:auto;display:block}.pyth-readouts{gap:var(--space-xs);max-width:360px;margin:var(--space-md) auto;flex-direction:column;display:flex}.pyth-readout{align-items:baseline;gap:var(--space-sm);padding:var(--space-xs) var(--space-sm);display:flex}.pyth-comparison{gap:var(--space-lg);margin-top:var(--space-lg);opacity:0;flex-wrap:wrap;justify-content:center;align-items:center;transition:opacity .3s ease-out;display:flex}.pyth-comparison.visible{opacity:1}.pyth-card{padding:var(--space-md);border:1px solid var(--rule);text-align:center;border-radius:4px;min-width:160px}.pyth-card-svg{width:120px;height:90px;margin:0 auto var(--space-sm);display:block}.pyth-card-label{fill:var(--ink);font-family:"Source Sans 3",system-ui,sans-serif;font-size:11px}.pyth-card-formula{margin-top:var(--space-xs);font-size:1rem}.pyth-arrows{gap:var(--space-xs);color:var(--ink-light);flex-direction:column;font-family:"Source Sans 3",system-ui,sans-serif;font-size:.875rem;display:flex}.pyth-arrow-row{gap:var(--space-xs);align-items:center;display:flex}.pyth-arrow-row .arrow{color:var(--ink-light)}.waves-from-circles{max-width:960px;margin:0 auto}.waves-panels{background:var(--rule);border:1px solid var(--rule);border-radius:4px;gap:1px;display:flex;overflow:hidden}.waves-panel{background:var(--bg);min-width:200px;padding:var(--space-sm);flex:1;position:relative}.waves-panel svg{width:100%;height:auto;display:block}.waves-panel canvas{width:100%;height:260px;display:block}.waves-system-toggle{margin-bottom:var(--space-xs)}.waves-system-toggle .pill-group{justify-content:center;margin-bottom:0}.waves-system-toggle .pill{justify-content:center;align-items:center;min-height:44px;padding:.25rem .5rem;font-size:.75rem;display:flex}.waves-controls{gap:var(--space-md);margin-top:var(--space-md);flex-wrap:wrap;justify-content:center;align-items:center;display:flex}.waves-slider-group{align-items:center;gap:var(--space-sm);display:flex}.waves-slider-group input[type=range]{max-width:200px}@media (width<=1099px){.walk-circle-left{max-width:320px}}@media (width<=768px){.ratio-lock-layout{flex-direction:column}.ratio-lock-readouts{gap:var(--space-sm);flex-flow:wrap}.readout-row{flex:1;min-width:130px}.readout-value{font-size:1rem}.walk-circle-panels{flex-direction:column}.walk-circle-left{border-right:none;border-bottom:1px solid var(--rule);max-width:none}.walk-circle-right{min-width:auto;min-height:200px}.pyth-comparison{flex-direction:column;align-items:center}.pyth-arrows{justify-content:center;gap:var(--space-md);flex-direction:row}.pyth-arrow-row .arrow{transform:rotate(90deg)}.waves-panels{flex-direction:column}.waves-panel{min-height:200px}.waves-panel canvas{height:200px}.waves-controls{flex-direction:column;align-items:stretch}.waves-slider-group{justify-content:center}.waves-slider-group input[type=range]{flex:1;max-width:100%}}@media (prefers-reduced-motion:reduce){.walk-circle *,.ratio-lock *,.waves-from-circles *,.pyth-identity *{transition-duration:0s!important;animation-duration:0s!important}}