:root{color-scheme:light;--ink:#182d3a;--muted:#657680;--line:#d9e2e6;--soft:#127f98;--hard:#b36623;--paper:#fff;--ground:#f3f6f8}*{box-sizing:border-box}body{margin:0;background:var(--ground);color:var(--ink);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:16px;line-height:1.45}header{max-width:1600px;margin:auto;padding:28px 36px 24px;display:flex;justify-content:space-between;align-items:center}.eyebrow{font-size:12px;letter-spacing:.16em;font-weight:700;color:var(--muted);margin:0 0 6px}h1{font-size:26px;font-weight:600;letter-spacing:-.025em;margin:0}h2{font-size:17px;font-weight:650;margin:0}h3{font-size:16px;margin:0;font-weight:650}p{margin:6px 0}.observation{display:flex;gap:9px;align-items:center;flex-wrap:wrap;font-variant-numeric:tabular-nums;font-size:14px}.observation small{display:block;width:100%;text-align:right;color:var(--muted);font-size:13px}.dot{height:7px;width:7px;border-radius:50%;background:var(--soft)}main{max-width:1600px;margin:0 auto;padding:0 36px;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:20px}main[hidden]{display:none}.plot-panel,.spectrum-panel,aside,.details-panel{background:var(--paper);border:1px solid var(--line);border-radius:6px}.plot-heading{display:flex;justify-content:space-between;align-items:center;padding:22px 24px 8px;gap:12px}.plot-heading p{font-size:13px;color:var(--muted);margin-bottom:0}.badge{font-size:12px;color:var(--soft);white-space:nowrap;font-variant-numeric:tabular-nums}.chart-wrap{position:relative;padding:0 12px;height:490px}canvas{display:block;width:100%;height:100%}#hid:focus-visible{outline:2px solid var(--soft);outline-offset:-5px}#tooltip{position:absolute;z-index:10;background:var(--ink);color:white;font-size:13px;padding:10px 13px;border-radius:4px;pointer-events:none;white-space:nowrap}.plot-footer{padding:8px 24px 18px;display:flex;justify-content:space-between;align-items:center;gap:10px;color:var(--muted);font-size:12px}.plot-footer label{display:flex;align-items:center;gap:5px}.time-key{display:flex;align-items:center;gap:7px}.time-key i{width:75px;height:5px;background:linear-gradient(90deg,#bedbe5,#174e79)}aside{padding:22px 22px 20px}.control-heading{display:flex;justify-content:space-between;align-items:center}.hint{font-size:13px;color:var(--muted);margin:8px 0 21px}.compact{margin:7px 0 18px}.band-control{margin:18px 0 22px;--band:var(--soft)}.band-control.hard{--band:var(--hard)}.band-title{display:flex;justify-content:space-between;align-items:center;color:var(--band);margin-bottom:10px}.band-title span{font-size:12px;color:var(--muted)}.number-pair{display:flex;align-items:center;justify-content:space-between;gap:5px;font-size:13px;color:var(--muted)}.number-pair label{display:flex;align-items:center;gap:5px}.number-pair input{width:69px;padding:5px 4px 5px 7px;border:1px solid var(--line);border-radius:4px;font:inherit;color:var(--ink);background:white;font-variant-numeric:tabular-nums}.window-track{height:30px;position:relative;margin-top:13px;touch-action:none;cursor:pointer}.rail{position:absolute;top:9px;height:12px;width:100%;background:#edf1f3;border-radius:3px}.window{position:absolute;top:6px;height:18px;background:color-mix(in srgb,var(--band) 25%,white);border:1px solid var(--band);cursor:grab;min-width:1px;touch-action:none}.window:active{cursor:grabbing}.handle{position:absolute;top:-5px;height:26px;width:11px;border:1px solid var(--band);border-radius:3px;background:var(--band);padding:0;cursor:ew-resize;touch-action:none}.handle.left{left:-6px}.handle.right{right:-6px}.handle:focus-visible{outline:2px solid var(--ink);outline-offset:3px}.ruler{display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}button{cursor:pointer;font:inherit}.plain{background:none;border:0;font-size:13px;color:var(--soft);padding:4px}.preset{font-size:13px;width:100%;padding:8px;border:1px solid var(--line);background:var(--ground);border-radius:4px;color:var(--ink)}button:hover{filter:brightness(.94)}.divider{border-top:1px solid var(--line);margin:22px 0 18px}.select-label{display:block;font-size:14px;margin-bottom:7px;font-weight:550}select{font:inherit;font-size:14px;padding:9px 10px;width:100%;border:1px solid var(--line);border-radius:4px;background:white;color:var(--ink)}.formula{display:flex;justify-content:space-between;align-items:center;margin-top:20px;font-size:13px;color:var(--muted);gap:10px}.formula strong{font-size:13px;color:var(--ink);font-weight:550}.spectrum-panel{min-width:0}#spectrum{height:235px}.segment-nav{display:flex;gap:5px}.segment-nav button{background:var(--ground);border:1px solid var(--line);border-radius:4px;padding:4px 10px;color:var(--ink)}.spectrum-footer{padding:4px 24px 18px;display:flex;justify-content:space-between;gap:10px;font-size:12px;color:var(--muted)}.soft-label{color:var(--soft);font-weight:500}.hard-label{color:var(--hard);font-weight:500}.details-panel{padding:22px;font-size:13px;color:var(--muted)}.details-panel h2{color:var(--ink)}dl{margin:14px 0}dl div{display:flex;justify-content:space-between;gap:12px;padding:4px 0}dd{margin:0;color:var(--ink);text-align:right;font-variant-numeric:tabular-nums}details{border-top:1px solid var(--line);padding:12px 0;margin-top:12px}summary{cursor:pointer;color:var(--ink)}#method p{margin:12px 0}.details-panel a{color:var(--soft);font-size:13px}footer{max-width:1600px;margin:22px auto;padding:0 36px;display:flex;justify-content:space-between;gap:10px;font-size:12px;color:var(--muted)}footer code{font-size:12px}#loading{max-width:1528px;margin:0 auto;padding:30px;background:white;border:1px solid var(--line);border-radius:6px}input:focus,select:focus{outline:2px solid var(--soft);outline-offset:2px}@media(min-width:1500px){.chart-wrap{height:540px}}@media(max-width:1050px){main{grid-template-columns:minmax(0,1fr) 300px;padding:0 20px;gap:14px}header{padding:22px 20px}aside{padding:18px 16px}.chart-wrap{height:470px}.plot-footer{flex-wrap:wrap}.number-pair input{width:61px}.spectrum-footer{flex-wrap:wrap}}@media(max-width:760px){header{align-items:flex-start;gap:20px}h1{font-size:22px}.observation{justify-content:flex-end}main{grid-template-columns:1fr}.plot-panel{grid-row:2}aside{grid-row:1;display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.control-heading,.hint,.preset,.divider,.formula{grid-column:1/-1}.band-control{min-width:0}.band-title{flex-wrap:wrap}.number-pair{flex-wrap:wrap}.number-pair input{width:65px}.compact{grid-column:1/-1}.select-label{grid-column:1}aside select{grid-column:2;margin-bottom:10px}.chart-wrap{height:410px}.spectrum-panel{grid-row:3}.details-panel{grid-row:4}.plot-heading{padding:18px 16px 8px}.spectrum-footer{padding:4px 16px 16px}.plot-footer{padding:8px 16px 16px}footer{padding:0 20px;flex-direction:column}.observation small{font-size:11px}}

#observation-legend{display:flex;flex-wrap:wrap;gap:8px 18px;padding:0 24px 12px;font-size:12px;color:var(--muted)}.legend-item{display:inline-flex;align-items:center;gap:7px;font-variant-numeric:tabular-nums}.legend-swatch{display:inline-block;width:9px;height:9px;border-radius:50%}.flip-control{display:flex;align-items:center;gap:8px;font-size:14px;margin-top:20px;grid-column:1/-1}.flip-control input{accent-color:var(--soft)}

.ruler{position:relative;height:16px;display:block}.ruler span{position:absolute;transform:translateX(-50%)}.ruler span:first-child{left:0;transform:none}.ruler span:last-child{right:0;transform:none}

#swan-layer{position:absolute;inset:0 12px;width:calc(100% - 24px);height:100%;z-index:4;pointer-events:none}.swan-heading,.snail-heading{display:flex;align-items:center;justify-content:space-between}.swan-heading label,.snail-heading label{display:flex;align-items:center;gap:7px;font-size:14px}.swan-heading input,.snail-heading input{accent-color:var(--soft)}#swan-controls,#snail-controls{border:0;margin:12px 0 0;padding:0;min-width:0}#swan-controls:disabled,#snail-controls:disabled{opacity:.48}#swan-controls select{margin-bottom:0}

.axis-card{border:1px solid var(--line);border-radius:5px;padding:13px;margin:0 0 14px}.axis-heading{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center}.axis-heading select{padding:7px 9px}.axis-formula{font-size:12px;color:var(--muted);line-height:1.35}.axis-card .band-control{margin:14px 0 17px}.band-control.rate{--band:#6558a6}#spectrum{height:270px}
#observation-legend .legend-item{cursor:pointer}#observation-legend .legend-item input{margin:0;accent-color:var(--soft)}#observation-legend .legend-item:has(input:not(:checked)){opacity:.45;text-decoration:line-through}
.advanced-settings{margin-top:20px;border-top:1px solid var(--line);padding-top:14px}.advanced-settings summary{font-size:14px;font-weight:600;cursor:pointer;color:var(--ink)}.advanced-content{padding-top:16px}.advanced-content .divider{margin:20px 0 18px}.advanced-content .flip-control{margin-top:16px}
@media(max-width:760px){aside{display:block}.axis-card{margin-bottom:14px}}