:root{--papel:#EDEEEA;--papel-2:#F6F7F4;--tinta:#16191A;--tinta-2:#4A5150;--acero:#9AA0A0;--linea:#CFD3CE;--senal:#0E6B63;--senal-claro:#DCEBE8;--alerta:#8A4B10;--alerta-claro:#F5E9DC;--error:#8C2F2F;--error-claro:#F6E4E4}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--papel);color:var(--tinta);font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:14px;line-height:1.5}
a{color:var(--senal)}
.barra{display:flex;align-items:center;gap:16px;padding:8px 16px;background:#fff;border-bottom:1px solid var(--linea);height:48px}
.barra .marca{margin:0;font-weight:600;font-size:14px;white-space:nowrap}
.barra nav{display:flex;gap:4px;flex-wrap:wrap}
.barra nav a{padding:4px 9px;border-radius:5px;text-decoration:none;color:var(--tinta-2);font-size:13px}
.barra nav a:hover,.barra nav a.act{background:var(--senal-claro);color:var(--senal)}
.barra .quien{margin-left:auto;font-size:12px;color:var(--tinta-2);white-space:nowrap}
.cuerpo{display:grid;grid-template-columns:300px 1fr;height:calc(100% - 48px)}
.lado{background:var(--papel-2);border-right:1px solid var(--linea);overflow:auto;padding:10px}
.lado input.filtro{width:100%;padding:7px 9px;border:1px solid var(--linea);border-radius:6px;font:inherit;margin-bottom:8px;background:#fff}
.lado h3{margin:12px 6px 4px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--acero);font-weight:600}
.lado button.item{display:flex;width:100%;gap:8px;align-items:baseline;text-align:left;border:0;background:none;padding:6px 8px;border-radius:6px;font:inherit;cursor:pointer;color:var(--tinta)}
.lado button.item:hover{background:#fff}
.lado button.item[aria-pressed=true]{background:var(--senal-claro);color:var(--senal);font-weight:500}
.lado button.item .n{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--acero);min-width:30px}
.lado button.item .molde{margin-left:auto;font-size:10px;color:var(--acero)}
.lado button.item.pend{opacity:.55}
.main{position:relative;overflow:hidden;background:#fff}
.main iframe{width:100%;height:100%;border:0}
.main .vacio{padding:40px;color:var(--tinta-2);max-width:720px}
.sub{display:flex;gap:10px;align-items:center;padding:6px 14px;border-bottom:1px solid var(--linea);background:var(--papel-2);font-size:12px;color:var(--tinta-2);height:36px}
.sub a,.sub button{font:inherit;font-size:12px}
.sub button{border:1px solid var(--linea);background:#fff;border-radius:5px;padding:3px 9px;cursor:pointer;color:var(--tinta-2)}
.sub button.peligro:hover{border-color:var(--error);color:var(--error)}
.main.con-sub iframe{height:calc(100% - 36px)}
.pagina{padding:22px 28px;max-width:1200px;overflow:auto;height:100%}
.pagina h1{font-size:18px;margin:0 0 14px;font-weight:600}
table.datos{border-collapse:collapse;width:100%;background:#fff;font-size:13px}
table.datos th,table.datos td{padding:6px 10px;border-bottom:1px solid var(--linea);text-align:left;vertical-align:top}
table.datos th{background:var(--papel-2);font-weight:600;font-size:12px}
table.datos input,table.datos select{width:100%;padding:4px 6px;border:1px solid var(--linea);border-radius:4px;font:inherit;font-size:13px}
.btn{display:inline-block;padding:7px 14px;border:1px solid var(--senal);background:var(--senal);color:#fff;border-radius:6px;font:inherit;cursor:pointer;text-decoration:none}
.btn.sec{background:#fff;color:var(--senal)}
.nota{padding:10px 14px;background:var(--senal-claro);border-radius:6px;margin:10px 0;font-size:13px}
.nota.alerta{background:var(--alerta-claro);color:var(--alerta)}
.nota.error{background:var(--error-claro);color:var(--error)}
.login{max-width:360px;margin:12vh auto;background:#fff;padding:28px;border:1px solid var(--linea);border-radius:10px}
.login label{display:block;font-size:12px;color:var(--tinta-2);margin-top:12px}
.login input{width:100%;padding:8px 10px;border:1px solid var(--linea);border-radius:6px;font:inherit;margin-top:4px}
.login .btn{width:100%;margin-top:18px}
code,pre{font-family:"IBM Plex Mono",monospace;font-size:12px}
pre{background:var(--papel-2);padding:10px;border:1px solid var(--linea);border-radius:6px;overflow:auto}
.res{margin-top:6px}
.res .grp{font-size:11px;color:var(--acero);text-transform:uppercase;letter-spacing:.05em;margin:8px 6px 2px}
.res button.item small{display:block;color:var(--acero);font-size:11px}
