/* MallKey · Acceso por invitación */
:root { --oro: #d4a63f; --oro2: #b8862f; --tinta: #14161a; --papel: #fffaf0; --gris: #6b6f76; --ok: #1f7a4d; --mal: #b42318; --borde: #e6dcc3 }
* { box-sizing: border-box }
html, body { margin: 0; background: #0f1a17; color: var(--tinta); font: 16px/1.45 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif }
body { min-height: 100vh; background: radial-gradient(1200px 600px at 20% -10%, #24443a 0, #0f1a17 60%) fixed }
a { color: var(--oro2) }
.cab { display: flex; align-items: center; gap: 12px; padding: 22px 20px 6px; max-width: 980px; margin: 0 auto; color: #fff }
.cab img { width: 44px; height: 44px }
.cab b { font-size: 26px; letter-spacing: .3px } .cab b i { font-style: normal; color: var(--oro) }
.cab span { display: block; font-size: 13px; color: #cfe3da; letter-spacing: .4px; text-transform: uppercase }
.cab .der { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap }
main { max-width: 980px; margin: 0 auto; padding: 10px 16px 60px }
.tit { color: #fff; font-size: 30px; line-height: 1.15; margin: 18px 4px 6px } .tit em { color: var(--oro); font-style: normal }
.sub { color: #cfe3da; margin: 0 4px 22px; max-width: 640px }
.dos { display: grid; grid-template-columns: 1fr 1fr; gap: 16px }
@media (max-width: 680px) { .dos { grid-template-columns: 1fr } .tit { font-size: 25px } }
.op { text-align: left; border: 0; border-radius: 18px; padding: 22px; background: var(--papel); cursor: pointer; font: inherit; color: inherit; box-shadow: 0 10px 30px #0006; transition: transform .15s, box-shadow .15s; display: flex; gap: 14px; align-items: flex-start }
.op:hover, .op:focus-visible { transform: translateY(-2px); box-shadow: 0 14px 34px #000a; outline: 3px solid var(--oro); outline-offset: 2px }
.op .ic { font-size: 30px; line-height: 1; width: 52px; height: 52px; border-radius: 14px; display: grid; place-items: center; background: #14161a; color: var(--oro); flex: none }
.op b { display: block; font-size: 19px; margin-bottom: 2px } .op small { color: var(--gris); font-size: 14px }
.caja { background: var(--papel); border-radius: 18px; padding: 20px; box-shadow: 0 10px 30px #0006; margin-bottom: 16px }
.caja h2 { margin: 0 0 6px; font-size: 20px } .caja h3 { margin: 0 0 8px; font-size: 17px }
.caja p { margin: 0 0 12px }
label { display: block; font-weight: 600; font-size: 14px; margin: 10px 0 4px }
input, select, textarea { width: 100%; font: inherit; padding: 11px 12px; border: 1px solid #cbbf9f; border-radius: 10px; background: #fff; color: var(--tinta) }
input:focus, select:focus, textarea:focus { outline: 3px solid #d4a63f66; border-color: var(--oro2) }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; letter-spacing: .5px }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; border: 0; border-radius: 12px; padding: 11px 16px; font: inherit; font-weight: 700; cursor: pointer; text-decoration: none; background: var(--oro); color: #14161a; min-height: 44px }
.btn:hover { filter: brightness(1.05) } .btn:disabled { opacity: .55; cursor: default }
.btn.ghost { background: transparent; border: 1px solid #cbbf9f; color: var(--tinta) }
.btn.osc { background: #14161a; color: #fff }
.btn.rojo { background: var(--mal); color: #fff }
.btn.sm { padding: 6px 10px; min-height: 34px; font-size: 14px; border-radius: 9px }
.cab .btn.ghost { color: #fff; border-color: #ffffff55 }
.fila { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-top: 12px }
.fila > * { flex: none }
.dos-c { display: grid; grid-template-columns: 1fr 1fr; gap: 10px } @media (max-width: 560px) { .dos-c { grid-template-columns: 1fr } }
.err { color: var(--mal); font-weight: 600; margin: 8px 0 0 } .ok { color: var(--ok); font-weight: 600 }
.nota { font-size: 13px; color: var(--gris) }
.tabs { display: flex; gap: 6px; margin-bottom: 10px } .tabs button { flex: 1; border: 1px solid #cbbf9f; background: #fff; border-radius: 10px; padding: 10px; font: inherit; font-weight: 700; cursor: pointer } .tabs button[aria-selected="true"] { background: #14161a; color: #fff; border-color: #14161a }
.oculto { display: none !important }
.volver { background: none; border: 0; color: #cfe3da; font: inherit; cursor: pointer; margin: 0 0 10px; padding: 6px 0 } .volver:hover { color: #fff }
.chip { display: inline-block; font-size: 12px; font-weight: 700; padding: 3px 8px; border-radius: 99px; background: #eee; color: #333 }
.chip.pendiente { background: #fff2cc; color: #7a5a00 } .chip.activo { background: #d9f2e4; color: #145c38 } .chip.vencido, .chip.rechazado { background: #eee; color: #555 } .chip.revocado { background: #fde2df; color: #8a1c12 }
.clave-grande { font-size: 24px; font-weight: 800; background: #14161a; color: var(--oro); border-radius: 12px; padding: 14px; text-align: center; word-break: break-all }
.resultado { border: 2px dashed var(--oro2); border-radius: 14px; padding: 14px; margin-top: 12px; background: #fff }
table { width: 100%; border-collapse: collapse; font-size: 14px } th, td { text-align: left; padding: 8px 6px; border-bottom: 1px solid var(--borde); vertical-align: top } th { font-size: 12px; text-transform: uppercase; color: var(--gris) }
.tabla { overflow-x: auto }
.badge { background: var(--mal); color: #fff; border-radius: 99px; padding: 1px 8px; font-size: 13px; margin-left: 6px }
.kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 12px } @media (max-width: 680px) { .kpis { grid-template-columns: repeat(2, 1fr) } }
.kpi { background: #fff; border: 1px solid var(--borde); border-radius: 12px; padding: 10px } .kpi b { display: block; font-size: 22px } .kpi span { font-size: 12px; color: var(--gris) }
.sol { border: 1px solid var(--borde); border-radius: 14px; padding: 14px; margin-bottom: 10px; background: #fff }
.sol .q { display: flex; gap: 8px; flex-wrap: wrap; align-items: baseline } .sol .q b { font-size: 17px }
.pie { text-align: center; color: #9fb9ae; font-size: 13px; margin-top: 26px }
/* Sobre sellado */
.sobre { position: relative; max-width: 560px; margin: 24px auto; background: linear-gradient(160deg, #fbf3df, #f1e2bd); border-radius: 18px; padding: 34px 24px 24px; box-shadow: 0 16px 40px #000a; text-align: center }
.sobre::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 120px; background: linear-gradient(160deg, #f1e2bd, #e5cf98); clip-path: polygon(0 0, 100% 0, 50% 100%); border-radius: 18px 18px 0 0; opacity: .85 }
.sello { position: relative; width: 96px; height: 96px; margin: 6px auto 16px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #c0392b, #7b1d14 70%); color: #f7d9a0; display: grid; place-items: center; font: 800 26px Georgia, serif; box-shadow: 0 6px 14px #0006, inset 0 0 0 6px #ffffff22; letter-spacing: 1px }
.sello.roto { background: radial-gradient(circle at 35% 30%, #9c9c9c, #555 70%); color: #eee }
.qr { display: inline-block; background: #fff; padding: 10px; border-radius: 12px; margin: 10px 0 } .qr img, .qr svg { display: block; width: 210px; height: 210px }
.pasos { text-align: left; margin: 12px auto; max-width: 440px; padding-left: 20px }
@media print { body { background: #fff } .cab, .noimp, .pie { display: none !important } .sobre { box-shadow: none; border: 2px solid #b8862f } .sobre::before { display: none } }
.ancho { grid-column: 1 / -1 } .lista-ag { font-size: 14px; color: #333 } .sel-sm { width: auto; padding: 6px; font-size: 14px }
.mt { margin-top: 14px } .msg { white-space: pre-wrap; font-size: 13px } .m0 { margin: 0 }
label.check { display: flex; gap: 8px; align-items: center; font-weight: 600; margin: 12px 0 2px; cursor: pointer } label.check input { width: 20px; height: 20px; flex: none; accent-color: #14161a }
.aviso-eq { background: #fff2cc } .aviso-eq p { margin: 0 0 6px }
/* Archivos compartidos (/acceso/archivos) · tinta y dorado MallKey */
html:has(> body.arch) { background: #16121d }
body.arch { --tinta: #16121d; --oro: #c9a24a; --oro2: #a8842f; background: radial-gradient(1200px 600px at 20% -10%, #2a2233 0, #16121d 60%) fixed }
body.arch .cab span, body.arch .sub { color: #e6dcc8 }
body.arch .btn.osc { background: #16121d }
.carpeta h2 { display: flex; align-items: center; gap: 8px }
.archs { list-style: none; margin: 0; padding: 0 }
.archs li { display: flex; align-items: center; gap: 12px; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--borde) }
.archs li:last-child { border-bottom: 0 }
.archs li b { display: block; word-break: break-word } .archs li > div { min-width: 0 }
/* Panel: ámbitos y archivos */
.amb-in { width: 100%; min-width: 120px; padding: 7px 8px; font-size: 14px }
.sujeto { display: inline-flex; gap: 4px; align-items: center; margin: 2px 4px 2px 0 }
.sujeto button { border: 0; background: none; cursor: pointer; color: var(--mal); font-weight: 800; padding: 0 2px }


/* Fortaleza · seguridad (muralla.py) · añadido al final; no cambia lo anterior */
main .grid{display:flex;flex-wrap:wrap;gap:.6rem;margin:.4rem 0}
.nivel-critico{background:#5a1020;color:#ffd7de}
.nivel-alto{background:#5a2a10;color:#ffe0c2}
.nivel-medio{background:#4a4410;color:#fff3b0}
.nivel-bajo{background:#17323a;color:#cfeef6}
.w6{width:6em}
.w18{min-width:18em}
.prebox{white-space:pre-wrap;overflow:auto;max-height:24em}
