:root{
  --bg:#14110d; --panel:#1c1810; --borde:#3a3226; --borde-oro:#4a3e26;
  --texto:#cdbf9e; --texto-fuerte:#e4d4a8; --oro:#c9a24b; --apagado:#8a7752;
  --verde:#9dc47f; --ambar:#d0a860; --rojo:#d68a78;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--texto);font-family:'EB Garamond',serif;font-size:17px}
a{color:var(--oro);text-decoration:none}
.titulo{font-family:'Cinzel',serif;color:var(--texto-fuerte)}
.topbar{display:flex;align-items:center;gap:14px;padding:12px 18px;
  background:linear-gradient(#211c14,#14110d);border-bottom:1px solid var(--borde-oro)}
.marca{font-family:'Cinzel',serif;color:var(--oro);font-size:17px;letter-spacing:.06em;flex:1}
.marca small{display:block;font-family:'EB Garamond';color:var(--apagado);font-size:11px;letter-spacing:.15em;text-transform:uppercase}
.whoami{text-align:right;font-size:13px}.whoami b{display:block;color:var(--texto-fuerte);font-family:'Cinzel'}
.hamburguesa{display:none;background:none;border:1px solid var(--borde-oro);color:var(--oro);font-size:18px;border-radius:4px;cursor:pointer;padding:4px 10px}
.layout{display:flex;min-height:calc(100vh - 56px)}
.nav{width:200px;border-right:1px solid var(--borde);padding:12px 0;flex-shrink:0}
.nav a{display:block;padding:11px 20px;color:#b7a878;border-left:3px solid transparent}
.nav a.active{color:var(--texto-fuerte);background:var(--panel);border-left-color:var(--oro)}
.main{flex:1;padding:20px 24px;max-width:1000px}
.main-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;flex-wrap:wrap;gap:10px}
.panel{background:var(--panel);border:1px solid var(--borde);border-radius:8px;padding:20px;margin-bottom:16px}
.btn{display:inline-block;padding:9px 16px;border:1px solid var(--oro);color:var(--oro);background:transparent;border-radius:4px;cursor:pointer;font-size:14px;letter-spacing:.05em;text-transform:uppercase;font-family:'EB Garamond'}
.btn-oro{background:var(--oro);color:var(--bg);font-weight:700}
.btn-peligro{border-color:var(--rojo);color:var(--rojo)}
table{width:100%;border-collapse:collapse}
th{text-align:left;color:var(--apagado);font-size:11px;letter-spacing:.1em;text-transform:uppercase;padding:8px 10px;border-bottom:1px solid var(--borde)}
td{padding:10px;border-bottom:1px solid #221d15}
td b,.nombre{color:var(--texto-fuerte);font-family:'Cinzel';font-weight:500}
.tag{font-size:11px;padding:3px 9px;border-radius:3px}
.tag.ciudadano{background:#20301c;border:1px solid #4a6a3a;color:var(--verde)}
.tag.visitante{background:#2e2416;border:1px solid #6a5330;color:var(--ambar)}
.tag.buscado,.tag.desterrado{background:#331c18;border:1px solid #7a3f34;color:var(--rojo)}
.tag.vigilado{background:#2e2416;border:1px solid #6a5330;color:var(--ambar)}
label{display:block;margin:12px 0;color:var(--texto)}
input,select,textarea{width:100%;margin-top:5px;padding:9px 11px;background:#0f0c08;border:1px solid var(--borde);border-radius:4px;color:var(--texto-fuerte);font-family:'EB Garamond';font-size:16px}
.flash{padding:10px 16px;border-radius:4px;margin-bottom:14px}
.flash-ok{background:#20301c;border:1px solid #4a6a3a;color:var(--verde)}
.flash-error{background:#331c18;border:1px solid #7a3f34;color:var(--rojo)}
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}
.login{width:340px;max-width:100%}
.permisos-grid{display:grid;gap:8px;margin:12px 0}
.permisos-grid label{display:flex;align-items:center;gap:10px;margin:0}
.permisos-grid input{width:auto;margin:0}
@media(max-width:720px){
  .hamburguesa{display:block}
  .nav{position:fixed;top:56px;left:-220px;bottom:0;background:var(--bg);transition:left .2s;z-index:10}
  body.nav-abierta .nav{left:0}
  .main{padding:16px}
  table thead{display:none}
  table tr{display:block;border:1px solid var(--borde);border-radius:6px;margin-bottom:10px;padding:8px}
  table td{display:flex;justify-content:space-between;border:none;padding:6px 8px}
  table td::before{content:attr(data-th);color:var(--apagado);font-size:11px;text-transform:uppercase}
}