:root { /* v1.4.10.403: the two brand faces (css/fonts.css serves them and names them again — this copy keeps app.css whole on its own). Every font-family in this sheet reads one of the three role tokens below them, never a face. */ --font-brand:'Inter','Helvetica Neue',Arial,system-ui,sans-serif; /* v1.4.10.543: Inter (was Poppins) */ --font-logo:'Poppins','Helvetica Neue',Arial,system-ui,sans-serif; /* v1.4.10.543: the AVDesk wordmark set as text, nothing else */ --font-code:'Inter','Helvetica Neue',Arial,system-ui,sans-serif; /* v1.4.10.546: codes in Inter too (tabular figures) */ --font-source:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; /* v1.4.10.546: source code only (
, wiki code, a sheet's Mono) */
    --font:var(--font-body);
    /* ── TYPE SYSTEM (v1.4.10.443) — every size in this sheet, the js/ inline styles and the public pages is a step of
       10 11 12 13 14 15 16 18 20 24 30 36 44 px (no half pixels, no em/rem: dev/checks/fonts.py fails on anything else),
       every weight is 400 500 600 700, and an UPPERCASE label tracks in em. One look per role, everywhere:
         KPI / stat value 30/700 (-.03em; secondary 24/700, small 20/600)  ·  page title 20/600 (phone 18)
         section, modal, drawer title 16/600  ·  panel / card title 15/600  ·  sub-heading 13/600
         body 13/400  ·  reading text (wiki, messages, descriptions) 14/400  ·  meta 12/400  ·  caption 11/400
         uppercase label, table header, KPI label 11/600 .06em  ·  badge (uppercase only) 10/700 .04em
         status pill 11/600  ·  filter chip 12/500  ·  .btn 13/500 (.sm 12, .xs 11; primary 600)  ·  tab 13/600
         segmented control 12/600  ·  nav 13/500 (active 600)  ·  field 13/400 (16px on a phone: iOS zoom)
         field label 12/500  ·  tooltip 12  ·  toast 13/500  ·  bold (b, strong) 700
       10px is for uppercase badges only. The wall boards' clamp() type scales with the screen and is left out.
       v1.4.10.473 (the full pass after v471/v472 drifted) settled the cases above left open:
         KPI value on a phone 24/700  ·  a detail window's hero title (ticket, asset, site, device, client) is the page
         title look, an editor's hero (.site-ed-htext, .ue-htext, the asset editor) the modal title look  ·  a count chip
         (digits) is the badge, 10/700  ·  avatar initials on the 10px step take the badge look (userAv)  ·  .fld > span is
         the field label like .field label  ·  a hint inside a label ("(optional)") is a caption, 11/400  ·  an empty
         state says its message 13/400 (title 15/600, .empty-sub 12/400)  ·  codes carry .mono (Inter, tabular figures, since v1.4.10.546; JetBrains Mono before)  ·  a
         font-family reads --font-body / --font-display / --font-mono, never --font-brand / --font-code.
       Controls in one row share one height (.btn.primary carries a transparent border like its neighbours); on a touch
       screen every control has one 40px floor. dev/tools/format-crawl/pane-crawl.js measures all of it in a browser. ── */
    /* AVDesk brand — blue→purple gradient identity */
    --brand-blue: var(--bc-blue-v1);
    --brand-purple: var(--bc-purple-v1);
    --grad: linear-gradient(120deg, var(--bc-blue-v1) 0%, var(--bc-purple-v1) 100%);
    --accent: var(--bc-blue-v1);
    --accent-2: var(--bc-blue-v1-2);
    --accent-deep: var(--bc-blue-v1-deep);
    --accent-glow: rgba(var(--bc-accent-rgb),0.10);
    /* Light surfaces */
    --bg: #F6F8FC;            /* app canvas */
    --bg-2: #FFFFFF;          /* nav / elevated bars */
    --surface: #FFFFFF;       /* cards/panels */
    --surface-2: #F2F5FA;     /* subtle fills, hovers */
    --surface-3: #E9EEF6;     /* stronger fills */
    --line: #E2E8F2;          /* hairlines */
    --line-2: #CDD7E6;        /* stronger borders */
    /* Text on light */
    --text: #0F172A;
    --text-mute: #5A6B85;
    --text-dim: #93A0B4;
    /* Status */
    --ok: #16A34A;
    --warn: #D97706;
    --on-warn: #1b1300;   /* v1.4.10.428: text sitting ON a --warn fill */
    --err: #DC2626;
    --info: var(--bc-purple-v1);
    --p1: #DC2626;
    --p2: #D97706;
    --p3: var(--bc-blue-v1);
    --p4: #93A0B4;
    /* legacy aliases remapped to the light theme so existing rules keep working */
    --electric: var(--bc-blue-v1);
    --electric-2: var(--bc-blue-v1-2);
    --navy: #F6F8FC;
    --navy-2: #F2F5FA;
    --navy-3: #E9EEF6;
    --cyan: var(--bc-purple-v1);
    /* aliases for tokens referenced around the app but never declared — without
       these, `var(--card)` resolved to nothing (transparent panels on the
       Reliability / Utilisation / Wallboard / Launch-checks / Workspaces /
       Self-check pages) and `var(--border)` fell back to off-palette hexes. */
    --card: #FFFFFF;          /* = --surface */
    --border: #E2E8F2;        /* = --line   */
    --bg2: #FFFFFF;           /* = --bg-2   */
    --brand: var(--bc-blue-v1);         /* = --brand-blue */
    --mono:var(--font-code);  /* = --font-mono */
    --radius: 14px;
    --shadow-sm: 0 1px 2px rgba(15,23,42,0.04), 0 1px 3px rgba(15,23,42,0.06);
    --shadow-md: 0 4px 16px rgba(15,23,42,0.08);
    --shadow-lg: 0 20px 50px rgba(15,23,42,0.16);
    --font-display:var(--font-brand);
    --font-body:var(--font-brand);
    --font-mono:var(--font-code);
  }
  *,*::before,*::after{box-sizing:border-box;}
  html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:14px;font-feature-settings:normal;-webkit-font-smoothing:antialiased;letter-spacing:-0.006em;}
  a{color:var(--accent-2);text-decoration:none;}
  /* v1.4.10.443: a control with no size of its own takes the size of the text around it — the browser's own
     13.333px was showing through on every unsized button and field. Fields with no class are body size (13px). */
  button,input,select,textarea,optgroup{font-family:inherit;font-size:inherit;}
  input,select,textarea{font-size:13px;}
  /* bold is 700, whatever it sits in: the browser's "bolder" turned a  inside 600 text into 900 */
  b,strong{font-weight:700;}
  ::selection{background:rgba(var(--bc-accent-rgb),0.18);color:var(--text);}
  h1,h2,h3,h4{font-family:var(--font-display);font-weight:600;letter-spacing:-.012em;}
  
  /* Scrollbars */
  ::-webkit-scrollbar{width:10px;height:10px;}
  ::-webkit-scrollbar-track{background:transparent;}
  ::-webkit-scrollbar-thumb{background:var(--line);border-radius:5px;border:2px solid var(--navy);}
  ::-webkit-scrollbar-thumb:hover{background:var(--line-2);}

  /* ============ SHARED FORM PRIMITIVES (were in the old LOGIN block; used app-wide) ============ */
  .live-dot{width:8px;height:8px;border-radius:50%;background:var(--ok);position:relative;flex-shrink:0;}
  .live-dot::after{content:'';position:absolute;inset:0;border-radius:50%;background:var(--ok);animation:liveRing 2s ease-out infinite;}
  @keyframes liveRing{0%{transform:scale(1);opacity:0.6;}70%{transform:scale(2.8);opacity:0;}100%{opacity:0;}}
  /* Input adornments: leading icon + optional reveal toggle */
  .input-wrap{position:relative;display:flex;align-items:center;}
  .input-wrap .input-ico{position:absolute;left:13px;display:flex;align-items:center;justify-content:center;color:var(--text-dim);pointer-events:none;transition:color 0.15s;z-index:1;}
  .input-wrap .input-ico svg{width:17px;height:17px;}
  .input-wrap:focus-within .input-ico{color:var(--brand-blue);}
  .input-wrap .pass-toggle{position:absolute;right:8px;display:flex;align-items:center;justify-content:center;width:30px;height:30px;padding:0;background:transparent;border:0;border-radius:6px;color:var(--text-dim);cursor:pointer;transition:color 0.15s,background 0.15s;z-index:1;}
  .input-wrap .pass-toggle:hover{color:var(--brand-blue);background:var(--surface-2);}
  .input-wrap .pass-toggle svg{width:17px;height:17px;}
  .field{margin-bottom:16px;}
  .field label{display:block;font-size:12px;color:var(--text-mute);margin-bottom:7px;font-weight:500;}
  /* v1.4.10.473: a hint inside a field label ("(optional)", "(seconds)", "(read/write)") is a caption, 11/400 — it took the
     label's 500. Inside an uppercase form label (.fu-lb, .tk-item-lb) it is not shouted in capitals either, as .cust-modal-sec's */
  .field label .device-meta,.fld > span .device-meta{font-weight:400;}
  .fu-lb .device-meta,.tk-item-lb .device-meta{font-weight:400;text-transform:none;letter-spacing:0;}
  /* v1.4.10.473: a file picker drawn as