:root{--ink:#142c3c;--muted:#526876;--navy:#102e40;--green:#006957;--light:#e6f4ed;--line:#d7e1e6;--bg:#f3f6f8;--warn:#fff4e5;--warnInk:#8a4b00;--err:#fdecec;--errInk:#9b1c1c;--ok:#e6f4ed;--okInk:#0b5d4a}
*{box-sizing:border-box}
body{margin:0;font:16px/1.6 system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg)}
a{color:var(--green);text-underline-offset:3px}
h1,h2,h3,h4{line-height:1.25;color:var(--navy);margin:0 0 .5em}
h1{font-size:1.7rem}h2{font-size:1.35rem;margin-top:1.4em}h3{font-size:1.1rem}
p{margin:.4em 0 .9em}
code{background:#eef2f5;padding:1px 5px;border-radius:4px;font-size:.92em}
.small{font-size:.9rem}.muted{color:var(--muted)}
button,input,select,textarea{font:inherit;color:inherit}
button,.btn{cursor:pointer;border:1px solid var(--line);border-radius:8px;background:#fff;padding:8px 14px;text-decoration:none;display:inline-block;line-height:1.3}
button.primary,.btn.primary{background:var(--green);color:#fff;border-color:var(--green)}
button.danger,.btn.danger{background:#fff;color:var(--errInk);border-color:#e3a6a6}
button:hover,.btn:hover{filter:brightness(.96)}
button[disabled]{opacity:.5;cursor:not-allowed}
input[type=text],input[type=email],input[type=password],input[type=date],input[type=number],input[type=search],select,textarea{width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:8px;background:#fff}
textarea{min-height:90px}
label{display:block;font-weight:600;margin:.8em 0 .25em;font-size:.95rem}
label.inline{display:inline-flex;gap:.5em;align-items:center;font-weight:500;margin:.3em 0}
form.inline{display:inline}
.topbar{background:var(--navy);color:#fff;padding:0 20px}
.topbar .wrap{max-width:1180px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;min-height:58px;gap:16px;flex-wrap:wrap}
.topbar a{color:#fff;text-decoration:none;opacity:.9}
.topbar a:hover,.topbar a.active{opacity:1;text-decoration:underline}
.topbar .brand{font-weight:700;letter-spacing:.2px;font-size:1.05rem}
.topbar nav{display:flex;gap:18px;flex-wrap:wrap;align-items:center}
.topbar button{background:transparent;color:#fff;border-color:rgba(255,255,255,.35);padding:5px 10px}
.page{max-width:1180px;margin:0 auto;padding:24px 20px 60px}
.auth{max-width:440px;margin:40px auto;padding:0 16px}
.card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:18px 20px;margin:14px 0}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.stat{font-size:1.9rem;font-weight:700;color:var(--green)}
.flash{padding:12px 16px;border-radius:10px;margin:10px 0;border:1px solid transparent}
.flash.success{background:var(--ok);color:var(--okInk)}.flash.error{background:var(--err);color:var(--errInk)}.flash.warning{background:var(--warn);color:var(--warnInk)}.flash.info{background:#e8f1fa;color:#143a5c}
.pill{display:inline-block;padding:2px 10px;border-radius:999px;font-size:.8rem;font-weight:600;background:#eef2f5;color:var(--muted);vertical-align:middle}
.pill.active,.pill.valid,.pill.approved,.pill.provisioned{background:var(--ok);color:var(--okInk)}
.pill.expired,.pill.rejected,.pill.revoked,.pill.cancelled,.pill.disabled{background:var(--err);color:var(--errInk)}
.pill.suspended,.pill.pending,.pill.invited,.pill.requested,.pill.not_started,.pill.in_progress{background:var(--warn);color:var(--warnInk)}
.tableWrap{overflow:auto;border:1px solid var(--line);border-radius:10px;background:#fff}
table{width:100%;border-collapse:collapse;font-size:.93rem}
th,td{text-align:left;padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:top}
th{background:var(--light);font-weight:600}
tr:last-child td{border-bottom:0}
.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
details{border:1px solid var(--line);border-radius:10px;padding:10px 14px;background:#fff;margin:8px 0}
summary{cursor:pointer;font-weight:600}
.callout{background:var(--light);border-left:4px solid var(--green);padding:12px 16px;border-radius:8px;margin:12px 0}
.progressbar{height:8px;background:#e3e9ee;border-radius:999px;overflow:hidden}
.progressbar span{display:block;height:100%;background:var(--green)}
footer.site{color:var(--muted);font-size:.85rem;text-align:center;padding:30px 20px}
@media (max-width:640px){.page{padding:16px 14px 50px}th,td{padding:7px 8px}}
