@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap');
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
:root{
  --white:#fff;--gray-50:#f8f9fa;--gray-100:#f1f3f5;--gray-200:#e9ecef;
  --gray-300:#dee2e6;--gray-400:#ced4da;--gray-500:#adb5bd;--gray-600:#6c757d;
  --gray-700:#495057;--gray-800:#343a40;--gray-900:#212529;
  --blue:#2563eb;--blue-l:#eff6ff;--blue-m:#bfdbfe;
  --green:#16a34a;--green-l:#f0fdf4;--green-m:#bbf7d0;
  --amber:#d97706;--amber-l:#fffbeb;--amber-m:#fde68a;
  --red:#dc2626;--red-l:#fef2f2;--red-m:#fecaca;
  --purple:#7c3aed;--purple-l:#f5f3ff;--purple-m:#ddd6fe;
  --teal:#0d9488;--teal-l:#f0fdfa;--teal-m:#99f6e4;
  --orange:#ea580c;--orange-l:#fff7ed;--orange-m:#fed7aa;
  --sans:'DM Sans',sans-serif;
  --fs-xs:14px;--fs-sm:15px;--fs-base:17px;--fs-md:18px;--fs-lg:20px;--fs-xl:24px;
}
body{background:var(--gray-100);color:var(--gray-900);font-family:var(--sans);font-size:var(--fs-base);min-height:100vh;}

/* MODAL */

/* TOPBAR */
.topbar{background:var(--white);border-bottom:1px solid var(--gray-200);padding:0 24px;height:64px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100;box-shadow:0 1px 3px rgba(0,0,0,.06);}
.topbar-brand{display:flex;align-items:center;gap:10px;}
.brand-icon{width:38px;height:38px;border-radius:9px;background:var(--blue);display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;color:white;}
.brand-name{font-size:var(--fs-md);font-weight:700;letter-spacing:-.3px;}
.brand-sub{font-size:var(--fs-xs);color:var(--gray-500);margin-top:1px;}
.topbar-right{display:flex;align-items:center;gap:12px;}
.help-bubble{width:30px;height:30px;border-radius:50%;background:var(--gray-100);border:1.5px solid var(--gray-200);color:var(--gray-600);font-size:var(--fs-base);font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .12s,border-color .12s,color .12s;}
.help-bubble:hover{background:var(--blue-l);border-color:var(--blue-m);color:var(--blue);}
.nurse-chip{display:flex;align-items:center;gap:7px;padding:6px 14px;background:var(--blue-l);border:1.5px solid var(--blue-m);border-radius:20px;font-size:var(--fs-sm);font-weight:600;color:var(--blue);cursor:pointer;position:relative;}
.hidden{display:none !important;}
.nurse-chip:hover{background:var(--blue-m);}
.tab-nav{display:flex;gap:4px;}
.tab-btn{padding:8px 18px;border-radius:8px;border:none;font-family:var(--sans);font-size:var(--fs-sm);font-weight:500;cursor:pointer;transition:all .15s;color:var(--gray-600);background:transparent;}
.tab-btn:hover{background:var(--gray-100);color:var(--gray-800);}
.tab-btn.active{background:var(--blue);color:white;}

.tab-panel{display:none;}
.tab-panel.active{display:block;}

/* TRIAGE LAYOUT — full width, two column with generous right side */
.triage-layout{display:grid;grid-template-columns:480px 1fr;gap:20px;padding:20px 24px;max-width:1600px;margin:0 auto;}
.input-col{}

/* CARDS */
.card{background:var(--white);border-radius:14px;border:1px solid var(--gray-200);box-shadow:0 1px 4px rgba(0,0,0,.05);}
.card-header{padding:16px 20px 14px;border-bottom:1px solid var(--gray-100);display:flex;align-items:center;justify-content:space-between;}
.card-title{font-size:var(--fs-xs);font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--gray-500);}
.card-body{padding:18px 20px;}
textarea{width:100%;min-height:340px;border:1.5px solid var(--gray-200);border-radius:10px;font-family:var(--sans);font-size:var(--fs-base);line-height:1.65;color:var(--gray-800);padding:14px 16px;resize:vertical;outline:none;transition:border-color .15s;background:var(--gray-50);}
textarea:focus{border-color:var(--blue);background:var(--white);}
textarea::placeholder{color:var(--gray-400);}
.btn-run{width:100%;margin-top:12px;padding:14px 20px;background:var(--blue);border:none;border-radius:10px;color:white;font-family:var(--sans);font-size:var(--fs-md);font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:all .15s;}
.btn-run:hover{background:#1d4ed8;}
.btn-run:active{transform:scale(.99);}
.btn-run:disabled{background:var(--gray-300);cursor:not-allowed;}
.spinner{width:16px;height:16px;border:2.5px solid rgba(255,255,255,.4);border-top-color:white;border-radius:50%;animation:spin .7s linear infinite;display:none;}
.spinner.active{display:block;}
@keyframes spin{to{transform:rotate(360deg);}}

/* OUTPUT CARDS */
.output-stack{display:flex;flex-direction:column;gap:14px;}
.out-card{background:var(--white);border-radius:14px;border:1.5px solid var(--gray-200);overflow:hidden;animation:fadeUp .2s ease forwards;opacity:0;}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}
.out-card:nth-child(2){animation-delay:.05s;}
.out-card:nth-child(3){animation-delay:.10s;}
.out-card:nth-child(4){animation-delay:.15s;}
.out-card:nth-child(5){animation-delay:.20s;}
.out-card:nth-child(6){animation-delay:.25s;}
.oc-header{padding:13px 18px;border-bottom:1px solid var(--gray-100);display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;}
.oc-label{font-size:var(--fs-xs);font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--gray-500);}
.oc-body{padding:16px 18px;}

/* PILLS */
.pill{font-size:11px;font-weight:600;padding:3px 10px;border-radius:20px;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;}

/* DEPARTMENTS */

/* CLASSIFICATION */

/* .severity-badge defined further down — see "Severity badge"
   section. The earlier duplicate had different padding / border-radius
   that was being overridden via the cascade and rendered dead. */
.editable-select{width:100%;padding:8px 10px;border:1.5px solid var(--gray-200);border-radius:8px;font-family:var(--sans);font-size:var(--fs-sm);font-weight:600;color:var(--gray-800);background:var(--white);outline:none;cursor:pointer;margin-top:4px;}
.editable-select:focus{border-color:var(--blue);}
.editable-select.routine{border-color:var(--green-m);color:var(--green);background:var(--green-l);}
.editable-select.same-day{border-color:var(--amber-m);color:var(--amber);background:var(--amber-l);}
.editable-select.urgent{border-color:var(--red-m);color:var(--red);background:var(--red-l);}

/* FACTS */

/* FOLLOW-UP QUESTIONS */

/* RESPONSE */
.response-text{background:var(--gray-50);border:1.5px solid var(--gray-200);border-radius:10px;padding:16px 18px;font-size:var(--fs-base);line-height:1.8;color:var(--gray-800);white-space:pre-wrap;font-family:var(--sans);}

/* COPY BTN */
.vote-btn{display:inline-flex;align-items:center;gap:5px;padding:7px 14px;background:var(--gray-50);border:1.5px solid var(--gray-200);border-radius:7px;color:var(--gray-600);font-family:var(--sans);font-size:var(--fs-sm);font-weight:500;cursor:pointer;transition:all .15s;white-space:nowrap;}
.vote-btn.up:hover,.vote-btn.up.active{border-color:var(--green-m);color:var(--green);background:var(--green-l);}
.vote-btn.down:hover,.vote-btn.down.active{border-color:var(--red-m);color:var(--red);background:var(--red-l);}

/* VOTE PANEL */

/* CORRECTION — collapsed */
.correction-submit-row{display:flex;gap:8px;margin-top:10px;align-items:flex-start;}
.correction-submit-btn{padding:10px 18px;background:var(--blue);border:none;border-radius:8px;color:white;font-family:var(--sans);font-size:var(--fs-sm);font-weight:600;cursor:pointer;white-space:nowrap;transition:all .15s;display:flex;align-items:center;gap:6px;}
.correction-submit-btn:hover{background:#1d4ed8;}
.correction-submit-btn:disabled{background:var(--gray-300);cursor:not-allowed;}
.learn-status{font-size:var(--fs-xs);color:var(--gray-500);line-height:1.5;flex:1;}
.learn-status.error{color:var(--red);}

/* ERROR + PLACEHOLDER */

.placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 20px;gap:12px;color:var(--gray-400);}
.placeholder-icon{font-size:40px;opacity:.4;}
.placeholder-text{font-size:var(--fs-base);}

/* KB TAB */
.kb-layout{max-width:960px;margin:0 auto;padding:24px;}
.kb-header{margin-bottom:20px;}
.kb-header h2{font-size:var(--fs-xl);font-weight:700;margin-bottom:6px;}
.kb-header p{font-size:var(--fs-base);color:var(--gray-600);line-height:1.6;}
.kb-sync-bar{display:flex;align-items:center;gap:10px;padding:11px 16px;background:var(--blue-l);border:1.5px solid var(--blue-m);border-radius:10px;margin-bottom:20px;font-size:var(--fs-sm);color:var(--blue);font-weight:500;}
.kb-sync-bar.error{background:var(--red-l);border-color:var(--red-m);color:var(--red);}
.entry-add-box{background:var(--white);border-radius:14px;border:1px solid var(--gray-200);box-shadow:0 1px 4px rgba(0,0,0,.05);margin-bottom:20px;overflow:hidden;}
.entry-add-header{padding:15px 20px;background:var(--blue);}
.entry-add-header span{font-size:var(--fs-base);font-weight:600;color:white;}
.entry-add-body{padding:18px 20px;display:flex;flex-direction:column;gap:11px;}
.entry-add-row{display:flex;gap:10px;}
.entry-title-input{flex:1;padding:11px 14px;border:1.5px solid var(--gray-200);border-radius:8px;font-family:var(--sans);font-size:var(--fs-sm);font-weight:600;outline:none;}
.entry-title-input:focus{border-color:var(--blue);}
.entry-section-select{padding:11px 14px;border:1.5px solid var(--gray-200);border-radius:8px;font-family:var(--sans);font-size:var(--fs-sm);font-weight:500;outline:none;cursor:pointer;background:var(--gray-50);min-width:200px;}
.entry-section-select:focus{border-color:var(--blue);background:var(--white);}
.entry-content-area{width:100%;min-height:150px;padding:13px 14px;border:1.5px solid var(--gray-200);border-radius:8px;font-family:var(--sans);font-size:var(--fs-sm);line-height:1.7;outline:none;resize:vertical;background:var(--gray-50);}
.entry-content-area:focus{border-color:var(--blue);background:var(--white);}
.entry-submit-btn{padding:11px 26px;background:var(--blue);border:none;border-radius:8px;color:white;font-family:var(--sans);font-size:var(--fs-base);font-weight:600;cursor:pointer;display:flex;align-items:center;gap:8px;transition:all .15s;}
.entry-submit-btn:hover{background:#1d4ed8;}
.entry-submit-btn:disabled{background:var(--gray-300);cursor:not-allowed;}

.btn-xs{padding:5px 11px;font-size:var(--fs-xs);font-weight:600;border-radius:6px;border:1.5px solid var(--gray-200);background:var(--white);color:var(--gray-600);cursor:pointer;font-family:var(--sans);transition:all .15s;}
.btn-xs:hover{border-color:var(--gray-300);color:var(--gray-800);}
.btn-xs.save{background:var(--blue);border-color:var(--blue);color:white;}
.btn-xs.save:hover{background:#1d4ed8;}
.btn-xs.saved{background:var(--green);border-color:var(--green);color:white;}
.kb-actions{display:flex;gap:10px;margin-top:20px;padding-top:20px;border-top:1px solid var(--gray-200);}
.kb-save-btn{flex:1;padding:13px;background:var(--blue);border:none;border-radius:10px;color:white;font-family:var(--sans);font-size:var(--fs-base);font-weight:600;cursor:pointer;transition:all .15s;display:flex;align-items:center;justify-content:center;gap:8px;}
.kb-save-btn:hover{background:#1d4ed8;}
.kb-save-btn:disabled{background:var(--gray-300);cursor:not-allowed;}
.kb-export-btn{padding:13px 20px;background:var(--white);border:1.5px solid var(--gray-200);border-radius:10px;color:var(--gray-700);font-family:var(--sans);font-size:var(--fs-sm);font-weight:600;cursor:pointer;transition:all .15s;}
.kb-export-btn:hover{border-color:var(--gray-300);background:var(--gray-50);}
.kb-spinner{width:16px;height:16px;border:2.5px solid rgba(255,255,255,.4);border-top-color:white;border-radius:50%;animation:spin .7s linear infinite;display:none;}
.kb-spinner.active{display:block;}
.empty-state{text-align:center;padding:22px;color:var(--gray-500);font-size:var(--fs-sm);font-style:italic;}
.kb-tabs{display:flex;gap:4px;margin-bottom:0;border-bottom:2px solid var(--gray-200);padding-bottom:0;}
.kb-tab{padding:9px 18px;border:none;background:transparent;font-family:var(--sans);font-size:var(--fs-sm);font-weight:500;color:var(--gray-600);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px;border-radius:8px 8px 0 0;transition:all .15s;display:flex;align-items:center;gap:6px;}
.kb-tab:hover{background:var(--gray-50);color:var(--gray-800);}
.kb-tab.active{color:var(--blue);border-bottom-color:var(--blue);font-weight:600;background:var(--white);}
.kb-tab-count{font-size:11px;font-weight:700;background:var(--gray-200);color:var(--gray-600);padding:1px 7px;border-radius:10px;min-width:18px;text-align:center;}
.kb-tab.active .kb-tab-count{background:var(--blue-m);color:var(--blue);}
.kb-tab-panel{display:none;padding-top:14px;}
.kb-tab-panel.active{display:block;}
.kb-search-row{padding:12px 0 4px;}
.kb-search{width:100%;padding:10px 14px;border:1.5px solid var(--gray-200);border-radius:9px;font-family:var(--sans);font-size:var(--fs-base);outline:none;background:var(--gray-50);}
.kb-search:focus{border-color:var(--blue);background:var(--white);}
.help-layout{max-width:1200px;margin:0 auto;padding:28px 24px;}
.help-quickref{background:var(--blue-l);border:1.5px solid var(--blue-m);border-radius:16px;padding:28px;margin-bottom:28px;}
.help-quickref-title{font-size:var(--fs-xs);font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--blue);margin-bottom:20px;}
.help-quickref-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.help-qr-item{display:flex;gap:14px;align-items:flex-start;}
.help-qr-num{width:32px;height:32px;border-radius:50%;background:var(--blue);color:white;display:flex;align-items:center;justify-content:center;font-size:var(--fs-base);font-weight:700;flex-shrink:0;margin-top:3px;}
.help-qr-label{font-size:var(--fs-base);font-weight:700;color:var(--gray-900);margin-bottom:5px;}
.help-qr-desc{font-size:var(--fs-sm);color:var(--gray-700);line-height:1.65;}
.help-cols{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start;}
.help-col{display:flex;flex-direction:column;gap:16px;}
.help-section{background:var(--white);border-radius:14px;border:1px solid var(--gray-200);overflow:hidden;box-shadow:0 1px 4px rgba(0,0,0,.04);}
.help-cols .help-section{margin-bottom:0;}
.help-layout > .help-section{margin-bottom:28px;}
/* Spotlight = a normal white card — identical box model to every
   other .help-section, so its content lines up with the cards
   below it — plus a 4px teal accent bar down the left edge. The
   bar is an absolutely-positioned ::before, so it adds zero layout
   shift (a real border-left would push content in and break the
   alignment). One small, calm green element: draws the eye
   without flooding the card. */
.help-section.spotlight{position:relative;}
.help-section.spotlight::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--teal);z-index:1;}
.help-section-title{padding:14px 20px;background:var(--gray-50);border-bottom:1px solid var(--gray-200);font-size:var(--fs-sm);font-weight:700;color:var(--gray-700);text-transform:uppercase;letter-spacing:.06em;}
.help-faq{border-bottom:1px solid var(--gray-100);}
.help-faq:last-child{border-bottom:none;}
.help-faq-q{width:100%;padding:14px 20px;background:none;border:none;text-align:left;font-family:var(--sans);font-size:var(--fs-base);font-weight:600;color:var(--gray-800);cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px;line-height:1.4;}
.help-faq-q:hover{background:var(--gray-50);}
.help-faq-q.open{color:var(--blue);background:var(--blue-l);}
.help-arrow{font-size:11px;color:var(--gray-400);flex-shrink:0;transition:transform .2s;}
.help-faq-q.open .help-arrow{transform:rotate(180deg);color:var(--blue);}
.help-faq-a{display:none;padding:8px 20px 16px;font-size:var(--fs-sm);color:var(--gray-700);line-height:1.8;}
.help-faq-a.open{display:block;}
@media(max-width:900px){.help-quickref-grid{grid-template-columns:1fr;}.help-cols{grid-template-columns:1fr;}}

.cat-save-btn{padding:7px 20px;background:var(--blue);border:1.5px solid var(--blue);border-radius:7px;color:white;font-family:var(--sans);font-size:var(--fs-sm);font-weight:600;cursor:pointer;white-space:nowrap;transition:all .15s;display:inline-block;}
.cat-save-btn:hover{background:#1d4ed8;}
.cat-save-btn.saved{background:var(--green);border-color:var(--green);}
.save-toast{position:fixed;bottom:24px;right:24px;background:var(--green);color:white;padding:13px 22px;border-radius:10px;font-size:var(--fs-sm);font-weight:600;opacity:0;transition:opacity .2s,background .2s;pointer-events:none;box-shadow:0 4px 12px rgba(0,0,0,.15);z-index:999;}
.save-toast.show{opacity:1;}
@media(max-width:900px){
  .triage-layout{grid-template-columns:1fr;}
  .entry-add-row{flex-direction:column;}
}

/* KB ENTRY cards — clearer separation between entries */
.kb-entry{background:var(--white);border:1.5px solid var(--gray-200);border-radius:12px;margin-bottom:18px;overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,.04);}
.kb-entry:last-child{margin-bottom:0;}
.kb-entry-header{padding:11px 14px;background:var(--gray-50);border-bottom:1px solid var(--gray-200);display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.kb-entry-name{flex:1;min-width:120px;font-size:var(--fs-base);font-weight:600;color:var(--gray-700);background:transparent;border:none;outline:none;font-family:var(--sans);padding:2px 0;}
.kb-entry-name:focus{background:var(--white);border-radius:4px;padding:2px 6px;}
.kb-entry-author{font-size:var(--fs-xs);color:var(--gray-600);white-space:nowrap;padding:0;font-weight:400;font-style:italic;}
.kb-entry-content{width:100%;min-height:100px;padding:14px 16px;border:none;border-radius:0;font-family:var(--sans);font-size:var(--fs-sm);line-height:1.75;color:var(--gray-800);resize:vertical;outline:none;background:var(--white);display:block;}
.kb-entry-content:focus{background:#fffdf5;}
.kb-entry-footer{padding:10px 14px;background:var(--white);border-top:1px solid var(--gray-200);display:flex;justify-content:flex-end;gap:8px;}
.kb-entry-collapsed .kb-entry-content{display:none;}
.kb-entry-collapsed .kb-entry-footer{display:none;}
.kb-entry-toggle{background:none;border:none;cursor:pointer;font-size:11px;color:var(--gray-400);padding:0 4px;font-family:var(--sans);}
.kb-entry-toggle:hover{color:var(--blue);}
.danger{border-color:var(--gray-200);color:var(--gray-500);background:var(--white);}
.danger:hover{border-color:var(--red-m);color:var(--red);background:var(--red-l);}

/* Restored — output card dynamic classes */
.cat-pill{display:inline-flex;align-items:center;padding:5px 12px;border-radius:20px;border:1.5px solid var(--gray-200);background:var(--white);font-family:var(--sans);font-size:var(--fs-sm);color:var(--gray-600);cursor:pointer;transition:all .15s;user-select:none;line-height:1.3;}
.cat-pill:hover{border-color:var(--blue-m);color:var(--blue);}
.sel-clin{border-color:var(--blue);background:var(--blue);color:white;font-weight:600;}
.sel-nc{border-color:var(--amber);background:var(--amber);color:white;font-weight:600;}
.feedback-row{display:flex;flex-direction:row;flex-wrap:nowrap;gap:8px;align-items:center;}
/* The bare .sev-dot color rules used to be redeclared three times
   here (red, amber, green) — only the last one ever applied, and
   even that was overridden by the .sev-dot rule further down which
   sets background:currentColor. The severity-specific dot color
   comes from the descendant selectors below (.sev-severe .sev-dot,
   .sev-medium .sev-dot, .sev-low .sev-dot). */
.sev-severe{background:var(--red-l);color:var(--red);border:1.5px solid var(--red-m);}
.sev-severe .sev-dot{background:var(--red);}
.sev-medium{background:var(--amber-l);color:var(--amber);border:1.5px solid var(--amber-m);}
.sev-medium .sev-dot{background:var(--amber);}
.sev-low{background:var(--green-l);color:var(--green);border:1.5px solid var(--green-m);}
.sev-low .sev-dot{background:var(--green);}

/* Severity badge */
.severity-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:20px;font-size:var(--fs-xs);font-weight:700;text-transform:uppercase;letter-spacing:.04em;}
.severity-badge.sev-severe{background:#fef2f2;color:var(--red);border:1.5px solid var(--red-m);}
.severity-badge.sev-medium{background:var(--amber-l);color:var(--amber);border:1.5px solid var(--amber-m);}
.severity-badge.sev-low{background:#f0fdf4;color:var(--green);border:1.5px solid var(--green-m);}
.sev-dot{width:7px;height:7px;border-radius:50%;background:currentColor;flex-shrink:0;}

/* .cat-save-btn.saved already defined alongside .cat-save-btn above —
   the duplicate that used to live here was redundant. */

/* Results column layout */
.results-col{display:flex;flex-direction:column;gap:12px;min-width:0;}

/* PROFILE PANEL ——————————————————————————————————————————————————— */
.profile-overlay{display:none;position:fixed;inset:0;z-index:200;}
.profile-overlay.show{display:block;}
.profile-panel{position:fixed;top:0;right:-360px;width:340px;height:100vh;background:var(--white);box-shadow:-4px 0 24px rgba(0,0,0,.12);z-index:201;transition:right .25s ease;display:flex;flex-direction:column;}
.profile-panel.show{right:0;}
.profile-head{padding:24px 24px 16px;border-bottom:1px solid var(--gray-100);}
.profile-head-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;}
.profile-section-label{font-size:var(--fs-xs);font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--gray-500);}
.profile-close{background:none;border:none;cursor:pointer;color:var(--gray-400);font-size:20px;line-height:1;}
.profile-id{display:flex;align-items:center;gap:14px;}
.profile-avatar{width:52px;height:52px;border-radius:50%;background:var(--blue);color:white;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700;flex-shrink:0;}
.profile-name{font-size:var(--fs-md);font-weight:700;color:var(--gray-900);}
.profile-email{font-size:var(--fs-xs);color:var(--gray-500);margin-top:2px;}
.profile-role{display:inline-block;margin-top:5px;font-size:11px;font-weight:700;padding:2px 9px;border-radius:10px;background:var(--blue-l);color:var(--blue);border:1px solid var(--blue-m);}
.profile-body{flex:1;overflow-y:auto;padding:16px 24px;display:flex;flex-direction:column;gap:4px;}
.profile-eyebrow{font-size:var(--fs-xs);font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--gray-400);padding:8px 0 4px;}
.profile-eyebrow.gap{padding-top:12px;}
.profile-company{font-size:var(--fs-sm);color:var(--gray-700);padding:8px 0;border-bottom:1px solid var(--gray-100);}
.profile-stats{font-size:var(--fs-sm);color:var(--gray-700);padding:4px 0;}
.profile-foot{padding:16px 24px;border-top:1px solid var(--gray-100);display:flex;flex-direction:column;gap:8px;}
/* All drawer actions share one neutral resting state — color is a
   signal, not decoration. Hover lifts every row so the eye gets
   oriented on whatever it's pointing at. */
.profile-action{width:100%;padding:10px 12px;background:var(--gray-50);border:1px solid var(--gray-200);border-radius:8px;font-family:var(--sans);font-size:var(--fs-sm);font-weight:600;color:var(--gray-700);cursor:pointer;text-align:left;display:flex;align-items:center;justify-content:space-between;gap:8px;transition:background .12s,border-color .12s,color .12s;}
.profile-action:hover{background:var(--gray-100);border-color:var(--gray-300);}
/* Sign Out: the exit. Red text only — set apart by the separator
   above it, not by being a loud red block. */
.profile-action.danger{color:var(--red);}
.profile-action.danger:hover{background:var(--red-l);border-color:var(--red-m);}
/* .attn is applied by updateReviewBadge ONLY when the worklist has
   pending items — a calm row when there's nothing to do, an
   eye-drawing accent when there is. */
.profile-action.attn{background:var(--blue-l);border-color:var(--blue-m);color:var(--blue);}
.profile-action.attn:hover{background:var(--blue-m);border-color:var(--blue-m);}
.profile-action.attn .profile-badge{background:var(--blue);}
.profile-foot-sep{height:1px;background:var(--gray-200);margin:4px 2px;}
/* Hidden by default — updateReviewBadge() flips it to inline-block
   only when there's a pending count, so an empty span never shows
   as a stray dash. */
.profile-badge{display:none;background:var(--blue);color:white;border-radius:10px;padding:1px 7px;font-size:11px;font-weight:700;}

/* TOPBAR brand + chip ———————————————————————————————————————————— */
.brand-mini-icon{font-size:17px;font-weight:800;letter-spacing:-1px;font-family:var(--sans);}
.brand-stack{display:flex;flex-direction:column;line-height:1.15;}
.brand-stack .brand-name{font-size:var(--fs-md);font-weight:700;letter-spacing:-.3px;color:var(--gray-900);}
.brand-stack .brand-sub{font-size:var(--fs-xs);color:var(--gray-500);margin-top:2px;font-weight:500;}
.brand-sep{color:var(--gray-300);margin:0 4px;}
.chip-avatar{width:22px;height:22px;border-radius:50%;background:var(--blue);color:white;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0;}
.dept-badge{display:none;font-size:10px;font-weight:700;padding:1px 6px;border-radius:8px;background:var(--blue-m);color:var(--blue);}
.dept-badge.cs{background:var(--amber-l);color:var(--amber);}
.chip-badge{display:none;position:absolute;top:-5px;right:-5px;width:16px;height:16px;border-radius:50%;background:var(--red);color:white;font-size:9px;font-weight:700;align-items:center;justify-content:center;border:2px solid white;}

/* TRIAGE input column ——————————————————————————————————————————— */
.input-card{position:sticky;top:80px;}
.eyebrow{font-size:var(--fs-xs);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--gray-500);margin-bottom:6px;}
.prior-toggle{background:none;border:1.5px solid var(--gray-200);border-radius:7px;padding:4px 10px;font-family:var(--sans);font-size:var(--fs-xs);font-weight:600;color:var(--gray-500);cursor:pointer;transition:all .15s;}
.prior-panel{display:none;margin-bottom:10px;}
.prior-panel.show{display:block;}
.prior-hint{font-size:var(--fs-xs);color:var(--blue);margin-top:4px;}
.prior-turns{display:flex;flex-direction:column;gap:8px;margin-bottom:8px;}
.prior-turn{display:flex;gap:6px;align-items:flex-start;}
.prior-turn-speaker{flex:0 0 92px;padding:7px 6px;border:1.5px solid var(--blue-m);border-radius:7px;background:var(--white);font-family:var(--sans);font-size:var(--fs-xs);font-weight:600;color:var(--gray-700);cursor:pointer;}
.prior-turn-text{flex:1;min-height:44px;padding:8px 10px;border:1.5px solid var(--blue-m);border-radius:7px;background:var(--blue-l);font-family:var(--sans);font-size:var(--fs-sm);resize:vertical;}
.prior-turn-remove{flex:0 0 28px;height:28px;border:none;background:none;color:var(--gray-400);font-size:18px;cursor:pointer;border-radius:6px;line-height:1;transition:all .15s;}
.prior-turn-remove:hover{color:var(--red);background:var(--red-l);}
.prior-add-turn{background:none;border:1.5px dashed var(--blue-m);border-radius:7px;padding:6px 12px;font-family:var(--sans);font-size:var(--fs-xs);font-weight:600;color:var(--blue);cursor:pointer;margin-bottom:6px;transition:all .15s;}
.prior-add-turn:hover{background:var(--blue-l);}

/* HISTORY tab ——————————————————————————————————————————————————— */
/* History page width — bumped to 1600px (was 1100px, v0.3.22) to
   make the 11-column table fit without horizontal scroll on
   typical desktops. The × delete column was getting pushed off
   the right edge; the data-table-wrap's overflow-x:auto from
   v0.3.20 was a fallback (scrollable), not a fix (visible). At
   1600px the whole table fits.
   - Matches the Triage tab's max-width (line 40) for consistency.
   - .history-stats uses auto-fit grid so stat cards flow into the
     extra width gracefully — they don't get sparse-looking.
   - On laptops narrower than 1600px the wrap shrinks to viewport
     and overflow-x:auto on the table still scrolls horizontally
     as a fallback. */
.history-wrap{max-width:1600px;margin:0 auto;padding:28px 24px;}
.review-section{margin-bottom:28px;}
.review-section-row{display:flex;align-items:center;gap:10px;margin-bottom:12px;}
.review-section h2{font-size:var(--fs-lg);font-weight:700;}
.review-pill{background:var(--red-l);border:1.5px solid var(--red-m);border-radius:20px;padding:2px 10px;font-size:var(--fs-xs);font-weight:700;color:var(--red);}
.review-blurb{font-size:var(--fs-sm);color:var(--gray-500);margin-bottom:14px;}
.review-list{display:flex;flex-direction:column;gap:8px;}
.review-empty{text-align:center;padding:24px;color:var(--gray-400);font-size:var(--fs-sm);}
.history-head{border-top:1px solid var(--gray-200);padding-top:24px;display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:20px;flex-wrap:wrap;gap:12px;}
.history-head h2{font-size:var(--fs-xl);font-weight:700;margin-bottom:4px;}
.history-head p{font-size:var(--fs-sm);color:var(--gray-500);}
.history-controls{display:flex;gap:8px;align-items:center;}
.history-filter{padding:7px 10px;border:1.5px solid var(--gray-200);border-radius:8px;font-family:var(--sans);font-size:var(--fs-xs);background:var(--white);}
.history-load{padding:7px 14px;background:var(--blue);border:none;border-radius:8px;color:white;font-family:var(--sans);font-size:var(--fs-xs);font-weight:600;cursor:pointer;}
/* .history-stats grid layout is defined further down (auto-fit
   responsive variant); the earlier 4-column override was dead. */
.history-empty{text-align:center;padding:40px;color:var(--gray-400);font-size:var(--fs-sm);}

/* KB Add Entry submit row ————————————————————— */
.entry-submit-row{display:flex;justify-content:flex-end;}
.kb-import-label{cursor:pointer;}
.kb-import-input{display:none;}
.help-sev-severe{color:var(--red);}
.help-sev-moderate{color:var(--amber);}
.help-sev-mild{color:var(--green);}

/* AI clarifications panel — sub-card ——————————————————————————————— */
.review-card{border:1.5px solid var(--gray-200);border-radius:12px;overflow:hidden;margin-bottom:12px;}
.review-card-hdr{padding:12px 16px;background:var(--gray-50);border-bottom:1px solid var(--gray-100);display:flex;align-items:center;justify-content:space-between;gap:12px;}
.review-card-body{padding:14px 16px;}

/* KB header — h2 + sync indicator on the same row ——————————————————— */
.kb-header-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:6px;flex-wrap:wrap;}
.kb-header-row h2{margin-bottom:0;}
.kb-header .kb-sync-bar{margin:0;flex-shrink:0;padding:7px 14px;font-size:var(--fs-xs);}

/* Stats grid — flexible card sizing ———————————————————————————————— */
.history-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:20px;}
.stat-card{background:var(--white);border:1.5px solid var(--gray-200);border-radius:12px;padding:14px 16px;}
.stat-card-wide{grid-column:span 2;}
.stat-label{font-size:var(--fs-xs);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--gray-500);margin-bottom:6px;}
.stat-value{font-size:var(--fs-lg);font-weight:700;}

/* Per-staff breakdown + Triage queue tables ——————————————————————— */
/* overflow-x:auto, not overflow:hidden — v0.3.19 added a Message
   preview column to the History table which on typical viewports
   pushes the table past its container's width, clipping the
   rightmost cell (the × delete button) off-screen. Horizontal
   scroll lets staff reach the × when the table overflows.
   overflow-y stays hidden so the rounded corners still clip. */
.staff-breakdown,.data-table-wrap{background:var(--white);border:1.5px solid var(--gray-200);border-radius:12px;overflow-x:auto;overflow-y:hidden;margin-bottom:20px;}
.staff-breakdown-title,.data-table-title{padding:12px 16px;background:var(--gray-50);border-bottom:1px solid var(--gray-200);font-size:var(--fs-xs);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--gray-700);}
.data-table{width:100%;border-collapse:collapse;font-size:var(--fs-xs);}
.data-table thead{background:var(--gray-50);}
.data-table th{padding:10px 14px;text-align:left;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--gray-500);border-bottom:1px solid var(--gray-200);font-size:11px;}
.data-table th.num,.data-table td.num{text-align:right;}
.data-table tbody tr{border-bottom:1px solid var(--gray-100);}
.data-table tbody tr:last-child{border-bottom:none;}
.data-table tbody tr:nth-child(even){background:var(--gray-50);}
.data-table td{padding:9px 14px;color:var(--gray-700);}
.data-table td.staff-name{color:var(--gray-800);font-weight:600;}

/* Task-shape pill — flags dual tasks (clinical + non-clinical routing
   needed) so staff know to paste the internal note in addition to the
   clinical reply. Single tasks render as a muted em-dash. */
.task-shape-pill{display:inline-block;font-size:11px;font-weight:700;padding:1px 8px;border-radius:10px;letter-spacing:.04em;text-transform:uppercase;}
.task-shape-dual{background:var(--amber-l);color:var(--amber);border:1px solid var(--amber-m);}
.task-shape-muted{color:var(--gray-300);font-size:var(--fs-xs);}

/* Per-row × delete button on the History table (v0.3.18). Muted by
   default so the table doesn't shout DELETE at staff during normal
   reading; reddens on hover to make the destructive action obvious
   right before they click. */
.row-delete{background:none;border:none;color:var(--gray-300);font-size:18px;cursor:pointer;padding:2px 8px;border-radius:4px;line-height:1;transition:all .15s;}
.row-delete:hover{color:var(--red);background:var(--red-l);}

/* History row context (v0.3.19). Without these, staff could only
   identify a row by its score/date/staff/category — none of which
   tell you WHAT the patient asked. Now: a Message column previews
   ~80 chars of patient_message at-a-glance, the row expands inline
   on click to show full content, and the delete-confirm dialog
   quotes the preview back to the user before destruction. */
.message-preview{max-width:260px;color:var(--gray-700);font-size:var(--fs-xs);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.data-table-clickable tbody tr[data-history-row]{cursor:pointer;}
.data-table-clickable tbody tr[data-history-row]:hover{background:var(--blue-l)!important;}
.data-table-clickable tbody tr.expanded{background:var(--blue-l)!important;}
/* The expanded detail row spans all columns of its parent table.
   Background distinguishes it from the data rows above/below; the
   left border accent ties it visually to the row it belongs to. */
.history-detail-row td{background:var(--gray-50);padding:18px 24px 20px;border-bottom:2px solid var(--gray-200);border-left:3px solid var(--blue);}
/* Each block is a card on the gray panel so the eye can separate sections. */
.history-detail-block{background:var(--white);border:1px solid var(--gray-200);border-left:3px solid var(--gray-300);border-radius:6px;padding:10px 14px 12px;margin-bottom:12px;}
.history-detail-block:last-child{margin-bottom:0;}
/* Type-specific accents — left-border + tinted background + label color.
   The reader can visually distinguish patient (blue), AI draft (gray),
   what staff actually sent (teal), and notes/corrections (amber). */
.history-detail-block.hd-patient{border-left-color:var(--blue);background:var(--blue-l);}
.history-detail-block.hd-draft{border-left-color:var(--gray-500);}
.history-detail-block.hd-sent{border-left-color:var(--teal);background:var(--teal-l);}
.history-detail-block.hd-note{border-left-color:var(--amber);background:var(--amber-l);}
.history-detail-block.hd-follow{border-left-color:var(--gray-400);}
.history-detail-label{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--gray-700);margin-bottom:6px;}
.history-detail-block.hd-patient .history-detail-label{color:var(--blue);}
.history-detail-block.hd-sent .history-detail-label{color:var(--teal);}
.history-detail-block.hd-note .history-detail-label{color:var(--amber);}
.history-detail-text{font-size:var(--fs-sm);color:var(--gray-800);white-space:pre-wrap;line-height:1.6;}
.history-detail-list{margin:0;padding-left:20px;font-size:var(--fs-sm);color:var(--gray-800);line-height:1.6;}

/* Pagination bars (v0.3.24). Rendered both above and below the
   History table so staff at either end can jump pages without
   scrolling. Same standalone-card aesthetic as the table itself
   (rounded, bordered, white background) so the page composes as
   a stack of three cards: top bar, table, bottom bar. The bottom
   bar also embeds the page-size selector — duplicating it both
   top-and-bottom would feel noisy since the same control already
   lives in the .history-controls block above. */
.history-page-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;background:var(--white);border:1.5px solid var(--gray-200);border-radius:12px;}
.history-page-bar-top{margin-bottom:12px;}
.history-page-bar-bottom{margin-top:12px;margin-bottom:20px;}
.history-page-range{font-size:var(--fs-xs);color:var(--gray-500);font-weight:600;letter-spacing:.02em;flex:0 0 auto;}
.history-page-nav{display:flex;align-items:center;gap:10px;}
.history-page-btn{background:none;border:1.5px solid var(--gray-200);border-radius:7px;padding:5px 12px;font-family:var(--sans);font-size:var(--fs-xs);font-weight:600;color:var(--gray-700);cursor:pointer;transition:all .15s;}
.history-page-btn:hover:not(:disabled){background:var(--blue-l);border-color:var(--blue-m);color:var(--blue);}
.history-page-btn:disabled{opacity:.4;cursor:not-allowed;}
.history-page-indicator{font-size:var(--fs-xs);color:var(--gray-700);font-weight:600;min-width:90px;text-align:center;letter-spacing:.02em;}

/* ─────────────────────────────────────────────────────────────────
   Non-clinical handoff view (v0.3.27). Rendered when a non-clinical
   staffer sees a clinical-tier inquiry. The whole flow is "show
   patient context, send acknowledgment, mark escalated" — visually
   distinct (amber accent) so it's obvious they're in the
   handoff path, not the standard authoring path.
   ───────────────────────────────────────────────────────────────── */
.handoff-banner{background:var(--amber-l);border-color:var(--amber-m);display:flex;align-items:flex-start;gap:14px;padding:14px 18px;margin-bottom:14px;}
.handoff-banner-icon{font-size:22px;line-height:1;color:var(--amber);flex:0 0 auto;}
.handoff-banner-title{font-size:var(--fs-sm);font-weight:700;color:var(--amber);margin-bottom:4px;}
.handoff-banner-body{font-size:var(--fs-sm);color:var(--gray-700);line-height:1.5;}
.patient-msg-readonly{font-size:var(--fs-sm);color:var(--gray-800);white-space:pre-wrap;line-height:1.5;padding:10px 12px;background:var(--gray-50);border:1px solid var(--gray-200);border-radius:8px;}
.handoff-meta{font-size:var(--fs-sm);color:var(--gray-800);padding:6px 0;}
.handoff-template-text{font-size:var(--fs-sm);color:var(--gray-800);white-space:pre-wrap;line-height:1.6;padding:12px 14px;background:var(--blue-l);border:1.5px solid var(--blue-m);border-radius:8px;margin-bottom:10px;}
.handoff-actions{display:flex;align-items:center;gap:10px;}
.btn-copy{background:var(--blue);color:white;border:none;border-radius:7px;padding:8px 16px;font-family:var(--sans);font-size:var(--fs-sm);font-weight:600;cursor:pointer;transition:all .15s;}
.btn-copy:hover{background:var(--blue-d, #2563eb);}
.handoff-copy-status{font-size:var(--fs-xs);color:var(--green);font-weight:600;opacity:0;transition:opacity .15s;}
.handoff-copy-status.show{opacity:1;}
.escalate-action-card{margin-top:14px;}
.btn-escalate{background:var(--amber);color:white;border:none;border-radius:8px;padding:10px 20px;font-family:var(--sans);font-size:var(--fs-sm);font-weight:700;cursor:pointer;transition:all .15s;}
.btn-escalate:hover:not(:disabled){background:#d97706;}
.btn-escalate:disabled{opacity:.6;cursor:not-allowed;}
.btn-escalate.escalated-done{background:var(--green);}
.escalate-hint{font-size:var(--fs-xs);color:var(--gray-500);margin-top:8px;line-height:1.5;}

/* ─────────────────────────────────────────────────────────────────
   Admin tab (v0.3.27). Three stacked sections: Users, Categories,
   Settings. Same card aesthetic as the rest of the app.
   ───────────────────────────────────────────────────────────────── */
.admin-wrap{max-width:1100px;margin:0 auto;padding:28px 24px;}
.admin-head{margin-bottom:24px;}
.admin-head h2{font-size:var(--fs-xl);font-weight:700;margin-bottom:4px;}
.admin-head p{font-size:var(--fs-sm);color:var(--gray-500);}
.admin-section{background:var(--white);border:1.5px solid var(--gray-200);border-radius:12px;padding:20px 24px;margin-bottom:20px;}
.admin-section-head{margin-bottom:16px;position:relative;}
.admin-section-head h3{font-size:var(--fs-lg);font-weight:700;margin-bottom:4px;}
.admin-section-blurb{font-size:var(--fs-sm);color:var(--gray-500);line-height:1.5;}
.admin-superuser-only{position:absolute;top:0;right:0;background:var(--blue-l);color:var(--blue);font-size:var(--fs-xs);font-weight:700;padding:2px 10px;border-radius:10px;letter-spacing:.04em;text-transform:uppercase;}
.admin-empty{text-align:center;color:var(--gray-400);padding:20px;font-size:var(--fs-sm);}
.admin-error{color:var(--red);padding:12px;font-size:var(--fs-sm);}
.admin-user-row,.admin-cat-row{display:flex;align-items:center;gap:14px;padding:10px 0;border-bottom:1px solid var(--gray-100);}
.admin-user-row:last-child,.admin-cat-row:last-child{border-bottom:none;}
.admin-user-info{flex:1;min-width:0;}
.admin-user-name{font-size:var(--fs-sm);font-weight:600;color:var(--gray-800);}
.admin-user-email{font-size:var(--fs-xs);color:var(--gray-500);margin-top:2px;}
.admin-user-controls{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.admin-role-select{padding:5px 8px;border:1.5px solid var(--gray-200);border-radius:6px;font-family:var(--sans);font-size:var(--fs-xs);background:var(--white);}
.admin-title-input{width:80px;padding:5px 8px;border:1.5px solid var(--gray-200);border-radius:6px;font-family:var(--sans);font-size:var(--fs-xs);background:var(--white);color:var(--gray-800);}
.admin-title-input:focus{outline:none;border-color:var(--blue);}
.admin-title-input::placeholder{color:var(--gray-400);}
.admin-flag-toggle{display:flex;align-items:center;gap:6px;font-size:var(--fs-xs);color:var(--gray-700);cursor:pointer;user-select:none;}
.admin-flag-toggle input[type="checkbox"]{cursor:pointer;}
.admin-flag-readonly{font-size:var(--fs-xs);color:var(--gray-400);font-weight:600;}
.admin-cat-name{flex:1;font-size:var(--fs-sm);font-weight:600;color:var(--gray-800);}
.admin-textarea{width:100%;min-height:90px;padding:10px 12px;border:1.5px solid var(--gray-200);border-radius:7px;font-family:var(--sans);font-size:var(--fs-sm);resize:vertical;}
.admin-settings{display:flex;flex-direction:column;gap:10px;}
.admin-settings-actions{display:flex;align-items:center;gap:12px;}
.admin-btn{background:var(--blue);color:white;border:none;border-radius:7px;padding:7px 18px;font-family:var(--sans);font-size:var(--fs-sm);font-weight:600;cursor:pointer;}
.admin-status{font-size:var(--fs-xs);color:var(--gray-500);}