:root{--night:#0B1526;--tech:#17365D;--gold:#C99428;--gold-light:#E2B95A;--silver:#B8BDC7;--bg:#F4F6F9;--text:#202938;--muted:#5D6675;--white:#fff}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif}h1,h2,h3,.brand{font-family:Manrope,Arial,sans-serif}.app-shell{display:flex;min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:248px;padding:24px 16px;background:linear-gradient(180deg,var(--night),#101e33);color:#fff;z-index:20}.brand{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none;font-size:22px;font-weight:700;margin:0 10px 28px}.brand-mark{display:inline-grid;place-items:center;width:38px;height:38px;border:1px solid var(--gold);color:var(--gold);font-family:Manrope;font-weight:700;border-radius:10px}.sidebar .nav-link{color:#bfc8d5;border-radius:8px;padding:10px 12px;margin:2px 0;font-size:14px}.sidebar .nav-link:hover,.sidebar .nav-link.active{color:#fff;background:#ffffff12;border-left:2px solid var(--gold)}.main-column{min-width:0;flex:1;margin-left:248px;display:flex;flex-direction:column}.topbar{height:72px;background:#fff;border-bottom:1px solid #e4e7ec;display:flex;align-items:center;justify-content:space-between;padding:0 28px;position:sticky;top:0;z-index:10}.user-menu{display:flex;align-items:center;gap:14px}.user-menu small{display:block;color:var(--muted);font-size:11px}.user-menu form,.actions form,.notification-list form{display:inline-flex;margin:0}.notification-link{color:var(--text);text-decoration:none;font-size:13px}.content{padding:28px;flex:1}.footer{padding:18px 28px;border-top:1px solid #e0e3e8;color:var(--muted);font-size:12px}.breadcrumb-line{font-size:12px;color:var(--muted);margin-bottom:18px}.page-heading{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:22px}.page-heading h1{margin:0;font-size:30px}.eyebrow{font-size:11px;letter-spacing:.16em;color:var(--gold);font-weight:700;margin-bottom:6px}.btn-gold{background:var(--gold);border-color:var(--gold);color:var(--night);font-weight:600}.btn-gold:hover{background:var(--gold-light);border-color:var(--gold-light)}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.metric-card,.panel{background:#fff;border:1px solid #e1e5ea;border-radius:12px;box-shadow:0 4px 16px #0b152608}.metric-card{padding:20px;border-top:3px solid var(--tech)}.metric-card span{display:block;color:var(--muted);font-size:13px}.metric-card strong{display:block;font:700 32px Manrope;margin-top:10px}.panel{padding:22px}.panel h2{font-size:17px;margin-bottom:18px}.table{font-size:13px}.table th{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.05em}.empty{text-align:center;color:var(--muted);padding:28px!important}.activity-list>div{padding:11px 0;border-bottom:1px solid #edf0f3}.activity-list span{display:block;color:var(--muted);font-size:12px}.status{display:inline-block;padding:4px 8px;background:#edf1f5;border-radius:999px;font-size:11px;text-transform:capitalize}.status-activo{background:#e4f6ec;color:#126239}.status-invitado{background:#fff4d7;color:#755200}.status-suspendido,.status-inactivo{background:#eceff2;color:#57606b}.status-bloqueado{background:#fde7e7;color:#8b2020}.filter-bar{display:flex;gap:10px;margin-bottom:20px}.filter-bar .form-control{flex:2}.filter-bar .form-select{flex:1}.actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.pagination-line{display:flex;justify-content:space-between;align-items:center}.card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.role-card{display:flex;flex-direction:column;justify-content:space-between;min-height:230px}.role-card h2{margin:12px 0 6px}.role-stats{display:flex;gap:24px;margin:15px 0}.role-stats strong{font-size:20px}.role-option{padding:12px;border:1px solid #e0e4e8;border-radius:8px}.role-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.permission-matrix{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.permission-matrix fieldset{border:1px solid #e0e4e8;border-radius:10px;padding:14px}.permission-matrix legend{float:none;width:auto;font:600 14px Manrope}.permission-matrix label{display:block;padding:6px 0}.permission-matrix small{display:block;color:var(--muted);margin-left:20px}.empty-module{text-align:center;padding:70px 20px}.empty-module .brand-mark{margin:auto}.empty-module h1{margin:18px 0 6px}.notification-list article{display:flex;justify-content:space-between;gap:20px;padding:18px 0;border-bottom:1px solid #e6e9ed}.notification-list article.read{opacity:.65}.notification-list h2{margin:8px 0 4px}.auth-body{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at top right,#17365D,#0B1526 55%);padding:24px}.auth-card{width:min(440px,100%);background:#fff;border-radius:16px;padding:36px;box-shadow:0 28px 70px #0005}.auth-brand{display:flex;align-items:center;gap:12px;margin-bottom:28px}.auth-brand strong{font:700 20px Manrope}.auth-brand small{display:block;color:var(--muted)}.auth-card h1{font-size:28px}.auth-link{display:block;text-align:center;margin-top:20px;color:var(--tech)}.error-page{min-height:100vh;display:grid;place-items:center;background:var(--night);color:#fff;text-align:center}.error-page strong{font:700 80px Manrope;color:var(--gold)}.error-page a{color:var(--gold-light)}@media(max-width:1100px){.metric-grid{grid-template-columns:repeat(2,1fr)}.card-grid{grid-template-columns:repeat(2,1fr)}.permission-matrix{grid-template-columns:repeat(2,1fr)}}@media(max-width:991px){.sidebar{transform:translateX(-100%);transition:.2s}.sidebar.open{transform:none}.main-column{margin-left:0}.company-selector{display:none}.content{padding:20px}.user-menu>div{display:none}}@media(max-width:640px){.metric-grid,.card-grid,.permission-matrix,.role-grid{grid-template-columns:1fr}.metric-grid{gap:10px}.topbar{padding:0 14px}.notification-link{font-size:0}.notification-link .badge{font-size:11px}.filter-bar{flex-direction:column}.page-heading{align-items:flex-start;gap:14px;flex-direction:column}.panel{padding:16px}.auth-card{padding:25px}.content{padding:14px}.actions{min-width:220px}}

