:root{color-scheme:light;--bg:#f5f8f7;--card:#fff;--fg:#223b36;--muted:#627771;--line:#d8e4df;--grid:#e9efec;--accent:#148669;--source:#7763aa;--source-alt:#c4772f;--target:#c04e42;--theory:#087a63;--helper:#78918a;--warn:#865413;--warn-bg:#fff6e8;--soft:#e8f4ee;font:16px/1.65 system-ui,"Microsoft YaHei",sans-serif}
html[data-theme=dark]{color-scheme:dark;--bg:#131e1b;--card:#1d2b26;--fg:#e3f0e9;--muted:#a9beb4;--line:#395147;--grid:#2a3e35;--accent:#6acbae;--source:#b9a8eb;--source-alt:#f0aa76;--target:#ff8d82;--theory:#6ce1bd;--helper:#8fa9a0;--warn:#ffd296;--warn-bg:#3b3021;--soft:#29483b}
*{box-sizing:border-box}body{margin:0;padding:16px;background:var(--bg);color:var(--fg)}main{max-width:1180px;margin:auto;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:22px}h1{font-size:1.45rem;line-height:1.4;margin:0}.lede{margin:7px 0 18px;color:var(--muted)}button,input{font:inherit}button{border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--fg);padding:8px 12px;cursor:pointer;min-height:44px}button:hover{border-color:var(--accent);background:var(--soft)}button:focus-visible,input:focus-visible,a:focus-visible,summary:focus-visible,[role=tabpanel]:focus-visible{outline:3px solid var(--accent);outline-offset:3px}a{color:var(--accent);text-underline-offset:3px}.tabs{display:flex;gap:8px;border-bottom:1px solid var(--line);padding:0 0 14px;overflow:auto;scrollbar-width:thin}.tabs button{font-size:.86rem;flex:0 0 auto;max-width:245px;text-align:left}.tabs [aria-selected=true]{background:var(--soft);border-color:var(--accent);color:var(--accent);font-weight:700}#problem{margin:16px 0}.workspace{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(260px,1fr);gap:22px;align-items:start}.figure{min-width:0;border:1px solid var(--line);border-radius:12px;padding:10px;background:var(--bg)}#plot{display:block;width:100%;height:auto;touch-action:pan-y}.legend{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;font-size:.82rem;color:var(--muted)}.legend span:before{content:"";display:inline-block;width:19px;border-top:3px solid;margin:0 6px 3px 0}.curve-key:before{color:var(--accent)}.source-key:before{color:var(--source)}.target-key:before{color:var(--target)}.theory-key:before{color:var(--theory);border-top-style:dotted!important}#view-note{font-size:.8rem;color:var(--muted);margin:7px 0 0;text-align:center;min-height:1.3em}aside{min-width:0}.control{margin-bottom:14px}.control-heading{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:4px}.control label{font-weight:600}.control input[type=number]{width:105px;min-height:40px;border:1px solid var(--line);border-radius:6px;background:var(--bg);color:var(--fg);padding:4px 7px}.control input[type=range]{width:100%;accent-color:var(--accent);min-height:30px}.presets,.actions{display:flex;flex-wrap:wrap;gap:7px}.presets button,.actions button{font-size:.84rem}.options{display:grid;grid-template-columns:1fr;gap:7px;margin:14px 0}.options label{display:flex;align-items:center;gap:7px;font-size:.9rem}.options input{width:18px;height:18px;accent-color:var(--accent)}[hidden]{display:none!important}#source-link{display:inline-block;margin-top:12px;font-size:.9rem}.status{background:var(--soft);border-left:3px solid var(--accent);padding:10px 14px;margin:18px 0 12px;border-radius:6px;font-size:.95rem}.status.warning{background:var(--warn-bg);border-color:var(--warn);color:var(--warn)}.readouts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.metric{padding:12px;border:1px solid var(--line);border-radius:10px;min-width:0}.metric h2{font-size:.82rem;color:var(--muted);font-weight:500;margin:0 0 4px}.metric output{font-size:1.1rem;font-weight:650;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}.metric p{font-size:.78rem;color:var(--muted);margin:4px 0 0}.coordinates{margin-top:14px;font-size:.88rem}summary{cursor:pointer;color:var(--muted)}dl{display:grid;grid-template-columns:auto 1fr;gap:3px 14px;font-variant-numeric:tabular-nums}dt{font-weight:700}dd{margin:0;overflow-wrap:anywhere}.formula{margin:14px 0;padding:10px;background:var(--bg);border-radius:8px;overflow:auto;font-size:.95rem}.footnote{margin:12px 0 0;color:var(--muted);font-size:.82rem}.plot-label,.theory-label{paint-order:stroke;stroke:var(--bg);stroke-width:5px;stroke-linejoin:round;fill:var(--fg);font-weight:650}.theory-label{fill:var(--theory)}.grid-label{fill:var(--muted)}.right-angle{fill:var(--source);font-weight:700}
@media(max-width:960px){.workspace{grid-template-columns:1fr}.readouts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){body{padding:8px}main{padding:14px;border-radius:12px}h1{font-size:1.16rem}.workspace{gap:12px}.readouts{grid-template-columns:1fr 1fr;gap:7px}.metric{padding:9px}.metric output{font-size:1rem}.formula{font-size:.8rem}.legend{font-size:.76rem;gap:8px}.tabs button{max-width:210px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

main[data-demo-layout="parametric-equations-1-lines-circles"] .demo-readings .readouts{grid-template-columns:minmax(0,1fr);gap:3px}main[data-demo-layout="parametric-equations-1-lines-circles"] .metric{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:4px 8px;padding:2px 8px}main[data-demo-layout="parametric-equations-1-lines-circles"] .metric h2{margin:0}main[data-demo-layout="parametric-equations-1-lines-circles"] .metric output{text-align:right}.control select{display:block;width:100%;min-height:40px;margin-top:4px;padding:5px;border:1px solid var(--line);border-radius:6px;font:inherit;background:var(--bg);color:var(--fg);max-width:100%}
