/* ==========================================================================
   cowell-ledger.css: the ledger-desk skin for the two interface previews
   (portal.html and admin.html). Loaded after cowell-co.css on those pages
   only. Restyles by class; adds no hooks, so portal-shared.js, portal.js,
   and admin.js keep working unchanged. 2026-09-03.
   ========================================================================== */
:root {
  --paper: #f7efe3;
  --paper-deep: #eee1cf;
  --paper-edge: #e4d5c1;
  --rule: #e6d9c8;
  --rule-ink: #2b2118;
  --margin-red: #c94a3a;
  --walnut: #241a14;
  --walnut-2: #33261d;
  --stamp-red: #a8321f;
  --stamp-amber: #7c5200;
  --stamp-green: #2f5a3a;
  --marker: rgba(251, 191, 36, 0.55);
}

/* ---- Shell and paper ---------------------------------------------------- */
.portal-shell { background: var(--paper); }
.portal-main {
  background-color: var(--paper);
  background-image:
    repeating-linear-gradient(to bottom, transparent 0 31px, rgba(43, 33, 24, 0.075) 31px 32px),
    linear-gradient(to right, transparent 0 60px, var(--margin-red) 60px 61px, transparent 61px);
  background-attachment: local;
}
.portal-content { padding-left: 84px; padding-right: var(--sp-lg); counter-reset: folio; }

/* ---- Sidebar: walnut rail with folder tabs and a skyline watermark ------ */
.portal-side {
  background-color: var(--walnut);
  background-image:
    repeating-linear-gradient(115deg, rgba(255,247,237,0.025) 0 2px, transparent 2px 9px),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1460 900'><path fill='%23fff7ed' fill-opacity='0.07' d='m728.5 58 16 1 38 7h6l13.5 4 3 6.5v47l1.5 1.5 11 1 6.5 4.5 1 2V331q3.1-2 10-1v-32.5l5.5-7.5q9.8-1.7 12.5 3.5l2 10.5 32-16v-63.5l4.5-5.5 9-1 3.5 2.5 2 4v53l1 1V289l33 15q-1.4-9.5 4.5-13l9-1 4.5 3.5 2 5V330l19.5 2 4.5 2 3 7.5V435l33.5 3 1 1 37 4 1 1 18 1 4 1 4.5 3.5 2 5V697h19.5l.5-.5v-316l4.5-5.5 2-1h130q5.4 3.1 6.5 10.5v59l-1 2.5 10.5 1 36 16 10.5 6.5 2 4v192l1.5 1.5h36l5.5 4.5 1 2V890h42.5l5.5 3.5 1 6.5H45.5l-.5-2.5 3.5-5.5 4-2H95V751.5l5.5-7.5 2-1H140V497.5l32-63 27-49 3-8 12-22 3.5-3.5 5-1 6.5 2 75 142.5V777h23v-29.5l1-2v-54q-2.7-1.7-1-8l1-4v-2l-1-2q2.5-1.5 1-7v-2l-1-17 1-1v-9l-1-4 1-1v-39l-1-3 1-2v-69l1-4 18-26 22-26 14.5-14.5 6-1 3 1 15.5 15.5 12.5 14.5.5-112.5 1-1v-2l-1-3 1-1v-8q-2.5-1.5-1-7l-3.5-3.5-10.5-8-15-19.5-10-20-5-22v-26q8-46 38.5-69.5 14.6-12.4 35-19l19-4h25l20 4 20 9q17.3 9.8 29.5 24.5 13.9 17.1 21 41l3 16v21l-4 20-10 23q-9.8 16.7-24.5 28.5l-5.5 3v544.5l.5.5H578V485.5q1.4-6.1 6.5-8.5l4-1 32-1 4.5-1V135.5q1.3-5.7 5.5-8.5l5-2q7.5 1 10.5-1V74.5l4.5-7.5 5-2 28-2 1-1h10l1-1h10l10-2h12zm2.5 19-1 1h-10l-1 1h-10l-1 1-40 3-2 2v37l13-2h9l10-2h8l1-1 17-1 1-1h8l1-1h12l36 7h3V85zm-10 58-10 2-18 1-1 1-39 3-1 1q-7-1-7 1v588h50l2 1 4 6v151h31V256l-1-8 1-3v-76l-1-1 1-3v-30zm30 0v755h55V144zm-278 39-15 3-8 3q-14 6-24 15t-17 21l1 1h146l-7-11q-13-17-34-26l-24-6zm-72 62-3 6-1 15-1 1 1 16 4 15 2 1h160l2-4 3-13v-24l-3-11v-2zm496 68-41 22-1 2 35-2 1-1h25l9 2h9l1 1h5l-7-6zm-483 6 3 7q11 13 28 21l15 6 17 3 20-1 15-4q15-6 27-16l13-14v-2zm479 34-1 1-47 3-1 1h-14l-5 1v540h70V345zm21 1v154l1 4v12l-1 1q-1 5 1 7l-1 5v2l1 6v2l-1 2q3 1 1 7v48l-1 1q3 1 1 8v2l-1 3 1 15v2l-1 21v243h15V598l1-1-1-2 1-1v-15l7-6h30l1-1v-39l-1-1v-91l1-2v-2l-1-2v-85zm-390 13-12 4v105h12zm-83 1v107l2 1h10l1-1v-78l-1-1v-25zm32 7v112l-2 4-6 4h-23l-1 1v77l2 1h23l2 1q4 3 5 9v81l-2 4-7 4h-22l-1 1v78h24l3 1 5 8v138h20V750l1-2 7-5h23v-79h-21l-8-3-2-4v-85l1-2 7-5h23v-79h-22l-5-2-4-5-1-112zm-252 17-8 18-51 95 1 7 120 215 2 1v-9l-1-1V509l1-1v-6l-5-11-57-106q1-3-2-2m908 10-2 2v16l3 2h23v-18l-1-2zm43 0v20h58l1-1v-19zm4 38-4 1v265h19V473l2-5 37-15 1-1v-20h-12l-1-1zm-49 1v264l2 1h23V434l1-1zm-140 22v118h59l5 2 4 8v115h14V532l-1-1v-59q2-2 1-6l-3-3-16-1-1-1-24-2-9-2h-8l-9-2h-8zm255 14-32 13v409h34V469zm21 2v419l2 1h69V686h-37l-2-1-5-5V491l1-4-1-4q-12-8-27-13m-876 5-14 18-5 4-9 9-1 7-11 14v158l-1 5 1 2v26l-1 3 1 4q-2 1-1 7l1 3v12l-1 1 1 2-1 2v25h32l4 1 5 7v105h34V518l-6-8q1-7-3-8l-18-22q-2-5-7-5m238 18-1 1h-17l-1 1h-8v237h27zm-465 43-1 219-2 4-7 3h-36v128h254v-92l-1-2-4 1-2-1h-69l-2-1-5-5v-31l-3-6-22-36zm281 48v61h13v-61zm71 0v61h12v-61zm437 7v299h87V593l-1-2zm106 125v174h136V716zm-457 35v139h85V754l-1-2h-20q-2-2-7-1h-2l-27 1h-2l-2-1-2 1-2-1zm-155 11-2 2v60l1 1v50l-1 1v14h13V762zm69 0v128h13v-14l-1-1V762z'/></svg>");
  background-repeat: repeat, no-repeat;
  background-size: auto, 150% auto;
  background-position: 0 0, 40% 112%;
  color: var(--sand);
  border-right: 1px solid rgba(255, 247, 237, 0.08);
  padding-right: 0;
}
.portal-brand { padding-right: var(--sp-md); border-bottom: 1px solid rgba(255, 247, 237, 0.14); }
.portal-brand__mark { color: var(--yellow, #fbbf24); }
.portal-brand__name { letter-spacing: -0.01em; }
.portal-brand__sub { color: var(--sand); letter-spacing: 0.2em; font-weight: 600; }

.portal-nav { gap: 0; margin-top: var(--sp-sm); }
.portal-nav__item {
  border-radius: 10px 0 0 10px;
  border-bottom: 1px solid rgba(255, 247, 237, 0.08);
  padding: 0.72rem 0.9rem 0.72rem 0.8rem;
  margin-right: 0;
  color: var(--sand);
  font-weight: 500;
  position: relative;
}
.portal-nav__item:hover { background: rgba(255, 247, 237, 0.05); color: var(--white); }
.portal-nav__item.is-active {
  background: var(--paper);
  color: var(--ink);
  font-weight: 600;
  border-color: transparent;
  box-shadow: inset 4px 0 0 var(--orange-deep);
}
.portal-nav__item.is-active .icon { color: var(--orange-deep); }
.portal-nav__item.is-active::after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 1px;
  background: var(--paper);
}
.portal-nav__count {
  font-family: var(--font-serif);
  font-variant-numeric: tabular-nums;
  font-size: 0.72rem;
  font-weight: 700;
  border-radius: 2px;
  padding: 1px 7px;
  background: transparent;
  border: 1px solid rgba(255, 247, 237, 0.28);
  color: var(--sand);
}
.portal-nav__item.is-active .portal-nav__count { background: transparent; color: var(--ink); border-color: var(--rule-ink); }
.portal-nav__count--alert { background: var(--orange-deep); border-color: var(--orange-deep); color: var(--white); }
.portal-nav__item.is-active .portal-nav__count--alert { background: var(--orange-deep); color: var(--white); border-color: var(--orange-deep); }

.portal-side__foot { padding-right: var(--sp-md); }
.portal-back { color: #f6dca0; }
.portal-demo { color: #d9d2c8; border-top: 1px solid rgba(255, 247, 237, 0.14); }

/* ---- Top bar: desk header with a double rule ---------------------------- */
.portal-topbar {
  background: var(--paper);
  border-bottom: 1px solid var(--rule-ink);
  box-shadow: 0 3px 0 0 var(--paper), 0 4px 0 0 var(--rule-ink);
  padding-left: 84px;
}
.portal-eyebrow { color: var(--orange-deep); letter-spacing: 0.2em; }
.portal-eyebrow::before { content: ""; display: inline-block; width: 7px; height: 7px; background: var(--orange-deep); margin-right: 8px; vertical-align: 1px; }
.portal-title { font-size: 1.55rem; letter-spacing: -0.02em; }
.portal-user__name, .user-menu-trigger__name strong { font-family: var(--font-serif); font-size: 1rem; font-weight: 700; }

/* Seals: every avatar becomes a double-ring monogram */
.portal-user__avatar, .user-menu-trigger__avatar, .user-menu__avatar, .pavatar, .pthread-item__avatar {
  background: var(--white);
  color: var(--ink);
  border: 1.5px solid var(--rule-ink);
  box-shadow: inset 0 0 0 2px var(--white), inset 0 0 0 3px var(--rule-ink);
  font-family: var(--font-serif);
  font-weight: 700;
  letter-spacing: 0.02em;
}
.notif-trigger { border-radius: 3px; border: 1px solid var(--rule-ink); background: var(--white); color: var(--ink); }
.notif-trigger__badge, .portal-bell__dot { background: var(--stamp-red); border-radius: 2px; font-family: var(--font-serif); }

/* ---- Greeting, marker swipe, sticky note -------------------------------- */
.portal-hello h2 {
  font-size: 2.25rem;
  text-decoration: underline;
  text-decoration-color: var(--marker);
  text-decoration-thickness: 0.32em;
  text-underline-offset: -0.12em;
  text-decoration-skip-ink: none;
}
.portal-hello p { font-family: var(--font-serif); font-size: 1.08rem; color: var(--ink-soft); }
.pview-intro h2 { font-family: var(--font-serif); letter-spacing: -0.015em; }
.pview-intro p { font-family: var(--font-serif); font-size: 1.05rem; color: var(--ink-soft); }
.portal-intro {
  background: #fff3c2 !important;
  border: 0 !important;
  border-radius: 2px !important;
  box-shadow: 2px 3px 0 var(--paper-deep), 2px 3px 0 1px var(--rule);
  transform: rotate(-0.5deg);
  position: relative;
  overflow: visible;
  color: var(--ink);
  padding-top: calc(var(--sp-md) + 6px);
}
.portal-intro::before {
  content: "";
  position: absolute;
  top: -11px;
  left: 50%;
  width: 96px;
  height: 20px;
  margin-left: -48px;
  background: rgba(255, 255, 255, 0.55);
  border: 1px solid rgba(43, 33, 24, 0.08);
  transform: rotate(-2deg);
  pointer-events: none;
}

/* ---- Buttons: pressed stamp ---------------------------------------------- */
.portal-btn, .portal-shell .btn--primary, .pjob__actions .btn, .pcompose__send {
  border-radius: 3px;
  border: 1px solid var(--rule-ink);
  box-shadow: 3px 3px 0 var(--rule-ink);
  background: var(--orange-deep);
  color: var(--white);
  transition: transform 0.12s ease, box-shadow 0.12s ease;
}
.portal-btn:hover, .portal-shell .btn--primary:hover, .pjob__actions .btn:hover, .pcompose__send:hover {
  transform: translate(1px, 1px);
  box-shadow: 2px 2px 0 var(--rule-ink);
}
.portal-btn:active, .portal-shell .btn--primary:active { transform: translate(3px, 3px); box-shadow: 0 0 0 var(--rule-ink); }
.portal-shell .btn--ghost, .portal-shell .btn--secondary, .psort, .notif-dropdown__mark-read {
  border-radius: 3px;
  border: 1px solid var(--rule-ink);
  background: var(--white);
  color: var(--ink);
}

/* ---- Figures: a ledger strip with total lines --------------------------- */
.pstat-row, .pkpi-row {
  display: grid;
  gap: 0;
  background: var(--white);
  border: 1px solid var(--rule-ink);
  border-radius: 3px;
  box-shadow: 4px 4px 0 var(--paper-deep);
}
.pstat, .pkpi {
  background: transparent;
  border: 0;
  border-right: 1px solid var(--rule);
  border-radius: 0;
  box-shadow: none;
  padding: var(--sp-md) var(--sp-md) var(--sp-sm);
}
.pstat:last-child, .pkpi:last-child { border-right: 0; }
.pstat__label, .pkpi__label { color: var(--ink); letter-spacing: 0.16em; }
.pstat__label::before, .pkpi__label::before { content: ""; display: inline-block; width: 6px; height: 6px; background: var(--orange); margin-right: 7px; vertical-align: 1px; }
.pstat__value, .pkpi__value {
  font-family: var(--font-serif);
  font-variant-numeric: tabular-nums lining-nums;
  font-size: 2rem;
  line-height: 1.1;
  display: inline-block;
  padding-bottom: 4px;
  border-bottom: 3px double var(--rule-ink);
}
.pstat__value--alert, .pkpi__value--alert { color: var(--stamp-red); border-bottom-color: var(--stamp-red); }
.pkpi__value--ok { color: var(--stamp-green); border-bottom-color: var(--stamp-green); }
.pstat__sub, .pkpi__sub { color: var(--graphite); margin-top: 6px; }

/* ---- Panels: stacked sheets with a dog-ear and a folio number ------------ */
.ppanel {
  background: var(--white);
  border: 1px solid var(--paper-edge);
  border-radius: 2px;
  box-shadow: 5px 5px 0 var(--paper-deep), 5px 5px 0 1px var(--paper-edge);
  position: relative;
  counter-increment: folio;
}
.ppanel::before {
  content: "";
  position: absolute;
  top: -1px;
  right: -1px;
  width: 22px;
  height: 22px;
  background: linear-gradient(225deg, var(--paper) 0 50%, var(--paper-deep) 50% 100%);
  border-left: 1px solid var(--paper-edge);
  border-bottom: 1px solid var(--paper-edge);
}
.ppanel__head { border-bottom: 2px solid var(--rule-ink); padding-bottom: var(--sp-2xs); }
.ppanel__head h3 { letter-spacing: -0.015em; }
.ppanel__head::after {
  content: "No. " counter(folio, decimal-leading-zero);
  font-family: var(--font-sans);
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  color: var(--graphite);
  margin-left: var(--sp-2xs);
  white-space: nowrap;
}
.ppanel__link { color: var(--orange-deep); text-decoration: underline; text-underline-offset: 0.2em; text-decoration-thickness: 1px; }

/* ---- Stamps ----------------------------------------------------------------- */
.pbadge {
  border-radius: 2px;
  background: transparent;
  border: 1.5px solid currentColor;
  padding: 3px 8px;
  font-size: 0.6rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  transform: rotate(-1.5deg);
  mix-blend-mode: multiply;
}
.pbadge--alert { color: var(--stamp-red); background: transparent; }
.pbadge--review { color: var(--stamp-amber); background: transparent; }
.pbadge--done { color: var(--stamp-green); background: transparent; border-color: currentColor; }
.pbadge--done::before { content: "\2713\00a0"; }

/* ---- Tasks, feed, documents -------------------------------------------------- */
.pjob, .ptask {
  background: var(--white);
  border: 1px solid var(--rule);
  border-left: 4px solid var(--orange);
  border-radius: 2px;
}
.pjob__icon, .ptask__icon { border-radius: 2px; background: var(--paper); border: 1px solid var(--rule); color: var(--ink); }
.pjob__title { font-family: var(--font-serif); font-size: 1.05rem; }
.pfeed__dot { border-radius: 1px; width: 8px; height: 8px; transform: rotate(45deg); background: var(--orange-deep); }
.pfeed__dot--ok { background: var(--sand); }
.pfeed__item + .pfeed__item { border-top: 1px solid var(--rule); }
.pfeed__date { color: var(--stamp-red); }
.pdoc__icon { border-radius: 4px 4px 0 0; background: var(--paper-deep); border: 1px solid var(--paper-edge); border-bottom: 0; color: var(--ink); }
.pdoc + .pdoc { border-top: 1px solid var(--rule); }
.pdoc__name { font-family: var(--font-serif); font-size: 1rem; }

/* ---- Ledger tables ------------------------------------------------------------ */
.ptable { font-variant-numeric: tabular-nums lining-nums; }
.ptable th { color: var(--ink); font-size: 0.6rem; letter-spacing: 0.16em; border-bottom: 3px double var(--rule-ink); padding-bottom: 6px; }
.ptable td { border-top: 1px solid var(--rule); }
.ptable tbody tr:hover { background: var(--paper); }
.ptable tbody tr:hover td:first-child { box-shadow: inset 3px 0 0 var(--orange); }
.ptable__name { font-family: var(--font-serif); font-size: 1rem; font-weight: 700; }
.ptable-wrap { border-bottom: 1px solid var(--rule-ink); }
.ptable-wrap:focus-visible { outline: 2px solid var(--orange-deep); outline-offset: 2px; }

/* ---- Admin bars, months, search, messages ---------------------------------- */
.pbar { border: 1px solid var(--rule-ink); border-radius: 0; background: var(--paper); height: 12px; }
.pbar__fill { border-radius: 0; background: repeating-linear-gradient(45deg, var(--orange-deep) 0 4px, var(--orange) 4px 8px); }
.pmonth { border-radius: 0; border: 1px solid var(--rule-ink); background: linear-gradient(to top, var(--yellow, #fbbf24) 0 var(--h, 40%), var(--paper) var(--h, 40%)); }
.psearch input { border: 0; border-bottom: 1.5px solid var(--rule-ink); border-radius: 0; background: transparent; }
.psearch input:focus { outline: 2px solid var(--orange-deep); outline-offset: 2px; }
.pmsg--firm .pmsg__bubble { background: var(--white); border: 1px solid var(--rule); border-left: 3px solid var(--orange-deep); border-radius: 2px 14px 14px 14px; }
.pmsg:not(.pmsg--firm) .pmsg__bubble { background: var(--rule-ink); color: var(--paper); border-radius: 14px 2px 14px 14px; }
.pcompose textarea, .pcompose input { border: 1px solid var(--rule-ink); border-radius: 2px; background: var(--white); }
.pthread__day { font-family: var(--font-serif); font-style: italic; color: var(--graphite); }
.pthread-item { border-radius: 2px; }
.pthread-item.is-active, .pthread-item[aria-current] { background: var(--paper); box-shadow: inset 3px 0 0 var(--orange-deep); }
.pnote { background: #fff3c2; border: 0; border-radius: 2px; box-shadow: 2px 2px 0 var(--paper-deep); }
.ppay-method__chip { border-radius: 3px; border: 1px solid var(--rule-ink); background: var(--paper); color: var(--ink); }
.notif-dropdown, .user-menu { border: 1px solid var(--rule-ink); border-radius: 2px; box-shadow: 5px 5px 0 var(--paper-deep), 5px 5px 0 1px var(--paper-edge); background: var(--white); }
.notif-item--unread { background: var(--paper); }
.notif-item__dot { border-radius: 1px; transform: rotate(45deg); background: var(--orange-deep); }
.user-menu__demo-tag { border-radius: 2px; border: 1px solid var(--stamp-red); color: var(--stamp-red); background: transparent; letter-spacing: 0.12em; text-transform: uppercase; }

/* ---- Demo ribbon --------------------------------------------------------------- */
.demo-banner { background: var(--rule-ink); color: var(--paper); border-bottom: 1px solid rgba(255,247,237,0.12); }
.demo-banner__dot { background: var(--orange); }
.demo-banner__text a, .demo-banner__back { color: #fbe9c4; text-decoration: underline; text-underline-offset: 0.15em; }
.demo-banner__close { color: var(--paper); }

/* ---- Phones and narrow tablets: tab strip, no margin rule ---------------------- */
@media (max-width: 919px) {
  .portal-main { background-image: repeating-linear-gradient(to bottom, transparent 0 31px, rgba(43, 33, 24, 0.075) 31px 32px); }
  .portal-content { padding-left: var(--sp-md); padding-right: var(--sp-md); }
  .portal-topbar { padding-left: var(--sp-md); }
  .portal-side { padding-right: var(--sp-md); border-right: 0; border-bottom: 1px solid rgba(255,247,237,0.12); background-size: auto, 90% auto; background-position: 0 0, 100% 160%; }
  .portal-nav { display: flex; flex-direction: row; flex-wrap: nowrap; overflow-x: auto; gap: 6px; padding: 0 0 2px; margin-top: var(--sp-sm); scrollbar-width: none; }
  .portal-nav::-webkit-scrollbar { display: none; }
  .portal-nav__item { flex: none; border-radius: 10px 10px 0 0; border-bottom: 0; margin: 0; padding: 0.7rem 0.95rem; min-height: 44px; }
  .portal-nav__item.is-active { box-shadow: inset 0 4px 0 var(--orange-deep); }
  .portal-nav__item.is-active::after { display: none; }
  .pstat-row, .pkpi-row { grid-template-columns: 1fr 1fr; }
  .pstat:nth-child(2n), .pkpi:nth-child(2n) { border-right: 0; }
  .pstat:nth-child(-n+2), .pkpi:nth-child(-n+2) { border-bottom: 1px solid var(--rule); }
  .portal-intro { transform: none; }
  .portal-hello h2 { font-size: 1.8rem; }
}
@media (max-width: 480px) {
  .pstat-row, .pkpi-row { grid-template-columns: 1fr; }
  .pstat, .pkpi { border-right: 0; border-bottom: 1px solid var(--rule); }
  .pstat:last-child, .pkpi:last-child { border-bottom: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .portal-btn, .portal-shell .btn--primary { transition: none; }
}
@media (forced-colors: active) {
  .ppanel, .pstat-row, .pkpi-row, .pbadge, .portal-nav__item.is-active { border: 1px solid ButtonText; box-shadow: none; }
}

/* ============================================================
   Density pass (2026-09-03). Same skin, same layout, same
   functions: type and spacing step down so the dashboard shows a
   whole account at a glance, and the documents panel on the
   dashboard lists every file in two ruled columns instead of four
   rows behind a "view all" link.
   ============================================================ */
.portal-body {
  --fs-body: 0.9rem;
  --fs-body-lg: 1rem;
  --fs-small: 0.82rem;
  --fs-micro: 0.68rem;
  --fs-h3: 1.12rem;
  --fs-h2: clamp(1.6rem, 1.6vw + 0.6rem, 2.2rem);
  --sp-sm: 0.8rem;
  --sp-md: 1.15rem;
  --sp-lg: 1.7rem;
  --sp-xl: 2.5rem;
  --sp-2xl: 3.6rem;
}
.portal-body .ppanel { padding: var(--sp-md) var(--sp-md) var(--sp-md); }
.portal-body .ppanel__head { margin-bottom: var(--sp-sm); }
.portal-body .ppanel__head h3 { font-size: 1.25rem; }
.portal-body .pkpi { padding: var(--sp-sm) var(--sp-md); }
.portal-body .pkpi__value { font-size: 1.6rem; }
.portal-body .ptask { padding: var(--sp-sm); gap: var(--sp-sm); }
.portal-body .ptask__icon, .portal-body .pdoc__icon { width: 34px; height: 34px; }
.portal-body .pfeed__item { padding: 0.45rem 0; }
.portal-body .pdoc { padding: 0.5rem 0; gap: 0.7rem; }
.portal-body .pdoc__name { font-size: 0.95rem; }
.portal-body .pdoc__meta { font-size: 0.72rem; }
.portal-body .pbadge { font-size: 0.6rem; padding: 3px 7px; }
.portal-body .pdoc__dl { width: 28px; height: 28px; }
.portal-body .portal-hello { margin-bottom: var(--sp-md); }
.portal-body .portal-intro { padding: var(--sp-sm) var(--sp-md); }
/* dashboard documents: every file, two ruled columns on wide screens */
@media (min-width: 1100px) {
  .portal-body .ppanel > .pdoc-list:not(.pdoc-list--full) {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: var(--sp-lg);
    row-gap: 0;
  }
  .portal-body .ppanel > .pdoc-list:not(.pdoc-list--full) .pdoc { border-top: 1px solid var(--line); }
  .portal-body .ppanel > .pdoc-list:not(.pdoc-list--full) .pdoc:nth-child(-n+2) { border-top: 0; }
}

/* The base stylesheet sets overflow-x: hidden on body, which turns body
   into the scroll container for sticky descendants and quietly disables
   the sticky sidebar and demo banner. html already clips horizontal
   overflow, so the portal body can leave it visible. */
.portal-body { overflow-x: visible; }
.portal-shell { overflow: visible; }

/* The status line under the greeting carries a delicate burnt-orange
   glow that breathes, a quiet reminder that it is important and current. */
.portal-hello p {
  color: var(--ink);
  text-shadow: 0 0 6px rgba(193,65,12,0.34), 0 0 18px rgba(193,65,12,0.18);
  animation: hello-glow 3.6s ease-in-out infinite;
}
@keyframes hello-glow {
  0%, 100% { text-shadow: 0 0 6px rgba(193,65,12,0.28), 0 0 18px rgba(193,65,12,0.14); }
  50%      { text-shadow: 0 0 8px rgba(193,65,12,0.55), 0 0 24px rgba(193,65,12,0.30); }
}
@media (prefers-reduced-motion: reduce) {
  .portal-hello p { animation: none; text-shadow: 0 0 7px rgba(193,65,12,0.42), 0 0 20px rgba(193,65,12,0.22); }
}

/* Correction: the letters themselves glow burnt orange, no haze around them. */
.portal-hello p {
  color: #b93a0a;
  text-shadow: none;
  animation: hello-glow-ink 3.6s ease-in-out infinite;
}
@keyframes hello-glow {
  0%, 100% { text-shadow: none; }
  50%      { text-shadow: none; }
}
@keyframes hello-glow-ink {
  0%, 100% { color: #b93a0a; text-shadow: 0 0 0 rgba(238,79,20,0); }
  50%      { color: #ee5a1a; text-shadow: 0 0 1px rgba(238,90,26,0.35); }
}
@media (prefers-reduced-motion: reduce) {
  .portal-hello p { animation: none; color: #c8460e; text-shadow: none; }
}

/* ---- Mobile QA fixes (2026-09-03) ------------------------------------------
   Two skin rules above collided with shared class names: `.pbar` is the
   billing chart's column (the fill is `.pbar__fill`), and `.pmonth` is a
   deadline group, not a chart month. Both restored. */
.pbar { height: 100%; border: 0; background: transparent; }
.pbar__fill { border: 1px solid var(--rule-ink); }
.pmonth { background: transparent; border: 0; border-top: 3px solid var(--rule-ink); padding-top: 0.5rem; }
/* the dashboard call to action pointed left: the sprite is a back arrow */
.portal-hello .portal-btn .icon { transform: scaleX(-1); }
@media (max-width: 919px) {
  /* every tab visible: the strip wraps instead of hiding tabs off the edge */
  .portal-nav { flex-wrap: wrap; overflow: visible; row-gap: 6px; }
  .portal-nav__item { flex: 1 1 auto; text-align: center; }
  /* conversation header: name on one line, the reply pill under it */
  .ppanel__head { flex-wrap: wrap; row-gap: 0.4rem; }
  .ppanel__head .ptag { flex-basis: 100%; }
}

@media (max-width: 919px) {
  .pcompose textarea, .pcompose input { min-height: 3.4rem; line-height: 1.35; }
}
/* every CTA with a trailing arrow points forward; the sprite is a back arrow (back links keep it) */
.portal-btn > .icon:last-child, .pjob__actions .btn > .icon:last-child { transform: scaleX(-1); }
.portal-back .icon, .demo-banner__back .icon { transform: none; }
@media (max-width: 919px) {
  /* document and invoice rows keep their action on the same line as the name */
  .pdoc { flex-wrap: nowrap; }
  .pdoc__body { flex: 1 1 auto; min-width: 0; }
  .pdoc__meta { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .pdoc__actions { margin-left: 0; }
}
@media (max-width: 919px) {
  /* a row that carries a full button (sign, review) may wrap it under the name */
  .pdoc:has(.pdoc__actions .btn) { flex-wrap: wrap; }
  .pdoc:has(.pdoc__actions .btn) .pdoc__actions { flex-basis: 100%; justify-content: flex-end; }
}
@media (max-width: 919px) {
  .pdoc:has(.pdoc__actions .portal-btn), .pdoc:has(.pdoc__actions .btn), .pdoc:has(.pdoc__actions a:not(.pdoc__dl)) { flex-wrap: wrap; }
  .pdoc:has(.pdoc__actions .portal-btn) .pdoc__actions, .pdoc:has(.pdoc__actions a:not(.pdoc__dl)) .pdoc__actions { flex-basis: 100%; justify-content: flex-end; }
}