/* Green Light Logistics LLC — operations console */
:root{
  --ink:#0d1a13; --ink-2:#33443b; --ink-3:#5a6a61; --ink-4:#7d8b83;
  --line:#e1e8e1; --line-2:#edf2ed; --line-3:#d3dcd4;
  --paper:#f4f7f3; --paper-2:#eaf1ea; --white:#fff;
  --deep:#06140e; --deep-2:#0b2219; --deep-3:#0f2f22;
  --brand:#118a4d; --brand-2:#0d6f3d; --brand-3:#e6f4ec; --green:#00a94f; --leaf:#60be44; --lime:#d9e021;
  --red:#b42318; --red-bg:#fef3f2; --red-line:#fecdca;
  --amber:#8a4a06; --amber-bg:#fff8e6; --amber-line:#fbdc8e; --amber-dot:#f0a020;
  --violet:#5b2bc4; --violet-bg:#f4f1ff; --violet-line:#ddd3fb;
  --blue:#1f4fb8; --blue-bg:#eef3ff;
  --grey:#44524a; --grey-bg:#eff2f0;
  --note:#fffbe8; --note-line:#f3e3a3;
  --r:14px; --r-s:10px; --pill:999px;
  --sh-1:0 1px 2px rgba(6,20,14,.05);
  --sh-2:0 1px 2px rgba(6,20,14,.04),0 8px 24px -12px rgba(6,20,14,.16);
  --sh-3:0 24px 64px -24px rgba(6,20,14,.42),0 2px 6px rgba(6,20,14,.06);
  --h:'Poppins',system-ui,-apple-system,'Segoe UI',sans-serif;
  --b:'Roboto',system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--b);font-size:14px;line-height:1.5;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;overflow-x:hidden;min-height:100vh}
html.lock,html.lock body{overflow:hidden}
img,svg{display:block;max-width:100%}
a{color:var(--brand)}
a:hover{color:var(--brand-2)}
h1,h2,h3,h4{font-family:var(--h);letter-spacing:-.02em;line-height:1.2;margin:0;color:var(--ink)}
p{margin:0}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
::selection{background:var(--lime);color:var(--ink)}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:fixed;left:-999px;top:8px;z-index:200;background:var(--lime);color:var(--ink);padding:8px 14px;border-radius:8px;font-weight:500;text-decoration:none}
.skip:focus{left:12px}
.mono{font-family:var(--mono);font-size:.95em;letter-spacing:-.01em}
.muted{color:var(--ink-3)}
.nowrap{white-space:nowrap}
svg.i{width:16px;height:16px;flex-shrink:0}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:36px;padding:0 14px;border-radius:var(--r-s);border:1px solid transparent;font-family:var(--h);font-weight:500;font-size:13.5px;line-height:1;white-space:nowrap;text-decoration:none;transition:background .15s,border-color .15s,color .15s,box-shadow .15s;user-select:none}
.btn svg{width:16px;height:16px}
.btn-primary{background:var(--brand);color:#fff;box-shadow:0 1px 0 rgba(255,255,255,.14) inset,0 6px 14px -8px rgba(17,138,77,.8)}
.btn-primary:hover{background:var(--brand-2);color:#fff}
.btn-lime{background:var(--lime);color:var(--deep)}
.btn-lime:hover{background:#e6ec45;color:var(--deep)}
.btn-line{background:#fff;border-color:var(--line-3);color:var(--ink)}
.btn-line:hover{border-color:var(--brand);color:var(--brand-2)}
.btn-soft{background:var(--paper-2);color:var(--ink)}
.btn-soft:hover{background:#dfeadf;color:var(--ink)}
.btn-danger{background:#fff;border-color:var(--red-line);color:var(--red)}
.btn-danger:hover{background:var(--red-bg);color:var(--red)}
.btn-wa{background:#1f9d55;color:#fff}
.btn-wa:hover{background:#17804a;color:#fff}
.btn-sm{height:30px;padding:0 10px;font-size:12.5px;border-radius:8px}
.btn-lg{height:44px;padding:0 20px;font-size:14.5px}
.btn-block{width:100%}
.btn-icon{width:36px;padding:0}
.btn-icon.btn-sm{width:30px}
.btn:disabled,.btn[aria-disabled="true"]{opacity:.5;cursor:not-allowed;box-shadow:none}
.btn-ghost{background:transparent;color:var(--ink-2)}
.btn-ghost:hover{background:var(--paper-2);color:var(--ink)}
.linkbtn{background:none;border:0;padding:0;color:var(--brand);font-weight:500;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.linkbtn:hover{color:var(--brand-2)}
.spin{width:16px;height:16px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:spin .7s linear infinite;display:inline-block;flex-shrink:0}
@keyframes spin{to{transform:rotate(360deg)}}

/* forms */
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.lbl{font-family:var(--h);font-weight:500;font-size:12.5px;color:var(--ink-2);display:flex;align-items:baseline;gap:4px}
.lbl small{font-family:var(--b);font-weight:400;color:var(--ink-3);font-size:12px;margin-left:auto;padding-left:8px}
.req{color:var(--red)}
.inp{width:100%;min-width:0;height:38px;padding:0 12px;border:1px solid var(--line-3);border-radius:var(--r-s);background:#fff;color:var(--ink);font-size:14px;transition:border-color .15s,box-shadow .15s}
textarea.inp{height:auto;min-height:96px;padding:10px 12px;line-height:1.55;resize:vertical}
select.inp{appearance:none;-webkit-appearance:none;padding-right:34px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235a6a61' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;background-size:16px}
.inp:hover{border-color:#b9c7bb}
.inp:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(17,138,77,.16)}
.inp::placeholder{color:#7d8b83}
.inp:disabled,.inp[readonly]{background:var(--paper);color:var(--ink-2)}
.field.bad .inp{border-color:var(--red);box-shadow:0 0 0 3px rgba(180,35,24,.1)}
.ferr{color:var(--red);font-size:12.5px}
.hint{color:var(--ink-3);font-size:12.5px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.span2{grid-column:span 2}
.stack{display:flex;flex-direction:column;gap:14px}
.formerr{background:var(--red-bg);border:1px solid var(--red-line);color:var(--red);padding:10px 12px;border-radius:var(--r-s);font-size:13.5px}
.formok{background:var(--brand-3);border:1px solid #bfe3cc;color:var(--brand-2);padding:10px 12px;border-radius:var(--r-s);font-size:13.5px}
.pw-wrap{position:relative}
.pw-wrap .inp{padding-right:72px}
.pw-toggle{position:absolute;right:6px;top:50%;transform:translateY(-50%);height:28px;padding:0 8px;border:0;border-radius:6px;background:transparent;color:var(--ink-3);font-size:12.5px;font-weight:500}
.pw-toggle:hover{background:var(--paper-2);color:var(--ink)}
.policy{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.policy li{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-3)}
.policy li::before{content:"";width:16px;height:16px;border-radius:50%;border:1.5px solid var(--line-3);flex-shrink:0;background:#fff}
.policy li.ok{color:var(--brand-2)}
.policy li.ok::before{border-color:var(--brand);background:var(--brand) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") center/10px no-repeat}
.seg{display:inline-flex;background:var(--paper-2);border-radius:var(--r-s);padding:3px;gap:2px}
.seg label{position:relative}
.seg input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.seg span{display:block;padding:6px 12px;border-radius:8px;font-size:13px;font-weight:500;color:var(--ink-2);font-family:var(--h);white-space:nowrap}
.seg input:checked+span{background:#fff;color:var(--ink);box-shadow:var(--sh-1)}
.seg input:focus-visible+span{outline:2px solid var(--brand);outline-offset:1px}
.radios{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.radio{position:relative;display:flex}
.radio input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.radio span{flex:1;display:flex;flex-direction:column;gap:2px;padding:10px 12px;border:1px solid var(--line-3);border-radius:var(--r-s);font-weight:500;font-family:var(--h);font-size:13.5px}
.radio small{font-family:var(--b);font-weight:400;color:var(--ink-3);font-size:12px}
.radio input:checked+span{border-color:var(--brand);background:var(--brand-3);box-shadow:0 0 0 1px var(--brand) inset}
.radio input:focus-visible+span{outline:2px solid var(--brand);outline-offset:2px}
.check{display:flex;align-items:center;gap:10px;font-size:14px;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r-s);cursor:pointer}
.check input{width:16px;height:16px;accent-color:var(--brand);margin:0}
.check:hover{border-color:var(--line-3)}
.check small{color:var(--ink-3);margin-left:auto;font-size:12px}

/* chips, pills, badges */
.pri{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 9px 0 8px;border-radius:var(--pill);font-size:12px;font-weight:500;white-space:nowrap;border:1px solid transparent}
.pri::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.pri-urgent{background:var(--red-bg);color:var(--red);border-color:var(--red-line)}
.pri-high{background:#fff4ea;color:#9a3d06;border-color:#fcd9bd}
.pri-medium{background:var(--blue-bg);color:var(--blue);border-color:#d4e0fb}
.pri-low{background:var(--grey-bg);color:var(--grey);border-color:#e0e6e2}
.st{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:500;white-space:nowrap;color:var(--ink-2)}
.st::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--grey);box-shadow:0 0 0 3px rgba(68,82,74,.12)}
.st-open::before{background:var(--green);box-shadow:0 0 0 3px rgba(0,169,79,.16)}
.st-waiting::before{background:var(--amber-dot);box-shadow:0 0 0 3px rgba(240,160,32,.18)}
.st-resolved::before{background:#7a4fe0;box-shadow:0 0 0 3px rgba(122,79,224,.16)}
.st-closed::before{background:#8a978f;box-shadow:0 0 0 3px rgba(138,151,143,.16)}
.chip{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:var(--pill);font-size:12.5px;font-weight:500;white-space:nowrap;background:var(--grey-bg);color:var(--grey)}
.chip.st::before{box-shadow:none;width:7px;height:7px}
.chip.st-open{background:var(--brand-3);color:var(--brand-2)}
.chip.st-waiting{background:var(--amber-bg);color:var(--amber)}
.chip.st-resolved{background:var(--violet-bg);color:var(--violet)}
.chip.st-closed{background:var(--grey-bg);color:var(--grey)}
.chip svg{width:14px;height:14px}
.badge{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 8px;border-radius:6px;background:var(--paper);border:1px solid var(--line);font-size:12px;color:var(--ink-2);white-space:nowrap;max-width:100%}
.badge svg{width:13px;height:13px;color:var(--ink-3)}
.role{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:6px;font-size:12px;font-weight:500;background:var(--paper-2);color:var(--ink-2)}
.role-admin{background:var(--deep);color:var(--lime)}
.role-reviewer{background:var(--violet-bg);color:var(--violet)}
.av{width:28px;height:28px;border-radius:50%;display:inline-grid;place-items:center;font-family:var(--h);font-weight:600;font-size:11px;letter-spacing:.02em;flex-shrink:0;background:var(--paper-2);color:var(--ink-2)}
.av-lg{width:40px;height:40px;font-size:14px}
.av-none{background:transparent;border:1.5px dashed var(--line-3);color:var(--ink-4)}
.av-none svg{width:13px;height:13px}
.av-0{background:#dcf2e4;color:#0b5c33}.av-1{background:#e0ebff;color:#1d45a8}.av-2{background:#fde9d4;color:#8a3f00}.av-3{background:#ede4ff;color:#5421ad}
.av-4{background:#fde2e7;color:#9f1239}.av-5{background:#d9f2f1;color:#0f5c5a}.av-6{background:#f1efbf;color:#545200}.av-7{background:#e6ebe8;color:#33443b}
.ft{width:34px;height:40px;border-radius:7px;display:grid;place-items:end center;padding-bottom:6px;font-family:var(--h);font-weight:600;font-size:9.5px;letter-spacing:.04em;flex-shrink:0;position:relative;background:var(--grey-bg);color:var(--grey)}
.ft::before{content:"";position:absolute;top:0;right:0;width:10px;height:10px;background:linear-gradient(225deg,var(--paper) 50%,rgba(0,0,0,.08) 50%);border-bottom-left-radius:4px}
.ft-pdf{background:#fdecea;color:#b42318}.ft-img{background:#e7efff;color:#1f4fb8}.ft-sheet{background:#e3f4ea;color:#0d6f3d}.ft-doc{background:#e6effc;color:#1d4c9a}.ft-txt{background:var(--grey-bg);color:var(--grey)}

/* shell + top bar */
.shell{min-height:100vh;display:flex;flex-direction:column}
.topbar{position:sticky;top:0;z-index:40;background:var(--deep);color:#fff;border-bottom:1px solid rgba(255,255,255,.06)}
.tb{max-width:1480px;margin:0 auto;height:60px;padding:0 24px;display:flex;align-items:center;gap:14px}
.tb-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#fff;flex-shrink:0;border-radius:8px}
.tb-brand img{height:30px;width:auto}
.tb-brand .mark{display:none;height:28px}
.tb-name{font-family:var(--h);font-weight:500;font-size:12.5px;color:rgba(255,255,255,.72);padding-left:12px;border-left:1px solid rgba(255,255,255,.16);white-space:nowrap}
.tb-home{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 12px;border-radius:9px;color:rgba(255,255,255,.82);text-decoration:none;font-family:var(--h);font-weight:500;font-size:13px;margin-left:6px}
.tb-home:hover{background:rgba(255,255,255,.08);color:#fff}
.tb-home[aria-current="page"]{background:rgba(255,255,255,.1);color:#fff}
.tb-home svg{width:16px;height:16px}
.tb-search{flex:1;max-width:520px;margin-left:auto;position:relative}
.tb-search svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:rgba(255,255,255,.6);pointer-events:none}
.tb-search input{width:100%;height:38px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.07);color:#fff;padding:0 40px 0 36px;font-size:14px;transition:background .15s,border-color .15s}
.tb-search input::placeholder{color:rgba(255,255,255,.62)}
.tb-search input:hover{background:rgba(255,255,255,.1)}
.tb-search input:focus{outline:none;background:rgba(255,255,255,.12);border-color:var(--lime);box-shadow:0 0 0 3px rgba(217,224,33,.18)}
.tb-search input::-webkit-search-cancel-button{-webkit-appearance:none}
.kbd{position:absolute;right:9px;top:50%;transform:translateY(-50%);min-width:22px;height:22px;padding:0 6px;border-radius:6px;border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.7);font-family:var(--mono);font-size:12px;display:grid;place-items:center;pointer-events:none}
.tb-search input:focus+.kbd{display:none}
.tb-clock{display:flex;flex-direction:column;align-items:flex-end;line-height:1.15;padding:0 6px;white-space:nowrap}
.tb-clock b{font-family:var(--h);font-weight:600;font-size:14px;letter-spacing:.01em;font-variant-numeric:tabular-nums}
.tb-clock b span{font-weight:500;font-size:10.5px;color:var(--lime);margin-left:4px;letter-spacing:.06em}
.tb-clock small{font-size:11.5px;color:rgba(255,255,255,.66)}
.topbar .btn-lime{height:36px}
.um{position:relative}
.um-btn{display:flex;align-items:center;gap:8px;height:40px;padding:0 8px 0 4px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);color:#fff}
.um-btn:hover,.um-btn[aria-expanded="true"]{background:rgba(255,255,255,.1)}
.um-btn .av{width:30px;height:30px}
.um-btn>span{font-family:var(--h);font-size:13px;font-weight:500;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.um-btn>svg{width:14px;height:14px;color:rgba(255,255,255,.7)}
.um-pop{position:absolute;right:0;top:calc(100% + 8px);width:260px;background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-3);padding:6px;z-index:60}
.um-head{padding:10px 10px 12px;border-bottom:1px solid var(--line-2);margin-bottom:6px;display:flex;gap:10px;align-items:center}
.um-head b{display:block;font-family:var(--h);font-weight:600;font-size:14px}
.um-head small{display:block;color:var(--ink-3);font-size:12.5px}
.um-pop a,.um-pop button{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;border-radius:8px;border:0;background:none;text-decoration:none;color:var(--ink);font-size:13.5px;text-align:left}
.um-pop a:hover,.um-pop button:hover,.um-pop a:focus-visible,.um-pop button:focus-visible{background:var(--paper)}
.um-pop svg{width:16px;height:16px;color:var(--ink-3)}
.um-pop hr{border:0;border-top:1px solid var(--line-2);margin:6px 0}

/* banner */
.gbanner{max-width:1480px;margin:16px auto 0;padding:0 24px;width:100%}
.banner{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--red-line);border-left:4px solid var(--red);border-radius:var(--r-s);padding:12px 14px;box-shadow:var(--sh-1)}
.banner svg{width:18px;height:18px;color:var(--red)}
.banner p{flex:1;font-size:14px}
.banner b{font-family:var(--h);font-weight:600}

/* page */
.page{flex:1;width:100%;max-width:1480px;margin:0 auto;padding:24px 24px 64px}
.page:focus{outline:none}
.ph{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.ph h1{font-size:26px;font-weight:600;letter-spacing:-.025em}
.ph-sub{color:var(--ink-3);font-size:13.5px;margin-top:4px}
.ph-actions{display:flex;gap:8px;flex-wrap:wrap}
.crumb{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--ink-3);text-decoration:none;margin-bottom:10px;border-radius:6px}
.crumb:hover{color:var(--brand)}
.crumb svg{width:15px;height:15px}

/* summary strip */
.stats{display:grid;grid-template-columns:repeat(6,minmax(0,1fr)) minmax(0,1.55fr);gap:10px;margin-bottom:18px}
.stat{position:relative;text-align:left;display:flex;flex-direction:column;gap:2px;padding:14px 14px 13px;border-radius:var(--r);border:1px solid var(--line);background:#fff;box-shadow:var(--sh-1);transition:border-color .15s,box-shadow .15s,transform .15s;min-width:0}
.stat:hover{border-color:var(--line-3);box-shadow:var(--sh-2);transform:translateY(-1px)}
.stat-l{display:flex;align-items:center;gap:7px;font-family:var(--h);font-weight:500;font-size:12.5px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stat-l i{width:8px;height:8px;border-radius:50%;background:var(--ink-4);flex-shrink:0}
.stat-n{font-family:var(--h);font-weight:600;font-size:26px;letter-spacing:-.03em;line-height:1.15;font-variant-numeric:tabular-nums}
.stat-h{font-size:12px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stat[aria-pressed="true"]{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand) inset,var(--sh-2)}
.stat[aria-pressed="true"]::after{content:"";position:absolute;left:14px;right:14px;bottom:-1px;height:3px;border-radius:3px 3px 0 0;background:var(--brand)}
.i-open{background:var(--green)!important}.i-over{background:var(--red)!important}.i-wait{background:var(--amber-dot)!important}.i-rev{background:#7a4fe0!important}.i-una{background:var(--ink-4)!important}.i-closed{background:#a7b2ab!important}
.stat.hot .stat-n{color:var(--red)}
.mywork{border-radius:var(--r);background:var(--deep);color:#fff;padding:12px 14px;display:flex;flex-direction:column;gap:8px;position:relative;overflow:hidden;min-width:0;isolation:isolate}
.mywork::before{content:"";position:absolute;right:-60px;top:-80px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(0,169,79,.45),transparent 70%);z-index:-1}
.mw-h{display:flex;align-items:center;justify-content:space-between;gap:8px;font-family:var(--h);font-weight:500;font-size:12.5px;color:rgba(255,255,255,.75)}
.mw-h b{color:var(--lime);font-weight:600}
.mw-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.mw-item{display:flex;flex-direction:column;gap:0;text-align:left;padding:7px 10px 8px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:#fff;transition:background .15s,border-color .15s;min-width:0}
.mw-item:hover{background:rgba(255,255,255,.1)}
.mw-item[aria-pressed="true"]{border-color:var(--lime);background:rgba(217,224,33,.12)}
.mw-item b{font-family:var(--h);font-weight:600;font-size:22px;letter-spacing:-.03em;line-height:1.2;font-variant-numeric:tabular-nums}
.mw-item span{font-size:12px;color:rgba(255,255,255,.75)}
.mw-item.hot b{color:#ff9a8f}
.mywork :focus-visible{outline-color:var(--lime)}

/* filters */
.filters{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.fsel{position:relative;display:flex;align-items:center;height:34px;border:1px solid var(--line-3);border-radius:9px;background:#fff;transition:border-color .15s,box-shadow .15s}
.fsel:hover{border-color:#b9c7bb}
.fsel:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px rgba(17,138,77,.14)}
.fsel span{padding-left:11px;font-size:12.5px;color:var(--ink-3);white-space:nowrap;pointer-events:none}
.fsel select{appearance:none;-webkit-appearance:none;border:0;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235a6a61' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 8px center/14px;height:100%;padding:0 28px 0 6px;font-size:13px;font-weight:500;color:var(--ink);max-width:190px;text-overflow:ellipsis}
.fsel select:focus{outline:none}
.fsel.set{border-color:rgba(17,138,77,.55);background:var(--brand-3)}
.fsel.set span{color:var(--brand-2)}
.fclear{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 10px;border:0;background:none;border-radius:9px;color:var(--ink-2);font-size:13px;font-weight:500}
.fclear:hover{background:var(--paper-2);color:var(--ink)}
.fclear svg{width:14px;height:14px}
.fsp{flex:1}
.fnote{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-2);background:var(--amber-bg);border:1px solid var(--amber-line);border-radius:9px;padding:8px 12px;margin:-2px 0 12px}
.fnote svg{width:15px;height:15px;color:var(--amber)}
.fsearch{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 6px 0 11px;border-radius:9px;background:var(--deep);color:#fff;font-size:13px;max-width:280px}
.fsearch span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fsearch button{width:24px;height:24px;border-radius:6px;border:0;background:rgba(255,255,255,.1);color:#fff;display:grid;place-items:center}
.fsearch button:hover{background:rgba(255,255,255,.2)}
.fsearch svg{width:13px;height:13px}

/* ticket list */
.list{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-1);overflow:hidden}
.lgrid{display:grid;grid-template-columns:118px minmax(0,1fr) 138px 96px 150px 52px 156px 42px;align-items:center;column-gap:14px}
.lh{padding:0 16px 0 20px;height:38px;background:var(--paper);border-bottom:1px solid var(--line);font-family:var(--h);font-size:11.5px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-3)}
.lh.lgrid>span:nth-child(6),.lh.lgrid>span:nth-child(8){text-align:center}
.lr{position:relative;padding:12px 16px 12px 20px;border-bottom:1px solid var(--line-2);text-decoration:none;color:var(--ink);transition:background .12s}
.lr:last-child{border-bottom:0}
.lr:hover{background:#f8faf8;color:var(--ink)}
.lr:focus-visible{outline:none;background:#f3f8f4;box-shadow:inset 3px 0 0 var(--brand),inset 0 0 0 2px rgba(17,138,77,.35)}
.lr.on{background:var(--brand-3)}
.lr::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:transparent}
.lr.idle-amber::before{background:var(--amber-dot)}
.lr.idle-red::before{background:#e5484d}
.c-num{font-family:var(--mono);font-size:12.5px;color:var(--ink-3);white-space:nowrap}
.c-sub{min-width:0}
.c-sub b{display:block;font-weight:500;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink)}
.c-sub small{display:flex;gap:6px;align-items:center;font-size:12.5px;color:var(--ink-3);white-space:nowrap;overflow:hidden;min-width:0}
.c-sub small span{overflow:hidden;text-overflow:ellipsis}
.c-sub small i{width:3px;height:3px;border-radius:50%;background:var(--ink-4);flex-shrink:0;font-style:normal}
.c-sub .idle-t{color:var(--amber);font-weight:500;flex-shrink:0}
.c-sub .idle-t.red{color:var(--red)}
.c-src{min-width:0}
.c-as{display:flex;justify-content:center}
.c-dl{display:flex;flex-direction:column;line-height:1.35;min-width:0}
.c-dl b{font-weight:500;font-size:13px;white-space:nowrap}
.c-dl small{font-size:12px;color:var(--ink-3);white-space:nowrap}
.c-dl.over b{color:var(--red)}
.c-dl.soon b{color:var(--amber)}
.c-dl.calm b{color:var(--ink-2)}
.c-doc{display:flex;justify-content:center;align-items:center;gap:3px;font-size:12.5px;color:var(--ink-3)}
.c-doc svg{width:15px;height:15px}
.c-doc.none{color:#c2ccc5}
.m-top{display:none}
.empty{padding:56px 24px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:6px}
.empty .ei{width:52px;height:52px;border-radius:14px;background:var(--paper-2);display:grid;place-items:center;color:var(--brand);margin-bottom:8px}
.empty .ei svg{width:26px;height:26px}
.empty h3{font-size:16px;font-weight:600}
.empty p{color:var(--ink-3);max-width:380px}
.empty .btn{margin-top:12px}
.sk{display:block;border-radius:6px;background:linear-gradient(90deg,#edf2ed 0%,#f6f9f6 40%,#edf2ed 80%);background-size:300% 100%;animation:sk 1.4s ease-in-out infinite;height:12px}
@keyframes sk{from{background-position:100% 0}to{background-position:0 0}}
.sk.w40{width:40%}.sk.w60{width:60%}.sk.w80{width:80%}.sk.w30{width:30%}.sk.h20{height:20px}.sk.h28{height:28px}
.lr.skr{pointer-events:none}
.lr.skr .c-sub{display:flex;flex-direction:column;gap:8px}
.pager{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:14px;flex-wrap:wrap}
.pager p{color:var(--ink-3);font-size:13px}
.pager p b{color:var(--ink);font-weight:500}
.pager div{display:flex;gap:6px;align-items:center}
.pager .pg{font-size:13px;color:var(--ink-2);padding:0 8px}

/* scrim + drawer */
.scrim{position:fixed;inset:0;background:rgba(6,20,14,.38);z-index:80;opacity:0;transition:opacity .2s}
.scrim.in{opacity:1}
.drawer{position:fixed;top:0;right:0;bottom:0;z-index:90;width:min(1100px,calc(100vw - 72px));background:var(--paper);box-shadow:var(--sh-3);display:flex;flex-direction:column;transform:translateX(24px);opacity:0;transition:transform .22s cubic-bezier(.2,.8,.2,1),opacity .18s;outline:none}
.drawer.in{transform:none;opacity:1}
.dr-head{background:#fff;border-bottom:1px solid var(--line);padding:14px 24px 16px;flex-shrink:0}
.dr-top{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.dr-num{font-family:var(--mono);font-size:13px;color:var(--ink-2);background:var(--paper);border:1px solid var(--line);height:28px;display:inline-flex;align-items:center;gap:6px;padding:0 4px 0 10px;border-radius:8px}
.dr-num button{height:22px;width:22px;border:0;border-radius:5px;background:transparent;color:var(--ink-3);display:grid;place-items:center}
.dr-num button:hover{background:#fff;color:var(--brand)}
.dr-num svg{width:14px;height:14px}
.dr-top .sp{flex:1}
.dr-title{font-size:21px;font-weight:600;letter-spacing:-.02em;margin-bottom:10px;overflow-wrap:anywhere}
.dr-title:focus{outline:none}
.dr-chips{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.dr-chips .meta{font-size:12.5px;color:var(--ink-3);display:inline-flex;align-items:center;gap:6px}
.dr-chips .meta svg{width:14px;height:14px}
.dr-chips .dot{width:3px;height:3px;border-radius:50%;background:var(--ink-4)}
.dr-actions{display:flex;gap:8px;flex-wrap:wrap}
.dr-body{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:20px 24px 40px}
.dr-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:18px;align-items:start}
.dr-main,.dr-side{display:flex;flex-direction:column;gap:16px;min-width:0}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-1);min-width:0}
.card-h{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px 0}
.card-h h3{font-size:14px;font-weight:600;display:flex;align-items:center;gap:8px}
.card-h h3 .cnt{font-family:var(--b);font-weight:500;font-size:12px;color:var(--ink-3);background:var(--paper);border-radius:999px;padding:1px 8px}
.card-b{padding:12px 16px 16px}
.kv{display:grid;grid-template-columns:auto minmax(0,1fr);gap:9px 14px;font-size:13.5px;align-items:baseline}
.kv dt{color:var(--ink-3);font-size:12.5px;white-space:nowrap}
.kv dd{margin:0;min-width:0;overflow-wrap:anywhere}
.req-meta{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.req-body{white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px;line-height:1.6;color:var(--ink-2);background:var(--paper);border:1px solid var(--line-2);border-radius:var(--r-s);padding:12px 14px;max-height:360px;overflow:auto}
.req-empty{color:var(--ink-3);font-style:italic}
.cust{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.cust b{display:block;font-family:var(--h);font-weight:600;font-size:15px;overflow-wrap:anywhere}
.cust small{display:block;color:var(--ink-3);font-size:13px;overflow-wrap:anywhere}
.clines{display:flex;flex-direction:column;gap:2px;margin-bottom:12px}
.cline{display:flex;align-items:center;gap:10px;padding:7px 8px;margin:0 -8px;border-radius:8px;text-decoration:none;color:var(--ink);font-size:13.5px;min-width:0}
.cline:hover{background:var(--paper);color:var(--brand-2)}
.cline svg{width:16px;height:16px;color:var(--ink-3)}
.cline span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cline.none{color:var(--ink-3);pointer-events:none}
.cacts{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.props{display:flex;flex-direction:column;gap:12px}
.props .field{gap:5px}
.props .inp{height:36px;font-size:13.5px}
.props-f{display:flex;justify-content:flex-end;align-items:center;gap:8px;padding-top:4px}
.props-f .hint{margin-right:auto}
.dirty-dot{width:7px;height:7px;border-radius:50%;background:var(--amber-dot);display:inline-block}
.ro-banner{display:flex;align-items:center;gap:12px;background:var(--grey-bg);border:1px solid #dde3df;border-radius:var(--r);padding:12px 14px;font-size:13.5px}
.ro-banner svg{width:18px;height:18px;color:var(--grey)}
.ro-banner p{flex:1}
.rv-banner{background:var(--violet-bg);border-color:var(--violet-line)}
.rv-banner svg{color:var(--violet)}
.outcome{display:flex;flex-direction:column;gap:8px}
.oc{display:inline-flex;align-items:center;gap:6px;font-family:var(--h);font-weight:600;font-size:13px;padding:4px 10px;border-radius:8px;width:max-content}
.oc-won{background:var(--brand-3);color:var(--brand-2)}.oc-lost{background:var(--red-bg);color:var(--red)}.oc-no_action{background:var(--grey-bg);color:var(--grey)}

/* chat transcript */
.chat{margin-top:14px;border:1px solid var(--line);border-radius:var(--r-s);overflow:hidden}
.chat summary{list-style:none;display:flex;align-items:center;gap:8px;padding:10px 12px;background:var(--paper);cursor:pointer;font-family:var(--h);font-weight:500;font-size:13px}
.chat summary::-webkit-details-marker{display:none}
.chat summary svg{width:16px;height:16px;color:var(--brand)}
.chat summary .chev{margin-left:auto;color:var(--ink-3);transition:transform .2s}
.chat[open] summary .chev{transform:rotate(180deg)}
.chat summary small{font-family:var(--b);font-weight:400;color:var(--ink-3)}
.bubbles{display:flex;flex-direction:column;gap:10px;padding:14px 12px;max-height:440px;overflow:auto;background:#fbfcfb}
.bub{max-width:82%;display:flex;flex-direction:column;gap:3px}
.bub p{padding:9px 12px;border-radius:14px;font-size:13.5px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
.bub small{font-size:11.5px;color:var(--ink-3);padding:0 4px}
.bub-cust{align-self:flex-start}
.bub-cust p{background:#fff;border:1px solid var(--line);border-bottom-left-radius:4px}
.bub-site{align-self:flex-end;align-items:flex-end}
.bub-site p{background:var(--deep-3);color:#eaf4ee;border-bottom-right-radius:4px}

/* documents */
.docs{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.doc{display:flex;align-items:center;gap:10px;padding:8px;margin:0 -8px;border-radius:10px}
.doc:hover{background:var(--paper)}
.doc-i{min-width:0;flex:1}
.doc-i b{display:block;font-weight:500;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.doc-i small{display:block;font-size:12px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.doc.up{opacity:.7}
.drop{margin-top:10px;border:1.5px dashed var(--line-3);border-radius:var(--r-s);padding:14px;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;transition:border-color .15s,background .15s}
.drop.over{border-color:var(--brand);background:var(--brand-3)}
.drop p{font-size:13px;color:var(--ink-2)}
.drop small{font-size:11.5px;color:var(--ink-3)}
.drop svg{width:20px;height:20px;color:var(--brand)}

/* composer */
.comp{overflow:hidden}
.tabs{display:flex;gap:2px;padding:6px 6px 0;border-bottom:1px solid var(--line);background:var(--paper)}
.tabs button{display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 14px;border:0;border-radius:9px 9px 0 0;background:none;font-family:var(--h);font-weight:500;font-size:13px;color:var(--ink-3);position:relative;top:1px;border:1px solid transparent;border-bottom:0}
.tabs button:hover{color:var(--ink)}
.tabs button[aria-selected="true"]{background:#fff;color:var(--ink);border-color:var(--line)}
.tabs button svg{width:15px;height:15px}
.tabpanel{padding:14px 16px 16px}
.tabpanel.note-p{background:linear-gradient(#fff,#fff)}
.note-in{background:var(--note);border-color:var(--note-line)}
.note-in:hover{border-color:#e6cf6f}
.comp-f{display:flex;align-items:center;gap:8px;margin-top:10px;flex-wrap:wrap}
.comp-f .hint{margin-right:auto;display:flex;align-items:center;gap:6px}
.comp-f .hint svg{width:14px;height:14px}
.onlyline{display:flex;align-items:flex-start;gap:8px;font-size:13px;color:var(--brand-2);background:var(--brand-3);border-radius:9px;padding:9px 11px;margin-bottom:12px}
.onlyline svg{width:16px;height:16px;flex-shrink:0;margin-top:1px}
.mailoff{display:flex;align-items:flex-start;gap:10px;font-size:13.5px;color:var(--amber);background:var(--amber-bg);border:1px solid var(--amber-line);border-radius:10px;padding:10px 12px;margin-bottom:12px}
.mailoff svg{width:17px;height:17px;flex-shrink:0;margin-top:1px}
.mailoff b{font-weight:500}
.counter{font-size:12px;color:var(--ink-3);font-variant-numeric:tabular-nums}
.counter.bad{color:var(--red)}
.preview{margin-top:14px;border:1px solid var(--line);border-radius:var(--r-s);overflow:hidden;background:#eef3ee}
.preview-h{display:flex;align-items:center;gap:8px 12px;padding:8px 8px 8px 12px;background:#fff;border-bottom:1px solid var(--line);font-size:12.5px;color:var(--ink-3);flex-wrap:wrap}
.preview-h b{color:var(--ink);font-weight:500}
.preview-h .pv-t{display:inline-flex;align-items:center;gap:6px;font-family:var(--h);font-weight:600;color:var(--ink);font-size:12.5px}
.preview-h .pv-t svg{color:var(--brand)}
.preview-h .sp{flex:1}
.preview-h .btn{margin-left:auto}
.pv-stale{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--amber-bg);border-bottom:1px solid var(--amber-line);color:var(--amber);font-size:12.5px}
.pv-stale svg{width:15px;height:15px}
.preview iframe{display:block;width:100%;height:520px;border:0;background:#eef3ee;opacity:0;transition:opacity .15s}
.preview iframe.ready{opacity:1}

/* timeline */
.tl{list-style:none;margin:0;padding:0;position:relative}
.tl::before{content:"";position:absolute;left:15px;top:8px;bottom:8px;width:1.5px;background:var(--line)}
.tl-i{position:relative;display:flex;gap:12px;padding:6px 0}
.tl-ic{width:32px;height:32px;border-radius:50%;background:#fff;border:1px solid var(--line);display:grid;place-items:center;color:var(--ink-3);flex-shrink:0;position:relative;z-index:1}
.tl-ic svg{width:15px;height:15px}
.tl-ic.k-note{background:var(--note);border-color:var(--note-line);color:#8a6d00}
.tl-ic.k-email{background:var(--blue-bg);border-color:#d4e0fb;color:var(--blue)}
.tl-ic.k-whatsapp{background:#e3f6ea;border-color:#bfe6cd;color:#15803d}
.tl-ic.k-call{background:var(--violet-bg);border-color:var(--violet-line);color:var(--violet)}
.tl-ic.k-doc{background:var(--paper);color:var(--brand)}
.tl-ic.k-status{background:var(--paper);color:var(--brand-2)}
.tl-c{flex:1;min-width:0;padding-top:6px}
.tl-line{font-size:13.5px;color:var(--ink-2);overflow-wrap:anywhere}
.tl-line b{color:var(--ink);font-weight:500}
.tl-line time,.tl-meta time{color:var(--ink-3);font-size:12.5px;white-space:nowrap}
.tl-card{margin-top:2px;border:1px solid var(--line);border-radius:12px;background:#fff;padding:10px 12px;min-width:0}
.tl-c.boxed{padding-top:0}
.tl-card.note{background:var(--note);border-color:var(--note-line)}
.tl-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12.5px;color:var(--ink-3);margin-bottom:6px}
.tl-meta b{color:var(--ink);font-weight:500;font-size:13px}
.tl-meta .tag{font-family:var(--h);font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;padding:2px 7px;border-radius:5px;background:rgba(138,109,0,.1);color:#6f5800}
.tl-meta .sp{flex:1}
.tl-body{white-space:pre-wrap;overflow-wrap:anywhere;font-size:13.5px;line-height:1.55;color:var(--ink)}
.tl-body.clamp{display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.tl-subj{font-weight:500;font-size:13.5px;margin-bottom:4px;overflow-wrap:anywhere}
.tl-more{margin-top:6px;font-size:12.5px}
.dl{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:500;padding:2px 8px;border-radius:999px}
.dl-sent{background:var(--brand-3);color:var(--brand-2)}.dl-failed{background:var(--red-bg);color:var(--red)}.dl-logged{background:var(--grey-bg);color:var(--grey)}

/* dialog */
.dlg{border:0;padding:0;border-radius:18px;width:min(520px,calc(100vw - 32px));max-height:calc(100vh - 48px);box-shadow:var(--sh-3);color:var(--ink);background:#fff;overflow:auto}
.dlg.wide{width:min(640px,calc(100vw - 32px))}
.dlg::backdrop{background:rgba(6,20,14,.5)}
.dlg form{display:flex;flex-direction:column}
.dlg-h{display:flex;align-items:flex-start;gap:12px;padding:20px 22px 6px}
.dlg-h>div{flex:1;min-width:0}
.dlg-h h2{font-size:18px;font-weight:600}
.dlg-h p{color:var(--ink-3);font-size:13.5px;margin-top:4px;font-family:var(--b);letter-spacing:0;font-weight:400}
.dlg-b{padding:14px 22px 6px;display:flex;flex-direction:column;gap:14px}
.dlg-f{display:flex;justify-content:flex-end;gap:8px;padding:16px 22px 20px}
.dlg-f .sp{flex:1}
.linkbox{display:flex;gap:8px}
.linkbox .inp{font-family:var(--mono);font-size:12.5px}
.notebox{display:flex;gap:10px;align-items:flex-start;background:var(--amber-bg);border:1px solid var(--amber-line);border-radius:10px;padding:10px 12px;color:var(--amber);font-size:13.5px}
.notebox svg{width:17px;height:17px;flex-shrink:0;margin-top:1px}
.quote{background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-size:13.5px;white-space:pre-wrap;overflow-wrap:anywhere;max-height:180px;overflow:auto}

/* toasts */
.toasts{position:fixed;right:20px;bottom:20px;z-index:300;display:flex;flex-direction:column;gap:8px;align-items:flex-end;pointer-events:none;max-width:calc(100vw - 32px)}
.toast{pointer-events:auto;display:flex;align-items:center;gap:10px;background:var(--deep);color:#fff;border-radius:12px;padding:11px 12px 11px 14px;box-shadow:var(--sh-3);font-size:13.5px;max-width:420px;animation:tin .22s cubic-bezier(.2,.8,.2,1)}
.toast svg{width:17px;height:17px;flex-shrink:0}
.toast.ok svg{color:var(--lime)}
.toast.err{background:#fff;color:var(--ink);border:1px solid var(--red-line);border-left:4px solid var(--red)}
.toast.err svg{color:var(--red)}
.toast p{flex:1}
.toast button{border:0;background:transparent;color:inherit;opacity:.7;width:24px;height:24px;border-radius:6px;display:grid;place-items:center}
.toast button:hover{opacity:1;background:rgba(127,127,127,.15)}
.toast button svg{width:14px;height:14px}
.toast.out{opacity:0;transform:translateY(6px);transition:opacity .2s,transform .2s}
@keyframes tin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* auth pages */
.auth{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 16px;background:var(--deep);position:relative;overflow:hidden;isolation:isolate}
.auth::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(900px 520px at 85% -10%,rgba(0,169,79,.3),transparent 60%),radial-gradient(700px 420px at -10% 110%,rgba(96,190,68,.14),transparent 60%),linear-gradient(180deg,#06140e,#0a1f17)}
.auth::after{content:"";position:absolute;inset:0;z-index:-1;opacity:.06;background-image:linear-gradient(rgba(255,255,255,.8) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.8) 1px,transparent 1px);background-size:56px 56px;mask-image:radial-gradient(600px 400px at 50% 40%,#000 20%,transparent 75%);-webkit-mask-image:radial-gradient(600px 400px at 50% 40%,#000 20%,transparent 75%)}
.auth-logo{height:38px;width:auto;margin-bottom:28px}
.auth-card{width:100%;max-width:410px;background:#fff;border-radius:20px;box-shadow:0 40px 90px -30px rgba(0,0,0,.7);padding:30px 30px 26px}
.auth-card h1{font-size:22px;font-weight:600;margin-bottom:4px}
.auth-card .sub{color:var(--ink-3);font-size:14px;margin-bottom:22px}
.auth-card form{display:flex;flex-direction:column;gap:14px}
.auth-card .btn-lg{margin-top:4px}
.auth-card .help{font-size:13px;color:var(--ink-3);text-align:center;margin-top:16px;padding-top:16px;border-top:1px solid var(--line-2)}
.auth-tag{display:inline-flex;align-items:center;gap:8px;font-family:var(--h);font-weight:500;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--brand);margin-bottom:10px}
.auth-tag::before{content:"";width:18px;height:2px;border-radius:2px;background:var(--grad,var(--brand))}
.auth-foot{margin-top:22px;color:rgba(255,255,255,.55);font-size:12.5px;text-align:center}
.who{display:flex;align-items:center;gap:10px;background:var(--paper);border-radius:10px;padding:10px 12px;font-size:13.5px}
.who b{font-family:var(--mono);font-weight:500}

/* simple pages (new ticket, users, me) */
.narrow{max-width:980px;margin:0 auto}
.fcard{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-1)}
.fsec{padding:20px 22px;border-bottom:1px solid var(--line-2);display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px}
.fsec:last-of-type{border-bottom:0}
.fsec-h h2{font-size:14.5px;font-weight:600;margin-bottom:4px}
.fsec-h p{color:var(--ink-3);font-size:13px}
.fbar{display:flex;justify-content:flex-end;gap:8px;padding:16px 22px;background:var(--paper);border-top:1px solid var(--line);border-radius:0 0 var(--r) var(--r);align-items:center}
.fbar .hint{margin-right:auto}
.ulist{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-1);overflow:hidden}
.ugrid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1.3fr) minmax(0,1fr) 150px 130px 190px;gap:14px;align-items:center}
.uh{padding:0 18px;height:38px;background:var(--paper);border-bottom:1px solid var(--line);font-family:var(--h);font-size:11.5px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-3)}
.ur{padding:12px 18px;border-bottom:1px solid var(--line-2)}
.ur:last-child{border-bottom:0}
.ur.off{background:#fafbfa}
.ur.off .u-who b{color:var(--ink-3)}
.u-who{display:flex;align-items:center;gap:10px;min-width:0}
.u-who b{display:block;font-weight:500;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.u-who small{display:block;font-family:var(--mono);font-size:12px;color:var(--ink-3)}
.u-contact{font-size:13px;color:var(--ink-2);min-width:0}
.u-contact span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.u-contact .muted{font-size:12.5px}
.u-roles{display:flex;flex-wrap:wrap;gap:4px}
.u-state{display:flex;flex-direction:column;gap:2px;font-size:12.5px}
.u-state .st{font-size:12.5px}
.u-last{font-size:12.5px;color:var(--ink-3)}
.u-act{display:flex;gap:6px;justify-content:flex-end}
.me-grid{display:grid;grid-template-columns:320px minmax(0,1fr);gap:18px;align-items:start}
.me-card{padding:20px}
.me-card .cust{margin-bottom:16px}
.pwcard{padding:22px}
.pwcard h2{font-size:16px;font-weight:600;margin-bottom:4px}
.pwcard>p{color:var(--ink-3);font-size:13.5px;margin-bottom:18px}
.pw-grid{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:22px}
.pw-side{background:var(--paper);border-radius:var(--r-s);padding:14px 16px;align-self:start}
.pw-side h3{font-size:12.5px;font-weight:600;margin-bottom:10px;color:var(--ink-2)}

.t-short,.m-lbl{display:none}
.tabs button{white-space:nowrap}

/* responsive */
@media (max-width:1320px){
  .lgrid{grid-template-columns:108px minmax(0,1fr) 126px 90px 136px 50px 142px 36px;column-gap:12px}
  .stats{grid-template-columns:repeat(6,minmax(0,1fr));}
  .mywork{grid-column:1/-1;flex-direction:row;align-items:center}
  .mw-h{flex-direction:column;align-items:flex-start;gap:0;min-width:120px}
  .mw-row{flex:1;grid-template-columns:repeat(2,minmax(0,220px))}
  .mw-item{flex-direction:row;align-items:baseline;gap:8px}
}
@media (max-width:1160px){
  .lgrid{grid-template-columns:100px minmax(0,1fr) 88px 128px 50px 134px 34px}
  .lgrid .c-src,.lh.lgrid>span:nth-child(3){display:none}
  .dr-grid{grid-template-columns:minmax(0,1fr)}
  .dr-main,.dr-side{display:contents}
  .o-cust{order:1}.o-req{order:2}.o-props{order:3}.o-out{order:3}.o-docs{order:4}.o-comp{order:5}.o-tl{order:6}.o-ro{order:0}
  .ugrid{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) 140px 120px 170px}
  .ugrid .u-contact,.uh.ugrid>span:nth-child(2){display:none}
}
@media (max-width:960px){
  .stats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .lh{display:none}
  .lr.lgrid{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"top top" "sub sub" "meta meta";row-gap:6px;padding:14px 16px 14px 18px}
  .m-top{grid-area:top;display:flex;align-items:center;gap:8px;min-width:0}
  .m-top .c-num{margin-right:auto}
  .lr .c-sub{grid-area:sub}
  .lr .c-sub b{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .lr>.c-num,.lr>.c-pri,.lr>.c-st,.lr>.c-src{display:none}
  .m-meta{grid-area:meta;display:flex;align-items:center;gap:10px;min-width:0}
  .m-meta .c-dl{order:-1;flex-direction:row;gap:6px;align-items:baseline;margin-right:auto;min-width:0;overflow:hidden}
  .m-meta .c-dl small{overflow:hidden;text-overflow:ellipsis}
  .me-grid{grid-template-columns:minmax(0,1fr)}
  .fsec{grid-template-columns:minmax(0,1fr);gap:12px}
}
@media (min-width:961px){.m-meta{display:contents}}
@media (max-width:760px){
  .page{padding:16px 16px 48px}
  .gbanner{padding:0 16px}
  .ph h1{font-size:22px}
  .ph{margin-bottom:14px;align-items:center}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .stat{padding:11px 12px}
  .stat-n{font-size:22px}
  .stat-h{display:none}
  .mywork{flex-direction:column;align-items:stretch}
  .mw-h{flex-direction:row;align-items:center}
  .mw-row{grid-template-columns:1fr 1fr}
  .filters{flex-wrap:nowrap;overflow-x:auto;margin:0 -16px 12px;padding:2px 16px 4px;scrollbar-width:none}
  .filters::-webkit-scrollbar{display:none}
  .fsel,.fclear,.fsearch{flex-shrink:0}
  .fsp{display:none}
  .drawer{width:100vw;transform:translateY(16px)}
  .dr-head{padding:10px 16px 14px}
  .dr-title{font-size:17px;margin-bottom:8px}
  .dr-chips{gap:6px}
  .dr-chips .meta{display:none}
  .tabs button{flex:1;justify-content:center;padding:0 8px}
  .t-long{display:none}
  .t-short{display:inline}
  .m-lbl{display:inline}
  .dr-body{padding:14px 12px 32px}
  .grid2,.grid3{grid-template-columns:minmax(0,1fr)}
  .span2{grid-column:auto}
  .radios{grid-template-columns:minmax(0,1fr)}
  .pw-grid{grid-template-columns:minmax(0,1fr)}
  .ugrid{display:flex;flex-wrap:wrap;gap:8px 12px}
  .uh{display:none}
  .ur .u-who{flex-basis:100%}
  .ur .u-roles{flex-basis:auto}
  .ur .u-state{flex-direction:row;gap:10px;flex-basis:auto}
  .ur .u-last{flex-basis:100%}
  .ur .u-act{flex-basis:100%;justify-content:flex-start}
  .toasts{left:16px;right:16px;bottom:16px;align-items:stretch}
  .toast{max-width:none}
  .fbar{flex-wrap:wrap}
  .fbar .hint{flex-basis:100%}
  .auth-card{padding:24px 20px 20px}
  .dlg-h,.dlg-b,.dlg-f{padding-left:18px;padding-right:18px}
}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* small additions */
:root{--grad:linear-gradient(120deg,#00a94f 0%,#60be44 50%,#d9e021 100%)}
fieldset{border:0;margin:0;padding:0;min-width:0}
legend{padding:0;margin-bottom:6px}
.chip.over{background:var(--red-bg);color:var(--red)}
.chip.soon{background:var(--amber-bg);color:var(--amber)}
.dr-chips .dr-actions{margin-left:auto}
.list.loading .lr{opacity:.55;transition:opacity .15s}
.who .muted{margin-left:auto;font-size:12.5px}
.who svg{width:16px;height:16px;color:var(--ink-3)}

/* ================================================================ operations: navigation */
.tb{position:relative}
.tb-nav{display:flex;align-items:center;gap:2px;margin-left:4px}
.tb-link{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 11px;border-radius:9px;border:0;background:none;color:rgba(255,255,255,.78);text-decoration:none;font-family:var(--h);font-weight:500;font-size:13px;white-space:nowrap;position:relative}
.tb-link:hover{background:rgba(255,255,255,.08);color:#fff}
.tb-link[aria-current="page"]{background:rgba(255,255,255,.1);color:#fff}
.tb-link[aria-current="page"]::after{content:"";position:absolute;left:12px;right:12px;bottom:-13px;height:2px;border-radius:2px 2px 0 0;background:var(--lime)}
.tb-link svg{width:16px;height:16px}
.tb-link .chev{width:13px;height:13px;opacity:.7}
.tb-link[aria-expanded="true"]{background:rgba(255,255,255,.12);color:#fff}
.nbadge{min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--lime);color:var(--deep);font-size:11px;font-weight:600;display:inline-grid;place-items:center;font-variant-numeric:tabular-nums;line-height:1}
.tb-adm{position:relative}
.tb-sub{position:absolute;left:0;top:calc(100% + 12px);width:230px;background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-3);padding:6px;z-index:60}
.tb-sub-h{display:none}
.tb-sub a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;text-decoration:none;color:var(--ink);font-size:13.5px}
.tb-sub a:hover,.tb-sub a:focus-visible{background:var(--paper);color:var(--ink)}
.tb-sub svg{width:16px;height:16px;color:var(--ink-3)}
.tb-menu{display:none;align-items:center;gap:6px;height:36px;padding:0 10px;border-radius:9px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);color:#fff;font-family:var(--h);font-size:13px;font-weight:500;white-space:nowrap}
.tb-menu:hover,.tb-menu[aria-expanded="true"]{background:rgba(255,255,255,.12)}
.tb-menu svg{width:16px;height:16px}
.tb-menu svg:last-child{width:13px;height:13px;opacity:.7}
.tb-search{min-width:170px}

/* shared bits */
.num{font-variant-numeric:tabular-nums;white-space:nowrap}
.r{text-align:right}
.c{text-align:center}
.m-good{color:var(--brand-2)}
.m-ok{color:var(--amber)}
.m-bad{color:var(--red)}
.mpill{display:inline-flex;align-items:center;justify-content:center;height:22px;min-width:52px;padding:0 8px;border-radius:999px;font-size:12px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap;background:var(--grey-bg);color:var(--grey)}
.mpill.m-good{background:var(--brand-3);color:var(--brand-2)}
.mpill.m-ok{background:var(--amber-bg);color:var(--amber)}
.mpill.m-bad{background:var(--red-bg);color:var(--red)}
.code{display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle;font-family:var(--mono);font-size:11.5px;font-weight:600;letter-spacing:-.01em;color:var(--brand-2);background:var(--brand-3);border-radius:5px;padding:2px 6px;line-height:1.35}
.st-in_progress::before{background:#2f6fdf;box-shadow:0 0 0 3px rgba(47,111,223,.16)}
.st-ready_to_bill::before{background:#7a4fe0;box-shadow:0 0 0 3px rgba(122,79,224,.16)}
.st-cancelled::before{background:#d05a45;box-shadow:0 0 0 3px rgba(208,90,69,.14)}
.st-billed::before,.st-partly_billed::before{background:#0f8b8d;box-shadow:0 0 0 3px rgba(15,139,141,.14)}
.chip.st-in_progress{background:var(--blue-bg);color:var(--blue)}
.chip.st-ready_to_bill{background:var(--violet-bg);color:var(--violet)}
.chip.st-cancelled{background:var(--red-bg);color:var(--red)}
.chip.st-billed,.chip.st-partly_billed{background:#e3f5f5;color:#0b6a6b}
.i-prog{background:#2f6fdf!important}
.stat.warn .stat-n{color:var(--amber)}
.stat-h .go{width:12px;height:12px;display:inline-block;vertical-align:-2px;margin-left:3px}
.lic{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 8px;border-radius:999px;font-size:12px;font-weight:500;white-space:nowrap}
.lic svg{width:13px;height:13px}
.lic-bad{background:var(--red-bg);color:var(--red);border:1px solid var(--red-line)}
.lic-due{background:var(--amber-bg);color:var(--amber);border:1px solid var(--amber-line)}
.lic-ok{color:var(--ink-3);padding:0}
.lic-none{color:var(--ink-4);padding:0}
.rb{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:6px;font-size:12px;font-weight:500;white-space:nowrap}
.rb-client{background:var(--brand-3);color:var(--brand-2)}
.rb-vendor{background:var(--blue-bg);color:var(--blue)}
.co-mark{width:34px;height:34px;border-radius:9px;display:inline-grid;place-items:center;font-family:var(--h);font-weight:600;font-size:12px;letter-spacing:.02em;flex-shrink:0}
.co-mark.sm{width:26px;height:26px;border-radius:7px;font-size:10.5px}
.co-mark.lg{width:58px;height:58px;border-radius:15px;font-size:19px}
.av-xl{width:58px;height:58px;font-size:19px}
kbd{font-family:var(--mono);font-size:11px;border:1px solid var(--line-3);border-bottom-width:2px;border-radius:5px;padding:0 5px;background:#fff;color:var(--ink-2);margin-right:5px}
.crumbs{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-3);margin-bottom:12px;flex-wrap:wrap}
.crumbs a{display:inline-flex;align-items:center;gap:5px;color:var(--ink-3);text-decoration:none;border-radius:6px}
.crumbs a:hover{color:var(--brand)}
.crumbs svg{width:15px;height:15px}
.crumbs [aria-current]{color:var(--ink-2);font-weight:500}
.empty.sm{padding:36px 24px}
.card-b.flush{padding:0}
.pad{padding:16px}
.mt{margin-top:14px}
.card-f{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;border-top:1px solid var(--line-2);flex-wrap:wrap}
.card-h h3 svg{width:16px;height:16px;color:var(--brand)}
.ro-banner.bad-banner{background:var(--red-bg);border-color:var(--red-line)}
.ro-banner.bad-banner svg{color:var(--red)}
.notebox.info{background:var(--blue-bg);border-color:#d4e0fb;color:var(--blue)}
.dlg.xwide{width:min(860px,calc(100vw - 32px))}
.dlg-sec{font-size:13.5px;font-weight:600;padding-top:12px;border-top:1px solid var(--line-2)}
.dupbox{display:flex;gap:10px;align-items:flex-start;background:var(--amber-bg);border:1px solid var(--amber-line);border-radius:10px;padding:10px 12px;font-size:13.5px}
.dupbox>svg{width:17px;height:17px;color:var(--amber);flex-shrink:0;margin-top:2px}
.dupbox b{font-weight:500}
.dup-acts{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin:8px 0}
.dup-acts a{display:inline-flex;align-items:center;gap:5px;font-weight:500}
.dup-acts svg{width:13px;height:13px}
.dupbox .check{background:#fff}
.suggest{display:flex;align-items:center;gap:12px;margin:18px 22px 0;padding:12px 14px;border-radius:10px;background:var(--blue-bg);border:1px solid #d4e0fb;font-size:13.5px}
.suggest>svg{width:18px;height:18px;color:var(--blue);flex-shrink:0}
.suggest p{flex:1}
.suggest b{font-weight:500}
.jobchip{background:var(--deep);color:#fff;text-decoration:none}
.jobchip:hover{color:#fff;background:var(--deep-3)}
.jobchip svg{color:var(--lime)}
.jobchip .jc-st{font-size:11.5px;color:var(--lime);padding-left:7px;margin-left:1px;border-left:1px solid rgba(255,255,255,.22)}
.fchip{height:28px;padding:0 11px;border:0;border-radius:7px;background:none;font-family:var(--h);font-size:12.5px;font-weight:500;color:var(--ink-2);display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.fchip:hover{background:var(--paper)}
.fchip[aria-pressed="true"]{background:var(--deep);color:#fff}
.fchip .cnt{font-family:var(--b);font-size:11px;background:var(--paper-2);color:var(--ink-2);border-radius:999px;padding:0 6px;line-height:17px}
.fchip[aria-pressed="true"] .cnt{background:rgba(255,255,255,.18);color:#fff}
.chips{display:inline-flex;background:#fff;border:1px solid var(--line-3);border-radius:9px;padding:2px;gap:2px;flex-shrink:0}

/* popover menu */
.pop{position:fixed;z-index:250;min-width:230px;max-width:300px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--sh-3);padding:5px;animation:tin .14s ease}
.pop button{display:flex;align-items:flex-start;gap:10px;width:100%;padding:8px 10px;border:0;background:none;border-radius:8px;text-align:left;font-size:13.5px;color:var(--ink)}
.pop button:hover,.pop button:focus-visible{background:var(--paper)}
.pop button:focus-visible{outline-offset:-2px}
.pop button svg{width:16px;height:16px;color:var(--ink-3);margin-top:1px}
.pop button small{display:block;color:var(--ink-3);font-size:12px}
.pop button.danger,.pop button.danger svg{color:var(--red)}
.pop hr{border:0;border-top:1px solid var(--line-2);margin:4px 0}

/* type-ahead */
.ta{position:relative}
.ta-pop{position:absolute;left:0;top:calc(100% + 4px);min-width:100%;width:max-content;max-width:min(540px,calc(100vw - 32px));max-height:330px;overflow:auto;overscroll-behavior:contain;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--sh-3);padding:4px;z-index:70}
.ta-g{position:sticky;top:-4px;background:#fff;font-family:var(--h);font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3);padding:9px 10px 5px;z-index:1}
.ta-o{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:8px;cursor:pointer;font-size:13.5px;min-width:0}
.ta-o:hover{background:var(--paper)}
.ta-o[aria-selected="true"]{background:var(--brand-3);box-shadow:inset 3px 0 0 var(--brand)}
.ta-code{font-family:var(--mono);font-size:12px;font-weight:600;color:var(--brand-2);flex-shrink:0;min-width:96px}
.ta-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ta-name b{display:block;font-weight:500;overflow:hidden;text-overflow:ellipsis}
.ta-name small{display:block;color:var(--ink-3);font-size:12px;overflow:hidden;text-overflow:ellipsis}
.ta-meta{font-size:11.5px;color:var(--ink-3);font-family:var(--mono);flex-shrink:0;padding-left:8px}
.ta-o .lic{height:20px;font-size:11px}
.ta-act{color:var(--brand-2);font-weight:500;border-top:1px solid var(--line-2);border-radius:0 0 8px 8px;margin-top:4px}
.ta-act svg{width:16px;height:16px}
.ta-empty{padding:12px;color:var(--ink-3);font-size:13px}

/* jobs board */
.jstats{grid-template-columns:repeat(5,minmax(0,1fr)) minmax(0,1.5fr)}
.mw-item b svg{width:20px;height:20px;margin:3px 0 2px}
.jgrid{display:grid;grid-template-columns:130px minmax(0,1fr) 158px 122px 44px 132px 112px 76px;align-items:center;column-gap:14px}
.jgrid.nocost{grid-template-columns:130px minmax(0,1fr) 158px 122px 44px 132px 112px}
.lh .r{text-align:right}
.lh .c{text-align:center}
.jgrid .c-amt{text-align:right;font-weight:500}
.jgrid .c-mg{text-align:right}
.c-sub .aw{color:var(--amber);font-weight:500;display:inline-flex;align-items:center;gap:4px;flex-shrink:0}
.c-sub .aw svg{width:12px;height:12px}
.c-svc{min-width:0}

/* job card */
.jc{display:flex;flex-direction:column;gap:14px}
.jc-head{padding:16px 20px 18px}
.jc-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.jc-top .sp{flex:1}
.jc-actions{display:flex;gap:8px;flex-wrap:wrap}
.jc-title{font-size:24px;font-weight:600;letter-spacing:-.025em;margin:12px 0 14px;overflow-wrap:anywhere}
.jc-title:focus{outline:none}
.jc-meta{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px 24px;margin:0;padding-top:14px;border-top:1px solid var(--line-2)}
.jc-meta dt{font-family:var(--h);font-size:11px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3);margin-bottom:4px}
.jc-meta dd{margin:0;font-size:14px;font-weight:500;display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0;overflow-wrap:anywhere}
.jc-meta dd a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line-3);text-underline-offset:4px;text-decoration-thickness:1px}
.jc-meta dd a:hover{color:var(--brand-2);text-decoration-color:var(--brand)}
.jc-meta .muted{font-weight:400}
.jc-meta .lic{font-weight:500}
.who2 .av{width:24px;height:24px;font-size:10px}
.jc-notes{display:flex;gap:8px;align-items:flex-start;margin-top:14px;font-size:13.5px;color:var(--ink-2);background:var(--paper);border-radius:10px;padding:9px 12px;white-space:pre-wrap}
.jc-notes svg{width:15px;height:15px;color:var(--ink-3);margin-top:2px}
.badge.blink{text-decoration:none;color:var(--ink-2)}
.badge.blink:hover{border-color:var(--brand);color:var(--brand-2)}
.jc-refs summary{list-style:none;display:flex;align-items:center;gap:14px;padding:11px 16px;cursor:pointer;border-radius:var(--r)}
.jc-refs summary::-webkit-details-marker{display:none}
.jc-refs summary:hover .rh b{color:var(--brand-2)}
.rh{display:inline-flex;align-items:center;gap:8px;font-family:var(--h);font-size:13.5px;flex-shrink:0}
.rh b{font-weight:600}
.rh svg{width:16px;height:16px;color:var(--brand)}
.rh .cnt{font-family:var(--b);font-weight:500;font-size:11.5px;color:var(--ink-3);background:var(--paper);border-radius:999px;padding:1px 7px}
.rchips{display:flex;gap:6px;overflow:hidden;min-width:0;flex:1;align-items:center}
.rchip{display:inline-flex;align-items:baseline;gap:6px;height:24px;padding:0 9px;border-radius:6px;background:var(--paper);border:1px solid var(--line);font-family:var(--mono);font-size:12px;white-space:nowrap;line-height:22px;flex-shrink:0;max-width:260px;overflow:hidden;text-overflow:ellipsis}
.rchip small{font-family:var(--b);color:var(--ink-3);font-size:11.5px}
.jc-refs .chev{margin-left:auto;color:var(--ink-3);transition:transform .2s;flex-shrink:0}
.jc-refs[open] .chev{transform:rotate(180deg)}
.jc-refs[open] .rchips{visibility:hidden}
.refs-b{padding:2px 16px 16px;border-top:1px solid var(--line-2)}
.refgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px 24px;margin:14px 0 0}
.refgrid dt{font-size:12px;color:var(--ink-3)}
.refgrid dd{margin:2px 0 0;font-family:var(--mono);font-size:13px;overflow-wrap:anywhere}
.refs-b>.muted{padding-top:12px}
.refs-f{margin-top:14px}
.orefs{display:flex;flex-direction:column;gap:8px}
.oref{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) 30px;gap:8px;align-items:center}

/* totals bar */
.tbar-wrap{position:sticky;top:var(--tbh,60px);z-index:30;margin:0 -6px;padding:6px 6px 0;background:var(--paper)}
.tbar{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);background:var(--deep);color:#fff;border-radius:var(--r);box-shadow:0 14px 30px -20px rgba(6,20,14,.75);overflow:hidden;position:relative;isolation:isolate}
.tbar::before{content:"";position:absolute;right:-80px;top:-120px;width:320px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(0,169,79,.38),transparent 70%);z-index:-1}
.tbar.sk-bar{height:74px;background:var(--deep-2)}
.tb-i{padding:11px 18px 12px;display:flex;flex-direction:column;gap:3px;border-left:1px solid rgba(255,255,255,.08);min-width:0;position:relative}
.tb-i:first-child{border-left:0}
.tb-l{font-family:var(--h);font-size:11px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.6);white-space:nowrap}
.tb-v{font-family:var(--h);font-weight:600;font-size:21px;letter-spacing:-.02em;font-variant-numeric:tabular-nums;white-space:nowrap;line-height:1.25;display:flex;align-items:baseline;gap:5px;min-width:0}
.tb-v .cur{font-size:10.5px;font-weight:500;color:rgba(255,255,255,.5);letter-spacing:.05em}
.tb-h{font-size:11px;color:rgba(255,255,255,.45);white-space:nowrap}
.tbar .m-good{color:#86e7b0}
.tbar .m-ok{color:#ffd27a}
.tbar .m-bad{color:#ff9a8f}
.tbar .mpill.big{height:28px;padding:0 12px;font-size:15px;align-self:center}
.tbar .mpill.m-good{background:rgba(0,169,79,.22);color:#9af0bf}
.tbar .mpill.m-ok{background:rgba(240,160,32,.2);color:#ffd889}
.tbar .mpill.m-bad{background:rgba(229,72,77,.22);color:#ffaaa1}
.tbar .mpill{background:rgba(255,255,255,.1);color:#fff}
.tb-aw{display:inline-flex;align-items:center;gap:6px;color:#ffd27a;font-size:17px}
.tb-aw svg,.tb-none svg{width:16px;height:16px}
.tb-none{display:inline-flex;align-items:center;gap:6px;color:rgba(255,255,255,.62);font-size:15px;font-weight:500}
.tb-i.warn{background:rgba(240,160,32,.08)}
.tb-i.bump .tb-v{animation:bump .9s ease}
.tb-i.bump::after{content:"";position:absolute;left:18px;right:18px;bottom:0;height:2px;border-radius:2px;background:var(--lime);animation:fadeout 1.2s forwards}
@keyframes bump{0%{color:var(--lime);transform:translateY(-3px)}60%{color:var(--lime)}100%{transform:none}}
@keyframes fadeout{from{opacity:1}to{opacity:0}}

/* page tabs */
.ptabs{display:flex;gap:2px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.ptabs::-webkit-scrollbar{display:none}
.ptabs button{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 14px;border:0;background:none;font-family:var(--h);font-weight:500;font-size:13.5px;color:var(--ink-3);position:relative;white-space:nowrap;border-radius:8px 8px 0 0}
.ptabs button:hover{color:var(--ink);background:rgba(255,255,255,.7)}
.ptabs button[aria-selected="true"]{color:var(--ink)}
.ptabs button[aria-selected="true"]::after{content:"";position:absolute;left:10px;right:10px;bottom:-1px;height:2px;border-radius:2px 2px 0 0;background:var(--brand)}
.ptabs button svg{width:16px;height:16px}
.ptabs button[aria-selected="true"] svg{color:var(--brand)}
.ptabs .cnt{font-family:var(--b);font-size:11.5px;background:var(--paper-2);border-radius:999px;padding:0 7px;line-height:18px;color:var(--ink-2)}
.ptabs button:focus-visible{outline-offset:-2px}
[role=tabpanel]{min-width:0}
#pn-lines{display:flex;flex-direction:column;gap:14px}
#pn-lines[hidden]{display:none}

/* fast line entry */
.entry{padding:14px 18px 12px;border-color:#cfe3d6;box-shadow:0 1px 2px rgba(6,20,14,.04),0 14px 30px -22px rgba(17,138,77,.55)}
.en-h{display:flex;align-items:center;gap:12px;margin-bottom:10px;flex-wrap:wrap}
.en-h h2{font-size:14.5px;font-weight:600;display:flex;align-items:center;gap:8px}
.en-h h2 svg{width:17px;height:17px;color:#fff;background:var(--brand);border-radius:6px;padding:2px}
.en-keys{margin-left:auto;display:flex;gap:16px;color:var(--ink-3);font-size:12px;flex-wrap:wrap}
.en-grid{display:grid;grid-template-columns:150px minmax(190px,1.15fr) minmax(190px,1.6fr) 96px 104px 120px 120px;grid-template-areas:"date code text qty uom sell cost" "vendor vendor pc pc vat go go";gap:10px 12px;align-items:start}
.entry.nocost .en-grid{grid-template-columns:150px minmax(190px,1.15fr) minmax(190px,1.6fr) 96px 104px 130px;grid-template-areas:"date code text qty uom sell" "vendor vendor pc vat vat go"}
.en-grid .field,.lform .field{gap:4px}
.en-grid .lbl{font-size:12px}
.en-grid .inp{height:36px;font-size:13.5px}
.inp.num{text-align:right;font-variant-numeric:tabular-nums}
.f-date{grid-area:date}.f-code{grid-area:code}.f-text{grid-area:text}.f-qty{grid-area:qty}.f-uom{grid-area:uom}.f-sell{grid-area:sell}.f-cost{grid-area:cost}.f-vendor{grid-area:vendor}.f-pc{grid-area:pc}.f-vat{grid-area:vat}
.en-go{grid-area:go;align-self:end}
.en-go .btn{width:100%;height:36px}
.pcd{color:var(--ink-4)!important}
.pcd.chg{color:var(--amber)!important}
.vnote{font-size:12px}
.vnote.bad{color:var(--red)}
.vnote.due{color:var(--amber)}
.cws{margin-top:10px;background:var(--amber-bg);border:1px solid var(--amber-line);border-radius:10px;padding:10px 12px;gap:6px}
.cws-in{display:flex;align-items:center;gap:10px}
.cws-in svg{width:17px;height:17px;color:var(--amber);flex-shrink:0}
.cws-in .lbl{white-space:nowrap;color:var(--amber);font-size:13px}
.cws-in .inp{flex:1;background:#fff;height:36px}
.cws .hint{padding-left:27px}
.en-f{display:flex;align-items:center;gap:12px;margin-top:10px;padding-top:10px;border-top:1px dashed var(--line);min-height:44px;flex-wrap:wrap}
.en-prev{flex:1;display:flex;gap:20px;font-size:13px;color:var(--ink-3);align-items:center;flex-wrap:wrap;min-width:0}
.en-prev b{color:var(--ink);font-weight:600;font-family:var(--h);margin-left:4px}
.en-prev .mpill{margin-left:4px}
.pv-bad{color:var(--red);display:inline-flex;gap:6px;align-items:center}
.pv-bad svg{width:14px;height:14px}
.en-err{color:var(--red);font-size:13px;font-weight:500;display:flex;gap:6px;align-items:flex-start}
.en-err::before{content:"";width:14px;height:14px;flex-shrink:0;margin-top:2px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b42318' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 8v5M12 16v.01'/%3E%3C/svg%3E") center/14px no-repeat}
.en-err[hidden]{display:none}
.cws.bad{border-color:var(--red)}
.cws.bad .inp{border-color:var(--red);box-shadow:0 0 0 3px rgba(180,35,24,.1)}
.en-ok{color:var(--brand-2);font-size:13px;font-weight:500}
.en-ok:empty{display:none}
.en-off{display:flex;align-items:center;gap:10px;background:var(--violet-bg);border:1px solid var(--violet-line);border-radius:var(--r);padding:12px 14px;font-size:13.5px;color:var(--ink-2)}
.en-off svg{width:17px;height:17px;color:var(--violet)}
.lform{display:grid;grid-template-columns:150px minmax(0,1fr) minmax(0,1fr);gap:12px;grid-template-areas:"date code code" "text text text" "qty uom sell" "cost vendor vendor" "pc pc vat"}
.lform.nocost{grid-template-areas:"date code code" "text text text" "qty uom sell" "vendor vendor vendor" "pc pc vat"}
.dlg-prev{background:var(--paper);border-radius:10px;padding:10px 12px;flex:none}
.dlg-prev:empty{display:none}

/* lines */
.lines-card{overflow:visible}
.lgrid2{display:grid;grid-template-columns:112px minmax(0,1fr) 112px 100px 112px 100px 112px 40px;column-gap:14px;align-items:start}
.lgrid2.nocost{grid-template-columns:112px minmax(0,1fr) 112px 100px 112px 40px}
.ll-h{padding:0 16px;height:36px;align-items:center;background:var(--paper);border-bottom:1px solid var(--line);border-radius:var(--r) var(--r) 0 0;font-family:var(--h);font-size:11px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3)}
.day-h{display:flex;align-items:center;gap:10px;padding:9px 16px;background:#f8fbf8;border-bottom:1px solid var(--line-2);flex-wrap:wrap}
.day+.day .day-h{border-top:1px solid var(--line)}
.day-h .sp{flex:1}
.day-n{font-family:var(--h);font-weight:600;font-size:13.5px}
.day-d{font-size:12.5px;color:var(--ink-3)}
.day-c{font-size:11.5px;color:var(--ink-3);background:#fff;border:1px solid var(--line);border-radius:999px;padding:0 8px;line-height:18px}
.day-t{font-size:12.5px;color:var(--ink-3);display:flex;align-items:center;gap:8px}
.day-t b{font-weight:600;color:var(--ink)}
.day-t b.m-good{color:var(--brand-2)}.day-t b.m-ok{color:var(--amber)}.day-t b.m-bad{color:var(--red)}
.day-t i{width:3px;height:3px;border-radius:50%;background:var(--ink-4)}
.ln{position:relative;padding:10px 16px;border-bottom:1px solid var(--line-2);font-size:13.5px}
.day:last-of-type .ln:last-child{border-bottom:0}
.ln:hover{background:#fafcfa}
.ln>.num{text-align:right;padding-top:2px}
.ln-code{padding-top:1px;min-width:0}
.ln-desc{min-width:0}
.ln-desc b{font-weight:500;display:block;overflow-wrap:anywhere}
.ln-desc small{display:flex;gap:7px;align-items:center;flex-wrap:wrap;color:var(--ink-3);font-size:12px;margin-top:2px}
.ln-desc small i{width:3px;height:3px;border-radius:50%;background:var(--ink-4)}
.ln-v{display:inline-flex;align-items:center;gap:4px}
.ln-v svg{width:13px;height:13px}
.ln-note{display:block;font-size:12.5px;color:var(--ink-2);background:var(--note);border:1px solid var(--note-line);border-radius:6px;padding:2px 7px;margin-top:5px;white-space:pre-wrap;width:fit-content;max-width:100%;overflow-wrap:anywhere}
.ln-chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.lchip{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 8px;border-radius:999px;font-size:11.5px;font-weight:500;background:var(--grey-bg);color:var(--grey);white-space:nowrap}
.lchip svg{width:12px;height:12px}
.lchip.wait{background:var(--amber-bg);color:var(--amber);border:1px solid var(--amber-line)}
.lchip.ok{background:var(--brand-3);color:var(--brand-2)}
.lchip.tr{background:var(--violet-bg);color:var(--violet)}
.lchip.lk{background:var(--paper-2);color:var(--ink-2)}
.lchip.dead{background:var(--red-bg);color:var(--red)}
.ln-q small{margin-left:4px;color:var(--ink-3);font-size:11px;font-family:var(--mono)}
.ln-a{font-weight:600}
.ln-cr{color:var(--ink-3)}
.ln-ca{color:var(--ink-2);font-weight:500}
.ln-act{display:flex;justify-content:flex-end;margin-top:-4px}
.lk-ic{color:var(--ink-4);display:grid;place-items:center;width:30px;height:30px}
.lk-ic svg{width:15px;height:15px}
.ln.is-wait{box-shadow:inset 3px 0 0 var(--amber-dot)}
.ln.is-locked .ln-code .code{background:var(--paper-2);color:var(--ink-2)}
.ln.is-dead{opacity:.62}
.ln.is-dead .ln-desc b,.ln.is-dead .num{text-decoration:line-through;text-decoration-color:rgba(0,0,0,.35)}
.ln.flash{animation:flash 2.4s ease}
@keyframes flash{0%,30%{background:#f4f7c4}100%{background:transparent}}
.dead{border-top:1px solid var(--line)}
.dead summary{list-style:none;display:flex;align-items:center;gap:8px;padding:10px 16px;cursor:pointer;font-family:var(--h);font-weight:500;font-size:13px;color:var(--ink-2);background:var(--paper);border-radius:0 0 var(--r) var(--r)}
.dead[open] summary{border-radius:0;border-bottom:1px solid var(--line-2)}
.dead summary::-webkit-details-marker{display:none}
.dead summary svg{width:15px;height:15px;color:var(--ink-3)}
.dead summary small{font-family:var(--b);font-weight:400;color:var(--ink-3)}
.dead summary .chev{margin-left:auto;transition:transform .2s}
.dead[open] summary .chev{transform:rotate(180deg)}

/* profit */
.profit .card-h{padding-bottom:4px}
.pf-t{padding:4px 16px 0}
.pf-r{display:grid;grid-template-columns:minmax(0,1.7fr) 60px repeat(3,minmax(0,1fr)) 92px;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line-2);font-size:13.5px}
.pf-r.nocost{grid-template-columns:minmax(0,1.7fr) 60px minmax(0,1fr) minmax(0,1fr)}
.pf-h{font-family:var(--h);font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-3);padding:8px 0}
.pf-n b{font-family:var(--mono);font-size:12.5px;font-weight:600}
.pf-n small{display:block;color:var(--ink-3);font-size:12.5px}
.pf-bar{display:block;height:4px;border-radius:4px;background:var(--paper-2);margin-top:7px;overflow:hidden;max-width:260px}
.pf-bar i{display:block;height:100%;background:var(--grad);border-radius:4px;width:0;transition:width .5s ease}
.pf-tot{border-bottom:0;background:var(--paper);margin:0 -16px;padding:13px 16px;border-top:1px solid var(--line)}
.pf-note{display:flex;gap:8px;align-items:center;padding:12px 16px;font-size:12.5px;color:var(--ink-3);border-top:1px solid var(--line-2)}
.pf-note svg{width:15px;height:15px;flex-shrink:0}
.tl-ic.k-ok{background:var(--brand-3);border-color:#bfe3cc;color:var(--brand-2)}
.tl-ic.k-bad{background:var(--red-bg);border-color:var(--red-line);color:var(--red)}
.tl-ic.k-wait{background:var(--amber-bg);border-color:var(--amber-line);color:var(--amber)}
.doc .lic{flex-shrink:0}
.upmeta{display:grid;grid-template-columns:220px 200px minmax(0,1fr);gap:12px;align-items:end;margin-top:14px;padding-top:14px;border-top:1px solid var(--line-2)}
.upmeta .hint{padding-bottom:10px}

/* companies */
.cstats{grid-template-columns:repeat(4,minmax(0,1fr))}
.cgrid{display:grid;grid-template-columns:minmax(0,2fr) 150px 170px 140px 200px;column-gap:14px;align-items:center}
.c-co{display:flex;align-items:center;gap:12px;min-width:0}
.c-role{display:flex;gap:4px;flex-wrap:wrap}
.c-trn{font-size:12.5px;color:var(--ink-2)}
.c-city{font-size:13px;color:var(--ink-2)}
.c-jobs{text-align:right;color:var(--ink-2)}
.lr.off{background:#fafbfa}
.lr.off .c-sub b{color:var(--ink-3)}
.people{margin-bottom:12px}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:8px;padding:10px 16px 16px}
.pcard{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;text-decoration:none;color:var(--ink);min-width:0}
.pcard:hover{border-color:var(--brand);color:var(--ink);background:#fbfdfb}
.pcard>span{min-width:0}
.pcard b{display:block;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pcard small{display:block;color:var(--ink-3);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#co,#pp{display:flex;flex-direction:column;gap:14px}
.ent-head{display:flex;align-items:center;gap:16px;padding:18px 20px}
.eh-main{flex:1;min-width:0}
.eh-main h1{font-size:22px;font-weight:600;letter-spacing:-.02em;margin-bottom:6px;overflow-wrap:anywhere}
.eh-main p{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:13.5px}
.eh-main p a{font-weight:500}
.eh-facts{margin-top:10px;color:var(--ink-3);font-size:13px;column-gap:18px!important}
.eh-facts b{color:var(--ink);font-weight:500}
.eh-facts>span{display:inline-flex;align-items:center;gap:5px}
.eh-facts svg{width:14px;height:14px}
.eh-acts{display:flex;gap:8px;flex-wrap:wrap;align-self:flex-start}
.kv.kv2{grid-template-columns:auto minmax(0,1fr) auto minmax(0,1fr);column-gap:22px}
.rolepick{display:flex;gap:8px}
.rolepick .check{flex:1}
.fcard .fsec .field label small svg{width:12px;height:12px;display:inline;vertical-align:-1px}
.emps{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.emp{border:1px solid var(--line);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:8px;min-width:0}
.emp.past{background:#fafbfa}
.emp-h{display:flex;align-items:center;gap:10px}
.emp-n{flex:1;min-width:0}
.emp-n a{color:var(--ink);text-decoration:none}
.emp-n a:hover b{color:var(--brand-2)}
.emp-n b{font-family:var(--h);font-weight:600;font-size:14px}
.emp-n small{display:block;color:var(--ink-3);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.emp-n .poc{margin-top:4px}
.poc{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:500;color:#7a6000;background:var(--note);border:1px solid var(--note-line);border-radius:999px;padding:0 8px;line-height:20px;white-space:nowrap}
.poc svg{width:12px;height:12px}
.emp-b{display:flex;flex-direction:column}
.emp-b .cline{padding:4px 8px}
.emp-d{font-size:12px;color:var(--ink-3);display:flex;gap:6px;align-items:center;padding-top:8px;border-top:1px solid var(--line-2)}
.emp-d svg{width:13px;height:13px}
.mini .mrow{display:grid;grid-template-columns:130px minmax(0,1fr) 122px 110px 76px;gap:14px;align-items:center;padding:11px 16px;border-bottom:1px solid var(--line-2);text-decoration:none;color:var(--ink)}
.mini .mrow.nocost{grid-template-columns:130px minmax(0,1fr) 122px 110px}
.mini .mrow.mtkt{grid-template-columns:130px minmax(0,1fr) 160px}
.mini .mrow:last-child{border-bottom:0}
.mini .mrow:hover{background:#f8faf8;color:var(--ink)}
.mini .mrow>.num{text-align:right}
.mini .mrow>span:last-child{text-align:right}
.mini .c-sub b{font-size:13.5px}
.pp-grid{display:grid;grid-template-columns:360px minmax(0,1fr);gap:14px;align-items:start}
.pp-grid>.stack{gap:14px}
.etl{list-style:none;margin:0;padding:0;position:relative}
.etl::before{content:"";position:absolute;left:7px;top:8px;bottom:14px;width:2px;background:var(--line)}
.etl-i{position:relative;padding:0 0 18px 30px}
.etl-i:last-child{padding-bottom:0}
.etl-dot{position:absolute;left:0;top:3px;width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid var(--line-3)}
.etl-i.now .etl-dot{border-color:var(--brand);background:var(--brand);box-shadow:0 0 0 4px var(--brand-3)}
.etl-h{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.etl-h a{color:var(--ink);text-decoration:none}
.etl-h a:hover b{color:var(--brand-2)}
.etl-h b{font-family:var(--h);font-weight:600;font-size:14.5px}
.etl-h .chip{height:22px;font-size:11.5px}
.etl-s{color:var(--ink-2);font-size:13px;margin-top:2px}
.etl-d{color:var(--ink-3);font-size:12.5px;margin-top:2px;font-variant-numeric:tabular-nums}
.etl-x{font-size:12.5px;color:var(--ink-3);margin-top:4px;overflow-wrap:anywhere}
.etl-a{display:flex;gap:16px;margin-top:6px;font-size:12.5px}

/* approvals */
.alist{display:flex;flex-direction:column;gap:12px}
.ap{padding:14px 18px 16px;border-left:4px solid var(--amber-dot)}
.ap.k-line_transfer{border-left-color:#7a4fe0}
.ap.done{border-left-color:var(--line-3)}
.ap-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ap-top .sp{flex:1}
.kchip{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:999px;font-size:12px;font-weight:600;font-family:var(--h);white-space:nowrap}
.kchip svg{width:13px;height:13px}
.kchip.k-cost_without_sell{background:var(--amber-bg);color:var(--amber)}
.kchip.k-line_transfer{background:var(--violet-bg);color:var(--violet)}
.ap-job{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line-3)}
.ap-job:hover{color:var(--brand-2);border-color:var(--brand)}
.ap-cl{color:var(--ink-3);font-size:13px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:0 1 auto}
.ap-age{color:var(--ink-3);font-size:12.5px;white-space:nowrap}
.ast{font-size:11.5px;font-weight:600;padding:2px 9px;border-radius:999px;background:var(--grey-bg);color:var(--grey)}
.ast-approved{background:var(--brand-3);color:var(--brand-2)}
.ast-rejected{background:var(--red-bg);color:var(--red)}
.ap-line{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;margin-top:12px;padding:11px 14px;background:var(--paper);border:1px solid var(--line-2);border-radius:10px}
.ap-ld b{font-weight:500;display:block;overflow-wrap:anywhere}
.ap-ld small{color:var(--ink-3);font-size:12.5px}
.ap-amt{display:flex;gap:24px;margin:0}
.ap-amt dt{font-family:var(--h);font-size:10.5px;font-weight:500;color:var(--ink-3);text-transform:uppercase;letter-spacing:.05em;text-align:right}
.ap-amt dd{margin:0;font-family:var(--h);font-weight:600;font-size:16px;text-align:right}
.ap-move{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:13.5px;color:var(--ink-2);flex-wrap:wrap}
.ap-move>svg{width:16px;height:16px;color:var(--violet)}
.ap-move a{color:var(--ink)}
.ap-why{display:flex;gap:10px;margin-top:12px;align-items:flex-start}
.ap-who{font-size:12.5px;color:var(--ink-3)}
.ap-who b{color:var(--ink);font-weight:500}
.ap-why blockquote{margin:2px 0 0;font-size:14px;color:var(--ink);line-height:1.5;overflow-wrap:anywhere}
.ap-why blockquote::before{content:"“"}
.ap-why blockquote::after{content:"”"}
.ap-dec{display:flex;gap:8px;align-items:flex-start;margin-top:12px;font-size:13px;color:var(--ink-2);padding-top:10px;border-top:1px solid var(--line-2)}
.ap-dec svg{width:16px;height:16px;flex-shrink:0;margin-top:1px;color:var(--ink-3)}
.ap-dec b{font-weight:500;color:var(--ink)}
.ap-acts{display:flex;gap:8px;align-items:center;margin-top:12px;padding-top:12px;border-top:1px solid var(--line-2)}
.ap-acts .sp{flex:1}
.alist.loading .ap{opacity:.55}

/* admin masters */
.subnav{display:flex;gap:2px;border-bottom:1px solid var(--line);margin-bottom:14px;overflow-x:auto;scrollbar-width:none}
.subnav::-webkit-scrollbar{display:none}
.subnav a{display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 12px;font-family:var(--h);font-weight:500;font-size:13px;color:var(--ink-3);text-decoration:none;position:relative;white-space:nowrap}
.subnav a:hover{color:var(--ink)}
.subnav a[aria-current="page"]{color:var(--ink)}
.subnav a[aria-current="page"]::after{content:"";position:absolute;left:10px;right:10px;bottom:-1px;height:2px;border-radius:2px 2px 0 0;background:var(--brand)}
.subnav svg{width:15px;height:15px}
.subnav a[aria-current="page"] svg{color:var(--brand)}
.msearch{position:relative;width:260px}
.msearch svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--ink-3);width:15px;height:15px;pointer-events:none}
.msearch .inp{height:34px;padding-left:32px;border-radius:9px}
.mgrid{display:grid;gap:14px;align-items:center}
.g-codes{grid-template-columns:120px minmax(0,1.6fr) minmax(0,1fr) 60px 84px minmax(0,1fr) 124px 80px}
.g-wh{grid-template-columns:minmax(0,1.6fr) 84px minmax(0,1fr) 100px 96px 124px 80px}
.g-sp{grid-template-columns:minmax(0,1.2fr) 150px minmax(0,1.2fr) minmax(0,1fr) 124px 80px}
.g-act{grid-template-columns:minmax(0,1.1fr) minmax(0,.8fr) minmax(0,1.6fr) minmax(0,1fr) 124px 80px}
.g-uom{grid-template-columns:100px minmax(0,1fr) 160px 90px 124px}
.g-pc{grid-template-columns:110px minmax(0,1.4fr) 190px minmax(0,1fr) 124px}
.mgrid>span{min-width:0}
.ur.mgrid>span{font-size:13.5px}
.mgrid>.code{justify-self:start}
.tgl-l{line-height:20px}
.m-n b{display:block;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.m-n small{display:block;color:var(--ink-3);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ur.off .code{background:var(--paper-2);color:var(--ink-3)}
.ur.off .m-n b{color:var(--ink-3)}
.ur .u-who b{font-weight:500}
.tgl{display:inline-flex;align-items:center;gap:8px;border:0;background:none;padding:3px 4px 3px 2px;border-radius:999px;font-size:12.5px;color:var(--ink-2)}
.tgl-t{width:34px;height:20px;border-radius:999px;background:var(--line-3);position:relative;transition:background .15s;flex-shrink:0}
.tgl-t::after{content:"";position:absolute;left:2px;top:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.25);transition:transform .15s}
.tgl[aria-checked="true"] .tgl-t{background:var(--brand)}
.tgl[aria-checked="true"] .tgl-t::after{transform:translateX(14px)}
.tgl[aria-checked="false"] .tgl-l{color:var(--ink-3)}
.tgl:disabled{opacity:.5}

/* responsive (operations) */
@media (max-width:1320px){
  .jstats{grid-template-columns:repeat(5,minmax(0,1fr))}
  .jgrid{grid-template-columns:118px minmax(0,1fr) 140px 116px 40px 122px 104px 70px;column-gap:12px}
  .jgrid.nocost{grid-template-columns:118px minmax(0,1fr) 140px 116px 40px 122px 104px}
  .lgrid2{grid-template-columns:104px minmax(0,1fr) 100px 92px 104px 92px 104px 36px;column-gap:12px}
  .lgrid2.nocost{grid-template-columns:104px minmax(0,1fr) 100px 92px 104px 36px}
  .en-grid{grid-template-columns:140px minmax(170px,1.1fr) minmax(170px,1.4fr) 88px 96px 110px 110px}
  .entry.nocost .en-grid{grid-template-columns:140px minmax(170px,1.1fr) minmax(170px,1.4fr) 88px 96px 120px}
  .tb-v{font-size:19px}
}
@media (max-width:1180px){
  .jgrid{grid-template-columns:112px minmax(0,1fr) 112px 40px 118px 100px 66px}
  .jgrid.nocost{grid-template-columns:112px minmax(0,1fr) 112px 40px 118px 100px}
  .jgrid .c-svc,.jgrid.lh>span:nth-child(3){display:none}
  .cgrid{grid-template-columns:minmax(0,2fr) 140px 160px 190px}
  .cgrid .c-city,.cgrid.lh>span:nth-child(4){display:none}
  .en-grid{grid-template-columns:repeat(6,minmax(0,1fr));grid-template-areas:"date code code text text text" "qty uom sell cost vendor vendor" "pc pc vat vat go go"}
  .entry.nocost .en-grid{grid-template-columns:repeat(6,minmax(0,1fr));grid-template-areas:"date code code text text text" "qty uom sell vendor vendor vendor" "pc pc vat vat go go"}
  .tbar{grid-auto-flow:row;grid-template-columns:repeat(3,minmax(0,1fr))}
  .tbar .tb-i:nth-child(4){border-left:0}
  .tbar .tb-i:nth-child(n+4){border-top:1px solid rgba(255,255,255,.08)}
  .pp-grid{grid-template-columns:300px minmax(0,1fr)}
  .g-codes{grid-template-columns:110px minmax(0,1.6fr) 60px 70px minmax(0,1fr) 120px 76px}
  .g-codes>span:nth-child(3){display:none}
}
@media (max-width:960px){
  .jstats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .cstats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lh.jgrid,.lh.cgrid{display:none}
  .lr.jgrid{display:grid;grid-template-columns:minmax(0,1fr) auto auto;grid-template-areas:"top top top" "sub sub sub" "dl amt mg";row-gap:6px;column-gap:10px;padding:14px 16px}
  .lr.jgrid.nocost{grid-template-areas:"top top top" "sub sub sub" "dl amt amt"}
  .lr.jgrid>.c-num,.lr.jgrid>.c-st,.lr.jgrid>.c-svc,.lr.jgrid>.c-as{display:none}
  .lr.jgrid .c-sub{grid-area:sub}
  .lr.jgrid .c-dl{grid-area:dl;flex-direction:row;gap:6px;align-items:baseline;min-width:0;overflow:hidden}
  .lr.jgrid .c-amt{grid-area:amt;align-self:center}
  .lr.jgrid .c-mg{grid-area:mg;align-self:center}
  .lr.cgrid{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"co co" "role lic";row-gap:8px;padding:14px 16px}
  .lr.cgrid>.c-co{grid-area:co}.lr.cgrid>.c-role{grid-area:role}.lr.cgrid>.c-lic{grid-area:lic}
  .lr.cgrid>.c-trn,.lr.cgrid>.c-city,.lr.cgrid>.c-jobs{display:none}
  .lgrid2{grid-template-columns:96px minmax(0,1fr) 92px 86px 96px 86px 96px 34px}
  .pp-grid{grid-template-columns:minmax(0,1fr)}
  .kv.kv2{grid-template-columns:auto minmax(0,1fr)}
  .mgrid{display:flex;flex-wrap:wrap;gap:6px 14px}
  .ulist .uh.mgrid{display:none}
  .ur.mgrid>span:first-child,.ur.mgrid>.m-n{flex-basis:100%}
  .ur.mgrid .u-act{margin-left:auto}
  .upmeta{grid-template-columns:1fr 1fr}
  .upmeta .hint{grid-column:1/-1;padding:0}
}
@media (max-width:760px){
  .jstats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .jstats .mywork{grid-column:1/-1}
  .crumbs{margin-bottom:8px}
  .jc{gap:12px}
  .jc-head{padding:14px 14px 16px}
  .jc-top .sp{display:none}
  .jc-actions{flex-basis:100%;order:9}
  .jc-actions .btn:not(.btn-icon){flex:1}
  .jc-title{font-size:19px;margin:10px 0 12px}
  .jc-meta{grid-template-columns:1fr 1fr;gap:12px 14px}
  .jc-refs summary{padding:11px 14px}
  .rchips{display:none}
  .refgrid{grid-template-columns:1fr 1fr}
  .tbar-wrap{margin:0 -16px;padding:0}
  .tbar{display:flex;overflow-x:auto;scrollbar-width:none;border-radius:0;grid-template-columns:none}
  .tbar::-webkit-scrollbar{display:none}
  .tb-i{flex:0 0 auto;padding:8px 14px 9px;border-top:0!important;border-left:1px solid rgba(255,255,255,.08)!important}
  .tb-i:first-child{border-left:0!important;padding-left:16px}
  .tb-v{font-size:16.5px}
  .tb-l{font-size:10px}
  .tb-h{display:none}
  .tb-aw{font-size:14.5px}
  .tb-none{font-size:13.5px}
  .tbar .mpill.big{height:22px;font-size:12.5px;padding:0 8px}
  .ptabs button{padding:0 11px;font-size:13px}
  .ptabs{margin:0 -16px;padding:0 10px}
  .entry{padding:14px}
  .en-keys{display:none}
  .en-grid,.entry.nocost .en-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"date date" "code code" "text text" "qty uom" "sell cost" "vendor vendor" "pc pc" "vat vat" "go go";gap:10px}
  .entry.nocost .en-grid{grid-template-areas:"date date" "code code" "text text" "qty uom" "sell sell" "vendor vendor" "pc pc" "vat vat" "go go"}
  .en-grid .inp{height:40px;font-size:15px}
  .en-go .btn{height:44px;font-size:14.5px}
  .cws-in{flex-wrap:wrap}
  .cws-in .lbl{white-space:normal}
  .cws .hint{padding-left:0}
  .en-f{flex-direction:column;align-items:stretch}
  .en-prev{gap:12px}
  .lform,.lform.nocost{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"date date" "code code" "text text" "qty uom" "sell cost" "vendor vendor" "pc pc" "vat vat"}
  .lform.nocost{grid-template-areas:"date date" "code code" "text text" "qty uom" "sell sell" "vendor vendor" "pc pc" "vat vat"}
  .ll-h{display:none}
  .lgrid2,.lgrid2.nocost{grid-template-columns:repeat(3,minmax(0,1fr)) 34px;grid-template-areas:"code code code act" "desc desc desc desc" "q r a a" "x cr ca ca";row-gap:8px;column-gap:10px}
  .lgrid2.nocost{grid-template-areas:"code code code act" "desc desc desc desc" "q r a a"}
  .ln{padding:12px 14px}
  .ln-code{grid-area:code}.ln-desc{grid-area:desc}.ln-q{grid-area:q}.ln-r:not(.ln-cr){grid-area:r}.ln-a:not(.ln-ca){grid-area:a}.ln-cr{grid-area:cr}.ln-ca{grid-area:ca}.ln-act{grid-area:act}
  .ln>.num{text-align:left;display:flex;flex-direction:column;background:var(--paper);border-radius:8px;padding:5px 8px}
  .ln>.num .m-lbl{font-size:10.5px;font-family:var(--h);font-weight:500;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-3);text-decoration:none}
  .ln>.num small{display:none}
  .ln-a:not(.ln-ca){background:var(--brand-3)!important}
  .day-h{padding:9px 14px}
  .day-h .sp{display:none}
  .day-t{flex-basis:100%}
  .pf-h{display:none}
  .pf-r,.pf-r.nocost{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:6px}
  .pf-r .pf-n{grid-column:1/-1}
  .pf-r>span.r{text-align:left}
  .pf-r .m-lbl{display:block;font-size:10.5px;font-family:var(--h);text-transform:uppercase;letter-spacing:.04em;color:var(--ink-3)}
  .pf-tot>span:first-child{grid-column:1/-1}
  .ent-head{flex-wrap:wrap;padding:16px}
  .eh-main h1{font-size:19px}
  .eh-acts{flex-basis:100%}
  .emps{grid-template-columns:minmax(0,1fr)}
  .mini .mrow,.mini .mrow.nocost{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"num st" "sub sub" "amt mg";row-gap:4px}
  .mini .mrow>.c-num{grid-area:num}.mini .mrow>.c-sub{grid-area:sub}.mini .mrow>.st{grid-area:st}.mini .mrow>.num{grid-area:amt;text-align:left}.mini .mrow>span:last-child:not(.num):not(.c-sub){grid-area:mg}
  .mini .mrow.mtkt{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"num st" "sub sub"}
  .mini .mrow.mtkt>span:last-child{grid-area:st}
  .ap{padding:14px}
  .ap-cl{flex-basis:100%;order:5;white-space:normal}
  .ap-line{grid-template-columns:auto minmax(0,1fr);grid-template-areas:"code desc" "amt amt"}
  .ap-line>.code{grid-area:code}.ap-line>.ap-ld{grid-area:desc}.ap-line>.ap-amt{grid-area:amt;justify-content:flex-start}
  .ap-amt dt,.ap-amt dd{text-align:left}
  .ap-acts .btn{flex:1}
  .ap-acts .sp{display:none}
  .msearch{width:100%;flex-shrink:0}
  .upmeta{grid-template-columns:minmax(0,1fr)}
  .oref{grid-template-columns:minmax(0,1fr) 30px}
  .oref input:nth-child(2){grid-column:1}
  .oref button{grid-row:1/3;grid-column:2}
  .suggest{flex-wrap:wrap;margin:14px 16px 0}
  .chips{overflow-x:auto}
  .rolepick{flex-direction:column}
}

.dlg .ta-pop{position:static;width:auto;max-width:none;max-height:240px;margin-top:4px;box-shadow:var(--sh-2)}
.pp-grid .mini .mrow,.pp-grid .mini .mrow.nocost{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"num st" "sub sub" "amt mg";row-gap:4px}
.pp-grid .mini .mrow>.c-num{grid-area:num}.pp-grid .mini .mrow>.c-sub{grid-area:sub}.pp-grid .mini .mrow>.st{grid-area:st}.pp-grid .mini .mrow>.num{grid-area:amt;text-align:left}.pp-grid .mini .mrow>span:last-child:not(.num):not(.c-sub){grid-area:mg}
.pp-grid .mini .mrow.mtkt{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"num st" "sub sub"}
.pp-grid .mini .mrow.mtkt>span:last-child{grid-area:st}
@media (max-width:760px){
  .ln>.num.ln-q small{display:inline;margin-left:0}
  .ln>.num.ln-q{display:block}
  .ln>.num.ln-q .m-lbl{display:block}
  .jstats .stat:nth-child(5){grid-column:span 2}
}
.ap-move>span:not(.lic){flex:1;min-width:0}
@media (max-width:960px){.ur.mgrid>.code:first-child{flex-basis:auto}}

/* approval control states */
.lchip.need{background:var(--red-bg);color:var(--red);border:1px solid var(--red-line)}
.lchip-note{font-size:11.5px;color:var(--ink-3);align-self:center}
.lchip-btn{height:22px;padding:0 9px;border-radius:999px;border:1px solid var(--brand);background:#fff;color:var(--brand-2);font-size:11.5px;font-weight:600;font-family:var(--h)}
.lchip-btn:hover{background:var(--brand-3)}
.ln.is-need{box-shadow:inset 3px 0 0 var(--red)}
.st-hint{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;border-radius:8px;background:var(--amber-bg);border:1px solid var(--amber-line);color:var(--amber);font-size:12.5px;font-weight:500;white-space:nowrap}
.st-hint svg{width:14px;height:14px}
.ap-wait{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--ink-3);font-weight:500}
.ap-wait svg{width:15px;height:15px}
@media (max-width:760px){.st-hint{flex-basis:100%;justify-content:center}}

/* ================================================================ operations, phase B */
/* top bar: expiry bell, tighter navigation */
.tb-bell{position:relative;display:grid;place-items:center;width:38px;height:38px;border-radius:10px;color:rgba(255,255,255,.8);flex-shrink:0;text-decoration:none}
.tb-bell:hover{background:rgba(255,255,255,.08);color:#fff}
.tb-bell[aria-current="page"]{background:rgba(255,255,255,.12);color:#fff}
.tb-bell svg{width:19px;height:19px}
.tb-bell .nbadge{position:absolute;top:1px;right:-1px;min-width:17px;height:17px;font-size:10.5px;background:var(--amber-dot);color:var(--deep);box-shadow:0 0 0 2px var(--deep)}
.tb-bell.hot .nbadge{background:#ff6b5e;color:#fff}
.tb-bell:focus-visible{outline-color:var(--lime)}

/* status chips for contracts and LPOs */
.st-draft::before{background:#9aa6a0;box-shadow:0 0 0 3px rgba(154,166,160,.18)}
.st-sent::before,.st-released::before{background:#2f6fdf;box-shadow:0 0 0 3px rgba(47,111,223,.16)}
.st-approved::before{background:#7a4fe0;box-shadow:0 0 0 3px rgba(122,79,224,.16)}
.st-signed::before,.st-vendor_agreed::before{background:var(--green);box-shadow:0 0 0 3px rgba(0,169,79,.16)}
.st-expired::before{background:var(--red);box-shadow:0 0 0 3px rgba(180,35,24,.14)}
.chip.st-draft{background:var(--grey-bg);color:var(--grey)}
.chip.st-sent,.chip.st-released{background:var(--blue-bg);color:var(--blue)}
.chip.st-approved{background:var(--violet-bg);color:var(--violet)}
.chip.st-signed,.chip.st-vendor_agreed{background:var(--brand-3);color:var(--brand-2)}
.chip.st-expired{background:var(--red-bg);color:var(--red)}

/* shared bits */
.ro-banner.info-banner{background:var(--blue-bg);border-color:#d4e0fb}
.ro-banner.info-banner svg{color:var(--blue)}
.ro-banner.warn-banner{background:var(--amber-bg);border-color:var(--amber-line)}
.ro-banner.warn-banner>svg{color:var(--amber)}
.ro-acts{display:flex;gap:8px;flex-wrap:wrap;flex-shrink:0}
.st-hint.calm{background:var(--paper);border-color:var(--line);color:var(--ink-2)}
.yes{display:inline-flex;align-items:center;gap:5px;color:var(--brand-2)}
.yes svg{width:15px;height:15px}
.dl-link{display:inline-flex;align-items:center;gap:6px;font-weight:500;max-width:100%;min-width:0}
.dl-link span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dl-link svg{width:15px;height:15px}
.card-ha{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px;line-height:1.6;color:var(--ink-2)}
.fdate input{border:0;background:transparent;height:100%;padding:0 8px 0 6px;font-size:13px;font-weight:500;color:var(--ink);min-width:0;font-family:var(--b)}
.fdate input:focus{outline:none}
.ftog{height:34px;border:1px solid var(--line-3);background:#fff;border-radius:9px}
.ftog svg{width:14px;height:14px}
.upmeta.noexp{grid-template-columns:220px minmax(0,1fr)}
.inp-file{height:auto;padding:7px 10px;font-size:13px;background:var(--paper)}
.span3{grid-column:span 3}
.c-num small{display:block;font-family:var(--b);font-size:12px;color:var(--ink-3);margin-top:1px;letter-spacing:0}
.c-num .rev{color:var(--ink-4);font-size:11.5px}
.c-amt small{display:block;font-size:11px;color:var(--ink-4);font-weight:400}
.rev-b{font-family:var(--mono);font-weight:600;color:var(--ink-2)}
.lp-big{font-family:var(--h);font-weight:600;font-size:16px}
.ver{display:inline-block;font-family:var(--mono);font-size:11.5px;font-weight:600;color:var(--ink-2);background:var(--paper-2);border-radius:5px;padding:1px 6px;line-height:1.4}
.stat.xs{cursor:default}
.stat.xs:hover{transform:none;box-shadow:var(--sh-1);border-color:var(--line)}
.stat-n .cur{font-size:11px;color:var(--ink-3);margin-right:5px;font-weight:500;letter-spacing:.04em}
.stat.xs .stat-n.m-good{color:var(--brand-2)}.stat.xs .stat-n.m-ok{color:var(--amber)}.stat.xs .stat-n.m-bad{color:var(--red)}
.plate{display:inline-flex;align-items:center;gap:7px;height:26px;padding:0 9px 0 7px;border:1.5px solid #1b2a22;border-radius:6px;background:#fff;font-family:var(--mono);font-weight:700;font-size:12.5px;letter-spacing:.04em;color:var(--ink);white-space:nowrap;box-shadow:inset 0 -2px 0 rgba(6,20,14,.07);flex-shrink:0}
.plate::before{content:"";width:4px;height:13px;border-radius:2px;background:var(--brand)}
.plate.sm{height:22px;font-size:11.5px;padding:0 7px 0 6px;gap:6px}
.plate.sm::before{height:11px;width:3px}
.plate.lg{height:58px;font-size:18px;padding:0 16px 0 12px;border-width:2px;border-radius:12px;gap:10px}
.plate.lg::before{width:6px;height:26px}
.rtag{display:inline-flex;align-items:center;gap:4px;margin-top:3px;font-size:11.5px;font-weight:500;color:var(--brand-2);background:var(--brand-3);border-radius:999px;padding:1px 8px;width:fit-content;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:18px}
.rtag svg{width:12px;height:12px}
.rtag.off{background:var(--amber-bg);color:var(--amber)}
.ovr{margin-top:10px;background:var(--blue-bg);border:1px solid #d4e0fb;border-radius:10px;padding:10px 12px;gap:8px}
.ovr-in{display:flex;align-items:center;gap:10px;color:var(--blue);font-size:13px}
.ovr-in>svg{width:17px;height:17px;flex-shrink:0}
.ovr-in p{flex:1;min-width:0}
.ovr-in b{font-weight:600}
.ovr-f{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;padding-left:27px}
.ovr-f .lbl{white-space:nowrap;color:var(--blue)}
.ovr-f .inp{background:#fff;height:36px}
.ovr-f .check{background:#fff;white-space:nowrap;padding:7px 10px;font-size:13px}
.ovr.bad .inp{border-color:var(--red);box-shadow:0 0 0 3px rgba(180,35,24,.1)}
.ovr .ferr{padding-left:27px}
.pv-min{margin-left:6px;font-size:11.5px;color:var(--amber);font-weight:500}
.lchip.ct{background:#e8f5ee;color:var(--brand-2);border:1px solid #c5e6d3}
.lchip.ov{background:var(--amber-bg);color:var(--amber);border:1px solid var(--amber-line)}
a.lchip.lk2{background:#fff;border:1px solid var(--line-3);color:var(--ink-2);text-decoration:none;font-family:var(--mono);font-size:11px}
a.lchip.lk2:hover{border-color:var(--brand);color:var(--brand-2)}
.jpo-hint{display:flex;gap:8px;align-items:center;margin:10px 16px 0;padding:9px 12px;border-radius:9px;background:var(--amber-bg);border:1px solid var(--amber-line);color:var(--amber);font-size:13px}
.jpo-hint svg{width:15px;height:15px;flex-shrink:0}
.mini .mrow.mlpo{grid-template-columns:150px minmax(0,1fr) 130px 120px}
.mini .mrow.mlpo.nocost{grid-template-columns:150px minmax(0,1fr) 130px}
.mini.tlist .lr{border-bottom:1px solid var(--line-2)}
.mini.tlist .lr:last-child{border-bottom:0}

/* lists */
.kgrid{display:grid;grid-template-columns:150px minmax(0,1fr) 84px 118px 210px 160px;align-items:center;column-gap:14px}
.ogrid{display:grid;grid-template-columns:160px minmax(0,1fr) 132px 150px 140px;align-items:center;column-gap:14px}
.ogrid.nocost{grid-template-columns:160px minmax(0,1fr) 132px 150px}
.vgrid{display:grid;grid-template-columns:190px minmax(0,1fr) 190px 180px 180px;align-items:center;column-gap:14px}
.dgrid{display:grid;grid-template-columns:minmax(0,1.3fr) 200px 160px 170px 150px;align-items:center;column-gap:14px}
.tgrid{display:grid;grid-template-columns:150px minmax(0,1fr) 190px 104px 120px;align-items:center;column-gap:14px}
.tgrid.nocost{grid-template-columns:150px minmax(0,1fr) 190px 104px}
.ogrid .c-amt,.tgrid .c-amt{text-align:right;font-weight:500;font-variant-numeric:tabular-nums}
.c-own,.c-lic,.c-veh{display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:0}
.c-own small,.c-lic small,.c-veh small{font-size:12px;color:var(--ink-3);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--b)}
.c-pl{display:flex;align-items:center;gap:8px}
.c-e1,.c-e2{min-width:0}
.dgrid .u-who{gap:10px}

/* contract page: rate card */
.rc{overflow:visible}
.rc .card-h{padding-bottom:12px}
.rc-note{display:flex;gap:8px;align-items:center;margin:0 16px 12px;padding:9px 12px;border-radius:9px;background:var(--paper);font-size:13px;color:var(--ink-2)}
.rc-note svg{width:15px;height:15px;color:var(--ink-3)}
.rc-r{display:grid;grid-template-columns:minmax(0,1.6fr) 72px 130px 110px minmax(0,1.25fr) 150px 36px;column-gap:14px;align-items:center;padding:11px 16px}
.rc-hd{height:36px;padding-top:0;padding-bottom:0;background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-family:var(--h);font-size:11px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3)}
.rc-g h4{display:flex;align-items:center;gap:8px;padding:8px 16px;background:#f8fbf8;border-bottom:1px solid var(--line-2);font-family:var(--h);font-size:12px;font-weight:600;color:var(--ink-2)}
.rc-g h4 span{font-family:var(--b);font-weight:500;font-size:11px;color:var(--ink-3);background:#fff;border:1px solid var(--line);border-radius:999px;padding:0 7px;line-height:17px}
.rc-g+.rc-g h4{border-top:1px solid var(--line)}
.rc-row{border-bottom:1px solid var(--line-2)}
.rc-g .rc-row:last-child{border-bottom:0}
.rc-row:hover{background:#fbfdfb}
.rc-row.is-closed{background:#fafbfa}
.rc-row.is-closed .rc-c .code{background:var(--paper-2);color:var(--ink-3)}
.rc-c{display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:0}
.rc-c small{font-size:12.5px;color:var(--ink-2);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rc-u{font-size:12.5px;color:var(--ink-2)}
.rc-v,.rc-m{text-align:right}
.rc-v b{font-family:var(--h);font-weight:600;font-size:15px}
.rc-v small{display:block;font-size:11.5px;color:var(--amber);font-weight:500}
.rc-m{color:var(--ink-2)}
.rc-d{display:flex;flex-direction:column;min-width:0}
.rc-d b{font-weight:500;font-size:13px}
.rc-d small{font-size:12px;color:var(--ink-3)}
.rc-d.rc-fut small{color:var(--amber);font-weight:500}
.rc-d.rc-closed b{color:var(--ink-3)}
.rc-ver{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.rc-hbtn{display:inline-flex;align-items:center;gap:4px;font-size:12px;text-decoration:none}
.rc-hbtn svg{width:13px;height:13px}
.rc-a{display:flex;justify-content:flex-end}
.rc-why{display:flex;gap:6px;align-items:flex-start;padding:0 16px 10px;margin-top:-4px;font-size:12.5px;color:var(--ink-3)}
.rc-why svg{width:13px;height:13px;margin-top:3px;flex-shrink:0}
.rc-hist{margin:0 16px 12px;border-left:2px solid var(--line-3);padding:2px 0 2px 14px}
.rc-hist ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.rc-hist li{display:grid;grid-template-columns:40px 180px 220px minmax(0,1fr);gap:12px;align-items:baseline;font-size:12.5px;color:var(--ink-2)}
.rc-hist .num{font-weight:500;color:var(--ink)}
.rc-hr{color:var(--ink-3);overflow-wrap:anywhere}
.rc-now{margin-bottom:2px}
.k-terms{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.k-terms>.card:first-child,.k-edit{grid-column:1/-1}
.reqs{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.reqs li{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--ink)}
.reqs svg{width:17px;height:17px;color:#fff;background:var(--brand);border-radius:50%;padding:3px;flex-shrink:0;margin-top:1px}

/* vendor comparison */
.cmp-f{display:grid;grid-template-columns:minmax(0,2fr) 150px 170px auto;gap:12px;align-items:end;padding:14px 16px;margin-bottom:14px}
.cmp-f .inp{height:38px}
.cmp-go .btn{height:38px}
.cmp .card-h{padding-bottom:12px}
.cmp .card-h h3 .code{font-size:12px}
.cmp-r{display:grid;grid-template-columns:34px minmax(0,1.6fr) 190px 120px 100px 150px 180px;column-gap:14px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line-2);font-size:13.5px}
.cmp-r:last-child{border-bottom:0}
.cmp-hd{padding-top:0;padding-bottom:0;height:36px;background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-family:var(--h);font-size:11px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3)}
.cmp-n{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--paper-2);font-family:var(--h);font-weight:600;font-size:12px;color:var(--ink-2)}
.cmp-r.best{background:linear-gradient(90deg,var(--brand-3),#fff 70%);box-shadow:inset 3px 0 0 var(--brand)}
.cmp-r.best .cmp-n{background:var(--brand);color:#fff}
.cmp-v b{font-family:var(--h);font-weight:600;font-size:15.5px}
.best-t{display:inline-flex;align-items:center;gap:4px;color:var(--brand-2);font-weight:600}
.best-t svg{width:12px;height:12px}
.cmp-r .c-sub a{color:var(--ink);text-decoration:none}
.cmp-r .c-sub a:hover{color:var(--brand-2)}

/* purchasing */
.ostats{grid-template-columns:repeat(5,minmax(0,1fr))}
.wide2{max-width:1180px}
.fsec.fsec-full{grid-template-columns:minmax(0,1fr);gap:12px}
.fromjob{background:#fbfdfb}
.fj{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.fj .check{gap:12px;background:#fff}
.fj-t{flex:1;min-width:0}
.fj-t b{display:block;font-weight:500;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fj-t small{display:block;font-size:12px;color:var(--ink-3);margin:0}
.fj-a{font-weight:600}
.fbar-t{font-size:13px;color:var(--ink-3);margin-right:6px;white-space:nowrap}
.fbar-t b{color:var(--ink);font-family:var(--h);font-size:15px;font-weight:600}
.pe{border:1px solid var(--line);border-radius:12px;background:#fff}
.pe-r{display:grid;grid-template-columns:30px minmax(150px,1fr) minmax(0,1.6fr) 84px 96px 112px 110px 96px 32px;column-gap:10px;align-items:start;padding:8px 12px;border-bottom:1px dashed var(--line)}
.pe.nocost .pe-r{grid-template-columns:30px minmax(150px,1fr) minmax(0,1.6fr) 84px 96px 96px 32px}
.pe-hd{align-items:center;height:34px;padding-top:0;padding-bottom:0;background:var(--paper);border-bottom:1px solid var(--line);border-radius:12px 12px 0 0;font-family:var(--h);font-size:11px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3)}
.pe-rows .pe-r:last-child{border-bottom:0}
.pe .field{gap:3px}
.pe .inp{height:36px;font-size:13.5px}
.pe-l{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.pe-no{height:36px;display:grid;place-items:center;font-family:var(--h);font-weight:600;font-size:12px;color:var(--ink-3)}
.pe-amt{height:36px;display:flex;align-items:center;justify-content:flex-end;font-weight:600}
.pe-amt .m-lbl{display:none}
.pe-rm{margin-top:3px}
.pe-tag{display:inline-flex;align-items:center;gap:4px;font-size:11px;color:var(--brand-2);font-weight:500;white-space:nowrap}
.pe-tag svg{width:11px;height:11px}
.pe-jl{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;color:var(--brand-2)}
.pe-jl svg{width:12px;height:12px}
.pe-f{display:flex;align-items:center;gap:12px;padding:10px 12px;border-top:1px solid var(--line);background:#fafcfa;border-radius:0 0 12px 12px;flex-wrap:wrap}
.pe-f .hint{flex:1;min-width:200px}
.pe-tot{margin-left:auto}
.ptot{display:flex;flex-direction:column;gap:3px;margin:0;min-width:250px}
.ptot>div{display:flex;justify-content:space-between;gap:24px;font-size:13.5px}
.ptot dt{color:var(--ink-3)}
.ptot dd{margin:0;font-weight:500}
.ptot .grand{border-top:1px solid var(--line-3);padding-top:6px;margin-top:3px}
.ptot .grand dt,.ptot .grand dd{font-family:var(--h);font-weight:600;font-size:16px;color:var(--ink)}
.plines .pl-r{display:grid;grid-template-columns:36px minmax(0,1fr) 90px 70px 110px 120px 84px;column-gap:14px;align-items:start;padding:11px 16px;border-bottom:1px solid var(--line-2);font-size:13.5px}
.plines.nocost .pl-r{grid-template-columns:36px minmax(0,1fr) 90px 70px 84px}
.plines .pl-hd{align-items:center;padding-top:0;padding-bottom:0;height:34px;background:var(--paper);border-top:1px solid var(--line);font-family:var(--h);font-size:11px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3)}
.plines .pl-r:last-child{border-bottom:0}
.pl-no{font-family:var(--h);font-weight:600;color:var(--ink-3);font-size:12.5px}
.pl-d{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:baseline;min-width:0}
.pl-d b{font-weight:500;overflow-wrap:anywhere}
.pl-d small{flex-basis:100%;display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--brand-2)}
.pl-d small svg{width:12px;height:12px}
.pl-q,.pl-rt,.pl-a{text-align:right}
.pl-a{font-weight:600}
.pl-u{font-size:12.5px;color:var(--ink-2)}
.pl-v{font-size:12.5px;color:var(--ink-2)}
.lp-lines .card-h{padding-bottom:12px}
.lp-foot{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;padding:14px 16px;border-top:1px solid var(--line);background:#fafcfa;border-radius:0 0 var(--r) var(--r);flex-wrap:wrap-reverse}
.lp-words{display:flex;gap:8px;align-items:flex-start;font-size:13px;color:var(--ink-2);max-width:520px;font-style:italic}
.lp-words svg{width:15px;height:15px;color:var(--ink-4);margin-top:2px;flex-shrink:0}
#lp-lines{display:flex;flex-direction:column;gap:14px}
.lp-ed .card-h{padding-bottom:4px}
.lp-rev{border:1px solid var(--line);border-radius:12px;margin-bottom:10px;overflow:hidden}
.lp-rev:last-child{margin-bottom:0}
.lp-rev summary{list-style:none;display:flex;align-items:center;gap:12px;padding:10px 14px;cursor:pointer;background:var(--paper);font-size:13px;flex-wrap:wrap}
.lp-rev summary::-webkit-details-marker{display:none}
.lp-rev summary .num{font-weight:600}
.lp-rev summary .chev{margin-left:auto;color:var(--ink-3);transition:transform .2s}
.lp-rev[open] summary .chev{transform:rotate(180deg)}
.kchip.k-lpo_cancel{background:var(--blue-bg);color:var(--blue)}
.ap.k-lpo_cancel{border-left-color:#2f6fdf}

/* fleet */
.fr-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
.tp-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;align-items:start}
.tp-line2{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 12px;background:var(--paper);border-radius:10px;margin-bottom:10px}
.tp-line2 b{display:block;font-weight:500}
.tp-line2 small{color:var(--ink-3);font-size:12.5px}
.tp-line2 .ap-amt dd{font-size:14.5px}
.tp-grid .notebox a{color:inherit;font-weight:500}
.pod-rep{display:block;margin-top:2px}
.cline-i{display:inline-flex;align-items:center;gap:5px;color:var(--ink);text-decoration:none}
.cline-i:hover{color:var(--brand-2)}
.tp-line{border:1px solid var(--line);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:10px;background:#fbfdfb;margin:0}
.tp-line .check{background:#fff}
.tp-line .cws{margin-top:0}
.rp{display:flex;flex-direction:column;gap:14px}
.rp[aria-busy="true"]{min-height:120px}
.rstats{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:0}
.rp-card{overflow:hidden}
.rp-card .card-h{padding-bottom:12px}
.rp-r{display:grid;grid-template-columns:minmax(0,1.4fr) 64px 100px 110px 120px 120px 120px 84px;column-gap:14px;align-items:center;padding:10px 16px;border-bottom:1px solid var(--line-2);font-size:13.5px}
.rp-r.nocost{grid-template-columns:minmax(0,1fr) 90px 130px}
.rp-hd{padding-top:0;padding-bottom:0;height:34px;background:var(--paper);border-top:1px solid var(--line);font-family:var(--h);font-size:11px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3)}
.rp-n{display:flex;align-items:center;gap:10px;min-width:0}
.rp-n b{font-weight:500}
.rp-n small{font-size:12px;color:var(--ink-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rp-tot{background:var(--paper);border-bottom:0;font-weight:600}
.rp-tot .num{font-weight:600}

/* expiry board and reminder */
.xstats{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,2fr)}
.xs-kinds{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12.5px;color:var(--ink-2);margin-top:8px}
.xs-kinds span{display:inline-flex;gap:6px;align-items:center}
.xs-kinds svg{width:14px;height:14px;color:var(--brand)}
.xb{margin-bottom:14px;overflow:hidden;border-left:4px solid var(--red)}
.xb-due{border-left-color:var(--amber-dot)}
.xb-h{display:flex;align-items:center;gap:10px;padding:14px 18px 12px}
.xb-h h2{font-size:16px;font-weight:600}
.xb-h .cnt{font-family:var(--b);font-weight:500;font-size:12px;color:var(--ink-2);background:var(--paper);border-radius:999px;padding:1px 9px}
.xb-hi{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:var(--red-bg);color:var(--red)}
.xb-due .xb-hi{background:var(--amber-bg);color:var(--amber)}
.xb-hi svg{width:16px;height:16px}
.xb-g h3{display:flex;align-items:center;gap:8px;padding:8px 18px;background:#f8fbf8;border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2);font-family:var(--h);font-size:11.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3)}
.xb-g h3 svg{width:14px;height:14px;color:var(--ink-3)}
.xb-g h3 span{font-family:var(--b);font-size:11px;letter-spacing:0;background:#fff;border:1px solid var(--line);border-radius:999px;padding:0 7px;line-height:17px}
.xb-r{display:grid;grid-template-columns:minmax(0,1fr) 120px 200px 18px;gap:14px;align-items:center;padding:11px 18px;border-bottom:1px solid var(--line-2);text-decoration:none;color:var(--ink)}
.xb-g .xb-r:last-child{border-bottom:0}
.xb-r:hover{background:#f8faf8;color:var(--ink)}
.xb-r:focus-visible{outline:none;background:#f3f8f4;box-shadow:inset 3px 0 0 var(--brand)}
.xb-r .lic{justify-self:start}
.xb-date{font-size:13px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.xb-go{color:var(--ink-4);width:16px;height:16px}
.rm-list{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.rm-list li{display:flex;align-items:center;gap:10px;padding:9px 12px;border-bottom:1px solid var(--line-2)}
.rm-list li:last-child{border-bottom:0}
.rm-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.rm-dot.bad{background:var(--red)}
.rm-dot.due{background:var(--amber-dot)}
.rm-t{flex:1;min-width:0}
.rm-t b{display:block;font-weight:500;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rm-t small{display:block;font-size:12px;color:var(--ink-3)}
.rm-d{font-size:12px;font-weight:600;white-space:nowrap}
.rm-d.bad{color:var(--red)}
.rm-d.due{color:var(--amber)}

/* responsive (phase B) */
@media (max-width:1320px){
  .kgrid{grid-template-columns:140px minmax(0,1fr) 80px 112px 180px 140px}
  .vgrid{grid-template-columns:170px minmax(0,1fr) 170px 160px 160px}
  .rc-r{grid-template-columns:minmax(0,1.5fr) 64px 116px 96px minmax(0,1.2fr) 130px 36px;column-gap:12px}
  .cmp-r{grid-template-columns:34px minmax(0,1.5fr) 170px 110px 96px 130px 160px}
  .pe-r{grid-template-columns:28px minmax(130px,1fr) minmax(0,1.4fr) 76px 92px 104px 100px 90px 32px}
  .rp-r{grid-template-columns:minmax(0,1.2fr) 56px 92px 100px 110px 110px 110px 76px;column-gap:10px}
}
@media (max-width:1180px){
  .kgrid{grid-template-columns:130px minmax(0,1fr) 80px 110px 150px}
  .kgrid>.c-dl,.kgrid.lh>span:nth-child(5){display:none}
  .vgrid{grid-template-columns:160px minmax(0,1fr) 150px 150px 150px}
  .vgrid>.c-jobs,.vgrid.lh>span:nth-child(6){display:none}
  .dgrid{grid-template-columns:minmax(0,1.3fr) 170px 140px 160px}
  .dgrid>.c-veh,.dgrid.lh>span:nth-child(5){display:none}
  .pe-r,.pe.nocost .pe-r{grid-template-columns:repeat(8,minmax(0,1fr)) 32px;grid-template-areas:"no code code code desc desc desc desc rm" "no qty uom rate rate amt amt vat rm";row-gap:6px}
  .pe.nocost .pe-r{grid-template-areas:"no code code code desc desc desc desc rm" "no qty qty uom uom vat vat . rm"}
  .pe-hd{display:none}
  .pe-no{grid-area:no}.pe-code{grid-area:code}.pe-desc{grid-area:desc}.pe-qty{grid-area:qty}.pe-uom{grid-area:uom}.pe-rate{grid-area:rate}.pe-amt{grid-area:amt}.pe-vat{grid-area:vat}.pe-rm{grid-area:rm}
  .pe-r{padding:10px 12px}
  .pe-l{position:static;width:auto;height:auto;clip:auto;font-family:var(--h);font-size:11.5px;font-weight:500;color:var(--ink-3)}
  .pe-no{align-self:start;height:auto;padding-top:22px}
  .pe-amt{align-self:end}
  .pe-amt .m-lbl{display:inline;font-size:11px;color:var(--ink-3);font-weight:400;margin-right:6px}
  .pe-rm{align-self:start;margin-top:20px}
  .rc-hist li{grid-template-columns:40px 170px minmax(0,1fr);grid-template-areas:"v n d" ". r r"}
  .rc-hist li>:nth-child(1){grid-area:v}.rc-hist li>:nth-child(2){grid-area:n}.rc-hist li>:nth-child(3){grid-area:d}.rc-hist li>:nth-child(4){grid-area:r}
  .rp-r{grid-template-columns:minmax(0,1.2fr) 52px 90px 96px 104px 104px 104px 70px;font-size:13px}
}
@media (max-width:960px){
  .lh.kgrid,.lh.ogrid,.lh.vgrid,.lh.dgrid,.lh.tgrid{display:none}
  .lr.kgrid{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"top top" "sub sub" "side exp";row-gap:8px;padding:14px 16px}
  .lr.kgrid>.m-top{grid-area:top}.lr.kgrid>.c-co{grid-area:sub}.lr.kgrid>.c-side{grid-area:side}.lr.kgrid>.c-exp{grid-area:exp}
  .lr.kgrid>.c-num,.lr.kgrid>.c-st,.lr.kgrid>.c-dl{display:none}
  .lr.ogrid,.lr.ogrid.nocost{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"top top" "sub sub" "dl amt";row-gap:8px;padding:14px 16px}
  .lr.ogrid>.m-top{grid-area:top}.lr.ogrid>.c-co{grid-area:sub}.lr.ogrid>.c-dl{grid-area:dl;flex-direction:row;gap:8px;align-items:baseline}.lr.ogrid>.c-amt{grid-area:amt;align-self:center}
  .lr.ogrid>.c-num,.lr.ogrid>.c-st{display:none}
  .lr.vgrid{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"pl own" "sub sub" "e1 e2";row-gap:8px;padding:14px 16px}
  .lr.vgrid>.c-pl{grid-area:pl}.lr.vgrid>.c-sub{grid-area:sub}.lr.vgrid>.c-own{grid-area:own;align-items:flex-end}.lr.vgrid>.c-e1{grid-area:e1}.lr.vgrid>.c-e2{grid-area:e2;justify-self:end}
  .lr.vgrid>.c-jobs{display:none}
  .lr.dgrid{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"who who" "own e1";row-gap:8px;padding:14px 16px}
  .lr.dgrid>.u-who{grid-area:who}.lr.dgrid>.c-own{grid-area:own}.lr.dgrid>.c-e1{grid-area:e1;align-self:end}
  .lr.dgrid>.c-lic,.lr.dgrid>.c-veh{display:none}
  .lr.tgrid,.lr.tgrid.nocost{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"num pod" "sub sub" "veh amt";row-gap:8px;padding:14px 16px}
  .lr.tgrid>.c-num{grid-area:num;display:flex;gap:10px;align-items:baseline}.lr.tgrid>.c-num small{margin:0}
  .lr.tgrid>.c-sub{grid-area:sub}.lr.tgrid>.c-veh{grid-area:veh;flex-direction:row;align-items:center;gap:8px}.lr.tgrid>.c-pod{grid-area:pod}.lr.tgrid>.c-amt{grid-area:amt;align-self:center}
  .lr .c-sub b{white-space:normal}
  .rc-hd{display:none}
  .rc-r{grid-template-columns:minmax(0,1fr) auto auto;grid-template-areas:"c v a" "d m ver";row-gap:6px;column-gap:12px}
  .rc-c{grid-area:c}.rc-u{display:none}.rc-v{grid-area:v}.rc-m{grid-area:m}.rc-d{grid-area:d}.rc-ver{grid-area:ver;align-items:flex-end}.rc-a{grid-area:a}
  .rc-m .m-lbl,.rc-v .m-lbl{display:inline;font-size:11px;color:var(--ink-3);font-weight:400}
  .rc-v .m-lbl{display:none}
  .cmp-hd{display:none}
  .cmp-r{grid-template-columns:30px minmax(0,1fr) auto;grid-template-areas:"n who v" ". ct diff" ". exp min";row-gap:6px}
  .cmp-r>.cmp-n{grid-area:n}.cmp-r>.c-co{grid-area:who}.cmp-r>.cmp-v{grid-area:v}.cmp-r>:nth-child(3){grid-area:ct}.cmp-r>:nth-child(5){grid-area:min;text-align:right}.cmp-r>:nth-child(6){grid-area:diff;text-align:right}.cmp-r>:nth-child(7){grid-area:exp}
  .cmp-r .m-lbl{display:inline;font-size:11px;color:var(--ink-3)}
  .cmp-r .cmp-v .m-lbl{display:none}
  .cmp-f{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .cmp-f .cmp-code{grid-column:1/-1}
  .cmp-go{grid-column:1/-1}
  .cmp-go .btn{width:100%}
  .ostats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .xstats{grid-template-columns:1fr 1fr}
  .xstats .stat:nth-child(3){grid-column:1/-1}
  .rstats{grid-template-columns:1fr 1fr}
  .tp-grid{grid-template-columns:minmax(0,1fr)}
  .k-terms{grid-template-columns:minmax(0,1fr)}
  .rp-hd{display:none}
  .rp-r,.rp-r.nocost{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:6px}
  .rp-r .rp-n{grid-column:1/-1}
  .rp-r>.r{text-align:left}
  .rp-r .m-lbl{display:block;font-size:10.5px;font-family:var(--h);text-transform:uppercase;letter-spacing:.04em;color:var(--ink-3)}
  .rp-r>span:last-child:not(.num){display:flex;align-items:end}
}
@media (max-width:760px){
  .ostats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ostats .stat:nth-child(5){grid-column:span 2}
  .span3{grid-column:auto}
  .ovr-f{grid-template-columns:minmax(0,1fr);padding-left:0}
  .ovr-f .lbl{white-space:normal}
  .ovr-in{flex-wrap:wrap}
  .ovr .ferr{padding-left:0}
  .upmeta.noexp{grid-template-columns:minmax(0,1fr)}
  .pe-r,.pe.nocost .pe-r{grid-template-columns:repeat(4,minmax(0,1fr)) 30px;grid-template-areas:"code code code code rm" "desc desc desc desc desc" "qty qty uom uom uom" "rate rate vat vat vat" "amt amt amt amt amt"}
  .pe.nocost .pe-r{grid-template-areas:"code code code code rm" "desc desc desc desc desc" "qty qty uom uom uom" "vat vat vat vat vat"}
  .pe-no{display:none}
  .pe-amt{justify-content:space-between;background:var(--paper);border-radius:8px;padding:0 10px;height:34px}
  .pe-f .hint{min-width:0;flex-basis:100%}
  .pe-tot{margin-left:0;width:100%}
  .ptot{min-width:0;width:100%}
  .plines .pl-hd{display:none}
  .plines .pl-r,.plines.nocost .pl-r{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-areas:"no d d" "q rt a" "u v v";row-gap:6px}
  .plines.nocost .pl-r{grid-template-areas:"no d d" "q u v"}
  .pl-no{grid-area:no}.pl-d{grid-area:d}.pl-q{grid-area:q;text-align:left}.pl-u{grid-area:u}.pl-rt{grid-area:rt;text-align:left}.pl-a{grid-area:a}.pl-v{grid-area:v}
  .pl-d{grid-column:1/-1}
  .plines .pl-r .m-lbl{display:block;font-size:10.5px;font-family:var(--h);text-transform:uppercase;letter-spacing:.04em;color:var(--ink-3);font-weight:500}
  .pl-no::before{content:"Line ";font-weight:500}
  .lp-foot{flex-direction:column-reverse;align-items:stretch}
  .ptot>div{font-size:14px}
  .fbar-t{flex-basis:100%;margin:0}
  .mini .mrow.mlpo,.mini .mrow.mlpo.nocost{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"num st" "sub sub" "amt amt"}
  .mini .mrow.mlpo>.c-num{grid-area:num}.mini .mrow.mlpo>.c-sub{grid-area:sub}.mini .mrow.mlpo>.st{grid-area:st}.mini .mrow.mlpo>.num{grid-area:amt;text-align:left}
  .rc-hist{margin:0 12px 12px}
  .rc-hist li{grid-template-columns:40px minmax(0,1fr);grid-template-areas:"v n" ". d" ". r";row-gap:0}
  .xb-r{grid-template-columns:minmax(0,1fr) 16px;grid-template-areas:"sub go" "meta go";row-gap:6px;padding:12px 16px}
  .xb-r>.c-sub{grid-area:sub}.xb-r>.xb-date{display:none}.xb-r>.lic{grid-area:meta}.xb-r>.xb-go{grid-area:go}
  .xb-h{padding:12px 16px 10px}
  .xb-g h3{padding:8px 16px}
  .cmp-f{padding:12px}
  .plate.lg{height:48px;font-size:16px}
  .rstats .stat-n{font-size:18px}
}

/* ---------------------------------------------------------------- LPO letterhead (screen preview and print) */
.lp-page{min-height:100vh;background:#e6ece7;padding-bottom:48px}
.lp-bar{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:14px;padding:10px 20px;background:var(--deep);color:#fff;flex-wrap:wrap}
.lp-bar .btn-line{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.22);color:#fff}
.lp-bar .btn-line:hover{background:rgba(255,255,255,.12);color:#fff}
.lp-bar-t{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.35}
.lp-bar-t b{font-family:var(--mono);font-size:13px;font-weight:600}
.lp-bar-t small{color:rgba(255,255,255,.66);font-size:12px}
.lp-bar .btn-primary{background:var(--lime);color:var(--deep);box-shadow:none}
.lp-bar .btn-primary:hover{background:#e6ec45;color:var(--deep)}
.lp-bar :focus-visible{outline-color:var(--lime)}
.lp-wrap{padding:28px 16px}
.lp-wrap:focus{outline:none}
.lp-sheet{position:relative;width:210mm;min-height:297mm;margin:0 auto;background:#fff;box-shadow:0 22px 50px -26px rgba(6,20,14,.5),0 1px 3px rgba(6,20,14,.08);padding:15mm 15mm 16mm;color:#101a14;font-size:10pt;line-height:1.45;overflow:hidden;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.lp-load{display:flex;flex-direction:column;align-items:center;gap:10px;padding:60px 20px;color:var(--ink-3);font-size:14px;text-align:center}
.lp-load svg{width:24px;height:24px;color:var(--ink-3)}
.lp-wm{position:absolute;left:0;right:0;top:36%;text-align:center;pointer-events:none;font-family:var(--h);font-weight:700;font-size:96pt;letter-spacing:.1em;color:rgba(180,35,24,.1);transform:rotate(-28deg);z-index:3;line-height:1}
.lp-head{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-bottom:11px;border-bottom:2.5px solid var(--brand)}
.lp-logo{height:13mm;width:auto}
.lp-co{text-align:right;display:flex;flex-direction:column;font-size:8.5pt;color:#33443b;line-height:1.5}
.lp-co b{font-family:var(--h);font-size:11.5pt;color:#06140e;font-weight:600}
.lp-title{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin:16px 0 13px}
.lp-title h1{font-family:var(--h);font-size:16pt;font-weight:700;letter-spacing:.07em;color:#06140e;line-height:1.1}
.lp-no{display:flex;margin:0;border:1px solid #cdd7cf;border-radius:6px;overflow:hidden}
.lp-no>div{padding:5px 11px;border-left:1px solid #cdd7cf}
.lp-no>div:first-child{border-left:0}
.lp-no dt{font-size:7pt;text-transform:uppercase;letter-spacing:.07em;color:#5a6a61}
.lp-no dd{margin:0;font-family:var(--mono);font-size:9.5pt;font-weight:600;white-space:nowrap}
.lp-parties{display:grid;grid-template-columns:1.25fr 1fr;gap:10px;margin-bottom:13px}
.lp-box{border:1px solid #cdd7cf;border-radius:6px;padding:9px 12px}
.lp-box h2{font-family:var(--h);font-size:7pt;font-weight:600;text-transform:uppercase;letter-spacing:.09em;color:var(--brand-2);margin-bottom:4px}
.lp-box>b{display:block;font-family:var(--h);font-size:11pt;font-weight:600;margin-bottom:2px;color:#06140e}
.lp-box p{font-size:8.8pt;color:#33443b}
.lp-box dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px 12px;margin:0;font-size:8.8pt}
.lp-box dl div{display:contents}
.lp-box dt{color:#5a6a61}
.lp-box dd{margin:0;font-weight:500}
.lp-lines{width:100%;border-collapse:collapse;font-size:9pt}
.lp-lines thead th{background:#06140e;color:#fff;font-family:var(--h);font-weight:500;font-size:7.5pt;text-transform:uppercase;letter-spacing:.06em;padding:6px 7px;text-align:left}
.lp-lines thead th:first-child{border-radius:5px 0 0 0}
.lp-lines thead th:last-child{border-radius:0 5px 0 0}
.lp-lines .r{text-align:right}
.lp-lines .c{text-align:center}
.lp-lines td{padding:6px 7px;border-bottom:1px solid #e1e8e1;vertical-align:top;font-variant-numeric:tabular-nums}
.lp-lines td b{font-weight:500}
.lp-lines td small{display:block;font-family:var(--mono);font-size:7pt;color:#6a7a71;margin-top:1px}
.lp-lines tbody tr:nth-child(even) td{background:#f6f9f6}
.lp-lines tr{break-inside:avoid;page-break-inside:avoid}
.lp-sum{display:grid;grid-template-columns:minmax(0,1fr) 68mm;gap:16px;margin-top:10px;break-inside:avoid;page-break-inside:avoid}
.lp-words2 h3,.lp-terms h3{font-family:var(--h);font-size:7pt;font-weight:600;text-transform:uppercase;letter-spacing:.09em;color:var(--brand-2);margin-bottom:3px}
.lp-words2 p{font-size:9pt;font-weight:500;color:#101a14}
.lp-tot{width:100%;border-collapse:collapse;font-size:9.5pt}
.lp-tot th{text-align:left;font-weight:500;color:#33443b;padding:4px 8px}
.lp-tot td{text-align:right;padding:4px 8px;font-variant-numeric:tabular-nums;font-weight:500}
.lp-tot tr+tr th,.lp-tot tr+tr td{border-top:1px solid #e1e8e1}
.lp-tot .grand th,.lp-tot .grand td{background:#06140e;color:#fff;font-family:var(--h);font-weight:600;font-size:10.5pt;padding:7px 8px;border-top:0}
.lp-tot .grand td{color:var(--lime)}
.lp-terms{margin-top:15px;padding-top:9px;border-top:1px solid #e1e8e1;break-inside:avoid;page-break-inside:avoid}
.lp-terms p{font-size:8.2pt;color:#33443b;white-space:pre-wrap}
.lp-sign{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:22px;break-inside:avoid;page-break-inside:avoid}
.lp-sign>div{display:flex;flex-direction:column;gap:1px;border-top:1px solid #06140e;padding-top:6px}
.lp-sign span{font-size:7pt;text-transform:uppercase;letter-spacing:.07em;color:#5a6a61}
.lp-sign b{font-family:var(--h);font-weight:600;font-size:9.5pt;min-height:13pt;color:#06140e}
.lp-sign small{font-size:8pt;color:#5a6a61}
.lp-sign .lp-line{min-height:13pt}
.lp-foot2{display:flex;justify-content:space-between;gap:12px;margin-top:18px;padding-top:7px;border-top:1px solid #e1e8e1;font-size:7.3pt;color:#6a7a71}
@media screen and (max-width:900px){.lp-sheet{zoom:.82}}
@media screen and (max-width:720px){.lp-sheet{zoom:.6}.lp-wrap{padding:16px 8px}.lp-bar{padding:10px 12px}.lp-bar-t small{display:none}}
@media screen and (max-width:520px){.lp-sheet{zoom:.44}.lp-wrap{padding:12px 8px}}
@page lpo{size:A4;margin:12mm 12mm 15mm;
  @bottom-left{content:"Green Light Logistics LLC · Local purchase order";font-family:Roboto,Arial,sans-serif;font-size:7.5pt;color:#6a7a71}
  @bottom-right{content:"Page " counter(page) " of " counter(pages);font-family:Roboto,Arial,sans-serif;font-size:7.5pt;color:#6a7a71}}
@media print{
  html,body{background:#fff!important}
  .topbar,.gbanner,.toasts,.skip,.lp-bar,dialog{display:none!important}
  .lp-page{background:#fff;padding:0;min-height:0}
  .lp-wrap{padding:0}
  .lp-sheet{page:lpo;width:auto;min-height:0;margin:0;padding:0;box-shadow:none;overflow:visible;zoom:1}
  .lp-wm{position:fixed;top:40%}
  .lp-lines thead{display:table-header-group}
}
.jc-meta dd .dd-sub{flex-basis:100%;font-size:12.5px;color:var(--ink-3);font-weight:400;margin-top:-4px}
.jc-meta dd.who2 .dd-sub{margin-top:-2px}
.pv-src{display:inline-flex;align-items:center;gap:5px;color:var(--brand-2);font-size:12.5px;font-weight:500}
.pv-src svg{width:13px;height:13px}
.pe-tag.off{color:var(--amber)}
.inp-file::file-selector-button{border:1px solid var(--line-3);background:#fff;border-radius:7px;padding:5px 11px;margin-right:10px;font:inherit;font-weight:500;font-size:13px;color:var(--ink);cursor:pointer}
.inp-file::file-selector-button:hover{border-color:var(--brand);color:var(--brand-2)}
@media (max-width:760px){
  .ent-head .eh-main{min-width:220px}
  .eh-facts .lic{white-space:normal;height:auto;min-height:22px;max-width:100%}
}
.rc-v .rc-per{display:none}
@media (max-width:960px){.rc-v .rc-per{display:block;color:var(--ink-3);font-weight:400;font-family:var(--mono)}}
@media (max-width:760px){
  .ovr-in p{flex-basis:calc(100% - 30px)}
  .ovr-in .btn{margin-left:22px}
}
.lp-bar-t b{white-space:nowrap}
@media screen and (max-width:520px){.lp-bar-t{display:none}.lp-bar{justify-content:space-between}}
/* banners with actions: the buttons go below the text on phones */
@media (max-width:640px){
  .ro-banner{flex-wrap:wrap}
  .ro-banner>p{min-width:calc(100% - 40px)}
  .ro-banner>.ro-acts{width:100%;justify-content:flex-end}
}

/* LPO lines editor: a message under the row it belongs to (server or no-rate errors) */
.pe-msg{grid-column:2/-1;margin:2px 0 0;color:var(--red);font-size:12.5px;line-height:1.4}
.pe-r.bad{background:var(--red-bg)}
@media (max-width:760px){
  .pe-msg{grid-column:1/-1}
  /* fleet report: the date range and quick ranges wrap onto lines instead of scrolling sideways */
  .filters.f-wrap{flex-wrap:wrap;overflow-x:visible;margin:0 0 12px;padding:0}
  .filters.f-wrap .fdate{flex:1 1 140px}
  .filters.f-wrap .chips{display:flex;flex-wrap:wrap;width:100%;overflow-x:visible}
  .filters.f-wrap .fchip{flex:1 1 auto;justify-content:center}
}
.doc-lock{display:inline-flex;align-items:center;gap:5px;flex-shrink:0;font-size:12px;color:var(--ink-3);white-space:nowrap}
.doc-lock svg{width:13px;height:13px}
/* error boxes scrolled into view clear the sticky top bar */
.formerr{scroll-margin-top:84px}
.pop button:disabled{cursor:not-allowed;color:var(--ink-3)}
.pop button:disabled:hover{background:none}

/* ================================================================ top bar: two rows
   Row 1 = brand, search, alerts, clock, create button, account. Row 2 = section navigation.
   Both rows use the same 1480px container and 24px gutter as .page, so the header lines up
   with the page content at every width. At 1160px and below the navigation becomes a menu. */
.tb{gap:16px}
.tb-brand{margin-right:4px}
.tb-search{flex:1 1 320px;max-width:560px;min-width:180px;margin:0 auto}
.tb-bell{margin-left:0}
.tb-clock{padding:0 2px;min-width:74px}
.tb-new{flex-shrink:0}
.um{flex-shrink:0}
.tb2{max-width:1480px;margin:0 auto;padding:0 24px;height:46px;display:flex;align-items:center;border-top:1px solid rgba(255,255,255,.07)}
.tb-nav{margin-left:0;gap:4px;min-width:0}
.tb-link[aria-current="page"]::after{bottom:-6px}
.tb-sub{top:calc(100% + 6px)}
@media (max-width:1400px) and (min-width:1161px){
  .tb-nav .tb-link>svg:first-child{display:none}
  .tb-link{padding:0 10px}
}
@media (max-width:1160px){
  .tb-menu{display:inline-flex;order:-1;flex-shrink:0}
  .tb-name{display:none}
  .tb2{height:0;padding:0;border-top:0;max-width:none;display:block}
  .tb-nav{display:none;position:absolute;top:calc(100% + 6px);left:24px;width:280px;flex-direction:column;align-items:stretch;gap:2px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--sh-3);padding:6px;z-index:70;margin:0;max-height:calc(100vh - 90px);overflow:auto}
  .tb-nav.open{display:flex}
  .tb-nav .tb-link{color:var(--ink);height:40px;padding:0 10px;font-size:13.5px}
  .tb-nav .tb-link svg{color:var(--ink-3)}
  .tb-nav .tb-link:hover{background:var(--paper);color:var(--ink)}
  .tb-nav .tb-link[aria-current="page"]{background:var(--brand-3);color:var(--brand-2)}
  .tb-nav .tb-link[aria-current="page"] svg{color:var(--brand)}
  .tb-nav .tb-link[aria-current="page"]::after{display:none}
  .tb-nav .nbadge{margin-left:auto;background:var(--deep);color:var(--lime)}
  .tb-nav #adm-btn{display:none}
  .tb-nav .tb-sub{position:static;display:block!important;box-shadow:none;border:0;border-top:1px solid var(--line-2);border-radius:0;width:auto;padding:4px 0 0;margin-top:4px}
  .tb-nav .tb-sub-h{display:block;font-family:var(--h);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-3);padding:8px 10px 4px}
  .tb-search{flex-basis:220px}
}
@media (max-width:960px){
  .tb{gap:10px}
  .tb-brand .full{display:none}
  .tb-brand .mark{display:block}
  .tb-search{min-width:150px}
  .um-btn{padding:0 4px;border-color:transparent}
  .um-btn>span:not(.av),.um-btn>svg{display:none}
  .tb-new span{display:none}
  .tb-new{width:38px;padding:0;justify-content:center}
  .tb-menu span{max-width:110px;overflow:hidden;text-overflow:ellipsis}
}
@media (max-width:760px){
  .tb{height:auto;flex-wrap:wrap;padding:10px 16px;gap:8px;row-gap:10px}
  .tb-brand{margin-right:auto}
  .tb-brand .full{display:none}
  .tb-brand .mark{display:block}
  .tb-menu{width:38px;height:38px;padding:0;justify-content:center}
  .tb-menu svg:last-child{display:none}
  .tb-menu span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .tb-search{order:9;flex:1 1 100%;max-width:none;min-width:0;margin:0}
  .tb-bell{width:36px;height:36px}
  .tb-clock{min-width:0}
  .tb-new{width:36px;height:36px}
  .um-btn{height:38px}
  .tb-nav{left:12px;right:12px;width:auto}
}
@media (max-width:380px){
  .tb-clock small{display:none}
}

/* ================================================================ layout alignment pass (Sept 2026)
   Page-level fixes found by a screenshot audit of every console page at 1440/1280/1024/768/390. */

/* page containers: forms and account pages start on the same left edge as every other page */
.narrow,.wide2{margin-left:0}
.me-grid{align-items:stretch}

/* stat cards: second line wraps (two lines at most) instead of cutting words off */
.stat-h{white-space:normal;overflow:hidden;text-overflow:clip;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.3}
@media (max-width:760px){.stat-h{display:none}}
@media (max-width:1560px) and (min-width:1321px){
  #stats{grid-template-columns:repeat(6,minmax(0,1fr))}
  #stats .mywork{grid-column:1/-1;flex-direction:row;align-items:center}
  #stats .mw-h{flex-direction:column;align-items:flex-start;gap:0;min-width:120px}
  #stats .mw-row{flex:1;grid-template-columns:repeat(2,minmax(0,220px))}
  #stats .mw-item{flex-direction:row;align-items:baseline;gap:8px}
}
@media (max-width:1160px) and (min-width:961px){#stats{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:1320px){.mw-item{align-items:center}}
@media (min-width:761px) and (max-width:960px){
  .jstats .stat:nth-child(5){grid-column:span 2}
  .ostats{grid-template-columns:repeat(6,minmax(0,1fr))}
  .ostats>.stat:nth-child(-n+3){grid-column:span 2}
  .ostats>.stat:nth-child(n+4){grid-column:span 3}
}
@media (min-width:761px) and (max-width:1160px){#tm-s{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* filter rows: fill the row evenly instead of leaving one control alone on a second line */
@media (min-width:761px) and (max-width:1160px){
  #filters .fsel{flex:1 1 180px;min-width:0}
  #filters .fsel select{flex:1;min-width:0;max-width:none}
  #filters .fsp{display:none}
}
@media (min-width:761px) and (max-width:960px){
  #jfilters .fsel,#cfilters .fsel,#ofilters .fsel{flex:1 1 calc(50% - 4px);min-width:0}
  #jfilters .fsel select,#cfilters .fsel select,#ofilters .fsel select{flex:1;min-width:0;max-width:none}
  #cfilters .fsp{display:none}
}
.msearch{flex:0 1 260px;width:auto;min-width:170px}
.msearch .inp{width:100%}
/* phones: filters wrap into a tidy two-column grid; nothing is hidden off the edge */
@media (max-width:760px){
  .filters{flex-wrap:wrap;overflow:visible;margin:0 0 12px;padding:0;gap:8px}
  .filters .fsel{flex:1 1 calc(50% - 4px);min-width:0}
  .filters .fsel select{flex:1;min-width:0;max-width:none}
  .filters .fdate input{flex:1;min-width:0}
  .filters .wq,.filters .msearch,.filters .fsearch,.filters .chips,.filters .seg,.filters .wper{flex:1 1 100%;max-width:none;width:auto}
  .filters .chips{display:flex;flex-wrap:wrap;overflow:visible}
  .filters .seg label{flex:1}
  .filters .seg span{text-align:center;justify-content:center}
  .filters .fclear{flex:0 0 auto}
  .filters>.muted{margin-left:auto}
  .ax-filters>.btn{flex:1 1 100%;justify-content:center}
}

/* page header: a single icon action stays beside the title; other actions share one full row */
.ph>div:first-child{flex:1 1 320px;min-width:0}
.ph:has(>.ph-actions>.btn-icon:only-child){flex-wrap:nowrap}
.ph:has(>.ph-actions>.btn-icon:only-child)>div:first-child{flex:1 1 0;min-width:0}
@media (max-width:760px){
  .ph:has(>.ph-actions>.btn-icon:only-child){align-items:flex-start}
  .ph-actions{width:100%}
  .ph:has(>.ph-actions>.btn-icon:only-child) .ph-actions{width:auto}
  .ph-actions .btn:not(.btn-icon){flex:1 1 auto;justify-content:center}
}

/* tab strips that scroll on small screens get a fade at the edge */
@media (max-width:960px){
  .ptabs,.subnav,.wsub{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent)}
}

/* card headings wrap cleanly on phones */
@media (max-width:520px){.card-h{flex-wrap:wrap;row-gap:2px}}
.card-b>.clines:last-child{margin-bottom:0}

/* tickets */
@media (max-width:1160px){.lgrid{grid-template-columns:100px minmax(0,1fr) 88px 142px 50px 134px 34px}}
@media (max-width:420px){.m-top{flex-wrap:wrap;row-gap:4px}}
@media (max-width:760px){
  .dr-chips .dr-actions{margin-left:0;flex:1 1 100%}
  .dr-actions .btn{flex:1;justify-content:center}
}

/* lists: meta lines wrap on phones instead of cutting every part short */
@media (max-width:520px){
  .lr .c-sub small{flex-wrap:wrap;white-space:normal;row-gap:2px}
  .lr .c-sub small span{overflow:visible;text-overflow:clip}
  .lr.jgrid .c-dl small{display:none}
}
.ogrid .c-sub small>span{flex-shrink:0}
.ogrid .c-sub small>span:nth-of-type(2){flex-shrink:1;min-width:0}
.c-svc .badge{overflow:hidden}
.c-svc .badge span{overflow:hidden;text-overflow:ellipsis}

/* jobs: job card */
@media (min-width:1181px){.en-grid{grid-template-areas:"date code text qty uom sell cost" "vendor vendor pc pc vat vat go"}}
@media (min-width:761px) and (max-width:960px){
  .lgrid2{grid-template-columns:76px minmax(140px,1fr) 60px 72px 80px 72px 80px 28px;column-gap:8px}
  .lgrid2.nocost{grid-template-columns:76px minmax(140px,1fr) 60px 72px 80px 28px;column-gap:8px}
  .en-grid{grid-template-areas:"date date code code code code" "text text text text text text" "qty uom sell cost vendor vendor" "pc pc vat vat go go"}
  .entry.nocost .en-grid{grid-template-areas:"date date code code code code" "text text text text text text" "qty uom sell vendor vendor vendor" "pc pc vat vat go go"}
}
@media (max-width:760px){
  .ln>.num.ln-q small{margin-left:4px}
  .tbar-wrap{position:static;margin:0;padding:6px 0 0}
  .tbar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:row;overflow:hidden;border-radius:var(--r)}
  .tb-i,.tb-i:first-child{padding:10px 14px;border-left:0!important;border-top:1px solid rgba(255,255,255,.08)!important}
  .tb-i:nth-child(-n+2){border-top:0!important}
  .tb-i:nth-child(even){border-left:1px solid rgba(255,255,255,.08)!important}
}
.grid3>.field .lbl small{margin-left:auto;padding-left:8px}

/* detail pages: fact grids use the full width */
.jc-meta{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}

/* contracts, LPOs, fleet */
@media (min-width:961px){.plines .pl-r{align-items:center}}
.lp-foot{flex-direction:row-reverse}
@media (max-width:960px){.lp-foot{flex-direction:column-reverse}}
.tp-grid{align-items:stretch}
.tp-grid .card-h{min-height:34px}
@media (max-width:760px){.tp-grid .card-h{flex-wrap:wrap}}
@media (max-width:960px){
  .lr.vgrid>.c-e1,.lr.vgrid>.c-e2,.lr.dgrid>.c-e1{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
  .lr.vgrid>.c-e2{align-items:flex-end}
  .lr.vgrid .m-lbl,.lr.dgrid .m-lbl{display:block;font:500 10.5px var(--h);text-transform:uppercase;letter-spacing:.04em;color:var(--ink-3)}
  .rp-r:not(.rp-hd):not(.nocost)>span:last-child:not(.num){flex-direction:column;align-items:flex-start;gap:4px}
  .rp-r:not(.rp-hd):not(.nocost)>span:last-child:not(.num)::before{content:"Margin %";font:500 10.5px var(--h);text-transform:uppercase;letter-spacing:.04em;color:var(--ink-3)}
}
@media (max-width:1180px) and (min-width:961px){
  .rp-r{grid-template-columns:minmax(0,1fr) 48px 80px 92px 108px 96px 96px 72px;column-gap:8px}
  .rp-hd>span{white-space:nowrap}
}

/* users and admin */
@media (min-width:761px) and (max-width:960px){.ugrid{grid-template-columns:minmax(0,1fr) 90px 118px 84px 170px;gap:10px}}
/* company form: pair fields so no field sits alone beside an empty cell */
@media (min-width:761px){
  .fcard[data-form="co-over"] .field:has(#co-activities){grid-column:auto}
  .fcard[data-form="co-over"] fieldset.field{grid-column:1/-1}
  .fcard[data-form="co-over"] .field:has(#co-website){grid-column:1/-1}
}