/* ============================================================================
   instrument.css — Soqucoin instrument layer (portable, bead itn).
   The structural half of the foundry language, extracted brand-neutral from
   soqupool's foundry.css / foundry-console.css. For TOOL surfaces only —
   consoles, scanners, dashboards, playgrounds. Editorial pages keep the
   research-grade serif system; this layer is for pages that are equipment.

   Master copy: soqu-web/instrument.css. Per-property deploy dirs carry a
   copy (same convention as ecosystem.css).

   Requires the system tokens (--paper/--paper-2/--ink/--muted/--accent/--rule)
   and, for full effect, these fonts on the page:
     Archivo (variable, wdth axis) + Martian Mono — e.g.
     family=Archivo:wdth,wght@62..125,100..900&family=Martian+Mono:wght@400;600
   Everything falls back to the site's --sans/--mono if they're absent.

   Overridable hooks:
     --inst-plate : nameplate face   (default Archivo)
     --inst-mono  : readout face     (default Martian Mono)
     --ok/--warn/--down : status ramp (desaturated defaults; encoding only —
                          status colors are never the accent, and vice versa)
   ============================================================================ */

:root{
  --inst-plate:'Archivo',var(--sans,sans-serif);
  --inst-mono:'Martian Mono',var(--mono,ui-monospace,monospace);
  --ok:#2e7d57; --warn:#a07a24; --down:#b04a3d;
}
[data-theme="dark"]{ --ok:#57b98a; --warn:#d9a54b; --down:#d96a5b; }

/* ── type roles ─────────────────────────────────────────────────────────── */

/* nameplate: stamped-metal expanded caps. Section/product headings on
   instrument surfaces. NOT for editorial prose pages. */
.nameplate{
  font-family:var(--inst-plate);
  font-variation-settings:"wdth" 120;
  font-weight:800;letter-spacing:.02em;text-transform:uppercase;
  color:var(--ink);line-height:1.1;
}
.nameplate small{display:block;font-family:var(--inst-mono);font-weight:400;
  font-size:.62rem;letter-spacing:.2em;color:var(--muted);margin-top:.5rem}

/* engraved: the etched caption on equipment. Panel titles, field labels. */
.engraved{
  font-family:var(--inst-mono);font-size:.66rem;font-weight:400;
  letter-spacing:.18em;text-transform:uppercase;color:var(--muted);
}

/* readout: a number the machine reports. */
.readout{
  font-family:var(--inst-mono);font-weight:600;color:var(--ink);
  font-variant-numeric:tabular-nums;letter-spacing:-.01em;
}

/* ── panel primitive ────────────────────────────────────────────────────── */
/* Welded, zero-radius, seam-ruled. A panel replaces "card with bold title". */
.panel{border:1px solid var(--rule);border-radius:0;background:var(--paper)}
.panel-head{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:.55rem 1rem;border-bottom:1px solid var(--rule);
  background:var(--paper-2);
}
.panel-head .p-title{font-family:var(--inst-mono);font-size:.64rem;
  letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.panel-head .p-meta{font-family:var(--inst-mono);font-size:.64rem;
  letter-spacing:.08em;color:var(--muted)}
.panel-body{padding:1.25rem 1rem}

/* segmented control: mono toggle group for panel toolbars */
.seg{display:inline-flex;border:1px solid var(--rule);border-radius:0}
.seg button{
  background:none;border:0;cursor:pointer;padding:.3rem .75rem;
  font-family:var(--inst-mono);font-size:.62rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted);
  border-right:1px solid var(--rule);
}
.seg button:last-child{border-right:0}
.seg button.on{background:var(--paper-2);color:var(--accent)}

/* ── readout row (gauges) ───────────────────────────────────────────────── */
/* A ruled strip of instrument cells: engraved label + big mono value + sub. */
.readouts{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;
  border:1px solid var(--rule)}
.gauge{padding:1.1rem 1.2rem;border-right:1px solid var(--rule);
  display:flex;flex-direction:column;gap:.4rem;min-width:0}
.gauge:last-child{border-right:0}
.gauge .g-label{font-family:var(--inst-mono);font-size:.62rem;
  letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.gauge .g-value{font-family:var(--inst-mono);font-weight:600;color:var(--ink);
  font-size:clamp(1.15rem,2vw,1.6rem);letter-spacing:-.01em;
  font-variant-numeric:tabular-nums;white-space:nowrap}
.gauge .g-value .u{font-size:.68rem;color:var(--muted);font-weight:400;margin-left:.35rem}
.gauge .g-sub{font-family:var(--inst-mono);font-size:.66rem;color:var(--muted)}
.gauge.g-live .g-value{color:var(--accent)}
@media(max-width:760px){
  .readouts{grid-auto-flow:row;grid-auto-columns:unset}
  .gauge{border-right:0;border-bottom:1px solid var(--rule)}
  .gauge:last-child{border-bottom:0}
}

/* ── status lamps ───────────────────────────────────────────────────────── */
/* Encoding only: a lamp reports state, it never decorates. */
.lamp{display:inline-block;width:7px;height:7px;border-radius:50%;
  background:var(--muted);vertical-align:middle;flex:none}
.lamp.ok{background:var(--ok);box-shadow:0 0 5px color-mix(in srgb,var(--ok) 55%,transparent)}
.lamp.warn{background:var(--warn)}
.lamp.down{background:var(--down)}

/* ── data table ─────────────────────────────────────────────────────────── */
.dtable{width:100%;border-collapse:collapse;font-family:var(--inst-mono);font-size:.76rem}
.dtable th{
  text-align:left;padding:.55rem .75rem;background:var(--paper-2);
  font-size:.6rem;font-weight:400;letter-spacing:.16em;text-transform:uppercase;
  color:var(--muted);border-bottom:1px solid var(--rule);white-space:nowrap;
}
.dtable td{padding:.6rem .75rem;border-bottom:1px solid var(--rule);color:var(--ink)}
.dtable tr:last-child td{border-bottom:0}
.dtable tbody tr:hover td{background:var(--paper-2)}
.dtable td.dim{color:var(--muted)}

/* ── metal strip ────────────────────────────────────────────────────────── */
/* 2px identity bar on a panel's top edge (e.g. a chain/product encoding). */
.strip-top{border-top:2px solid var(--strip,var(--accent))}