/* [hidden] must actually hide.
 *
 * The attribute is only display:none in the browser's default stylesheet, and any
 * explicit display in our CSS overrides it. Every .pjm-field is display:flex, so
 * setting el.hidden = true did nothing visually — the field stayed on screen while
 * the JS disabled it. The result was a form with visible boxes you couldn't type in.
 */
[hidden]{display:none !important}

/* ==========================================================================
   PJM Designs php2026 — admin
   Same tokens as the public site. The admin is the same building, back office.
   ========================================================================== */

.pjm-adminbody{background:var(--paper-2)}

/* ---------- auth screens ---------- */
/* Same photograph as the public hero, so signing in doesn't feel like a different
   product. The scrim is doing real work: the image is busy on the right, and the
   card has to stay readable wherever it lands. */
.pjm-authwrap{
  position:relative;min-height:100vh;display:grid;place-items:center;padding:32px 20px;
  background:var(--ink) url('../img/hero.webp') center center / cover no-repeat;
}
.pjm-authwrap::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(10,14,26,.78) 0%, rgba(10,14,26,.88) 100%);
}
.pjm-authcard{
  position:relative;z-index:1;text-align:center;
  background:#fff;border:1px solid rgba(10,14,26,.4);
  border-top:3px solid var(--brand);
  padding:38px 34px 34px;width:100%;max-width:440px;
  box-shadow:0 24px 60px rgba(10,14,26,.45);
}
.pjm-auth-logo{height:36px;width:auto;margin:0 auto 26px;display:block}
.pjm-auth-h{font-family:var(--disp);font-weight:800;letter-spacing:-.03em;font-size:28px;margin-bottom:22px}
.pjm-auth-note{color:var(--steel);font-size:14px;margin:-12px 0 22px;text-align:left}
.pjm-auth-alt{margin-top:22px;font-size:13px;color:var(--steel)}
.pjm-auth-alt a{color:var(--brand-ink)}

/* The eyebrow's trailing rule only makes sense left-aligned; centre it here. */
.pjm-authcard .pjm-eyebrow{justify-content:center;margin-bottom:10px}
.pjm-authcard .pjm-eyebrow::after{display:none}

/* The form itself stays left-aligned — centred labels and inputs are hard to scan. */
.pjm-authcard .pjm-form{text-align:left}
.pjm-authcard .pjm-form .pjm-btn{width:100%;text-align:center}
.pjm-authcard .pjm-alert{text-align:left}

@media(max-width:560px){
  .pjm-authwrap{background-image:url('../img/hero-mobile.webp');padding:20px 14px}
  .pjm-authcard{padding:30px 22px 26px}
}

/* ---------- forms ---------- */
.pjm-form{display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.pjm-field{display:flex;flex-direction:column;gap:6px;width:100%}
.pjm-field > span{
  font-family:var(--data);font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--steel);
}
.pjm-field input[type=text],
.pjm-field input[type=email],
.pjm-field input[type=password],
.pjm-field input[type=url],
.pjm-field input[type=file],
.pjm-field textarea,
.pjm-field select{
  font-family:var(--body);font-size:15px;color:var(--ink);
  background:var(--paper);border:1px solid var(--rule-strong);
  padding:11px 12px;width:100%;border-radius:0;
}
.pjm-field input:focus,.pjm-field textarea:focus,.pjm-field select:focus{
  outline:2px solid var(--brand);outline-offset:1px;background:#fff;
}
.pjm-field small{font-size:12px;color:var(--steel)}
.pjm-form .pjm-btn{border:1px solid var(--ink);cursor:pointer}

/* ---------- alerts ---------- */
.pjm-alert{
  padding:12px 14px;margin-bottom:20px;font-size:14px;
  border-left:3px solid var(--steel);background:#fff;
}
.pjm-alert--error{border-left-color:var(--stamp);color:var(--stamp)}
.pjm-alert--ok{border-left-color:var(--live);color:var(--live)}
.pjm-alert--warn{border-left-color:var(--stamp);color:var(--ink-2);background:#FFF6F5}

/* ---------- shell ---------- */
.pjm-adminshell{display:grid;grid-template-columns:236px 1fr;min-height:100vh}
.pjm-side{
  background:var(--ink);color:var(--zinc);padding:26px 20px;
  display:flex;flex-direction:column;gap:26px;position:sticky;top:0;height:100vh;
  /* Belt and braces: if the logo and footer alone ever exceed the viewport, the whole
     sidebar scrolls rather than clipping. */
  overflow-y:auto;
}
.pjm-side-mark img{height:30px;width:auto}
/* The nav scrolls; the logo and Sign out stay put.
 *
 * min-height:0 is the whole fix. A flex item defaults to min-height:auto, which means
 * it refuses to shrink below its content — so flex:1 alone made this box grow past the
 * 100vh sidebar and quietly clip. There was nothing to scroll because nothing had
 * overflow, and nothing could shrink. With 23 nav items the bottom ones were simply
 * unreachable. */
.pjm-sidenav{
  display:flex;flex-direction:column;gap:2px;flex:1;
  min-height:0;overflow-y:auto;
  /* A thin scrollbar that doesn't shout on a dark panel. */
  scrollbar-width:thin;scrollbar-color:var(--rule-dk) transparent;
}
.pjm-sidenav::-webkit-scrollbar{width:6px}
.pjm-sidenav::-webkit-scrollbar-thumb{background:var(--rule-dk);border-radius:3px}
.pjm-sidenav::-webkit-scrollbar-track{background:transparent}
.pjm-sidenav a{
  font-family:var(--data);font-size:12px;letter-spacing:.08em;text-transform:uppercase;
  text-decoration:none;color:var(--zinc);padding:10px 12px;border-left:2px solid transparent;
}
.pjm-sidenav a:hover{background:rgba(237,240,246,.06);color:#fff}
.pjm-sidenav a[aria-current="page"]{
  border-left-color:var(--brand);background:rgba(0,160,255,.1);color:#fff;
}
.pjm-side-foot{border-top:1px solid var(--rule-dk);padding-top:18px;display:flex;flex-direction:column;gap:10px}
.pjm-side-who{font-family:var(--disp);font-weight:600;font-size:14px;color:var(--paper)}
.pjm-side-ver{font-family:var(--data);font-size:10px;letter-spacing:.06em;color:var(--steel-dk)}
.pjm-btn--ghostdk{background:transparent;color:var(--zinc);border-color:var(--rule-dk);cursor:pointer}
.pjm-btn--ghostdk:hover{background:var(--brand);border-color:var(--brand);color:#fff}

.pjm-adminmain{padding:26px 30px 60px;max-width:1180px}
.pjm-adminhead{
  display:flex;align-items:baseline;justify-content:space-between;gap:20px;
  padding-bottom:20px;margin-bottom:26px;border-bottom:1px solid var(--rule);
}
.pjm-adminhead h1{font-family:var(--disp);font-weight:800;letter-spacing:-.03em;font-size:28px}
.pjm-adminhead-view{
  font-family:var(--data);font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--brand-ink);text-decoration:none;
}

/* ---------- stat cards ---------- */
.pjm-cards{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--rule-strong);border:1px solid var(--rule-strong)}
.pjm-card{background:#fff;padding:20px 18px;text-decoration:none;display:flex;flex-direction:column;gap:6px}
.pjm-card:hover{background:var(--paper)}
.pjm-card:hover .pjm-card-n{color:var(--brand-ink)}
.pjm-card-n{font-family:var(--disp);font-weight:800;font-size:32px;letter-spacing:-.04em;line-height:1}
.pjm-card-l{font-family:var(--data);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--steel)}

/* ---------- updater ---------- */
.pjm-staged{padding:22px 18px;background:#fff}
.pjm-kv{display:grid;grid-template-columns:120px 1fr;gap:10px 16px;margin-bottom:20px}
.pjm-kv dt{font-family:var(--data);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--steel);padding-top:3px}
.pjm-kv dd{font-size:15px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.pjm-guarantees{list-style:none;margin:20px 0;border-top:1px solid var(--rule)}
.pjm-guarantees li{
  font-size:14px;color:var(--ink-2);padding:9px 0 9px 20px;
  position:relative;border-bottom:1px solid var(--rule);
}
.pjm-guarantees li::before{content:"\2713";position:absolute;left:0;color:var(--live);font-size:12px}
.pjm-guarantees code{font-family:var(--data);font-size:13px;background:var(--paper);padding:1px 5px}
.pjm-skipnote{font-family:var(--data);font-size:11px;color:var(--steel);letter-spacing:.04em;margin-top:8px}
.pjm-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.pjm-actions form{margin:0}
.pjm-actions .pjm-btn{cursor:pointer}
.pjm-rowacts{display:flex;gap:6px}
.pjm-rowacts form{margin:0}
.pjm-btn--tiny{padding:6px 10px;font-size:10px;cursor:pointer}
.pjm-linkbtn{
  background:none;border:0;padding:0;cursor:pointer;color:var(--brand-ink);
  font-family:var(--data);font-size:11px;letter-spacing:.06em;
}
.pjm-linkbtn:hover{text-decoration:underline}

.pjm-empty{padding:26px 18px;color:var(--steel);font-size:14px;background:#fff}
.pjm-note{background:#fff;border:1px solid var(--rule);padding:14px 16px;font-size:14px;color:var(--steel)}
.pjm-note a{color:var(--brand-ink)}
.pjm-tag-rush{
  font-family:var(--data);font-size:9px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--stamp);border:1px solid var(--stamp);padding:1px 5px;margin-left:6px;
}

@media(max-width:1000px){
  .pjm-cards{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:820px){
  .pjm-adminshell{grid-template-columns:1fr}
  .pjm-side{position:static;height:auto;flex-direction:row;flex-wrap:wrap;align-items:center;gap:16px}
  .pjm-sidenav{flex-direction:row;flex-wrap:wrap;flex:1 1 100%}
  .pjm-sidenav a{border-left:0;border-bottom:2px solid transparent;padding:8px 10px}
  .pjm-sidenav a[aria-current="page"]{border-left:0;border-bottom-color:var(--brand)}
  .pjm-side-foot{border-top:0;padding-top:0;flex-direction:row;align-items:center;gap:14px;flex:1 1 100%}
  .pjm-adminmain{padding:22px 20px 50px}
  .pjm-kv{grid-template-columns:1fr;gap:4px 0}
  .pjm-kv dd{margin-bottom:10px}
}

/* ---------- portal ---------- */
.pjm-portalmain{padding:26px 0 60px}
.pjm-whoami{
  font-family:var(--data);font-size:11px;letter-spacing:.06em;color:var(--zinc);
  text-transform:uppercase;
}
.pjm-nav-cta form{margin:0}

/* ---------- request form ---------- */
.pjm-kinds{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.pjm-kind,.pjm-prio{display:block;cursor:pointer}
.pjm-kind input,.pjm-prio input{position:absolute;opacity:0;width:0;height:0}
.pjm-kind-box,.pjm-prio-box{
  display:flex;flex-direction:column;gap:4px;height:100%;
  border:1px solid var(--rule-strong);padding:14px;background:var(--paper);
  transition:border-color .12s ease, background .12s ease;
}
.pjm-kind:hover .pjm-kind-box,.pjm-prio:hover .pjm-prio-box{background:#fff}
.pjm-kind input:checked + .pjm-kind-box,
.pjm-prio input:checked + .pjm-prio-box{
  border-color:var(--brand);background:#fff;box-shadow:inset 3px 0 0 0 var(--brand);
}
.pjm-kind input:focus-visible + .pjm-kind-box,
.pjm-prio input:focus-visible + .pjm-prio-box{outline:2px solid var(--brand);outline-offset:2px}
.pjm-kind-name,.pjm-prio-name{font-family:var(--disp);font-weight:600;font-size:15px}
.pjm-kind-desc,.pjm-prio-desc{font-size:13px;color:var(--steel);line-height:1.4}
.pjm-prio--rush input:checked + .pjm-prio-box{border-color:var(--stamp);box-shadow:inset 3px 0 0 0 var(--stamp)}

.pjm-staged .pjm-field,.pjm-staged .pjm-row2,.pjm-staged fieldset{margin-bottom:18px}
.pjm-row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.pjm-priority{border:0;padding:0}
.pjm-priority legend{
  font-family:var(--data);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--steel);margin-bottom:8px;
}
.pjm-priority{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pjm-priority legend{grid-column:1/-1}
.pjm-check{display:flex;align-items:center;gap:9px;font-size:14px;margin-bottom:16px;cursor:pointer}
.pjm-check input{width:16px;height:16px;accent-color:var(--brand)}

/* ---------- request detail ---------- */
.pjm-reqgrid{display:grid;grid-template-columns:1fr 340px;gap:28px;align-items:start}
.pjm-subhead{
  font-family:var(--data);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--steel);margin:20px 0 8px;padding-top:16px;border-top:1px solid var(--rule);
}
.pjm-longtext{font-size:15px;line-height:1.6;color:var(--ink-2);white-space:pre-wrap}

.pjm-track{list-style:none;display:flex;gap:0;margin:0 0 24px;padding:0}
.pjm-track-step{flex:1;position:relative;padding-top:20px;text-align:center}
.pjm-track-step::before{
  content:"";position:absolute;top:5px;left:0;right:0;height:2px;background:var(--rule-strong);
}
.pjm-track-step:first-child::before{left:50%}
.pjm-track-step:last-child::before{right:50%}
.pjm-track-step.is-done::before{background:var(--live)}
.pjm-track-dot{
  position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:12px;height:12px;border-radius:50%;background:var(--paper-2);
  border:2px solid var(--rule-strong);
}
.pjm-track-step.is-done .pjm-track-dot{background:var(--live);border-color:var(--live)}
.pjm-track-label{
  font-family:var(--data);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--steel);
}
.pjm-track-step.is-done .pjm-track-label{color:var(--live)}

.pjm-hist{list-style:none;margin:0;padding:0}
.pjm-hist li{
  display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:baseline;
  padding:9px 0;border-bottom:1px solid var(--rule);
}
.pjm-hist li:last-child{border-bottom:0}
.pjm-hist-when{font-family:var(--data);font-size:10px;color:var(--steel);white-space:nowrap}
.pjm-hist-what{font-size:14px;color:var(--ink-2)}
.pjm-hist-who{font-family:var(--data);font-size:10px;color:var(--steel)}

/* ---------- tabs ---------- */
.pjm-tabs{display:flex;gap:2px;border-bottom:1px solid var(--rule-strong);flex-wrap:wrap}
.pjm-tabs a{
  font-family:var(--data);font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  text-decoration:none;color:var(--steel);padding:10px 14px;border-bottom:2px solid transparent;
}
.pjm-tabs a span{color:var(--ink);font-weight:600}
.pjm-tabs a:hover{color:var(--ink)}
.pjm-tabs a.is-on{color:var(--ink);border-bottom-color:var(--brand)}

@media(max-width:900px){
  .pjm-kinds{grid-template-columns:1fr 1fr}
  .pjm-reqgrid,.pjm-row2,.pjm-priority{grid-template-columns:1fr}
  .pjm-priority legend{grid-column:1}
  .pjm-portalmain .pjm-nav{display:none}
  .pjm-hist li{grid-template-columns:1fr;gap:2px}
}
@media(max-width:560px){
  .pjm-kinds{grid-template-columns:1fr}
}

.pjm-acct-note{font-size:14px;color:var(--steel);line-height:1.55}

.pjm-enquiry{padding:18px;border-bottom:1px solid var(--rule);background:#fff}
.pjm-enquiry:last-child{border-bottom:0}
.pjm-enquiry-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:10px}
.pjm-enquiry-head a{color:var(--brand-ink);text-decoration:none}
.pjm-enquiry-foot{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px solid var(--rule)}

/* ---------- diagnostics suites ---------- */
.pjm-fix{font-size:13px;color:var(--stamp)}
.pjm-inlineform{display:flex;gap:6px;align-items:center}
.pjm-inlineform input[type=text]{
  font-family:var(--body);font-size:13px;padding:6px 8px;
  border:1px solid var(--rule-strong);background:var(--paper);width:170px;
}
.pjm-inlineform input:focus{outline:2px solid var(--brand);outline-offset:1px;background:#fff}
.pjm-inlineform .pjm-btn{white-space:nowrap}
.pjm-board-foot form{margin:0}

/* ---------- notification bell ---------- */
.pjm-adminhead-r{display:flex;align-items:center;gap:18px}
.pjm-bell{position:relative}
.pjm-bell-btn{
  position:relative;background:none;border:1px solid var(--rule-strong);
  width:36px;height:32px;display:grid;place-items:center;cursor:pointer;color:var(--ink);
}
.pjm-bell-btn:hover{border-color:var(--brand);color:var(--brand-ink)}
.pjm-bell-badge{
  position:absolute;top:-7px;right:-7px;min-width:17px;height:17px;padding:0 4px;
  background:var(--stamp);color:#fff;border-radius:9px;
  font-family:var(--data);font-size:10px;font-weight:600;line-height:17px;text-align:center;
}
.pjm-bell-panel{
  position:absolute;right:0;top:calc(100% + 8px);width:360px;max-width:calc(100vw - 40px);
  background:#fff;border:1px solid var(--rule-strong);border-top:2px solid var(--brand);
  box-shadow:0 18px 44px rgba(10,14,26,.28);z-index:30;
}
.pjm-bell-head{
  padding:10px 14px;background:var(--ink);color:var(--zinc);
  font-family:var(--data);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
}
.pjm-bell-list{max-height:400px;overflow-y:auto}
.pjm-bell-empty{padding:22px 14px;font-size:13px;color:var(--steel);line-height:1.5}
.pjm-bell-item{
  display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:baseline;
  padding:11px 14px;border-bottom:1px solid var(--rule);text-decoration:none;
}
.pjm-bell-item:last-child{border-bottom:0}
.pjm-bell-item:hover{background:var(--paper)}
.pjm-bell-item .pjm-dot{margin-top:5px}
.pjm-bell-item.is-alert .pjm-dot{background:var(--stamp)}
.pjm-bell-item.is-warn .pjm-dot{background:var(--brand)}
.pjm-bell-item.is-info .pjm-dot{background:var(--steel)}
.pjm-bell-text{font-size:13px;color:var(--ink-2);line-height:1.45}
.pjm-bell-ago{font-family:var(--data);font-size:10px;color:var(--steel);white-space:nowrap}

/* ---------- photo packages ---------- */
.pjm-pkgrow{padding:16px 18px;border-bottom:1px solid var(--rule);background:#fff}
.pjm-pkgrow:last-child{border-bottom:0}
.pjm-pkgrow-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.pjm-pkgrow-head .pjm-state{margin-left:8px}
.pjm-pkgrow-edit{margin-top:12px;border-top:1px solid var(--rule);padding-top:10px}
.pjm-pkgrow-edit summary{
  cursor:pointer;font-family:var(--data);font-size:11px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--steel);
}
.pjm-pkgrow-edit summary:hover{color:var(--brand-ink)}
.pjm-pkgrow-edit[open] summary{color:var(--ink);margin-bottom:6px}
.pjm-board-foot code{font-family:var(--data);font-size:11px;background:var(--paper);padding:1px 5px}

/* ---------- cron ---------- */
.pjm-cmd{
  font-family:var(--data);font-size:12px;line-height:1.6;
  background:var(--ink);color:var(--paper);padding:14px;margin:14px 0;
  overflow-x:auto;white-space:pre-wrap;word-break:break-all;
}

/* ---------- conversation thread ---------- */
.pjm-thread{list-style:none;margin:0 0 8px;padding:0;display:flex;flex-direction:column;gap:12px}
.pjm-thread-item{padding:12px 14px;border-left:3px solid var(--rule-strong);background:var(--paper)}
.pjm-thread-item.is-staff{border-left-color:var(--brand);background:#fff;border:1px solid var(--rule);border-left:3px solid var(--brand)}
.pjm-thread-meta{
  display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-bottom:5px;
  font-family:var(--data);font-size:10px;letter-spacing:.06em;color:var(--steel);
}
.pjm-thread-meta strong{font-family:var(--disp);font-size:13px;letter-spacing:0;color:var(--ink)}
.pjm-thread-tag{
  border:1px solid var(--brand);color:var(--brand-ink);padding:1px 5px;
  font-size:9px;letter-spacing:.1em;text-transform:uppercase;
}
.pjm-thread-body{font-size:14px;line-height:1.55;color:var(--ink-2);white-space:pre-wrap}

/* ---------- equipment admin ---------- */
.pjm-thumb{
  width:56px;height:56px;object-fit:contain;background:var(--paper);
  border:1px solid var(--rule);flex:0 0 auto;
}
.pjm-thumb--none{
  display:grid;place-items:center;font-family:var(--data);font-size:8px;
  letter-spacing:.06em;color:var(--steel);text-align:center;
}
.pjm-row3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;width:100%}
.pjm-orderbar{
  display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;
  margin-top:12px;padding-top:12px;border-top:1px solid var(--rule);
}
.pjm-orderbar .pjm-field{margin-bottom:0}
.pjm-orderbar .pjm-btn{cursor:pointer}
@media(max-width:900px){ .pjm-row3{grid-template-columns:1fr} }

.pjm-paynow{
  font-family:var(--data);font-size:11px;letter-spacing:.04em;color:var(--stamp);
  text-decoration:none;border-bottom:1px solid currentColor;
}
.pjm-paynow:hover{color:var(--brand-ink)}

/* ---------- two-factor ---------- */
.pjm-2fa{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start;margin-top:8px}
.pjm-qr{background:#fff;border:1px solid var(--rule-strong);padding:10px;max-width:230px}
.pjm-qr svg{display:block;width:100%;height:auto}
.pjm-codes{
  display:grid;grid-template-columns:repeat(2,1fr);gap:1px;margin-top:16px;
  background:var(--rule-strong);border:1px solid var(--rule-strong);
}
.pjm-codes span{
  background:#fff;padding:11px 14px;font-family:var(--data);font-size:15px;
  letter-spacing:.1em;text-align:center;color:var(--ink);
}
@media(max-width:900px){ .pjm-2fa,.pjm-codes{grid-template-columns:1fr} }
.pjm-editrow td{padding:0 14px 12px;border-top:0}
.pjm-editrow .pjm-pkgrow-edit{margin-top:0;border-top:0;padding-top:0}

/* ---------- traffic ---------- */
.pjm-statgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1px;background:var(--rule-strong);
  border:1px solid var(--rule-strong);margin-bottom:22px}
.pjm-stat{background:#fff;padding:16px 18px;display:flex;flex-direction:column;gap:3px}
.pjm-stat-n{font-family:var(--disp);font-weight:800;font-size:28px;letter-spacing:-.03em;color:var(--ink);line-height:1}
.pjm-stat-l{font-family:var(--data);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--steel)}
.pjm-spark{display:flex;align-items:flex-end;gap:2px;height:76px;padding:0 2px;
  border-bottom:1px solid var(--rule-strong)}
.pjm-spark-bar{flex:1;background:var(--brand-ink);min-width:2px;opacity:.85}
.pjm-spark-bar:hover{opacity:1;background:var(--stamp)}
@media(max-width:640px){ .pjm-statgrid{grid-template-columns:1fr} }

/* ---------- dashboard ---------- */
.pjm-board--alert{border-left:3px solid var(--stamp)}
.pjm-todo{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1px;
  background:var(--rule-strong);border:1px solid var(--rule-strong)}
.pjm-todo-item{display:flex;align-items:baseline;gap:10px;padding:15px 18px;background:#fff;
  text-decoration:none;transition:background .12s ease}
.pjm-todo-item:hover{background:var(--paper)}
.pjm-todo-item--urgent{border-left:3px solid var(--stamp)}
.pjm-todo-n{font-family:var(--disp);font-weight:800;font-size:26px;letter-spacing:-.03em;
  color:var(--ink);line-height:1}
.pjm-todo-item--urgent .pjm-todo-n{color:var(--stamp)}
.pjm-todo-l{font-size:13px;color:var(--ink-2);line-height:1.3}

/* ---------- dashboard widgets ---------- */
.pjm-wpair{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start}
.pjm-wpair > :only-child{grid-column:1 / -1}
/* On the dashboard the row wrapper owns vertical rhythm, so stat rows shouldn't add their
   own bottom margin (that double-spaced them relative to every other row). */
.pjm-dash .pjm-statgrid{margin-bottom:0}
.pjm-wstat{
  background:#fff;padding:16px 18px;display:flex;flex-direction:column;gap:3px;
  text-decoration:none;transition:background .12s ease;
}
.pjm-wstat:hover{background:var(--paper)}
.pjm-wlist{list-style:none;display:flex;flex-direction:column;gap:1px;background:var(--rule-strong);
  border:1px solid var(--rule-strong)}
.pjm-witem{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;background:#fff}
.pjm-witem[draggable="true"]{cursor:grab}
.pjm-witem.is-dragging{opacity:.4}
.pjm-witem--off{background:var(--paper)}
.pjm-wgrip{color:var(--steel);font-size:15px;line-height:1.4;user-select:none}
.pjm-winfo{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.pjm-winfo strong{font-family:var(--disp);font-weight:600;font-size:14px;color:var(--ink)}
.pjm-wsize{font-family:var(--data);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--brand-ink)}
.pjm-wdesc{font-size:12px;color:var(--steel);line-height:1.45}
.pjm-wx,.pjm-wadd{
  background:none;border:1px solid var(--rule-strong);color:var(--steel);cursor:pointer;
  font-family:var(--data);font-size:10px;letter-spacing:.08em;text-transform:uppercase;
  padding:4px 9px;flex-shrink:0;
}
.pjm-wx{font-size:16px;line-height:1;padding:2px 8px;border:0}
.pjm-wx:hover{color:var(--stamp)}
.pjm-wadd:hover{border-color:var(--brand-ink);color:var(--brand-ink)}
@media(max-width:900px){ .pjm-wpair{grid-template-columns:1fr} }

/* Lead going cold: a lead sat in new/contacted past 48h. */
.pjm-stale{color:var(--stamp);font-weight:600}