/* Vista «Datos»: tablas en el panel del proyecto, filas y estructura en el escenario. Mismo lenguaje que «Código». */
.dat-side{flex:1;min-height:0;display:flex;flex-direction:column;gap:6px;padding:0 12px 8px;min-width:276px}
.dat-side .search{max-width:none;width:100%;min-height:42px;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.25);color:var(--blanco)}
.dat-side .search::placeholder{color:rgba(255,255,255,.55)}
.dat-meta{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:0 2px;font-size:.875rem;color:rgba(255,255,255,.65);white-space:nowrap}
.dat-meta b{font-weight:600;color:rgba(255,255,255,.85)}
.dat-list{flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:1px;padding-bottom:8px}
.dat-base{display:flex;flex-direction:column;gap:2px;margin:10px 4px 4px;color:var(--blanco)}
.dat-base:first-child{margin-top:2px}
.dat-base b{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.875rem;overflow:hidden;text-overflow:ellipsis}
.dat-base small{font-size:.8125rem;color:rgba(255,255,255,.55)}
.dat-t{display:flex;align-items:center;gap:8px;width:100%;min-height:44px;padding:0 10px;border:0;border-radius:10px;background:transparent;color:var(--blanco);text-align:left;font-size:.9375rem}
.dat-t:hover{background:rgba(255,255,255,.07)}
.dat-t b{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.875rem}
.dat-t small{margin-left:auto;font-size:.8125rem;color:rgba(255,255,255,.55);font-variant-numeric:tabular-nums}
.dat-t[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink)}
.dat-t[aria-pressed="true"] small{color:inherit;opacity:.8}
.dat-ic{flex:none;font-style:normal;font-size:.8125rem}
.dat-tag{font-style:normal;display:inline-block;padding:1px 7px;border-radius:999px;font-size:.75rem;font-weight:700;background:rgba(255,255,255,.12)}
.dat-tag.demo{background:rgba(192,132,252,.25)}
.dat-tag.solo,.dat-tag.sec{background:rgba(248,113,113,.22)}
.dat-empty,.dat-ext{margin:8px 6px;font-size:.9375rem;opacity:.75}
.dat-ext{font-size:.875rem;opacity:.65}

.dat-stage{flex:1;min-height:0;min-width:0;display:flex;flex-direction:column;background:var(--esc-fondo);color:var(--esc-tinta)}
.dat-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 12px;border-bottom:1px solid rgba(255,255,255,.08);font-size:.875rem}
.dat-path{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:min(40vw,420px)}
.dat-count{color:rgba(255,255,255,.6);white-space:nowrap}
.dat-sp{flex:1}
.dat-seg{margin:0}
.dat-seg button{min-height:36px;font-size:.875rem;padding:0 12px}
.dat-seg button:disabled{opacity:.4}
.dat-q{max-width:240px;min-height:36px;border-radius:10px;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.3);color:var(--blanco);font-size:1rem}
.dat-view{flex:1;min-height:0;min-width:0;overflow:auto;overscroll-behavior:contain;display:flex;flex-direction:column}
.dat-wrap{min-width:0;max-width:100%;overflow:auto;flex:1;min-height:0}
.dat-grid{border-collapse:separate;border-spacing:0;font-size:.875rem;min-width:100%}
.dat-grid th,.dat-grid td{padding:8px 12px;border-bottom:1px solid rgba(255,255,255,.07);text-align:left;vertical-align:top;white-space:nowrap;max-width:360px;overflow:hidden;text-overflow:ellipsis}
.dat-grid thead th{position:sticky;top:0;z-index:1;background:var(--esc-fondo-2);font-weight:600}
.dat-grid thead th small{display:block;font-weight:400;font-size:.75rem;color:rgba(255,255,255,.45)}
.dat-grid tbody tr:hover td{background:rgba(255,255,255,.03)}
.dat-grid td{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.dat-col i{font-style:normal}
.dat-sort{border:0;background:transparent;color:inherit;font:inherit;font-weight:600;padding:0;min-height:28px;cursor:pointer}
.dat-sort:hover{text-decoration:underline}
.dat-mask{border:1px dashed rgba(255,255,255,.28);border-radius:8px;background:rgba(255,255,255,.04);color:var(--esc-tinta);font:inherit;padding:4px 8px;min-height:32px;cursor:pointer}
.dat-mask:hover{border-color:var(--accent)}
.dat-rev{background:rgba(250,204,21,.14);color:var(--esc-amarillo-2)}
.dat-sec{color:rgba(255,255,255,.4);font-style:italic}
.dat-null{color:rgba(255,255,255,.35)}
.dat-none{color:rgba(255,255,255,.6);text-align:center;padding:24px}
.dat-pag{display:flex;align-items:center;justify-content:center;gap:12px;padding:10px;border-top:1px solid rgba(255,255,255,.08);font-size:.875rem}
.dat-pag .btn.ghost{color:var(--blanco);border-color:rgba(255,255,255,.25);min-height:40px}
.dat-hint{max-width:560px;margin:12vh auto 0;padding:24px;text-align:center;font-family:var(--sans)}
.dat-hint b{display:block;font-family:var(--display);font-size:1.25rem;margin-bottom:6px}
.dat-hint p{margin:0 0 10px;color:rgba(255,255,255,.8);font-size:1rem}
.dat-hint .btn.ghost{color:var(--blanco);border-color:rgba(255,255,255,.3)}
.dat-est{padding:12px 16px 32px;min-width:0}
.dat-est h3{margin:14px 0 8px;font-family:var(--display);font-size:1rem}
.dat-est .dat-wrap{flex:none}
.dat-cols td,.dat-cols th{white-space:normal}
.dat-sensc{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.dat-sensc small{color:rgba(255,255,255,.55);font-family:var(--sans)}
.dat-cols td.dat-sensc{font-family:var(--sans)}
.dat-est .btn.ghost.dat-tg{min-height:36px;color:var(--blanco);border-color:rgba(255,255,255,.28);font-family:var(--sans)}
.dat-est .btn.ghost.dat-tg[aria-pressed="true"]{background:rgba(255,255,255,.14)}
.dat-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.dat-ul{margin:0;padding-left:18px;font-size:.875rem;line-height:1.7}
.dat-link{border:0;background:transparent;color:var(--accent);font:inherit;padding:0;text-decoration:underline;cursor:pointer;min-height:28px}
.dat-refs{font-size:.875rem;margin:8px 0 0}
.dat-closed{margin:0 0 8px;padding:10px 12px;border-radius:10px;background:rgba(248,113,113,.14);font-size:.9375rem}
/* Vitrina en vista Datos: lo del visor de pantallas no aplica (mismo criterio que Código y Mapa). */
.vit[data-vista="datos"] .bar-c,.vit[data-vista="datos"] #present,.vit[data-vista="datos"] #zoom,.vit[data-vista="datos"] #noteCapture{display:none}
.vit[data-vista="datos"] .bar{grid-template-columns:1fr auto}
.vit[data-vista="datos"] .bar-r{grid-column:2}
/* En celular sin la dirección, los dos grupos caben juntos en una sola fila (mando.css los separa en dos). */
@container (max-width:420px){.vit[data-vista="datos"] .bar-l,.vit[data-vista="datos"] .bar-r{grid-row:1}}
@media (max-width:700px){
  .dat-side{min-width:0}
  .dat-path{max-width:100%}
  .dat-q{max-width:none;flex:1 1 100%}
  .dat-2{grid-template-columns:1fr}
  .dat-grid th,.dat-grid td{max-width:220px}
}
