/* galeria.css — La Galería sin Ojos (lectura sensorial: voz, tacto, sonido) */

/* Barra de salida (igual que el resto de efectos) */
.exit-bar { position:fixed; top:10px; right:10px; display:flex; gap:8px; z-index:60; }
.exit-bar.exit-bottom { top:auto; bottom:14px; right:50%; transform:translateX(50%); }
.exit-btn { font-size:12px; font-weight:600; padding:6px 11px; border-radius:9px; border:1px solid var(--line); background:rgba(255,255,255,.92); color:var(--muted); cursor:pointer; box-shadow:0 2px 8px rgba(0,0,0,.08); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); }
.exit-btn:active { transform:translateY(1px); }
.exit-btn.danger { color:var(--danger); border-color:#f3c9d2; }
#logout-btn { display:none; }

/* ===================== JUEGO ===================== */
.ga-screen { min-height:100svh; min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:radial-gradient(circle at 50% 20%, #241d55 0%, #16113a 52%, #090717 100%); color:#ece9ff; }
.ga-inner { width:100%; max-width:540px; padding:22px 18px 40px; display:flex; flex-direction:column; align-items:center; gap:18px; text-align:center; }
.ga-title { font-size:22px; font-weight:800; letter-spacing:.5px; margin:0; }
.ga-status { font-size:14px; color:#b6ade8; margin:0; min-height:20px; transition:color .3s; }
.ga-status.is-reading { color:#c9b8ff; }
.ga-status.is-done { color:#9fffd6; font-weight:700; }
.ga-status.is-error { color:#ff8a9c; }

/* Orbe / aura central (estilo La Venda) */
.ga-orb { position:relative; width:168px; height:168px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:radial-gradient(circle at 50% 45%, rgba(124,109,230,.30), rgba(20,16,52,.16) 70%);
  box-shadow:inset 0 0 44px rgba(124,109,230,.36), 0 0 38px rgba(120,90,220,.28); }
.ga-orb::before, .ga-orb::after { content:""; position:absolute; inset:0; border-radius:50%; border:2px solid rgba(170,150,255,.4); pointer-events:none; }
.ga-orb.idle::before { animation:gaPulse 2.8s ease-out infinite; }
.ga-orb.idle::after  { animation:gaPulse 2.8s ease-out infinite 1.4s; }
@keyframes gaPulse { 0%{ transform:scale(.7); opacity:.6; } 100%{ transform:scale(1.25); opacity:0; } }
.ga-orb.reading::before { animation:gaScan 1.3s ease-out infinite; border-color:rgba(201,184,255,.7); }
.ga-orb.reading::after  { animation:gaScan 1.3s ease-out infinite .65s; border-color:rgba(201,184,255,.45); }
@keyframes gaScan { 0%{ transform:scale(.55); opacity:.95; } 100%{ transform:scale(1.4); opacity:0; } }
.ga-orb.reveal { box-shadow:inset 0 0 60px rgba(201,184,255,.5), 0 0 64px rgba(150,120,255,.6); }

.ga-orb-icon { width:92px; height:92px; color:#efeaff; opacity:0; transform:scale(.7); transition:opacity .4s ease, transform .4s ease; }
.ga-orb-icon svg { width:100%; height:100%; display:block; }
.ga-orb-icon.show { opacity:1; transform:scale(1); }
.ga-orb.reveal .ga-orb-icon { filter:drop-shadow(0 0 10px rgba(201,184,255,.9)) drop-shadow(0 0 22px rgba(124,109,230,.7)); }

/* Línea de sensación (sentido + texto) */
.ga-sense { min-height:56px; display:flex; flex-direction:column; align-items:center; gap:6px; opacity:0; transition:opacity .35s ease; }
.ga-sense.show { opacity:1; }
.ga-sense-tag { display:inline-flex; align-items:center; gap:7px; font-size:12px; font-weight:700; letter-spacing:.6px; text-transform:uppercase; color:#a99fe6; }
.ga-sense-tag svg { width:20px; height:20px; }
.ga-sense-text { font-size:15px; font-style:italic; color:#e7e0ff; max-width:440px; line-height:1.45; }

/* Rejilla de 6 recuerdos */
.ga-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; width:100%; max-width:420px; transition:opacity .35s; }
.ga-grid.dim { opacity:.28; }
.ga-mem { display:flex; flex-direction:column; align-items:center; gap:8px; padding:14px 6px 10px; border-radius:16px;
  background:rgba(255,255,255,.05); border:1.5px solid rgba(150,130,255,.2); transition:transform .35s, border-color .35s, box-shadow .35s, background .35s; }
.ga-mem svg { width:38px; height:38px; color:#c3bbe8; }
.ga-mem span { font-size:12px; font-weight:600; color:#a99fe6; }
.ga-mem.pick { border-color:#c9b8ff; background:rgba(150,120,255,.12); box-shadow:0 0 26px rgba(180,150,255,.5); transform:translateY(-3px) scale(1.05); }
.ga-mem.pick svg { color:#efe4ff; filter:drop-shadow(0 0 8px rgba(201,184,255,.9)); }
.ga-mem.pick span { color:#efe4ff; }

/* Botones */
.ga-actions { display:flex; gap:10px; flex-wrap:wrap; justify-content:center; }
.ga-btn { font-size:14px; font-weight:700; padding:12px 26px; border-radius:12px; cursor:pointer;
  border:1px solid rgba(150,130,255,.4); background:rgba(124,109,230,.18); color:#ece9ff; transition:transform .1s, box-shadow .2s, opacity .2s; }
.ga-btn:hover { box-shadow:0 8px 22px rgba(108,92,231,.35); }
.ga-btn:active { transform:translateY(1px); }
.ga-btn[disabled] { opacity:.5; cursor:default; }
.ga-btn.primary { background:linear-gradient(135deg,#6c5ce7,#9a86ff); color:#160f36; border:none; }
.ga-btn.ghost { background:transparent; }

/* Hotspot secreto + aviso */
.ga-secret { position:fixed; left:0; bottom:0; width:64px; height:64px; z-index:55; background:transparent; border:none; }
.ga-hint { position:fixed; left:10px; bottom:12px; z-index:56; font-size:11px; color:rgba(201,184,255,.6); background:rgba(20,16,52,.65); border:1px solid rgba(150,130,255,.25); border-radius:8px; padding:3px 8px; opacity:0; transition:opacity .3s; pointer-events:none; }
.ga-hint.show { opacity:1; }

/* ===================== CONTROL ===================== */
.ga-force-note { width:100%; font-size:12px; color:var(--muted); background:#f3f0ff; border:1px solid #e6e0fb; border-radius:12px; padding:9px 12px; text-align:center; line-height:1.5; }
.ga-force-note b { color:var(--brand1); }
.ga-force-note .k { font-weight:700; color:var(--ink); }

.ga-ctrl-preview { width:104px; height:104px; border-radius:16px; display:flex; align-items:center; justify-content:center; border:1.5px dashed var(--line); color:var(--muted); }
.ga-ctrl-preview svg { width:66px; height:66px; color:var(--brand1); }
.ga-ctrl-preview.empty { font-size:38px; font-weight:700; }
.ga-ctrl-preview.empty svg { display:none; }

.ga-grid-ctrl { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; width:100%; }
.ga-mem-btn { display:flex; flex-direction:column; align-items:center; gap:6px; padding:12px 4px; border-radius:14px; cursor:pointer;
  border:1.5px solid var(--line); background:#fff; color:#3a3550; transition:border-color .2s, box-shadow .2s, transform .1s; }
.ga-mem-btn svg { width:32px; height:32px; }
.ga-mem-btn span { font-size:11px; font-weight:600; }
.ga-mem-btn.sel { border-color:var(--brand1); box-shadow:0 0 0 3px rgba(108,92,231,.18); color:var(--brand1); }
.ga-mem-btn:active { transform:translateY(1px); }

@media (max-width:420px) { .ga-mem span, .ga-mem-btn span { font-size:10.5px; } }
