:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#18212f;background:#eef3f5;accent-color:#0f766e}*{box-sizing:border-box}body{margin:0;background:linear-gradient(180deg,#eef3f5 0,#f8fafb 360px);font-size:15px}main{max-width:1240px;margin:0 auto;padding:24px}h1,h2,h3{letter-spacing:0;margin:0;color:#111827}h1{font-size:clamp(28px,4vw,42px);line-height:1.05}h2{font-size:19px;line-height:1.25}h3{font-size:15px;line-height:1.35}.eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:.08em;font-weight:800;color:#0f766e}.muted{color:#64748b}.app-shell{display:grid;gap:18px}.topbar{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:10px 0}.brand{display:grid;gap:2px}.brand strong{font-size:17px}.nav-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.hero{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.75fr);gap:18px;align-items:stretch}.hero-panel{background:#101827;color:white;border:1px solid #263348;border-radius:8px;padding:24px;display:grid;gap:18px;min-height:220px}.hero-panel h1,.hero-panel h2,.hero-panel p{color:inherit}.hero-panel .muted{color:#b8c4d1}.hero-side{background:white;border:1px solid #dce5ea;border-radius:8px;padding:20px;display:grid;gap:14px}.section-header{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:14px}.section-header p{margin:4px 0 0}.auth-panel{max-width:420px;margin-top:12vh;background:white;border:1px solid #d9e2e8;border-radius:8px;padding:28px;box-shadow:0 20px 45px rgba(15,23,42,.08)}section,.panel{background:white;border:1px solid #dce5ea;border-radius:8px;padding:20px;margin:16px 0;box-shadow:0 10px 25px rgba(15,23,42,.04)}.panel-plain{background:transparent;border:0;box-shadow:none;padding:0;margin:16px 0}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}.dashboard-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:16px}.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:12px}.metric-card{display:grid;gap:8px;border:1px solid #dce5ea;border-radius:8px;padding:16px;background:white;min-height:118px}.metric-card span{font-size:12px;text-transform:uppercase;letter-spacing:.06em;font-weight:800;color:#64748b}.metric-card strong{font-size:32px;line-height:1}.metric-card small{color:#64748b}.project-list{display:grid;gap:12px}.project-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center;border:1px solid #dce5ea;border-radius:8px;padding:16px;background:white}.project-card h3{margin-bottom:6px}.status-pill{display:inline-flex;align-items:center;min-height:26px;padding:4px 9px;border-radius:999px;background:#e7f5f1;color:#0f766e;font-weight:800;font-size:12px;text-transform:capitalize}.status-pill.pending,.status-pill.draft,.status-pill.internal,.status-pill.open{background:#f1f5f9;color:#475569}.status-pill.blocked,.status-pill.error{background:#fff1f0;color:#9b2c2c}.status-pill.published,.status-pill.client,.status-pill.done,.status-pill.verified,.status-pill.override_verified{background:#e7f5f1;color:#0f766e}.status-pill.archived{background:#f3f4f6;color:#6b7280}.chart-panel{display:grid;gap:12px}.bar-row{display:grid;grid-template-columns:112px minmax(80px,1fr) 36px;gap:10px;align-items:center}.bar-track{height:10px;border-radius:999px;background:#e8eef2;overflow:hidden}.bar-fill{height:100%;border-radius:999px;background:#0f766e;min-width:2px}.bar-fill.alt{background:#2563eb}.bar-fill.warn{background:#c2410c}.mini-bars{display:flex;align-items:end;gap:8px;height:108px;padding-top:10px}.mini-bar{flex:1;min-width:18px;border-radius:6px 6px 0 0;background:#0f766e;min-height:10px}.mini-bar:nth-child(2n){background:#2563eb}.mini-bar:nth-child(3n){background:#c2410c}.metrics{display:grid;grid-template-columns:220px 1fr;gap:8px 14px}.metrics dt{font-weight:700}.metrics dd{margin:0}form{display:grid;gap:12px;margin:12px 0}label{display:grid;gap:6px;font-weight:700;color:#334155}input,textarea,select{font:inherit;border:1px solid #b8c4cc;border-radius:6px;padding:10px;background:white;max-width:100%;color:#111827}textarea{min-height:88px}button,.button{font:inherit;border:0;border-radius:6px;padding:10px 14px;background:#0f766e;color:white;text-decoration:none;cursor:pointer;display:inline-block;font-weight:800}button.secondary,.button.secondary{background:#475569}.danger{background:#9b2c2c}.error{border:1px solid #f2b8b5;background:#fff1f0;color:#8a1c1c;border-radius:6px;padding:10px 12px}table{width:100%;border-collapse:collapse;background:white}th,td{border-bottom:1px solid #e4eaee;text-align:left;padding:10px;vertical-align:top;word-break:break-word}th{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:#64748b}tr:last-child td{border-bottom:0}.row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.feed-item{border-top:1px solid #e4eaee;padding:12px 0}.feed-item:first-of-type{border-top:0;padding-top:0}.toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center}a{color:#0f766e;font-weight:700;text-decoration:none}a:hover{text-decoration:underline}pre{overflow:auto;background:#101827;color:white;border-radius:8px;padding:14px}@media (max-width:900px){main{padding:16px}.hero,.dashboard-grid{grid-template-columns:1fr}.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.project-card{grid-template-columns:1fr}.bar-row{grid-template-columns:92px minmax(80px,1fr) 32px}}@media (max-width:560px){.topbar{align-items:flex-start}.nav-actions{width:100%}.kpi-grid{grid-template-columns:1fr}.hero-panel{padding:18px}.section-header{display:grid}table{display:block;overflow-x:auto;white-space:nowrap}td:first-child,th:first-child{white-space:normal;min-width:180px}}main:has(.users-shell){max-width:none;width:100%;padding:16px}.users-shell{display:grid;grid-template-columns:270px minmax(0,1fr);gap:18px;align-items:start;min-height:calc(100vh - 32px)}.users-rail{position:sticky;top:16px;min-height:calc(100vh - 32px);background:linear-gradient(180deg,#383941 0%,#1f2025 100%);border-radius:10px;color:white;box-shadow:0 18px 35px rgba(33,36,44,.24);padding:24px 18px;display:grid;grid-template-rows:auto 1fr;gap:22px}.users-brand{display:flex;gap:10px;align-items:center;border-bottom:1px solid rgba(255,255,255,.18);padding:8px 12px 24px}.users-brand span{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:8px;background:#4f86f7;font-weight:900}.users-brand strong{font-size:15px}.users-nav{display:grid;align-content:start;gap:9px}.users-nav a{color:rgba(255,255,255,.82);border-radius:6px;min-height:52px;display:flex;align-items:center;padding:0 18px;text-decoration:none}.users-nav a:hover,.users-nav a.active{background:#4f8df7;color:white}.users-main{display:grid;gap:22px;min-width:0}.users-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;background:white;border:0;border-radius:10px;box-shadow:0 7px 14px rgba(30,34,45,.08);margin:0;padding:26px}.users-hero h1{color:#34405c;font-size:30px}.users-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;background:transparent;border:0;box-shadow:none;margin:0;padding:0}.users-summary-card{border-radius:10px;color:white;min-height:122px;padding:20px;box-shadow:0 13px 20px rgba(30,34,45,.18);display:grid;align-content:end}.users-summary-card span{font-size:13px;color:rgba(255,255,255,.82)}.users-summary-card strong{font-size:32px;line-height:1}.users-summary-card.blue{background:linear-gradient(180deg,#63a1fb 0%,#3f75e8 100%)}.users-summary-card.green{background:linear-gradient(180deg,#86bf68 0%,#619e4a 100%)}.users-summary-card.dark{background:linear-gradient(180deg,#3d3e45 0%,#17181d 100%)}.users-summary-card.pink{background:linear-gradient(180deg,#df3b84 0%,#bd145e 100%)}.users-card{background:white;border:0;border-radius:10px;box-shadow:0 7px 14px rgba(30,34,45,.08);margin:0;padding:26px}.users-form{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.password-form{max-width:760px}.users-form label{min-width:0}.users-form button{justify-self:start}.assignment-notice{border-radius:8px;margin:0 0 16px;padding:12px 14px}.assignment-success{background:#eef7ea;border:1px solid #cfe5c5;color:#3f7130}.assignment-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.assignment-card{background:#f8faff;border:1px solid #edf0f4;border-radius:8px;padding:16px;display:grid;gap:14px}.assignment-card-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.assignment-card-head h3{color:#34405c;font-size:16px;overflow-wrap:anywhere}.assignment-form{gap:10px;margin:0}.assignment-option{background:white;border:1px solid #edf0f4;border-radius:8px;color:#34405c;display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:start;font-weight:400;padding:10px}.assignment-option input{margin-top:3px}.assignment-option strong{display:block;font-size:14px;overflow-wrap:anywhere}.assignment-option small{display:block;color:#8a8fac;margin-top:3px;overflow-wrap:anywhere}.status-pill.admin{background:#eef7ea;color:#609c4b}.status-pill.team_member{background:#eef4ff;color:#3f75e8}.status-pill.client_viewer{background:#fff2dd;color:#d48719}@media (max-width:900px){main:has(.users-shell){padding:0}.users-shell{grid-template-columns:1fr}.users-rail{position:static;min-height:auto;border-radius:0}.users-summary-grid,.assignment-grid,.users-form{grid-template-columns:1fr}.users-hero{display:grid}}@media (max-width:560px){.users-card,.users-hero{border-radius:8px;padding:18px}}
/* R5B-HQA-F21: Users is server-rendered, so mirror the approved portal dark tokens here. */
:root[data-theme="dark"]{--color-page:#0b1120;--color-surface:#111827;--color-surface-raised:#172033;--color-surface-subtle:#1e293b;--color-surface-muted:#273449;--color-text:#f8fafc;--color-text-strong:#fff;--color-text-muted:#d1d5db;--color-text-soft:#cbd5e1;--color-brand-accent:#93c5fd;--color-border:#475569;--color-shadow:rgba(0,0,0,.34);color-scheme:dark;color:var(--color-text);background:var(--color-page)}
:root[data-theme="dark"] body:has(.users-shell){background:radial-gradient(circle at top right,rgba(96,165,250,.16),transparent 32%),linear-gradient(180deg,var(--color-surface-subtle) 0%,var(--color-page) 420px),var(--color-page);color:var(--color-text)}
:root[data-theme="dark"] .users-shell{color:var(--color-text)}
:root[data-theme="dark"] .users-rail{background:linear-gradient(180deg,#111827 0%,#030712 100%);box-shadow:0 18px 35px rgba(0,0,0,.42)}
:root[data-theme="dark"] .users-nav a{color:#e5e7eb}
:root[data-theme="dark"] .users-nav a:hover,:root[data-theme="dark"] .users-nav a.active{background:#2563eb;color:#fff}
:root[data-theme="dark"] .users-hero,:root[data-theme="dark"] .users-card{background:var(--color-surface-raised);border:1px solid var(--color-border);box-shadow:0 10px 24px var(--color-shadow);color:var(--color-text)}
:root[data-theme="dark"] .users-summary-card{background:var(--color-surface-raised);border:1px solid var(--color-border);box-shadow:0 10px 24px var(--color-shadow);color:var(--color-text-strong)}
:root[data-theme="dark"] .users-summary-card.blue,:root[data-theme="dark"] .users-summary-card.green,:root[data-theme="dark"] .users-summary-card.dark,:root[data-theme="dark"] .users-summary-card.pink{background:var(--color-surface-raised)}
:root[data-theme="dark"] .users-summary-card span{color:var(--color-text-muted)}
:root[data-theme="dark"] .users-summary-card strong,:root[data-theme="dark"] .users-hero h1,:root[data-theme="dark"] .users-card h2,:root[data-theme="dark"] .assignment-card-head h3,:root[data-theme="dark"] .assignment-option strong{color:var(--color-text-strong)}
:root[data-theme="dark"] .users-hero .muted,:root[data-theme="dark"] .users-card .muted,:root[data-theme="dark"] .assignment-card .muted,:root[data-theme="dark"] .assignment-option small,:root[data-theme="dark"] .users-form label{color:var(--color-text-muted)}
:root[data-theme="dark"] .assignment-card{background:var(--color-surface-subtle);border-color:var(--color-border);color:var(--color-text)}
:root[data-theme="dark"] .assignment-option{background:var(--color-surface-raised);border-color:var(--color-border);color:var(--color-text)}
:root[data-theme="dark"] .users-form input,:root[data-theme="dark"] .users-form select,:root[data-theme="dark"] .assignment-form input{background:var(--color-surface-subtle);border-color:var(--color-border);color:var(--color-text-strong)}
:root[data-theme="dark"] .users-form input:focus-visible,:root[data-theme="dark"] .users-form select:focus-visible,:root[data-theme="dark"] .assignment-form input:focus-visible,:root[data-theme="dark"] .users-shell button:focus-visible,:root[data-theme="dark"] .users-shell a:focus-visible{border-color:var(--color-brand-accent);box-shadow:0 0 0 3px rgba(147,197,253,.32);outline:0}
:root[data-theme="dark"] .users-shell button:disabled,:root[data-theme="dark"] .users-shell input:disabled,:root[data-theme="dark"] .users-shell select:disabled{color:var(--color-text-soft);opacity:.62}
:root[data-theme="dark"] .assignment-success,:root[data-theme="dark"] .status-pill.admin{background:#064e3b;border-color:#10b981;color:#d1fae5}
:root[data-theme="dark"] .status-pill.team_member{background:#172554;color:#dbeafe}
:root[data-theme="dark"] .status-pill.client_viewer{background:#451a03;color:#fef3c7}
:root[data-theme="dark"] .users-shell .error{background:#450a0a;border-color:#ef4444;color:#fee2e2}

/* R5B-HQA-F17: preserve the server-rendered login shell while sizing it for a real phone viewport. */
body:has(.auth-panel){min-height:100dvh}
.auth-panel :is(input,button):focus-visible{outline:3px solid #0f766e;outline-offset:2px}
:root[data-theme="dark"]:has(.auth-panel){color-scheme:dark}
:root[data-theme="dark"] body:has(.auth-panel){background:linear-gradient(180deg,#111827 0%,#0b1120 360px);color:#f8fafc}
:root[data-theme="dark"] .auth-panel{background:#172033;border-color:#475569;color:#f8fafc;box-shadow:0 20px 45px rgba(0,0,0,.34)}
:root[data-theme="dark"] .auth-panel h1{color:#fff}
:root[data-theme="dark"] .auth-panel label{color:#d1d5db}
:root[data-theme="dark"] .auth-panel input{background:#1e293b;border-color:#64748b;color:#fff}
:root[data-theme="dark"] .auth-panel :is(input,button):focus-visible{outline-color:#93c5fd}
@media (max-width:560px){
  body:has(.auth-panel){overflow-x:hidden}
  main.auth-panel{inline-size:min(420px,calc(100% - 24px));max-inline-size:calc(100% - 24px);min-inline-size:0;margin:clamp(20px,7dvh,48px) auto 28px;padding:clamp(20px,6vw,28px)}
  .auth-panel h1{font-size:clamp(28px,7.5vw,34px);max-width:100%;min-width:0;overflow-wrap:break-word}
  .auth-panel form{gap:16px;margin:20px 0 0;max-width:100%;min-width:0;width:100%}
  .auth-panel label{gap:8px;max-width:100%;min-width:0}
  .auth-panel input,.auth-panel button{max-width:100%;min-height:48px;min-width:0;width:100%}
  .auth-panel input{font-size:16px;padding:12px 14px}
}