/* Segunda capa visual: lectura rápida, contraste y navegación segura en pantallas pequeñas. */
:root { --focus: #f1ffae; --danger: #ffad9f; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.2; background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size:42px 42px; mask-image:linear-gradient(to bottom,black,transparent 65%); }
aside { z-index:2; }
.workspace { position:relative; }
.workspace header { display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:24px; align-items:end; }
.workspace header .eyebrow,.workspace header h1 { grid-column:1; }
.workspace header>p:last-child { grid-column:1; }
.workspace header::after { content:"OPERACIÓN INTERNA"; grid-column:2; grid-row:1 / span 2; align-self:center; color:var(--quiet); border:1px solid var(--line); padding:7px 9px; font-size:9px; letter-spacing:.14em; white-space:nowrap; }
.metric { position:relative; overflow:hidden; transition:transform .18s ease,background .18s ease; }
.metric:hover { transform:translateY(-2px); background:#19201b; }
.metric::after { content:""; position:absolute; inset:auto -16px -24px auto; width:58px; height:58px; border:1px solid rgba(215,255,102,.22); border-radius:50%; }
.panel { box-shadow:0 16px 40px rgba(0,0,0,.13); }
.panel h2 { display:flex; align-items:baseline; gap:10px; }
.panel h2::after { content:""; height:1px; background:var(--line); flex:1; }
.conversation { border-left:2px solid transparent; padding-left:8px; }
.conversation:hover { border-left-color:var(--accent); }
.conversation:focus-visible, nav button:focus-visible, button:focus-visible, a:focus-visible { outline:2px solid var(--focus); outline-offset:3px; }
.empty-state,.empty-case { display:grid; gap:8px; place-items:start; min-height:132px; padding:24px; border:1px dashed #3b4941; background:rgba(215,255,102,.035); color:var(--muted); }
.empty-state b,.empty-case b { color:var(--ink); font:21px/1 var(--serif); }
.empty-case a { font-size:12px; }
.case-link { display:grid; gap:3px; padding:12px 0; border-top:1px solid var(--line); color:var(--ink); text-decoration:none; }
.case-link:hover b { color:var(--accent); }.case-link small { color:var(--muted); font-size:11px; }
.status { white-space:nowrap; }
@media (max-width:800px) {
  body { font-size:14px; }
  .workspace header { display:block; margin-bottom:28px; }
  .workspace header::after { display:none; }
  .workspace h1 { font-size:46px; }
  .workspace header>p:last-child { max-width:36ch; }
  .metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .metric { min-height:118px; padding:15px; }
  .metric strong { font-size:21px; }
  .panel { padding:18px; }
  .finance-hero,.attribution-hero { padding:22px 18px; }
  .conversation { padding:13px 4px 13px 8px; }
  .messages .message { max-width:92%; }
}
@media (max-width:420px) { .metrics { grid-template-columns:1fr; } .workspace h1 { font-size:40px; } }