*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#f4f4fb;--surface:#ffffff;--surface2:#eeeef8;--border:#d0d0e8;--accent:#4466ee;--accent-dk:#2244cc;--text:#222244;--text-dim:#888899;--danger:#cc3333;--radius:6px}[data-theme="dark"]{--bg:#0d0d1a;--surface:#12122a;--surface2:#1a1a38;--border:#2a2a50;--accent:#5c7cff;--accent-dk:#3a5ccc;--text:#c8c8e8;--text-dim:#666690;--danger:#e74c3c}html,body{height:100%;background:var(--bg);color:var(--text);font-family:'Segoe UI',system-ui,sans-serif;font-size:13px;overflow:hidden}#app{display:grid;grid-template-rows:40px 1fr;grid-template-columns:1fr;grid-template-areas:"toolbar" "canvas";height:100vh}#toolbar{grid-area:toolbar;display:flex;align-items:center;gap:6px;padding:0 10px;background:var(--surface);border-bottom:1px solid var(--border);position:relative}#brand{position:absolute;left:50%;transform:translateX(-50%);height:26px;display:flex;align-items:center}#brand .brand-mark{height:100%;width:auto;display:block}#brand .brand-mark-dark{display:none}[data-theme="dark"] #brand .brand-mark-light{display:none}[data-theme="dark"] #brand .brand-mark-dark{display:block}#toolbar .sep{width:1px;height:22px;background:var(--border);margin:0 2px}#toolbar .spacer{flex:1}#toolbar-hint{font-size:11px;color:var(--text-dim)}button{cursor:pointer;border:none;background:transparent;color:var(--text);padding:4px 10px;border-radius:var(--radius);font-size:12px;transition:background 0.15s;white-space:nowrap}button:hover{background:var(--surface2)}button:disabled{opacity:0.35;cursor:not-allowed}button:disabled:hover{background:transparent}button.accent{background:var(--accent);color:#fff}button.accent:hover{background:var(--accent-dk)}button.danger{color:var(--danger)}button.full{width:100%}#canvas-wrap{grid-area:canvas;position:relative;overflow:hidden;background:var(--bg)}#graph-canvas{display:block;width:100%;height:100%;cursor:crosshair}#overlay-canvas{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none}#coord-readout{position:absolute;bottom:8px;right:8px;font-family:'Courier New',monospace;font-size:11px;color:var(--text-dim);pointer-events:none;background:rgba(128,128,180,0.12);padding:2px 6px;border-radius:3px}#canvas-wrap.drop-target{outline:2px dashed var(--accent);outline-offset:-4px}#canvas-wrap.drop-target::before{content:'Drop CSV file to add dataset';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--accent);color:#fff;padding:10px 22px;border-radius:8px;font-size:14px;font-weight:600;z-index:10;pointer-events:none}#canvas-actions{position:absolute;top:10px;left:52px;z-index:20;display:flex;align-items:center;gap:4px}.ca-group{display:flex;align-items:center;background:var(--surface);border:1px solid var(--border);border-radius:8px;box-shadow:0 1px 4px rgba(0,0,0,0.1);overflow:hidden}.ca-btn{height:32px;padding:0 10px;font-size:12px;background:transparent;border:none;border-radius:0;cursor:pointer;color:var(--text);white-space:nowrap;transition:background 0.15s}.ca-btn:hover{background:var(--surface2)}.ca-btn:disabled{opacity:0.35;cursor:not-allowed}.ca-btn:disabled:hover{background:transparent}.ca-btn.danger{color:var(--danger)}.ca-group .ca-btn + .ca-btn{border-left:1px solid var(--border)}#add-dropdown{position:absolute;top:10px;left:10px;z-index:20}#add-btn{width:32px;height:32px;border-radius:10px;border:1px solid var(--border);background:var(--surface);color:var(--text);font-size:22px;line-height:1;cursor:pointer;display:grid;place-items:center;padding:0;box-shadow:0 1px 4px rgba(0,0,0,0.1);transition:background 0.15s}#add-btn:hover{background:var(--surface2)}#add-menu{position:absolute;top:38px;left:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 4px 16px rgba(0,0,0,0.14);min-width:148px;padding:4px 0;z-index:25}#add-menu[hidden]{display:none}.add-menu-item{display:block;width:100%;padding:8px 14px;text-align:left;background:none;border:none;color:var(--text);cursor:pointer;font-size:12px;border-radius:0}.add-menu-item:hover{background:var(--surface2)}#left-panel{position:absolute;top:50px;left:10px;z-index:15;display:flex;flex-direction:column;gap:5px;max-height:calc(100% - 60px);overflow-y:auto;pointer-events:none}#left-panel>*{pointer-events:auto}#plot-legend{display:flex;flex-direction:column;gap:3px}.legend-item{display:flex;align-items:center;gap:6px;padding:4px 8px 4px 6px;background:var(--surface);border:1px solid var(--border);border-radius:16px;cursor:pointer;font-size:11px;color:var(--text);max-width:180px;box-shadow:0 1px 3px rgba(0,0,0,0.08);transition:background 0.1s;user-select:none}.legend-item:hover{background:var(--surface2)}.legend-item.active{outline:1.5px solid var(--accent)}.legend-swatch{width:10px;height:10px;border-radius:50%;flex-shrink:0}.legend-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:'Courier New',monospace}.legend-label.math{font-family:'Georgia','Palatino Linotype',serif;font-size:11px;font-style:italic}.legend-label.math .ef-fn{font-style:normal;font-weight:600}.legend-label.math .ef-num{font-style:normal}.legend-label.math .ef-var{font-style:italic}.legend-label.math sup{font-size:0.78em;position:relative;top:-0.48em;line-height:1;font-style:normal}.legend-label.math sub{font-size:0.78em;position:relative;bottom:-0.22em;line-height:1}#btn-settings{position:absolute;top:8px;right:8px;z-index:10;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:4px 8px;font-size:16px;line-height:1;color:var(--text-dim);transition:background 0.15s,color 0.15s,border-color 0.15s}#btn-settings:hover{background:var(--surface2);color:var(--text)}#btn-settings.open{background:var(--surface2);border-color:var(--accent);color:var(--accent)}#settings-panel{display:none;position:fixed;top:80px;right:8px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 4px 18px rgba(0,0,0,0.16);z-index:50;min-width:248px}#settings-panel.open{display:block}#settings-tabs{display:flex;background:var(--surface2);border-bottom:1px solid var(--border)}.tab-btn{flex:1;padding:8px 12px;border-radius:0;border-bottom:2px solid transparent;margin-bottom:-1px;font-size:12px;font-weight:500;color:var(--text-dim);background:transparent}.tab-btn:hover{background:var(--surface);color:var(--text)}.tab-btn.active{color:var(--accent);border-bottom-color:var(--accent);background:var(--surface)}.tab-pane{display:none;flex-direction:column;gap:7px;padding:12px}.tab-pane.active{display:flex}.pref-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.pref-label{font-size:12px}.pref-slider-wrap{display:flex;align-items:center;gap:6px}.pref-slider-wrap input[type=range]{width:80px;cursor:pointer}#attr-line-width-val{font-size:12px;min-width:18px;text-align:right}.settings-sep{height:1px;background:var(--border);margin:2px 0}.cycle-control{display:flex;align-items:center;gap:4px}.cycle-btn{width:20px;height:20px;border-radius:var(--radius);border:1px solid var(--border);background:transparent;color:var(--text);font-size:13px;cursor:pointer;display:grid;place-items:center;padding:0;flex-shrink:0;transition:background 0.12s}.cycle-btn:hover{background:var(--surface2)}.cycle-btn:disabled{opacity:0.28;cursor:not-allowed}.cycle-btn:disabled:hover{background:transparent}.cycle-label{font-size:11px;min-width:48px;text-align:center;color:var(--text);user-select:none}.grid-reset-btn{border:1px solid var(--border);color:var(--text-dim);font-size:11px;padding:5px}.grid-reset-btn:hover{background:var(--surface2);color:var(--text)}.grid-label-input{flex:1;min-width:0;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-size:11px;font-family:'Courier New',monospace;padding:3px 7px;outline:none}.grid-label-input:focus{border-color:var(--accent)}.axes-row{display:flex;align-items:center;gap:4px}.axes-lbl{width:11px;font-size:11px;font-family:'Courier New',monospace;color:var(--text-dim);flex-shrink:0}.axes-sep{font-size:11px;color:var(--text-dim);flex-shrink:0}.axes-row input[type="number"]{flex:1;min-width:0;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-size:11px;font-family:'Courier New',monospace;padding:3px 5px;outline:none;-moz-appearance:textfield}.axes-row input[type="number"]:focus{border-color:var(--accent)}.axes-row input[type="number"]::-webkit-inner-spin-button,.axes-row input[type="number"]::-webkit-outer-spin-button{-webkit-appearance:none}#plot-attr-panel{position:fixed;bottom:10px;left:10px;width:300px;background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:0 4px 24px rgba(0,0,0,0.15);z-index:60;display:flex;flex-direction:column;max-height:calc(100vh - 60px)}#plot-attr-panel[hidden]{display:none !important}#plot-attr-header{display:flex;align-items:center;gap:8px;padding:10px 12px 9px;border-bottom:1px solid var(--border);flex-shrink:0}#attr-color-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;background:var(--accent);transition:background 0.2s}#plot-attr-title{flex:1;background:none;border:none;color:var(--text);font-size:13px;font-weight:600;outline:none;min-width:0}#plot-attr-title::placeholder{color:var(--text-dim);font-weight:400}#plot-attr-close{width:22px;height:22px;border-radius:50%;border:1px solid var(--border);background:transparent;color:var(--text-dim);font-size:11px;cursor:pointer;flex-shrink:0;display:grid;place-items:center;padding:0}#plot-attr-close:hover{background:var(--surface2);color:var(--text)}#plot-attr-body{flex:1;min-height:0;overflow-y:auto}#attr-tabs{display:flex;background:var(--surface2);border-bottom:1px solid var(--border);flex-shrink:0}.attr-tab-btn{flex:1;padding:7px 10px;border-radius:0;border-bottom:2px solid transparent;margin-bottom:-1px;font-size:11px;font-weight:500;color:var(--text-dim);background:transparent;white-space:nowrap}.attr-tab-btn:hover{background:var(--surface);color:var(--text)}.attr-tab-btn.active{color:var(--accent);border-bottom-color:var(--accent);background:var(--surface)}.attr-tab-pane{display:none;flex-direction:column;gap:10px;padding:12px}.attr-tab-pane.active{display:flex}#attr-fn-editor,#attr-ds-editor{display:flex;flex-direction:column;gap:8px}#plot-attr-footer{padding:10px 12px;border-top:1px solid var(--border);flex-shrink:0}.panel-delete-btn{width:100%;padding:7px;background:rgba(204,51,51,0.07);border:1px solid rgba(204,51,51,0.18);border-radius:var(--radius);color:var(--danger);cursor:pointer;font-size:12px}.panel-delete-btn:hover{background:rgba(204,51,51,0.14)}.expr-header{display:flex;align-items:center;justify-content:space-between}.expr-header label{font-size:11px;color:var(--text-dim)}.mode-pills{display:flex;border:1px solid var(--border);border-radius:4px;overflow:hidden}.mode-pill{padding:2px 9px;font-size:10px;font-weight:600;letter-spacing:0.04em;cursor:pointer;border:none;background:transparent;color:var(--text-dim);border-radius:0;text-transform:uppercase;transition:background 0.1s,color 0.1s}.mode-pill:hover{background:var(--surface2);color:var(--text)}.mode-pill.active{background:var(--accent);color:#fff}.mode-pill.active:hover{background:var(--accent-dk)}.math-input-wrap{position:relative;display:flex;align-items:stretch;border:1px solid var(--border);border-radius:var(--radius);transition:border-color 0.15s;overflow:hidden}.math-input-wrap:focus-within{border-color:var(--accent)}.math-input-wrap.has-error{border-color:var(--danger)}math-field{flex:1;min-width:0;display:block;width:100%;min-height:38px;padding:6px 9px;box-sizing:border-box;font-size:15px;outline:none;--ML__background-color:transparent;--ML__text-color:var(--text);--ML__selection-background-color:rgba(68,102,238,0.25);--ML__placeholder-color:var(--text-dim);--ML__contains-highlight-background-color:rgba(68,102,238,0.12)}math-field[hidden]{display:none}math-field::part(virtual-keyboard-toggle),math-field::part(keyboard-toggle),math-field::part(menu-toggle){display:none}.math-field-actions{display:flex;align-items:center;padding:2px 3px 2px 0;gap:1px;flex-shrink:0}.mf-action-btn{background:none;border:none;cursor:pointer;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:4px;color:var(--text-dim);font-size:19px;opacity:0.65;transition:opacity 0.15s,background 0.15s;flex-shrink:0}.mf-action-btn:hover{opacity:1;background:var(--surface2)}.latex-source-area{display:block;width:100%;min-height:52px;padding:6px 26px 6px 9px;box-sizing:border-box;background:transparent;border:none;outline:none;resize:vertical;color:var(--text);font-family:'Courier New',monospace;font-size:12px}.latex-source-area[hidden]{display:none}.math-error-icon{display:flex;align-items:center;flex-shrink:0;font-size:13px;color:var(--danger);cursor:help;line-height:1;pointer-events:auto}.math-error-icon:empty{display:none}#attr-param-rows{display:flex;flex-direction:column;gap:6px}.attr-params-wrap{display:flex;flex-wrap:wrap;gap:8px}.attr-param-group{display:flex;align-items:center;gap:5px}.attr-param-name{font-size:11px;font-family:'Courier New',monospace;font-weight:600}.attr-param-value{width:60px;background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-size:11px;font-family:'Courier New',monospace;padding:2px 6px;outline:none;-moz-appearance:textfield}.attr-param-value:focus{border-color:var(--accent)}.attr-param-value::-webkit-inner-spin-button,.attr-param-value::-webkit-outer-spin-button{-webkit-appearance:none}#attr-ds-textarea{width:100%;height:110px;resize:vertical;background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-size:11px;font-family:'Courier New',monospace;padding:7px 8px;outline:none;transition:border-color 0.15s}#attr-ds-textarea:focus{border-color:var(--accent)}.attr-ds-info{display:flex;gap:8px;font-size:11px;min-height:16px}#attr-ds-preview{color:var(--accent)}#attr-ds-error{color:var(--danger)}.attr-ds-btns{display:flex;gap:6px}.attr-ds-btns button{flex:1;padding:6px;background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-size:11px}.attr-ds-btns button:hover{background:var(--border)}#attr-ds-mode-row{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--text-dim)}#attr-ds-mode{flex:1;background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);padding:4px 6px;font-size:11px;cursor:pointer;outline:none}#attr-ds-mode:focus{border-color:var(--accent)}.attr-display-section{display:flex;flex-direction:column;gap:8px}.attr-display-label{font-size:11px;color:var(--text-dim)}#attr-color-swatches{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}.color-swatch{width:100%;aspect-ratio:1;border-radius:5px;border:2px solid transparent;cursor:pointer;padding:0;background:var(--swatch-bg);transition:filter 0.12s,transform 0.12s}.color-swatch:hover{background:var(--swatch-bg);filter:brightness(1.18);transform:scale(1.1)}.color-swatch.active{outline:2px solid var(--text);outline-offset:1.5px}.attr-custom-color-row{display:flex;align-items:center;justify-content:space-between;gap:8px;cursor:pointer}.attr-custom-color-row span{font-size:11px;color:var(--text-dim)}#attr-custom-color{width:40px;height:24px;border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;padding:1px 2px;background:transparent}.ef-var{font-style:italic}.ef-num{font-style:normal}.ef-fn{font-style:normal;font-weight:600}.ef-frac{display:inline-flex;flex-direction:column;align-items:center;vertical-align:-0.5em;margin:0 0.08em;font-size:0.88em}.ef-frac-num{border-bottom:1.2px solid currentColor;padding:0 0.25em 1px;line-height:1.35;text-align:center}.ef-frac-den{padding:1px 0.25em 0;line-height:1.35;text-align:center}.ef-sqrt{display:inline-flex;align-items:stretch;vertical-align:middle}.ef-sqrt-rad{font-size:1.05em;line-height:1;align-self:flex-end;padding-right:1px;font-style:normal}.ef-sqrt-body{border-top:1.4px solid currentColor;padding:0 0.2em;margin-top:2px}.ef-deriv{display:inline-flex;align-items:center;vertical-align:middle;gap:0.15em}.legend-label sup,.expr-preview sup{font-size:0.72em;position:relative;top:-0.52em;line-height:1;font-style:normal}.legend-label sub,.expr-preview sub{font-size:0.72em;position:relative;bottom:-0.22em;line-height:1}.expr-preview{padding:5px 8px;background:var(--surface2);border-radius:4px;font-family:'Georgia','Palatino Linotype',serif;font-size:14px;font-style:italic;line-height:2;display:flex;align-items:center;flex-wrap:wrap;color:var(--text);overflow-x:auto}.expr-preview:empty{display:none}.expr-preview .ef-fn{font-style:normal;font-weight:600}.expr-preview .ef-num{font-style:normal}.expr-preview .ef-var{font-style:italic}.calc-section{display:flex;flex-direction:column;gap:7px;padding-bottom:11px;border-bottom:1px solid var(--border)}.calc-section:last-child{border-bottom:none;padding-bottom:0}.calc-section-hd{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:0.07em;color:var(--text-dim);display:flex;align-items:baseline;gap:5px}.calc-note{font-size:9px;font-weight:400;text-transform:none;letter-spacing:0;opacity:0.75}.calc-toggle{display:flex;align-items:center;gap:7px;cursor:pointer;font-size:12px;color:var(--text);user-select:none}.calc-toggle input[type="checkbox"]{cursor:pointer;accent-color:var(--accent)}.calc-row{display:flex;align-items:center;gap:5px;flex-wrap:wrap}.calc-lbl{font-size:11px;color:var(--text-dim);font-family:'Courier New',monospace;white-space:nowrap}.calc-inp{width:58px;background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-size:11px;font-family:'Courier New',monospace;padding:3px 6px;outline:none;-moz-appearance:textfield}.calc-inp:focus{border-color:var(--accent)}.calc-inp::-webkit-inner-spin-button,.calc-inp::-webkit-outer-spin-button{-webkit-appearance:none}#attr-calc-int-btn{align-self:flex-start;font-size:11px;padding:5px 10px}.calc-result{min-height:18px;font-size:12px;font-family:'Courier New',monospace;color:var(--accent);word-break:break-all}.calc-result.error{color:var(--danger)}#params-panel{display:flex;flex-direction:column;gap:4px}#params-panel[hidden]{display:none !important}.param-card{background:var(--surface);border:1px solid var(--border);border-radius:10px;box-shadow:0 1px 5px rgba(0,0,0,0.1);padding:8px 10px;min-width:210px;max-width:250px;display:flex;flex-direction:column;gap:6px}.param-header{display:flex;align-items:center;gap:5px}.param-name{font-family:'Courier New',monospace;font-size:12px;font-style:italic;color:var(--text);white-space:nowrap;min-width:0}.param-value-input{flex:1;min-width:0;width:60px;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-size:11px;font-family:'Courier New',monospace;padding:2px 6px;outline:none;-moz-appearance:textfield}.param-value-input:focus{border-color:var(--accent)}.param-value-input::-webkit-inner-spin-button,.param-value-input::-webkit-outer-spin-button{-webkit-appearance:none}.param-play-btn{width:26px;height:26px;border-radius:50%;border:1px solid var(--border);background:transparent;color:var(--text-dim);font-size:12px;cursor:pointer;display:grid;place-items:center;padding:0;flex-shrink:0;transition:background 0.12s,color 0.12s,border-color 0.12s}.param-play-btn:hover{background:var(--surface2);color:var(--text)}.param-play-btn.playing{background:var(--accent);color:#fff;border-color:var(--accent)}.param-slider-wrap{display:flex;align-items:center;gap:4px}.param-range-inp{width:42px;flex-shrink:0;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-size:10px;font-family:'Courier New',monospace;padding:2px 4px;outline:none;text-align:center;-moz-appearance:textfield}.param-range-inp:focus{border-color:var(--accent)}.param-range-inp::-webkit-inner-spin-button,.param-range-inp::-webkit-outer-spin-button{-webkit-appearance:none}.param-slider{flex:1;min-width:0;cursor:pointer;accent-color:var(--accent)}.param-control-row{display:flex;align-items:center;justify-content:space-between;gap:6px}.param-mode-group{display:flex;align-items:center;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}.param-mode-btn{padding:3px 7px;font-size:12px;border:none;border-radius:0;background:transparent;color:var(--text-dim);cursor:pointer;transition:background 0.1s,color 0.1s}.param-mode-btn + .param-mode-btn{border-left:1px solid var(--border)}.param-mode-btn:hover{background:var(--surface2);color:var(--text)}.param-mode-btn.active{background:var(--accent);color:#fff}.param-speed-group{display:flex;align-items:center;gap:2px;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}.param-speed-btn{width:22px;height:24px;border:none;border-radius:0;background:transparent;color:var(--text-dim);font-size:11px;cursor:pointer;padding:0;display:grid;place-items:center;transition:background 0.1s}.param-speed-btn + .param-speed-btn{border-left:1px solid var(--border)}.param-speed-btn:hover{background:var(--surface2);color:var(--text)}.param-speed-lbl{font-size:10px;min-width:24px;text-align:center;color:var(--text-dim);padding:0 2px;border-left:1px solid var(--border);border-right:1px solid var(--border);height:24px;display:flex;align-items:center;justify-content:center}.theta-bounds-row{display:flex;align-items:center;gap:5px;margin-top:6px}.theta-bounds-row[hidden]{display:none}.theta-lbl{font-size:11px;color:var(--text-dim);font-family:'Courier New',monospace;white-space:nowrap}.theta-inp{width:64px;background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-size:11px;font-family:'Courier New',monospace;padding:3px 6px;outline:none;-moz-appearance:textfield}.theta-inp:focus{border-color:var(--accent)}.theta-inp::-webkit-inner-spin-button,.theta-inp::-webkit-outer-spin-button{-webkit-appearance:none}.grid-style-group{display:flex;gap:4px}.grid-style-btn{width:26px;height:22px;border-radius:var(--radius);border:1px solid var(--border);background:transparent;color:var(--text-dim);font-size:13px;cursor:pointer;display:grid;place-items:center;padding:0;transition:background 0.12s,color 0.12s,border-color 0.12s}.grid-style-btn:hover{background:var(--surface2)}.grid-style-btn.active{color:var(--accent);border-color:var(--accent);background:var(--surface2)}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:var(--surface)}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}