:root{color-scheme:light dark;--bg:#f4f7fb;--fg:#142438;--card:#fff;--line:#637287;--accent:#005a9c;--muted:#35465a;--red:#a82b22}
@media(prefers-color-scheme:dark){:root{--bg:#101923;--fg:#ecf2fa;--card:#1a2838;--line:#9baec5;--accent:#7dc7ff;--muted:#c0cddd;--red:#ffafa5}}
:root[data-theme=light]{color-scheme:light;--bg:#f4f7fb;--fg:#142438;--card:#fff;--line:#637287;--accent:#005a9c;--muted:#35465a;--red:#a82b22}
:root[data-theme=dark]{color-scheme:dark;--bg:#101923;--fg:#ecf2fa;--card:#1a2838;--line:#9baec5;--accent:#7dc7ff;--muted:#c0cddd;--red:#ffafa5}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font:17px/1.65 system-ui,sans-serif}main{max-width:1080px;margin:auto;padding:16px}h1{font-size:1.65rem;line-height:1.3}h2{font-size:1.2rem}section,details{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px;margin:16px 0;min-width:0}.grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.controls label{display:block;margin-top:12px}input,select,button{font:inherit;max-width:100%;color:var(--fg);background:var(--card);border:1px solid var(--line);border-radius:6px;padding:6px}button{cursor:pointer;margin:5px 3px 5px 0}input[type=range]{display:block;width:100%;padding:4px 0;accent-color:var(--accent)}input[type=number]{width:100%}:focus-visible{outline:3px solid var(--accent);outline-offset:2px}svg{display:block;width:100%;height:auto;border:1px solid var(--line);background:var(--card)}svg text{font:17px system-ui;fill:var(--fg)}.axis{stroke:var(--line);stroke-width:1}.triangle{fill:none;stroke:var(--fg);stroke-width:2}.vector{stroke:var(--accent);stroke-width:2}.altitude{stroke:var(--red);stroke-width:1.5;stroke-dasharray:5 4}.circle{fill:none;stroke:var(--accent);stroke-width:2}.vertex{fill:var(--accent)}.center{fill:var(--red)}.muted{color:var(--muted)}.math{overflow-wrap:anywhere;font-family:system-ui,sans-serif}#readout{white-space:pre-line;overflow-wrap:anywhere}summary{font-weight:700;cursor:pointer}.tag{font-size:.9rem;color:var(--muted)}#feedback{min-height:3.3em}table{width:100%;border-collapse:collapse;font-size:.95rem}th,td{border:1px solid var(--line);padding:6px;text-align:left;overflow-wrap:anywhere}li{margin:8px 0}@media(max-width:720px){.grid{display:block}main{padding:10px}section,details{padding:12px}h1{font-size:1.4rem}}