/* Care Hub Portal v1 shell styles - ported from the consolidated prototype.
   Teal palette ships in v1 per controlling spec; brand v2.2 restyle is Phase 8. */
:root{
      --bg:#f3f6f7;
      --panel:#ffffff;
      --panel-2:#f8fafb;
      --text:#172126;
      --muted:#617178;
      --border:#d9e3e6;
      --accent:#176b63;
      --accent-2:#0f554f;
      --accent-soft:#dff1ee;
      --blue:#3a638e;
      --blue-soft:#e5edf7;
      --gold:#9a6818;
      --gold-soft:#f5ead7;
      --violet:#66518b;
      --violet-soft:#eee8f5;
      --red:#a24646;
      --red-soft:#f4dfdf;
      --good:#287553;
      --good-soft:#e0efe7;
      --shadow:0 12px 32px rgba(29,48,56,.075);
      --radius:18px;
      --sidebar:250px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
    button,input,select{font:inherit}
    button{color:inherit}
    .app{display:grid;grid-template-columns:var(--sidebar) minmax(0,1fr);min-height:100vh}
    .sidebar{position:sticky;top:0;height:100vh;background:#143e3a;color:#eef8f6;padding:20px 16px;display:flex;flex-direction:column;z-index:20}
    .brand{display:flex;gap:11px;align-items:center;padding:4px 6px 18px;border-bottom:1px solid rgba(255,255,255,.15)}
    .brand-mark{width:38px;height:38px;border-radius:12px;background:#dff1ee;color:#143e3a;display:grid;place-items:center;font-weight:850;letter-spacing:-.04em}
    .brand strong{display:block;font-size:15px}
    .brand span{font-size:11px;color:#b9d5d1}
    .nav{display:grid;gap:5px;margin-top:18px}
    .nav button{width:100%;display:flex;align-items:center;gap:10px;border:0;background:transparent;color:#cce1de;text-align:left;border-radius:12px;padding:10px 11px;cursor:pointer;font-size:13px}
    .nav button:hover{background:rgba(255,255,255,.08);color:#fff}
    .nav button.active{background:#dff1ee;color:#143e3a;font-weight:750}
    .nav-icon{width:20px;text-align:center;font-size:14px}
    .sidebar-foot{margin-top:auto;border-top:1px solid rgba(255,255,255,.15);padding:14px 6px 0;color:#b9d5d1;font-size:11px;line-height:1.45}
    .main{min-width:0}
    .topbar{position:sticky;top:0;z-index:15;background:rgba(243,246,247,.93);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);padding:15px 22px}
    .topbar-row{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}
    .page-title h1{margin:0;font-size:22px;letter-spacing:-.025em}
    .page-title p{margin:4px 0 0;font-size:12px;color:var(--muted)}
    .actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
    .button{border:1px solid var(--border);background:var(--panel);border-radius:11px;padding:8px 11px;cursor:pointer;font-size:12px}
    .button:hover{border-color:#aec4c8}
    .button.primary{background:var(--accent);border-color:var(--accent);color:#fff}
    .synthetic{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--border);background:var(--panel);border-radius:999px;padding:7px 10px;font-size:11px;color:var(--muted)}
    .synthetic i{width:7px;height:7px;background:var(--accent);border-radius:50%;display:block}
    .filterbar{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:10px;margin-top:13px}
    label{display:block;font-size:11px;color:var(--muted);margin-bottom:5px}
    select,input{width:100%;border:1px solid var(--border);border-radius:11px;background:#fff;color:var(--text);padding:9px 10px}
    .content-wrap{padding:20px 22px 36px;max-width:1550px;margin:0 auto}
    .page{display:none}
    .page.active{display:block}
    .hero{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:16px;margin-bottom:16px}
    .hero-main,.hero-side,.panel{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
    .hero-main{padding:22px;background:linear-gradient(135deg,#ffffff 0%,#f3fbf9 100%)}
    .eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.09em;color:var(--accent);font-weight:800}
    .hero-main h2{font-size:28px;line-height:1.12;letter-spacing:-.035em;margin:8px 0 10px}
    .hero-main p{color:var(--muted);font-size:14px;line-height:1.6;margin:0;max-width:850px}
    .chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:15px}
    .chip,.pill{display:inline-flex;align-items:center;border-radius:999px;padding:6px 9px;font-size:11px;font-weight:700}
    .chip{background:var(--accent-soft);color:var(--accent)}
    .pill{background:var(--panel-2);color:var(--muted);border:1px solid var(--border)}
    .hero-side{padding:18px}
    .hero-side h3,.panel h3{font-size:15px;margin:0}
    .principles{display:grid;gap:10px;margin-top:13px}
    .principle{display:grid;grid-template-columns:26px 1fr;gap:10px;align-items:start}
    .principle b{width:25px;height:25px;border-radius:8px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;font-size:11px}
    .principle strong{display:block;font-size:12px}
    .principle span{display:block;font-size:11px;color:var(--muted);line-height:1.4;margin-top:2px}
    .metrics{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin-bottom:16px}
    .metric{background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:15px;min-height:128px;box-shadow:var(--shadow)}
    .metric-label{font-size:12px;color:var(--muted);min-height:32px}
    .metric-value{font-size:28px;font-weight:780;letter-spacing:-.045em;margin:7px 0 4px}
    .metric-delta{font-size:11px;color:var(--good)}
    .metric-id{font-size:10px;color:var(--muted);margin-top:10px}
    .grid-2{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(310px,.75fr);gap:16px;margin-bottom:16px}
    .grid-half{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
    .grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:16px}
    .panel{padding:18px;margin-bottom:16px}
    .grid-2>.panel,.grid-half>.panel,.grid-3>.panel{margin-bottom:0}
    .panel-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:15px}
    .panel-head h2{font-size:17px;margin:0}
    .panel-head p{font-size:11px;color:var(--muted);line-height:1.45;margin:4px 0 0}
    .funnel{display:grid;gap:12px}
    .funnel-row{display:grid;grid-template-columns:160px 1fr 64px 52px;gap:10px;align-items:center}
    .funnel-name{font-size:12px}
    .track{height:11px;background:#e7edef;border-radius:999px;overflow:hidden}
    .fill{height:100%;background:var(--accent);border-radius:999px}
    .funnel-count,.funnel-rate{text-align:right;font-size:12px;font-weight:750}
    .funnel-rate{color:var(--muted);font-weight:600}
    .callouts{display:grid;gap:10px}
    .callout{border:1px solid var(--border);border-radius:14px;background:var(--panel-2);padding:12px}
    .callout-top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
    .callout strong{font-size:12px}
    .callout p{font-size:11px;color:var(--muted);line-height:1.45;margin:7px 0 0}
    .severity{font-size:9px;font-weight:800;border-radius:999px;padding:4px 7px;background:var(--gold-soft);color:var(--gold);white-space:nowrap}
    .severity.high{background:var(--red-soft);color:var(--red)}
    .program-flow{display:flex;align-items:stretch;gap:8px;overflow-x:auto;padding:3px 2px 8px}
    .program-node{min-width:142px;border:1px solid var(--border);border-radius:14px;background:var(--panel-2);padding:12px;position:relative}
    .program-node:not(:last-child)::after{content:"→";position:absolute;right:-10px;top:44%;color:#8b9da3;z-index:2}
    .program-node strong{display:block;font-size:12px}
    .program-node span{display:block;font-size:10px;color:var(--muted);line-height:1.35;margin-top:5px}
    .table-wrap{overflow:auto}
    table{width:100%;border-collapse:collapse;font-size:11px}
    th{text-align:left;color:var(--muted);font-weight:700;padding:10px 8px;border-bottom:1px solid var(--border);white-space:nowrap}
    td{padding:11px 8px;border-bottom:1px solid var(--border);vertical-align:top;line-height:1.4;white-space:nowrap}
    tr:last-child td{border-bottom:0}
    .status{display:inline-flex;border-radius:999px;padding:5px 8px;font-size:9px;font-weight:800;background:var(--accent-soft);color:var(--accent);white-space:nowrap}
    .status.good{background:var(--good-soft);color:var(--good)}
    .status.warn{background:var(--gold-soft);color:var(--gold)}
    .status.bad{background:var(--red-soft);color:var(--red)}
    .toolbar{display:flex;gap:8px;align-items:end;flex-wrap:wrap;margin-bottom:14px}
    .toolbar>div{min-width:150px}
    .toolbar .search{flex:1;min-width:220px}
    .phase-strip{display:grid;grid-template-columns:repeat(8,minmax(145px,1fr));gap:10px;overflow-x:auto;padding:3px 2px 8px}
    .phase-card{border:1px solid var(--border);border-radius:15px;background:var(--panel-2);padding:12px;text-align:left;cursor:pointer;min-height:146px;position:relative}
    .phase-card:hover{border-color:#abc3c7}
    .phase-card.active{border:2px solid var(--accent);background:var(--accent-soft)}
    .phase-card small{font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-weight:800}
    .phase-card strong{display:block;font-size:12px;margin:5px 0}
    .phase-card p{font-size:10px;color:var(--muted);line-height:1.38;margin:0}
    .phase-card span{display:inline-flex;margin-top:8px;border-radius:999px;padding:4px 7px;background:var(--blue-soft);color:var(--blue);font-size:9px;font-weight:750}
    .phase-detail{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:16px}
    .actor-list{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0 0}
    .actor{border-radius:999px;padding:6px 8px;font-size:10px;font-weight:750;background:var(--accent-soft);color:var(--accent)}
    .actor.hospital{background:var(--blue-soft);color:var(--blue)}
    .actor.community{background:var(--good-soft);color:var(--good)}
    .actor.payer{background:var(--gold-soft);color:var(--gold)}
    .actor.clinical{background:var(--red-soft);color:var(--red)}
    .detail-columns{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:15px}
    .detail-block{border:1px solid var(--border);border-radius:14px;background:var(--panel-2);padding:13px}
    .detail-block h4{font-size:12px;margin:0}
    .detail-block ul{margin:8px 0 0;padding-left:17px}
    .detail-block li{font-size:10px;line-height:1.5;color:var(--muted);margin-bottom:4px}
    .route-list{display:grid;gap:9px;margin-top:12px}
    .route{border:1px solid var(--border);border-radius:13px;background:var(--panel-2);padding:11px}
    .route-head{display:flex;justify-content:space-between;gap:8px;align-items:start}
    .route strong{font-size:11px}
    .route p{font-size:10px;color:var(--muted);line-height:1.4;margin:6px 0 0}
    .bar-list{display:grid;gap:11px}
    .bar-row{display:grid;grid-template-columns:145px 1fr 48px;gap:9px;align-items:center}
    .bar-row span,.bar-row strong{font-size:11px}
    .bar{height:9px;border-radius:999px;background:#e7edef;overflow:hidden}
    .bar i{display:block;height:100%;background:var(--accent);border-radius:999px}
    .view-hero{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.55fr);gap:16px;margin-bottom:16px}
    .view-card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:19px}
    .view-card h2{font-size:21px;margin:6px 0 8px}
    .view-card p{font-size:12px;color:var(--muted);line-height:1.5;margin:0}
    .access-grid{display:grid;gap:9px;margin-top:13px}
    .access-row{display:flex;justify-content:space-between;gap:14px;border-bottom:1px solid var(--border);padding-bottom:8px;font-size:11px}
    .access-row:last-child{border-bottom:0}
    .access-row span{color:var(--muted)}
    .standards-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
    .standard-card{border:1px solid var(--border);border-radius:14px;background:var(--panel-2);padding:13px}
    .standard-card strong{display:block;font-size:12px}
    .standard-card p{font-size:10px;color:var(--muted);line-height:1.45;margin:6px 0 0}
    .definition-banner{background:var(--accent-soft);border:1px solid #c4e1dc;border-radius:15px;padding:13px 15px;font-size:11px;line-height:1.5;margin-bottom:16px}
    .definition-banner strong{color:var(--accent)}
    .section-kicker{font-size:10px;color:var(--accent);text-transform:uppercase;letter-spacing:.08em;font-weight:800;margin-bottom:5px}
    .mobile-toggle{display:none}
    .empty{padding:22px;text-align:center;color:var(--muted);font-size:12px}
    .footer{text-align:center;color:var(--muted);font-size:10px;padding:12px}
    @media(max-width:1250px){
      .metrics{grid-template-columns:repeat(3,1fr)}
      .standards-grid{grid-template-columns:repeat(2,1fr)}
      .filterbar{grid-template-columns:repeat(2,1fr)}
    }
    @media(max-width:980px){
      :root{--sidebar:220px}
      .hero,.grid-2,.grid-half,.grid-3,.phase-detail,.view-hero{grid-template-columns:1fr}
      .detail-columns{grid-template-columns:1fr}
    }
    @media(max-width:760px){
      .app{grid-template-columns:1fr}
      .sidebar{position:fixed;left:-270px;width:250px;transition:.2s ease;box-shadow:12px 0 30px rgba(0,0,0,.18)}
      .sidebar.open{left:0}
      .mobile-toggle{display:inline-flex}
      .topbar{padding:12px 14px}
      .topbar-row{align-items:center}
      .page-title h1{font-size:18px}
      .filterbar{grid-template-columns:1fr 1fr}
      .content-wrap{padding:15px 14px 30px}
      .metrics{grid-template-columns:repeat(2,1fr)}
      .standards-grid{grid-template-columns:1fr}
      .funnel-row{grid-template-columns:120px 1fr 50px}
      .funnel-rate{display:none}
    }
    @media(max-width:520px){
      .metrics{grid-template-columns:1fr}
      .filterbar{grid-template-columns:1fr}
      .actions .synthetic{display:none}
      .hero-main h2{font-size:23px}
      .bar-row{grid-template-columns:110px 1fr 42px}
    }
    @media print{
      .sidebar,.topbar,.no-print{display:none!important}
      .app{display:block}
      .content-wrap{padding:0}
      .page{display:block!important;break-before:page}
      .panel,.hero-main,.hero-side,.metric,.view-card{box-shadow:none}
    }

/* ---- shell states (auth / loading / denied / error / update) ---- */
.screen{min-height:100vh;display:grid;place-items:center;background:var(--bg);padding:24px}
.screen .card{max-width:460px;width:100%;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:28px;text-align:center}
.screen .card h1{font-size:19px;margin:12px 0 8px}
.screen .card p{color:var(--muted);font-size:13px;line-height:1.5;margin:0 0 16px}
.screen .brand-mark{margin:0 auto}
.spinner{width:26px;height:26px;border:3px solid var(--accent-soft);border-top-color:var(--accent);border-radius:50%;margin:0 auto;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.hidden{display:none !important}
.watermark{position:fixed;bottom:10px;right:14px;z-index:40;font-size:10px;color:var(--muted);background:rgba(255,255,255,.85);border:1px solid var(--border);border-radius:8px;padding:4px 8px;pointer-events:none}
.tenant-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);background:var(--accent-soft);color:var(--accent-2);border-radius:999px;padding:6px 10px;font-size:11px;font-weight:700}
.cell-suppressed{color:var(--muted);font-style:italic}
.metric-empty{color:var(--muted);font-size:12px;padding:18px;text-align:center}
@media print{.watermark{position:fixed;display:block}}