/* Project 633 Design Pack: original silver/charcoal artwork and neutral surfaces.
   Swainsboro-inspired navy remains the functional accent for actions, focus, and active navigation. */
@media screen{
 :root{--p633-black:#151515;--p633-silver:#c7c9cc;--p633-white:#fff;--p633-muted:#717780;--canvas:#f4f5f6;--surface:var(--p633-white);--surface-soft:#f0f2f4;--ink:var(--p633-black);--muted:#626871;--line:#dfe2e6;--sidebar:#eceef0;--sidebar-text:#505762;--brand-blue:#234d7d;--accent:#183d6c;--tint:#eaf0f6;--focus:#365f94;--action:#10284f;--action-hover:#001b3d}
 :root[data-theme="dark"]{--canvas:var(--p633-black);--surface:#202124;--surface-soft:#292b2f;--ink:#f5f5f6;--muted:#b3b8c0;--line:#3a3d42;--sidebar:#191a1c;--sidebar-text:#c7c9cc;--brand-blue:#8aa8ce;--accent:#a3bddf;--tint:#223249;--focus:#85a6d1;--action:#163b68;--action-hover:#214b7d}
 /* Keep the silver-gray wash; no line art or repeating pattern behind the work. */
 .workspace{--canvas-silver:rgba(168,177,189,.14);--canvas-blue:rgba(87,132,190,.075);background-image:linear-gradient(135deg,transparent 24%,var(--canvas-silver) 24.1%,transparent 58%),radial-gradient(ellipse at 100% 0%,var(--canvas-blue),transparent 68%);background-size:100% 1100px,100% 850px;background-position:left top,right top;background-repeat:no-repeat}
 :root[data-theme="dark"] .workspace{--canvas-silver:rgba(199,201,204,.035);--canvas-blue:rgba(85,126,184,.075)}
}
.p633-wordmark{display:block;width:320px;max-width:100%;line-height:0}
.p633-wordmark img{display:block;width:100%;height:auto;object-fit:contain;filter:none;box-shadow:none;transform:none}
.p633-wordmark .p633-wordmark-dark{display:none}
:root[data-theme="dark"] .p633-wordmark .p633-wordmark-light{display:none}
:root[data-theme="dark"] .p633-wordmark .p633-wordmark-dark,.p633-wordmark-on-dark .p633-wordmark-dark{display:block}
.sidebar-header .p633-product{display:flex;align-items:center;gap:8px;min-height:76px;padding:6px 0}
.sidebar-header .p633-emblem{display:block;flex:0 0 64px;width:64px;height:64px;object-fit:contain;filter:none;box-shadow:none}
.p633-product-name{font-family:"DejaVu Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.1;color:var(--ink);min-width:0}
.p633-product-name>span{display:block;font-size:9px;font-weight:400;letter-spacing:1.15px;text-transform:uppercase}
.p633-product-name>strong{display:block;font-size:27px;font-weight:700;letter-spacing:-.5px;margin-top:4px}
.sidebar-header{gap:6px;margin-bottom:14px}
.login-intro{background:radial-gradient(ellipse at 100% 100%,#27303e 0,transparent 65%),linear-gradient(145deg,#151515,#202226);color:#fff}
.login-product{display:block;width:320px;max-width:100%;padding:0}
.login-product .p633-wordmark{width:100%}
.login-product>span{font-size:inherit;border:0;border-radius:0;padding:0;margin:0;color:inherit;letter-spacing:normal}
.login-location,.login-footnote,.login-department .login-description{color:#bdc2ca}
.login-divider{background:#c7c9cc44}
.login-department .department-motto{color:#d9dce1}
.login-form-brand{display:none}
.p633-about-brand{display:flex;justify-content:center;margin:0 0 18px}
.p633-about-brand .p633-wordmark{width:360px}
@media(max-width:760px){
 .login-shell{background:#151515}
 .login-product{align-self:center;width:300px;flex-shrink:0}
 .login-form-brand{display:block;margin:0 0 8px}
 .login-form-brand .p633-wordmark{width:300px}
 .sidebar-header .p633-product{gap:10px}
}
@media(max-width:760px) and (max-height:600px){.login-product{width:280px}.login-shell .login-intro{gap:6px}.login-intro .login-department{padding:0}.login-intro .login-department>img{height:64px;margin-bottom:8px}}
@media print{.p633-wordmark .p633-wordmark-light{display:block!important}.p633-wordmark .p633-wordmark-dark{display:none!important}}

/* Agency identity stays beside the navigation control, with no secondary label. */
.topbar .workspace-heading .agency-lockup{display:flex;flex-direction:row;align-items:center;gap:10px;max-width:280px;line-height:1.4}
.agency-lockup .agency-header-logo{display:block;width:34px;height:42px;object-fit:contain;flex:0 0 auto}
.agency-lockup>span{min-width:0;overflow-wrap:anywhere}
@media(max-width:1200px) and (min-width:761px){.topbar .workspace-heading .agency-lockup{max-width:220px;gap:8px}}
@media(max-width:760px){
 .topbar .workspace-heading .agency-lockup{gap:8px;max-width:none}
 .agency-lockup .agency-header-logo{width:26px;height:32px}
 .workspace{background-size:850px 950px,100% 700px}
}
@media(forced-colors:active){.workspace{background-image:none}}

@media(max-width:380px){
 .topbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px}
 .topbar .workspace-heading{grid-column:1/-1}
 .topbar .global-search{grid-column:1;grid-row:2;min-width:0;margin:0;width:100%}
 .topbar .context{grid-column:2;grid-row:2;margin:0}
}
/* A lost server connection remains visible on small screens. */
.storage-note.connection-lost{display:block;color:var(--danger,#b64935)}
@media(max-width:760px){.banner:has(.connection-lost){flex-wrap:wrap}.storage-note.connection-lost{flex-basis:100%;margin-left:11px;font-size:10px}}

/* Microsoft sign-in uses the same primary-action treatment as agency forms. */
.login-card a.primary{display:flex;justify-content:center;align-items:center;min-height:48px;padding:13px 20px;margin-top:24px;border-radius:10px;background:var(--action);color:#fff;text-decoration:none;font-weight:600}
.login-card a.primary:hover{background:var(--action-hover)}

/* Account enrollment stays readable on phones without widening the card. */
.auth-qr{display:block;max-width:100%;height:auto;margin:12px auto;border-radius:12px;background:#fff}.auth-secret,.auth-recovery{white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-all;font-size:13px;user-select:text}.auth-recovery{padding:12px;background:var(--bg,#edf1f6);border-radius:10px}#email-sign-in{margin:16px 0}#email-sign-in form{display:grid;gap:12px}#email-sign-in .helper{margin:0}#email-sign-in .primary{width:100%}#account-setup-link{font-size:16px;overflow-wrap:anywhere}