.nw-chart{background:#101f29;color:#e4eff2;border:1px solid #2c444e;border-radius:18px;padding:22px;margin:20px 0;min-width:0;box-sizing:border-box}
.nw-chart *{box-sizing:border-box}.nw-chart-head,.nw-chart-controls{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}.nw-chart h3{font-size:21px;margin:6px 0 14px}.nw-chart small{color:#72dcaf;font-size:11px;letter-spacing:.12em}.nw-chart label{display:flex;flex-direction:column;gap:5px;font-size:12px;color:#bdd0d9;min-width:0}.nw-chart select,.nw-chart button{font:inherit;background:#192f3a;color:#e4eff2;border:1px solid #395461;border-radius:9px;min-height:44px;padding:8px 12px;cursor:pointer}.nw-chart select{max-width:100%;font-size:14px}.nw-chart button:hover{background:#274653}.nw-chart :focus-visible{outline:3px solid #84ebc5;outline-offset:3px}.nw-chart-buttons{display:flex;gap:6px;flex-wrap:wrap}.nw-chart-status,.nw-chart-note{font-size:12px;color:#a8bec9;line-height:1.6;overflow-wrap:anywhere}.nw-chart-plot{width:100%;min-width:0}.nw-chart svg{display:block;width:100%;height:auto;min-height:200px;touch-action:pan-y;cursor:crosshair}.nw-chart-inspector{background:#0b1821;border:1px solid #2b424b;border-radius:10px;padding:12px;min-height:68px;font-size:14px;line-height:1.6;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.nw-chart-slider{margin-top:15px}.nw-chart input[type=range]{width:100%;height:32px;accent-color:#56dca8}.nw-chart [hidden]{display:none!important}.nw-chart[aria-busy=true] svg{opacity:.45}.nw-chart [role=button]{cursor:pointer}
@media(max-width:600px){.nw-chart{padding:14px;border-radius:13px}.nw-chart-controls{gap:10px}.nw-chart-buttons{width:100%}.nw-chart-buttons button{flex:1 0 auto}.nw-chart-head{align-items:flex-start}.nw-chart h3{font-size:19px}.nw-chart-head label{width:100%}.nw-chart svg{min-height:180px}.nw-chart-status{font-size:11px}.nw-chart-inspector{min-height:90px}}
.nw-hodl-controls{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:14px}.nw-hodl-legend,.nw-hodl-note{font-size:12px;line-height:1.6;overflow-wrap:anywhere}.nw-hodl-note{color:#bed0d9}.nw-chart [data-action=hodl][aria-pressed=true]{border-color:#f4c56a;color:#f4c56a;background:#322b20}.nw-chart button:disabled{opacity:.5;cursor:not-allowed}

/* Finger-sized controls, readable inputs and an uncompressed plot on phones. */
@media(max-width:1100px){body .nw-chart input[type=range]{height:44px}body .nw-chart select{font-size:16px}body .nw-chart button{min-width:44px}body .nw-chart-status,body .nw-chart-note{font-size:13px}}
@media(max-width:600px){body .nw-chart svg{height:280px;min-height:280px}body .nw-chart-controls>label{width:100%}body .nw-chart-buttons{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}body .nw-chart-buttons button:nth-last-child(-n+2){grid-column:span 2}body .nw-chart-head select{width:100%}}

/* Same reading/tab order at every width: selection, time, comparison, refresh. */
body .nw-chart-head{display:block;margin-bottom:14px}
body .nw-chart-head h3{margin-bottom:0}
body .nw-chart-toolbar{display:flex;align-items:flex-end;justify-content:flex-start;flex-wrap:wrap;gap:12px 16px}
body .nw-chart-filters{display:flex;align-items:flex-end;gap:10px;min-width:0}
body .nw-chart-filters label{width:156px;gap:6px;margin:0}
body .nw-chart-toolbar select,body .nw-chart-toolbar button{height:44px;min-height:44px;margin:0;line-height:1.2;font-size:14px;white-space:nowrap}
body .nw-chart-toolbar select{width:100%;padding:8px 10px}
body .nw-chart-navigation,body .nw-chart-options{display:flex;align-items:center;gap:6px;min-width:0}
body .nw-chart-navigation button{min-width:44px}
body .nw-chart-options{margin-left:auto}
body .nw-hodl-controls:has(.nw-hodl-legend[hidden]){display:none}
@media(max-width:1100px){body .nw-chart-toolbar select{font-size:16px}body .nw-chart-options{margin-left:0}}
@media(max-width:600px){
 body .nw-chart-toolbar{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
 body .nw-chart-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:8px}
 body .nw-chart-filters label{width:auto}
 body .nw-chart-navigation{display:grid;grid-template-columns:repeat(4,minmax(44px,1fr)) minmax(76px,1.5fr);gap:4px}
 body .nw-chart-navigation button{padding:8px 4px}
 body .nw-chart-options{display:flex;width:100%;gap:8px}
 body .nw-chart-options button{flex:1 1 0;min-width:0}
}
