/* Efunction — SoftUI 设计：图标一律用 Lucide 描边 SVG，禁止 emoji */
:root {
  --sui-bg: #e9edf3;
  --sui-surface: #f2f5f9;
  --sui-surface-2: #ffffff;
  --sui-surface-3: rgba(255,255,255,.6);
  --sui-text: #1f2430;
  --sui-muted: #6b7280;
  --sui-primary: #4f6ef7;
  --sui-primary-2: #7d94fb;
  --sui-danger: #e5484d;
  --sui-ok: #30a46c;
  --sui-radius: 14px;
  --sui-radius-sm: 9px;
  --sui-border: rgba(31,36,48,.08);
  --sui-focus: rgba(79,110,247,.28);
  --sui-shadow: 6px 6px 14px rgba(161,175,197,.42), -6px -6px 14px rgba(255,255,255,.85);
  --sui-shadow-sm: 3px 3px 8px rgba(161,175,197,.32), -3px -3px 8px rgba(255,255,255,.8);
  --sui-shadow-inset: inset 3px 3px 7px rgba(161,175,197,.35), inset -3px -3px 7px rgba(255,255,255,.9);
  --sui-shadow-raise: 8px 8px 20px rgba(161,175,197,.5), -8px -8px 20px rgba(255,255,255,.95);
  --sui-trans: .22s cubic-bezier(.22,.61,.36,1);
  --sui-font: "Segoe UI", "Microsoft YaHei", "PingFang SC", system-ui, -apple-system, sans-serif;
  --grid-line: rgba(31,36,48,.18);
  --grid-strong: rgba(31,36,48,.36);
  --grid-muted: rgba(31,36,48,.5);
  --chart-axis: rgba(31,36,48,.62);
}
html[data-theme="dark"] {
  --sui-bg: #191c23;
  --sui-surface: #20242e;
  --sui-surface-2: #272c38;
  --sui-surface-3: rgba(255,255,255,.04);
  --sui-text: #e9ebf2;
  --sui-muted: #9aa3b8;
  --sui-primary: #6d8bff;
  --sui-primary-2: #8fa6ff;
  --sui-danger: #f0626a;
  --sui-ok: #41b883;
  --sui-border: rgba(255,255,255,.07);
  --sui-shadow: 6px 6px 14px rgba(0,0,0,.45), -6px -6px 14px rgba(60,66,86,.35);
  --sui-shadow-sm: 3px 3px 8px rgba(0,0,0,.4), -3px -3px 8px rgba(60,66,86,.3);
  --sui-shadow-inset: inset 3px 3px 7px rgba(0,0,0,.4), inset -3px -3px 7px rgba(60,66,86,.3);
  --sui-shadow-raise: 8px 8px 20px rgba(0,0,0,.5), -8px -8px 20px rgba(60,66,86,.35);
  --grid-line: rgba(233,235,242,.16);
  --grid-strong: rgba(233,235,242,.32);
  --grid-muted: rgba(233,235,242,.5);
  --chart-axis: rgba(233,235,242,.62);
}
* { box-sizing: border-box; }
html, body { height: 100%; margin: 0; }
body {
  background: var(--sui-bg);
  color: var(--sui-text);
  font-family: var(--sui-font);
  font-size: 14px;
  -webkit-font-smoothing: antialiased;
  overflow: hidden;
}
.lucide { width: 18px; height: 18px; flex: none; transition: transform var(--sui-trans); }
button { font-family: inherit; }
a { color: var(--sui-primary); text-decoration: none; }
a:hover { text-decoration: underline; }

/* 布局 */
.ef-app { display: grid; grid-template-rows: 58px 1fr; height: 100%; }
.ef-app:fullscreen, .ef-app:-webkit-full-screen { width: 100%; height: 100%; background: var(--sui-bg); }
.ef-toolbar {
  display: flex; align-items: center; gap: 10px; padding: 0 14px; min-width: 0;
  background: var(--sui-surface); border-bottom: 1px solid var(--sui-border);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); z-index: 40;
}
/* 绘制区占满全屏；函数输入区与函数列表以浮层叠在画布之上 */
.ef-body { position: relative; min-height: 0; overflow: hidden; }
.ef-canvas-wrap { position: absolute; inset: 0; min-width: 0; min-height: 0; overflow: hidden; }
.ef-canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; touch-action: none; }
.ef-addbar {
  position: absolute; top: 10px; left: 50%; transform: translateX(-50%);
  z-index: 6; width: min(880px, calc(100% - 20px));
  display: flex; align-items: center; gap: 8px; padding: 8px 10px;
  background: var(--sui-surface); border-radius: var(--sui-radius);
  box-shadow: var(--sui-shadow-raise); border: 1px solid var(--sui-border);
}
.ef-addbar .ab-type { width: auto; min-width: 96px; flex: none; }
.ef-addbar .ab-lhs { font-size: 15px; color: var(--sui-muted); flex: none; }
.ef-addbar .ab-mf { flex: 1 1 auto; min-width: 120px; }
.ef-addbar .ab-name { flex: none; width: 110px; }
.ef-sidebar {
  position: absolute; top: 74px; left: 10px; bottom: 10px; width: 300px; z-index: 5;
  overflow-y: auto; padding: 10px; border-radius: var(--sui-radius);
  background: var(--sui-surface); box-shadow: var(--sui-shadow-raise); border: 1px solid var(--sui-border);
}
.ef-sidebar .sui-panel { background: transparent; box-shadow: none; padding: 2px; }
.ef-app.side-hidden .ef-sidebar { display: none; }

/* 工具按钮 */
.sui-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  border: none; cursor: pointer; user-select: none;
  background: var(--sui-surface); color: var(--sui-text);
  box-shadow: var(--sui-shadow-sm);
  border-radius: var(--sui-radius-sm);
  font-size: 13px; line-height: 1; min-height: 34px;
  padding: 0 14px;
  transition: all var(--sui-trans);
}
.sui-btn:hover { transform: translateY(-1px); box-shadow: var(--sui-shadow); color: var(--sui-primary); }
.sui-btn:active { transform: translateY(0); box-shadow: var(--sui-shadow-inset); }
.sui-btn:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.sui-btn.primary { background: linear-gradient(135deg, var(--sui-primary), var(--sui-primary-2)); color: #fff; }
.sui-btn.primary:hover { color: #fff; filter: brightness(1.06); }
.sui-btn.ghost { box-shadow: none; background: transparent; }
.sui-btn.sm { min-height: 28px; padding: 0 10px; font-size: 12px; border-radius: 8px; }
.sui-iconbtn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; flex: none; cursor: pointer; border: none;
  background: var(--sui-surface); color: var(--sui-muted);
  box-shadow: var(--sui-shadow-sm); border-radius: var(--sui-radius-sm);
  transition: all var(--sui-trans);
}
.sui-iconbtn:hover { color: var(--sui-primary); box-shadow: var(--sui-shadow); transform: translateY(-1px); }
.sui-iconbtn:active { box-shadow: var(--sui-shadow-inset); }
.sui-iconbtn.active { color: var(--sui-primary); }
/* 按钮文字标签：宽屏隐藏（靠 tooltip），窄屏 / 触摸端显示，避免“不知道按钮干嘛” */
.btn-lbl { display: inline; white-space: nowrap; font-size: 11px; }
@media (min-width: 981px) { .sui-iconbtn .btn-lbl { display: none; } }
@media (max-width: 980px) { .sui-iconbtn { width: auto; min-width: 34px; padding: 0 9px; gap: 5px; } }

/* 输入 */
.sui-input, .sui-select {
  width: 100%; border: none; outline: none; min-height: 34px; padding: 0 12px;
  background: var(--sui-surface); color: var(--sui-text);
  box-shadow: var(--sui-shadow-inset); border-radius: var(--sui-radius-sm);
  font-size: 13px; font-family: inherit; transition: all var(--sui-trans);
}
.sui-input:focus, .sui-select:focus { box-shadow: var(--sui-shadow-inset), 0 0 0 2px var(--sui-focus); }
math-field.mathlive, text-field.mathlive, .mathlive-field {
  width: 100%; min-height: 34px; padding: 6px 10px; outline: none;
  border-radius: var(--sui-radius-sm); background: var(--sui-surface);
  box-shadow: var(--sui-shadow-inset); transition: all var(--sui-trans);
  font-size: 15px;
}
math-field.mathlive:focus, text-field.mathlive:focus, .mathlive-field:focus { box-shadow: var(--sui-shadow-inset), 0 0 0 2px var(--sui-focus); }

/* 分组字段 */
.sui-field { margin-bottom: 12px; }
.sui-label { display: block; font-size: 12px; color: var(--sui-muted); margin: 0 0 6px 2px; letter-spacing: .2px; }
.sui-hint { font-size: 11px; color: var(--sui-muted); margin: -6px 0 10px 2px; line-height: 1.5; }
.sui-err { font-size: 12px; color: var(--sui-danger); min-height: 16px; margin-top: 6px; line-height: 1.5; }
.sui-err:empty { display: none; }

/* 卡片 / 面板 */
.sui-panel {
  background: var(--sui-surface); border-radius: var(--sui-radius);
  box-shadow: var(--sui-shadow); padding: 13px;
}
.sui-card-row { display: flex; align-items: center; gap: 8px; }

/* 弹层 */
.sui-backdrop {
  position: fixed; inset: 0; background: rgba(15,18,26,.45);
  -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
  display: flex; align-items: center; justify-content: center; z-index: 100;
  opacity: 0; visibility: hidden; transition: opacity var(--sui-trans), visibility var(--sui-trans);
}
.sui-backdrop.open { opacity: 1; visibility: visible; }
.sui-modal {
  width: min(420px, 92vw); max-height: 86vh; overflow: auto;
  background: var(--sui-surface); border-radius: var(--sui-radius);
  box-shadow: var(--sui-shadow-raise); padding: 18px;
  transform: translateY(12px) scale(.98); transition: transform var(--sui-trans);
}
.sui-backdrop.open .sui-modal { transform: translateY(0) scale(1); }
.sui-modal h3 { margin: 0 0 14px; font-size: 16px; display: flex; align-items: center; gap: 8px; }
.sui-modal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.sui-modal-head h3 { margin: 0; }

/* 菜单（右键 / 下拉） */
.sui-menu {
  position: fixed; z-index: 200; min-width: 190px; padding: 6px;
  background: var(--sui-surface-2); border-radius: var(--sui-radius-sm);
  box-shadow: var(--sui-shadow-raise); border: 1px solid var(--sui-border);
  display: none;
}
.sui-menu.open { display: block; animation: efMen .16s ease; }
@keyframes efMen { from { opacity: 0; transform: translateY(-4px); } }
.sui-menu .mi {
  display: flex; align-items: center; gap: 9px; padding: 8px 10px; border-radius: 8px;
  cursor: pointer; color: var(--sui-text); font-size: 13px; transition: all var(--sui-trans);
}
.sui-menu .mi:hover { background: var(--sui-primary); color: #fff; }
.sui-menu .mi:hover .lucide { color: #fff; }
.sui-menu .sep { height: 1px; background: var(--sui-border); margin: 5px 8px; }
.sui-menu .mi.danger:hover { background: var(--sui-danger); }

/* 状态徽标 */
.sui-badge {
  display: inline-flex; align-items: center; gap: 5px; font-size: 11px;
  padding: 3px 9px; border-radius: 999px; background: var(--sui-surface);
  box-shadow: var(--sui-shadow-sm); color: var(--sui-muted);
}
.sui-badge.on { color: var(--sui-ok); }
.sui-badge.dd-off { opacity: .5; }
.sui-badge.dd-off:hover { opacity: .85; }

/* 定义域编辑对话框 */
.dd-head { display: flex; align-items: center; margin-bottom: 6px; }
.dd-row {
  display: flex; align-items: center; gap: 6px; margin-bottom: 8px;
  position: relative; z-index: 2;
}
.dd-row math-field.mathlive { flex: 1 1 auto; width: auto; min-width: 0; }
.dd-row .sui-btn { flex: none; width: 30px; height: 30px; padding: 0; }
.dd-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; }
.dd-chips .sui-btn { min-width: 34px; justify-content: center; padding: 0 8px; }
/* 定义域弹窗上移收窄：避免 MathLive 虚拟键盘（z-index 105）挡住下方按钮，出现“点不动” */
.sui-modal.dd-modal {
  align-self: flex-start; margin-top: 10px;
  /* 预留底部 360px 给 MathLive 虚拟键盘（z-index 105，高于遮罩 100），否则底部按钮被盖住点不动 */
  max-height: min(680px, max(40vh, calc(100vh - 360px)));
}
.sui-btn.primary.dd-ab-btn, .dd-ab-btn.active { box-shadow: var(--sui-shadow-inset), 0 0 0 2px var(--sui-focus); }

/* 使用手册 */
.man-head { display: flex; align-items: center; gap: 8px; font-size: 16px; font-weight: 700; margin-bottom: 12px; }
.man-head .lucide { color: var(--sui-primary); }
.man-body { max-height: min(58vh, 520px); overflow: auto; padding-right: 4px; }
.man-sec { padding: 10px 0; border-top: 1px solid var(--sui-border); }
.man-sec:first-child { border-top: none; padding-top: 0; }
.man-sec h4 { margin: 0 0 4px; font-size: 13.5px; font-weight: 700; }
.man-sec > div { font-size: 12.5px; line-height: 1.75; color: var(--sui-muted); }
/* 手册正文含列表与行内代码（正文可内嵌 HTML），补排版规则 */
.man-sec > div p { margin: 4px 0; }
.man-sec > div p:first-child { margin-top: 0; }
.man-sec > div p:last-child { margin-bottom: 0; }
.man-sec > div ul { margin: 4px 0; padding-left: 18px; }
.man-sec > div li { margin: 3px 0; }
.man-sec > div li::marker { color: var(--sui-primary); }
.man-sec > div b { color: var(--sui-text); font-weight: 600; }
.man-sec > div code { font-family: "Cascadia Mono", Consolas, "Courier New", monospace; font-size: 11.5px; padding: 1px 4px; border-radius: 4px; background: var(--sui-surface); box-shadow: var(--sui-shadow-inset); color: var(--sui-text); white-space: nowrap; }

/* 开关 */
.sui-switch { position: relative; width: 40px; height: 22px; flex: none; cursor: pointer; border: none; background: var(--sui-surface); box-shadow: var(--sui-shadow-inset); border-radius: 999px; padding: 0; transition: all var(--sui-trans); }
.sui-switch::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: var(--sui-muted); transition: all var(--sui-trans); }
.sui-switch.on { box-shadow: inset 0 0 0 2px var(--sui-primary); }
.sui-switch.on::after { left: 21px; background: var(--sui-primary); }

/* 滑块 */
input[type=range].sui-slider { -webkit-appearance: none; appearance: none; width: 100%; height: 6px; background: transparent; outline: none; cursor: pointer; }
input[type=range].sui-slider::-webkit-slider-runnable-track { height: 6px; border-radius: 999px; background: linear-gradient(90deg, var(--sui-primary), var(--sui-primary-2)); }
input[type=range].sui-slider::-webkit-slider-thumb { -webkit-appearance: none; width: 16px; height: 16px; border-radius: 50%; margin-top: -5px; background: var(--sui-surface-2); border: 2px solid var(--sui-primary); box-shadow: var(--sui-shadow-sm); }
input[type=range].sui-slider::-webkit-slider-thumb { }

/* 方案标签 */
.scheme-tab {
  display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; cursor: pointer;
  border-radius: 999px; font-size: 12px; color: var(--sui-muted);
  background: var(--sui-surface); box-shadow: var(--sui-shadow-sm);
  transition: all var(--sui-trans);
}
.scheme-tab.active { color: var(--sui-primary); box-shadow: var(--sui-shadow-inset); }
.scheme-tab .ci { cursor: pointer; opacity: .7; }
.scheme-tab .ci:hover { opacity: 1; }

/* 函数行 */
.func-row {
  background: var(--sui-surface); box-shadow: var(--sui-shadow-sm);
  border-radius: var(--sui-radius-sm); padding: 9px 10px; margin-bottom: 9px;
  transition: all var(--sui-trans); border: 1px solid transparent;
}
.func-row.selected { border-color: var(--sui-primary); box-shadow: var(--sui-shadow); }
.func-row .fr-head { display: flex; align-items: center; gap: 7px; margin-bottom: 7px; }
.sw-picker { width: 20px; height: 20px; border-radius: 6px; cursor: pointer; box-shadow: var(--sui-shadow-inset); border: none; flex: none; }
.dot { width: 20px; height: 20px; border-radius: 50%; flex: none; }
.func-row .latex { flex: 1; overflow: hidden; }
.func-label { font-size: 13px; font-weight: 600; flex: 1; min-width: 0; overflow: hidden; }

/* 区域化信息条 */
.ef-banner {
  position: absolute; pointer-events: none; z-index: 10;
  background: var(--sui-surface-3); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  box-shadow: var(--sui-shadow-sm); border-radius: 12px; padding: 6px 13px;
  font-size: 12px; color: var(--sui-text); white-space: normal; max-width: 320px; line-height: 1.6;
}
/* 悬浮曲线提示：解析式 + 坐标 */
.hv-expr { font-weight: 600; margin-bottom: 2px; }
.hv-xy { font-size: 12px; color: var(--sui-muted); }
/* 关于页底部链接 */
.about-links a { font-size: 13px; }
.about-sep { color: var(--sui-muted); margin: 0 8px; }

/* 行内 MathLive 公式片段 */
.ef-ml { display: inline-block; vertical-align: middle; }
.ef-ml .ML__latex { font-size: inherit; }
.ef-tex { font-size: .96em; }

/* 搜索面板解析式下拉（原生 <option> 无法承载 MathLive 标记） */
.ef-dd-wrap { position: relative; margin-bottom: 6px; }
.ef-dd { display: flex; align-items: center; justify-content: space-between; gap: 8px; cursor: pointer; }
.ef-dd .dd-txt { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ef-dd-wrap .dd-list {
  display: none; margin-top: 4px; padding: 4px; border-radius: var(--sui-radius-sm);
  background: var(--sui-surface-3); box-shadow: var(--sui-shadow-inset); max-height: 190px; overflow-y: auto;
}
.ef-dd-wrap.open .dd-list { display: block; }
.ef-dd-wrap .dd-opt { padding: 5px 8px; border-radius: 6px; cursor: pointer; overflow-x: auto; white-space: nowrap; }
.ef-dd-wrap .dd-opt:hover { background: var(--sui-surface); }
.ef-dd-wrap .dd-opt.on { color: var(--sui-primary); font-weight: 600; }
.ef-dd-wrap .dd-opt.dis { opacity: .42; cursor: not-allowed; }
.ef-dd-wrap .dd-opt.dis:hover { background: none; }

/* 参数浮层（右下，位于视图快捷按钮之上） */
.param-pad {
  position: absolute; right: 16px; bottom: 66px; width: 290px; z-index: 20;
  max-height: 46%; overflow-y: auto;
}
.param-pad .pp-title { font-size: 12px; color: var(--sui-muted); margin-bottom: 8px; display: flex; align-items: center; gap: 6px; }
/* 参数值：用 MathLive 显示原始表达式（3/4、sqrt(2) …），表达式过长时可横向滚动 */
.param-pad .sui-card-row { gap: 6px; }
.pp-val { cursor: pointer; max-width: 100%; min-width: 0; white-space: nowrap; overflow-x: auto; scrollbar-width: none; }
.pp-val::-webkit-scrollbar { display: none; }
.pp-val .ef-ml { display: inline-block; }
/* 触摸端加大点按目标：滑块、参数值徽标、列表小按钮 */
@media (pointer: coarse) {
  input[type=range].sui-slider { height: 8px; }
  input[type=range].sui-slider::-webkit-slider-thumb { width: 22px; height: 22px; margin-top: -7px; }
  .pp-val { padding: 6px 12px; font-size: 13px; }
  .sui-btn.sm { min-height: 34px; padding: 0 12px; }
}

/* 绘制区视图快捷操作（右下角） */
.ef-viewctl {
  position: absolute; right: 16px; bottom: 16px; z-index: 22;
  display: flex; flex-direction: column; align-items: flex-end; gap: 8px;
}
.ef-viewctl .sui-iconbtn {
  height: 38px; background: var(--sui-surface); border: 1px solid var(--sui-border);
  box-shadow: var(--sui-shadow-raise);
}

/* 第三方声明全文（内嵌于「关于」，离线可读，无需下载 .md） */
.ef-notices-wrap { margin-top: 12px; border-top: 1px solid var(--sui-border); padding-top: 10px; }
.ef-notices-wrap > summary {
  cursor: pointer; font-size: 12px; color: var(--sui-primary);
  list-style: none; display: flex; align-items: center; gap: 6px;
}
.ef-notices-wrap > summary::-webkit-details-marker { display: none; }
.ef-notices-wrap > summary::before { content: '\25B8'; font-size: 10px; transition: transform var(--sui-trans); }
.ef-notices-wrap[open] > summary::before { transform: rotate(90deg); }
.ef-notices {
  margin-top: 10px; font-size: 12px; line-height: 1.65; color: var(--sui-muted);
  max-height: 48vh; overflow: auto; padding-right: 4px;
}
.ef-notices h1 { display: block; font-size: 14px; color: var(--sui-text); margin: 0 0 8px; }
.ef-notices h2 { display: block; font-size: 13px; color: var(--sui-text); margin: 14px 0 6px; }
.ef-notices h3 { display: block; font-size: 12px; color: var(--sui-text); margin: 12px 0 5px; }
.ef-notices p { margin: 6px 0; }
.ef-notices blockquote {
  margin: 8px 0; padding: 7px 10px; border-left: 3px solid var(--sui-primary);
  background: var(--sui-surface-2); border-radius: 0 6px 6px 0; color: var(--sui-text);
}
.ef-notices ul { margin: 6px 0; padding-left: 18px; }
.ef-notices li { margin: 2px 0; }
.ef-notices hr { border: none; border-top: 1px solid var(--sui-border); margin: 12px 0; }
.ef-notices a { word-break: break-all; }
.ef-notices code {
  background: var(--sui-surface-2); border: 1px solid var(--sui-border);
  border-radius: 4px; padding: 1px 4px; font-size: 11px;
}
.ef-notices .nt-code {
  background: var(--sui-surface-2); border: 1px solid var(--sui-border); border-radius: 8px;
  padding: 10px; margin: 8px 0; font-size: 11px; line-height: 1.55; color: var(--sui-text);
  white-space: pre-wrap; word-break: break-word; overflow-x: auto;
}
.ef-notices .nt-table { width: 100%; border-collapse: collapse; margin: 8px 0; font-size: 11px; }
.ef-notices .nt-table th, .ef-notices .nt-table td {
  border: 1px solid var(--sui-border); padding: 5px 7px; text-align: left; vertical-align: top;
}
.ef-notices .nt-table th { background: var(--sui-surface-2); color: var(--sui-text); }

/* 右侧浮动面板（跳转/搜索/表格） */
.ef-floater {
  position: absolute; right: 16px; top: 74px; width: 300px; z-index: 30; max-height: 76%; overflow-y: auto;
}

/* 工具提示 */
[data-tip] { position: relative; }
[data-tip]:hover::after {
  content: attr(data-tip); position: absolute; top: calc(100% + 7px); left: 50%; transform: translateX(-50%);
  background: var(--sui-text); color: var(--sui-bg); padding: 4px 8px; border-radius: 6px;
  font-size: 11px; white-space: nowrap; z-index: 300; pointer-events: none;
}

/* 折叠/展开 */
.collapse { display: grid; grid-template-rows: 0fr; transition: grid-template-rows var(--sui-trans); }
.collapse.open { grid-template-rows: 1fr; }
.collapse > div { overflow: hidden; }

/* 滚动条 */
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-thumb { background: var(--sui-muted); border-radius: 999px; opacity: .5; }
::-webkit-scrollbar-track { background: transparent; }

/* 小色板 */
.color-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 7px; }
.color-grid .c { height: 24px; border-radius: 7px; cursor: pointer; box-shadow: var(--sui-shadow-inset); border: 2px solid transparent; transition: all var(--sui-trans); }
.color-grid .c:hover { transform: scale(1.12); }
.color-grid .c.sel { border-color: var(--sui-text); }
.width-opt { display: flex; gap: 6px; align-items: center; }
.width-opt button { width: 34px; height: 34px; border-radius: 9px; cursor: pointer; background: var(--sui-surface); box-shadow: var(--sui-shadow-sm); border: 2px solid transparent; display: flex; align-items: center; justify-content: center; }
.width-opt button.line { border-bottom: 3px solid currentColor; }
.width-opt button.sel { border-color: var(--sui-primary); }

.ef-list-empty { color: var(--sui-muted); text-align: center; padding: 18px; font-size: 12px; }
.ef-row-item { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 7px 6px; border-radius: 8px; cursor: pointer; transition: all var(--sui-trans); }
.ef-row-item:hover { background: var(--sui-surface-3); color: var(--sui-primary); }
.ef-exact { flex-basis: 100%; font-size: 12px; color: var(--sui-muted); }
.opt-check { display: flex; align-items: center; gap: 8px; padding: 7px 8px; border-radius: 8px; cursor: pointer; }
.opt-check:hover { background: var(--sui-surface-3); }
.opt-check input { accent-color: var(--sui-primary); }
.quota-bar { height: 6px; border-radius: 999px; background: var(--sui-surface); box-shadow: var(--sui-shadow-inset); overflow: hidden; }
.quota-bar > i { display: block; height: 100%; background: linear-gradient(90deg, var(--sui-primary), var(--sui-primary-2)); width: 0; transition: width var(--sui-trans); }
.sui-loading { display: inline-block; width: 14px; height: 14px; border: 2px solid var(--sui-muted); border-top-color: transparent; border-radius: 50%; animation: efSpin .8s linear infinite; }
@keyframes efSpin { to { transform: rotate(360deg); } }
.ef-avatar {
  width: 34px; height: 34px; border-radius: 50%; cursor: pointer; overflow: hidden; flex: none;
  box-shadow: var(--sui-shadow-sm); transition: all var(--sui-trans);
}
.ef-avatar:hover { transform: translateY(-1px); box-shadow: var(--sui-shadow); }
.ef-avatar img { width: 100%; height: 100%; object-fit: cover; }
.ef-divider { width: 1px; height: 26px; background: var(--sui-border); margin: 0 4px; }
.brand-logo { width: 20px; height: 20px; border-radius: 6px; overflow: hidden; flex: none; }
.brand-logo img { width: 100%; height: 100%; object-fit: cover; }
.app-title { font-size: 15px; font-weight: 700; letter-spacing: .2px; display: flex; align-items: center; gap: 8px; margin-right: 6px; }
.about-logo { width: 62px; height: 62px; border-radius: 16px; overflow: hidden; box-shadow: var(--sui-shadow-raise); margin: 0 auto 12px; }
.about-logo img { width: 100%; height: 100%; object-fit: cover; }

/* 工具栏默认不裁剪（提示可浮出），窄屏时才滚动 */
.ef-toolbar { overflow: visible; scrollbar-width: none; }
.ef-toolbar::-webkit-scrollbar { display: none; }
#toolbarMenu { display: none; }

/* 全面屏：直接用视口高度撑满，避免依赖 html/body 百分比链在部分浏览器不生效 */
.ef-app { height: 100vh; height: 100dvh; }

/* 响应式：窄桌面 / 平板 */
@media (max-width: 980px) and (min-width: 641px) {
  .ef-toolbar { gap: 8px; overflow-x: auto; overflow-y: hidden; }
  .app-title { font-size: 14px; }
  .ef-floater { right: 10px; top: 10px; width: auto; max-width: 60%; }
  .param-pad { right: 10px; bottom: 58px; width: auto; max-width: 60%; }
  .ef-viewctl { right: 10px; bottom: 10px; }
  .sui-modal { width: 94vw; }
  .sui-menu { max-width: 90vw; }
}

/* 响应式：手机 —— 画布依旧占满，输入区折行，函数列表整宽浮层 */
@media (max-width: 640px) {
  .ef-toolbar { padding: 0 8px; overflow-x: auto; overflow-y: hidden; }
  #toolbarMenu { display: inline-flex; }
  .ef-addbar { top: 8px; width: calc(100% - 16px); padding: 6px 8px; gap: 6px; flex-wrap: wrap; }
  .ef-addbar .ab-name { display: none; }
  .ef-addbar .ab-mf { flex: 1 1 100%; order: 5; min-width: 0; }
  /* 浮层不铺满：函数列表 / 参数面板最多占一半高度，绘图区始终留出可见部分 */
  .ef-sidebar { top: 116px; left: 8px; right: 8px; width: auto; bottom: auto; max-height: 46%; }
  .ef-floater { right: 8px; top: 116px; left: 8px; width: auto; max-height: 50%; }
  .param-pad { right: 8px; bottom: 58px; left: 8px; width: auto; max-height: 34%; }
  .ef-viewctl { right: 8px; bottom: 8px; }
  .sui-modal { width: 94vw; }
  .sui-menu { max-width: 90vw; }
}
/* 深色主题侧栏分隔线随主题 */
html[data-theme="dark"] .ef-sidebar { border-bottom-color: var(--sui-border); }