@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700;800&family=Roboto:wght@500;700&display=swap');

:root { color-scheme:light; --navy:#0c3564; --navy-deep:#082a50; --blue:#2378cd; --blue-dark:#145ca6; --mist:#f5fafd; --ink:#153454; --muted:#4b647b; --line:#d9e6ef; --aqua:#eaf7fb; --error:#a23c32; --error-wash:#fff4f2; --shadow:0 20px 44px rgba(18,66,105,.12); }
* { box-sizing:border-box; }
html { background:var(--mist); }
body { min-width:320px; margin:0; color:var(--ink); background:linear-gradient(125deg,#f8fcff 0%,#edf8fd 100%); font-family:'Open Sans',Arial,sans-serif; line-height:1.6; }
a { color:var(--blue-dark); font-weight:700; text-decoration-thickness:1px; text-underline-offset:3px; }
a:hover { color:var(--navy); }
.portal-topbar { min-height:39px; color:#ecf5fc; background:var(--navy-deep); }
.portal-topbar__inner, .portal-header__inner, .portal-footer__inner { display:flex; align-items:center; justify-content:space-between; width:min(100% - 48px,1180px); margin:0 auto; }
.portal-topbar__inner { min-height:39px; gap:16px; font-size:12px; }
.portal-topbar a { color:#fff; text-decoration:none; }
.portal-topbar a:hover { color:#bfe6ff; }
.portal-header { background:#fff; box-shadow:0 2px 14px rgba(14,55,91,.08); }
.portal-header__inner { min-height:87px; gap:24px; }
.portal-logo { display:inline-flex; flex:0 0 auto; }
.portal-logo img { display:block; width:240px; height:auto; }
.portal-context { margin-left:auto; color:#35516c; font-size:13px; font-weight:800; }
.portal-home { display:inline-flex; align-items:center; justify-content:center; min-height:42px; padding:10px 15px; border-radius:8px; color:#fff; background:var(--blue); box-shadow:0 10px 20px rgba(35,120,205,.16); font-size:13px; font-weight:800; text-decoration:none; transition:background-color .2s ease,transform .2s ease; }
.portal-home:hover,.portal-home:focus-visible { color:#fff; background:var(--blue-dark); outline:3px solid rgba(35,120,205,.25); outline-offset:2px; transform:translateY(-1px); }
.portal-main { min-height:calc(100vh - 184px); padding:58px 0 68px; background:radial-gradient(circle at 80% 14%,rgba(219,241,249,.92) 0 10%,transparent 28%),linear-gradient(125deg,#f8fcff 0%,#edf8fd 100%); }
.portal-panel { width:min(100% - 48px,660px); margin:0 auto; padding:44px; border-radius:16px; background:#fff; box-shadow:var(--shadow); }
.portal-panel:has(.user-management),.portal-panel:has(.portal-dashboard),.portal-panel:has(.submission-review) { width:min(100% - 48px,1040px); }
h1,h2,h3 { margin-top:0; color:var(--navy); font-family:'Roboto',Arial,sans-serif; }
h1 { margin-bottom:12px; font-size:clamp(34px,5vw,46px); letter-spacing:-.035em; line-height:1.08; }
h2 { margin:32px 0 11px; font-size:22px; letter-spacing:-.022em; }
h3 { margin-bottom:8px; }
p { margin:0 0 18px; color:var(--muted); }
form { display:grid; gap:17px; margin-top:25px; }
label { display:grid; gap:7px; color:var(--ink); font-size:14px; font-weight:800; }
input,select { width:100%; min-height:48px; padding:11px 13px; border:1px solid #bfd0df; border-radius:8px; color:var(--ink); background:#fff; font:inherit; transition:border-color .2s ease,box-shadow .2s ease; }
input::placeholder { color:#72869a; }
input:focus,select:focus { border-color:var(--blue); outline:3px solid rgba(35,120,205,.18); outline-offset:1px; box-shadow:0 0 0 1px rgba(35,120,205,.08); }
button { min-height:48px; padding:11px 18px; border:0; border-radius:8px; color:#fff; background:var(--blue); box-shadow:0 10px 20px rgba(35,120,205,.16); font:inherit; font-weight:800; cursor:pointer; transition:background-color .2s ease,transform .2s ease,box-shadow .2s ease; }
button:hover { background:var(--blue-dark); box-shadow:0 12px 24px rgba(20,92,166,.22); transform:translateY(-1px); }
button:focus-visible { outline:3px solid rgba(35,120,205,.3); outline-offset:3px; }
.notice { margin:25px 0; padding:17px 18px; border-radius:12px; color:#245875; background:var(--aqua); }
.notice p:last-child { margin-bottom:0; }
.notice h2 { margin-top:0; }
.authenticator-qr-wrap { display:flex; justify-content:center; margin:18px 0 21px; padding:14px; border-radius:10px; background:#fff; }
.authenticator-qr { display:block; width:min(100%,220px); height:auto; }
.error { color:#7f3029; background:var(--error-wash); }
.error p { color:inherit; }
.logout { width:auto; margin-top:28px; color:var(--navy); background:#fff; box-shadow:inset 0 0 0 1px var(--line); }
.logout:hover { color:#fff; background:var(--navy); box-shadow:none; }
.meta { color:var(--muted); font-size:.9rem; }
code { display:block; overflow-wrap:anywhere; padding:12px; border-radius:8px; color:var(--navy); background:#fff; font-size:.94rem; font-weight:800; letter-spacing:.035em; }
.user-management h2 { margin-bottom:8px; }
.account-create { max-width:560px; }
.role-guidance { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:17px 0 0; }
.role-guidance div { padding:13px; border:1px solid var(--line); border-radius:10px; background:#f8fcff; }
.role-guidance dt { color:var(--ink); font-size:13px; font-weight:800; }
.role-guidance dd { margin:3px 0 0; color:var(--muted); font-size:12px; line-height:1.45; }
.account-create { max-width:none; padding:20px 21px 21px; border:1px solid var(--line); border-radius:14px; background:#fff; }
.account-create h2 { margin:0 0 4px; font-size:20px; }
.account-create > p { max-width:78ch; margin-bottom:0; font-size:13px; }
.account-create form { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:17px 12px; max-width:100%; margin-top:17px; }
.account-create__name-grid { display:contents; }
.account-create form > label,.account-create__name-grid > label { min-width:0; }
.account-create form > .facility-field,.account-create form > .role-guidance { grid-column:1 / -1; }
.account-create form > button { grid-column:1 / span 2; width:250px; }
.facility-field[hidden] { display:none; }
.facility-field > label { display:flex; align-items:baseline; gap:3px; margin-bottom:7px; }
.field-required { color:var(--error); }
.facility-entry { display:flex; align-items:flex-start; gap:10px; }
.facility-values { display:grid; flex:1 1 auto; gap:9px; }
.facility-add,.account-remove-button { min-height:48px; color:var(--navy); background:#fff; box-shadow:inset 0 0 0 1px var(--line); }
.facility-add:hover { color:#fff; background:var(--navy); box-shadow:none; }
.facility-help { margin:8px 0 0; font-size:12px; }
.account-manager { display:grid; grid-template-columns:minmax(240px,.7fr) minmax(0,1.3fr); gap:16px; margin-top:34px; }
.account-list,.account-detail { min-width:0; border:1px solid var(--line); border-radius:14px; background:#fff; }
.account-list { overflow:hidden; }
.account-list h2,.account-detail h2 { margin:0; padding:20px 21px 13px; font-size:20px; }
.account-user { display:flex; align-items:center; justify-content:space-between; min-height:64px; padding:16px 21px; border-top:1px solid var(--line); color:var(--ink); font-size:14px; font-weight:800; text-decoration:none; transition:background-color .2s ease,box-shadow .2s ease; }
.account-user:hover { color:var(--ink); background:#f8fcff; }
.account-user:focus-visible { outline:3px solid rgba(35,120,205,.3); outline-offset:-3px; }
.account-user--selected { background:var(--aqua); box-shadow:inset 0 0 0 2px rgba(35,120,205,.6); }
.account-user__chevron { width:9px; height:9px; margin-right:4px; border-top:2px solid var(--blue); border-right:2px solid var(--blue); transform:rotate(45deg); }
.account-detail { background:#fff; }
.account-detail__empty { min-height:280px; padding-bottom:21px; }
.account-detail__empty p { padding:0 21px; }
.account-detail fieldset { display:grid; gap:14px; margin:24px 21px 0; padding:0; border:0; opacity:.6; }
.account-detail__content > h3 { margin:0 21px 14px; font-size:20px; }
.account-detail__meta { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin:0 21px; padding:0 0 15px; border-bottom:1px solid var(--line); }
.account-detail__meta dt { color:var(--muted); font-size:12px; font-weight:800; }
.account-detail__meta dd { margin:5px 0 0; color:var(--ink); font-size:14px; font-weight:800; }
.account-detail__actions { margin:22px 21px 21px; padding-top:22px; border-top:1px solid var(--line); }
.account-detail__actions h3 { margin:0 0 13px; font-size:17px; }
.account-detail__actions form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin:0; }
.account-detail__actions .facility-field,.account-detail__actions button { grid-column:1 / -1; }
.account-remove-form { display:flex !important; align-items:center; justify-content:space-between; gap:18px; margin-top:20px !important; padding:16px; border:1px solid #efb8b2; border-radius:10px; background:var(--error-wash); }
.account-remove-form p { margin:0; }
.account-remove-form p strong,.account-remove-form p span { display:block; }
.account-remove-form p strong { color:#8b3029; font-size:14px; }
.account-remove-form p span { margin-top:3px; font-size:12px; }
.account-remove-button { color:#a23c32; box-shadow:inset 0 0 0 1px #d87970; }
.account-remove-button:hover { color:#fff; background:#a23c32; box-shadow:none; }
.account-confirmation--remove { border-color:#efb8b2; background:var(--error-wash); }
.account-bulk-form { margin-top:38px; gap:18px; }
.account-bulk-actions { display:flex; align-items:end; justify-content:space-between; gap:28px; padding:22px; border-radius:12px; background:var(--aqua); }
.account-bulk-actions h2 { margin-top:0; }
.account-bulk-actions p { max-width:48ch; margin-bottom:0; }
.account-selection { display:flex; align-items:center; gap:13px; margin-top:15px !important; }
.account-clear-selection,.account-secondary-action { display:inline-flex; align-items:center; justify-content:center; min-height:36px; padding:7px 11px; border-radius:7px; color:var(--navy); background:#fff; box-shadow:inset 0 0 0 1px var(--line); font-size:13px; font-weight:800; text-decoration:none; }
.account-clear-selection { border:0; cursor:pointer; }
.account-clear-selection:disabled { opacity:.55; cursor:not-allowed; }
.account-clear-selection:not(:disabled):hover,.account-secondary-action:hover { color:#fff; background:var(--navy); }
.account-bulk-controls { display:grid; grid-template-columns:repeat(2,minmax(170px,1fr)); gap:12px; min-width:min(100%,440px); }
.account-bulk-controls [hidden] { display:none !important; }
.account-bulk-controls button { grid-column:1 / -1; }
.account-bulk-controls input,.account-bulk-controls select { min-height:44px; }
.account-confirmation { margin:28px 0; padding:26px; border:1px solid #9bc8df; border-radius:14px; background:var(--aqua); }
.account-confirmation h2 { margin:0 0 10px; }
.account-confirmation__list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 18px; margin:14px 0 0; padding-left:20px; color:var(--ink); font-size:14px; }
.account-confirmation form { margin-top:20px; }
.account-confirmation__actions { display:flex; align-items:center; gap:14px; }
.account-confirmation__actions button { min-width:250px; }
.account-table-hint { display:none; margin:0; font-size:13px; }
.account-table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:12px; }
.account-table-wrap:focus-visible { outline:3px solid rgba(35,120,205,.3); outline-offset:3px; }
.account-table { width:100%; min-width:740px; border-collapse:collapse; text-align:left; }
.account-table th,.account-table td { padding:15px 16px; border-bottom:1px solid var(--line); vertical-align:top; }
.account-table th { color:var(--muted); background:#f8fbfd; font-size:12px; font-weight:800; letter-spacing:.035em; text-transform:uppercase; }
.account-table tbody tr:last-child td { border-bottom:0; }
.account-table tbody tr:hover { background:#f8fcff; }
.account-table td:first-child,.account-table th:first-child { width:52px; text-align:center; }
.account-check { width:20px; min-height:20px; margin:3px 0 0; accent-color:var(--blue); cursor:pointer; }
.account-date { display:block; margin-top:3px; color:var(--muted); font-size:12px; }
.account-status { display:inline-block; padding:3px 9px; border-radius:999px; color:#166b48; background:#e7f7ef; font-size:12px; font-weight:800; }
.account-status--disabled { color:#7f3029; background:var(--error-wash); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.dashboard-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-top:30px; }
.dashboard-grid--single { grid-template-columns:minmax(0,1fr); }
.dashboard-shortcuts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin:24px 0 30px; }
.dashboard-card { display:flex; flex-direction:column; min-height:250px; padding:28px; border:1px solid var(--line); border-radius:14px; background:#f8fcff; }
.dashboard-card h2 { margin:0 0 10px; }
.dashboard-card p { max-width:42ch; }
.dashboard-card__action { display:inline-flex; align-items:center; justify-content:center; min-height:46px; margin-top:auto; padding:10px 15px; border-radius:8px; color:#fff; background:var(--blue); box-shadow:0 10px 20px rgba(35,120,205,.16); font-size:14px; font-weight:800; text-decoration:none; transition:background-color .2s ease,transform .2s ease; }
.dashboard-card__action:hover,.dashboard-card__action:focus-visible { color:#fff; background:var(--blue-dark); outline:3px solid rgba(35,120,205,.25); outline-offset:2px; transform:translateY(-1px); }
.dashboard-submission-list { margin:6px 0 18px; padding-left:21px; }
.dashboard-submission-list li + li { margin-top:18px; }
.dashboard-submission-list form { margin-top:12px; gap:0; }
.dashboard-submission-list button { width:100%; }
.submission-review { max-width:1000px; }
.submission-review__header { margin:28px 0; }
.submission-review__header h1 { margin-bottom:9px; overflow-wrap:anywhere; }
.submission-review__grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:24px; }
.review-section { padding:27px; border:1px solid var(--line); border-radius:14px; background:#f8fcff; }
.review-section h2 { margin:0 0 10px; }
.review-section--completion { margin-top:24px; }
.review-document-list { display:grid; gap:12px; margin:18px 0 0; padding:0; list-style:none; }
.review-document-list li { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px; border-radius:10px; background:#fff; }
.review-document-list li + li { margin-top:0; }
.review-document-list strong,.review-document-list .meta { display:block; }
.review-document-actions { display:flex; flex:0 0 auto; gap:12px; }
.review-document-actions a { font-size:14px; }
.review-field-list { display:grid; gap:14px; margin:18px 0 0; }
.review-field-list div { padding-bottom:14px; border-bottom:1px solid var(--line); }
.review-field-list div:last-child { padding-bottom:0; border-bottom:0; }
.review-field-list dt { color:var(--muted); font-size:13px; font-weight:800; }
.review-field-list dd { margin:4px 0 0; overflow-wrap:anywhere; color:var(--ink); }
.review-complete-form { max-width:340px; margin:18px 0; gap:0; }
.submission-review-link { display:inline-block; margin-top:9px; }
.portal-footer { min-height:58px; color:#dbeaf6; background:var(--navy-deep); }
.portal-footer__inner { min-height:58px; font-size:12px; }
::selection { color:#fff; background:var(--blue); }

@media (max-width:980px) {
    .account-create form { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .account-create form > button { grid-column:1 / -1; width:100%; }
}

@media (max-width:640px) {
    .portal-topbar__inner,.portal-header__inner,.portal-footer__inner { width:min(100% - 32px,1180px); }
    .portal-topbar__inner { min-height:35px; }
    .portal-topbar__inner span { display:none; }
    .portal-header__inner { min-height:72px; gap:12px; }
    .portal-logo img { width:180px; }
    .portal-context { display:none; }
    .portal-home { min-height:39px; padding:9px 12px; font-size:12px; }
    .portal-main { min-height:calc(100vh - 165px); padding:28px 0 38px; }
    .portal-panel,.portal-panel:has(.user-management),.portal-panel:has(.portal-dashboard),.portal-panel:has(.submission-review) { width:min(100% - 32px,660px); padding:28px 23px; border-radius:14px; }
    h1 { font-size:34px; }
    h2 { font-size:20px; }
    .account-bulk-actions { display:block; padding:18px; }
    .account-bulk-controls { grid-template-columns:1fr; min-width:0; margin-top:18px; }
    .account-bulk-controls button { grid-column:auto; }
    .role-guidance { grid-template-columns:1fr; }
    .account-selection { align-items:flex-start; flex-direction:column; gap:8px; }
    .account-table-hint { display:block; }
    .account-table-wrap { overflow:visible; border:0; }
    .account-table { min-width:0; }
    .account-table thead { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
    .account-table,.account-table tbody,.account-table tr,.account-table td { display:block; width:100%; }
    .account-table tr { position:relative; margin-bottom:12px; padding:16px 16px 12px 52px; border:1px solid var(--line); border-radius:12px; background:#fff; }
    .account-table th,.account-table td { border:0; }
    .account-table td { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:9px 0; }
    .account-table td::before { content:attr(data-label); flex:0 0 88px; color:var(--muted); font-size:12px; font-weight:800; letter-spacing:.035em; text-transform:uppercase; }
    .account-table .account-select { position:absolute; top:15px; left:16px; width:20px; padding:0; }
    .account-table .account-select::before,.account-table .account-email::before { display:none; }
    .account-table .account-email { display:block; padding-top:0; }
    .account-table .account-email strong { overflow-wrap:anywhere; }
    .account-table .account-date { margin-top:4px; }
    .account-confirmation { padding:22px; }
    .account-confirmation__list { grid-template-columns:1fr; }
    .account-confirmation__actions { align-items:stretch; flex-direction:column; }
    .account-confirmation__actions button { width:100%; min-width:0; }
    .account-create form,.account-create__name-grid,.account-manager,.account-detail__actions form,.account-detail__meta { grid-template-columns:1fr; }
    .account-create { padding:18px; }
    .facility-entry,.account-remove-form { align-items:stretch; flex-direction:column; }
    .facility-add,.account-remove-form .account-remove-button { width:100%; }
    .account-manager { gap:14px; margin-top:26px; }
    .account-list h2,.account-detail h2 { padding:18px 18px 12px; }
    .account-user { min-height:58px; padding:14px 18px; }
    .account-detail__empty { min-height:0; padding-bottom:18px; }
    .account-detail__empty p { padding:0 18px; }
    .account-detail fieldset { margin:20px 18px 0; }
    .account-detail__content > h3 { margin:0 18px 12px; }
    .account-detail__meta,.account-detail__actions { margin-left:18px; margin-right:18px; }
    .account-detail__actions { margin-top:18px; padding-top:18px; }
    .dashboard-grid { grid-template-columns:1fr; gap:18px; margin-top:24px; }
    .dashboard-shortcuts { grid-template-columns:1fr; gap:12px; margin:20px 0 24px; }
    .dashboard-card { min-height:0; padding:22px; }
    .dashboard-card__action { margin-top:12px; }
    .submission-review__grid { grid-template-columns:1fr; gap:18px; }
    .review-section { padding:22px; }
    .review-section--completion { margin-top:18px; }
    .review-document-list li { align-items:flex-start; flex-direction:column; }
}
