:root {
  --navy: #0b1f3a;
  --navy-2: #143056;
  --gold: #c4a35a;
  --paper: #f4f1ea;
  --ink: #1c2430;
  --muted: #5c6774;
  --line: #d7dbe0;
  --white: #fff;
  --shadow: 0 18px 50px rgba(0,0,0,.22);
}
* { box-sizing: border-box; }
html, body { margin:0; padding:0; min-height:100vh; font-family:"Segoe UI","Helvetica Neue",Arial,sans-serif; background:linear-gradient(180deg,var(--navy) 0%,var(--navy-2) 42%,#0e1724 100%); color:var(--ink); }
body { padding-bottom:2rem; }
.topbar { display:flex; align-items:center; justify-content:space-between; gap:1.5rem; padding:1rem clamp(1rem,4vw,3rem); color:#fff; max-width:1400px; margin:0 auto; }
.brand { display:flex; gap:.85rem; align-items:center; min-width:0; }
.brand-mark { width:2.7rem; height:2.7rem; border:2px solid var(--gold); display:grid; place-items:center; font-weight:700; letter-spacing:.04em; flex:0 0 auto; }
.brand strong { letter-spacing:.02em; }
.subtitle { color:#d7c9a3; font-size:.82rem; margin-top:.12rem; }
.nav { display:flex; align-items:center; justify-content:flex-end; gap:.35rem; flex-wrap:wrap; }
.nav a,.nav button { color:#fff; text-decoration:none; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16); border-radius:7px; padding:.55rem .8rem; font-weight:600; font-size:.9rem; }
.nav a:hover,.nav button:hover { background:rgba(196,163,90,.18); border-color:var(--gold); }
.nav form { margin:0; }
.nav .nav-user { color:#d7c9a3; padding:.55rem .35rem; font-size:.85rem; }
.panel { width:min(1180px,calc(100% - 2rem)); margin:1rem auto 2rem; background:var(--paper); padding:clamp(1.4rem,3vw,2.4rem); border-radius:12px; box-shadow:var(--shadow); }
.panel-narrow { max-width:760px; }
.page-header { display:flex; align-items:flex-start; justify-content:space-between; gap:1.5rem; margin-bottom:1.5rem; padding-bottom:1.2rem; border-bottom:1px solid var(--line); }
.page-header h1 { margin:0 0 .35rem; }
.page-header p { margin:.25rem 0 0; }
.header-actions { display:flex; gap:.6rem; flex-wrap:wrap; justify-content:flex-end; }
.eyebrow { text-transform:uppercase; letter-spacing:.12em; color:var(--gold); font-size:.75rem; font-weight:700; margin:0 0 .5rem; }
h1 { margin:0 0 1rem; color:var(--navy); font-size:clamp(1.65rem,3vw,2.2rem); }
h2 { color:var(--navy); margin:2rem 0 .9rem; font-size:1.2rem; }
h3 { color:var(--navy); }
p { line-height:1.55; color:var(--ink); }
.muted { color:var(--muted); }
a { color:var(--navy-2); }
.status,.alert { background:#fff; border-left:4px solid var(--gold); padding:.9rem 1rem; border-radius:6px; margin:1rem 0; }
.actions { display:flex; align-items:center; gap:.7rem; flex-wrap:wrap; margin-top:1.4rem; }
button,.button-link { display:inline-flex; align-items:center; justify-content:center; min-height:2.65rem; padding:.65rem 1rem; border:0; border-radius:7px; background:var(--navy); color:#fff; font-weight:600; cursor:pointer; text-decoration:none; transition:background .15s,transform .1s; }
button:hover,.button-link:hover { background:var(--navy-2); color:#fff; }
button:active,.button-link:active { transform:translateY(1px); }
button:disabled { opacity:.5; cursor:not-allowed; }
form label { display:block; font-weight:600; color:var(--navy); }
input,select,textarea { width:100%; margin-top:.4rem; padding:.7rem .8rem; border:1px solid #b9c0c8; border-radius:7px; background:#fff; color:var(--ink); font:inherit; outline:none; }
input:focus,select:focus,textarea:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(196,163,90,.16); }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem 1.2rem; }
.form-field-full { grid-column:1/-1; }
.form-section { background:rgba(255,255,255,.55); border:1px solid var(--line); border-radius:10px; padding:1.15rem; margin:1.1rem 0; }
.form-section-header { margin-bottom:1rem; }
.form-section-header h2 { margin:0 0 .25rem; font-size:1.05rem; }
.form-section-header p { margin:0; color:var(--muted); font-size:.9rem; }
.checkbox-row { display:flex; gap:1.2rem; flex-wrap:wrap; align-items:center; }
.checkbox-row label { display:flex; align-items:center; gap:.5rem; font-weight:500; }
.checkbox-row input { width:auto; margin:0; }
.meta { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.8rem; margin:1.5rem 0; }
.meta>div { background:#fff; border:1px solid var(--line); border-radius:8px; padding:.85rem 1rem; }
.meta dt { font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); }
.meta dd { margin:.25rem 0 0; font-weight:600; overflow-wrap:anywhere; }
table { width:100%; border-collapse:separate; border-spacing:0; background:#fff; border:1px solid var(--line); border-radius:9px; overflow:hidden; margin:1rem 0; }
th { background:#eef1f5; color:var(--navy); text-align:left; font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; padding:.8rem .75rem; border-bottom:1px solid var(--line); }
td { padding:.8rem .75rem; border-bottom:1px solid #e5e7ea; vertical-align:middle; }
tr:last-child td { border-bottom:0; }
.admin-nav { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.85rem; margin:1.25rem 0 1.7rem; }
.admin-nav .button-link { min-height:5.5rem; justify-content:flex-start; }
.inline-form { display:inline-flex; align-items:center; gap:.45rem; margin:.15rem .25rem .15rem 0; }
.inline-form select { width:auto; min-width:150px; margin:0; padding:.55rem .6rem; }
.inline-form button { min-height:2.35rem; padding:.5rem .7rem; }
.role-badge { display:inline-block; padding:.28rem .55rem; border-radius:999px; background:#eef1f5; font-size:.85rem; font-weight:600; white-space:nowrap; }
.status-active { font-weight:600; }
.status-inactive { color:var(--muted); font-weight:600; }
.search-form { display:flex; gap:.7rem; align-items:end; margin:1rem 0; }
.search-form input { flex:1; min-width:0; margin:0; }
.search-form button { flex:0 0 auto; }
.pagination { display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin:1rem 0; }
.pagination-count { color:var(--muted); font-size:.9rem; }
.pagination-links { display:flex; align-items:center; gap:.35rem; flex-wrap:wrap; }
.pagination-link,.pagination-current { display:inline-flex; align-items:center; justify-content:center; min-width:2.2rem; min-height:2.2rem; padding:.35rem .65rem; border:1px solid #c8cfd6; border-radius:6px; text-decoration:none; }
.pagination-link { background:#fff; color:var(--navy); }
.pagination-current { background:var(--navy); color:#fff; border-color:var(--navy); font-weight:700; }
.ad-results { display:flex; flex-direction:column; gap:.55rem; margin-top:1rem; }
.ad-result { display:flex; align-items:center; gap:.85rem; padding:.85rem 1rem; background:#fff; border:1px solid #d2d7dd; border-radius:7px; cursor:pointer; }
.ad-result:hover { border-color:var(--gold); }
.ad-result input[type="checkbox"] { width:1.15rem; height:1.15rem; flex:0 0 auto; }
.ad-result span { display:flex; flex-direction:column; gap:.2rem; }
.ad-result small { color:var(--muted); }
.users-dialog { width:min(42rem,calc(100vw - 2rem)); max-height:min(80vh,42rem); border:0; border-radius:10px; padding:0; background:var(--paper); color:var(--ink); box-shadow:0 24px 70px rgba(0,0,0,.45); }
.users-dialog::backdrop { background:rgba(0,0,0,.65); }
.users-dialog-header { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem 1.25rem; border-bottom:1px solid var(--line); }
.users-dialog-header h2 { margin:0; }
.users-dialog .ad-results { padding:1rem 1.25rem; max-height:55vh; overflow-y:auto; }
.users-dialog-footer { padding:.9rem 1.25rem; border-top:1px solid var(--line); background:#fff; }
.charter-document,.signature-section { background:#fff; border:1px solid var(--line); border-radius:10px; padding:1.2rem; margin:1.2rem 0; }
.error { background:#fff1f0; border-left:4px solid #a33a32; color:#7d2620; padding:.8rem 1rem; border-radius:6px; font-weight:600; }
footer { color:#b8c0cc; font-size:.8rem; text-align:center; padding:0 1.5rem 2rem; max-width:48rem; margin:0 auto; line-height:1.45; }
@media (max-width:900px) { .panel { width:min(100% - 1.2rem,760px); } .admin-nav { grid-template-columns:1fr; } .meta { grid-template-columns:1fr; } .page-header { flex-direction:column; } .header-actions { justify-content:flex-start; } table { display:block; overflow-x:auto; } }
@media (max-width:640px) { .topbar { align-items:flex-start; flex-direction:column; } .nav { width:100%; justify-content:flex-start; } .form-grid { grid-template-columns:1fr; } .form-field-full { grid-column:auto; } .search-form { flex-direction:column; align-items:stretch; } .search-form button { width:100%; } .panel { margin-top:.4rem; padding:1.2rem; border-radius:9px; } }

/* Login page */
.login-page { min-height:100vh; padding:0; display:flex; align-items:center; justify-content:center; background:radial-gradient(circle at 50% -10%,rgba(196,163,90,.16),transparent 35%),linear-gradient(145deg,var(--navy) 0%,var(--navy-2) 55%,#0a1422 100%); }
.login-shell { width:min(100%,34rem); padding:2rem 1.2rem; }
.login-card { background:rgba(244,241,234,.98); border:1px solid rgba(255,255,255,.2); border-radius:16px; padding:clamp(1.5rem,5vw,2.5rem); box-shadow:0 28px 80px rgba(0,0,0,.35); }
.login-brand { display:flex; align-items:center; gap:.85rem; padding-bottom:1.35rem; border-bottom:1px solid var(--line); }
.login-brand .brand-mark { width:3rem; height:3rem; }
.login-brand strong { color:var(--navy); letter-spacing:.03em; }
.login-heading { margin:2rem 0 1.35rem; }
.login-heading h1 { font-size:2rem; margin-bottom:.45rem; }
.login-heading p:last-child { margin:0; color:var(--muted); font-size:.95rem; line-height:1.6; }
.login-form { display:flex; flex-direction:column; gap:1.1rem; }
.login-field { display:flex; flex-direction:column; gap:.15rem; }
.login-label-row { display:flex; justify-content:space-between; align-items:center; }
.login-field input { margin-top:.25rem; min-height:3rem; padding:.8rem .9rem; }
.login-field input::placeholder { color:#89919b; }
.login-submit { width:100%; min-height:3.1rem; margin-top:.2rem; justify-content:space-between; padding:.75rem 1rem  .75rem 1.15rem; background:var(--navy); }
.login-submit span { font-size:1.15rem; transition:transform .15s; }
.login-submit:hover span { transform:translateX(3px); }
.login-alert { display:flex; align-items:flex-start; gap:.7rem; margin:0 0 1.1rem; padding:.85rem .95rem; border:1px solid #e3b9b5; border-radius:8px; background:#fff1f0; color:#7d2620; line-height:1.45; }
.login-alert-icon { display:grid; place-items:center; width:1.35rem; height:1.35rem; flex:0 0 auto; border-radius:50%; background:#a33a32; color:#fff; font-size:.78rem; font-weight:800; }
.login-security { display:flex; gap:.7rem; align-items:flex-start; margin-top:1.35rem; padding:.85rem .9rem; border:1px solid var(--line); border-radius:8px; background:#fff; }
.security-icon { display:grid; place-items:center; width:1.35rem; height:1.35rem; flex:0 0 auto; border-radius:50%; background:rgba(196,163,90,.2); color:var(--navy); font-weight:800; }
.login-security div { display:flex; flex-direction:column; gap:.18rem; }
.login-security strong { color:var(--navy); font-size:.82rem; }
.login-security span:last-child { color:var(--muted); font-size:.75rem; line-height:1.4; }
.login-footer { margin:1rem 0 0; color:#c9d0d9; text-align:center; font-size:.75rem; line-height:1.5; }
@media (max-width:640px) { .login-shell { padding:1rem .8rem; } .login-card { padding:1.35rem; border-radius:12px; } .login-heading { margin-top:1.5rem; } }


/* Employee dashboard */
.dashboard-panel { padding-bottom:2.2rem; }
.dashboard-header { margin-bottom:1.35rem; }
.dashboard-header h1 { margin-bottom:.3rem; }
.page-intro { margin:0; color:var(--muted); max-width:680px; }
.nav .nav-active { background:rgba(196,163,90,.18); border-color:rgba(196,163,90,.65); }
.kpi-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin:0 0 1.8rem; }
.kpi-card { position:relative; overflow:hidden; background:#fff; border:1px solid var(--line); border-radius:10px; padding:1.1rem 1.2rem; min-height:8.1rem; display:flex; flex-direction:column; justify-content:center; }
.kpi-card::after { content:""; position:absolute; right:-1.5rem; bottom:-2.2rem; width:5.5rem; height:5.5rem; border-radius:50%; background:rgba(196,163,90,.10); }
.kpi-label { color:var(--muted); font-size:.76rem; text-transform:uppercase; letter-spacing:.07em; font-weight:700; }
.kpi-card strong { color:var(--navy); font-size:2.05rem; line-height:1.15; margin:.3rem 0 .15rem; }
.kpi-note { color:var(--muted); font-size:.78rem; }
.kpi-pending strong { color:#8a6720; }
.kpi-signed strong { color:#3e6549; }
.dashboard-content { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:1.25rem; align-items:start; }
.charters-section { min-width:0; }
.section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; margin-bottom:.8rem; }
.section-heading h2 { margin:0; }
.section-count { color:var(--muted); font-size:.8rem; padding-bottom:.1rem; }
.charter-list { display:flex; flex-direction:column; gap:.75rem; }
.charter-card { display:flex; align-items:center; justify-content:space-between; gap:1rem; background:#fff; border:1px solid var(--line); border-radius:9px; padding:1rem 1.05rem; transition:border-color .15s,box-shadow .15s,transform .15s; }
.charter-card:hover { border-color:#c4a35a; box-shadow:0 7px 20px rgba(11,31,58,.08); transform:translateY(-1px); }
.charter-card-main { min-width:0; flex:1; }
.charter-card-title-row { display:flex; align-items:center; gap:.7rem; justify-content:space-between; }
.charter-card h3 { margin:.1rem 0 .25rem; font-size:1rem; }
.charter-card-eyebrow { margin:0; color:var(--gold); text-transform:uppercase; letter-spacing:.08em; font-size:.66rem; font-weight:700; }
.charter-version { margin:0; color:var(--muted); font-size:.78rem; }
.charter-status { display:inline-flex; align-items:center; flex:0 0 auto; padding:.3rem .6rem; border-radius:999px; font-size:.72rem; font-weight:700; white-space:nowrap; }
.status-pending { background:#f5edd9; color:#785d1c; }
.status-signing { background:#e8edf5; color:#29466e; }
.status-signed { background:#e7f0e9; color:#3e6549; }
.charter-actions { display:flex; align-items:center; gap:.45rem; flex:0 0 auto; }
.button-small { min-height:2.3rem; padding:.5rem .7rem; font-size:.78rem; }
.button-secondary { background:#fff; color:var(--navy); border:1px solid #bcc4cc; }
.button-secondary:hover { background:#eef1f5; color:var(--navy); border-color:var(--navy-2); }
.profile-card { background:#fff; border:1px solid var(--line); border-radius:10px; padding:1.1rem; }
.profile-heading { display:flex; align-items:center; gap:.75rem; padding-bottom:.9rem; border-bottom:1px solid var(--line); }
.profile-heading h2 { margin:.1rem 0 0; font-size:1.05rem; overflow-wrap:anywhere; }
.profile-avatar { width:2.55rem; height:2.55rem; flex:0 0 auto; border-radius:50%; display:grid; place-items:center; background:var(--navy); color:#fff; font-weight:700; border:2px solid var(--gold); }
.profile-details { margin:0; }
.profile-details>div { padding:.72rem 0; border-bottom:1px solid #eceef0; }
.profile-details>div:last-child { border-bottom:0; }
.profile-details dt { color:var(--muted); font-size:.68rem; text-transform:uppercase; letter-spacing:.06em; }
.profile-details dd { margin:.2rem 0 0; font-size:.82rem; font-weight:600; overflow-wrap:anywhere; }
.profile-security { display:flex; gap:.6rem; align-items:flex-start; margin-top:.7rem; padding:.7rem; border-radius:7px; background:#f7f8f9; }
.profile-security>span { display:grid; place-items:center; width:1.25rem; height:1.25rem; flex:0 0 auto; border-radius:50%; background:rgba(196,163,90,.22); color:var(--navy); font-weight:800; font-size:.72rem; }
.profile-security div { display:flex; flex-direction:column; gap:.15rem; }
.profile-security strong { color:var(--navy); font-size:.73rem; }
.profile-security small { color:var(--muted); font-size:.68rem; line-height:1.35; }
.empty-state { text-align:center; background:#fff; border:1px dashed #c7cdd3; border-radius:9px; padding:2.5rem 1.5rem; }
.empty-state-icon { width:2.5rem; height:2.5rem; margin:0 auto .75rem; display:grid; place-items:center; border-radius:50%; background:#e7f0e9; color:#3e6549; font-weight:800; }
.empty-state h3 { margin:.3rem 0 .4rem; }
.empty-state p { margin:0 auto; color:var(--muted); max-width:30rem; font-size:.85rem; }
@media (max-width:1000px) { .dashboard-content { grid-template-columns:1fr; } .profile-card { order:-1; } .profile-details { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 1rem; } }
@media (max-width:700px) { .kpi-grid { grid-template-columns:1fr; } .kpi-card { min-height:6.5rem; } .charter-card { align-items:flex-start; flex-direction:column; } .charter-card-title-row { width:100%; align-items:flex-start; } .charter-actions { width:100%; } .charter-actions .button-link { flex:1; } .profile-details { grid-template-columns:1fr; } }

/* Charter management */
.charter-admin-list { display:flex; flex-direction:column; gap:.9rem; margin-bottom:1.5rem; }
.charter-admin-card { display:flex; justify-content:space-between; gap:1.2rem; background:#fff; border:1px solid var(--line); border-radius:10px; padding:1.15rem; transition:border-color .15s,box-shadow .15s; }
.charter-admin-card:hover { border-color:var(--gold); box-shadow:0 8px 24px rgba(11,31,58,.08); }
.charter-admin-main { min-width:0; flex:1; }
.charter-admin-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; }
.charter-admin-heading h2 { margin:.15rem 0 .25rem; font-size:1.08rem; }
.charter-admin-version { margin:0; color:var(--muted); font-size:.8rem; }
.charter-admin-meta { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.6rem; margin-top:.9rem; }
.charter-admin-meta span { display:flex; flex-direction:column; gap:.15rem; padding:.6rem .7rem; background:#f7f8f9; border-radius:7px; }
.charter-admin-meta small { color:var(--muted); font-size:.66rem; text-transform:uppercase; letter-spacing:.05em; }
.charter-admin-meta strong { color:var(--navy); font-size:.88rem; }
.charter-admin-meta em { color:var(--muted); font-style:normal; font-size:.72rem; }
.charter-progress { height:7px; background:#e7eaed; border-radius:999px; overflow:hidden; margin:.85rem 0 .55rem; }
.charter-progress span { display:block; height:100%; background:var(--gold); border-radius:inherit; }
.charter-progress-large { height:10px; }
.charter-file { margin:.5rem 0 0; color:var(--muted); font-size:.7rem; overflow-wrap:anywhere; }
.charter-admin-actions { display:flex; flex-direction:column; align-items:stretch; justify-content:center; gap:.45rem; min-width:125px; }
.charter-admin-actions .inline-form { margin:0; }
.charter-admin-actions .inline-form button { width:100%; }
.status-draft { background:#eef1f5; color:#4c5968; }
.status-published { background:#e7f0e9; color:#3e6549; }
.status-archived { background:#ececec; color:#626b73; }
.charter-kpis { grid-template-columns:repeat(4,minmax(0,1fr)); }
.detail-grid { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:1.2rem; align-items:start; }
.detail-grid .form-section { margin-top:0; }
.action-card { background:#fff; border:1px solid var(--line); border-radius:10px; padding:1.1rem; margin-bottom:1rem; }
.action-card .eyebrow { margin-bottom:.8rem; }
.detail-actions { display:flex; flex-direction:column; gap:.55rem; }
.detail-actions form { margin:0; }
.detail-actions button,.detail-actions .button-link { width:100%; }
.button-secondary { background:#fff; color:var(--navy); border:1px solid #bcc4cc; }
.button-secondary:hover { background:#eef1f5; color:var(--navy); }
.document-info { display:flex; flex-direction:column; gap:.3rem; margin-top:1rem; padding:.85rem 1rem; background:#fff; border:1px solid var(--line); border-radius:8px; }
.document-info span,.document-info small { color:var(--muted); overflow-wrap:anywhere; }
.signature-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.7rem; }
.signature-kpis div { padding:.8rem; background:#fff; border:1px solid var(--line); border-radius:8px; text-align:center; }
.signature-kpis strong { display:block; color:var(--navy); font-size:1.35rem; }
.signature-kpis span { color:var(--muted); font-size:.7rem; }
.progress-label { text-align:right; color:var(--muted); font-size:.78rem; margin:0; }
@media (max-width:900px) { .charter-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); } .detail-grid { grid-template-columns:1fr; } .charter-admin-meta { grid-template-columns:repeat(2,minmax(0,1fr)); } .charter-admin-actions { min-width:110px; } }
@media (max-width:640px) { .charter-kpis,.signature-kpis { grid-template-columns:1fr 1fr; } .charter-admin-card { flex-direction:column; } .charter-admin-heading { flex-direction:column; } .charter-admin-actions { width:100%; flex-direction:row; flex-wrap:wrap; } .charter-admin-actions > * { flex:1; min-width:110px; } .charter-admin-actions .inline-form button { width:100%; } }

/* Assignment management */
.assignment-section { padding:clamp(1.1rem,2vw,1.5rem); }
.assignment-toolbar { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:1rem; padding:.8rem .95rem; background:#fff; border:1px solid var(--line); border-radius:8px; }
.assignment-toolbar > span { color:var(--muted); font-size:.82rem; }
.assignment-toolbar strong { color:var(--navy); }
.search-status { min-height:1.25rem; margin:.45rem 0 0; color:var(--muted); font-size:.8rem; }
.ad-result.assigned { opacity:.65; cursor:not-allowed; background:#f7f8f9; }
.ad-result.assigned:hover { border-color:#d2d7dd; }
.users-dialog { width:min(48rem,calc(100vw - 2rem)); }
.users-dialog-header { padding:1rem 1.25rem; }
.users-dialog-header > div { min-width:0; }
.users-dialog-header h2 { margin:0; }
.users-dialog-header .eyebrow { margin-bottom:.25rem; }
.users-dialog-footer { display:flex; align-items:center; justify-content:flex-end; gap:1rem; }
.users-dialog-footer > strong { margin-right:auto; color:var(--navy); }
.assignment-submit { display:flex; align-items:center; gap:.8rem; flex-wrap:wrap; margin-top:1rem; }
.assignment-submit span { color:var(--muted); font-size:.78rem; }
@media (max-width:640px) { .assignment-toolbar,.users-dialog-footer { align-items:stretch; flex-direction:column; } .assignment-toolbar > span { text-align:center; } .users-dialog-footer > strong { margin-right:0; } .assignment-submit button { width:100%; } .assignment-submit span { text-align:center; width:100%; } }

/* Admin dashboard */
.admin-dashboard-kpis { grid-template-columns:repeat(6,minmax(0,1fr)); }
.admin-welcome { display:inline-flex; align-items:center; min-height:2.65rem; padding:.6rem .85rem; border:1px solid rgba(196,163,90,.45); border-radius:7px; color:var(--navy); background:rgba(255,255,255,.75); font-size:.86rem; }
.kpi-value-text { display:block; font-size:1.05rem !important; line-height:1.3; min-height:2.7rem; overflow-wrap:anywhere; }
.admin-dashboard-grid { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(320px,.9fr); gap:1.1rem; margin:1.1rem 0; }
.admin-section { min-width:0; background:rgba(255,255,255,.55); border:1px solid var(--line); border-radius:10px; padding:1.15rem; }
.admin-section h2 { margin:0; }
.admin-section .section-heading { margin-bottom:1rem; }
.section-description { color:var(--muted); font-size:.86rem; margin:.3rem 0 0; }
.button-small { min-height:2.25rem; padding:.5rem .7rem; font-size:.82rem; white-space:nowrap; }
.dashboard-progress-head { display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; margin:1.2rem 0 .65rem; }
.dashboard-progress-head div { display:flex; flex-direction:column; gap:.2rem; min-width:0; }
.dashboard-progress-head div strong { color:var(--navy); font-size:1rem; overflow-wrap:anywhere; }
.dashboard-progress-head div span { color:var(--muted); font-size:.78rem; }
.dashboard-progress-head > strong { color:var(--navy); font-size:1.7rem; }
.dashboard-progress-bar { display:flex; width:100%; height:1rem; overflow:hidden; border-radius:999px; background:#e3e6ea; box-shadow:inset 0 1px 2px rgba(0,0,0,.08); }
.dashboard-progress-bar span { display:block; min-width:0; height:100%; transition:width .2s ease; }
.progress-signed { background:var(--navy); }
.progress-signing { background:var(--gold); }
.progress-pending { background:#b9c0c8; }
.progress-legend { display:flex; gap:1rem; flex-wrap:wrap; margin:1rem 0; color:var(--muted); font-size:.82rem; }
.progress-legend span { display:inline-flex; align-items:center; gap:.4rem; }
.progress-legend i { width:.65rem; height:.65rem; border-radius:50%; display:inline-block; }
.legend-signed { background:var(--navy); }
.legend-signing { background:var(--gold); }
.legend-pending { background:#b9c0c8; }
.dashboard-progress-footer { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding-top:.85rem; border-top:1px solid var(--line); font-size:.86rem; }
.dashboard-progress-footer span { color:var(--muted); }
.dashboard-progress-footer span strong { color:var(--navy); margin-left:.25rem; }
.dashboard-progress-footer a { font-weight:600; text-decoration:none; }
.user-status-visual { display:flex; align-items:center; gap:1.4rem; min-height:11rem; }
.user-status-ring { width:9rem; height:9rem; border-radius:50%; display:flex; flex-direction:column; align-items:center; justify-content:center; flex:0 0 auto; background:conic-gradient(var(--navy) calc(var(--active-pct, 0) * 1%), #dfe3e7 0); position:relative; }
.user-status-ring::after { content:""; position:absolute; inset:.7rem; border-radius:50%; background:var(--paper); }
.user-status-ring strong,.user-status-ring span { position:relative; z-index:1; }
.user-status-ring strong { color:var(--navy); font-size:1.45rem; }
.user-status-ring span { color:var(--muted); font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; }
.user-status-details { flex:1; display:grid; gap:.7rem; }
.user-status-details div { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.65rem .75rem; background:#fff; border:1px solid var(--line); border-radius:7px; }
.user-status-details span { color:var(--muted); font-size:.82rem; }
.user-status-details strong { color:var(--navy); font-size:1rem; }
.dashboard-role-list { margin:0; }
.admin-dashboard-footer { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.9rem 1rem; margin-top:1.1rem; background:rgba(255,255,255,.5); border:1px solid var(--line); border-radius:8px; color:var(--muted); font-size:.85rem; }
.admin-dashboard-footer a { font-weight:600; text-decoration:none; }
@media (max-width:1100px) { .admin-dashboard-kpis { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:900px) { .admin-dashboard-grid { grid-template-columns:1fr; } .user-status-visual { min-height:auto; } }
@media (max-width:640px) { .admin-dashboard-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); } .dashboard-progress-footer,.admin-dashboard-footer { align-items:flex-start; flex-direction:column; } .user-status-visual { align-items:stretch; flex-direction:column; } .user-status-ring { margin:0 auto; } }

/* Professional validity/error page */
.error-page { min-height:100vh; display:flex; flex-direction:column; background:var(--navy); color:var(--ink); }
.error-page .topbar { flex-shrink:0; }
.error-shell { width:min(760px,calc(100% - 2rem)); margin:auto; padding:3rem 0; }
.error-card { background:#fff; border:1px solid rgba(11,31,58,.10); border-radius:16px; padding:3rem 3.25rem; text-align:center; box-shadow:0 18px 50px rgba(11,31,58,.10); }
.error-icon { width:82px; height:82px; margin:0 auto 1.25rem; display:grid; place-items:center; border-radius:50%; background:#f5edd9; color:var(--gold); box-shadow:inset 0 0 0 1px rgba(196,163,90,.25); }
.error-icon svg { width:48px; height:48px; }
.error-badge { display:inline-flex; align-items:center; padding:.38rem .75rem; border-radius:999px; background:#f5edd9; color:var(--navy); font-size:.72rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
.error-card h1 { margin:1rem 0 .8rem; color:var(--navy); font-size:clamp(1.6rem,4vw,2.15rem); }
.error-card p { max-width:600px; margin:.7rem auto; color:var(--muted); line-height:1.65; }
.error-card .error-lead { color:var(--ink); font-size:1.02rem; font-weight:600; }
.error-info { max-width:560px; margin:1.5rem auto; padding:1rem 1.15rem; display:flex; align-items:center; gap:.9rem; text-align:left; background:#f4f1ea; border:1px solid rgba(11,31,58,.10); border-radius:10px; }
.error-lock { width:38px; height:38px; flex:0 0 auto; display:grid; place-items:center; border-radius:8px; background:#e8edf5; color:var(--navy-2); }
.error-lock svg { width:22px; height:22px; }
.error-info div { display:grid; gap:.15rem; }
.error-info strong { color:var(--navy); font-size:.9rem; }
.error-info span { color:var(--muted); font-size:.8rem; }
.error-help { font-size:.85rem; }
.error-button { margin-top:.8rem; min-width:190px; }
.error-page footer { padding:1.25rem; text-align:center; color:var(--muted); font-size:.78rem; }
@media (max-width:640px) { .error-shell { padding:1.5rem 0; } .error-card { padding:2rem 1.25rem; border-radius:12px; } .error-info { text-align:left; } }

/* Charter version history */
.charter-card-badges { display:flex; align-items:center; justify-content:flex-end; gap:.45rem; flex-wrap:wrap; }
.charter-active-badge { display:inline-flex; align-items:center; gap:.35rem; padding:.32rem .65rem; border-radius:999px; background:#e8f0e8; color:#285b3b; font-size:.7rem; font-weight:800; letter-spacing:.03em; text-transform:uppercase; }
.charter-active-badge::before { content:""; width:.42rem; height:.42rem; border-radius:50%; background:#3f7a50; }
.charter-card-active { border-color:rgba(196,163,90,.55); box-shadow:0 12px 32px rgba(11,31,58,.10), inset 3px 0 0 var(--gold); }
.charter-active-kpi { border-color:rgba(196,163,90,.35); }
.section-subtitle { color:var(--muted); font-size:.84rem; margin:.3rem 0 0; max-width:680px; line-height:1.5; }
@media (max-width:640px) { .charter-card-badges { justify-content:flex-start; margin-top:.5rem; } }

.confirmation-card { max-width:760px; margin:2rem auto; text-align:center; padding:2.5rem; }
.confirmation-icon { width:64px; height:64px; margin:0 auto 1rem; display:grid; place-items:center; border-radius:50%; background:#f5edd9; color:var(--gold); font-size:2rem; font-weight:800; }
.confirmation-card h2 { color:var(--navy); margin:.5rem 0 .75rem; }
.confirmation-card > p { max-width:620px; margin:0 auto 1.5rem; color:var(--muted); line-height:1.6; }
.confirmation-card .actions { justify-content:center; }


/* Archived charters */
.section-heading-actions { display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; justify-content:flex-end; }
.archived-group { margin:1.4rem 0; }
.archived-group-header { display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; margin-bottom:.7rem; padding-bottom:.65rem; border-bottom:1px solid var(--line); }
.archived-group-header h2 { margin:0; }
.archived-group-count { color:var(--muted); font-size:.8rem; white-space:nowrap; }
.archived-version-card { display:flex; align-items:center; justify-content:space-between; gap:1.2rem; background:#fff; border:1px solid var(--line); border-radius:10px; padding:1.1rem 1.15rem; margin:.7rem 0; border-left:3px solid #9aa3ad; }
.archived-version-main { min-width:0; flex:1; }
.archived-version-heading { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.archived-version-heading h3 { margin:.1rem 0 .2rem; font-size:1.05rem; }
.archived-version-description { margin:.45rem 0 .8rem; color:var(--muted); font-size:.85rem; }
.archived-version-meta { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.65rem; }
.archived-version-meta span { display:flex; flex-direction:column; gap:.12rem; }
.archived-version-meta small { color:var(--muted); font-size:.68rem; text-transform:uppercase; letter-spacing:.04em; }
.archived-version-meta strong { color:var(--navy); font-size:.82rem; }
.archived-version-meta em { color:var(--muted); font-style:normal; font-weight:500; }
.archived-version-card .charter-progress { margin:.8rem 0 .45rem; }
.archived-version-actions { display:flex; align-items:center; gap:.45rem; flex-wrap:wrap; flex:0 0 auto; justify-content:flex-end; }
@media (max-width:900px) { .archived-version-card { align-items:stretch; flex-direction:column; } .archived-version-actions { justify-content:flex-start; } .archived-version-meta { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:640px) { .section-heading-actions { width:100%; justify-content:flex-start; } .archived-group-header { align-items:flex-start; flex-direction:column; } .archived-version-meta { grid-template-columns:1fr 1fr; } .archived-version-heading { align-items:flex-start; flex-direction:column; } }

/* Professional health page */
.health-page { min-height:100vh; display:flex; flex-direction:column; background:var(--navy); color:var(--ink); }
.health-page .topbar { flex-shrink:0; }
.health-shell { width:min(980px,calc(100% - 2rem)); margin:auto; padding:2.5rem 0; }
.health-card { background:var(--paper); border-radius:16px; box-shadow:0 22px 60px rgba(0,0,0,.22); overflow:hidden; }
.health-header { display:flex; align-items:center; justify-content:space-between; gap:2rem; padding:2rem 2.25rem; border-bottom:1px solid var(--line); }
.health-header h1 { margin:0 0 .35rem; }
.health-lead { margin:.2rem 0 0; color:var(--muted); }
.health-overall { display:flex; align-items:center; gap:.7rem; min-width:220px; padding:.8rem 1rem; border-radius:10px; border:1px solid var(--line); background:#fff; }
.health-overall > div { display:grid; gap:.15rem; }
.health-overall strong { color:var(--navy); font-size:.9rem; }
.health-overall small { color:var(--muted); font-size:.7rem; }
.health-status-dot { width:.75rem; height:.75rem; border-radius:50%; flex:0 0 auto; }
.health-ok .health-status-dot { background:#3f7a50; box-shadow:0 0 0 5px rgba(63,122,80,.12); }
.health-warning .health-status-dot { background:var(--gold); box-shadow:0 0 0 5px rgba(196,163,90,.15); }
.health-checks { display:grid; gap:.7rem; padding:1.25rem 2.25rem; }
.health-check { display:flex; align-items:center; gap:1rem; padding:1rem 1.05rem; background:#fff; border:1px solid var(--line); border-radius:10px; }
.health-check-icon { width:2.15rem; height:2.15rem; display:grid; place-items:center; flex:0 0 auto; border-radius:50%; font-weight:800; }
.check-ok .health-check-icon { background:#e8f0e8; color:#285b3b; }
.check-warning .health-check-icon { background:#f5edd9; color:#8a6b21; }
.health-check-main { display:grid; gap:.18rem; flex:1; min-width:0; }
.health-check-main strong { color:var(--navy); font-size:.92rem; }
.health-check-main span { color:var(--muted); font-size:.78rem; }
.health-badge { padding:.32rem .65rem; border-radius:999px; background:#e8f0e8; color:#285b3b; font-size:.7rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.check-warning .health-badge { background:#f5edd9; color:#8a6b21; }
.health-footer { display:flex; align-items:center; gap:1.5rem; padding:1rem 2.25rem; border-top:1px solid var(--line); background:rgba(255,255,255,.42); }
.health-footer > div { display:grid; gap:.12rem; }
.health-footer > div span { color:var(--muted); font-size:.68rem; text-transform:uppercase; letter-spacing:.05em; }
.health-footer > div strong { color:var(--navy); font-size:.8rem; }
.health-footer a { margin-left:auto; }
.health-page footer { padding:1.25rem; text-align:center; color:#b8c0cc; font-size:.78rem; }
@media (max-width:700px) { .health-header { align-items:flex-start; flex-direction:column; padding:1.5rem; } .health-overall { width:100%; min-width:0; } .health-checks { padding:1rem 1.5rem; } .health-footer { align-items:flex-start; flex-direction:column; padding:1rem 1.5rem; } .health-footer a { margin-left:0; width:100%; } }

/* Charter deletion controls */
.button-danger { background:#8b2f2f !important; color:#fff !important; border-color:#8b2f2f !important; }
.button-danger:hover { background:#722525 !important; border-color:#722525 !important; }
.confirmation-danger { background:#f8e7e7; color:#8b2f2f; }
.confirmation-warning { margin:1rem auto; padding:.9rem 1rem; max-width:620px; text-align:left; background:#fff5e5; border:1px solid rgba(196,163,90,.45); border-radius:10px; color:#5f4b24; line-height:1.55; }
.confirmation-summary { display:flex; justify-content:center; gap:1rem; flex-wrap:wrap; margin:1.2rem 0; }
.confirmation-summary span { padding:.65rem .9rem; background:#f4f1ea; border:1px solid var(--line); border-radius:8px; color:var(--muted); font-size:.82rem; }
.confirmation-summary strong { color:var(--navy); margin-right:.25rem; }


/* Assignment tracking collaborator cell */
.assignment-collaborator { display:flex; flex-direction:column; gap:.2rem; min-width:12rem; }
.assignment-collaborator strong { color:var(--navy); line-height:1.3; overflow-wrap:anywhere; }
.assignment-collaborator small { color:var(--muted); font-size:.76rem; line-height:1.3; overflow-wrap:anywhere; }

/* Signature link bulk actions */
.bulk-actions { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1rem; padding:1rem 1.1rem; background:#f7f5ef; border:1px solid var(--line); border-radius:12px; }
.bulk-actions > div { display:flex; flex-direction:column; gap:.25rem; }
.bulk-actions strong { color:var(--navy); }
.bulk-actions span { color:var(--muted); font-size:.82rem; line-height:1.45; }
.bulk-actions button:disabled { opacity:.55; cursor:not-allowed; }
.signing-link-checkbox, #selectAllSigningLinks { width:1rem; height:1rem; accent-color:var(--navy); }
@media (max-width:760px) { .bulk-actions { align-items:flex-start; flex-direction:column; } .bulk-actions button { width:100%; } }