/* NPC QMS Validation Desk — mobile-first. System fonts only, no CDN. */
:root { --navy:#0b3d6e; --navy-2:#12528f; --saffron:#f39c12; --bg:#f3f6fa; --line:#e3e8ef; --ink:#1c2430;
  --muted:#5d6878; --ok:#1e8e4e; --bad:#c0392b; --warn:#b26a00; }
body { font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", sans-serif; background: var(--bg); color: var(--ink); font-size: 1rem; }
a { color: var(--navy-2); }
.appbar { background: linear-gradient(135deg, #072a4d, var(--navy) 60%, var(--navy-2)); color: #fff; }
.appbar .brand { display:flex; align-items:center; gap:.6rem; padding:.6rem 0; }
.appbar .brand img { height: 40px; background:#fff; border-radius:6px; padding:2px; }
.appbar .brand b { display:block; font-size:1.1rem; line-height:1.1; }
.appbar .brand small { opacity:.85; font-size:.8rem; }
/* The bar wraps onto a second line instead of running off the right edge; the account menu sits at the end. */
.appnav { display:flex; flex-wrap:wrap; gap:.3rem; align-items:center; padding-bottom:.5rem; }
.appnav > a, .appnav > .account > button { white-space:nowrap; }
.appnav .account { margin-left:auto; }
.appnav .account > button { max-width: 22rem; overflow:hidden; text-overflow:ellipsis; }
.appnav .dropdown-menu { font-size:.95rem; }
.appnav .dropdown-menu .dropdown-item { color: var(--ink); border:0; border-radius:0; padding:.45rem 1rem; }
.appnav .dropdown-menu .dropdown-item:active { background: var(--navy); color:#fff; }
@media (max-width: 575.98px) {
  .appnav { gap:.25rem; }
  .appnav a, .appnav button { padding:.35rem .55rem; font-size:.85rem; }
  .appnav .account { margin-left:0; }
  .appnav .account > button { max-width: 15rem; }
}
.appnav a, .appnav button { color:#fff; text-decoration:none; padding:.45rem .7rem; border-radius:999px; border:1px solid rgba(255,255,255,.3);
  font-size:.92rem; background:transparent; }
.appnav a.active { background:#fff; color:var(--navy); font-weight:600; }
.appnav .count { background:var(--saffron); color:#1a1a1a; border-radius:999px; padding:0 .45rem; font-weight:700; margin-left:.2rem; }
main.container { max-width: 1100px; }
.card-x { background:#fff; border:1px solid var(--line); border-radius:14px; padding:1rem; margin-bottom:1rem; box-shadow:0 2px 8px rgba(16,40,80,.06); }
.section-title { font-size:.85rem; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); font-weight:700; margin:1rem 0 .4rem; }
.muted { color: var(--muted); }
.state { display:inline-block; font-size:.78rem; font-weight:600; border-radius:999px; padding:.1rem .55rem; background:#e5effc; color:#1f4f8f; }
.state-CLOSED { background:#e3f5ea; color:var(--ok); }
.state-SUBMITTED_TO_MR { background:#efeaf8; color:#6b4fa3; }
.state-ANSWERED_TO_HEAD { background:#fff1d6; color:var(--warn); }
.overdue { color: var(--bad); font-weight: 700; }
tr.overdue td { background: #fde8e6 !important; }
.task-row { display:block; padding:.6rem .2rem; border-top:1px solid var(--line); text-decoration:none; color:inherit; }
.task-row:hover { background:#f7f9fc; }
.proposal { white-space: pre-wrap; font-size: 1.05rem; }
.in-doc { border-left: 4px solid var(--line); padding: .3rem .7rem; color: var(--ink); background: #f7f9fc; font-size: .95rem; }
.state-DROPPED { background:#eceff3; color:var(--muted); text-decoration: line-through; }
.tiles { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:.6rem; }
.tile { background:#fff; border:1px solid var(--line); border-radius:12px; padding:.7rem; text-align:center; }
.tile b { display:block; font-size:1.5rem; }
.history li { margin-bottom:.35rem; }
.btn { min-height: 44px; }
.table-sm td, .table-sm th { font-size: .9rem; vertical-align: top; }
.password-once { font-family: ui-monospace, Consolas, monospace; font-size: 1.3rem; background:#fff4e0; padding:.4rem .7rem; border-radius:8px; display:inline-block; }
footer.site { color: var(--muted); font-size: .85rem; text-align:center; padding: 1.5rem 0; }

/* ---------------- reading page (documents from the reading pack) */
.qms-doc { font-size: 1.02rem; line-height: 1.6; max-width: 100%; overflow-wrap: anywhere; }
.qms-doc h1 { font-size: 1.5rem; margin-top: 1.4rem; }
.qms-doc h2 { font-size: 1.3rem; margin-top: 1.3rem; border-bottom: 1px solid var(--line); padding-bottom: .2rem; }
.qms-doc h3 { font-size: 1.12rem; margin-top: 1.1rem; }
.qms-doc h4 { font-size: 1rem; margin-top: 1rem; font-weight: 700; }
.qms-doc h1, .qms-doc h2, .qms-doc h3, .qms-doc h4 { scroll-margin-top: 4.5rem; }
.qms-doc p, .qms-doc li { max-width: 75ch; }
.qms-doc table.qms-t { display: block; overflow-x: auto; max-width: 100%; font-size: .9rem; }
.qms-doc table.qms-t caption { caption-side: top; font-weight: 600; color: var(--ink); }
.qms-doc mark.qms-open, mark.qms-open { background: #fff3a8; padding: 0 .15em; border-radius: 3px; }
.qms-doc mark.qms-open[data-k="CHECK-STD"], mark.qms-open[data-k="CHECK-STD"] { background: #b8f0ec; }
.qms-doc mark.qms-focus { outline: 3px solid var(--bad); outline-offset: 2px; scroll-margin-top: 7rem; scroll-margin-bottom: 2rem; }
.qms-doc .qms-chg, .qms-doc .qms-del { background: #e5effc; border-left: 4px solid #8fb3e8; padding: .35rem .6rem; margin: .4rem 0;
  font-size: .9rem; border-radius: 4px; }
.qms-doc .qms-del { background: #fde8e6; border-left-color: #e6a39b; }
.qms-doc.qms-hide-chg .qms-chg, .qms-doc.qms-hide-chg .qms-del { display: none; }
.qms-chg-key { background: #e5effc; border-left: 4px solid #8fb3e8; padding: 0 .4em; }
.qms-pointbar { position: sticky; top: 0; z-index: 1020; background: var(--navy); color: #fff; border-radius: 10px;
  padding: .45rem .75rem; margin-bottom: .75rem; display: flex; gap: .6rem; align-items: center; justify-content: space-between; }
.qms-pointbar[hidden] { display: none; }
.qms-pointbar-text { font-size: .92rem; overflow: hidden; text-overflow: ellipsis; }