/* Outils Bancada — feuille commune aux pages d'outils du front.
   Consomme les jetons :root de styles.css (palette ambre / bleu nuit, mode light).
   Aucun asset externe, aucune dépendance. */

.tool-intro{max-width:760px}
.tool-intro p{font-size:18px;color:var(--text-secondary)}

.tool-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:22px;align-items:start}
.tool-panel{background:var(--surface);border:1px solid var(--border);padding:26px}
.tool-panel h2{font-size:24px;letter-spacing:-.04em;margin:0 0 6px}
.tool-hint{color:var(--text-muted);font-size:14px;margin:0 0 18px}

.field{display:block;margin:0 0 16px}
.field b{display:block;font-size:13px;letter-spacing:.01em}
.field span{display:block;font-size:12px;color:var(--text-muted);margin-bottom:6px}
.field input,.field select{width:100%;padding:11px 12px;border:1px solid var(--border);background:var(--surface);color:var(--text);font:inherit;font-size:15px}
.field input:focus-visible,.field select:focus-visible{outline:3px solid var(--primary);outline-offset:2px}
.field-pair{display:grid;grid-template-columns:1fr 1fr;gap:14px}

.rows{border-top:1px solid var(--border);margin-top:6px}
.row{display:grid;grid-template-columns:1.4fr .8fr .8fr auto;gap:10px;align-items:end;padding:14px 0;border-bottom:1px solid var(--border)}
.row .field{margin:0}
.row-drop{background:transparent;border:1px solid var(--border);color:var(--text-muted);font:inherit;padding:10px 12px;cursor:pointer;line-height:1}
.row-drop:hover{border-color:var(--secondary);color:var(--secondary)}
.row-add{background:var(--fill);border:1px solid var(--border);color:var(--secondary);font:inherit;font-weight:600;padding:11px 16px;margin-top:16px;cursor:pointer}
.row-add:hover{background:var(--callout-bg);border-color:var(--callout-border)}

.tool-result{background:var(--secondary);color:var(--white);padding:26px;position:sticky;top:18px}
.tool-result .eyebrow{color:var(--primary)}
.tool-result strong{display:block;font-family:var(--display);font-size:40px;line-height:1.05;color:var(--primary);margin:2px 0 10px}
.tool-result p{color:var(--bg);margin:0 0 14px;font-size:15px}
.tool-result ul{list-style:none;margin:0;padding:0;border-top:1px solid rgba(232,176,75,.35)}
.tool-result li{display:flex;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px solid rgba(244,241,234,.14);font-size:15px;color:var(--bg)}
.tool-result li b{color:var(--white);font-weight:600;text-align:right}
.tool-result .verdict{color:var(--white);font-size:16px;margin:16px 0 0}

.tool-note{background:var(--callout-bg);color:var(--callout-text);border-left:3px solid var(--callout-border);padding:18px 22px;margin:26px 0;font-size:15px}
.tool-note p{margin:0 0 10px}
.tool-note p:last-child{margin:0}

.tool-method{max-width:820px}
.tool-method h2{font-size:26px;letter-spacing:-.04em;margin:34px 0 12px}
.tool-method p{color:var(--text-secondary);margin:0 0 14px}
.tool-method ul{color:var(--text-secondary);margin:0 0 14px;padding-left:20px}
.tool-method li{margin:0 0 8px}

.pitch{width:100%;height:auto;display:block;background:var(--fill);border:1px solid var(--border)}
.pitch .zone{fill:var(--fill);stroke:var(--border);stroke-width:2;transition:fill .2s ease}
.pitch .zone.on{fill:var(--primary)}
.pitch .grass{fill:var(--secondary);opacity:.10;stroke:var(--secondary);stroke-width:2}
.pitch text{font-family:var(--mono);font-size:13px;fill:var(--secondary)}

@media(max-width:760px){
  .tool-grid{grid-template-columns:1fr}
  .tool-result{position:static}
  .row{grid-template-columns:1fr 1fr;gap:10px}
  .field-pair{grid-template-columns:1fr}
}