:root{font:14px system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#293c40;background:#fff;--ink:#293c40;--teal:#258a82;--coral:#d6524a;--amber:#b1851e;--line:#dae5e3}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,select{cursor:pointer}a{color:#287c75;text-underline-offset:3px}header{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:17px 25px;border-bottom:1px solid var(--line)}h1{font-size:25px;font-weight:650;margin:3px 0 0;letter-spacing:0}h2{font-size:14px;font-weight:650;margin:0;letter-spacing:0}.library{font-size:12px;text-decoration:none}.identity{font:19px Georgia,serif}.identity span{padding:0 10px;color:#7d8b88}main{display:grid;grid-template-columns:255px minmax(0,1fr)}aside{background:#f4f7f7;border-right:1px solid var(--line);padding:18px}.field-choice{display:grid;gap:7px;font-weight:600}select{padding:8px;border:1px solid #b5cbc7;border-radius:3px;background:white;color:var(--ink);min-width:0;max-width:100%}.formula{min-height:65px;font:16px Georgia,serif;line-height:1.55;padding:15px 0 5px;overflow-wrap:anywhere}.field{margin:13px 0}.field-head{display:flex;justify-content:space-between;align-items:center;gap:6px}.field-head label{font-size:12px;color:#52706a}.field-head input{width:70px;text-align:right;background:white;border:1px solid #b8cdc7;border-radius:3px;padding:5px;color:var(--ink);font-variant-numeric:tabular-nums}input[type=range]{width:100%;min-height:22px;accent-color:#2e867b;margin-top:6px;cursor:pointer}.direction-tools{display:flex;align-items:center;gap:6px;margin:10px 0 18px}.direction-tools span{font-size:12px;color:#777668;padding-left:4px}.icon{width:32px;height:32px;border:1px solid #bdd1cb;border-radius:4px;display:grid;place-items:center;background:white;color:#327c71}.icon:hover{background:#edf5f2}.icon:disabled{opacity:.4;cursor:not-allowed}.icon svg{width:17px;height:17px}.tools{display:flex;align-items:center;gap:5px}.toggles{display:grid;gap:8px;border-top:1px solid var(--line);padding-top:14px;font-size:12px}.toggles label{display:flex;align-items:center;gap:7px}.toggles input{accent-color:#327c71;width:15px;height:15px;margin:0}.walking{margin-top:20px;padding-top:15px;border-top:1px solid var(--line)}.modes{display:flex;border:1px solid #abc7c0;border-radius:4px;overflow:hidden;margin:12px 0}.modes button{flex:1;border:0;background:transparent;color:#3b615b;padding:8px}.modes button[aria-pressed=true]{background:#327c71;color:white}#play{background:#327c71;border-color:#327c71;color:white}#step-count{font-size:11px;margin-left:auto;color:#687e77;font-variant-numeric:tabular-nums}#status{display:block;color:#7b745f;font-size:11px;min-height:30px;margin-top:12px}.workspace{min-width:0}.views{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(0,1fr)}.surface-view,.contour-view{min-width:0}.surface-view{background:#eff5f4}.contour-view{background:#fff}.view-head{display:flex;justify-content:space-between;align-items:center;gap:10px;height:54px;padding:11px 20px}.view-head h2{white-space:nowrap}#point-label{font-size:11px;color:#6b817b;font-variant-numeric:tabular-nums}#scene{height:365px;position:relative;overflow:hidden}#scene>canvas{display:block;width:100%;height:100%;touch-action:none}#fallback{position:absolute;inset:0;display:grid;place-content:center;padding:25px;text-align:center}#fallback[hidden]{display:none}#contours{display:block;width:100%;height:365px;touch-action:none;cursor:crosshair}.view-caption{display:flex;justify-content:flex-start;flex-wrap:wrap;gap:5px 12px;padding:8px 20px 14px;font-size:10px;min-height:38px;color:#6a837b}.view-caption span:last-child{margin-left:auto}.coral{color:var(--coral)}.amber{color:var(--amber)}.teal{color:var(--teal)}.muted{color:#7a8c86}.readouts{display:grid;grid-template-columns:.8fr 1.3fr .9fr 1fr;gap:15px;padding:21px 24px;border-top:1px solid var(--line)}.readouts span{font-size:11px;display:block;color:#6e837c;margin-bottom:5px}.readouts strong{font-size:18px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}.plots{display:grid;grid-template-columns:1fr 1fr;gap:25px;padding:6px 24px}.plot{min-width:0}.plot canvas{height:204px;width:100%;display:block}.legend{display:flex;gap:14px;align-items:center;font-size:11px;min-height:25px;flex-wrap:wrap}.legend span:not(.muted):before{content:"";display:inline-block;background:currentColor;width:8px;height:2px;vertical-align:middle;margin-right:4px}.notes{display:flex;flex-wrap:wrap;gap:10px 20px;font-size:11px;color:#6e837c;padding:12px 24px 23px}#direction-state{color:#8b6722}#error{background:#fff1ec;color:#a33b2e;padding:12px;margin:10px 24px}footer{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding:15px 25px;border-top:1px solid var(--line);font-size:11px;color:#71857d}footer nav{display:flex;flex-wrap:wrap;gap:14px}.footer-actions{display:flex;align-items:center;gap:15px}button:focus-visible,input:focus-visible,select:focus-visible,canvas:focus-visible{outline:2px solid #b78438;outline-offset:2px}
@media(min-width:1600px){#scene,#contours{height:425px}.plot canvas{height:240px}}
@media(max-width:1100px){main{grid-template-columns:230px minmax(0,1fr)}.views{grid-template-columns:1fr 1fr}#scene,#contours{height:320px}.readouts{grid-template-columns:1fr 1fr}.view-head{padding:10px 13px}.view-caption{padding:8px 13px;min-height:52px}.identity{font-size:16px}.readouts strong{font-size:17px}}
@media(max-width:760px){header{display:block;padding:15px 16px}.identity{margin-top:7px;font-size:15px}h1{font-size:23px}main{display:flex;flex-direction:column}.workspace{display:contents}.views{display:contents}.surface-view{order:0}.contour-view{order:2}aside{order:1;border-right:0;border-bottom:1px solid var(--line);padding:16px}#fields{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.formula{min-height:0;padding:10px 0;font-size:15px}.field{margin:7px 0}.field-head input{width:67px;font-size:12px}.field-head label{font-size:11px}.direction-tools{margin:8px 0 12px}.toggles{display:flex;flex-wrap:wrap;gap:14px}.walking{margin-top:14px;padding-top:12px;display:grid;grid-template-columns:1fr 1fr;gap:8px 14px}.walking h2{grid-column:1/-1}.modes{margin:0}.walking #status{grid-column:1/-1;min-height:0;margin:0}.tools .icon{width:30px;height:30px}.readouts{order:3;padding:16px;gap:16px}.plots{order:4;grid-template-columns:1fr;padding:8px 16px;gap:18px}.notes{order:5;padding:12px 16px 20px}#error{order:6}.view-head{padding:10px 16px}#scene{height:310px}#contours{height:350px}.view-caption{padding:8px 16px;min-height:40px}.plot canvas{height:210px}footer{padding:14px 16px}.readouts strong{font-size:16px}.footer-actions{flex-wrap:wrap}}
@media(max-width:760px){#gradient{font-size:14px}}