/* Lead Digger — the OpsWay app design system.
 *
 * Tokens and component metrics are lifted verbatim from Business Lab so the two apps look
 * like one product rather than two projects. Everything below the "Lead Digger" divider is
 * specific to this app: notice cards, score badges, the core editor and the filter form.
 */

:root{ --green:#5FB572; --green-d:#2E8F5A; --green-dk:#0E3A29; --brand:#6CBE8C; --gold:#B08D57;
       --ink:#22201C; --body:#54504a; --grey:#8A8A8A; --soft:#F5F8F5; --line:#E6ECE6;
       --bg:#F1F4F1; --red:#C0564B; --blue:#3B72B0; --purple:#7C5CBF; --graphite:#3a4350; }
*{ box-sizing:border-box; margin:0; padding:0; }
body{ font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; background:var(--bg);
      color:var(--ink); -webkit-font-smoothing:antialiased; }
.muted{ color:var(--grey) }
.link{ color:var(--green-d); font-weight:800; cursor:pointer } .link:hover{ text-decoration:underline }
a{ color:var(--green-d) }

/* ── entry screen ─────────────────────────────────────────────────────────── */
.gate{ min-height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center;
       background:linear-gradient(160deg,#0E3A29,#14432F 55%,#1C6A45); padding:40px 20px; }
.gate .logo-row{ display:flex; align-items:center; gap:12px; margin-bottom:6px; }
.gate .logo-row img{ display:block; }
.gate .tl{ font-size:11px; letter-spacing:2px; text-transform:uppercase; margin-bottom:34px; }
.gate h1{ color:#fff; font-size:20px; font-weight:900; margin-bottom:6px; }
.gate .s{ color:#cfe6d6; font-size:13px; margin-bottom:26px; text-align:center; max-width:560px; }
.gate .hint{ color:#7FB894; font-size:11.5px; margin-top:26px; max-width:560px; text-align:center; line-height:1.6; }
.band-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,230px)); gap:14px;
            justify-content:center; max-width:860px; }
.band-card{ background:#fff; border-radius:14px; padding:20px 22px; cursor:pointer; border:2px solid transparent;
            box-shadow:0 14px 40px rgba(0,0,0,.25); }
.band-card:hover{ border-color:var(--brand); transform:translateY(-2px); }
.band-card .cn{ font-weight:900; font-size:16px; }
.band-card .cnum{ font-size:34px; font-weight:900; letter-spacing:-1.5px; color:var(--green-d); margin-top:6px; }
.band-card .cs{ margin-top:6px; font-size:11.5px; color:var(--body); line-height:1.5; }

/* ── shell ────────────────────────────────────────────────────────────────── */
.app{ display:none; min-height:100vh; flex-direction:column; }
.app.open{ display:flex; }
.topbar{ background:var(--green-dk); color:#fff; padding:6px 22px; display:flex; align-items:center;
         gap:14px 18px; flex-wrap:wrap; min-height:54px; position:sticky; top:0; z-index:50; }
.topbar .brand{ display:flex; align-items:center; gap:9px; font-weight:900; letter-spacing:-.3px; }
.topbar .brand img{ display:block; }
.topbar nav{ display:flex; gap:2px; margin-left:12px; flex-wrap:wrap; }
.topbar nav .t{ padding:8px 13px; border-radius:8px; font-size:13px; font-weight:800; color:#bcd7c4; cursor:pointer; }
.topbar nav .t:hover{ color:#fff; background:rgba(255,255,255,.07); }
.topbar nav .t.on{ color:#fff; background:rgba(95,181,114,.25); }
.topbar nav .t .n{ opacity:.65; font-weight:900; margin-left:5px; }
.who{ margin-left:auto; display:flex; align-items:center; gap:10px; font-size:11.5px; color:#9FE0B4; }
.who .dev{ background:var(--gold); color:#fff; font-size:10px; font-weight:900; letter-spacing:.8px;
           text-transform:uppercase; padding:4px 9px; border-radius:14px; }
.content{ padding:24px 30px 70px; max-width:1180px; width:100%; margin:0 auto; }
.eyebrow{ font-size:10px; letter-spacing:1.5px; text-transform:uppercase; color:var(--gold); font-weight:800; margin-bottom:4px; }
.sec-h{ font-size:11px; letter-spacing:1.2px; text-transform:uppercase; color:var(--gold); font-weight:800; margin:22px 0 9px; }
h2.vh{ font-size:19px; font-weight:900; letter-spacing:-.4px; margin-bottom:3px; }
.vsub{ font-size:12.5px; color:var(--body); margin-bottom:18px; max-width:760px; line-height:1.6; }

/* ── primitives ───────────────────────────────────────────────────────────── */
.panel{ background:#fff; border:1px solid var(--line); border-radius:14px; padding:19px 21px;
        box-shadow:0 4px 16px rgba(20,60,40,.04); }
.panel h3{ font-size:15px; font-weight:900; }
.btn{ font-family:inherit; font-weight:800; font-size:13px; border:none; border-radius:8px; padding:9px 15px; cursor:pointer; }
.btn.primary{ background:var(--green-d); color:#fff; }
.btn.ghost{ background:#fff; color:var(--green-d); border:1px solid var(--line); }
.btn.danger{ background:#fff; color:var(--red); border:1px solid #ecc; }
/* Retiring a term is destructive but it is not the primary action on the row — it should be
   available, not shouted. Red only once the pointer is on it. */
.btn.retire{ background:#fff; color:var(--grey); border:1px solid var(--line); }
.btn.retire:hover{ color:var(--red); border-color:#ecc; }
.btn.sm{ padding:6px 10px; font-size:12px; }
.btn:disabled{ opacity:.45; cursor:not-allowed; }
.chip{ display:inline-block; font-size:10.5px; font-weight:800; letter-spacing:.4px; text-transform:uppercase;
       padding:3px 9px; border-radius:20px; }
.chip.pri{ background:rgba(46,143,90,.14); color:var(--green-d); }
.chip.rev{ background:rgba(59,114,176,.12); color:var(--blue); }
.chip.watch{ background:rgba(176,141,87,.15); color:var(--gold); }
.chip.neg{ background:#fdf3f1; color:var(--red); border:1px dashed #ecc; }
.chip.trap{ background:rgba(124,92,191,.12); color:var(--purple); }
.chip.plain{ background:var(--soft); color:var(--body); border:1px solid var(--line); }
.kpis{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:16px; }
.kpi{ background:#fff; border:1px solid var(--line); border-radius:13px; padding:15px 17px; }
.kpi .l{ font-size:10.5px; letter-spacing:.6px; text-transform:uppercase; color:var(--grey); font-weight:800; }
.kpi .n{ font-size:28px; font-weight:900; margin-top:5px; letter-spacing:-1px; }
.kpi .s{ font-size:11.5px; color:var(--body); margin-top:2px; }
.filterbar{ display:flex; gap:8px; flex-wrap:wrap; margin:0 0 14px; align-items:center; }
.fchip{ font-size:12px; font-weight:800; padding:5px 12px; border-radius:20px; border:1px solid var(--line);
        background:#fff; cursor:pointer; color:var(--body); }
.fchip.on{ background:var(--green-d); color:#fff; border-color:var(--green-d); }
table{ width:100%; border-collapse:collapse; }
th{ text-align:left; font-size:10px; letter-spacing:1px; text-transform:uppercase; color:var(--grey);
    font-weight:800; padding:7px 10px; border-bottom:2px solid var(--line); }
td{ font-size:12.5px; padding:9px 10px; border-bottom:1px solid var(--line); vertical-align:top; }
tr:last-child td{ border-bottom:none; }
.tbl-scroll{ overflow-x:auto; }
textarea{ font-family:inherit; font-size:13px; border:1px solid var(--line); border-radius:8px; padding:9px 12px;
          width:100%; min-height:70px; resize:vertical; }
select,input[type=text],input[type=number]{ font-family:inherit; font-size:13px; border:1px solid var(--line);
          border-radius:8px; padding:8px 11px; background:#fff; color:var(--ink); }
.overlay{ position:fixed; inset:0; background:rgba(14,58,41,.5); display:none; align-items:flex-start;
          justify-content:center; z-index:400; padding:36px 18px; overflow:auto; }
.overlay.open{ display:flex; }
.modal{ background:#fff; border-radius:16px; width:820px; max-width:100%; box-shadow:0 30px 80px rgba(0,0,0,.35); }
.modal .mh{ padding:18px 24px; border-bottom:1px solid var(--line); display:flex; justify-content:space-between;
            align-items:flex-start; gap:14px; }
.modal .mh h3{ font-size:18px; font-weight:900; line-height:1.35; }
.modal .mh .sub{ font-size:12px; color:var(--body); margin-top:5px; }
.modal .mb{ padding:20px 24px; }
.modal .mf{ padding:14px 24px; border-top:1px solid var(--line); display:flex; justify-content:space-between;
            gap:10px; align-items:center; flex-wrap:wrap; }
.x{ cursor:pointer; color:var(--grey); font-size:22px; border:none; background:none; }
.toast-note{ position:fixed; right:20px; bottom:20px; background:var(--green-dk); color:#fff; border-radius:10px;
             padding:12px 17px; font-size:13px; font-weight:700; box-shadow:0 14px 40px rgba(0,0,0,.3);
             display:none; z-index:500; max-width:380px; line-height:1.5; }
.toast-note.bad{ background:#5c211c; }

/* ══════════════════════ Lead Digger ══════════════════════════════════════ */

/* A stale-score warning. The scorer is a Python process on a schedule; editing a weight
   here changes nothing on screen until it runs. Saying so is the whole point of the banner —
   numbers that silently belong to an older version of the core are worse than no numbers. */
.stale{ background:#fff8ec; border:1px solid #f0dfc0; border-left:4px solid var(--gold); border-radius:10px;
        padding:12px 16px; font-size:12.5px; color:#6b5626; margin-bottom:16px; line-height:1.6; }
.stale code{ background:#f6ecd8; padding:1px 6px; border-radius:5px; font-size:12px; }

.nlist{ display:flex; flex-direction:column; gap:11px; }
.ncard{ background:#fff; border:1px solid var(--line); border-radius:13px; padding:14px 16px; cursor:pointer;
        box-shadow:0 3px 12px rgba(20,60,40,.04); display:flex; gap:14px; align-items:flex-start;
        transition:transform .1s, box-shadow .1s; }
.ncard:hover{ transform:translateY(-1px); box-shadow:0 9px 22px rgba(20,60,40,.09); border-color:#cfe0d5; }
.ncard.is-pri{ border-left:4px solid var(--green-d); }
.ncard.is-rev{ border-left:4px solid var(--blue); }
.ncard.is-watch{ border-left:4px solid var(--gold); }
.score{ flex:none; width:52px; text-align:center; }
.score .v{ font-size:23px; font-weight:900; letter-spacing:-1px; color:var(--green-dk); line-height:1; }
.score .l{ font-size:9px; letter-spacing:.8px; text-transform:uppercase; color:var(--grey); font-weight:800; margin-top:3px; }
.ncard .nb{ flex:1; min-width:0; }
.ncard .nt{ font-size:14px; font-weight:900; line-height:1.35; color:var(--ink); }
/* Scoped to .ncard this styled nothing on the Machine screen, where the same row of numbers
   collapsed into "cost freeproduces tenderlast run 1 h ago". A row of numbers is a row of
   numbers wherever it appears. */
.nm2{ font-size:11.5px; color:var(--body); margin-top:5px; display:flex; gap:9px 16px;
      flex-wrap:wrap; align-items:center; }
.nm2 b{ color:var(--ink); }
.ncard .why{ font-size:11.5px; color:var(--grey); margin-top:7px; line-height:1.5; }
.ncard .terms{ display:flex; gap:5px; flex-wrap:wrap; margin-top:8px; }
.tg{ font-size:10.5px; font-weight:800; background:var(--soft); border:1px solid var(--line); color:var(--body);
     padding:2px 8px; border-radius:12px; }
.tg.neg{ background:#fdf3f1; border-color:#ecc; color:var(--red); }
.tg.trap{ background:#f2f0fa; border-color:#ddd6f0; color:var(--purple); }
.dl{ font-weight:800; }
.dl.soon{ color:var(--red); }
.empty{ text-align:center; padding:54px 20px; color:var(--grey); font-size:13.5px; line-height:1.7; }

/* notice detail */
.dgrid{ display:grid; grid-template-columns:1fr 1fr; gap:9px 22px; font-size:12.5px; margin-bottom:4px; }
.dgrid .k{ color:var(--grey); font-weight:800; font-size:10.5px; letter-spacing:.7px; text-transform:uppercase; }
.dgrid .v{ margin-bottom:8px; }
.ntext{ background:var(--soft); border:1px solid var(--line); border-radius:10px; padding:13px 15px;
        font-size:12.5px; line-height:1.65; white-space:pre-wrap; max-height:340px; overflow:auto; color:var(--body); }
.atts{ display:flex; flex-direction:column; gap:4px; font-size:12px; }

/* core editor */
.lrow{ display:flex; align-items:center; gap:12px; padding:11px 14px; border-bottom:1px solid var(--line); }
.lrow:last-child{ border-bottom:none; }
.lrow.off{ background:#fafafa; }
.lrow .lname{ font-weight:900; font-size:13.5px; flex:1; min-width:0; }
.lrow.off .lname{ color:var(--grey); }
.lrow .lcode{ font-size:11px; color:var(--grey); font-weight:700; }
.lrow .lstat{ font-size:11px; color:var(--body); white-space:nowrap; }
.wt{ width:62px; padding:5px 8px; font-weight:800; text-align:center; }
.sw{ position:relative; width:42px; height:23px; flex:none; }
.sw input{ opacity:0; width:0; height:0; }
.sw .sl{ position:absolute; inset:0; background:#d5dad5; border-radius:23px; cursor:pointer; transition:.15s; }
.sw .sl:before{ content:''; position:absolute; height:17px; width:17px; left:3px; top:3px; background:#fff;
                border-radius:50%; transition:.15s; }
.sw input:checked + .sl{ background:var(--green-d); }
.sw input:checked + .sl:before{ transform:translateX(19px); }
.trow{ display:flex; align-items:center; gap:9px; padding:7px 10px; border-bottom:1px solid #f0f4f0; font-size:12.5px; }
.trow:last-child{ border-bottom:none; }
.trow.retired{ opacity:.5; }
.trow .tt{ font-weight:800; flex:1; min-width:0; }
.trow .lang{ font-size:9.5px; font-weight:900; letter-spacing:.6px; text-transform:uppercase; color:var(--grey);
             background:var(--soft); border:1px solid var(--line); border-radius:10px; padding:2px 7px; flex:none; width:34px;
             text-align:center; }
.trow .prec{ font-size:11px; color:var(--body); white-space:nowrap; width:150px; text-align:right; }
.trow .prec b{ color:var(--ink); }
.addrow{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; padding:12px 10px 2px; }
.addrow input[type=text]{ flex:1; min-width:170px; }

/* filters form */
.frow{ display:grid; grid-template-columns:1fr 150px; gap:14px; align-items:start; padding:14px 0;
       border-bottom:1px solid var(--line); }
.frow:last-child{ border-bottom:none; }
.frow .fl{ font-weight:900; font-size:13px; }
.frow .fn{ font-size:11.5px; color:var(--body); margin-top:4px; line-height:1.55; }
.frow .fe{ display:flex; gap:6px; align-items:center; }
.frow .fe input{ width:100%; }
.frow .stamp{ font-size:10.5px; color:var(--grey); margin-top:5px; }

/* ── 0.2.0: group headers, dossier, machine ── */
.ghead{ display:flex; align-items:baseline; gap:10px; margin:20px 0 8px; }
.ghead .gname{ font-weight:900; font-size:14.5px; }
.ghead .gmeta{ font-size:11.5px; color:var(--grey); }
.ghead .hist{ font-size:11.5px; color:var(--gold); font-weight:700; }
.srow{ display:flex; gap:8px; margin-top:10px; flex-wrap:wrap; align-items:center; }
.attr{ display:grid; grid-template-columns: 170px 1fr 130px; gap:8px 14px; padding:6px 4px;
       border-bottom:1px solid #f0f4f0; font-size:12.5px; align-items:baseline; }
.attr:last-child{ border-bottom:none; }
.attr .k{ font-weight:800; color:var(--body); }
.attr .m{ font-size:10.5px; color:var(--grey); text-align:right; }
.state-chip{ font-size:10px; font-weight:900; letter-spacing:.5px; text-transform:uppercase;
             padding:3px 9px; border-radius:12px; background:var(--soft); border:1px solid var(--line); color:var(--body); }
.state-chip.stub{ background:#fff8ec; border-color:#f0dfc0; color:#8a6d2f; }
.state-chip.watched{ background:#eaf4ee; border-color:#cfe0d5; color:var(--green-d); }
.state-chip.engaged{ background:rgba(59,114,176,.1); border-color:#c8d8ea; color:var(--blue); }
.state-chip.parked{ background:#f6f6f6; color:var(--grey); }
.mono{ font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:11.5px; }
pre.doc{ background:var(--soft); border:1px solid var(--line); border-radius:10px; padding:13px 15px;
         font-size:12px; line-height:1.6; white-space:pre-wrap; max-height:420px; overflow:auto; }
.tabbar{ display:flex; gap:2px; margin-bottom:16px; border-bottom:2px solid var(--line); }
.tabbar .tab{ padding:9px 16px; font-size:13px; font-weight:800; color:var(--grey); cursor:pointer;
              border-bottom:2px solid transparent; margin-bottom:-2px; }
.tabbar .tab.on{ color:var(--green-d); border-bottom-color:var(--green-d); }

/* ── 0.2.1 UX pass ── */
.radio-row{ display:flex; gap:8px; flex-wrap:wrap; margin:8px 0 4px; }
.radio-row label{ display:flex; gap:7px; align-items:center; font-size:13px; font-weight:700;
  border:1px solid var(--line); border-radius:10px; padding:9px 13px; cursor:pointer; background:#fff; }
.radio-row label:has(input:checked){ border-color:var(--green-d); background:#eaf4ee; }
.radio-row input{ accent-color:var(--green-d); }
.fld{ margin:12px 0 4px; font-size:11px; letter-spacing:1px; text-transform:uppercase;
  color:var(--gold); font-weight:800; }
.idbox{ background:var(--soft); border:1px solid var(--line); border-radius:10px;
  padding:10px 14px; display:flex; gap:22px; flex-wrap:wrap; font-size:12.5px; margin-bottom:4px; }
.idbox .k{ font-size:10px; letter-spacing:.8px; text-transform:uppercase; color:var(--grey);
  font-weight:800; display:block; }
.wfstep{ display:flex; gap:10px; align-items:flex-start; padding:9px 10px;
  border:1px solid var(--line); border-radius:10px; margin-bottom:7px; background:#fff; }
.wfstep .num{ flex:none; width:24px; height:24px; border-radius:50%; background:var(--green-dk);
  color:#fff; font-weight:900; font-size:12px; display:flex; align-items:center; justify-content:center; }
.wfstep .chip{ flex:none; margin-top:2px; }
.wfstep .tx{ flex:1; font-size:12.5px; line-height:1.5; }
.wfstep .ops{ flex:none; display:flex; gap:4px; }
.wfstep .ops button{ border:none; background:none; color:var(--grey); cursor:pointer; font-size:14px; padding:2px 5px; }
.wfstep .ops button:hover{ color:var(--green-d); }
.chip.agent-c{ background:#f2f0fa; color:var(--purple); }
.chip.script-c{ background:rgba(59,114,176,.12); color:var(--blue); }
.sel-card{ border:2px solid transparent; }
.sel-card.on{ border-color:var(--green-d); }

/* 0.2.2: group headers must read as sections, not as more green links */
.ghead{ border-top:2px solid var(--line); padding-top:14px; margin-top:24px; }
.ghead .gname{ color:var(--ink); font-size:15.5px; cursor:pointer; }
.ghead .gname:hover{ color:var(--green-d); text-decoration:underline; }
.company-box{ background:var(--soft); border:1px solid var(--line); border-radius:10px;
  padding:10px 14px; display:flex; gap:20px; flex-wrap:wrap; font-size:12.5px; margin:8px 0 12px; }
.company-box .k{ font-size:10px; letter-spacing:.8px; text-transform:uppercase; color:var(--grey);
  font-weight:800; display:block; }
.wfcheck{ display:flex; gap:9px; align-items:flex-start; padding:6px 4px; font-size:12.5px;
  border-bottom:1px solid #f0f4f0; }
.wfcheck:last-child{ border-bottom:none; }
.wfcheck input{ accent-color:var(--green-d); margin-top:2px; cursor:pointer; }
.wfcheck.done .tx{ color:var(--grey); text-decoration:line-through; }
.wfcheck .who{ margin-left:auto; font-size:10.5px; color:var(--grey); white-space:nowrap; }

/* pulse */
.pulse-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:18px; }
.feed{ display:flex; flex-direction:column; }
.feed .fi{ display:flex; gap:12px; padding:8px 4px; border-bottom:1px solid #f0f4f0; font-size:12.5px; align-items:baseline; }
.feed .fi:last-child{ border-bottom:none; }
.feed .when{ flex:none; width:86px; color:var(--grey); font-size:11px; }
.health{ display:flex; gap:10px; flex-wrap:wrap; }
.health .h{ background:#fff; border:1px solid var(--line); border-radius:11px; padding:10px 14px; font-size:12.5px; }
.health .dot{ display:inline-block; width:9px; height:9px; border-radius:50%; margin-right:7px; }
.dot.ok{ background:var(--green); } .dot.warn{ background:var(--gold); } .dot.bad{ background:var(--red); }

/* agent "about" — the human-language summary, read first */
.about{ background:var(--soft); border:1px solid var(--line); border-radius:10px;
  padding:12px 16px; margin-bottom:12px; font-size:12.5px; line-height:1.65; color:var(--body); }
.about .ah{ font-size:11px; letter-spacing:1px; text-transform:uppercase; color:var(--gold);
  font-weight:800; margin:10px 0 5px; }
.about .ah:first-child{ margin-top:0; }
.about p{ margin:0 0 7px; }
.about b{ color:var(--ink); }

/* A failed attempt is the one thing on this screen that must not read as decoration: an
   operator's first question about any script is "did it break", and the answer used to live
   only in a server log. */
.warnbox{ margin:6px 0 10px; padding:8px 10px; border-radius:9px; background:#FDF4F3;
          border:1px solid #F0D6D2; font-size:12px; line-height:1.45; color:var(--body); }
.warnbox b{ color:var(--red); font-weight:800; }

/* A labelled control, so "how often" reads as a sentence rather than a bare dropdown. */
.pick{ display:inline-flex; align-items:center; gap:6px; font-size:12px; color:var(--grey);
       font-weight:700; }
.pick select{ font:inherit; font-weight:700; color:var(--ink); background:var(--soft);
              border:1px solid var(--line); border-radius:8px; padding:5px 9px; cursor:pointer; }
.pick select:hover{ border-color:var(--brand); }
