:root{font-family:Arial,Helvetica,sans-serif;color:#29383d;background:white;--positive:#c64e45;--negative:#147da2;--net:#986e13;--field:#087d86;--muted:#5c7279;--line:#d6e2e4}*{box-sizing:border-box;letter-spacing:0}body{margin:0}header,main{max-width:1450px;margin:auto;padding:20px 28px}header{display:flex;justify-content:space-between;align-items:center;gap:18px;border-bottom:2px solid #29383d}h1{font-size:26px;line-height:1.25;margin:7px 0 0}h2{font-size:18px;line-height:1.4;margin:0}h3{font-size:16px;line-height:1.5;margin:0 0 10px}a{color:#116d7a;text-underline-offset:3px}.series{font-size:13px;text-decoration:none;font-weight:600}.commands,.modes{display:flex;gap:8px;flex-wrap:wrap}.commands button{width:40px;height:40px}.modes{align-items:center;border-bottom:1px solid var(--line);padding-bottom:17px;margin-bottom:24px}.modes>span{margin-left:auto;color:var(--muted);font-size:12px;line-height:1.6}button,input,select{font:inherit}button{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:8px 10px;border:1px solid #b9cdd1;border-radius:4px;background:white;color:#29383d;cursor:pointer;min-height:38px}button:hover{background:#edf7f7}button svg{width:18px;height:18px;flex-shrink:0}button[aria-pressed=true]{background:var(--field);border-color:var(--field);color:white}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #b57c19;outline-offset:3px}.workspace{display:grid;grid-template-columns:250px minmax(0,1fr);gap:28px}aside{background:#f1f6f7;padding:17px;align-self:start;min-width:0}.field{display:grid;gap:8px;margin-bottom:17px;font-size:13px;font-weight:600;min-width:0}select,input[type=number]{width:100%;min-width:0;min-height:36px;padding:6px 8px;border:1px solid #adc5cd;border-radius:3px;background:white;font-size:14px;color:inherit}input[type=number]{appearance:textfield}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{appearance:none;margin:0}input[type=range]{width:100%;min-width:0;min-height:24px;margin:0 0 16px;accent-color:var(--field)}input[type=checkbox]{accent-color:var(--field);width:16px;height:16px;margin:0;flex-shrink:0}.toggle{display:flex;gap:8px;align-items:start;font-size:13px;line-height:1.5;margin:14px 0}.toggle input{margin-top:2px}.position,.pair-commands{display:grid;grid-template-columns:1fr 1fr;gap:12px}.pair-commands{gap:7px;margin-bottom:18px}.pair-commands button{font-size:12px;padding:8px 5px;gap:5px}.pair-commands svg{width:15px;height:15px}.experiment{min-width:0}.section-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:10px}.section-head>span{font-size:12px;line-height:1.6;color:var(--muted)}.formula{font:20px/1.6 Georgia,'Times New Roman',serif;color:#136d75;margin:10px 0 16px;overflow-wrap:anywhere}canvas{display:block;width:100%}#scene{aspect-ratio:1;height:auto;max-height:620px;touch-action:none;cursor:grab;background:#f8fafb}#scene:active{cursor:grabbing}.legend{display:flex;gap:8px 16px;flex-wrap:wrap;padding-top:10px;font-size:11px;line-height:1.8;color:var(--muted)}.legend span:before{content:'';display:inline-block;width:11px;height:3px;background:#29383d;margin:0 5px 3px 0}.legend .positive-key:before{background:var(--positive)}.legend .negative-key:before{background:var(--negative)}.legend .net-key:before{background:var(--net)}.legend .pair-key:before{background:#7168a6}.legend .field-key:before{background:var(--field)}.legend .probe-key:before{background:#29383d}.caption{font-size:13px;line-height:1.65;color:var(--muted);margin:10px 0 18px}.readouts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;border-block:1px solid var(--line);padding:14px 0;margin:14px 0 18px}.readouts dl{min-width:0;margin:0}.readouts dt{font-size:12px;line-height:1.5;color:var(--muted)}.readouts dd{font-size:20px;line-height:1.4;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;margin:6px 0 0}.results,.pair-band,.probe-band,.guide{border-top:1px solid var(--line);padding-top:24px;margin-top:28px}.table-scroll{position:relative;overflow-x:auto;margin-top:15px}table{width:100%;border-collapse:collapse;font-size:13px;line-height:1.5}th,td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;font-variant-numeric:tabular-nums}th{font-weight:600;color:var(--muted)}tfoot{font-weight:600}.pair-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(230px,1fr);gap:30px;margin-top:20px}#inverse{height:280px}.pair-details dl{display:grid;grid-template-columns:1fr 1fr;gap:12px;font-size:13px;line-height:1.5}.pair-details dt{color:var(--muted)}.pair-details dd{margin:0;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.probe-layout{display:grid;grid-template-columns:240px minmax(0,1fr);gap:28px;margin-top:20px}.probe-inputs{display:grid;gap:0;align-content:start}.probe-layout .readouts{margin-top:0}.color-key{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:11px;margin:14px 0;color:var(--muted)}.color-scale{height:9px;flex:1;min-width:80px;max-width:250px;background:linear-gradient(to right,#f3f7f8,#d5e7e6,#67adae,#e2cb73,#dd8272)}.guide>h2{margin-bottom:20px}.guide-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px 42px}.guide p{font-size:14px;line-height:1.75;margin:10px 0;color:#435b62}.guide .scope{border-top:1px solid var(--line);padding-top:18px;color:var(--muted);font-size:13px}footer{border-top:1px solid var(--line);padding-top:20px;margin-top:24px;font-size:12px;line-height:1.9}#error{color:#a12b20;font-size:13px;line-height:1.6}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}[hidden]{display:none!important}aside,#pair-controls{position:relative}
.vector-scale{display:flex;gap:10px;align-items:center;font-size:11px;color:var(--muted);margin-top:10px}.scale-line{display:inline-block;width:40px;height:6px;border:1px solid var(--net);border-block-width:0 1px;flex-shrink:0}
@media(max-width:1050px){header,main{padding:18px}.workspace{grid-template-columns:225px minmax(0,1fr);gap:20px}.readouts{gap:12px}.readouts dd{font-size:18px}.pair-layout{grid-template-columns:minmax(0,1.3fr) minmax(220px,1fr);gap:20px}.probe-layout{grid-template-columns:210px minmax(0,1fr);gap:20px}#scene{max-height:580px}}
@media(max-width:700px){header,main{padding:16px}header{align-items:start}h1{font-size:24px}.commands{flex-wrap:nowrap}.commands button{width:38px;height:40px}.modes{gap:7px}.modes>span{width:100%;margin:5px 0 0}.workspace{display:flex;flex-direction:column;gap:20px}.experiment{order:-1}.formula{font-size:18px}.readouts{gap:10px}.readouts dt{font-size:11px}.readouts dd{font-size:17px}#scene{min-height:310px;max-height:none}.section-head{gap:5px}aside{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;width:100%;padding:16px}aside>.field,aside>.position,#pair-controls,#force-controls,#field-controls,aside>.caption,#error{grid-column:1/-1}aside>label[for=charge],#charge-range{grid-column:auto}.position{gap:14px}#pair-controls{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px}#pair-controls>.pair-commands{grid-column:1/-1}.pair-commands button{font-size:14px;min-height:42px}select,input[type=number]{font-size:16px;min-height:40px}input[type=range]{min-height:30px}.pair-layout,.probe-layout,.guide-grid{grid-template-columns:1fr}.probe-inputs{grid-template-columns:1fr 1fr;gap:14px}.probe-inputs>.field:last-child{grid-column:1/-1}.table-scroll table{min-width:550px}th,td{font-size:12px;padding:9px 8px}.results,.pair-band,.probe-band,.guide{margin-top:24px}.pair-details dl{grid-template-columns:1fr 1fr}.color-scale{max-width:120px}.color-key{gap:8px}}
