/* Login / setup / admin / account pages and the user bar. On design tokens since 1.5.0 (stage 5). */
body.auth-page{margin:0;background:var(--color-bg);color:var(--color-ink);font-family:var(--font-family-base);line-height:1.5;min-height:100vh;border-top:6px solid var(--color-primary)}
.auth-page .card{max-width:420px;margin:48px auto;background:var(--color-surface);border:1px solid var(--color-line);border-top:4px solid var(--color-accent);border-radius:12px;padding:28px;box-shadow:var(--shadow-1)}
.auth-page.wide .card{max-width:960px;margin:24px auto}
.auth-page .card.admin{max-width:1180px}
.auth-page h1{margin:0 0 6px;font-size:1.5rem;color:var(--color-primary)}
.auth-page h2{font-size:1.1rem;color:var(--color-primary);margin:22px 0 8px}
.auth-page .toprow{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px}
.auth-page .brand{font-weight:700;color:var(--color-primary);letter-spacing:.02em}
.auth-page .muted{color:var(--color-muted);margin:.25em 0 1em}
.auth-page label{display:block;margin:14px 0 0;font-weight:600;font-size:.95rem}
.auth-page input,.auth-page select{display:block;width:100%;box-sizing:border-box;margin-top:6px;padding:12px;font:inherit;border:1px solid var(--color-line);border-radius:8px;background:var(--color-surface);color:var(--color-ink)}
.auth-page input:focus,.auth-page select:focus,.auth-page button:focus-visible,.auth-page a:focus-visible{outline:3px solid var(--color-focus);outline-offset:1px}
.auth-page button,.auth-page .pill{font:inherit;cursor:pointer;border-radius:8px;border:1px solid var(--color-primary);background:var(--color-surface);color:var(--color-primary);padding:9px 14px;text-decoration:none;display:inline-block}
.auth-page button.primary,.auth-page .pill.primary{background:var(--color-primary);color:var(--color-primary-ink);border-color:var(--color-primary);margin-top:18px;padding:12px 20px;font-weight:700;width:100%}
.auth-page .wide button.primary{width:auto}
.auth-page button:disabled{opacity:.5;cursor:not-allowed}
.auth-page button.danger{border-color:var(--color-danger);color:var(--color-danger)}
.auth-page .alert{background:var(--color-danger-bg);border:1px solid var(--color-danger-line);color:var(--color-danger);padding:10px 12px;border-radius:8px;margin:14px 0 0}
.auth-page .okmsg{background:var(--color-success-bg);border:1px solid var(--color-success-line);color:var(--color-success);padding:10px 12px;border-radius:8px;margin:14px 0 0}
.checks{list-style:none;padding:0;margin:0}.checks li{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--color-line-soft)}
.checks .ok b{color:var(--color-success)}.checks .bad b{color:var(--color-danger)}
/* user bar (public/client pages; hidden inside the private chrome) */
.userbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;background:var(--color-primary);color:var(--color-primary-ink);padding:8px 18px;border-bottom:3px solid var(--color-accent);font-family:var(--font-family-base);font-size:.92rem}
.userbar i{font-style:normal;background:var(--color-accent);color:#1C1C1C;/* guardrail-ok: dark text on the gold accent passes AA in every theme (accent is always a light gold) */border-radius:999px;padding:1px 9px;font-size:.78rem;margin-inline-start:6px}
.userbar .ub-nav{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.userbar a,.userbar button{color:var(--color-primary-ink);background:transparent;border:1px solid color-mix(in srgb,var(--color-primary-ink) 45%,transparent);border-radius:8px;padding:5px 12px;text-decoration:none;font:inherit;cursor:pointer}
.userbar a:hover,.userbar button:hover{background:color-mix(in srgb,var(--color-primary-ink) 14%,transparent)}
.userbar form{margin:0}
@media print{.userbar{display:none}}
/* admin */
.matrix-wrap{overflow-x:auto;margin-top:8px;border:1px solid var(--color-line);border-radius:10px}
table.matrix{border-collapse:collapse;width:100%;background:var(--color-surface)}
table.matrix th,table.matrix td{padding:8px 7px;border-bottom:1px solid var(--color-line);vertical-align:middle;text-align:start}
table.matrix thead th{background:var(--color-primary);color:var(--color-primary-ink);font-weight:600;font-size:.88rem;white-space:nowrap}
table.matrix thead th.toolh{text-align:center;border-inline-start:1px solid color-mix(in srgb,var(--color-primary-ink) 25%,transparent)}
table.matrix thead tr.sub th{background:var(--color-primary-deep);font-size:.78rem;font-weight:500}
table.matrix td.chk{text-align:center;border-inline-start:1px solid var(--color-line)}
table.matrix td.chk input{width:22px;height:22px;margin:0;display:inline-block;accent-color:var(--color-primary)}
table.matrix tr.dirty td{background:var(--color-accent-soft)}
table.matrix tr.off td{opacity:.62}
.uname{font-weight:700}.uname small{display:block;font-weight:400;color:var(--color-muted);direction:ltr;text-align:start}
.badge{display:inline-block;border-radius:999px;padding:1px 9px;font-size:.78rem;border:1px solid var(--color-primary);color:var(--color-primary)}
.badge.gold{background:var(--color-accent);border-color:var(--color-accent);color:#1C1C1C;/* guardrail-ok: dark text on the gold accent passes AA in every theme */}
.badge.grey{border-color:var(--color-line);color:var(--color-muted)}
.rowact{display:flex;gap:6px;flex-wrap:wrap}.rowact button{padding:6px 10px;font-size:.85rem}
.addform{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;align-items:end;margin-top:8px}
.addform button.primary{margin:0;width:auto}
.hint{font-size:.85rem;color:var(--color-muted)}
.flash{position:sticky;top:8px;z-index:5}
.cma-saved{margin:0 0 14px;background:var(--color-surface);border:1px solid var(--color-line);border-inline-start:4px solid var(--color-accent);border-radius:10px;padding:12px 14px}
@media (max-width:640px){.auth-page .card{margin:16px 10px;padding:18px}}
table.matrix select{width:auto;min-width:104px;margin:0;padding:8px}
.rowact button{white-space:nowrap}.rowact{flex-direction:row;margin-top:8px}.slot{min-width:210px}table.matrix .hint{display:block;white-space:nowrap}
.rowact button.primary{width:auto;margin:0;padding:6px 12px}.rolerow{display:flex;gap:8px;align-items:center;margin:6px 0}.slot{min-width:250px}