:root { --brand:#245f9e; --brand-dark:#184772; --ink:#172334; --muted:#65758b; --line:#e5eaf0; --surface:#fff; --canvas:#f4f7fa; --success:#1e8b5b; }
html { font-size: 15px; }
body { margin:0; color:var(--ink); background:var(--canvas); font-family:"Segoe UI",system-ui,-apple-system,sans-serif; }
*,*::before,*::after{box-sizing:border-box}
a { color:var(--brand); }
.app-shell { min-height:100vh; display:grid; grid-template-columns:240px 1fr; }
.sidebar { position:sticky; top:0; height:100vh; padding:28px 20px; display:flex; flex-direction:column; color:#dce8f5; background:linear-gradient(165deg,#173e68,#102b49); }
.brand { display:flex; align-items:center; gap:12px; text-decoration:none; color:inherit; }
.brand:hover { color:inherit; }
.brand-mark { width:42px; height:42px; display:grid; place-items:center; border-radius:12px; color:white; font-weight:800; background:linear-gradient(145deg,#3b8bd1,#1f5d98); box-shadow:0 8px 22px #061b2f66; }
.brand strong,.brand small { display:block; }.brand strong{font-size:1.05rem}.brand small{font-size:.76rem;color:#aac4de;letter-spacing:.05em;text-transform:uppercase}
.side-nav { margin-top:42px; display:grid; gap:6px; }.side-nav a,.side-nav span{padding:11px 13px;border-radius:9px;color:#dce8f5;text-decoration:none}.side-nav a:hover{background:#ffffff15}.side-nav span{color:#829cb7;cursor:not-allowed}
.logout { margin-top:auto; padding-top:18px; border-top:1px solid #ffffff18; display:grid; gap:8px; }.logout span{font-size:.86rem;overflow:hidden;text-overflow:ellipsis}.logout button{padding:8px 10px;border:1px solid #ffffff28;border-radius:8px;color:white;background:transparent;text-align:left}.logout button:hover{background:#ffffff12}
.content { min-width:0; padding:38px clamp(24px,4vw,64px); }.anonymous-shell{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 20% 10%,#dcecff,transparent 36%),var(--canvas)}
.page-header { margin-bottom:24px; display:flex; justify-content:space-between; align-items:end; gap:20px; }.page-header h1{margin:3px 0 0;font-size:2rem;font-weight:750}.eyebrow{color:var(--brand);font-size:.75rem;font-weight:750;letter-spacing:.11em;text-transform:uppercase}
.status-pill{padding:7px 11px;border:1px solid #cbe9dc;border-radius:999px;background:#ecfaf4;color:#176d49;font-size:.82rem}.status-pill i{display:inline-block;width:7px;height:7px;margin-right:6px;border-radius:50%;background:#23a36a}
.metrics { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:16px; margin-bottom:24px; }.metrics article,.panel{border:1px solid var(--line);border-radius:14px;background:var(--surface);box-shadow:0 8px 28px #24384d0a}.metrics article{padding:21px}.metrics span{display:block;color:var(--muted);font-size:.84rem}.metrics strong{display:block;margin-top:9px;font-size:1.85rem}
.panel{padding:26px}.welcome-panel{background:linear-gradient(120deg,#fff 55%,#edf5fd)}.welcome-panel h2{margin:8px 0}.welcome-panel p{max-width:680px;color:var(--muted)}
.btn{display:inline-block;border:1px solid transparent;border-radius:9px;font-weight:650;padding:.62rem 1rem;text-decoration:none;cursor:pointer}.btn-primary{color:white;border-color:var(--brand);background:var(--brand)}.btn-primary:hover{color:white;border-color:var(--brand-dark);background:var(--brand-dark)}.btn-light{color:var(--ink);border-color:var(--line);background:#f7f9fb}.btn-danger{color:white;background:#b42332}.w-100{width:100%}.mt-3{margin-top:1rem}.mt-4{margin-top:1.5rem}
.login-card{width:min(440px,100%);padding:34px;border:1px solid var(--line);border-radius:18px;background:white;box-shadow:0 24px 70px #19355020}.login-brand{margin-bottom:34px;color:var(--ink)}.login-copy h1{margin:5px 0}.login-copy p,.login-note{color:var(--muted)}.login-note{margin:25px 0 0;text-align:center;font-size:.82rem}
.form-control{min-height:44px;border-color:#d6dde6;border-radius:9px}.form-control:focus{border-color:#6ea4d8;box-shadow:0 0 0 .2rem #2f75b522}.form-label{font-weight:650}.field-validation,.validation-summary{color:#b42332;font-size:.84rem}.validation-summary ul{padding-left:20px}
.table-panel{padding:0;overflow:hidden}.table-responsive{overflow-x:auto}.table{width:100%;margin:0;border-collapse:collapse}.table th{padding:14px 18px;border-bottom:1px solid var(--line);color:var(--muted);font-size:.76rem;text-align:left;text-transform:uppercase;letter-spacing:.05em}.table td{padding:17px 18px;border-bottom:1px solid #eef1f5}.actions{white-space:nowrap}.actions>a,.actions button{border:0;background:none;color:var(--brand);font-weight:650;text-decoration:none}.actions form{display:inline}.permission-count{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#eaf3fc;color:var(--brand);font-weight:750}.empty-state{text-align:center;padding:60px 20px}.empty-state p{color:var(--muted)}
.badge{display:inline-block;padding:5px 8px;border-radius:999px;font-size:.75rem;font-weight:700}.text-bg-danger{color:#8d1d2a;background:#fdecef}.text-bg-secondary{color:#566476;background:#eef1f5}.text-bg-success{color:#176d49;background:#e9f8f1}.d-block{display:block}.text-secondary{color:var(--muted)}.alert{margin-bottom:18px;padding:12px 15px;border-radius:9px}.alert-success{color:#176d49;border:1px solid #cbe9dc;background:#ecfaf4}
.remote-id{font-variant-numeric:tabular-nums;letter-spacing:.06em}.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.detail-grid div{min-width:0}.detail-grid span,.detail-grid strong{display:block}.detail-grid span{margin-bottom:6px;color:var(--muted);font-size:.8rem}.detail-grid strong{overflow-wrap:anywhere}
.form-panel{max-width:850px}.form-panel.compact{max-width:580px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.form-grid .full{grid-column:1/-1}.form-grid small{display:block;margin-top:6px;color:var(--muted)}.permissions{margin-top:28px;padding:20px;border:1px solid var(--line);border-radius:12px}.permissions legend{float:none;width:auto;padding:0 6px;font-size:.95rem;font-weight:700}.permissions label,.toggles label{display:flex;align-items:center;gap:9px;margin:10px 0}.permissions input,.toggles input{width:17px;height:17px;accent-color:var(--brand)}.toggles{display:flex;gap:30px;margin-top:22px}.form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:26px}
@media (max-width:800px){.app-shell{grid-template-columns:1fr}.sidebar{position:static;height:auto}.side-nav{margin-top:20px;grid-template-columns:repeat(2,1fr)}.logout{margin-top:20px}.content{padding:24px 16px}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.page-header{align-items:flex-start;flex-direction:column}.metrics{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.metrics,.detail-grid{grid-template-columns:1fr}.panel,.login-card{padding:22px}.toggles{display:block}}