/* TOOLS & SKILLS (L1) — js/tuhi/l1tools.js. Built on the console's tokens (tuhi-shell.css: --surface, --bd, --acc …) and its
   db-* / l1-* components; only what those do not cover is here. Both themes come from the tokens. */
.l1t-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(340px,1fr)); gap:14px; margin-bottom:16px; }
@media (max-width:520px){ .l1t-grid{ grid-template-columns:minmax(0,1fr); } }
.l1t-gh{ display:flex; align-items:baseline; gap:8px; margin:18px 0 10px; font-size:12px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; color:var(--fg-2); }
.l1t-gh .muted{ font-weight:600; letter-spacing:0; }
.l1t-card{ display:flex; flex-direction:column; gap:2px; }
.l1t-planned{ border-style:dashed; background:var(--surface-2); }
.l1t-ch{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.l1t-badges{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.l1t-lvl{ display:inline-flex; align-items:center; justify-content:center; height:20px; padding:0 7px; border-radius:6px; font-size:11px; font-weight:800;
  background:var(--acc); color:var(--on-acc); letter-spacing:.02em; }
.l1t-name{ margin:10px 0 0; font-size:15px; font-weight:700; color:var(--fg); display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
.l1t-id{ font-size:11.5px; font-weight:500; color:var(--mut); }
.l1t-sn{ display:flex; gap:6px; align-items:flex-start; margin:0 0 8px; }
.l1t-kv{ grid-template-columns:92px minmax(0,1fr); gap:7px 12px; font-size:12.5px; margin-top:4px; }
.l1t-kv code, .l1t-src code{ font-size:11.5px; }
.l1t-src{ font-size:11.5px; color:var(--mut); margin-top:3px; line-height:1.45; }
.l1t-chip{ display:inline-block; margin:0 4px 3px 0; padding:1px 8px; border-radius:99px; border:1px solid var(--bd); background:var(--surface-2); font-size:11.5px; color:var(--fg-2); }
.l1t-needs{ margin:0; padding-left:16px; } .l1t-needs li{ margin:2px 0; }
.l1t-try{ display:inline-flex; align-items:center; gap:5px; height:28px; padding:0 10px; border-radius:8px; font-size:12.5px; }
.l1t-try[disabled]{ opacity:.55; cursor:not-allowed; }
.l1t-tryout{ margin-top:10px; padding-top:10px; border-top:1px dashed var(--bd); }
.l1t-tryform{ display:flex; flex-direction:column; gap:8px; }
.l1t-lab{ display:flex; flex-direction:column; gap:4px; font-size:12px; color:var(--fg-2); }
.l1t-lab .ctl{ width:100%; }
.l1t-tryrow{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.l1t-tryrow .act{ display:inline-flex; align-items:center; gap:6px; }
.l1t-out, .l1t-snip pre{ margin:0; max-height:320px; overflow:auto; padding:10px 12px; border-radius:9px; border:1px solid var(--bd); background:var(--surface-2);
  color:var(--fg); font-size:11.5px; line-height:1.5; white-space:pre-wrap; overflow-wrap:anywhere; }
.l1t-two{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:14px; margin-bottom:14px; }
@media (max-width:1000px){ .l1t-two{ grid-template-columns:minmax(0,1fr); } }
.l1t-snip{ margin-bottom:12px; } .l1t-sniph{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:6px; font-size:12.5px; }
.l1t-tablewrap{ overflow-x:auto; }
.l1t-table{ width:100%; border-collapse:collapse; font-size:12.5px; }
.l1t-table th{ text-align:left; font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--mut); padding:6px 8px; border-bottom:1px solid var(--bd); }
.l1t-table td{ padding:8px; border-bottom:1px solid var(--bd-soft); vertical-align:top; color:var(--fg); }
.l1t-does{ color:var(--fg-2); min-width:260px; line-height:1.45; }
.l1t-num{ text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.l1t-small{ font-size:11.5px; }
.l1t-limits{ display:grid; grid-template-columns:repeat(auto-fill,minmax(360px,1fr)); column-gap:24px; }
.l1t-limits .l1-h4{ grid-column:1 / -1; }
.l1t-limits .db-row .n{ white-space:normal; }
.l1t-where{ margin-top:16px; }
.l1t-where .l1-badge{ width:auto; padding:0 8px; font-size:12px; }
/* Imported prompt-skills: the instructions, folded by default */
.l1t-instr{ margin-top:8px; }
.l1t-instr summary{ cursor:pointer; font-size:12px; color:var(--mut, inherit); }
.l1t-instr pre{ white-space:pre-wrap; word-break:break-word; margin-top:6px; }
/* Try results that are media (image_generate, browse screenshot) or files (document_export, browse pdf): shown here, kept nowhere */
.l1t-media{ margin:8px 0; }
.l1t-img{ display:block; max-width:100%; max-height:360px; border-radius:9px; border:1px solid var(--bd); }
.l1t-tryform textarea.ctl{ width:100%; font-family:var(--mono, ui-monospace, Menlo, monospace); font-size:12px; resize:vertical; }