:root{color-scheme:dark}
.crossplot-page{background:radial-gradient(ellipse at 75% 10%,#08202c 0,#020b12 45%,#02090e 100%);min-height:100vh}
.crossplot-page button,.crossplot-page select{font:inherit}
.crossplot-page button{cursor:pointer}
.crossplot-page [hidden]{display:none!important}
.tool-shell{padding-top:29px;padding-bottom:36px}
.breadcrumb{display:flex;align-items:center;gap:12px;font-size:12px;color:#78909c}
.breadcrumb a{color:#9fb6c0;text-decoration:none}.breadcrumb a:hover{color:var(--cyan)}
.tool-intro{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:34px 0 32px}
.tool-intro .eyebrow{font-size:10px;margin-bottom:14px;letter-spacing:.2em;color:#88a5b3}
.tool-intro h1{font-size:clamp(38px,4.3vw,60px);font-weight:600;line-height:1.03;letter-spacing:-.045em;margin:0 0 14px}
.tool-intro p{color:#9eb4bf;font-size:15px;line-height:1.6;margin:0}
.version-tag{display:flex;align-items:center;gap:14px;border:1px solid #4b402a;padding:10px 13px;border-radius:5px;color:#bfa778;font:10px 'Space Mono',monospace;letter-spacing:.08em;white-space:nowrap}
.version-tag b{color:#dfc18a;border-left:1px solid #4b402a;padding-left:12px;font-size:13px}
.workspace{display:grid;grid-template-columns:306px minmax(0,1fr);gap:22px;align-items:start}
.controls,.plot-panel{border:1px solid #193744;border-radius:12px;background:linear-gradient(145deg,rgba(7,24,34,.94),rgba(3,15,23,.98));overflow:hidden}
.controls{box-shadow:0 15px 45px #00000014}
.control-section{padding:23px}.control-section+.control-section{border-top:1px solid var(--line)}
.control-heading{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:20px;min-height:25px}
.control-heading h2{font-size:14px;font-weight:600;display:flex;gap:11px;align-items:center;margin:0}
.control-heading h2>span{font:10px 'Space Mono',monospace;color:#62848f}
.small-tag{font:9px 'Space Mono',monospace;letter-spacing:.1em;color:#86a0aa;border:1px solid #203f4c;padding:4px 6px;border-radius:3px}
.drop-zone{border:1px dashed #285768;border-radius:8px;background:linear-gradient(150deg,#09303b40,#06162188);padding:22px 12px 18px;text-align:center;transition:border-color .15s,background .15s}
.drop-zone.dragging{border-color:var(--cyan);background:#0b3a4770}
.upload-icon{width:30px;height:30px;color:#40d2df;display:block;margin:0 auto 13px}
.drop-zone strong{display:block;font-size:13px;font-weight:500;color:#e0eef3}
.drop-detail{display:block;font-size:10px;color:#7695a3;line-height:1.7;margin:7px 0 16px}
.choose-file{justify-content:center;padding:11px 14px;gap:18px;font-size:12px!important;border-radius:5px;min-height:40px;box-shadow:none}
.choose-file:disabled{opacity:.65;cursor:wait}
.text-button{padding:0;border:0;background:none;color:#86afbb;font-size:11px!important;line-height:1.6;text-align:left}
.text-button:hover{color:var(--cyan)}
.demo-button{margin-top:14px;width:100%;text-align:center}.demo-button span{padding-left:5px;color:var(--cyan)}
.file-details{margin-top:21px;border-top:1px solid var(--line);padding-top:16px}
.file-name-row{display:flex;gap:8px;align-items:center;min-width:0}.file-name-row>#file-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;color:#c1d5de}
.file-type-icon{font:8px 'Space Mono',monospace;border:1px solid #245565;border-radius:3px;padding:5px 4px;color:var(--cyan)}
.sample-tag{font:8px 'Space Mono',monospace;color:#d4b678;margin-left:auto}
.file-details dl{margin:17px 0 7px;font-size:11px}.file-details dl>div{display:flex;justify-content:space-between;gap:12px;margin:10px 0;line-height:1.5}
.file-details dt{color:#7896a3;flex-shrink:0}.file-details dd{margin:0;color:#cbdde4;text-align:right;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}.file-details .well-row{display:block}.file-details .well-row dd{text-align:left;margin-top:3px;font-size:13px}
.clear-button{color:#6f929f;font-size:10px!important;margin-top:5px}
.icon-button{width:29px;height:26px;border:1px solid #28505e;border-radius:4px;background:#091f2b;color:#a8d2df;line-height:1}
.icon-button:hover:not(:disabled){border-color:var(--cyan);color:var(--cyan)}
.icon-button:disabled,.reset-button:disabled{opacity:.35;cursor:default}
.axis-field+.axis-field{margin-top:20px}
.axis-field label{display:flex;align-items:center;gap:9px;color:#a7bec8;font-size:11px;margin-bottom:10px}
.axis-badge{font:10px 'Space Mono',monospace;color:var(--cyan);background:#072d3a;border:1px solid #195066;width:22px;height:22px;border-radius:4px;display:inline-flex;align-items:center;justify-content:center}
.axis-y{color:#d3b46f;border-color:#4a402a;background:#2a251b}
.axis-field select{width:100%;max-width:100%;min-height:42px;border:1px solid #264653;border-radius:5px;background:#071821;color:#e3eef3;font-size:12px;padding:0 10px;outline-offset:3px;text-overflow:ellipsis}
.axis-field select:focus{outline:1px solid var(--cyan)}
.axis-field select:disabled{opacity:.46;cursor:not-allowed}
.curve-description{font-size:10px;color:#7595a3;line-height:1.55;margin:8px 0 0;min-height:16px;overflow-wrap:anywhere}
.unit-note{font-size:10px;line-height:1.65;color:#617f8f;margin:21px 0 0}
.local-note{border-top:1px solid var(--line);padding:18px 22px;display:flex;align-items:flex-start;gap:10px;font-size:10px;line-height:1.7;color:#7b98a5;background:#03111a66}
.local-note svg{flex-shrink:0;width:17px;height:17px;margin-top:2px;color:#5e9b9e}
.plot-panel{min-width:0;background:#03111b;box-shadow:0 25px 60px #00000020}
.plot-toolbar{min-height:84px;display:flex;align-items:center;justify-content:space-between;padding:18px 24px;gap:14px;border-bottom:1px solid var(--line);background:linear-gradient(100deg,#08212f,#051520)}
.plot-title{display:flex;gap:12px;align-items:center;min-width:0}.plot-title>div{min-width:0}
.status-dot{width:6px;height:6px;background:#426371;border-radius:50%;flex-shrink:0}.status-dot.loaded{background:var(--cyan);box-shadow:0 0 10px #04d6ea55}
.plot-title h2{font-size:15px;letter-spacing:-.01em;font-weight:500;margin:0;overflow-wrap:anywhere}
.plot-title p{font:10px 'Space Mono',monospace;color:#6f99a9;margin:7px 0 0;overflow-wrap:anywhere}
.reset-button{display:inline-flex;align-items:center;gap:7px;padding:9px 10px;font-size:10px!important;white-space:nowrap;background:#071d28;color:#9bbdc9;border:1px solid #24424f;border-radius:5px}
.reset-button svg{width:15px;height:15px}.reset-button:hover:not(:disabled){color:var(--cyan);border-color:#367086}
.chart-stage{position:relative;height:510px;min-width:0;overflow:hidden;background:radial-gradient(ellipse at 65% 45%,#061b2855,transparent 70%)}
.chart-stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
#interaction-canvas{touch-action:none;cursor:crosshair}
.empty-state{position:absolute;top:50%;left:50%;width:min(410px,85%);transform:translate(-50%,-50%);padding:20px 8px;text-align:center;pointer-events:none;background:radial-gradient(ellipse,#04131df2,#04131db8 55%,transparent 73%)}
.empty-icon{width:69px;height:69px;color:#2b778a;margin:0 auto 13px}.empty-icon circle{fill:#13b2c9;opacity:.75}
.empty-state h3{font-size:20px;font-weight:500;color:#c8dde6;margin:0 0 13px;letter-spacing:-.025em}
.empty-state p{color:#7898a8;font-size:12px;line-height:1.9;margin:0}
.empty-state>span{display:block;font:8px 'Space Mono',monospace;letter-spacing:.17em;color:#4e7282;margin-top:25px}
.plot-tooltip{position:absolute;z-index:5;pointer-events:none;min-width:170px;max-width:calc(100% - 20px);padding:12px 14px;background:#0b202df5;border:1px solid #2f5a6b;box-shadow:0 8px 24px #0007;border-radius:6px;font:10px 'Space Mono',monospace;color:#c2dde7;line-height:1.8;overflow-wrap:anywhere}
.plot-tooltip strong{display:block;color:var(--cyan);font-weight:400;margin-bottom:6px}.plot-tooltip span{display:block}
.plot-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 22px;color:#658896;font-size:9px;line-height:1.6;border-top:1px solid #102b39}
.legend{display:flex;align-items:center;gap:8px;min-width:0;color:#9dbcc9;overflow-wrap:anywhere}.legend i{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--cyan);flex-shrink:0}
.plot-summary{padding:19px 22px;display:flex;gap:24px;align-items:center;background:#061923;border-top:1px solid #163442;font-size:10px;color:#7596a5;line-height:1.7}
.plot-summary b{color:#cee5ee;font-size:12px;font-weight:500;margin-right:4px;font-variant-numeric:tabular-nums}
.linear-label{font:8px 'Space Mono',monospace;letter-spacing:.1em;color:#547c8f;margin-left:auto;white-space:nowrap}
.below-workspace{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-top:22px;font-size:10px;color:#527686;line-height:1.6}
.below-workspace a{color:#779ea9;text-decoration:none}.below-workspace a:hover{color:var(--cyan)}.below-workspace a span{margin-left:6px}
.notice{border:1px solid;padding:13px 17px;border-radius:7px;font-size:12px;line-height:1.65;margin-bottom:18px;overflow-wrap:anywhere}
.notice.error{background:#341a1c;color:#ffc4bb;border-color:#6b3638}
.notice.warning{background:#262416;color:#dbcb95;border-color:#51472c;margin:18px 0 0}.notice.warning ul{padding-left:20px;margin:5px 0 0}
.tool-footer{font-size:10px;margin-top:0}.tool-footer em{font-size:16px}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:absolute;z-index:100;top:-70px;left:20px;padding:12px 20px;background:var(--cyan);color:#001018;border-radius:4px;text-decoration:none}.skip-link:focus{top:10px}
@media(min-width:1600px){.chart-stage{height:565px}}
@media(max-width:1150px){.workspace{grid-template-columns:280px minmax(0,1fr);gap:18px}.control-section{padding:20px}.plot-toolbar{padding:18px}.plot-footer{align-items:flex-start;flex-direction:column;padding:13px 18px;gap:5px}.plot-summary{padding:16px 18px;gap:15px}.linear-label{display:none}.chart-stage{height:485px}}
@media(max-width:850px){.workspace{grid-template-columns:1fr}.controls{display:grid;grid-template-columns:1fr 1fr}.control-section+.control-section{border-top:0;border-left:1px solid var(--line)}.local-note{grid-column:1/-1;align-items:center;padding:13px 20px}.local-note br{display:none}.chart-stage{height:500px}.plot-footer{flex-direction:row;align-items:center}.version-tag{padding:8px 10px;font-size:9px}.tool-intro{padding-top:30px}.tool-shell{padding-left:24px;padding-right:24px}}
@media(max-width:520px){.tool-shell{padding:22px 16px 25px}.tool-intro{align-items:flex-start;padding:29px 0 25px}.tool-intro p{font-size:12px;max-width:250px}.tool-intro h1{font-size:44px}.tool-intro .eyebrow{font-size:8px;letter-spacing:.16em}.version-tag{font-size:0;gap:0;padding:7px 9px;margin-top:28px}.version-tag b{border:0;padding:0;font-size:11px}.controls{grid-template-columns:1fr}.control-section+.control-section{border-left:0;border-top:1px solid var(--line)}.control-section{padding:20px}.control-heading{margin-bottom:15px}.drop-zone{padding:18px 12px}.upload-icon{margin-bottom:10px;width:25px;height:25px}.axes-section{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 15px}.axes-section .control-heading,.unit-note{grid-column:1/-1}.axis-field+.axis-field{margin-top:0}.axis-field label{font-size:10px;gap:6px}.axis-field select{font-size:11px;padding:0 6px}.axis-badge{width:20px;height:20px}.curve-description{font-size:9px}.unit-note{margin-top:12px;font-size:9px}.local-note{font-size:9px;padding:13px 20px}.plot-toolbar{padding:16px 13px;gap:8px;min-height:77px}.plot-title{gap:8px}.plot-title h2{font-size:13px}.plot-title p{font-size:9px}.reset-button{font-size:9px!important;padding:8px}.chart-stage{height:420px}.empty-state h3{font-size:17px}.empty-state p{font-size:11px}.empty-state>span{font-size:7px}.plot-footer{padding:12px 14px;flex-direction:column;align-items:flex-start;font-size:9px}.plot-summary{padding:14px;gap:13px;font-size:9px;flex-wrap:wrap}.plot-summary b{font-size:11px}.below-workspace{align-items:flex-start;flex-direction:column;gap:8px;font-size:9px}.tool-footer{padding:24px 20px;gap:12px}.file-details dl>div{margin:7px 0}}
@media(prefers-reduced-motion:reduce){.drop-zone{transition:none}}

/* Version 2: axis scale controls. Existing page styling is unchanged. */
.axis-scale-form{padding:17px 24px;border-bottom:1px solid var(--line);background:#051722}
.axis-scale-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr));gap:17px 22px}
.axis-scale-grid fieldset{min-width:0;margin:0;padding:0;border:0}
.axis-scale-grid legend{display:flex;align-items:center;gap:8px;margin:0 0 10px;padding:0;color:#a7bec8;font-size:11px}
.axis-scale-inputs{display:grid;grid-template-columns:minmax(100px,1.25fr) repeat(2,minmax(0,1fr));gap:8px}
.axis-scale-inputs label{display:flex;flex-direction:column;gap:6px;font-size:10px;color:#7896a3;min-width:0}
.axis-scale-inputs select,.axis-scale-inputs input{font:11px Inter,system-ui,sans-serif;width:100%;min-width:0;min-height:35px;padding:7px 8px;border:1px solid #264653;border-radius:5px;background:#071821;color:#e3eef3;outline-offset:3px}
.axis-scale-inputs input::placeholder{color:#648391;opacity:1}
.axis-scale-inputs input:focus,.axis-scale-inputs select:focus{outline:1px solid var(--cyan)}
.axis-scale-grid fieldset:disabled{opacity:.46}
.axis-scale-actions{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin-top:14px}
.axis-scale-actions p{flex:1 1 180px;margin:0 0 0 3px;font-size:9px;color:#7595a3;line-height:1.6}
.apply-scales{color:#b1e7ed;border-color:#276173;background:#082b36}
.axis-scale-error{font-size:11px;line-height:1.6;margin:12px 0 0;color:#ffc4bb}
.plot-summary.has-log{flex-wrap:wrap;gap:8px 20px}
@media(max-width:520px){.axis-scale-form{padding:16px 13px}.axis-scale-actions p{flex-basis:100%;margin:2px 0 0}}

/* Version 4: point appearance controls. */
.point-style-controls{padding:15px 24px;border-bottom:1px solid var(--line);background:#04151f}
.point-style-grid{display:grid;grid-template-columns:minmax(100px,1fr) minmax(75px,.55fr) minmax(110px,1fr) auto;align-items:end;gap:12px}
.point-style-grid>label,.point-colour-field{display:flex;flex-direction:column;gap:6px;min-width:0;font-size:10px;color:#7896a3}
.point-style-grid select,.point-style-grid input[type=number]{font:11px Inter,system-ui,sans-serif;width:100%;min-width:0;min-height:35px;padding:7px 8px;border:1px solid #264653;border-radius:5px;background:#071821;color:#e3eef3;outline-offset:3px}
.point-style-grid input::placeholder{color:#648391;opacity:1}
.point-style-grid select:focus,.point-style-grid input:focus{outline:1px solid var(--cyan);outline-offset:3px}
.point-style-grid input[aria-invalid=true]{border-color:#b96961}
.point-colour-control{display:flex;align-items:center;gap:9px;min-height:35px;padding:4px 7px;background:#071821;border:1px solid #264653;border-radius:5px}
.point-colour-control input{width:27px;height:25px;padding:0;background:none;border:0;cursor:pointer;flex-shrink:0}
.point-colour-control input::-webkit-color-swatch-wrapper{padding:0}.point-colour-control input::-webkit-color-swatch{border:0;border-radius:3px}
.point-colour-control input::-moz-color-swatch{border:0;border-radius:3px}
.point-colour-control output{font:10px 'Space Mono',monospace;color:#a7c3cf;white-space:nowrap}
.point-style-grid .reset-button{min-height:35px;justify-content:center}
.point-style-note{margin:9px 0 0;color:#7595a3;font-size:9px;line-height:1.6}
#legend-marker{display:block;width:16px;height:16px;flex-shrink:0}
@media(max-width:650px){.point-style-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px 12px}}
@media(max-width:520px){.point-style-controls{padding:14px 13px}}

/* Version 5: selection and regression. */
.selection-controls{padding:15px 24px;border-bottom:1px solid var(--line);background:#051722}
.selection-grid{display:grid;grid-template-columns:minmax(150px,1.15fr) minmax(80px,.65fr) minmax(110px,1fr) auto;gap:12px;align-items:end}
.selection-grid>label,.interaction-field{display:flex;flex-direction:column;gap:6px;min-width:0;font-size:10px;color:#7896a3}
.selection-grid select{font:11px Inter,system-ui,sans-serif;width:100%;min-width:0;min-height:35px;padding:7px 8px;border:1px solid #264653;border-radius:5px;background:#071821;color:#e3eef3;outline-offset:3px}
.selection-grid select:focus{outline:1px solid var(--cyan)}
.selection-grid select:disabled{opacity:.45}
.selection-grid>.reset-button{min-height:35px;justify-content:center}
.interaction-buttons{display:flex;min-height:35px;border:1px solid #264653;border-radius:5px;overflow:hidden}
.interaction-buttons button{flex:1;white-space:nowrap;border:0;background:#071821;color:#7896a3;padding:7px 9px;font-size:10px;outline-offset:-3px}
.interaction-buttons button+button{border-left:1px solid #264653}
.interaction-buttons button[aria-pressed=true]{background:#0b3340;color:#bcf1f5}
.interaction-buttons button:disabled{opacity:.45;cursor:default}
.selection-options{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:12px;font-size:10px;color:#8babb9}
.regression-toggle{display:flex;align-items:center;gap:8px;cursor:pointer;line-height:1.5}
.regression-toggle input{accent-color:var(--cyan);margin:0;width:14px;height:14px}
#selection-status{font-variant-numeric:tabular-nums}#selected-count{font-weight:500;color:#d7e8ef}
.plot-footer.has-selection{flex-wrap:wrap}#selection-marker{display:block;width:16px;height:16px;flex-shrink:0}
.regression-summary{padding:17px 22px;border-top:1px solid #24424f;background:#081c27;font-size:11px;line-height:1.7;color:#9ebfcd}
.regression-heading{display:flex;align-items:center;gap:9px}.regression-heading strong{font-size:11px;font-weight:500;color:#cfe2eb}
#regression-swatch{width:20px;border-top:3px solid #ffb454;flex-shrink:0}
#regression-equation{font:12px 'Space Mono',monospace;line-height:1.8;margin:10px 0 3px;color:#daeaf0;overflow-wrap:anywhere}
#regression-stats{font-size:10px;color:#8aabb9;margin:0;overflow-wrap:anywhere}
@media(max-width:1150px) and (min-width:851px){.selection-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media(max-width:650px){.selection-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media(max-width:520px){.selection-controls{padding:14px 13px}.interaction-buttons button{padding:7px 5px;font-size:9px}.regression-summary{padding:15px 14px}#regression-equation{font-size:11px}}

/* Version 7: regression model and line thickness. */
.regression-controls{display:grid;grid-template-columns:minmax(0,1fr) minmax(100px,160px);gap:12px;margin-top:14px;max-width:570px}
.regression-controls label{display:flex;flex-direction:column;gap:6px;min-width:0;font-size:10px;color:#7896a3}
.regression-controls select,.regression-controls input{box-sizing:border-box;font:11px Inter,system-ui,sans-serif;width:100%;min-width:0;min-height:35px;padding:7px 8px;border:1px solid #264653;border-radius:5px;background:#071821;color:#e3eef3;outline-offset:3px}
.regression-controls select:focus,.regression-controls input:focus{outline:1px solid var(--cyan)}
.regression-controls input[aria-invalid=true]{border-color:#ff9785}
@media(max-width:520px){.regression-controls{grid-template-columns:minmax(0,1fr) 96px;gap:10px}.regression-controls select{font-size:10px;padding:7px 4px}}

/* Version 9: one control panel at a time, with Axis open initially. */
.control-tabs{display:flex;align-items:flex-end;gap:5px;padding:12px 24px 0;background:#04131d;border-bottom:1px solid #264653}
.control-tabs .control-tab{position:relative;margin:0 0 -1px;min-height:40px;padding:10px 20px;border:1px solid transparent;border-radius:6px 6px 0 0;background:transparent;color:#7898a8;font:11px Inter,system-ui,sans-serif;cursor:pointer;white-space:nowrap}
.control-tab:hover{color:#d2e8ef;background:#071f2b}
.control-tab[aria-selected=true]{background:#051722;color:#bdf6fa;border-color:#264653;border-bottom-color:#051722;box-shadow:inset 0 2px 0 var(--cyan)}
.control-tab:focus-visible{outline:2px solid var(--cyan);outline-offset:-5px}
.control-panels{background:#051722;border-bottom:1px solid var(--line)}
.control-panel{min-width:0}
.control-panel:focus-visible{outline:1px solid #367086;outline-offset:-4px}
.control-panel .axis-scale-form,.control-panel .point-style-controls,.control-panel .selection-controls{border-bottom:0;background:#051722}
.regression-settings{padding:17px 24px;color:#8babb9;font-size:10px}
@media(max-width:650px){.control-tabs{padding-left:13px;padding-right:13px;gap:3px}.control-tabs .control-tab{flex:1;min-width:0;padding:10px 5px;font-size:10px}}
@media(max-width:520px){.regression-settings{padding:16px 13px}}

/* Version 10: LAS curve colouring and its persistent value legend. */
.control-tabs{overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#28505e #04131d}
.control-tabs .control-tab{flex-shrink:0}
.colouring-settings{padding:17px 24px}
.colouring-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:12px;max-width:650px}
.colouring-grid label{display:flex;flex-direction:column;gap:6px;min-width:0;font-size:10px;color:#7896a3}
.colouring-grid select{font:11px Inter,system-ui,sans-serif;width:100%;min-width:0;min-height:35px;padding:7px 8px;border:1px solid #264653;border-radius:5px;background:#071821;color:#e3eef3;outline-offset:3px;text-overflow:ellipsis}
.colouring-grid select:focus{outline:1px solid var(--cyan)}
.colouring-grid select:disabled,.colouring-options input:disabled,#point-colour:disabled{opacity:.45;cursor:default}
.colouring-options{display:flex;align-items:center;gap:18px;margin-top:14px;max-width:650px}
.colouring-options label{display:flex;align-items:center;gap:8px;font-size:10px;color:#8babb9;white-space:nowrap;cursor:pointer}
.colouring-options input{accent-color:var(--cyan);margin:0;width:14px;height:14px}
.palette-preview{height:10px;flex:1;border-radius:3px;border:1px solid #33505e;min-width:40px}
.colouring-legend{padding:14px 22px;background:#061923;border-top:1px solid #163442;font-size:10px;color:#a7c3cf}
.colouring-legend-heading{display:flex;align-items:center;justify-content:space-between;gap:8px 20px;flex-wrap:wrap;margin-bottom:9px;overflow-wrap:anywhere}
.colouring-scale{display:grid;grid-template-columns:auto minmax(50px,1fr) auto;gap:12px;align-items:center;font:10px 'Space Mono',monospace}
.colouring-gradient{height:12px;min-width:0;border:1px solid #33505e;border-radius:3px}
.missing-colour-key{display:flex;align-items:center;gap:6px;font-size:9px;color:#8da6b3}
.missing-colour-key i{width:8px;height:8px;background:#94a3b8;flex-shrink:0}
@media(max-width:650px){.control-tabs .control-tab{flex:1 0 auto;padding-left:7px;padding-right:7px}}
@media(max-width:520px){.colouring-settings{padding:16px 13px}.colouring-grid{grid-template-columns:minmax(0,1fr);gap:12px}.colouring-legend{padding:13px 14px}.colouring-scale{gap:8px;font-size:9px}}

/* Version 11: manual limits for the selected colour curve. */
.colour-limits-form{margin-top:16px;padding-top:13px;border-top:1px solid #163442;max-width:650px}
.colour-limits-form fieldset{margin:0;padding:0;border:0;min-width:0}
.colour-limits-form legend{padding:0;margin-bottom:9px;font-size:10px;color:#9ebfcd}
#colour-limit-unit{margin-left:4px;color:#7595a3}
.colour-limits-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto auto;gap:12px;align-items:end}
.colour-limits-grid label{display:flex;flex-direction:column;gap:6px;min-width:0;font-size:10px;color:#7896a3}
.colour-limits-grid input{font:11px Inter,system-ui,sans-serif;width:100%;min-width:0;min-height:35px;padding:7px 8px;border:1px solid #264653;border-radius:5px;background:#071821;color:#e3eef3;outline-offset:3px}
.colour-limits-grid input::placeholder{color:#648391;opacity:1}
.colour-limits-grid input:focus{outline:1px solid var(--cyan)}
.colour-limits-grid input[aria-invalid=true]{border-color:#b96961}
.colour-limits-grid input:disabled{opacity:.45}
.colour-limits-grid .reset-button{min-height:35px;justify-content:center}
@media(max-width:650px){.colour-limits-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px 12px}}

/* Version 12: one-curve numeric filtering, with one or two AND conditions. */
.filtering-settings{padding:17px 24px}
.filter-curve-field,.filter-comparison-row label{display:flex;flex-direction:column;gap:6px;min-width:0;font-size:10px;color:#7896a3}
.filter-curve-field{max-width:370px}
.filtering-settings select,.filtering-settings input{font:11px Inter,system-ui,sans-serif;width:100%;min-width:0;min-height:35px;padding:7px 8px;border:1px solid #264653;border-radius:5px;background:#071821;color:#e3eef3;outline-offset:3px;text-overflow:ellipsis}
.filtering-settings input::placeholder{color:#648391;opacity:1}
.filtering-settings select:focus,.filtering-settings input:focus{outline:1px solid var(--cyan)}
.filtering-settings input[aria-invalid=true]{border-color:#b96961}
.filtering-settings select:disabled,.filtering-settings input:disabled{opacity:.45}
.filtering-settings fieldset{margin:16px 0 0;padding:0;border:0;min-width:0;max-width:650px}
.filtering-settings legend{padding:0;margin-bottom:9px;font-size:10px;color:#9ebfcd}
#filter-curve-unit{margin-left:4px;color:#7595a3}
.filter-conditions-grid{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:13px;align-items:center}
.filter-condition{min-width:0}
.filter-condition-title{display:block;font-size:10px;color:#9ebfcd;margin-bottom:8px}
.filter-comparison-row{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:9px}
.filter-and{font:10px 'Space Mono',monospace;color:#42ccd4;padding-top:26px}
.filter-actions{display:flex;gap:10px;margin-top:14px}
.filter-actions .reset-button{min-height:35px;justify-content:center}
.filter-summary{display:flex;gap:8px 14px;padding:11px 24px;background:#082632;border-bottom:1px solid #28505e;font-size:10px;line-height:1.6;color:#b1e7ed;overflow-wrap:anywhere}
.filter-summary strong{font-weight:500;color:#04d6ea;flex-shrink:0}
.filter-summary span{min-width:0}
.plot-summary.has-filter{flex-wrap:wrap;gap:8px 20px}
@media(max-width:650px){.filter-conditions-grid{grid-template-columns:minmax(0,1fr);gap:10px}.filter-and{padding-top:0}.filter-comparison-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media(max-width:520px){.filtering-settings{padding:16px 13px}.filter-summary{padding:10px 14px}.filter-actions .reset-button{flex:1}}