/* CPT Optimizer panel — all selectors prefixed .cptopt to stay out of app styles.
   Themed via the app's --c-* tokens (redesign.css) with light fallbacks so the
   standalone /cpt-demo.html (which loads only this file) keeps its light look. */
.cptopt{
  --cpt-bg: var(--c-surface, #fbfdfd);
  --cpt-card: var(--c-raised, #fff);
  --cpt-border: var(--c-border, #e3ebe9);
  --cpt-border-strong: var(--c-border-strong, #d8e2e0);
  --cpt-text: var(--c-text, #1f2937);
  --cpt-text-2: var(--c-text-2, #6b7c79);
  --cpt-text-3: var(--c-text-3, #8a9a97);
  --cpt-accent: var(--c-accent, #0f766e);
  --cpt-on-accent: var(--c-bg, #fff);
  --cpt-ok: var(--c-ok, #166534);
  --cpt-warn: var(--c-warn, #92400e);
  --cpt-err: var(--c-err, #b91c1c);
  --cpt-font: var(--c-font-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
  --cpt-mono: var(--c-font-mono, ui-monospace, SFMono-Regular, monospace);
  margin:16px 0 8px;border:1px solid var(--cpt-border-strong);border-radius:var(--c-r-lg, 14px);
  padding:14px 16px;background:var(--cpt-bg);font-family:var(--cpt-font);
  font-size:13px;color:var(--cpt-text);line-height:1.4}
.cptopt-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.cptopt-logo{background:var(--cpt-accent);color:var(--cpt-on-accent);font-weight:700;font-size:11px;border-radius:6px;padding:2px 6px}
.cptopt-src{font-size:10.5px;color:var(--cpt-text-3);text-transform:uppercase;letter-spacing:.05em}
.cptopt-seg{margin-left:auto;display:flex;gap:4px}
.cptopt-seg button{border:1px solid var(--cpt-border-strong);background:var(--cpt-card);color:var(--cpt-text-2);
  font-family:inherit;font-size:11.5px;font-weight:600;padding:4px 10px;border-radius:999px;cursor:pointer}
.cptopt-seg button.on{background:var(--cpt-accent);border-color:var(--cpt-accent);color:var(--cpt-on-accent)}
.cptopt-empty{color:var(--cpt-text-2);font-size:12.5px}
.cptopt-list{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}
.cptopt-row{display:flex;align-items:center;gap:8px;border:1px solid var(--cpt-border);
  border-radius:var(--c-r, 10px);padding:8px 10px;background:var(--cpt-card);cursor:pointer}
.cptopt-row:hover{border-color:var(--cpt-accent)}
.cptopt-row.dropped{opacity:.5}
.cptopt-row .cc{font-weight:700;font-family:var(--cpt-mono);font-variant-numeric:tabular-nums;min-width:46px}
.cptopt-row .qy{border:1px solid var(--cpt-border-strong);background:var(--cpt-card);border-radius:6px;
  font-family:inherit;font-size:10.5px;font-weight:700;color:var(--cpt-text-2);padding:2px 6px;cursor:pointer}
.cptopt-row .qy:hover{border-color:var(--cpt-accent);color:var(--cpt-accent)}
.cptopt-row .cd{flex:1;min-width:0;font-size:12px}
.cptopt-row .cd .cm{display:block;font-size:10.5px;color:var(--cpt-text-3);margin-top:1px}
.cptopt-row .cv{font-weight:700;color:var(--cpt-accent);font-family:var(--cpt-mono);font-variant-numeric:tabular-nums}
.cptopt-row .rm{border:none;background:none;color:var(--cpt-text-3);font-size:17px;line-height:1;cursor:pointer;padding:0 2px}
.cptopt-row .tag{font-size:9.5px;font-weight:700;padding:1px 6px;border-radius:5px;text-transform:uppercase;white-space:nowrap}
.cptopt-row .tag.half{background:color-mix(in srgb, var(--cpt-warn) 18%, transparent);color:var(--cpt-warn)}
.cptopt-row .tag.drop{background:color-mix(in srgb, var(--cpt-err) 18%, transparent);color:var(--cpt-err)}
.cptopt-row .tag.off{background:color-mix(in srgb, var(--cpt-text-3) 18%, transparent);color:var(--cpt-text-3)}
.cptopt-row .tag.forced{background:color-mix(in srgb, var(--cpt-warn) 18%, transparent);color:var(--cpt-warn)}
.cptopt-al{border-radius:9px;padding:8px 10px;font-size:12px;display:flex;gap:8px;margin:6px 0}
.cptopt-al .ico{font-weight:700}
.cptopt-al.never{background:color-mix(in srgb, var(--cpt-err) 14%, transparent);color:var(--cpt-err)}
.cptopt-al.modifier{background:color-mix(in srgb, var(--cpt-warn) 14%, transparent);color:var(--cpt-warn)}
.cptopt-al.together{background:color-mix(in srgb, var(--cpt-ok) 14%, transparent);color:var(--cpt-ok)}
.cptopt-al.info{background:color-mix(in srgb, var(--cpt-accent) 12%, transparent);color:var(--cpt-accent)}
.cptopt-note{margin:6px 0;padding:7px 9px;border-left:3px solid var(--cpt-warn);
  background:color-mix(in srgb, var(--cpt-warn) 9%, transparent);
  font-size:11.5px;color:var(--cpt-text-2);border-radius:0 6px 6px 0}
.cptopt-note b{color:var(--cpt-text)}
.cptopt-note .cptopt-nc{color:var(--cpt-accent);font-weight:700;cursor:pointer;text-decoration:underline}
.cptopt-sug .sh{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;
  color:var(--cpt-text-3);margin:10px 0 6px}
.cptopt-sug .sg{display:flex;flex-wrap:wrap;gap:6px}
.cptopt-sug .sgchip{border:1px dashed var(--cpt-accent);background:transparent;color:var(--cpt-accent);
  font-family:inherit;font-weight:700;font-size:12px;border-radius:999px;padding:4px 10px;cursor:pointer}
.cptopt-sug .sgv,.cptopt-srch .sgv{font-weight:600;color:var(--cpt-text-3);font-size:11px}
.cptopt-srch{margin-top:10px}
.cptopt-srch input{width:100%;border:1px solid var(--cpt-border-strong);border-radius:9px;padding:8px 10px;
  font-family:inherit;font-size:12.5px;background:var(--cpt-card);color:var(--cpt-text);box-sizing:border-box}
.cptopt-srch input::placeholder{color:var(--cpt-text-3)}
.cptopt-srch .cpt-hits,.cptopt-srch .cptopt-hits{display:flex;flex-direction:column;gap:4px;margin-top:4px}
.cptopt-srch .cptopt-hit{text-align:left;border:1px solid var(--cpt-border);background:var(--cpt-card);
  color:var(--cpt-text);font-family:inherit;border-radius:8px;padding:6px 9px;font-size:12px;cursor:pointer}
.cptopt-srch .cptopt-hit:hover{border-color:var(--cpt-accent)}
.cptopt-tot{margin-top:12px;border-top:1px solid var(--cpt-border);padding-top:9px;display:flex;
  flex-direction:column;gap:4px}
.cptopt-tot .cptopt-trow{display:flex;justify-content:space-between;font-size:12px;color:var(--cpt-text-2)}
.cptopt-tot .cptopt-trow .tv{font-weight:700;font-family:var(--cpt-mono);font-variant-numeric:tabular-nums;color:var(--cpt-text)}
.cptopt-tot .cptopt-trow.is-main{font-size:13.5px;color:var(--cpt-text)}
.cptopt-tot .cptopt-trow.is-main .tv{color:var(--cpt-accent);font-size:17px}
.cptopt-copy{margin-top:10px;width:100%;border:none;background:var(--cpt-accent);color:var(--cpt-on-accent);
  font-family:inherit;font-weight:600;font-size:13px;padding:10px;border-radius:9px;cursor:pointer}