/* ═══════════════════════════════════════════════════════
   THERMAL GEOMETRY - BRAND TOKEN SYSTEM
   Dark + Light  -  Shared across all states
═══════════════════════════════════════════════════════ */
:root{
  --ember:#C0392B;--orange:#E05A1A;--amber:#F07820;--gold:#F5A623;
  --green:#1A7A40;--warn:#E67E22;--blue:#3B82F6;
}
[data-theme="dark"]{
  --bg:#0A0E19;--surface:#141B26;--surface2:#1E2530;--surface3:#2B3340;
  --border:#2B3340;--border2:#3D4A58;
  --text:#E0E4EA;--text2:#A8B2BE;--muted:#7A8699;
  --accent:#F07820;
  --grid:rgba(245,166,35,.025);
  --amb-glow:rgba(240,120,32,.08);--emb-glow:rgba(192,57,43,.12);
  --grn-glow:rgba(26,122,64,.12);--blu-glow:rgba(59,130,246,.1);
  --hero-grad:linear-gradient(135deg,#0A0E19 0%,#141B26 50%,#1E2530 100%);
  --scrolltrack:#141B26;--scrollthumb:#2B3340;
  --th-bg:#1E2530;--row-hover:rgba(43,51,64,.45);
  --pill-paid-bg:rgba(26,122,64,.15);--pill-paid-bdr:rgba(26,122,64,.3);--pill-paid-txt:#2ecc71;
  --pill-inv-bg:rgba(245,166,35,.12);--pill-inv-bdr:rgba(245,166,35,.25);--pill-inv-txt:#F5A623;
  --pill-ovr-bg:rgba(192,57,43,.15);--pill-ovr-bdr:rgba(192,57,43,.3);--pill-ovr-txt:#C0392B;
  --pill-dft-bg:rgba(122,134,153,.1);--pill-dft-bdr:rgba(122,134,153,.2);--pill-dft-txt:#7A8699;
  --pill-opn-bg:rgba(59,130,246,.1);--pill-opn-bdr:rgba(59,130,246,.2);--pill-opn-txt:#3B82F6;
  --pill-prg-bg:rgba(240,120,32,.1);--pill-prg-bdr:rgba(240,120,32,.25);--pill-prg-txt:#F07820;
}
[data-theme="light"]{
  --bg:#F0F0F0;--surface:#FFFFFF;--surface2:#E8E8E8;--surface3:#D8D8D8;
  --border:#CCCCCC;--border2:#BBBBBB;
  --text:#1A1814;--text2:#4A4638;--muted:#757575;
  --accent:#BE430D;
  --grid:rgba(201,74,16,.035);
  --amb-glow:rgba(201,74,16,.06);--emb-glow:rgba(168,42,30,.08);
  --grn-glow:rgba(26,122,64,.08);--blu-glow:rgba(59,130,246,.06);
  --hero-grad:linear-gradient(135deg,#F0F0F0 0%,#E8E8E8 50%,#D8D8D8 100%);
  --scrolltrack:#E8E8E8;--scrollthumb:#CCCCCC;
  --th-bg:#E8E8E8;--row-hover:rgba(0,0,0,.05);
  --pill-paid-bg:rgba(26,122,64,.1);--pill-paid-bdr:rgba(26,122,64,.25);--pill-paid-txt:#1A6633;
  --pill-inv-bg:rgba(212,138,21,.12);--pill-inv-bdr:rgba(212,138,21,.3);--pill-inv-txt:#9A6A0A;
  --pill-ovr-bg:rgba(168,42,30,.1);--pill-ovr-bdr:rgba(168,42,30,.25);--pill-ovr-txt:#A82A1E;
  --pill-dft-bg:rgba(122,117,102,.1);--pill-dft-bdr:rgba(122,117,102,.2);--pill-dft-txt:#5A5448;
  --pill-opn-bg:rgba(59,130,246,.08);--pill-opn-bdr:rgba(59,130,246,.2);--pill-opn-txt:#2563EB;
  --pill-prg-bg:rgba(201,74,16,.08);--pill-prg-bdr:rgba(201,74,16,.2);--pill-prg-txt:#C94A10;
}

/* ─── RESET ─── */
*{margin:0;padding:0;box-sizing:border-box}
.hidden{display:none!important}
html{font-size:14px;scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:'Instrument Sans',sans-serif;min-height:100vh;overflow-x:hidden;transition:background .25s,color .25s}
input,select,textarea,button{font-family:'Instrument Sans',sans-serif}
a{color:inherit;text-decoration:none}
::-webkit-scrollbar{width:4px;height:4px}
::-webkit-scrollbar-track{background:var(--scrolltrack)}
::-webkit-scrollbar-thumb{background:var(--scrollthumb)}
/* ── LOGO THEME SWAP ── */
.bf-logo-dark { display:block;width:auto;max-height:80px;object-fit:contain;object-position:left center }
.bf-logo-light { display:none;width:auto;max-height:80px;object-fit:contain;object-position:left center }
[data-theme="light"] .bf-logo-dark { display:none }
[data-theme="light"] .bf-logo-light { display:block }
.pub-brand-mark { display:none }

body::before{content:'';position:fixed;inset:0;background-image:url('./blackfire_logo_transparent.png'),linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:280px auto,48px 48px,48px 48px;background-position:center,0 0,0 0;background-attachment:fixed;background-repeat:no-repeat;opacity:0.08;pointer-events:none;z-index:0}

/* ═══════════════════════════════════════════════════════
   STATE VISIBILITY
═══════════════════════════════════════════════════════ */
#pub-site,#login-screen,#portal-shell{display:none}
[data-state="public"] #pub-site{display:block}
[data-state="login"]  #login-screen{display:flex}
[data-state="portal"] #portal-shell{display:flex}
[data-state="portal"] .btn-login{display:none}
[data-state="login"] #pub-nav{top:0!important}
[data-state="portal"] #pub-nav{display:none}

/* ═══════════════════════════════════════════════════════
   ■ PUBLIC SITE — v3 · IZILO-W-001 · THERMAL GEOMETRY
═══════════════════════════════════════════════════════ */

/* ── V3 Extended Design Tokens ── */
:root{
  --coal:#0A0E19;--navy:#141B26;--charcoal:#1E2530;--steel-dk:#2B3340;
  --ash:#7A8699;--steel:#A8B2BE;--bone:#E0E4EA;
  --paper:#F5F1EA;--paper-warm:#EDE8DE;--cream:#E4DED2;--graphite:#C8C1B3;--paper-raised:#FFFDF8;
  --ink:#1A1814;--ink-2:#4A4638;--ink-mut:#7A7566;
  --ember-l:#A82A1E;--fire-l:#BE430D;--amber-l:#D45A14;--gold-l:#A96E0D;
  --fire:#E05A1A;
  --f-disp:'Big Shoulders Display',sans-serif;
  --f-body:'Instrument Sans',sans-serif;
  --f-mono:'IBM Plex Mono',monospace;
  --f-serif:'Instrument Serif',serif;
  --max:1200px;
}
[data-theme="dark"]{
  --paper:#0A0E19;--paper-warm:#141B26;--cream:#1E2530;--graphite:#3D4A58;--paper-raised:#141B26;
  --ink:#E0E4EA;--ink-2:#A8B2BE;--ink-mut:#8894A5;
  --ember-l:#D34A3B;--fire-l:#F07820;--amber-l:#F58A2B;--gold-l:#F5B842;
}
[data-theme="light"]{
  --coal:#F0F0F0;--navy:#FFFFFF;--charcoal:#E8E8E8;--steel-dk:#CCCCCC;
  --ash:#9E9E9E;--steel:#616161;--bone:#1A1814;
}

/* ── IZILO BAND GRAMMAR ── */
.izilo-band{height:22px;width:100%;background-repeat:repeat-x;background-size:auto 100%;opacity:.9}
.izilo-diamond{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='22' viewBox='0 0 44 22'%3E%3Cpath d='M11 1 21 11 11 21 1 11Z' fill='none' stroke='%23F5A623' stroke-width='1.4'/%3E%3Cpath d='M11 6.5 15.5 11 11 15.5 6.5 11Z' fill='%23C0392B'/%3E%3Cpath d='M33 1 43 11 33 21 23 11Z' fill='none' stroke='%23F5A623' stroke-width='1.4'/%3E%3Cpath d='M33 6.5 37.5 11 33 15.5 28.5 11Z' fill='%23C0392B'/%3E%3C/svg%3E")}
.izilo-chevron{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='22' viewBox='0 0 28 22'%3E%3Cpath d='M2 16 14 4 26 16' fill='none' stroke='%23E05A1A' stroke-width='2.4'/%3E%3C/svg%3E")}
#pub-site .izilo-triangle-bg{position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='48' viewBox='0 0 56 48'%3E%3Cpath d='M14 4 26 24 2 24Z' fill='%23C0392B'/%3E%3Cpath d='M42 44 30 24 54 24Z' fill='%23E05A1A'/%3E%3C/svg%3E");background-size:56px 48px;opacity:.045;pointer-events:none}
@media (prefers-reduced-motion: no-preference){
  .izilo-band.drift{animation:bandDrift 60s linear infinite}
  .izilo-band.drift:hover{animation-play-state:paused}
}
@keyframes bandDrift{from{background-position-x:0}to{background-position-x:-880px}}

/* ── PUBLIC PAGES (single scroll) ── */
.pub-page{display:none}
.pub-page.active{display:block}
#pub-home{background:var(--coal);color:var(--bone);font-family:var(--f-body);overflow-x:hidden;line-height:1.6}

/* ── IGNITION PRELOADER ── */
#ignition{position:fixed;inset:0;background:var(--coal);z-index:200;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;transition:opacity .4s,visibility .4s}
#ignition.done{opacity:0;visibility:hidden;pointer-events:none}
.ign-tri{width:64px;height:56px;clip-path:polygon(50% 0,100% 100%,0 100%);background:linear-gradient(to top,var(--ember) var(--fill,0%),var(--steel-dk) var(--fill,0%))}
.ign-count{font-family:var(--f-mono);font-size:14px;color:var(--ash);letter-spacing:.18em}
.ign-count b{color:var(--gold);font-weight:600}

/* ── V3 TOPBAR ── */
#pub-site .v3-topbar{background:var(--ember);color:#fff;font-family:var(--f-mono);font-size:11.5px;letter-spacing:.08em;display:flex;justify-content:space-between;align-items:center;padding:7px 28px;position:relative;z-index:60}
#pub-site .v3-topbar .pulse{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--gold);margin-right:8px;vertical-align:1px}
#pub-site .v3-topbar a{font-weight:600;color:#fff}
@media (prefers-reduced-motion: no-preference){#pub-site .v3-topbar .pulse{animation:v3pulse 1.6s ease-in-out infinite}}
@keyframes v3pulse{0%,100%{opacity:1}50%{opacity:.35}}

/* ── V3 NAV ── */
#pub-nav{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:14px 28px;background:transparent;transition:background .3s,box-shadow .3s,padding .3s;height:auto;border-bottom:none}
#pub-nav.v3-solid{background:var(--paper);box-shadow:0 1px 0 var(--graphite);padding:10px 28px}
.pub-brand{display:flex;align-items:center}
.pub-brand img{height:46px;width:auto}
#pub-nav .bf-logo-dark{display:block}
.pub-nav-links{display:flex;gap:34px;font-size:14.5px;font-weight:500;color:var(--ink-2)}
.pub-nav-link{position:relative;padding:6px 0;min-height:44px;display:flex;align-items:center;cursor:pointer;background:none;border:none;font-family:var(--f-body);font-size:14.5px;font-weight:500;color:var(--ink-2)}
.pub-nav-link::after{content:'';position:absolute;left:0;bottom:2px;height:2px;width:100%;background:var(--fire-l);transform:scaleX(0);transform-origin:left}
@media (prefers-reduced-motion: no-preference){.pub-nav-link::after{transition:transform .28s}}
.pub-nav-link:hover::after,.pub-nav-link.active::after{transform:scaleX(1)}
.pub-nav-link:hover{color:var(--ink)}
.mobile-portal-link{display:none}
.v3-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 28px;border:none;border-radius:3px;font-weight:600;font-size:15px;letter-spacing:.01em;font-family:var(--f-body);cursor:pointer}
.v3-btn-fire{background:linear-gradient(120deg,var(--ember),var(--fire));color:#fff}
.v3-btn-fire:hover{filter:brightness(1.12)}
.v3-btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--graphite)}
.v3-btn-ghost:hover{border-color:var(--fire-l);color:var(--ember-l)}
.pub-ham-btn{display:none;background:none;border:1px solid var(--graphite);border-radius:3px;width:48px;height:48px;color:var(--ink);font-size:20px;cursor:pointer;align-items:center;justify-content:center}
.theme-btn{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;background:var(--paper-raised);border:1px solid var(--graphite);border-radius:3px;color:var(--ink);cursor:pointer}
.theme-btn:hover,.theme-btn:focus-visible{border-color:var(--fire-l);color:var(--fire-l);outline:none}
.theme-btn svg{width:18px;height:18px}
[data-theme="light"] .theme-btn .sun,[data-theme="dark"] .theme-btn .moon{display:none}
[data-theme="light"] .theme-btn .moon,[data-theme="dark"] .theme-btn .sun{display:block}
#pub-mob-nav{display:none}
@media(max-width:820px){
  .pub-nav-links{display:none}
  .pub-nav-links.v3-open{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:var(--paper);border-bottom:1px solid var(--graphite);padding:16px 28px;gap:4px;z-index:100}
  .pub-nav-links.v3-open .mobile-portal-link{display:flex}
  .pub-ham-btn{display:flex}
  .v3-btn-ghost{display:none}
}

/* ── WRAP ── */
#pub-home .wrap{max-width:var(--max);margin:0 auto;padding:0 28px}
#pub-home section[id],#pub-home header[id]{scroll-margin-top:84px}

/* ── HERO ── */
#pub-home .hero{position:relative;padding:72px 0 96px;background:linear-gradient(165deg,var(--paper) 0%,var(--paper-warm) 64%,var(--cream) 100%)}
#pub-home .hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;position:relative;z-index:1}
#pub-home .eyebrow{font-family:var(--f-mono);font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-l);display:flex;align-items:center;gap:12px;margin-bottom:22px}
#pub-home .eyebrow::before{content:'';width:34px;height:2px;background:var(--ember-l)}
#pub-home h1{font-family:var(--f-disp);font-weight:900;font-size:clamp(56px,8.6vw,108px);line-height:.92;letter-spacing:.005em;text-transform:uppercase;color:var(--ink)}
#pub-home h1 .fire{color:var(--fire-l)}
#pub-home h1 .ember{color:var(--ember-l)}
#pub-home .hero-sub{margin:26px 0 34px;max-width:520px;color:var(--ink-2);font-size:17px}
#pub-home .hero-actions{display:flex;gap:16px;flex-wrap:wrap}
#pub-home .proof-chip{display:inline-flex;align-items:center;gap:14px;margin-top:42px;background:var(--paper-raised);border:1px solid var(--graphite);border-left:3px solid var(--ember-l);border-radius:3px;padding:14px 22px;box-shadow:0 10px 30px -18px rgba(26,24,20,.35)}
#pub-home .proof-chip .num{font-family:var(--f-mono);font-weight:600;font-size:26px;color:var(--fire-l)}
#pub-home .proof-chip .lbl{font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;color:var(--ink-mut);text-transform:uppercase;line-height:1.5}
#pub-home .scroll-cue{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--ink-mut);font-family:var(--f-mono);font-size:10.5px;letter-spacing:.2em}
#pub-home .scroll-cue .tri{width:14px;height:12px;clip-path:polygon(50% 100%,0 0,100% 0);background:var(--fire-l)}
@media (prefers-reduced-motion: no-preference){#pub-home .scroll-cue .tri{animation:cueDip 1.8s ease-in-out infinite}}
@keyframes cueDip{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}

/* ── SCENE FRAMES ── */
#pub-home .scene-frame{position:relative;border:2px solid var(--graphite);border-radius:3px;overflow:hidden;background:var(--coal);box-shadow:0 22px 56px -32px rgba(26,24,20,.45)}
#pub-home .scene-frame img{position:relative;z-index:0;width:100%;height:100%;object-fit:cover;display:block}
#pub-home .scene-frame::after{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(10,14,25,.5),rgba(10,14,25,.06) 48%);pointer-events:none}
#pub-home .cta-frame.scene-frame::after{display:none}
#pub-home .brief-chip{position:absolute;right:10px;bottom:10px;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.18em;color:var(--ash);background:rgba(10,14,25,.72);border:1px solid var(--steel-dk);padding:4px 9px;border-radius:2px;pointer-events:none;z-index:2}
#pub-home .hero-frame{aspect-ratio:4/5;max-height:560px;width:100%}
#pub-home .float-badge{position:absolute;background:var(--paper);border:1px solid var(--graphite);border-left:3px solid var(--fire-l);border-radius:3px;padding:14px 20px;font-family:var(--f-mono);z-index:2}
#pub-home .float-badge .v{font-size:24px;font-weight:600;color:var(--fire-l)}
#pub-home .float-badge .k{font-size:10px;letter-spacing:.18em;color:var(--ink-mut);text-transform:uppercase}
/* Image fallback */
#pub-home .scene-frame.img-blocked img,#pub-home .svc-img.img-blocked img{display:none}
#pub-home .img-fallback{display:none}
#pub-home .img-blocked .img-fallback{display:flex;position:absolute;inset:0;z-index:1;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:24px;background:linear-gradient(155deg,var(--navy),var(--charcoal))}
#pub-home .img-fallback .ftri{width:30px;height:26px;clip-path:polygon(50% 0,100% 100%,0 100%);background:linear-gradient(to top,var(--ember),var(--fire))}
#pub-home .img-fallback .fsub{font-family:var(--f-body);font-size:13.5px;color:var(--steel);max-width:300px;line-height:1.55}
#pub-home .img-fallback .fnote{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.16em;color:var(--ash);text-transform:uppercase}

/* ── SECTION GRAMMAR ── */
#pub-home section{position:relative;padding:96px 0}
#pub-home .sec-light{background:var(--paper-warm);color:var(--ink)}
#pub-home .sec-head h2{font-family:var(--f-disp);font-weight:800;text-transform:uppercase;font-size:clamp(34px,4.6vw,56px);line-height:1.02;max-width:760px}
#pub-home .sec-light .sec-head h2{color:var(--ink)}
#pub-home .sec-sub{margin-top:18px;max-width:620px;font-size:16.5px;color:var(--steel)}
#pub-home .sec-light .sec-sub{color:var(--ink-2)}

/* ── ASSESSMENT WIZARD ── */
#pub-home .wizard{background:var(--paper-raised);border:1px solid var(--graphite);border-radius:4px;max-width:760px;margin:48px auto 0;box-shadow:0 18px 50px -28px rgba(26,24,20,.35)}
#pub-home .wiz-progress{display:flex;gap:6px;padding:22px 28px 0}
#pub-home .wiz-progress span{height:8px;flex:1;background:var(--cream);clip-path:polygon(0 0,calc(100% - 8px) 0,100% 50%,calc(100% - 8px) 100%,0 100%,8px 50%)}
#pub-home .wiz-progress span.on{background:var(--fire-l)}
#pub-home .wiz-counter{font-family:var(--f-mono);font-size:12px;letter-spacing:.2em;color:var(--ink-mut);padding:16px 28px 0}
#pub-home .wiz-counter b{color:var(--fire-l)}
#pub-home .wiz-step{display:none;padding:18px 28px 28px}
#pub-home .wiz-step.on{display:block}
#pub-home .wiz-step h3{font-family:var(--f-disp);font-weight:700;text-transform:uppercase;font-size:26px;color:var(--ink);margin-bottom:18px}
#pub-home .wiz-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
#pub-home .field{display:flex;flex-direction:column;gap:7px}
#pub-home .field.full{grid-column:1/-1}
#pub-home .field label{font-size:13px;font-weight:600;color:var(--ink-2)}
#pub-home .field input,#pub-home .field select,#pub-home .field textarea{min-height:48px;border:1px solid var(--graphite);border-radius:3px;background:var(--paper);padding:12px 14px;font-family:var(--f-body);font-size:15px;color:var(--ink)}
#pub-home .field textarea{min-height:110px;resize:vertical}
#pub-home .field input:focus,#pub-home .field select:focus,#pub-home .field textarea:focus{outline:2px solid var(--fire-l);outline-offset:1px;border-color:var(--fire-l)}
#pub-home .chiprow{display:flex;flex-wrap:wrap;gap:10px}
#pub-home .chip{min-height:44px;padding:0 18px;display:inline-flex;align-items:center;border:1px solid var(--graphite);border-radius:22px;background:var(--paper-raised);font-size:14px;color:var(--ink-2);cursor:pointer}
#pub-home .chip[aria-pressed="true"]{background:var(--fire-l);border-color:var(--fire-l);color:#fff}
#pub-home .wiz-nav{display:flex;justify-content:space-between;align-items:center;padding:0 28px 26px;gap:14px}
#pub-home .wiz-err{font-size:13px;color:var(--ember-l);padding:0 28px 10px;min-height:18px}
#pub-home .btn-fire-l{background:linear-gradient(120deg,var(--ember-l),var(--fire-l));color:#fff;min-height:48px;padding:0 28px;border:none;border-radius:3px;font-weight:600;font-size:15px;font-family:var(--f-body);cursor:pointer}
#pub-home .btn-back{background:transparent;border:1px solid var(--graphite);color:var(--ink-2);min-height:48px;padding:0 28px;border-radius:3px;font-size:15px;font-family:var(--f-body);cursor:pointer}
#pub-home .wiz-review dt{font-family:var(--f-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-mut);margin-top:12px}
#pub-home .wiz-review dd{font-size:15px;color:var(--ink)}
#pub-home .consent{display:flex;gap:10px;align-items:flex-start;margin-top:18px;font-size:13px;color:var(--ink-2)}
#pub-home .consent input{width:20px;height:20px;margin-top:2px;accent-color:var(--fire-l)}
#pub-home .wiz-done{text-align:center;padding:48px 28px}
#pub-home .wiz-done .tri{width:44px;height:38px;margin:0 auto 18px;clip-path:polygon(50% 0,100% 100%,0 100%);background:var(--fire-l)}

/* ── ABOUT ── */
#pub-home .about-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:56px;align-items:center}
#pub-home .about-frame{aspect-ratio:4/3;width:100%}
#pub-home .about-points{margin-top:26px;display:grid;gap:14px}
#pub-home .about-points li{list-style:none;display:flex;gap:12px;font-size:15.5px;color:var(--ink-2)}
#pub-home .about-points .dmark{width:12px;height:12px;margin-top:5px;flex:none;transform:rotate(45deg);background:var(--gold-l);outline:2px solid var(--ember-l);outline-offset:2px}

/* ── SERVICES ── */
#pub-home .svc-grid{margin-top:48px;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
#pub-home .svc-card{background:var(--navy);border:1px solid var(--steel-dk);border-radius:3px;padding:26px 22px;position:relative;overflow:hidden;display:flex;flex-direction:column;gap:12px;min-width:0}
#pub-home .svc-card::after{content:'';position:absolute;left:0;bottom:0;height:3px;width:100%;background:linear-gradient(90deg,var(--ember),var(--fire),var(--amber));transform:scaleX(0);transform-origin:left}
@media (prefers-reduced-motion: no-preference){#pub-home .svc-card::after{transition:transform .28s}}
#pub-home .svc-card:hover::after{transform:scaleX(1)}
#pub-home .svc-card:hover{border-color:var(--ash)}
#pub-home .svc-img-wrap{position:relative;margin:-26px -22px 4px;aspect-ratio:16/10;overflow:hidden;border-bottom:1px solid var(--steel-dk);background:var(--coal)}
#pub-home .svc-img-wrap .svc-img{width:100%;height:100%;margin:0;aspect-ratio:auto;object-fit:cover;display:block;filter:saturate(.92)}
#pub-home .svc-img-scrim{position:absolute;inset:0;background:linear-gradient(to top,rgba(10,14,25,.55),rgba(10,14,25,0) 55%);pointer-events:none}
@media (prefers-reduced-motion: no-preference){#pub-home .svc-card:hover .svc-img{transform:scale(1.05);transition:transform .28s ease}}
#pub-home .svc-card-body{display:flex;align-items:center;gap:12px;min-height:42px}
#pub-home .svc-cat-dot{width:9px;height:9px;flex:none;transform:rotate(45deg);background:var(--fire)}
#pub-home .svc-name{font-weight:600;font-size:14px;color:var(--bone);line-height:1.35}
#pub-home .svc-cat{font-size:12px;color:var(--ash);margin-top:3px}
#pub-home .svc-glyph{width:26px;height:22px}
#pub-home .g-up{clip-path:polygon(50% 0,100% 100%,0 100%);background:var(--ember)}
#pub-home .g-down{clip-path:polygon(50% 100%,0 0,100% 0);background:var(--fire)}
#pub-home .g-diamond{transform:rotate(45deg) scale(.82);background:var(--gold);outline:2px solid var(--ember);outline-offset:2px}
#pub-home .svc-card h3{font-family:var(--f-disp);font-weight:700;text-transform:uppercase;font-size:19px;letter-spacing:.02em}
#pub-home .svc-card p{font-size:13.5px;color:var(--ash);line-height:1.55}
#pub-home .svc-more{margin-top:36px;text-align:center}
#pub-home .svc-more a{font-family:var(--f-mono);font-size:13px;letter-spacing:.14em;color:var(--gold)}

/* ── CATEGORY CARDS ── */
#pub-home .home-cats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:40px;margin-bottom:36px}
#pub-home .cat-card{width:100%;background:var(--navy);border:1px solid var(--steel-dk);border-radius:3px;padding:22px 18px;cursor:pointer;display:flex;flex-direction:column;align-items:flex-start;gap:10px;position:relative;overflow:hidden;transition:border-color .22s;text-align:left;font-family:var(--f-body);color:inherit}
#pub-home .cat-card::after{content:'';position:absolute;left:0;bottom:0;height:3px;width:100%;background:linear-gradient(90deg,var(--ember),var(--fire),var(--amber));transform:scaleX(0);transform-origin:left}
@media (prefers-reduced-motion: no-preference){#pub-home .cat-card::after{transition:transform .26s}}
#pub-home .cat-card:hover::after,#pub-home .cat-card.active::after{transform:scaleX(1)}
#pub-home .cat-card:hover,#pub-home .cat-card.active{border-color:var(--ash)}
#pub-home .cat-card:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
#pub-home .cat-icon{font-size:28px;line-height:1}
#pub-home .cat-name{font-family:var(--f-disp);font-weight:700;text-transform:uppercase;font-size:16px;letter-spacing:.03em;color:var(--bone)}
#pub-home .cat-count{font-family:var(--f-mono);font-size:10px;letter-spacing:.14em;color:var(--gold);text-transform:uppercase}
/* filter row */
#pub-home .pub-svc-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}
#pub-home .filter-chip{min-height:38px;padding:0 14px;border:1px solid var(--steel-dk);border-radius:20px;background:var(--navy);color:var(--steel);font-family:var(--f-body);font-size:13px;cursor:pointer}
#pub-home .filter-chip:hover,#pub-home .filter-chip.active{border-color:var(--fire);background:var(--charcoal);color:var(--bone)}
#pub-home .filter-chip:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
@media (max-width:1020px){#pub-home .home-cats{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){#pub-home .home-cats{grid-template-columns:1fr}}

/* ── STATS ── */
#pub-home .stats{background:var(--paper)}
#pub-home .stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;position:relative;z-index:1}
#pub-home .stat{text-align:center;padding:26px 10px;border:1px solid var(--graphite);border-radius:3px;background:var(--paper-raised);box-shadow:0 10px 30px -22px rgba(26,24,20,.4)}
#pub-home .stat .v{font-family:var(--f-mono);font-weight:600;font-size:clamp(34px,4.4vw,52px);color:var(--gold-l)}
#pub-home .stat .v small{font-size:.55em;color:var(--fire-l)}
#pub-home .stat .k{font-family:var(--f-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-mut);margin-top:8px}

/* ── TESTIMONIALS ── */
#pub-home .tst{max-width:820px;margin:42px auto 0;text-align:center;min-height:220px}
#pub-home .tst blockquote{font-family:var(--f-serif);font-style:italic;font-size:clamp(20px,2.6vw,27px);line-height:1.5;color:var(--bone)}
#pub-home .tst .who{margin-top:22px;font-family:var(--f-mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--amber)}
#pub-home .tst .where{font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;color:var(--ash);margin-top:4px}
#pub-home .tst-dots{display:flex;gap:10px;justify-content:center;margin-top:30px}
#pub-home .tst-dots button{width:14px;height:14px;border:1px solid var(--steel-dk);background:transparent;transform:rotate(45deg);padding:0;cursor:pointer}
#pub-home .tst-dots button[aria-selected="true"]{background:var(--ember);border-color:var(--ember)}

/* ── FAQ ── */
#pub-home .faq-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:start;margin-top:48px}
#pub-home .faq-frame{aspect-ratio:3/4;position:sticky;top:96px}
#pub-home .faq-call{margin-top:18px;background:var(--paper-warm);border:1px solid var(--graphite);border-left:3px solid var(--ember-l);border-radius:3px;padding:18px 22px}
#pub-home .faq-call .k{font-family:var(--f-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-mut)}
#pub-home .faq-call .v{font-family:var(--f-mono);font-size:21px;font-weight:600;color:var(--fire-l);margin-top:6px;display:block}
#pub-home .acc{border-bottom:1px solid var(--graphite)}
#pub-home .acc summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:18px;min-height:60px;padding:16px 4px;cursor:pointer;font-weight:600;font-size:16.5px;color:var(--ink)}
#pub-home .acc summary::-webkit-details-marker{display:none}
#pub-home .acc summary .mk{width:14px;height:12px;flex:none;clip-path:polygon(50% 100%,0 0,100% 0);background:var(--fire-l)}
@media (prefers-reduced-motion: no-preference){#pub-home .acc summary .mk{transition:transform .25s}}
#pub-home .acc[open] summary .mk{transform:rotate(180deg)}
#pub-home .acc p{padding:0 4px 20px;color:var(--ink-2);font-size:15px;max-width:60ch}

/* ── HOW IT WORKS ── */
#pub-home .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:48px}
#pub-home .step{border:1px solid var(--steel-dk);border-radius:3px;background:var(--navy);padding:30px 26px}
#pub-home .step .n{font-family:var(--f-mono);font-size:14px;letter-spacing:.2em;color:var(--fire)}
#pub-home .step h3{font-family:var(--f-disp);font-weight:700;text-transform:uppercase;font-size:23px;margin:14px 0 12px;color:var(--bone)}
#pub-home .step p{font-size:14.5px;color:var(--steel)}

/* ── CTA BANNER ── */
#pub-home .cta-banner{position:relative;padding:0}
#pub-home .cta-frame{aspect-ratio:21/8;min-height:380px;border-radius:0;border-left:none;border-right:none}
#pub-home .cta-overlay{position:absolute;inset:0;background:linear-gradient(100deg,rgba(10,14,25,.92) 22%,rgba(10,14,25,.45) 70%,rgba(10,14,25,.2));display:flex;align-items:center;z-index:2}
#pub-home .cta-overlay h2{font-family:var(--f-disp);font-weight:900;text-transform:uppercase;font-size:clamp(40px,6vw,76px);line-height:.95}
#pub-home .cta-overlay .ember{color:var(--ember)}
#pub-home .cta-overlay p{margin:18px 0 26px;max-width:440px;color:var(--steel)}

/* ── FOOTER ── */
#pub-home footer{background:var(--coal);padding:80px 0 0;border-top:1px solid var(--steel-dk)}
#pub-home .foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:44px}
#pub-home .foot-tag{font-family:var(--f-serif);font-style:italic;font-size:17px;color:var(--gold);margin:16px 0 12px}
#pub-home .foot-brand p{font-size:14px;color:var(--ash);max-width:34ch}
#pub-home .foot-col h4{font-family:var(--f-mono);font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--steel);margin-bottom:18px}
#pub-home .foot-col a,#pub-home .foot-col span{display:flex;align-items:center;min-height:38px;font-size:14.5px;color:var(--ash)}
#pub-home .foot-col a:hover{color:var(--gold)}
#pub-home .news label{font-size:14px;color:var(--steel);display:block;margin-bottom:12px}
#pub-home .news-row{display:flex;gap:0}
#pub-home .news-row input{flex:1;min-height:48px;background:var(--navy);border:1px solid var(--steel-dk);border-right:none;border-radius:3px 0 0 3px;padding:0 14px;color:var(--bone);font-family:var(--f-body)}
#pub-home .news-row input:focus{outline:2px solid var(--fire);outline-offset:1px}
#pub-home .news-row button{min-width:52px;min-height:48px;border:none;border-radius:0 3px 3px 0;background:linear-gradient(120deg,var(--ember),var(--fire));display:flex;align-items:center;justify-content:center;cursor:pointer}
#pub-home .news-row .udia{width:13px;height:13px;transform:rotate(45deg);background:var(--gold);outline:2px solid rgba(255,255,255,.2);outline-offset:2px}
#pub-home .news-note{font-family:var(--f-mono);font-size:10.5px;color:var(--ash);margin-top:10px;letter-spacing:.06em}
#pub-home .foot-bottom{margin-top:64px;border-top:1px solid var(--steel-dk);padding:22px 0;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;color:var(--ash)}

/* ── WHATSAPP FAB ── */
.wa-fab{position:fixed;right:22px;bottom:22px;z-index:80;width:58px;height:58px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 28px -8px rgba(0,0,0,.5)}
.wa-fab svg{width:30px;height:30px;fill:#fff}
.wa-fab:hover{filter:brightness(1.08)}

/* ── SCROLL REVEAL ── */
@media (prefers-reduced-motion: no-preference){
  #pub-home .rv{opacity:0;transform:translateY(12px);transition:opacity .5s ease,transform .5s ease}
  #pub-home .rv.in{opacity:1;transform:none}
}

/* ── RESPONSIVE ── */
@media (max-width:1020px){
  #pub-home .svc-grid{grid-template-columns:repeat(2,1fr)}
  #pub-home .stats-grid{grid-template-columns:repeat(2,1fr)}
  #pub-home .foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:820px){
  #pub-home .hero .wrap,#pub-home .about-grid,#pub-home .faq-grid{grid-template-columns:1fr;gap:38px}
  #pub-home .hero{padding:48px 0 84px}
  #pub-home .faq-frame{position:static;aspect-ratio:16/10}
  #pub-home .cta-frame{width:100%;height:420px;min-height:0;aspect-ratio:auto}
  #pub-home .steps{grid-template-columns:1fr}
  #pub-home .wiz-grid{grid-template-columns:1fr}
  #pub-site .v3-topbar{font-size:10px;padding:7px 14px}
}
@media (max-width:520px){
  #pub-home .wrap{padding:0 18px}
  #pub-home .svc-grid,#pub-home .stats-grid,#pub-home .foot-grid{grid-template-columns:1fr}
  #pub-home section{padding:68px 0}
}

/* ═══════════════════════════════════════════════════════
   ■ LOGIN SCREEN
═══════════════════════════════════════════════════════ */
#login-screen{
  position:fixed;inset:0;z-index:500;
  background:var(--bg);align-items:center;justify-content:center;
  flex-direction:column;padding:20px;
}
.login-card{
  background:var(--surface);border:1px solid var(--border);
  width:100%;max-width:400px;border-radius:2px;overflow:hidden;
}
.login-header{
  padding:28px 28px 20px;border-bottom:1px solid var(--border);
  background:var(--surface2);text-align:center;
}
.login-mark{display:flex;justify-content:center;margin-bottom:16px;cursor:pointer}
.login-title{font-family:'Big Shoulders Display',sans-serif;font-size:14px;font-weight:900;color:var(--text);letter-spacing:2px;margin-top:8px}
.login-sub{font-family:'IBM Plex Mono',monospace;font-size:9px;color:var(--muted);letter-spacing:2px;margin-top:4px}
.login-body{padding:28px}
.login-group{margin-bottom:16px}
.login-label{font-family:'IBM Plex Mono',monospace;font-size:9px;color:var(--muted);letter-spacing:1.5px;text-transform:uppercase;margin-bottom:6px;display:block}
.login-input{
  width:100%;background:var(--surface2);border:1px solid var(--border);
  color:var(--text);padding:10px 12px;font-size:14px;border-radius:2px;
  outline:none;transition:border-color .15s;
}
.login-input:focus{border-color:var(--accent)}
.login-error{
  background:var(--emb-glow);border:1px solid rgba(192,57,43,.3);
  color:var(--pill-ovr-txt);padding:10px 14px;font-size:12px;
  border-radius:2px;margin-bottom:16px;display:none;
}
.login-error.show{display:block}
.btn-login-submit{
  width:100%;padding:12px;background:var(--accent);color:#fff;
  border:none;cursor:pointer;font-family:'IBM Plex Mono',monospace;
  font-size:11px;letter-spacing:2px;text-transform:uppercase;
  border-radius:2px;transition:opacity .15s;
}
.btn-login-submit:hover{opacity:.85}
.login-back{
  font-size:11px;color:var(--muted);
  cursor:pointer;transition:color .15s;
}
.login-back:hover{color:var(--accent)}
.mfa-copy{font-size:12px;line-height:1.55;color:var(--muted);margin:0 0 14px}
.mfa-qr-wrap{display:flex;justify-content:center;margin:0 auto 16px;padding:10px;background:#fff;border-radius:4px;max-width:240px}
.mfa-qr-wrap canvas{display:block;width:220px;height:220px;max-width:100%}
.mfa-secret{display:block;padding:10px;margin:-4px 0 18px;background:var(--surface2);border:1px solid var(--border);color:var(--text);font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:1.5px;text-align:center;overflow-wrap:anywhere;user-select:all}
.mfa-code-input{font-family:'IBM Plex Mono',monospace;font-size:20px;letter-spacing:5px;text-align:center}
.mfa-recovery-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:16px 0}
.mfa-recovery-code{padding:9px 6px;background:var(--surface2);border:1px solid var(--border);color:var(--text);font-family:'IBM Plex Mono',monospace;font-size:11px;text-align:center;user-select:all}
.btn-login-secondary{width:100%;padding:11px;margin-bottom:10px;background:transparent;color:var(--text);border:1px solid var(--border);cursor:pointer;font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:1.5px;text-transform:uppercase;border-radius:2px}
.btn-login-secondary:hover{border-color:var(--accent);color:var(--accent)}
@media (max-width:420px){.mfa-recovery-grid{grid-template-columns:1fr}.login-body{padding:22px}.mfa-qr-wrap canvas{width:190px;height:190px}}

/* ═══════════════════════════════════════════════════════
   ■ PORTAL SHELL
═══════════════════════════════════════════════════════ */
#portal-shell{min-height:100vh;position:relative;z-index:1}

/* ── Portal Top Bar — logo centred, identity right ── */
#portal-topbar{
  display:none;position:fixed;top:0;left:0;right:0;height:68px;z-index:101;
  background:var(--surface);border-bottom:1px solid var(--border);
  box-shadow:0 2px 8px rgba(0,0,0,.12);
  align-items:center;justify-content:center;
  padding:0 20px;
  transition:background .25s,border-color .25s;
}
[data-state="portal"] #portal-topbar{display:flex}
#portal-topbar .bf-logo-dark,
#portal-topbar .bf-logo-light{height:50px;width:auto;object-fit:contain;display:block}
[data-theme="light"] #portal-topbar .bf-logo-dark{display:none}
[data-theme="light"] #portal-topbar .bf-logo-light{display:block}
[data-theme="dark"]  #portal-topbar .bf-logo-light{display:none}

/* identity + controls float to the right */
.ptb-right{
  position:absolute;right:20px;top:0;bottom:0;
  display:flex;align-items:center;gap:8px;
}
#ptb-user{font-size:12px;font-weight:500;color:var(--text2);letter-spacing:.3px;white-space:nowrap}
.company-context-control{
  display:inline-flex;align-items:center;gap:6px;padding:5px 8px;
  border:1px solid var(--border);border-radius:2px;background:var(--surface2);
  color:var(--muted);font-family:'IBM Plex Mono',monospace;
  font-size:9px;letter-spacing:.7px;text-transform:uppercase;white-space:nowrap;
}
.company-context-control select{
  max-width:190px;border:0;background:transparent;color:var(--text);
  font:inherit;font-size:10px;letter-spacing:.4px;outline:none;cursor:pointer;
}
.company-context-control select:disabled{cursor:wait;opacity:.6}

/* Sign-out button */
#pnav-signout{
  padding:5px 10px;border:1px solid var(--border);background:transparent;
  color:var(--muted);cursor:pointer;border-radius:2px;transition:all .15s;
  display:flex;align-items:center;gap:5px;
  font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.5px;text-transform:uppercase;
}
.signout-icon{width:13px;height:13px}
#pnav-signout:hover{color:var(--accent);border-color:var(--accent)}

/* ── Primary Nav Bar — floating bar below topbar ── */
#pnav-primary-bar{
  display:none;position:fixed;top:68px;left:0;right:0;height:46px;z-index:100;
  background:var(--surface);border-bottom:1px solid var(--border);
  box-shadow:0 4px 16px rgba(0,0,0,.1);
  align-items:center;justify-content:center;
  transition:background .25s,border-color .25s;
}
[data-state="portal"] #pnav-primary-bar{display:flex}
#pnav-primary{
  display:flex;align-items:center;gap:0;
  overflow-x:auto;scrollbar-width:none;max-width:100%;
}
#pnav-primary::-webkit-scrollbar{display:none}
.pnav-group{
  display:flex;align-items:center;padding:0 20px;height:46px;
  cursor:pointer;color:var(--muted);font-family:'IBM Plex Mono',monospace;
  font-size:11px;letter-spacing:1.5px;text-transform:uppercase;
  border-bottom:2px solid transparent;white-space:nowrap;
  transition:all .15s;flex-shrink:0;
}
.pnav-group:hover{color:var(--text);border-bottom-color:var(--amber)}
.pnav-group.active{color:var(--accent);border-bottom-color:var(--accent)}

/* ── Sub-Nav Strip — child pages for the active group ── */
#pnav-bar{
  display:none;position:fixed;top:114px;left:0;right:0;height:38px;z-index:99;
  background:var(--surface2);border-bottom:1px solid var(--border);
  box-shadow:0 2px 8px rgba(0,0,0,.07);
  align-items:center;overflow-x:auto;scrollbar-width:none;
  transition:background .25s,border-color .25s;
}
#pnav-bar::-webkit-scrollbar{display:none}
[data-state="portal"] #pnav-bar{display:flex}
#pnav-links{display:flex;align-items:center;flex-direction:row;justify-content:center;width:100%;padding:0 20px;gap:0}
.pnitem{
  display:flex;align-items:center;gap:5px;padding:0 16px;height:38px;
  cursor:pointer;color:var(--muted);font-family:'IBM Plex Mono',monospace;
  font-size:10px;letter-spacing:.5px;text-transform:uppercase;
  border-bottom:2px solid transparent;white-space:nowrap;
  transition:all .15s;flex-shrink:0;-webkit-tap-highlight-color:transparent;
}
.pnitem:hover{color:var(--text);border-bottom-color:var(--amber)}
.pnitem.active{color:var(--accent);border-bottom-color:var(--accent);background:var(--amb-glow)}
.pnbadge{background:var(--accent);color:var(--bg);font-family:'IBM Plex Mono',monospace;font-size:8px;padding:1px 4px;border-radius:2px;min-width:14px;text-align:center}

/* ── Portal Main ── */
#pmain{padding:28px 32px;min-height:100vh;width:min(100%,1500px);max-width:none;margin:0 auto}
.ppage{display:none}.ppage.active{display:block}
.ptitle{font-family:'Big Shoulders Display',sans-serif;font-size:37px;font-weight:700;color:var(--text);margin-bottom:3px;letter-spacing:.3px}
.psub{font-family:'IBM Plex Mono',monospace;font-size:13px;color:var(--muted);margin-bottom:22px;letter-spacing:1.5px;text-transform:uppercase}
.ppage-hdr{position:sticky;top:152px;z-index:20;background:var(--bg);padding:14px 0 10px;margin:-14px 0 0;border-bottom:1px solid var(--border);transition:background .25s}
.perm-toggle-bar{padding:8px 12px 6px;border-bottom:1px solid var(--border)}
#users-rbac-table .perm-col{transition:opacity .15s}
#users-rbac-table.perms-collapsed .perm-col{display:none}

/* ── Portal Components ── */
.panel{background:var(--surface);border:1px solid var(--border);border-radius:2px;transition:background .25s,border-color .25s;margin-bottom:20px;min-width:0;overflow:hidden}
.ph{padding:14px 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;background:var(--surface2)}
.ph-title{font-family:'Big Shoulders Display',sans-serif;font-size:20px;font-weight:700;color:var(--text);letter-spacing:.3px}
.pb{padding:18px}
.kgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-bottom:20px}
.kcard{background:var(--surface);border:1px solid var(--border);padding:16px 18px;border-top:2px solid;border-radius:2px;transition:border-color .2s;min-width:0}
.kcard.k1{border-top-color:var(--blue)}
.kcard.k2{border-top-color:var(--amber)}
.kcard.k3{border-top-color:var(--gold)}
.kcard.k4{border-top-color:var(--green)}
.klbl{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--muted);letter-spacing:2px;text-transform:uppercase;margin-bottom:6px}
.kval{font-family:'Big Shoulders Display',sans-serif;font-size:clamp(30px,4vw,41px);font-weight:900;color:var(--text);letter-spacing:0;overflow-wrap:anywhere;line-height:1.05}
.kval--compact{font-size:26px;letter-spacing:-.2px}
.ksub{font-family:'IBM Plex Mono',monospace;font-size:13px;color:var(--muted);margin-top:3px;overflow-wrap:anywhere}
.kbreak{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--muted);margin-top:4px;overflow-wrap:anywhere}
.kbreak span{margin-right:8px;white-space:nowrap;display:inline-block}
.twocol{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:18px}
.pill{display:inline-flex;align-items:center;font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:1px;padding:3px 8px;border-radius:2px;border:1px solid;text-transform:uppercase;white-space:nowrap}
.pill.paid{background:var(--pill-paid-bg);border-color:var(--pill-paid-bdr);color:var(--pill-paid-txt)}
.pill.sent,.pill.invoiced{background:var(--pill-inv-bg);border-color:var(--pill-inv-bdr);color:var(--pill-inv-txt)}
.pill.overdue{background:var(--pill-ovr-bg);border-color:var(--pill-ovr-bdr);color:var(--pill-ovr-txt)}
.pill.draft{background:var(--pill-dft-bg);border-color:var(--pill-dft-bdr);color:var(--pill-dft-txt)}
.pill.open{background:var(--pill-opn-bg);border-color:var(--pill-opn-bdr);color:var(--pill-opn-txt)}
.pill.progress,.pill.approved{background:var(--pill-prg-bg);border-color:var(--pill-prg-bdr);color:var(--pill-prg-txt)}
.pill.emergency{background:var(--emb-glow);border-color:rgba(192,57,43,.3);color:var(--pill-ovr-txt)}
.pill--pending{background:rgba(230,126,34,.1);border-color:rgba(230,126,34,.3);color:var(--warn)}
.pill.partial-paid{background:rgba(52,152,219,.12);border-color:rgba(52,152,219,.35);color:#2980b9}
.radio-row{display:flex;flex-direction:column;gap:8px;margin-top:6px}
.radio-opt{display:flex;align-items:flex-start;gap:8px;font-size:13px;cursor:pointer;line-height:1.4}
.radio-opt input[type="radio"]{margin-top:3px;flex:none}
.sibling-group{display:flex;flex-wrap:wrap;gap:6px}
.sibling-chip{cursor:pointer}
.att-staged-list{display:flex;flex-direction:column;gap:4px;margin-top:8px}
.att-staged-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 8px;background:var(--surface2);border:1px solid var(--border);border-radius:2px}
.att-staged-remove{background:none;border:none;color:var(--ember);cursor:pointer;font-size:13px;padding:2px 6px}
.att-staged-remove:hover{color:var(--danger,#c0392b)}
.tw{max-height:65vh;overflow:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
table{width:100%;border-collapse:collapse;font-size:17px;table-layout:fixed}
.tw > table{width:max-content;min-width:100%;table-layout:auto}
th{background:var(--th-bg);color:var(--muted);font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:2px;text-transform:uppercase;padding:9px 24px 9px 14px;text-align:left;border-bottom:1px solid var(--border);white-space:normal;overflow-wrap:anywhere;word-break:break-word;position:relative;cursor:pointer}
.tw > table th{white-space:nowrap;overflow-wrap:normal;word-break:normal}
.tw > table > thead > tr > th{position:sticky;top:0;z-index:4;background:var(--th-bg);box-shadow:inset 0 -1px 0 var(--border)}
th[data-sortable="0"],th[data-nosort="1"]{cursor:default;padding-right:14px}
th[data-sortable="1"]::after{content:'↕';position:absolute;right:8px;top:50%;transform:translateY(-50%);font-size:10px;letter-spacing:0;color:var(--muted);opacity:.45}
th[data-sort-state="asc"]::after{content:'↑';opacity:1;color:var(--accent)}
th[data-sort-state="desc"]::after{content:'↓';opacity:1;color:var(--accent)}
td{padding:10px 14px;border-bottom:1px solid var(--border);color:var(--text2);vertical-align:middle;white-space:normal;overflow-wrap:anywhere;word-break:break-word}
.tw > table td{white-space:nowrap;overflow-wrap:normal;word-break:normal}
tr:last-child td{border-bottom:none}
tr:hover td{background:var(--row-hover)}
.mono{font-family:'IBM Plex Mono',monospace;font-size:16px;color:var(--text)}
.amt{font-family:'IBM Plex Mono',monospace;font-size:17px;font-weight:500;color:var(--text)}
.btn{display:inline-flex;align-items:center;gap:5px;padding:7px 14px;border:1px solid;border-radius:2px;cursor:pointer;font-family:'IBM Plex Mono',monospace;font-size:13px;letter-spacing:1px;text-transform:uppercase;transition:all .15s;white-space:nowrap}
.btn-p{background:var(--accent);border-color:var(--accent);color:#fff}.btn-p:hover{opacity:.85}
.btn-g{background:transparent;border-color:var(--border);color:var(--text2)}.btn-g:hover{border-color:var(--accent);color:var(--accent)}
.btn-d{background:transparent;border-color:var(--ember);color:var(--ember)}.btn-d:hover{background:var(--ember);color:#fff}
.btn-s{padding:4px 9px;font-size:12px}
.bgrp{display:flex;gap:6px;flex-wrap:wrap}
.calllog-list{display:grid;gap:14px;min-width:0}
.calllog-column-header,.quote-column-header,.invoice-column-header,.tracker-column-header,.users-column-header,.audit-column-header{display:grid;padding:0 14px 7px;color:var(--muted);font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:1.4px;text-transform:uppercase}
.calllog-column-header{grid-template-columns:minmax(0,1.1fr) minmax(0,1.5fr) repeat(2,minmax(0,.75fr)) repeat(4,minmax(0,1fr))}
.quote-column-header{grid-template-columns:minmax(0,1.05fr) minmax(0,1.6fr) minmax(0,1.2fr) minmax(0,.8fr) minmax(0,.9fr) minmax(0,.8fr)}
.invoice-column-header{grid-template-columns:minmax(0,1.05fr) minmax(0,1.5fr) minmax(0,1.2fr) minmax(0,.8fr) minmax(0,.8fr) minmax(0,.8fr)}
.tracker-column-header,.tracker-record-summary{grid-template-columns:minmax(0,.8fr) minmax(0,1.7fr) minmax(0,1.15fr) minmax(0,.7fr) minmax(0,.8fr) minmax(0,1fr)}
.users-column-header,.user-record-summary{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) minmax(0,1.6fr) minmax(0,1.2fr) minmax(0,.7fr)}
.audit-column-header{grid-template-columns:minmax(138px,.8fr) minmax(120px,.7fr) minmax(100px,.8fr) minmax(0,2.2fr)}
.calllog-card{min-width:0;overflow:hidden;background:var(--surface);border:1px solid var(--border);border-top:2px solid var(--accent);border-radius:2px}
.calllog-card-summary{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.5fr) repeat(2,minmax(0,.75fr)) repeat(4,minmax(0,1fr));gap:0;border-bottom:1px solid var(--border)}
.calllog-card-summary.quote-card-summary{grid-template-columns:minmax(0,1.05fr) minmax(0,1.6fr) minmax(0,1.2fr) minmax(0,.8fr) minmax(0,.9fr) minmax(0,.8fr)}
.calllog-card-summary.invoice-card-summary{grid-template-columns:minmax(0,1.05fr) minmax(0,1.5fr) minmax(0,1.2fr) minmax(0,.8fr) minmax(0,.8fr) minmax(0,.8fr)}
.calllog-field{min-width:0;padding:12px 14px}
.calllog-field-label,.calllog-section-label{display:block;margin-bottom:5px;color:var(--muted);font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:1.4px;text-transform:uppercase}
.calllog-field-value{min-width:0;color:var(--text2);font-size:12px;overflow-wrap:anywhere}
.calllog-field-value .pill{max-width:100%}
.calllog-ref{display:block;margin-top:4px;color:var(--muted);font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.5px}
.calllog-expander{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:8px;min-height:36px;border:0;border-top:1px solid var(--border);background:var(--surface2);color:var(--text2);cursor:pointer;font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:1px;text-transform:uppercase}
.calllog-expander:hover{color:var(--accent);background:var(--row-hover)}
.calllog-expander:focus-visible{outline:2px solid var(--accent);outline-offset:-3px}
.calllog-expander-icon{font-size:14px;line-height:1}
.calllog-detail{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));background:var(--surface2);border-bottom:1px solid var(--border);box-shadow:inset 3px 0 0 var(--accent)}
.calllog-detail[hidden]{display:none}
.calllog-actions{padding:10px 14px 12px;background:var(--surface)}
.calllog-actions .bgrp{gap:8px}
.calllog-empty{padding:28px 16px;background:var(--surface);border:1px solid var(--border)}
.quote-calllog-name{display:block;margin-top:4px;color:var(--text2);font-size:12px;line-height:1.35}
.quote-card-detail{grid-template-columns:repeat(3,minmax(0,1fr))}
.invoice-card-detail{grid-template-columns:1fr}
.tracker-record-detail{grid-template-columns:repeat(5,minmax(0,1fr))}
.user-record-detail{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1100px){
  .calllog-column-header,.quote-column-header,.invoice-column-header,.tracker-column-header,.users-column-header,.audit-column-header{display:none}
  .calllog-card-summary{grid-template-columns:repeat(4,minmax(0,1fr))}
  .quote-card-summary{grid-template-columns:repeat(3,minmax(0,1fr))}
  .invoice-card-summary{grid-template-columns:repeat(3,minmax(0,1fr))}
  .tracker-record-summary,.user-record-summary{grid-template-columns:repeat(3,minmax(0,1fr))}
  .calllog-field-service{grid-column:span 2}
  .quote-field-calllog{grid-column:span 2}
  .calllog-detail{grid-template-columns:repeat(3,minmax(0,1fr))}
  .user-record-detail{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:768px){
  .calllog-expander{min-height:44px}
  .calllog-actions .btn{min-height:44px}
}
@media(max-width:600px){
  .calllog-card-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  .quote-card-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  .invoice-card-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tracker-record-summary,.user-record-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  .calllog-field-job,.calllog-field-service{grid-column:1/-1}
  .quote-field-number,.quote-field-calllog,.quote-field-client{grid-column:1/-1}
  .invoice-field-number,.invoice-field-client{grid-column:1/-1}
  .calllog-detail{grid-template-columns:repeat(2,minmax(0,1fr))}
  .quote-card-detail{grid-template-columns:1fr}
  .calllog-detail .calllog-field:last-child{grid-column:1/-1}
}
@media(max-width:520px){
  .quote-card .calllog-actions .bgrp{display:grid;grid-template-columns:1fr}
  .quote-card .calllog-actions .btn{width:100%;justify-content:center}
  .invoice-card .calllog-actions .bgrp{display:grid;grid-template-columns:1fr}
  .invoice-card .calllog-actions .btn{width:100%;justify-content:center}
}
.template-store-section{min-width:0;padding:0 0 14px;background:var(--surface);border:1px solid var(--border);border-radius:2px}
.template-store-section[hidden]{display:none}
.in-page-navigation{margin-bottom:14px}
.in-page-navigation .btn{flex:1;justify-content:center;min-height:40px}
.in-page-navigation .btn:disabled,#btn-generate-template:disabled{cursor:not-allowed;opacity:.45}
.template-store-section>.ph{padding:16px 18px;border-bottom:1px solid var(--border)}
.template-store-section>.calllog-list{padding:14px}
.template-store-header{display:grid;gap:0;padding:9px 28px 0;color:var(--muted);font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:1.4px;text-transform:uppercase}
.template-store-header-company{grid-template-columns:minmax(0,1.1fr) minmax(0,1.6fr) minmax(0,.7fr) minmax(0,1.3fr) minmax(0,.7fr)}
.template-store-header-client{grid-template-columns:minmax(0,1.1fr) minmax(0,1.6fr) minmax(0,.7fr) minmax(0,1.3fr) minmax(0,.7fr)}
.template-store-header-template{grid-template-columns:minmax(0,1.1fr) minmax(0,.7fr) minmax(0,1.7fr) minmax(0,.6fr) minmax(0,.7fr)}
.template-store-header-routing{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,.7fr)}
.template-store-card-routing .template-store-summary{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,.7fr)}
.template-store-summary{grid-template-columns:minmax(0,1.1fr) minmax(0,1.6fr) minmax(0,.7fr) minmax(0,1.3fr) minmax(0,.7fr)}
.template-store-card-document .template-store-summary{grid-template-columns:minmax(0,1.1fr) minmax(0,.7fr) minmax(0,1.7fr) minmax(0,.6fr) minmax(0,.7fr)}
.template-store-detail{grid-template-columns:repeat(5,minmax(0,1fr))}
.template-store-card .calllog-actions{border-top:1px solid var(--border)}
.template-brand-swatch{display:inline-block;width:30px;height:12px;margin:0 7px -2px 0;border:1px solid var(--border);background:linear-gradient(90deg,var(--brand-primary) 0 50%,var(--brand-accent) 50% 100%)}
.template-bank-details{display:grid;gap:7px;margin:0}
.template-bank-details>div{display:grid;grid-template-columns:72px minmax(0,1fr);gap:8px;align-items:baseline}
.template-bank-details dt{color:var(--muted);font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.35px;text-transform:uppercase}
.template-bank-details dd{min-width:0;margin:0;color:var(--text2);overflow-wrap:anywhere}
@media(max-width:1100px){
  .template-store-header{display:none}
  .template-store-summary{grid-template-columns:repeat(3,minmax(0,1fr))}
  .template-store-card-document .template-store-summary{grid-template-columns:repeat(3,minmax(0,1fr))}
  .template-store-summary .template-field-primary{grid-column:span 2}
  .template-store-detail{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:760px){
  .template-store-section>.ph{padding:14px}
  .template-store-section>.calllog-list{padding:10px}
  .template-store-summary,.template-store-card-document .template-store-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  .template-store-summary .template-field-primary{grid-column:1/-1}
  .template-store-detail{grid-template-columns:repeat(2,minmax(0,1fr))}
  .template-store-detail .calllog-field:last-child{grid-column:1/-1}
  .template-store-card .calllog-actions .btn{min-height:44px}
}
@media(max-width:520px){
  .template-store-summary,.template-store-card-document .template-store-summary,.template-store-detail{grid-template-columns:1fr}
  .template-store-detail .calllog-field:last-child{grid-column:auto}
  .template-store-card .calllog-actions .bgrp{display:grid;grid-template-columns:1fr}
  .template-store-card .calllog-actions .btn{width:100%;justify-content:center}
}
@media(max-width:900px){
  .tw{max-height:none;overflow:visible}
  .tw>table{display:block;width:100%;min-width:0}
  .tw>table>thead{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
  .tw>table>tbody{display:grid;gap:12px;width:100%}
  .tw>table>tbody>tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));min-width:0;overflow:hidden;background:var(--surface);border:1px solid var(--border);border-top:2px solid var(--accent);border-radius:2px}
  .tw>table>tbody>tr>td{display:block;min-width:0;padding:11px 14px;white-space:normal;overflow-wrap:anywhere;word-break:break-word;border-bottom:1px solid var(--border);background:transparent}
  .tw>table>tbody>tr>td::before{content:attr(data-label);display:block;margin-bottom:5px;color:var(--muted);font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:1.2px;text-transform:uppercase}
  .tw>table>tbody>tr>td[data-label=""]::before{display:none}
  .tw>table>tbody>tr>td[colspan]{grid-column:1/-1}
  .tw>table>tbody>tr>td[data-label*="Action"],.tw>table>tbody>tr>td[data-label*="Manage"]{grid-column:1/-1;background:var(--surface2)}
  .tw>table>tbody>tr>td[data-label*="Action"] .bgrp,.tw>table>tbody>tr>td[data-label*="Manage"] .bgrp{gap:8px}
  .tw>table>tbody>tr:hover>td{background:transparent}
  .tw>table>tbody>tr:hover>td[data-label*="Action"],.tw>table>tbody>tr:hover>td[data-label*="Manage"]{background:var(--surface2)}
}
@media(max-width:560px){
  .tw>table>tbody>tr{grid-template-columns:1fr}
  .tw>table>tbody>tr>td[colspan],.tw>table>tbody>tr>td[data-label*="Action"],.tw>table>tbody>tr>td[data-label*="Manage"]{grid-column:auto}
  .tw>table>tbody>tr>td[data-label*="Action"] .bgrp,.tw>table>tbody>tr>td[data-label*="Manage"] .bgrp{display:grid;grid-template-columns:1fr}
  .tw>table>tbody>tr>td[data-label*="Action"] .btn,.tw>table>tbody>tr>td[data-label*="Manage"] .btn{width:100%;min-height:44px;justify-content:center}
}
.srow{display:flex;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.finance-period-bar{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin:0 0 14px auto;width:100%}
.finance-period-caption{margin-right:4px;color:var(--muted);font-family:'IBM Plex Mono',monospace;font-size:11px;white-space:nowrap}
.finance-period-btn{appearance:none;border:1px solid var(--border);background:var(--surface);color:var(--text2);min-height:48px;padding:7px 13px;border-radius:2px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:'IBM Plex Mono',monospace;font-size:12px;font-weight:600;letter-spacing:.4px;line-height:1.15;transition:background .15s,border-color .15s,color .15s}
.finance-period-btn::after{content:attr(data-period-detail);display:block;margin-top:4px;color:var(--muted);font-size:9px;font-weight:400;letter-spacing:0;white-space:nowrap}
.finance-period-btn:hover{border-color:var(--amber);color:var(--text)}
.finance-period-btn.active{border-color:var(--accent);background:var(--accent);color:#fff;box-shadow:0 0 0 1px var(--accent)}
.finance-period-btn.active::after{color:rgba(255,255,255,.78)}
.finance-period-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media(max-width:600px){
  .finance-period-bar{flex-wrap:wrap}
  .finance-period-caption{flex-basis:100%;margin-right:0;text-align:right}
  .finance-period-btn{flex:1;min-width:135px}
}
.sinput{background:var(--surface2);border:1px solid var(--border);color:var(--text);padding:8px 12px;font-size:17px;border-radius:2px;outline:none;flex:1;min-width:160px}
.sinput:focus{border-color:var(--accent)}
.fgroup{display:flex;flex-direction:column;gap:5px;margin-bottom:14px}
.flbl{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--muted);letter-spacing:1.5px;text-transform:uppercase}
.finput{background:var(--surface2);border:1px solid var(--border);color:var(--text);padding:9px 12px;font-size:19px;border-radius:2px;outline:none;transition:border-color .15s;width:100%}
.finput:focus{border-color:var(--accent)}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fgrid.three{grid-template-columns:1fr 1fr 1fr}
.ffull{grid-column:1/-1}
.sumbox{background:var(--surface2);border:1px solid var(--border);padding:14px;border-radius:2px}
.sumrow{display:flex;justify-content:space-between;padding:4px 0;font-size:17px;color:var(--text2)}
.sumrow.tot{border-top:1px solid var(--border);margin-top:6px;padding-top:8px;font-weight:600;color:var(--text)}
.sumrow.sm{font-size:16px;color:var(--muted)}
.alert-strip{display:flex;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.acard{flex:1;min-width:180px;padding:14px 16px;border-radius:2px;border-left:3px solid}
.acard.danger{background:var(--emb-glow);border-left-color:var(--ember);color:var(--pill-ovr-txt)}
.acard.warn{background:rgba(230,126,34,.08);border-left-color:var(--warn);color:var(--warn)}
.acard.info{background:var(--blu-glow);border-left-color:var(--blue);color:var(--pill-opn-txt)}
.albl{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:2px;text-transform:uppercase;opacity:.8;margin-bottom:3px}
.acount{font-family:'Big Shoulders Display',sans-serif;font-size:29px;font-weight:700}
.adesc{font-size:16px;opacity:.8;margin-top:2px}
.chart-bars{display:flex;align-items:flex-end;gap:8px;height:110px;padding:0 4px}
.cbar-w{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px}
.cbar{width:100%;background:var(--amber);border-radius:2px 2px 0 0;opacity:.7;transition:opacity .2s;min-height:4px;cursor:pointer}
.cbar:hover{opacity:1}
.clbl{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--muted);letter-spacing:1px}
.cval{font-family:'IBM Plex Mono',monospace;font-size:13px;color:var(--text2)}
.liitems{width:100%;border-collapse:collapse;font-size:17px;margin-bottom:12px}
.liitems th{background:var(--th-bg);color:var(--muted);font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:1.5px;text-transform:uppercase;padding:8px 10px;text-align:left;border-bottom:1px solid var(--border)}
.liitems td{padding:7px 10px;border-bottom:1px solid var(--border);vertical-align:middle}
.liinput{background:var(--surface2);border:1px solid var(--border);color:var(--text);padding:5px 8px;font-size:17px;border-radius:2px;outline:none;width:100%}
.liinput:focus{border-color:var(--accent)}
.doc-preview{--doc-primary:#0A1626;--doc-accent:#C2A04A;--doc-paper:#F4F0E6;--doc-font:'Instrument Sans',sans-serif;background:#fff;color:var(--doc-primary);padding:36px;font-family:var(--doc-font);font-size:13px;border-radius:2px;min-height:560px;border-top:8px solid var(--doc-primary)}
.doc-logo-row{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:24px;padding-bottom:18px;border-bottom:3px solid var(--doc-accent)}
.doc-logo-img{height:62px;max-width:260px;width:auto;object-fit:contain;object-position:left center;display:block}
.doc-preview .tw>table{width:100%;min-width:0}
.doc-contact{text-align:right;line-height:1.45;color:#44505F}
.doc-type-row{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:18px}
.doc-kicker{font-family:'IBM Plex Mono',monospace;font-size:8px;letter-spacing:2px;text-transform:uppercase;color:var(--doc-accent);margin-bottom:3px}
.doc-type{font-family:'Big Shoulders Display','Cormorant Garamond',sans-serif;font-size:29px;font-weight:700;color:var(--doc-primary)}
.doc-number{font-family:'IBM Plex Mono',monospace;font-size:13px;color:var(--doc-primary);border:1px solid var(--doc-accent);padding:6px 9px}
.doc-meta{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px}
.dml{font-size:8px;letter-spacing:2px;color:#7A7566;text-transform:uppercase;margin-bottom:3px}
.dmv{font-size:13px;color:#1A1814;font-weight:500}
.doc-t{width:100%;border-collapse:collapse;margin-bottom:20px}
.doc-parties{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:18px 0 22px}
.doc-party{background:color-mix(in srgb,var(--doc-paper) 72%,white);border-left:3px solid var(--doc-accent);padding:12px 14px;line-height:1.48;min-height:112px}
.doc-address{margin:6px 0;color:#44505F}
.doc-t th{background:var(--doc-paper);color:#44505F;font-size:8px;letter-spacing:1.5px;text-transform:uppercase;padding:9px 11px;text-align:left;border-bottom:2px solid var(--doc-accent)}
.doc-t td{padding:9px 11px;border-bottom:1px solid #E4DED2}
.doc-tots{margin-left:auto;width:240px}
.doc-tot-row{display:flex;justify-content:space-between;padding:5px 0;font-size:12px;color:#4A4638;border-bottom:1px solid #E4DED2}
.doc-tot-row.grand{border-top:2px solid var(--doc-primary);border-bottom:none;font-weight:700;font-size:14px;color:var(--doc-primary);padding-top:8px}
.doc-callref{margin-top:18px;padding:14px 16px;background:color-mix(in srgb,var(--doc-paper) 72%,white);border-left:3px solid var(--doc-accent);line-height:1.5}
.doc-callref-grid{display:grid;grid-template-columns:1fr 1.4fr 1.2fr .9fr;gap:12px 20px;margin-top:8px}
.doc-callref-item{min-width:0}
.doc-callref-label{display:block;color:#7A7566;font-family:'IBM Plex Mono',monospace;font-size:7px;letter-spacing:.8px;text-transform:uppercase}
.doc-callref-value{display:block;margin-top:2px;color:#1A202C;font-size:10px;overflow-wrap:anywhere}
.doc-bank{display:flex;justify-content:space-between;gap:24px;align-items:flex-end;margin-top:24px;padding:16px;background:var(--doc-paper);border-top:2px solid var(--doc-accent);line-height:1.5}
.doc-bank-details{min-width:0;flex:1}
.doc-bank-grid{display:grid;grid-template-columns:1.2fr .85fr 1.2fr .85fr .9fr;gap:12px 20px;margin-top:8px}
.doc-bank-item{min-width:0}
.doc-bank-label{display:block;color:#7A7566;font-family:'IBM Plex Mono',monospace;font-size:7px;letter-spacing:.8px;text-transform:uppercase}
.doc-bank-value{display:block;margin-top:2px;color:#1A202C;font-size:10px;overflow-wrap:anywhere}
.doc-classification{font-family:'IBM Plex Mono',monospace;font-size:8px;letter-spacing:1px;text-align:right;white-space:nowrap;color:#7E2E36}
.doc-note{font-size:10px;color:#7A7566;margin-top:20px;padding-top:14px;border-top:1px solid var(--doc-accent);text-align:center;font-style:italic;line-height:1.7}
.preline{white-space:pre-line}
@media(max-width:760px){
  .doc-bank{align-items:flex-start;flex-direction:column}
  .doc-bank-grid{grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
  .doc-callref-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .doc-classification{text-align:left}
}
.timeline-item{display:flex;gap:16px;padding:14px 0;border-bottom:1px solid var(--border)}
.timeline-item:last-child{border-bottom:none}
.tl-dot{width:10px;height:10px;border-radius:50%;background:var(--amber);flex-shrink:0;margin-top:4px;border:2px solid var(--surface)}
.tl-dot-callout{background:var(--ember)}.tl-dot-invoice{background:var(--amber)}.tl-dot-bank{background:var(--green)}
.tl-date{font-family:'IBM Plex Mono',monospace;font-size:13px;color:var(--muted);white-space:nowrap;width:80px;flex-shrink:0}
.tl-content{}
.tl-title{font-size:19px;font-weight:600;color:var(--text);margin-bottom:3px}
.tl-sub{font-size:16px;color:var(--muted)}
.audit-row{
  display:grid;
  grid-template-columns:minmax(138px,.8fr) minmax(120px,.7fr) minmax(100px,.8fr) minmax(0,2.2fr);
  gap:12px;
  padding:12px 16px;
  border-bottom:1px solid var(--border);
  align-items:flex-start;
  font-size:16px;
}
.audit-row:last-child{border-bottom:none}
.audit-row:hover{background:var(--surface2)}
.audit-ts{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--muted);white-space:normal;line-height:1.35;overflow-wrap:anywhere}
.audit-user{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--accent);white-space:normal;line-height:1.35;overflow-wrap:anywhere}
.audit-action{min-width:0;color:var(--text2);line-height:1.45;overflow-wrap:anywhere}
.audit-lvl{font-family:'IBM Plex Mono',monospace;font-size:12px;padding:2px 6px;border-radius:2px;justify-self:start;white-space:nowrap}
.audit-lvl.info{background:var(--blu-glow);color:var(--pill-opn-txt)}
.audit-lvl.warn{background:rgba(230,126,34,.08);color:var(--warn)}
.audit-lvl.error{background:var(--emb-glow);color:var(--pill-ovr-txt)}

/* ── Modal ── */
#modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:500;align-items:center;justify-content:center;padding:20px}
#modal-overlay.show{display:flex}
.modal{background:var(--surface);border:1px solid var(--border);width:100%;max-width:660px;max-height:88vh;border-radius:2px;display:flex;flex-direction:column;overflow:hidden}
.modal.modal--wide{max-width:min(1120px,calc(100vw - 40px))}
.mhdr{padding:16px 22px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;background:var(--surface2)}
.mttl{font-family:'Big Shoulders Display',sans-serif;font-size:24px;font-weight:700;color:var(--text)}
.mclose{background:none;border:none;color:var(--muted);cursor:pointer;font-size:29px;line-height:1;padding:0 4px}
.mclose:hover{color:var(--text)}
.mbdy{padding:22px;overflow-y:auto;flex:1}
.flex-end{display:flex;justify-content:flex-end}.mt2{margin-top:16px}.mt3{margin-top:22px}
.divider{height:1px;background:var(--border);margin:18px 0}

/* ── Confirm dialog ── */
#confirm-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.65);z-index:600;align-items:center;justify-content:center;padding:20px}
#confirm-overlay.show{display:flex}
.confirm-dialog{background:var(--surface);border:1px solid var(--border);width:100%;max-width:400px;border-radius:2px;overflow:hidden}
.confirm-hdr{padding:14px 20px;border-bottom:1px solid var(--border);background:var(--surface2)}
.confirm-ttl{font-family:'Big Shoulders Display',sans-serif;font-size:20px;font-weight:700;color:var(--text)}
.confirm-bdy{padding:16px 20px;font-size:14px;color:var(--text);line-height:1.6;white-space:pre-line}
.confirm-actions{padding:12px 20px 16px;display:flex;gap:8px;justify-content:flex-end;border-top:1px solid var(--border)}

/* ── Toast ── */
#toaster{position:fixed;bottom:24px;right:24px;z-index:9999;display:flex;flex-direction:column;gap:8px}
.toast{background:var(--surface);border:1px solid var(--border);padding:11px 16px;border-radius:2px;font-size:17px;color:var(--text2);animation:tIn .25s ease;border-left:3px solid var(--accent);max-width:300px;box-shadow:0 4px 20px rgba(0,0,0,.3)}
.toast.ok{border-left-color:var(--green)}
.toast.err{border-left-color:var(--ember)}
.toast.info{border-left-color:#5b9cf6}
.toast.warn{border-left-color:#f6a23b}
@keyframes tIn{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:translateX(0)}}
@keyframes tOut{from{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(16px)}}
.toast.hiding{animation:tOut .4s ease forwards;pointer-events:none}

/* ── Back to Top Button ── */
#back-to-top{
  position:fixed;bottom:30px;right:30px;width:48px;height:48px;
  background:var(--accent);color:#fff;border:none;border-radius:2px;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  font-size:20px;z-index:999;opacity:0;visibility:hidden;
  transition:opacity .3s,visibility .3s,transform .2s;transform:translateY(10px);
  box-shadow:0 4px 12px rgba(0,0,0,.2);
}
#back-to-top.show{opacity:1;visibility:visible;transform:translateY(0)}
#back-to-top:hover{background:var(--amber);transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,.3)}
@media(max-width:640px){
  #back-to-top{width:44px;height:44px;bottom:20px;right:20px;font-size:18px}
}
html[data-state="public"] #back-to-top{bottom:96px}
@media(max-width:640px){
  html[data-state="public"] #back-to-top{bottom:88px;right:22px}
}

/* Responsive portal — centered content, no sidebar offset */
[data-state="portal"] #pmain{
  padding-top:170px;padding-left:32px;padding-right:32px;padding-bottom:40px;
  width:min(100%,1500px);max-width:none;margin:0 auto;
}
@media(max-width:1024px){
  [data-state="portal"] #pmain{padding:170px 20px 32px;max-width:none}
  .twocol{grid-template-columns:1fr}
}
@media(max-width:768px){
  .pnav-group{padding:0 12px;font-size:10px;letter-spacing:.5px}
  .pnitem{padding:0 10px;font-size:10px}
  [data-state="portal"] #pmain{padding:170px 16px 28px}
}
@media(max-width:640px){
  [data-state="portal"] #pmain{padding:170px 12px 24px}
  #ptb-user{display:none}
  #portal-topbar{justify-content:flex-start;padding-left:12px}
  #portal-topbar .bf-logo-dark,#portal-topbar .bf-logo-light{height:38px}
  .ptb-right{right:8px;gap:4px}
  .company-context-control>span{display:none}
  .company-context-control select{max-width:112px;font-size:9px}
  .pnav-group{padding:0 8px;font-size:9px;letter-spacing:.3px}
  .fgrid{grid-template-columns:1fr}
  .fgrid.three{grid-template-columns:1fr}
}

/* ═══════════════════════════════════════════════════════
   ■ EXTRACTED INLINE STYLES
═══════════════════════════════════════════════════════ */

/* ── Logo sizing per context ── */
#pub-nav .bf-logo-dark,#pub-nav .bf-logo-light{height:60px}
.footer-brand-block .bf-logo-dark,.footer-brand-block .bf-logo-light{height:62px}
.login-mark .bf-logo-dark,.login-mark .bf-logo-light{height:74px}

/* ── Emergency bar phone ── */
.emg-num{font-size:13px;font-weight:700;letter-spacing:1px}

/* ── Layout helpers ── */
.content-inner{max-width:1280px;margin:0 auto}

/* ── Public site typography ── */
.h1-display{font-family:'Big Shoulders Display',sans-serif;font-size:clamp(32px,5vw,52px);font-weight:900;color:var(--text);line-height:1;margin-bottom:8px}
.h2-display{font-family:'Big Shoulders Display',sans-serif;font-size:clamp(32px,5vw,56px);font-weight:900;color:var(--text);margin-bottom:16px}
.text-intro{font-size:14px;color:var(--muted);line-height:1.6;margin-bottom:20px}
.site-tagline{font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--ember);letter-spacing:2px;margin-top:32px}

/* ── Public site sections ── */
.home-cta{text-align:center;padding:72px clamp(16px,6vw,80px);background:var(--bg);display:flex;flex-direction:column;align-items:center;gap:20px}
.home-cta .h2-display{margin:0}
.home-cta .text-intro{margin:0;max-width:560px}
.home-cta .site-tagline{margin-top:12px}
.svc-cta{text-align:center;padding:48px 20px;border-top:1px solid var(--border);background:var(--bg)}
#pub-contact > div{padding-top:96px}

/* ── Contact ── */
.ci-val-emg{color:var(--ember);font-size:20px;font-weight:700}
.form-title{font-family:'Big Shoulders Display',sans-serif;font-size:20px;font-weight:700;color:var(--text);margin-bottom:20px}
.form-actions{margin-top:18px}
#cf-success{margin-top:14px;padding:12px 16px;background:var(--grn-glow);border:1px solid rgba(26,122,64,.3);border-radius:2px;color:var(--pill-paid-txt);font-size:13px;text-align:center}

/* ── Login ── */
.login-footer{text-align:center;margin-top:12px}
.login-sep{color:var(--muted);font-size:11px;margin:0 8px}

/* ── Buttons ── */
.btn-full{width:100%}
.signout-icon{width:12px;height:12px}
.sinput-narrow{max-width:130px;flex:none}
.btn-create-user{background:var(--accent);color:#fff;border:1px solid var(--accent);padding:8px 18px;cursor:pointer;font-family:'IBM Plex Mono',monospace;font-size:14px;letter-spacing:1.5px;text-transform:uppercase;border-radius:2px;display:inline-flex;align-items:center}
.btn-create-user:hover{opacity:.85}

/* ── Portal embed pages ── */
#p-home.ppage,#p-services.ppage,#p-contact.ppage{padding:0;margin:-28px -32px}
.embed-hdr{padding:28px 32px 14px;border-bottom:1px solid var(--border)}
.embed-hdr--row{display:flex;align-items:center;justify-content:space-between}
.embed-body{padding:28px}
.portal-svc-section{padding:20px 32px}
.portal-svc-filters{margin-bottom:18px}
#p-contact .contact-wrap{max-width:none;padding:28px 32px}
.ci-val-portal-emg{color:var(--ember);font-size:26px;font-weight:700}
.portal-form-title{font-family:'Big Shoulders Display',sans-serif;font-size:26px;font-weight:700;color:var(--text);margin-bottom:16px}

/* ── Dashboard ── */
.rev-chart-wrap{padding:14px 16px 8px}

/* ── Transactions stats ── */
.tx-stats{display:flex;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.kcard--flex{flex:1;min-width:130px}
.kcard--credits{border-top-color:var(--green)}
.kcard--debits{border-top-color:var(--ember)}
.kcard--net{border-top-color:var(--amber)}
.kval--lg{font-size:31px}
.kval--paid{color:var(--pill-paid-txt)}
.kval--ovr{color:var(--pill-ovr-txt)}

/* ── Quote / Line items ── */
.li-desc-col{width:45%}
.flbl-mb{margin-bottom:8px}
#nq-pending-notice{margin-bottom:16px;padding:12px 16px;background:rgba(230,126,34,.08);border:1px solid rgba(230,126,34,.25);border-radius:2px;font-size:17px;color:var(--warn)}

/* ── Payment ── */
.pay-count{color:var(--accent);font-size:16px;font-weight:400}
.pay-inv-wrap{margin-bottom:16px}
.label-opt{font-weight:400;color:var(--muted)}
.finput-file{padding:6px}

/* ── Users ── */
#users-create-bar{margin-bottom:12px}

/* ═══════════════════════════════════════════════════════
   ■ SAFETY FILES MODULE  (APS-EHS-FRM-010)
═══════════════════════════════════════════════════════ */

/* ── Colour bands ── */
.saf-green    { color:#16a34a }
.saf-yellow   { color:#ca8a04 }
.saf-orange   { color:#ea580c }
.saf-red      { color:#dc2626 }
.saf-unscored { color:var(--muted) }

/* ── Dashboard grid ── */
.safety-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:16px }
.safety-grid.safety-grid--single { grid-template-columns:minmax(0,480px); justify-content:center }

.saf-card {
  background:var(--card); border:1px solid var(--border); border-top:3px solid var(--border);
  border-radius:4px; padding:16px; cursor:pointer; transition:box-shadow .15s, transform .1s;
}
.saf-card:hover { box-shadow:0 4px 16px rgba(0,0,0,.12); transform:translateY(-1px) }
.saf-card.saf-green  { border-top-color:#16a34a }
.saf-card.saf-yellow { border-top-color:#ca8a04 }
.saf-card.saf-orange { border-top-color:#ea580c }
.saf-card.saf-red    { border-top-color:#dc2626 }

.saf-card-hdr        { display:flex; justify-content:space-between; align-items:center; margin-bottom:8px }
.saf-card-id         { font-family:var(--mono); font-size:12px; color:var(--muted); font-weight:600 }
.saf-card-contractor { font-size:16px; font-weight:700; color:var(--text); margin-bottom:4px; line-height:1.2 }
.saf-card-scope      { font-size:13px; color:var(--muted); margin-bottom:8px; line-height:1.4; min-height:18px }
.saf-card-meta       { display:flex; gap:12px; font-size:12px; color:var(--muted); margin-bottom:10px; flex-wrap:wrap; align-items:center }
.saf-card-score-row  { display:flex; align-items:center; gap:10px; margin-bottom:8px }
.saf-score-chip      { font-size:22px; font-weight:900; font-family:var(--display); line-height:1 }
.saf-band-label      { font-size:12px; color:var(--muted) }
.saf-card-stats      { display:flex; gap:8px; flex-wrap:wrap }
.saf-stat            { font-size:11px; padding:2px 7px; border-radius:10px; font-weight:600 }
.saf-stat-ts         { background:rgba(22,163,74,.12);  color:#16a34a }
.saf-stat-nts        { background:rgba(220,38,38,.10);  color:#dc2626 }
.saf-stat-na         { background:rgba(100,116,139,.10); color:var(--muted) }

/* ── Status pills ── */
.saf-status-pill { font-size:11px; padding:2px 8px; border-radius:10px; font-weight:600; text-transform:uppercase }
.saf-status-draft       { background:rgba(100,116,139,.15); color:var(--muted) }
.saf-status-in-progress { background:rgba(59,130,246,.12);  color:#2563eb }
.saf-status-submitted   { background:rgba(234,179,8,.15);   color:#b45309 }
.saf-status-approved    { background:rgba(22,163,74,.12);   color:#16a34a }

/* ── Policy email badge ── */
.saf-pol-badge { font-size:10px; padding:2px 6px; border-radius:8px; background:rgba(22,163,74,.12); color:#16a34a; font-weight:600 }

/* ── Submission record — card bar ── */
.saf-submission-bar {
  font-size:10px; color:#16a34a; font-weight:600;
  background:rgba(22,163,74,.07); border:1px solid rgba(22,163,74,.2);
  border-radius:4px; padding:3px 8px; margin-top:6px; line-height:1.5;
}

/* ── Submission record — detail banner ── */
.saf-submission-banner {
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  background:rgba(22,163,74,.07); border:1px solid rgba(22,163,74,.22);
  border-radius:8px; padding:12px 16px; margin-bottom:16px;
}
.saf-sb-icon { font-size:22px; color:#16a34a; flex-shrink:0; line-height:1 }
.saf-sb-meta { flex:1; min-width:160px }
.saf-sb-meta strong { display:block; font-size:13px; color:#16a34a; line-height:1.4 }
.saf-sb-meta span   { font-size:11px; color:var(--muted) }
.saf-sb-score-pill  {
  background:#16a34a; color:#fff; padding:5px 14px;
  border-radius:20px; font-size:14px; font-weight:700; flex-shrink:0;
}

/* ── Reminders ── */
.safety-reminders { margin-bottom:8px }

.safety-compliance-summary {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin:14px 0;
}
.saf-summary-card {
  background:var(--surface);
  border:1px solid var(--border);
  border-top:3px solid var(--border);
  border-radius:4px;
  padding:16px;
  min-width:0;
}
.saf-summary-card--score { border-top-color:var(--accent) }
.saf-summary-card--risk { border-top-color:#dc2626 }
.saf-summary-value {
  font-family:var(--display);
  font-size:38px;
  font-weight:900;
  line-height:1;
  color:var(--text);
  overflow-wrap:anywhere;
}
.safety-region-blocks {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin:0 0 14px;
}
.saf-region-card {
  background:var(--card);
  border:1px solid var(--border);
  border-radius:4px;
  padding:14px;
  min-width:0;
}
.saf-region-card--empty { color:var(--muted) }
.saf-region-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  font-weight:700;
  color:var(--text);
}
.saf-region-head span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.saf-region-meta,.saf-region-risk {
  margin-top:6px;
  font-size:12px;
  color:var(--muted);
}
.saf-region-bar {
  height:6px;
  margin-top:10px;
  overflow:hidden;
  border-radius:999px;
  background:var(--surface2);
}
.saf-region-bar span {
  display:block;
  height:100%;
  background:#16a34a;
}
@media(max-width:900px){
  .safety-compliance-summary { grid-template-columns:repeat(2,minmax(0,1fr)) }
}
@media(max-width:640px){
  .safety-compliance-summary,.safety-region-blocks { grid-template-columns:1fr }
  .saf-summary-value { font-size:32px }
}

/* ── Audit layout (two-column: main + sidebar) ── */
.safety-audit-layout {
  display:grid; grid-template-columns:1fr 260px; gap:20px; align-items:start;
}
@media(max-width:900px){ .safety-audit-layout { grid-template-columns:1fr } }
@media(max-width:700px){ .safety-grid { grid-template-columns:1fr } }

.safety-audit-main   { min-width:0 }
.safety-score-sidebar { position:sticky; top:20px }

/* ── Score panel ── */
.safety-score-big { font-size:48px; font-weight:900; font-family:var(--display); text-align:center; margin-bottom:4px; transition:color .2s }
.safety-score-label { text-align:center; font-size:14px; font-weight:600; margin-bottom:4px }
.safety-score-rule  { text-align:center; font-size:12px; color:var(--muted); margin-bottom:8px; line-height:1.4 }

.saf-sec-score-row  { display:flex; align-items:center; gap:6px; padding:4px 0; border-bottom:1px solid var(--border) }
.saf-sec-key        { font-family:var(--mono); font-size:12px; font-weight:700; min-width:18px }
.saf-sec-score-label { flex:1; font-size:11px; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.saf-sec-pct        { font-size:12px; font-weight:700; min-width:34px; text-align:right }

/* ── Legend ── */
.saf-legend    { display:flex; flex-direction:column; gap:6px }
.saf-leg-item  { display:flex; align-items:center; gap:8px; font-size:12px; color:var(--muted) }
.saf-dot       { width:10px; height:10px; border-radius:50%; flex-shrink:0 }
.saf-dot.saf-green  { background:#16a34a }
.saf-dot.saf-yellow { background:#ca8a04 }
.saf-dot.saf-orange { background:#ea580c }
.saf-dot.saf-red    { background:#dc2626 }

/* ── Section accordion ── */
.safety-sections-wrap { display:flex; flex-direction:column }
.saf-sec-hdr { cursor:pointer; user-select:none }
.saf-sec-hdr-right { display:flex; align-items:center; gap:8px }
.saf-toggle  { font-size:12px; color:var(--muted) }
.saf-sec-body { overflow-x:auto }
.saf-sec-body.collapsed { display:none }

/* ── Checklist table ── */
.saf-criteria-wrap  { overflow-x:auto }
.saf-criteria-tbl   { width:100%; border-collapse:collapse; font-size:12px; min-width:700px }
.saf-criteria-tbl th { padding:6px 8px; background:var(--th-bg,rgba(0,0,0,.04)); font-size:11px; font-weight:600; text-align:left; white-space:nowrap; border-bottom:1px solid var(--border) }
.saf-criteria-tbl td { padding:5px 6px; border-bottom:1px solid var(--border); vertical-align:top }
.saf-no   { font-family:var(--mono); font-size:11px; color:var(--muted); text-align:center }
.saf-ref  { font-family:var(--mono); font-size:10px; color:var(--muted); white-space:nowrap }
.saf-crit { font-size:12px; color:var(--text); line-height:1.4 }
.saf-radio-cell { text-align:center; vertical-align:middle }
.saf-radio-lbl  { display:flex; align-items:center; gap:4px; font-size:11px; cursor:pointer; justify-content:center }
.saf-upload-cell { text-align:center; vertical-align:middle }
.saf-up-count { font-size:10px; background:var(--accent); color:#fff; border-radius:8px; padding:0 5px; margin-right:3px }

/* ── Row highlights ── */
.saf-item-row.saf-row-ts  { background:rgba(22,163,74,.05) }
.saf-item-row.saf-row-nts { background:rgba(220,38,38,.05) }
.saf-item-row.saf-row-na  { background:rgba(100,116,139,.04); opacity:.7 }

/* ── Comments / appointee inline inputs ── */
.finput-sm   { font-size:12px; padding:3px 6px; min-height:24px }
textarea.saf-cmt { resize:vertical; min-height:28px; width:100% }

/* ── Audit action row ── */
.saf-action-row { display:flex; gap:10px; justify-content:flex-end }

/* ── Detail view ── */
.saf-detail-header { display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:12px; margin-bottom:16px }
.saf-detail-actions { display:flex; gap:8px; flex-wrap:wrap }

.saf-detail-cover { padding:20px }
.saf-cover-grid {
  display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:10px 20px;
  margin-bottom:16px;
}
.saf-cover-lbl { display:block; font-size:11px; color:var(--muted); text-transform:uppercase; margin-bottom:2px }
.saf-cover-val { font-size:13px; font-weight:600; color:var(--text) }
.saf-cover-score-block {
  padding:16px; border-radius:4px; text-align:center;
  border:1px solid var(--border); background:var(--surface,rgba(0,0,0,.02));
}
.saf-cover-score { font-size:52px; font-weight:900; font-family:var(--display); line-height:1 }
.saf-cover-band  { font-size:16px; font-weight:700; margin:4px 0 }
.saf-cover-note  { font-size:12px; color:var(--muted); line-height:1.4; margin-top:6px }
.saf-cover-doc   { font-size:10px; color:var(--muted); margin-top:8px; font-family:var(--mono) }

/* ── Summary table ── */
.saf-sum-tbl { width:100%; border-collapse:collapse; font-size:13px }
.saf-sum-tbl th { background:var(--th-bg,rgba(0,0,0,.04)); padding:7px 10px; font-size:11px; font-weight:600; text-align:left }
.saf-sum-tbl td { padding:7px 10px; border-bottom:1px solid var(--border) }
.saf-sum-tbl tfoot td { font-weight:700; border-top:2px solid var(--border) }

/* ── Action plan ── */
.saf-ap-deadline { font-size:12px; font-weight:700; padding:2px 10px; border-radius:10px; background:rgba(0,0,0,.06) }
.saf-ap-tbl { width:100%; border-collapse:collapse; font-size:12px }
.saf-ap-tbl th { background:var(--th-bg,rgba(0,0,0,.04)); padding:6px 8px; font-size:11px; font-weight:600; text-align:left }
.saf-ap-tbl td { padding:6px 8px; border-bottom:1px solid var(--border); vertical-align:top }
.saf-ap-status { white-space:nowrap }

/* ── Full checklist report ── */
.saf-rpt-section { margin-bottom:24px }
.saf-rpt-sec-hdr { font-size:14px; font-weight:700; color:var(--text); padding:8px 0; border-bottom:2px solid var(--border); margin-bottom:8px; display:flex; align-items:center; gap:10px }
.saf-rpt-tbl { width:100%; border-collapse:collapse; font-size:12px }
.saf-rpt-tbl th { background:var(--th-bg,rgba(0,0,0,.04)); padding:5px 8px; font-size:11px; font-weight:600; text-align:left; white-space:nowrap }
.saf-rpt-tbl td { padding:5px 8px; border-bottom:1px solid var(--border); vertical-align:top; line-height:1.35 }
.saf-ts      { color:#16a34a; font-weight:600 }
.saf-nts-text { color:#dc2626; font-weight:600 }
.saf-na-text  { color:var(--muted) }
.saf-rpt-ev-hdr  { width:80px; text-align:center }
.saf-rpt-ev-cell { text-align:center; white-space:nowrap }
.saf-rpt-no-ev   { color:var(--muted); font-size:11px }

/* ── Safety attachments panel ── */
.saf-att-section           { margin-bottom:16px }
.saf-att-empty             { color:var(--muted); font-size:13px; padding:8px 0 }
.saf-att-row               { display:flex; align-items:center; gap:8px; padding:7px 0; border-bottom:1px solid var(--border); flex-wrap:wrap }
.saf-att-row:last-child    { border-bottom:none }
.saf-att-icon              { font-size:18px; flex-shrink:0 }
.saf-att-name              { font-size:13px; font-weight:600; flex:1; min-width:160px; word-break:break-word }
.saf-att-meta              { font-size:11px; color:var(--muted); white-space:nowrap }
.saf-att-dl                { text-decoration:none; flex-shrink:0 }
.saf-att-del               { background:transparent; border:1px solid var(--ember,#ef4444); color:var(--ember,#ef4444); flex-shrink:0 }
.saf-att-del:hover         { background:var(--ember,#ef4444); color:#fff }

/* Grouped section header inside the attachments panel */
.saf-att-sec-hdr           { display:flex; align-items:center; justify-content:space-between; font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); padding:10px 0 4px; border-bottom:2px solid var(--border); margin-top:6px }
.saf-att-sec-hdr:first-child { margin-top:0 }
.saf-att-sec-count         { background:var(--surface-alt,#f0ede6); color:var(--muted); font-size:10px; font-weight:600; padding:1px 7px; border-radius:10px }

/* ── Bonus section (Section I) ── */
.saf-bonus-gold            { color:#b45309 !important }
.saf-section-bonus         { border:2px solid #f59e0b !important; background:rgba(251,191,36,.05) }
.saf-sec-hdr-bonus         { background:linear-gradient(90deg,rgba(251,191,36,.18) 0%,transparent 100%) !important }
.saf-bonus-score-row       { display:flex; flex-direction:column; gap:4px; margin-top:6px; padding:6px 8px; background:rgba(251,191,36,.1); border-radius:6px; font-size:12px }
.saf-bonus-main            { color:var(--muted) }
.saf-bonus-pts             { font-weight:700; font-size:13px }
.saf-sec-bonus-row         { background:rgba(251,191,36,.07); border-top:1px solid rgba(251,191,36,.3); margin-top:4px; padding-top:4px }
.saf-bonus-tag             { font-size:10px; font-weight:700; background:#f59e0b; color:#fff; border-radius:4px; padding:1px 5px; vertical-align:middle }
.saf-sum-bonus-row td      { background:rgba(251,191,36,.08); font-style:italic }
.saf-ap-bonus-row td       { background:rgba(251,191,36,.08) }
.saf-rpt-section-bonus     { border-left:3px solid #f59e0b; padding-left:8px }
.saf-cover-breakdown       { font-size:13px; margin-top:4px; opacity:.9 }

/* ── Document rename modal ── */
.saf-rename-overlay {
  position:fixed; inset:0; background:rgba(0,0,0,.55);
  display:flex; align-items:center; justify-content:center;
  z-index:9999;
}
.saf-rename-box {
  background:var(--surface,#1e2433); border:1px solid var(--border,#2d3748);
  border-radius:10px; padding:24px 28px; width:420px; max-width:96vw;
  box-shadow:0 8px 32px rgba(0,0,0,.4);
}
.saf-rename-title  { font-size:15px; font-weight:700; margin-bottom:10px }
.saf-rename-orig   { font-size:12px; color:var(--muted); margin-bottom:10px }
.saf-rename-orig em{ font-style:normal; color:var(--text) }
.saf-rename-inp    { width:100%; margin-bottom:8px; font-size:13px }
.saf-rename-hint   { font-size:11px; color:var(--muted); margin-bottom:16px }
.saf-rename-hint code { background:rgba(255,255,255,.06); border-radius:3px; padding:1px 4px }
.saf-rename-btns   { display:flex; gap:10px; justify-content:flex-end }

/* ── Print styles — comprehensive (safety, invoices, quotes, statements, public) ── */
@media print {
  /* hide chrome */
  #pub-nav,#pnav-bar,#pnav-primary-bar,#portal-topbar,#toaster,#back-to-top,
  #info-panel,#info-overlay,#modal-overlay,.pub-mob-login-btn,#pub-mob-nav,
  .saf-detail-actions,.srow,#safety-reminders,.bgrp,.refresh-btn,.info-btn,
  .theme-btn,#pnav-signout,.saf-action-row,.saf-rename-overlay,
  .pub-nav-right,.btn-login,.pub-ham-btn { display:none !important }

  /* page setup */
  html,body { font-size:11pt;background:#fff!important;color:#000!important }
  body::before { display:none }
  * { box-shadow:none!important;animation:none!important;transition:none!important }

  /* portal shell */
  #pmain { margin:0!important;padding:0!important;max-width:none!important }
  #portal-shell { min-height:0 }
  .ppage-hdr { position:static!important }

  /* safety detail */
  #p-safety-detail { display:block!important }
  .ppage:not(#p-safety-detail) { display:none!important }
  .saf-detail-header { margin-bottom:10px }
  .safety-audit-layout { grid-template-columns:1fr }
  .safety-score-sidebar { position:static }
  .saf-sec-body.collapsed { display:table!important }
  .saf-criteria-tbl { min-width:0;font-size:9pt }
  .saf-rpt-tbl,.saf-sum-tbl,.saf-ap-tbl { page-break-inside:auto }
  .saf-rpt-section { page-break-inside:avoid }

  /* invoices & quotes */
  .doc-preview { box-shadow:none;border:none;padding:0;page-break-inside:avoid }
  .doc-t td,.doc-t th { font-size:9.5pt }
  .liitems th,.liitems td { font-size:9.5pt;padding:4px 7px }

  /* statements & transactions */
  table th,table td { font-size:9.5pt;padding:5px 8px }
  .tw { max-height:none!important;overflow:visible!important }
  .tw > table > thead > tr > th { position:static!important;box-shadow:none!important }
  .kgrid { grid-template-columns:repeat(4,1fr) }
  .kcard { page-break-inside:avoid }

  /* panels */
  .panel { box-shadow:none!important;border:1px solid #ccc!important;page-break-inside:avoid }
  .ph { background:#f5f5f5!important;border-bottom:1px solid #ccc!important }
  .pill { border:1px solid #ccc;background:#f5f5f5;color:#000 }
  .twocol { grid-template-columns:1fr 1fr }
  .fgrid { grid-template-columns:1fr 1fr }
  h1,h2,.ptitle { page-break-after:avoid }
  a { color:#000;text-decoration:none }

  /* public site pages */
  #pub-site { display:block!important }
  .pub-page.active { display:block!important }
  .hero-section { min-height:0;padding:20px 0 }
  .live-bar { display:none!important }
  .emergency-bar { -webkit-print-color-adjust:exact;print-color-adjust:exact }
}

/* ── Button size xs ── */
.btn-xs { font-size:11px; padding:3px 7px }

/* ── Personnel on File panel ── */
.saf-prs-tbl                  { width:100%; border-collapse:collapse }
.saf-prs-tbl th,.saf-prs-tbl td { padding:6px 10px; text-align:left; border-bottom:1px solid var(--border,#e2e8f0); font-size:.84rem }
.saf-prs-tbl th               { font-weight:600; background:var(--panel-bg,#f8fafc); font-size:.82rem; text-transform:uppercase; letter-spacing:.02em }
.saf-prs-inactive-row         { opacity:.65; background:var(--panel-bg,#f8fafc) }
.saf-former-toggle            { margin-top:8px }
.saf-former-toggle summary    { cursor:pointer; font-size:.82rem; color:var(--muted,#64748b); padding:6px 2px; user-select:none }
.saf-former-toggle summary:hover { color:var(--accent,#2563eb) }

/* ── Compliance tracking panel ── */
.saf-comp-tbl                   { width:100%; border-collapse:collapse }
.saf-comp-tbl th,.saf-comp-tbl td { padding:6px 10px; text-align:left; border-bottom:1px solid var(--border,#e2e8f0); font-size:.84rem }
.saf-comp-tbl th                { font-weight:600; background:var(--panel-bg,#f8fafc); font-size:.82rem; text-transform:uppercase; letter-spacing:.02em }
.saf-cs-cat                     { color:var(--muted,#64748b); font-size:.75rem }
.saf-cs-role                    { color:var(--muted,#64748b); font-size:.8rem }
.saf-cs-days                    { color:var(--muted,#64748b); font-size:.75rem }
.saf-cs-del-btn                 { background:transparent; border-color:transparent; color:var(--muted,#64748b) }
.saf-cs-del-btn:hover           { color:#dc2626; border-color:#dc2626 }

/* Compliance status badges */
.saf-cs-badge    { display:inline-block; padding:2px 8px; border-radius:10px; font-size:.73rem; font-weight:600 }
.saf-cs-ok       { background:#dcfce7; color:#15803d }
.saf-cs-soon     { background:#fef3c7; color:#92400e }
.saf-cs-overdue  { background:#fee2e2; color:#991b1b }
.saf-cs-none     { background:#f1f5f9; color:var(--muted,#64748b) }

/* Compliance health block (inside cover score panel) */
.saf-ch-loading         { font-size:.75rem; color:var(--muted,#64748b); padding:6px 0; text-align:center }
.saf-ch-block           { margin-top:10px; padding:8px 10px; border-radius:4px; text-align:left; font-size:.8rem }
.saf-ch-compliant       { background:#dcfce7; border:1px solid #86efac; color:#15803d }
.saf-ch-warning         { background:#fef3c7; border:1px solid #fde68a; color:#92400e }
.saf-ch-non-compliant   { background:#fee2e2; border:1px solid #fca5a5; color:#991b1b }
.saf-ch-title           { font-weight:700; font-size:.82rem; margin-bottom:4px }
.saf-ch-item            { margin-top:4px; padding-left:8px; border-left:2px solid currentColor; line-height:1.35 }
.saf-ch-item-detail     { opacity:.8; font-size:.75rem }

/* Portal column in unified people list */
.saf-portal-col               { width:54px; text-align:center !important }
.saf-portal-tick              { display:inline-block; font-size:.85rem; font-weight:700; color:var(--accent,#2563eb); background:#eff6ff; border:1px solid #bfdbfe; border-radius:4px; padding:1px 6px; line-height:1.4 }

/* ── Section save button (in section header) ── */
.saf-sec-save-btn { font-size:.72rem; padding:2px 8px; opacity:.75; transition:opacity .15s }
.saf-sec-save-btn:hover { opacity:1 }

/* ── Compliance document cell ── */
.saf-doc-cell   { white-space:nowrap }
.saf-doc-badge  { display:inline-flex; align-items:center; gap:4px; font-size:.8rem }
.saf-doc-dl     { color:var(--primary,#2563eb); text-decoration:none; font-weight:600 }
.saf-doc-dl:hover { text-decoration:underline }

/* ═══════════════════════════════════════════════════════
   INFO / GUIDE MODE
═══════════════════════════════════════════════════════ */

/* Refresh button in portal topbar */
.refresh-btn{
  display:flex;align-items:center;padding:6px 8px;
  background:var(--surface2);border:1px solid var(--border);border-radius:20px;
  cursor:pointer;color:var(--muted);transition:all .2s;
}
.refresh-btn svg{width:13px;height:13px}
.refresh-btn:hover{border-color:var(--accent);color:var(--accent)}
.refresh-btn.spinning svg{animation:spin-once .6s linear}
@keyframes spin-once{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}

/* Button in portal topbar */
.info-btn{
  display:flex;align-items:center;justify-content:center;
  width:30px;height:30px;border-radius:50%;
  background:var(--surface2);border:1px solid var(--border);
  cursor:pointer;font-size:16px;font-weight:700;
  color:var(--muted);transition:all .15s;
  font-family:'Instrument Sans',sans-serif;line-height:1;
  padding:0;flex-shrink:0;
}
.info-btn:hover{border-color:var(--accent);color:var(--accent)}
.info-btn.active{background:var(--accent);border-color:var(--accent);color:#fff}

/* Guide overlay */
#info-overlay{
  position:fixed;inset:0;
  background:rgba(0,0,0,.25);z-index:499;display:none;
  pointer-events:none;
}
[data-state="portal"][data-info="on"] #info-overlay{display:block}

/* Slide-in guide panel */
#info-panel{
  position:fixed;top:0;right:0;bottom:0;
  width:360px;z-index:500;
  background:var(--surface);
  border-left:2px solid var(--accent);
  box-shadow:-6px 0 28px rgba(0,0,0,.14);
  display:none;flex-direction:column;
  transform:translateX(100%);
  transition:transform .3s ease;
  overflow:hidden;
}
[data-state="portal"] #info-panel{display:flex}
[data-state="portal"][data-info="on"] #info-panel{transform:translateX(0)}

/* Panel sticky header */
#info-panel-hdr{
  background:var(--accent);color:#fff;
  padding:13px 16px;display:flex;align-items:center;
  justify-content:space-between;flex-shrink:0;
}
#info-panel-hdr-title{font-size:13px;font-weight:700;letter-spacing:.02em;line-height:1.3}
#info-panel-hdr-sub{font-size:10px;opacity:.8;margin-top:2px}
#info-panel-close{
  background:transparent;border:none;color:#fff;
  font-size:22px;cursor:pointer;line-height:1;
  padding:0 2px;opacity:.85;flex-shrink:0;
}
#info-panel-close:hover{opacity:1}

/* Panel inner content */
#info-panel-inner{padding:16px 16px 32px;overflow-y:auto;flex:1}
#info-panel-inner::-webkit-scrollbar{width:4px}
#info-panel-inner::-webkit-scrollbar-track{background:var(--surface2)}
#info-panel-inner::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}
.ipanel-badge{display:none}
.ipanel-title{display:none}
.ipanel-sub{display:none}
.ipanel-section{margin-bottom:18px}
.ipanel-section-lbl{
  font-size:9px;font-weight:700;text-transform:uppercase;
  letter-spacing:.1em;color:var(--accent);margin-bottom:8px;
  padding-bottom:4px;border-bottom:1px solid var(--border);
}
.ipanel-section-body{
  font-size:12px;line-height:1.6;color:var(--text2);
}
.ipanel-steps{padding-left:0;margin:0;list-style:none}
.ipanel-steps li{
  display:flex;gap:8px;font-size:12px;line-height:1.5;color:var(--text2);
  padding:4px 0;border-bottom:1px solid var(--border);
}
.ipanel-steps li:last-child{border-bottom:none}
.ipanel-step-num{
  flex-shrink:0;width:18px;height:18px;border-radius:50%;
  background:color-mix(in srgb, var(--accent) 15%, transparent);
  color:var(--accent);font-size:9px;font-weight:700;
  display:flex;align-items:center;justify-content:center;margin-top:1px;
  font-family:'IBM Plex Mono',monospace;
}
.ipanel-access-chips{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.ipanel-chip{
  font-size:10px;padding:2px 7px;border-radius:10px;
  background:var(--surface2);border:1px solid var(--border);color:var(--text2);
  font-family:'IBM Plex Mono',monospace;letter-spacing:.03em;
}
.ipanel-chip.chip-admin{background:color-mix(in srgb,var(--ember) 15%,transparent);border-color:color-mix(in srgb,var(--ember) 30%,transparent);color:var(--ember)}
.ipanel-chip.chip-manager{background:color-mix(in srgb,var(--accent) 15%,transparent);border-color:color-mix(in srgb,var(--accent) 30%,transparent);color:var(--accent)}
.ipanel-divider{height:1px;background:var(--border);margin:18px 0}
.ipanel-suggest-lbl{
  font-size:9px;font-weight:700;text-transform:uppercase;
  letter-spacing:.1em;color:var(--accent);margin-bottom:8px;
  padding-bottom:4px;border-bottom:1px solid var(--border);
  display:block;
}
#info-suggestion{
  width:100%;box-sizing:border-box;
  background:var(--surface2);border:1px solid var(--border);
  color:var(--text);border-radius:3px;padding:8px 10px;
  font-size:12px;font-family:'Instrument Sans',sans-serif;
  resize:vertical;min-height:72px;transition:border-color .15s;
}
#info-suggestion:focus{outline:none;border-color:var(--accent)}
#info-suggest-btn{
  margin-top:6px;width:100%;
  background:var(--accent);color:#fff;border:none;border-radius:3px;
  padding:7px 12px;font-size:11px;font-family:'IBM Plex Mono',monospace;
  letter-spacing:.05em;text-transform:uppercase;cursor:pointer;transition:opacity .15s;
}
#info-suggest-btn:hover{opacity:.85}
#info-suggest-btn:disabled{opacity:.45;cursor:default}
.ipanel-empty{
  padding:40px 20px;text-align:center;
  font-size:12px;color:var(--muted);font-style:italic;
}

/* Role capabilities */
.ipanel-can,.ipanel-cannot{
  display:flex;align-items:baseline;gap:6px;font-size:12px;
  padding:3px 0;line-height:1.4;
}
.ipanel-can{color:var(--text2)}
.ipanel-cannot{color:var(--muted)}
.ipanel-can-icon{
  flex-shrink:0;font-size:10px;font-weight:700;
  color:var(--ok,#22c55e);font-family:'IBM Plex Mono',monospace;
}
.ipanel-cannot-icon{
  flex-shrink:0;font-size:10px;font-family:'IBM Plex Mono',monospace;color:var(--muted);
}
.ipanel-cannot-wrap{margin-top:4px;padding-top:4px;border-top:1px dashed var(--border)}

/* Quick action buttons */
.ipanel-actions-row{display:flex;flex-wrap:wrap;gap:5px;margin-top:4px}
.ipanel-action-btn{
  padding:5px 12px;font-size:11px;font-family:'Instrument Sans',sans-serif;
  font-weight:600;
  background:var(--surface2);border:1px solid var(--border);border-radius:5px;
  color:var(--text2);cursor:pointer;transition:all .15s;
}
.ipanel-action-btn:hover{border-color:var(--accent);color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent)}

/* Tips */
.ipanel-tip{
  background:color-mix(in srgb,var(--warn,#f59e0b) 10%,transparent);
  border:1px solid color-mix(in srgb,var(--warn,#f59e0b) 28%,transparent);
  border-radius:4px;
  padding:9px 12px;margin-bottom:6px;
  font-size:11px;line-height:1.65;color:var(--text2);
}
.ipanel-tip-icon{display:none}

/* FAQ */
.ipanel-faq{
  padding:8px 0;border-bottom:1px solid var(--border);
}
.ipanel-faq:last-child{border-bottom:none}
.ipanel-faq-q{
  font-size:12px;font-weight:600;color:var(--text);margin-bottom:3px;line-height:1.4;
}
.ipanel-faq-a{
  font-size:11px;color:var(--text2);line-height:1.5;
}

/* ── req asterisk ── */
.req { color:var(--ember) }
.req-legend { font-size:12px; color:var(--text3); margin-bottom:12px }

/* ── Safety snag list additions (2026-05-22) ── */

/* Score sidebar: audit score label */
.saf-score-label-top{
  font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted);margin-bottom:2px;
}

/* Completion percentage bar below audit score */
.saf-completion-bar{
  font-size:11px;color:var(--muted);margin-top:6px;padding:6px 8px;
  background:var(--surface2);border-radius:3px;line-height:1.5;
}
.saf-comp-label{ font-weight:600;color:var(--text2); }
.saf-comp-count{ color:var(--text); }
.saf-comp-pct  { color:var(--muted); }

/* Detail view score block: audit score label + completion */
.saf-cover-score-lbl{
  font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  opacity:.7;margin-bottom:2px;
}
.saf-cover-completion{
  font-size:11px;opacity:.75;margin-top:4px;padding:4px 0;
  border-top:1px solid rgba(255,255,255,.15);
}

/* Section sign-off document cell in summary table */
.saf-sec-doc-cell{ white-space:nowrap;min-width:120px; }
.saf-sec-doc-btn { font-size:11px; }
.saf-sec-doc-link{ display:flex;gap:4px;align-items:center;flex-wrap:wrap; }

/* Policy acknowledgment section */
.saf-policy-ack-section{}

/* ── Dashboard customisation ── */
.dash-ptitle-row            { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:4px }
.dash-edit-btn              { margin-top:6px; white-space:nowrap }
.kgrid--auto                { grid-template-columns:repeat(auto-fill,minmax(175px,1fr)) }
.dash-empty-state           { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; padding:60px 20px; color:var(--muted); text-align:center }
.dash-empty-state svg       { opacity:.35 }
.dash-empty-state p         { font-size:13px; line-height:1.6; margin:0 }
.exec-dash                  { display:grid; gap:16px; margin:14px 0 20px }
.exec-hero                  { display:flex; justify-content:space-between; gap:18px; align-items:flex-end; padding:22px; border:1px solid var(--border); background:linear-gradient(135deg,var(--surface),var(--surface2)); border-left:3px solid var(--ember) }
.exec-eyebrow               { font-family:'IBM Plex Mono',monospace; font-size:10px; letter-spacing:2px; text-transform:uppercase; color:var(--ember); margin-bottom:8px }
.exec-hero h2               { margin:0; font-family:'Big Shoulders Display',sans-serif; font-size:36px; line-height:1; letter-spacing:1px; color:var(--text) }
.exec-hero p                { max-width:680px; margin:8px 0 0; color:var(--text2); font-size:13px; line-height:1.55 }
.exec-hero-actions          { display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end }
.exec-kpi-grid              { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px }
.exec-kpi                   { padding:18px; border:1px solid var(--border); background:var(--surface); min-width:0 }
.exec-kpi span,.exec-alert-label { display:block; font-family:'IBM Plex Mono',monospace; font-size:10px; letter-spacing:1.6px; text-transform:uppercase; color:var(--muted) }
.exec-kpi strong            { display:block; margin-top:8px; font-family:'Big Shoulders Display',sans-serif; font-size:34px; line-height:1; color:var(--text); overflow-wrap:anywhere }
.exec-kpi em                { display:block; margin-top:8px; font-style:normal; color:var(--text3); font-size:12px }
.exec-kpi--amount strong    { font-size:30px }
.exec-kpi--action           { width:100%; color:inherit; font:inherit; text-align:left; cursor:pointer }
.exec-kpi--action:hover,.exec-kpi--action:focus-visible { border-color:var(--blue); box-shadow:0 0 0 2px color-mix(in srgb,var(--blue) 18%,transparent); outline:0 }
.exec-metric-group          { display:grid; gap:8px }
.exec-section-label         { font-family:'IBM Plex Mono',monospace; font-size:10px; letter-spacing:2px; text-transform:uppercase; color:var(--muted) }
.panel-subtitle             { margin-top:4px; color:var(--muted); font-size:11px; line-height:1.4 }
#reporting-content.reporting-business-shell{padding:0;overflow:hidden}
.reporting-business-frame{display:block;width:100%;height:calc(100vh - 285px);min-height:540px;border:0;background:var(--surface)}
.exec-trend-row             { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr); gap:14px }
.exec-panel                 { min-width:0 }
.exec-trend-chart           { display:flex; align-items:end; gap:12px; height:205px; padding:20px 20px 14px }
.exec-trend-bar-wrap        { flex:1; min-width:0; height:100%; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; gap:7px }
.exec-trend-val             { min-height:29px; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; gap:2px; font-family:'IBM Plex Mono',monospace; font-size:9px; line-height:1.2; white-space:nowrap }
.exec-trend-val strong      { color:var(--muted); font-weight:500 }
.exec-trend-val span        { color:var(--text); font-weight:700 }
.exec-trend-bar             { width:100%; min-height:6px; background:var(--ember); border-radius:2px 2px 0 0; box-shadow:0 0 0 1px rgba(255,255,255,.05) inset }
.exec-trend-label           { font-family:'IBM Plex Mono',monospace; font-size:10px; color:var(--text3); text-transform:uppercase }
.exec-status-row            { display:grid; grid-template-columns:1fr auto; gap:8px 12px; align-items:center; padding:10px 0; border-bottom:1px solid var(--border) }
.exec-status-row:last-child { border-bottom:0 }
.exec-status-row span       { color:var(--text2); font-size:13px }
.exec-status-row strong     { color:var(--text); font-family:'IBM Plex Mono',monospace; font-size:13px }
.exec-status-meter          { grid-column:1 / -1; height:6px; background:var(--surface3); border-radius:999px; overflow:hidden }
.fin-chart-key              { display:flex; align-items:center; gap:14px; color:var(--text2); font-size:11px }
.fin-chart-key span         { display:flex; align-items:center; gap:5px; white-space:nowrap }
.fin-chart-key-dot          { width:8px; height:8px; display:inline-block; border-radius:1px }
.fin-chart-key-dot--income  { background:var(--green) }
.fin-chart-key-dot--cost    { background:var(--ember) }
.fin-compare-chart          { display:grid; grid-template-columns:52px minmax(0,1fr); min-height:278px; padding:18px 18px 12px 10px }
.fin-compare-scale          { display:flex; flex-direction:column; justify-content:space-between; padding:0 8px 25px 0; color:var(--muted); font-family:'IBM Plex Mono',monospace; font-size:9px; text-align:right }
.fin-compare-plot           { position:relative; display:flex; align-items:stretch; gap:10px; height:248px; padding-top:22px; min-width:0; border-bottom:1px solid var(--border) }
.fin-compare-plot::before   { content:''; position:absolute; inset:22px 0 24px; background-image:linear-gradient(to bottom,transparent calc(100% - 1px),var(--border) 0); background-size:100% 25%; pointer-events:none; opacity:.75 }
.fin-compare-month          { position:relative; z-index:1; flex:1; min-width:0; display:grid; grid-template-rows:minmax(0,1fr) 24px }
.fin-compare-bars           { height:100%; display:flex; align-items:flex-end; justify-content:center; gap:4px }
.fin-compare-bar            { position:relative; width:min(21px,40%); min-height:2px; border-radius:2px 2px 0 0; transition:opacity .15s,filter .15s; cursor:default }
.fin-compare-bar:hover      { filter:brightness(1.08); opacity:.82 }
.fin-compare-bar--income   { background:var(--green) }
.fin-compare-bar--cost     { background:var(--ember) }
.fin-compare-bar.is-zero   { opacity:.18 }
.fin-compare-value         { position:absolute; top:-17px; left:50%; transform:translateX(-50%); color:var(--text2); font-family:'IBM Plex Mono',monospace; font-size:8px; white-space:nowrap }
.fin-compare-label         { align-self:end; overflow:hidden; color:var(--muted); font-family:'IBM Plex Mono',monospace; font-size:10px; text-align:center; text-overflow:ellipsis; white-space:nowrap }
.fin-status-chart          { min-height:278px; display:grid; grid-template-columns:minmax(150px,180px) minmax(0,1fr); gap:26px; align-items:center; padding:22px 24px }
.fin-status-donut          { position:relative; width:168px; height:168px; justify-self:center }
.fin-status-donut svg      { width:100%; height:100%; display:block; overflow:visible }
.fin-status-track          { stroke:var(--surface3) }
.fin-status-segment        { transform:rotate(-90deg); transform-origin:60px 60px; transition:opacity .15s }
.fin-status-segment:hover  { opacity:.78 }
.fin-status-total          { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; pointer-events:none }
.fin-status-total strong   { color:var(--text); font-family:'Big Shoulders Display',sans-serif; font-size:36px; line-height:.9 }
.fin-status-total span     { margin-top:7px; color:var(--muted); font-family:'IBM Plex Mono',monospace; font-size:9px; letter-spacing:1.5px; text-transform:uppercase }
.fin-status-legend         { display:grid; gap:0 }
.fin-status-legend-row     { display:grid; grid-template-columns:10px minmax(0,1fr) auto 38px; gap:9px; align-items:center; min-height:42px; border-bottom:1px solid var(--border); color:var(--text2); font-size:12px }
.fin-status-legend-row:last-child { border-bottom:0 }
.fin-status-legend-row strong { color:var(--text); font-family:'IBM Plex Mono',monospace; font-size:12px }
.fin-status-legend-row em  { color:var(--muted); font-family:'IBM Plex Mono',monospace; font-size:10px; font-style:normal; text-align:right }
.fin-status-dot            { width:8px; height:8px; border-radius:1px }
.fin-status-dot--paid      { background:var(--green) }
.fin-status-dot--sent      { background:var(--amber) }
.fin-status-dot--overdue   { background:var(--ember) }
.fin-status-dot--draft     { background:var(--muted) }
.fin-break-list,.fin-invoice-list { display:grid; gap:12px }
.fin-break-row               { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px 14px; align-items:center; padding:4px 0 12px; border-bottom:1px solid var(--border) }
.fin-break-row:last-child    { border-bottom:0; padding-bottom:0 }
.fin-break-main              { min-width:0 }
.fin-break-title             { color:var(--text); font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.fin-break-meta              { margin-top:3px; color:var(--muted); font-size:12px }
.fin-break-amt               { color:var(--text); font-family:'IBM Plex Mono',monospace; font-size:12px; white-space:nowrap }
.fin-break-bar               { grid-column:1 / -1 }
.fin-client-chart            { display:grid; gap:0 }
.fin-client-row              { display:grid; grid-template-columns:30px minmax(0,1fr) auto; gap:8px 12px; align-items:center; padding:10px 0 14px; border-bottom:1px solid var(--border) }
.fin-client-row:first-child  { padding-top:0 }
.fin-client-row:last-child   { border-bottom:0; padding-bottom:0 }
.fin-client-rank             { grid-row:1 / span 2; align-self:start; display:grid; place-items:center; width:24px; height:24px; border:1px solid var(--border); background:var(--surface2); color:var(--muted); font-family:'IBM Plex Mono',monospace; font-size:10px }
.fin-client-bar              { grid-column:2 / -1; height:7px }
.fin-client-bar .prog-fill  { height:7px }
.fin-invoice-card            { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; align-items:center; padding:12px; border:1px solid var(--border); background:var(--surface2) }
.fin-invoice-side            { display:flex; align-items:center; justify-content:flex-end; gap:10px; flex-wrap:wrap }
.fin-invoice-side strong     { color:var(--text); font-family:'IBM Plex Mono',monospace; font-size:12px }
.ledger-summary              { display:grid; gap:16px; margin:14px 0 18px }
.ledger-summary-grid         { align-items:stretch }
.ledger-trend                { height:220px; display:flex; padding:18px 18px 8px }
.ledger-trend-col            { flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; gap:8px }
.ledger-trend-bars           { flex:1; width:100%; display:flex; align-items:flex-end; justify-content:center; gap:2px; border-bottom:2px solid var(--border) }
.ledger-bar                  { width:14px; max-width:34%; min-height:4px; border-radius:4px 4px 0 0; transition:opacity .15s; cursor:default }
.ledger-trend-bars:hover .ledger-bar{ opacity:.55 }
.ledger-trend-bars .ledger-bar:hover{ opacity:1 }
.ledger-bar-credit           { background:var(--blue) }
.ledger-bar-debit            { background:var(--orange) }
.legend-credit               { background:var(--blue) }
.legend-debit                { background:var(--orange) }
.ledger-trend-label          { font-family:'IBM Plex Mono',monospace; font-size:10px; color:var(--text3); text-transform:uppercase }
.ledger-feed                 { display:grid; gap:10px }
.ledger-feed-card            { display:grid; grid-template-columns:110px minmax(0,1fr) auto; gap:12px; align-items:center; padding:12px; border:1px solid var(--border); background:var(--surface2) }
.ledger-feed-date            { color:var(--muted); font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase }
.ledger-feed-main            { min-width:0 }
.ledger-feed-amounts         { display:flex; align-items:center; justify-content:flex-end; gap:12px; flex-wrap:wrap; font-family:'IBM Plex Mono',monospace; font-size:12px; white-space:nowrap }
.empty-note                  { color:var(--muted); font-size:13px; line-height:1.5 }
.exec-status-meter i        { display:block; height:100%; min-width:2px; background:var(--ember) }
.exec-alert-grid            { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px }
.exec-alert-card            { padding:16px; border:1px solid var(--border); background:var(--surface); border-left:2px solid var(--muted) }
.exec-alert-card.warn       { border-left-color:var(--amber) }
.exec-alert-card.danger     { border-left-color:var(--ember) }
.exec-alert-card.info       { border-left-color:var(--blue) }
.exec-alert-card--action    { width:100%; color:inherit; font:inherit; text-align:left; cursor:pointer }
.exec-alert-card--action:hover,.exec-alert-card--action:focus-visible { border-color:var(--blue); box-shadow:0 0 0 2px color-mix(in srgb,var(--blue) 18%,transparent); outline:0 }
.exec-alert-value           { margin-top:6px; font-family:'Big Shoulders Display',sans-serif; font-size:30px; line-height:1; color:var(--text) }
.exec-alert-card.warn .exec-alert-value   { color:var(--amber) }
.exec-alert-card.danger .exec-alert-value { color:var(--ember) }
.exec-alert-card.info .exec-alert-value   { color:var(--blue) }
.exec-alert-sub             { margin-top:6px; font-size:12px; color:var(--text3) }
.exec-run-summary           { display:grid; grid-template-columns:1fr auto; gap:7px 14px; padding:12px 18px 16px; border-top:1px solid var(--border); color:var(--muted); font-size:11px }
.exec-run-summary strong    { color:var(--text); font-family:'IBM Plex Mono',monospace; font-size:11px }
.exec-due-panel,.exec-usage-panel { min-width:0 }
.badge-soft                 { background:var(--surface3); color:var(--text2) }
.due-chip                   { display:inline-block; min-width:42px; padding:3px 7px; border-radius:999px; background:rgba(240,153,43,.13); color:var(--amber); font-family:'IBM Plex Mono',monospace; font-size:10px; font-weight:700; text-align:center; white-space:nowrap }
.due-chip--hot              { background:rgba(192,57,43,.13); color:var(--ember) }
.usage-delta                { display:inline-block; padding:3px 7px; border-radius:999px; font-family:'IBM Plex Mono',monospace; font-size:10px; font-weight:700; white-space:nowrap }
.usage-delta--up            { color:var(--green); background:rgba(34,197,94,.12) }
.usage-delta--down          { color:var(--ember); background:rgba(192,57,43,.12) }
.usage-delta--flat          { color:var(--muted); background:var(--surface3) }
.usage-summary              { display:flex; align-items:center; justify-content:flex-end; gap:7px; flex-wrap:wrap }
.usage-inactive-badge       { color:var(--ember); border-color:rgba(192,57,43,.35); background:rgba(192,57,43,.08) }
.usage-row--inactive        { background:rgba(192,57,43,.035) }
.usage-row--inactive td:first-child { box-shadow:inset 2px 0 0 var(--ember) }
.usage-status               { display:inline-block; min-width:54px; padding:3px 7px; border-radius:999px; font-family:'IBM Plex Mono',monospace; font-size:10px; font-weight:700; text-align:center; white-space:nowrap }
.usage-status--active       { color:var(--green); background:rgba(34,197,94,.12) }
.usage-status--inactive     { color:var(--ember); background:rgba(192,57,43,.13) }

/* Dashboard editor (rendered inside shared modal body) */
.dash-editor-hint           { font-size:12px; color:var(--muted); margin:0 0 14px }
.dash-editor-list           { border:1px solid var(--border); border-radius:2px; overflow:hidden }
/* .dwt-row replaces old .dash-widget-toggle — draggable row */
.dwt-row                    { display:flex; align-items:center; gap:12px; padding:14px 16px; border-bottom:1px solid var(--border); background:var(--surface); cursor:default; transition:background .15s }
.dwt-row:last-child         { border-bottom:none }
.dwt-row:hover              { background:var(--surface2) }
.dwt-row.dw-dragging        { opacity:.35 }
.dwt-row.dw-drag-over       { box-shadow:0 -2px 0 0 var(--ember) inset; background:var(--surface2) }
.dwt-drag-handle            { color:var(--muted); cursor:grab; flex-shrink:0; line-height:0; padding:2px 4px; user-select:none }
.dwt-drag-handle:active     { cursor:grabbing }
.dwt-info                   { flex:1; min-width:0 }
.dwt-label                  { font-size:13px; font-weight:600; color:var(--text); margin-bottom:3px }
.dwt-desc                   { font-size:11px; color:var(--muted); line-height:1.4 }
.dwt-switch                 { position:relative; flex-shrink:0 }
.dwt-switch input[type=checkbox] { opacity:0; width:0; height:0; position:absolute }
.dwt-track                  { display:block; width:40px; height:22px; background:var(--surface3); border-radius:11px; position:relative; transition:background .2s; cursor:pointer }
.dwt-switch input:checked + .dwt-track { background:var(--ember) }
.dwt-track::after           { content:''; position:absolute; top:3px; left:3px; width:16px; height:16px; background:#fff; border-radius:50%; box-shadow:0 1px 3px rgba(0,0,0,.25); transition:transform .2s }
.dwt-switch input:checked + .dwt-track::after { transform:translateX(18px) }
/* Admin default-layout row at bottom of editor */
.dash-editor-admin-section  { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:14px; padding-top:12px; border-top:1px solid var(--border) }
.dash-editor-admin-label    { font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--muted); flex-shrink:0 }
.dash-editor-admin-btns     { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end }
.dash-editor-reset-btn      { color:var(--ember)!important; border-color:var(--ember)!important }
.dash-header-actions        { display:flex; align-items:center; justify-content:flex-end; gap:8px; flex-wrap:wrap }
.digest-email-note          { margin-bottom:14px; padding:10px 12px; border:1px solid var(--border); background:var(--surface2); color:var(--text-muted); font-size:12px }
.digest-email-note strong   { color:var(--text) }
.digest-enable-row          { display:flex; align-items:center; gap:9px; margin-bottom:14px; font-size:13px; font-weight:600; color:var(--text); cursor:pointer }
.digest-enable-row input    { width:17px; height:17px; accent-color:var(--ember) }
.digest-schedule-grid       { grid-template-columns:minmax(0,1fr) minmax(180px,1.35fr) minmax(0,1fr); align-items:start }
.digest-weekday-group       { min-width:0; margin:0; padding:0; border:0 }
.digest-weekday-list        { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); border:1px solid var(--border); background:var(--surface) }
.digest-weekday-option      { display:flex; align-items:center; gap:7px; min-height:32px; padding:5px 8px; border-bottom:1px solid var(--border); font-size:11px; color:var(--text); cursor:pointer }
.digest-weekday-option:nth-child(odd) { border-right:1px solid var(--border) }
.digest-weekday-option:nth-last-child(-n+2) { border-bottom:0 }
.digest-weekday-option input { width:15px; height:15px; margin:0; accent-color:var(--ember) }
.digest-section-label       { margin:15px 0 7px }
.digest-view-list           { border:1px solid var(--border); background:var(--surface); max-height:220px; overflow-y:auto }
.digest-view-row            { display:flex; align-items:center; gap:10px; min-height:42px; padding:9px 12px; border-bottom:1px solid var(--border); font-size:12px; color:var(--text); cursor:pointer }
.digest-view-row:last-child { border-bottom:0 }
.digest-view-row input      { width:16px; height:16px; accent-color:var(--ember) }
.digest-last-run            { margin-top:10px; font-size:10px; color:var(--text-muted) }

/* ═══════════════════════════════════════════════════════
   ■ MOBILE — HAMBURGER NAV  +  FULL RESPONSIVE PASS
═══════════════════════════════════════════════════════ */

/* ── Hamburger button (hidden on desktop, shown by media query above) ── */
.pub-ham-btn{
  flex-direction:column;justify-content:center;
  gap:5px;padding:8px;background:none;border:none;cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.pub-ham-btn span{display:block;width:22px;height:2px;background:var(--text);border-radius:1px;transition:all .25s}
.pub-ham-btn.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.pub-ham-btn.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.pub-ham-btn.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ── Mobile nav dropdown ── */
#pub-mob-nav{
  display:none;
  position:fixed;top:60px;left:0;right:0;z-index:99;
  background:var(--surface);border-bottom:2px solid var(--accent);
  box-shadow:0 8px 24px rgba(0,0,0,.18);
  padding:6px 0 14px;
}
#pub-mob-nav.open{display:block;animation:mobNavIn .2s ease}
@keyframes mobNavIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
.pub-mob-nav-link{
  display:block;padding:13px clamp(16px,5vw,32px);
  font-size:14px;font-weight:500;color:var(--text2);
  cursor:pointer;border-left:3px solid transparent;
  transition:all .15s;-webkit-tap-highlight-color:transparent;
}
.pub-mob-nav-link:hover,.pub-mob-nav-link.active{
  color:var(--text);border-left-color:var(--accent);background:var(--surface2);
}
.pub-mob-nav-divider{height:1px;background:var(--border);margin:6px clamp(16px,5vw,32px)}
.pub-mob-login-btn{
  display:block;margin:8px clamp(16px,5vw,32px) 0;
  padding:13px;background:var(--accent);color:#fff;border:none;cursor:pointer;
  font-family:'IBM Plex Mono',monospace;font-size:11px;
  letter-spacing:2px;text-transform:uppercase;border-radius:2px;
  text-align:center;width:calc(100% - 2*clamp(16px,5vw,32px));
  -webkit-tap-highlight-color:transparent;
}

/* ── Touch targets — 44px minimum on mobile ── */
@media(max-width:768px){
  .btn{min-height:44px;padding:10px 18px}
  .btn-s{min-height:36px;padding:6px 12px}
  .btn-xs{min-height:30px}
  .pnitem{height:44px}
  .pnav-group{height:52px}
  .filter-chip{padding:9px 16px;font-size:10px}
  .pub-nav-link{padding:10px 16px}
  .dash-ptitle-row{display:block}
  .dash-edit-btn{margin-top:12px;width:100%;justify-content:center}
  .exec-hero{display:block;padding:18px}
  .exec-hero h2{font-size:30px}
  .exec-hero-actions{margin-top:16px;justify-content:stretch}
  .exec-hero-actions .btn{width:100%;justify-content:center}
  .exec-kpi-grid,.exec-alert-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .exec-trend-row{grid-template-columns:1fr}
  .exec-trend-chart{height:170px;padding:16px 14px 12px}
  .fin-compare-chart{grid-template-columns:44px minmax(0,1fr);padding-left:6px;padding-right:10px}
  .fin-compare-plot{gap:5px}
  .fin-compare-value{display:none}
  .fin-status-chart{grid-template-columns:minmax(130px,160px) minmax(0,1fr);gap:18px;padding:20px 18px}
  .fin-status-donut{width:148px;height:148px}
  .ledger-trend{flex-wrap:wrap;height:auto;gap:10px}
  .ledger-trend-col{flex:1 1 30%}
  .ledger-trend-bars{height:130px}
  .ledger-feed-card{grid-template-columns:1fr}
  .ledger-feed-amounts{justify-content:flex-start}
}

/* ── kgrid: 2-col stays down to 480px, then single on very small ── */
@media(max-width:400px){
  .kgrid,.kgrid--auto{grid-template-columns:1fr}
  .exec-kpi-grid,.exec-alert-grid{grid-template-columns:1fr}
  .alert-strip{flex-direction:column}
}

/* ── Modal near-full-screen on very small screens ── */
@media(max-width:480px){
  #modal-overlay{padding:8px}
  .modal{max-width:100%;max-height:96vh}
  .modal.modal--wide{max-width:100%}
  .mbdy{padding:14px}
  .mhdr{padding:12px 14px}
  .mttl{font-size:18px}
  .fin-chart-key{gap:8px;font-size:10px}
  .fin-compare-chart{min-height:250px}
  .fin-compare-plot{height:220px}
  .fin-compare-label{overflow:visible;font-size:8px;letter-spacing:-.2px;text-overflow:clip}
  .fin-status-chart{grid-template-columns:1fr;gap:12px;min-height:0}
  .fin-status-legend{width:100%}
  .fin-client-row{grid-template-columns:28px minmax(0,1fr)}
  .fin-client-row .fin-break-amt{grid-column:2}
  .fin-client-bar{grid-column:2}
}

/* ── Toast: full-width strip on small phones ── */
@media(max-width:480px){
  #toaster{left:12px;right:12px;bottom:16px}
  .toast{max-width:100%}
}

/* ── Info panel: full width on phones ── */
@media(max-width:480px){
  #info-panel{width:100%;border-left:none;border-top:2px solid var(--accent)}
}
@media(max-width:760px){
  .audit-row{grid-template-columns:minmax(0,1fr);gap:5px;padding:12px 14px}
  .audit-lvl{justify-self:start}
  .audit-ts,.audit-user{font-size:11px}
}

/* ── Hero section on phones ── */
@media(max-width:480px){
  .hero-title{font-size:clamp(40px,13vw,64px)}
  .hero-stats{gap:20px}
  .hero-stat-val{font-size:28px}
  .hero-actions{flex-direction:column}
  .btn-primary-lg,.btn-outline-lg{width:100%;text-align:center;padding:14px}
}

/* ── Services / contact extra padding fix ── */
@media(max-width:480px){
  .services-header{padding:80px 16px 24px}
  .services-grid-wrap{padding:20px 16px}
  .services-grid{grid-template-columns:1fr}
  #pub-contact > div{padding-top:80px}
}

/* ── Emergency bar: stack on very small ── */
@media(max-width:380px){
  .emergency-bar{flex-direction:column;align-items:flex-start;gap:4px;padding:10px 16px}
}

/* ── Portal extra-small (< 380px) ── */
@media(max-width:380px){
  #portal-topbar{padding:0 12px}
  [data-state="portal"] #pmain{padding:160px 8px 20px}
  .ptitle{font-size:26px}
  .psub{font-size:10px;letter-spacing:.5px}
  .pnav-group{padding:0 6px;font-size:8px;letter-spacing:.2px}
  .pnitem{padding:0 7px;font-size:9px}
  .kval{font-size:32px}
}

/* ── Public footer stack on small phones ── */
@media(max-width:480px){
  .pub-footer{padding:32px 16px 20px}
  .footer-bottom{flex-direction:column;gap:4px;text-align:center}
}

/* ═══════════════════════════════════════════════════════════════
   CSP UTILITY CLASSES
   Replaces inline style= attributes so style-src 'unsafe-inline'
   can be removed from the Content Security Policy.
   ════════════════════════════════════════════════════════════ */

/* Initial hidden state for JS-toggled elements */
#cf-success,
#forgot-panel,
#forgot-msg,
#forgot-username-panel,
#forgot-username-msg,
#newpass-panel,
#newpass-msg,
#nq-pending-notice,
#client-modal,
#users-create-bar,
#users-th-actions,
#saf-approve-btn,
#saf-deactivate-btn { display: none; }

/* Inline SVG icon alignment */
.svg-icon-inline { vertical-align: -2px; margin-right: 5px; }

/* Safety file action button variants */
.btn-approve-action {
  background: var(--grn-glow, #dcfce7);
  border-color: var(--green, #16a34a);
  color: var(--green, #16a34a);
}
.btn-deactivate-action {
  background: #fee2e2;
  border-color: #dc2626;
  color: #dc2626;
}

/* Quote line item column widths */
.li-qty   { width: 60px; }
.li-price { width: 90px; }
.li-total { font-size: 11px; }

/* Statement panel states */
.statement-record-list{padding:0}
.statement-record-summary{grid-template-columns:minmax(0,1.3fr) minmax(0,.8fr) minmax(0,.55fr) minmax(0,.85fr) minmax(0,.7fr)}
.statement-record-detail{grid-template-columns:repeat(5,minmax(0,1fr))}
.statement-record-card .calllog-actions{border-top:1px solid var(--border)}
.stmt-company-select{width:min(280px,100%)}
@media(max-width:900px){
  .statement-record-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  .statement-record-summary .template-field-primary{grid-column:1/-1}
  .statement-record-detail{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stmt-gen-row{align-items:stretch;flex-wrap:wrap}
  .stmt-gen-txt{flex-basis:100%}
}
@media(max-width:560px){
  .statement-record-summary,.statement-record-detail{grid-template-columns:1fr}
  .statement-record-summary .template-field-primary{grid-column:auto}
  .statement-record-card .calllog-actions .bgrp{display:grid;grid-template-columns:1fr;width:100%}
  .statement-record-card .calllog-actions .btn{width:100%;justify-content:center}
  .stmt-company-select,.stmt-gen-btn{width:100%}
}
.stmt-loading {
  text-align: center;
  padding: 32px;
  color: var(--muted);
  font-style: italic;
}
.stmt-error { padding: 16px; color: var(--pill-ovr-txt); }

/* Table empty state cell */
.tbl-empty-cell { text-align: center; color: var(--muted); }

/* Safety file empty state icon */
.empty-icon-lg { font-size: 40px; margin-bottom: 8px; }

/* Audit table column widths */
.col-num    { width: 36px; }
.col-ref    { width: 60px; }
.col-status { width: 130px; }
/* Safety audit form column widths */
.col-na   { width: 60px; }
.col-nts  { width: 100px; }
.col-ts   { width: 80px; }
.col-apo  { width: 130px; }
.col-cmt  { width: 180px; }
.col-docs { width: 70px; }

/* ═══════════════════════════════════════════════════════
   UTILITY CLASSES — CSP-compliant replacements for inline styles
═══════════════════════════════════════════════════════ */

/* Visibility */
.d-none { display:none !important }

/* Typography */
.fs-9  { font-size:9px }
.fs-10 { font-size:10px }
.fs-11 { font-size:11px }
.fs-12 { font-size:12px }
.fs-13 { font-size:13px }
.fs-15 { font-size:15px }
.fs-18 { font-size:18px }
.fs-22 { font-size:22px }
.fs-32 { font-size:32px }
.fw-600 { font-weight:600 }
.fw-700 { font-weight:700 }
.text-muted  { color:var(--muted) }
.text-accent { color:var(--accent) }
.text-warn   { color:var(--warn) }
.text-ok     { color:var(--pill-paid-txt) }
.text-ovr    { color:var(--pill-ovr-txt) }
.text-ember  { color:var(--ember) }
.text-amber  { color:var(--amber) }
.text-ok     { color:var(--pill-paid-txt) }
.text-ovr    { color:var(--pill-ovr-txt) }
.text-center { text-align:center }
.font-mono   { font-family:'IBM Plex Mono',monospace }
.italic      { font-style:italic }
.tt-upper    { text-transform:uppercase }
.nowrap      { white-space:nowrap }
.ls-08       { letter-spacing:.08em }
.ls-1        { letter-spacing:1px }
.ls-3        { letter-spacing:3px }
.ellipsis    { white-space:nowrap;overflow:hidden;text-overflow:ellipsis }
.fs-sm       { font-size:.88rem }
.td-none     { text-decoration:none }

/* Spacing */
.mb-3  { margin-bottom:3px }
.mb-4  { margin-bottom:4px }
.mb-5  { margin-bottom:5px }
.mb-6  { margin-bottom:6px }
.mb-8  { margin-bottom:8px }
.mb-12 { margin-bottom:12px }
.mb-14 { margin-bottom:14px }
.mb-16 { margin-bottom:16px }
.mb-16 { margin-bottom:16px }
.mb-20 { margin-bottom:20px }
.mt-10 { margin-top:10px }
.mt-3  { margin-top:3px }
.mt-4  { margin-top:4px }
.mt-8  { margin-top:8px }
.ml-16 { margin-left:16px }
.mr-8  { margin-right:8px }
.p-8-10  { padding:8px 10px }
.p-8-16  { padding:8px 16px }
.p-14    { padding:14px }
.p-16    { padding:16px }
.p-18    { padding:18px }
.p-20    { padding:20px }
.p-24    { padding:24px }
.pt-12   { padding-top:12px }

/* Layout */
.flex-col { display:flex;flex-direction:column }
.flex-row { display:flex;align-items:center }
.flex-sb  { display:flex;justify-content:space-between;align-items:center }
.flex-1   { flex:1;min-width:0 }
.flex-wrap { flex-wrap:wrap }
.gap-8    { gap:8px }
.gap-10   { gap:10px }
.gap-12   { gap:12px }
.flex-end { display:flex;justify-content:flex-end }
.mt-18    { margin-top:18px }
.h-78vh   { height:78vh }

/* Borders / surfaces */
.brd       { border:1px solid var(--border) }
.brd-t     { border-top:1px solid var(--border) }
.brd-r2    { border-radius:2px }
.brd-r3    { border-radius:3px }
.brd-r10   { border-radius:10px }
.bg-s2     { background:var(--surface2) }
.bg-s3     { background:var(--surface3) }
.bg-grn    { background:var(--grn-glow);border-color:var(--green);color:var(--pill-paid-txt) }
.bg-emb    { background:var(--emb-glow);border-color:var(--ember);color:var(--pill-ovr-txt) }

/* Attachment modal */
.att-ctx  { padding:8px 10px;background:var(--surface2);border:1px solid var(--border);border-radius:2px;margin-bottom:12px;font-size:11px }
.upgrade-call-copy{border:1px solid var(--border);background:var(--surface2);padding:12px 14px;margin-bottom:12px;font-size:13px;line-height:1.55;color:var(--text2)}
.upgrade-call-copy p{margin:0 0 8px}
.upgrade-call-copy p:last-child{margin-bottom:0}
.att-slbl { font-family:'IBM Plex Mono',monospace;font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:8px }
.att-row  { display:flex;align-items:center;gap:8px;padding:8px 10px;background:var(--surface2);border:1px solid var(--border);border-radius:2px;margin-bottom:6px }
.att-icon { font-size:18px }
.att-info { flex:1;min-width:0 }
.att-name { font-size:12px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis }
.att-meta { font-size:10px;color:var(--muted) }
.att-empty{ font-size:11px;color:var(--muted);font-style:italic;margin-bottom:8px }
.att-upsec{ padding-top:12px;border-top:1px solid var(--border) }
.att-uprow{ display:flex;gap:8px;align-items:center;flex-wrap:wrap }
.att-finp { flex:1;min-width:0;font-size:11px;padding:6px;background:var(--surface2);border:1px solid var(--border);border-radius:2px;color:var(--text) }
.att-fhint{ font-size:10px;color:var(--muted);margin-top:4px }
.att-del  { color:var(--ember) }

/* Document viewer modal */
.dv-wrap   { display:flex;flex-direction:column;height:78vh }
.dv-hdr    { display:flex;justify-content:space-between;align-items:center;margin-bottom:8px }
.dv-name   { font-size:11px;color:var(--muted);font-family:'IBM Plex Mono',monospace }
.dv-iframe { flex:1;width:100%;border:1px solid var(--border);border-radius:2px;background:#fff }
.dv-img    { max-width:100%;max-height:70vh;border:1px solid var(--border);border-radius:2px }
.dv-unsup  { padding:24px;text-align:center;color:var(--muted) }

/* Section label (monospace) */
.mlbl-xs  { font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:1px }
.mlbl-sm  { font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:700;color:var(--text) }
.mlbl-9   { font-family:'IBM Plex Mono',monospace;font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted) }

/* Dashboard KPI */
.kcard-cats-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px }
.kcard-amber { border-top:2px solid var(--amber);cursor:pointer }
.kcard-ember { border-top-color:var(--ember) }
.kcard-blue  { border-top-color:var(--blue) }
.kcard-green { border-top-color:var(--green) }
.kval-ember  { color:var(--pill-ovr-txt) }
.kval-paid   { color:var(--pill-paid-txt) }
.kval-18     { font-size:18px }

/* Period Comparison widget */
.pcomp-grid        { display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px }
.pcomp-card        { background:var(--surface2);border:1px solid var(--border);border-radius:2px;padding:14px 16px }
.pcomp-title       { font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--muted);letter-spacing:2px;text-transform:uppercase;margin-bottom:8px }
.pcomp-main        { display:flex;align-items:baseline;gap:10px;margin-bottom:6px }
.pcomp-val         { font-family:'Big Shoulders Display',sans-serif;font-size:28px;font-weight:900;color:var(--text);letter-spacing:-.2px }
.pcomp-delta       { font-family:'IBM Plex Mono',monospace;font-size:12px;font-weight:700;padding:2px 6px;border-radius:3px;white-space:nowrap }
.pcomp-delta--up   { color:#22c55e;background:rgba(34,197,94,.12) }
.pcomp-delta--down { color:var(--ember);background:rgba(192,57,43,.12) }
.pcomp-delta--flat { color:var(--muted);background:var(--surface3) }
.pcomp-footer      { font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--muted) }
.pcomp-footer strong { color:var(--text) }
.ph-badge          { font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--muted);background:var(--surface2);border:1px solid var(--border);border-radius:10px;padding:2px 8px;letter-spacing:1px }

/* Progress / chart */
.prog-bar  { height:5px;background:var(--surface3);border-radius:3px }
.prog-fill { height:5px;border-radius:3px;transition:width .4s }

/* Compliance badges */
.badge-ovr  { font-size:10px;font-weight:700;padding:2px 7px;border-radius:10px;background:rgba(192,57,43,.15);color:var(--ember);text-transform:uppercase }
.badge-soon { font-size:10px;font-weight:700;padding:2px 7px;border-radius:10px;background:rgba(240,120,32,.12);color:var(--amber);text-transform:uppercase }

/* Table cells */
.max-180 { max-width:180px;overflow:hidden;text-overflow:ellipsis }
.mt-2    { margin-top:2px }
.tc-11  { font-size:11px }
.tc-12  { font-size:12px }
.tc-13  { font-size:13px }
.tc-15  { font-size:15px }
.tc-trunc { font-size:12px;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap }
.tc-empty { text-align:center;padding:20px;color:var(--muted);font-style:italic }
.tc-empty-sm { text-align:center;padding:16px;color:var(--muted);font-style:italic }
.tc-empty-xs { text-align:center;padding:14px;color:var(--muted);font-style:italic }

/* Brand block (about/services dash) */
.brand-eyebrow { font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--ember);letter-spacing:3px;margin-bottom:5px }
.brand-display { font-family:'Big Shoulders Display',sans-serif;font-size:18px;font-weight:700 }
.brand-sub     { font-size:11px;color:var(--muted);margin-top:3px }

/* Dashboard section actions row */
.dash-acts { display:flex;gap:10px;flex-wrap:wrap }
.mt-12  { margin-top:12px }
.w-full { width:100% }

/* Invoice / doc preview */
.doc-contact { text-align:right;font-size:11px;color:#7A7566 }
.qte-pending-warn { padding:8px 12px;background:#fff3e0;border-left:3px solid #E67E22;margin-bottom:14px;font-size:11px;color:#E67E22 }
.inv-att-area { margin-top:16px;padding-top:16px;border-top:1px solid var(--border) }
.more-items{ text-align:center;padding:8px 16px;font-size:11px;color:var(--muted) }

/* Chart bars wraps */
.cbar-brand-wrap { padding:18px;background:var(--surface2);border:1px solid var(--border);border-radius:2px;text-align:center }

/* Income / P&L statement */
.pl-sec-lbl  { background:var(--surface2);padding:8px 16px;font-family:'IBM Plex Mono',monospace;font-size:8px;color:var(--muted);letter-spacing:2px;text-transform:uppercase }
.pl-row      { display:flex;justify-content:space-between }
.pl-row-val  { padding:10px 16px;border-bottom:1px solid var(--border);font-size:12px }
.pl-row-gross{ padding:12px 16px;font-size:13px;font-weight:600;border-top:1px solid var(--border) }
.pl-row-tax  { padding:10px 16px;font-size:12px;border-top:1px solid var(--border) }
.pl-row-net  { padding:14px 16px;font-size:14px;font-weight:700 }
.pl-net-pos  { border-top:2px solid var(--green);background:var(--grn-glow);color:var(--pill-paid-txt) }
.pl-net-neg  { border-top:2px solid var(--ember);background:var(--emb-glow);color:var(--pill-ovr-txt) }
.pl-row-empty{ padding:10px 16px;font-size:12px;color:var(--muted);font-style:italic }

/* Statement panel */
.stmt-kgrid  { display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:18px }
.stmt-kcard  { background:var(--surface);border:1px solid var(--border);padding:14px;border-radius:2px }
.stmt-klbl   { font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:1.5px;margin-bottom:4px }
.stmt-kval   { font-family:'Big Shoulders Display',sans-serif;font-size:26px;font-weight:700 }
.stmt-slbl   { font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--muted);letter-spacing:2px;margin-bottom:8px }
.stmt-pcard  { border:1px solid var(--amber);background:var(--amb-glow);border-radius:2px;padding:14px;margin-bottom:10px }
.stmt-pcrd-hdr { display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px }
.stmt-pcrd-ref { font-family:'IBM Plex Mono',monospace;font-size:10px;font-weight:600;color:var(--amber) }
.stmt-pcrd-sub { font-size:11px;color:var(--muted);margin-top:2px }
.stmt-pcrd-actions { display:flex;align-items:center;gap:8px;flex-shrink:0 }
.stmt-row-actions  { display:flex;align-items:center;gap:6px;white-space:nowrap }
.stmt-tbl-wrap { max-height:360px;overflow-y:auto }
.stmt-gen-row  { margin-bottom:18px;padding:12px;background:var(--surface2);border:1px solid var(--border);border-radius:2px;display:flex;justify-content:space-between;align-items:center }
.stmt-gen-txt  { font-size:14px;color:var(--text2) }
.stmt-gen-btn  { white-space:nowrap;margin-left:16px }
.stmt-mb18     { margin-bottom:18px }

/* Payment selection */
.pay-inv-row   { display:flex;align-items:center;gap:10px;padding:10px;border:1px solid var(--border);border-radius:2px;cursor:pointer;margin-bottom:6px;background:var(--surface2) }
.pay-inv-cb    { accent-color:var(--accent);width:16px;height:16px;flex-shrink:0 }
.pay-inv-info  { flex:1 }
.pay-inv-empty { color:var(--muted);font-style:italic;font-size:12px;padding:10px }

/* User management */
.row-inactive { opacity:0.5 }
.btn-enable { background:var(--pill-ok-bg);color:var(--pill-ok-txt);border:none;border-radius:4px;padding:2px 8px;cursor:pointer }
/* Multi-role checkbox grid in user create/edit modals */
.roles-cb-grid { display:flex;flex-wrap:wrap;gap:6px 16px;padding:6px 0 }
.role-cb-item  { display:flex;align-items:center;gap:5px;font-size:13px;cursor:pointer;white-space:nowrap }
.role-cb-item input[type=checkbox] { accent-color:var(--accent,#c0392b);width:14px;height:14px;cursor:pointer }

/* Misc form helpers */
.inp-readonly { opacity:0.6 }
.pass-hint    { opacity:0.6;font-size:11px }

/* Closure confirmation warning banner */
.closure-warn { padding:12px;background:var(--emb-glow);border:1px solid rgba(192,57,43,.3);border-radius:2px }
.btn-remove-person { background:#fee2e2;border-color:#dc2626;color:#dc2626 }

/* Safety audit form */
.saf-ap-sel { width:100px }

/* Safety detail */
.saf-sec-act  { display:flex;flex-wrap:wrap;gap:8px;padding:8px 12px;border-top:1px solid var(--border) }
.saf-no-att   { font-size:12px;color:var(--muted);font-style:italic }
.saf-ro-note  { font-size:11px;color:var(--muted);font-style:italic }
.suggest-hint { font-size:11px;color:var(--muted);margin-bottom:6px }
.ro-note      { font-size:11px;color:var(--muted);font-style:italic }

/* ── Client status badges ── */
.badge           { display:inline-block;font-size:10px;font-weight:700;padding:2px 8px;border-radius:10px;text-transform:uppercase;letter-spacing:.03em }
.badge-ok        { background:rgba(22,163,74,.12);color:#16a34a }
.badge-grey      { background:rgba(100,116,139,.12);color:var(--muted) }

/* ── Client table contact cell ── */
.cc-name  { font-size:13px;font-weight:500;line-height:1.3 }
.cc-email { font-size:11px;color:var(--muted) }
.cc-more  { font-size:10px;color:var(--accent);margin-top:1px }
.td-muted { color:var(--muted);font-style:italic }

/* ── Client contacts sub-section in modal ── */
.cm-contacts-section { margin-top:18px;border-top:1px solid var(--border);padding-top:14px }
.cm-contacts-hdr     { display:flex;align-items:center;justify-content:space-between;margin-bottom:10px }
.cm-no-contacts      { font-size:12px;color:var(--muted);font-style:italic;margin:0 }
.cm-contact-row      { display:grid;grid-template-columns:1fr 1.4fr 0.8fr 0.8fr auto auto;gap:8px;align-items:center;margin-bottom:8px }
.cm-primary-lbl      { display:flex;align-items:center;gap:4px;font-size:12px;white-space:nowrap;cursor:pointer }
@media(max-width:700px){
  .cm-contact-row { grid-template-columns:1fr 1fr; }
  .cm-primary-lbl,.cm-contact-row .btn-d { grid-column:span 2 }
}

/* ── User Signatures ──────────────────────────────────────── */
.sig-badge {
  display:inline-block;width:7px;height:7px;
  background:#22c55e;border-radius:50%;
  margin-left:5px;vertical-align:middle;
}
.sig-section {
  margin-top:20px;padding-top:16px;
  border-top:1px solid var(--border);
}
.sig-section-title {
  font-size:10px;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted);margin-bottom:10px;
}
.sig-preview-box {
  display:inline-block;max-width:100%;
  padding:10px 18px;border-radius:6px;
  border:1px solid var(--border);
  background:repeating-conic-gradient(#d4d4d0 0% 25%,#fff 0% 50%) 0 0/16px 16px;
}
.sig-img { display:block;max-width:100%;max-height:100px;object-fit:contain }
.sig-meta { font-size:11px;color:var(--muted);margin-top:5px }
.sig-current-wrap { margin-bottom:10px }
.sig-upload-row { display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:6px }
.sig-upload-btn { cursor:pointer }
.sig-hint { font-size:11px;color:var(--muted) }
.sig-new-wrap { margin-top:10px }
.sig-new-actions { display:flex;gap:8px;margin-top:8px;align-items:center }
.sig-as-notice {
  background:#fff7ed;border:1px solid #f97316;border-radius:6px;
  padding:10px 12px;font-size:12px;color:#7c2d12;margin-bottom:14px;
}
.btn-warn { background:var(--ember,#c0392b) }

/* ── CSP-safe utility classes (no inline styles in JS/HTML) ── */
.d-none  { display: none         !important; }
.d-block { display: block        !important; }
.d-flex  { display: flex         !important; }
.d-iflex { display: inline-flex  !important; }
.d-tcell { display: table-cell   !important; }
.invis   { visibility: hidden; }

/* Dynamic state feedback */
.msg--ok  { background: var(--grn-glow); border-color: rgba(26,122,64,.3); color: var(--pill-paid-txt); }
.msg--err { background: var(--emb-glow); border-color: rgba(192,57,43,.3); color: var(--pill-ovr-txt); }
.net--pos { color: var(--pill-paid-txt); }
.net--neg { color: var(--pill-ovr-txt); }

/* HTML-template inline-style replacements */
.btn-evidence-warn { background: #f97316 !important; color: #fff !important; border-color: #f97316 !important; }
.kgrid-neg-top   { margin-top: -6px; }
.mlbl-section-top { display: block; margin-bottom: 10px; }
.mlbl-section-mid { display: block; margin: 14px 0 10px; }
.fgrid-narrow    { max-width: 480px; }
.panel-warn-top  { border-top: 2px solid var(--pill-ovr); }
.td-dupe-count   { color: var(--pill-ovr-txt); font-weight: bold; }
.tr-dupe         { background: rgba(244,67,54,.08); }
.span-dup        { color: var(--pill-ovr-txt); font-size: 10px; }
.td-ref-sm       { font-size: 11px; }
.sumbox-flush    { margin: 0; }
.recon-msg       { margin-top: 8px; font-size: 12px; color: var(--text-muted); }
.upload-item-row  { display: flex; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--border); }
.upload-item-name { flex: 1; font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.upload-item-size { font-size: 10px; color: var(--muted); }
.upload-list-body { margin-top: 10px; max-height: 320px; overflow-y: auto; }
.modal-actions-row { margin-top: 14px; text-align: right; }
.finput-readonly  { background: #f5f5f5; color: #666; cursor: default; }
.saf-rename-box--docs { max-width: 480px; width: 92vw; }

.is-hidden{display:none!important}
.v3-topbar-actions{display:flex;gap:12px;align-items:center}
.wiz-field-spaced{margin-bottom:14px}
.wiz-done-copy{color:var(--ink-2);font-size:15px}
.about-visual,.section-content{position:relative}
.section-content{z-index:1}
.float-badge-experience{right:-14px;bottom:26px}
.float-badge-psira{left:-14px;top:26px}
.float-badge-code{font-size:14px}
.about-title{font-family:var(--f-disp);font-weight:800;text-transform:uppercase;font-size:clamp(32px,4.2vw,50px);line-height:1.03;color:var(--ink)}
.about-copy{margin-top:18px;color:var(--ink-2);font-size:16.5px}
.sec-head-centered{text-align:center;margin:0 auto}
.eyebrow-centered{justify-content:center}
.heading-centered{margin:0 auto}
.foot-logo{height:52px;width:auto}
.foot-portal-link{margin-top:18px;display:block;cursor:pointer;color:var(--gold);font-family:var(--f-mono);font-size:13px;letter-spacing:.14em}
.band-flush{margin-top:0}
.btn-icon-leading{vertical-align:middle;margin-right:4px}
.rv-delay-0{transition-delay:0ms!important}
.rv-delay-1{transition-delay:60ms!important}
.rv-delay-2{transition-delay:120ms!important}
.rv-delay-3{transition-delay:180ms!important}
.rv-delay-4{transition-delay:240ms!important}
.rv-delay-5{transition-delay:300ms!important}

/* ── Record Chain Modal ──────────────────────────────── */
.record-chain{display:flex;flex-direction:column;gap:12px}
.chain-filter{display:flex;justify-content:flex-end;margin-bottom:8px}
.chain-section{border:1px solid var(--border);border-radius:4px;overflow:hidden}
.chain-hdr{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--surface2);border-bottom:1px solid var(--border)}
.chain-icon{width:22px;height:22px;border-radius:50%;background:var(--accent);color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.chain-ttl{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted)}
.chain-body{padding:12px 14px;font-size:12px;display:flex;flex-direction:column;gap:4px}
.chain-meta-row{display:flex;gap:8px;align-items:baseline}
.chain-lbl{min-width:90px;font-size:10px;color:var(--text-muted);flex-shrink:0}
.chain-val{color:var(--text);word-break:break-word}
.chain-items-t{width:100%;border-collapse:collapse;font-size:11px;margin-top:8px}
.chain-items-t th{background:var(--surface2);padding:4px 8px;font-weight:600;font-size:10px;text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid var(--border);color:var(--text-muted)}
.chain-items-t td{padding:4px 8px;border-bottom:1px solid var(--border)}
.chain-items-t tfoot td{font-size:11px;background:var(--surface2);border-top:2px solid var(--border)}
.chain-items-t .tar{text-align:right}
.chain-items-t--library{margin-top:0}
.item-library-toolbar{position:sticky;top:0;z-index:2;margin:-22px -22px 12px;padding:16px 22px 14px;background:linear-gradient(to bottom,var(--surface) 0%,var(--surface) 82%,color-mix(in srgb,var(--surface) 92%,transparent) 100%);border-bottom:1px solid var(--border);box-shadow:0 8px 18px rgba(0,0,0,.04)}
.item-library-toolbar-top{display:flex;flex-direction:column;gap:6px}
.item-library-toolbar-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;margin-top:10px}

/* ── Company Tracker ─────────────────────────────────────────── */
.pnav-inline{display:flex;align-items:center;gap:4px;flex:1}
.pnav-inline .pnitem{height:auto;padding:6px 14px;font-size:12px;border-bottom:2px solid transparent}
.pnav-inline .pnav-btn{
  appearance:none;border:0;border-bottom:2px solid transparent;background:transparent;color:var(--muted);
  display:flex;align-items:center;height:32px;padding:0 14px;cursor:pointer;
  font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.5px;text-transform:uppercase;
  white-space:nowrap;transition:all .15s;flex-shrink:0;
}
.pnav-inline .pnav-btn:hover{color:var(--text);border-bottom-color:var(--amber)}
.pnav-inline .pnav-btn.active{color:var(--accent);border-bottom-color:var(--accent);background:var(--amb-glow)}
.ops-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:12px}
.ops-mini-card{border:1px solid var(--border);background:var(--surface);border-radius:8px;padding:12px;min-height:88px;display:flex;flex-direction:column;justify-content:space-between}
.ops-mini-card span{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted)}
.ops-mini-card strong{font-size:26px;line-height:1;color:var(--text)}
.ops-mini-card em{font-size:11px;font-style:normal;color:var(--text-muted)}
.ops-task-list{display:flex;flex-direction:column;gap:10px}
.ops-task-card{border:1px solid var(--border);background:var(--surface2);border-radius:8px;padding:12px;min-height:96px}
.ops-task-card--action{min-height:136px}
.ops-task-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.ops-task-title{font-size:14px;font-weight:700;color:var(--text);line-height:1.35;word-break:break-word}
.ops-task-meta{margin-top:6px;font-size:11px;color:var(--text-muted);line-height:1.45}
.ops-task-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.ops-load-row{display:grid;grid-template-columns:minmax(110px,180px) 1fr;gap:12px;align-items:center;margin-bottom:12px}
.ops-load-row strong{display:block;font-size:12px;color:var(--text)}
.ops-load-row span{display:block;margin-top:2px;font-size:10px;color:var(--text-muted)}
.ops-load-statuses{display:flex;flex-wrap:wrap;gap:5px;margin-top:5px}
.ops-load-row .ops-load-status{display:inline-flex;align-items:center;gap:4px;width:auto;margin:0;padding:2px 7px;border-radius:10px;font-size:9px;font-style:normal;font-weight:600;line-height:1.4}
.ops-load-status b{font-size:10px}

/* Priority dots */
.prio-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:4px;vertical-align:middle}
.bg-muted  {background:var(--muted)}
.bg-info   {background:var(--blue)}
.bg-warn   {background:var(--warn)}
.bg-danger {background:var(--ember)}

/* Task status badges */
.badge-open      {background:rgba(59,130,246,.12);color:var(--blue)}
.badge-inprog    {background:rgba(240,120,32,.12);color:var(--amber)}
.badge-done      {background:rgba(22,163,74,.12);color:#16a34a}
.badge-cancelled {background:rgba(100,116,139,.12);color:var(--muted)}

/* Soft danger button (for delete) */
.btn-danger-soft{color:var(--ember);border:1px solid rgba(192,57,43,.3);background:rgba(192,57,43,.06)}
.btn-danger-soft:hover{background:var(--ember);color:#fff}

/* Table helpers */
.act-cell  {white-space:nowrap}
.td-main   {max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.empty-row {text-align:center;padding:32px;color:var(--muted);font-size:13px}

/* Layout utilities used in tracker */
.gap1{gap:8px}
.mr1{margin-right:8px}
.fgroup-full{grid-column:1/-1}
@media(max-width:768px){
  .ops-summary-grid{grid-template-columns:1fr 1fr}
  .ops-load-row{grid-template-columns:1fr}
  .digest-schedule-grid{grid-template-columns:1fr}
  .ops-task-actions .btn{min-height:38px}
}
@media(max-width:480px){
  .ops-summary-grid{grid-template-columns:1fr}
  .pnav-inline{overflow-x:auto}
  .pnav-inline .pnitem{min-height:40px}
}

/* ═══════════════════════════════════════════════════════
   P&L LEDGER STYLES
═══════════════════════════════════════════════════════ */
.pl-legend{font-size:11px;color:var(--muted);background:var(--surface2);border:1px solid var(--border);border-radius:6px;padding:8px 12px;margin-bottom:12px;line-height:1.5}
.kgrid--3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.kgrid--4{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.badge-warn{display:inline-block;font-size:10px;font-weight:700;padding:2px 8px;border-radius:10px;text-transform:uppercase;background:rgba(240,120,32,.12);color:var(--amber)}
.badge-muted{display:inline-block;font-size:10px;font-weight:700;padding:2px 8px;border-radius:10px;text-transform:uppercase;background:rgba(100,116,139,.12);color:var(--muted)}
.tfoot-total td{font-weight:700;background:var(--surface2);border-top:2px solid var(--border);padding:8px 10px}
.tr-flag td{background:rgba(240,120,32,.06)}
.tw > table td.td-inv-covered{max-width:260px;min-width:180px;font-size:12px;white-space:normal;word-break:break-word}
.tw > table td.td-notes{max-width:220px;min-width:140px;font-size:11px;color:var(--amber);white-space:normal;word-break:break-word}
.mlbl-ok  {background:rgba(22,163,74,.12);color:#16a34a}
.mlbl-warn{background:rgba(240,120,32,.12);color:var(--amber)}
.cbar-neg{background:var(--ember)!important}
.cbar-cost{background:rgba(192,57,43,.35)!important;margin-top:2px}
.legend-dot{display:inline-block;width:8px;height:8px;border-radius:50%;vertical-align:middle}
.legend-ok{background:var(--accent)}
.legend-cost{background:var(--ember)}
.ml-2{margin-left:8px}
.pll-tab{display:block}
[hidden]{display:none!important}
@media(max-width:768px){.kgrid--3,.kgrid--4{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.kgrid--3,.kgrid--4{grid-template-columns:1fr}}

/* Transactions — grouped by call log */
.txg-row{cursor:pointer;user-select:none;font-weight:600}
.txg-row:hover td{background:var(--paper-raised)}
.txg-row.txg-open td{border-bottom:none}
.txg-chev{display:inline-block;width:14px;color:var(--ink-mut)}
.txg-detail-cell{padding:0!important;background:var(--paper-warm)}
#p-transactions .tw>table{width:100%;min-width:0;table-layout:fixed}
#p-transactions .tw>table th,#p-transactions .tw>table td{white-space:normal;overflow-wrap:anywhere;word-break:normal}
.txg-inner{width:100%;table-layout:fixed}
.txg-inner thead th{cursor:default}
#p-transactions .tw>table>colgroup col:nth-child(1){width:26%}
#p-transactions .tw>table>colgroup col:nth-child(2){width:11%}
#p-transactions .tw>table>colgroup col:nth-child(3){width:17%}
#p-transactions .tw>table>colgroup col:nth-child(4){width:16%}
#p-transactions .tw>table>colgroup col:nth-child(5){width:15%}
#p-transactions .tw>table>colgroup col:nth-child(6){width:15%}
.txg-inner>colgroup col:nth-child(1){width:11%}
.txg-inner>colgroup col:nth-child(2){width:29%}
.txg-inner>colgroup col:nth-child(3){width:12%}
.txg-inner>colgroup col:nth-child(4){width:15%}
.txg-inner>colgroup col:nth-child(5){width:13%}
.txg-inner>colgroup col:nth-child(6){width:10%}
.txg-inner>colgroup col:nth-child(7){width:10%}