:root{
  --navy:#1e3a5f;
  --navy-deep:#152a45;
  --accent:#e8543e;
  --bg:#f5f5f2;
  --surface:#ffffff;
  --ink:#1c1c1c;
  --ink-soft:#6b6b68;
  --line:#ececE8;
  --chip-bg:#e0e7ee;
  --live:#1f9254;
  --live-bg:#e5f3eb;
  --soon:#9c7a22;
  --soon-bg:#f6efd9;
  --shadow:0 10px 26px rgba(30,58,95,.10);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --navy:#2c5487;
    --navy-deep:#152a45;
    --bg:#14171c;
    --surface:#1b1f26;
    --ink:#f0f0ee;
    --ink-soft:#a3a29c;
    --line:#2c313a;
    --chip-bg:#232833;
    --live:#4fc686;
    --live-bg:#173226;
    --soon:#e0b955;
    --soon-bg:#2f2a17;
    --shadow:0 10px 26px rgba(0,0,0,.45);
  }
}
:root[data-theme="dark"]{
  --navy:#2c5487;
  --navy-deep:#152a45;
  --bg:#14171c;
  --surface:#1b1f26;
  --ink:#f0f0ee;
  --ink-soft:#a3a29c;
  --line:#2c313a;
  --chip-bg:#232833;
  --live:#4fc686;
  --live-bg:#173226;
  --soon:#e0b955;
  --soon-bg:#2f2a17;
  --shadow:0 10px 26px rgba(0,0,0,.45);
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:"Inter",-apple-system,Segoe UI,sans-serif;
  line-height:1.5;
}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
h1,h2,h3,.brand-word,.pub-name{font-family:"Fraunces",Georgia,serif}
a{color:inherit}
button{font-family:inherit}

/* header banda navy */
.masthead{background:var(--navy);box-shadow:var(--shadow)}
.masthead-inner{display:flex;align-items:center;gap:14px;padding:18px 0;flex-wrap:wrap}
.masthead-banner{max-width:420px;width:100%;height:auto;display:block}
.masthead-auth{margin-left:auto;display:flex;align-items:center}
.btn-login{background:#fff;color:var(--navy);border:none;font-family:"Inter";font-weight:700;font-size:13px;padding:9px 16px;border-radius:999px;cursor:pointer}
.btn-login[hidden]{display:none}
.user-chip{display:flex;align-items:center;gap:8px}
.user-chip[hidden]{display:none}
.user-chip .user-nombre{color:#fff;font-family:"Inter";font-size:13px;font-weight:600;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.btn-logout{background:transparent;color:#cfe0f0;border:1px solid rgba(255,255,255,.4);font-family:"Inter";font-size:12px;padding:6px 12px;border-radius:999px;cursor:pointer}

/* hero copy */
.hero{padding:22px 0 8px}
.hero h1{font-size:clamp(24px,3.6vw,34px);font-weight:600;max-width:640px;margin-bottom:10px}
.hero p{color:var(--ink-soft);font-size:15.5px;max-width:520px;font-family:"Inter"}

/* buscador */
.buscador{display:flex;gap:8px;padding:14px 20px 0;max-width:1080px;margin:0 auto;flex-wrap:wrap}
.buscador input,.buscador select{font-family:"Inter";font-size:14px;padding:11px 14px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink)}
.buscador input{flex:2;min-width:180px}
.buscador select{flex:1;min-width:160px}
.buscador select[hidden]{display:none}
.buscador input:focus,.buscador select:focus{outline:2px solid var(--accent);outline-offset:1px}

/* jump chips a cada zona */
.zone-jump{display:flex;gap:8px;overflow-x:auto;padding:14px 20px 6px;max-width:1080px;margin:0 auto}
.zone-jump::-webkit-scrollbar{display:none}
.zone-jump a{flex:none;width:148px;box-sizing:border-box;text-align:center;background:var(--navy);color:#fff;font-family:"Fraunces",Georgia,serif;font-weight:600;font-size:13.5px;padding:8px 10px;border-radius:999px;text-decoration:none}

/* secciones por zona */
.apps{padding:14px 0 10px}
.zone-block{padding:22px 0}
.zone-block + .zone-block{border-top:1px solid var(--line)}
.zone-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.zone-head h2{font-size:19px;font-weight:600}
.zone-head-right{display:flex;align-items:center;gap:10px}
.app-status{font-size:11.5px;font-weight:700;letter-spacing:.02em;font-family:"Inter"}
.app-status.live{color:var(--live)}
.app-status.soon{color:var(--soon)}
.open-app{font-size:12px;font-weight:700;color:var(--accent);text-decoration:none;font-family:"Inter"}

.pub-track{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.empty-note{grid-column:1/-1;color:var(--ink-soft);font-size:14px;font-family:"Inter";background:var(--surface);border:1px dashed var(--line);border-radius:14px;padding:16px;text-align:center}

.pub-card{display:block;background:var(--surface);border-radius:12px;overflow:hidden;box-shadow:var(--shadow);text-decoration:none;color:inherit;cursor:pointer}
.pub-media{position:relative;aspect-ratio:1/1;background-color:var(--bg);background-size:contain;background-repeat:no-repeat;background-position:center}
.status-pill{position:absolute;left:5px;bottom:5px;font-size:9px;font-weight:700;padding:2px 6px;border-radius:999px;font-family:"Inter"}
.status-pill.live{background:var(--live);color:#fff}
.status-pill.closed{background:rgba(28,36,48,.7);color:#fff}
.pub-body{padding:6px 6px 8px;display:flex;flex-direction:column;gap:2px}
.zone-tag{display:none}
.pub-name{font-size:12px;font-weight:600;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pub-rating{font-size:11px;font-weight:700;color:#e8a33d;font-family:"Inter"}

.pub-actions{position:absolute;top:5px;right:5px;display:flex;gap:4px}
.pub-action-btn{width:24px;height:24px;border-radius:50%;background:rgba(255,255,255,.92);border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:13px;color:var(--ink-soft);padding:0;line-height:1}
.pub-action-btn.fav-btn.activo{color:var(--accent)}
.pub-action-btn.opinar-btn{color:#e8a33d}

/* modal genérico (reseñas / detalle) */
.rol-modal{position:fixed;inset:0;background:rgba(20,25,32,.55);display:flex;align-items:center;justify-content:center;padding:20px;z-index:50}
.rol-modal[hidden]{display:none}
.rol-modal-card{background:var(--surface);border-radius:18px;padding:26px;max-width:420px;width:100%;box-shadow:var(--shadow)}

/* detalle de una publicación, dentro del hub */
.detalle-card{position:relative;max-width:520px;max-height:88vh;overflow-y:auto;padding:0}
.detalle-cerrar{position:absolute;top:10px;right:10px;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.92);border:none;font-size:15px;cursor:pointer;z-index:2}
.detalle-galeria{display:flex;flex-direction:column;gap:10px;margin:10px 0}
.detalle-foto{width:100%;max-height:220px;border-radius:12px;object-fit:cover;background:var(--bg);cursor:pointer;display:block}
.detalle-body{padding:20px}
.zone-tag-detalle{font-size:11px;font-weight:700;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.04em;font-family:"Inter"}
.detalle-body h2{font-size:21px;margin:4px 0 8px}
.detalle-rating{font-size:14px;color:#e8a33d;font-family:"Inter";font-weight:600}
.detalle-desc{color:var(--ink-soft);font-size:14px;font-family:"Inter";margin-bottom:10px}
.detalle-direccion{color:var(--ink-soft);font-size:13px;font-family:"Inter";margin-bottom:10px}
.detalle-contacto{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.detalle-contacto a{text-decoration:none}
.detalle-actions{display:flex;gap:10px;margin-bottom:16px}
.detalle-actions .pub-action-btn{width:auto;height:auto;border-radius:999px;padding:8px 14px;background:var(--bg);border:1px solid var(--line);font-size:13px;font-family:"Inter";gap:6px}
.detalle-app-origen{display:block;margin-top:14px;font-size:12.5px;color:var(--ink-soft);font-family:"Inter";text-decoration:none}

.detalle-horario-fila{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;flex-wrap:wrap}
.detalle-horario-fila .detalle-actions{margin-bottom:0}
.detalle-horario{font-size:13px;font-family:"Inter";font-weight:600;margin-bottom:0}
.detalle-horario.abierto{color:var(--live)}
.detalle-horario.cerrado{color:#c0392b}
.detalle-oferta{background:var(--live-bg);color:var(--live);font-family:"Inter";font-size:13px;font-weight:600;padding:8px 12px;border-radius:10px;margin-bottom:10px}
.detalle-sucursal-tag{font-size:12px;font-weight:700;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.03em;font-family:"Inter";margin:14px 0 6px;padding-top:10px;border-top:1px solid var(--line)}
.detalle-mapa{width:100%;border-radius:10px;display:block;margin-bottom:10px}
.detalle-reel{margin:14px 0}
.detalle-links-externos{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.detalle-links-externos a{display:flex;align-items:center;gap:6px;text-decoration:none;font-family:"Inter";font-size:13px;font-weight:700;padding:9px 14px;border-radius:10px;color:#fff}
.detalle-datos-extra{list-style:none;margin-bottom:12px}
.detalle-datos-extra li{font-size:13px;color:var(--ink-soft);font-family:"Inter";padding:5px 0;border-top:1px solid var(--line)}
.detalle-datos-extra li:first-child{border-top:none}
.detalle-datos-extra li strong{color:var(--ink)}
.detalle-matricula{font-size:11.5px;color:var(--ink-soft);font-family:"Inter";font-style:italic;margin-top:10px}

/* lightbox de fotos dentro del detalle */
.detalle-lightbox{position:fixed;inset:0;background:rgba(10,12,16,.92);display:flex;align-items:center;justify-content:center;padding:24px;z-index:80}
.detalle-lightbox[hidden]{display:none}
.detalle-lightbox img{max-width:100%;max-height:100%;border-radius:8px}
.detalle-lightbox-cerrar{position:absolute;top:18px;right:18px;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.92);border:none;font-size:16px;cursor:pointer}
.rol-modal-card h2{font-size:19px;margin-bottom:6px}
.resena-lista{max-height:160px;overflow-y:auto;margin-bottom:14px}
.resena-lista .resena-cargando{color:var(--ink-soft);font-size:13px;font-family:"Inter"}
.resena-item{border-top:1px solid var(--line);padding:8px 0}
.resena-item:first-child{border-top:none}
.resena-item-estrellas{color:#e8a33d;font-size:13px}
.resena-item p{font-size:13px;color:var(--ink);margin-top:2px}
.resena-estrellas{display:flex;gap:6px;margin-bottom:14px}
.resena-estrellas .estrella-btn{background:none;border:none;font-size:26px;color:#e8a33d;cursor:pointer;padding:0}
.rol-modal-card textarea{width:100%;font-family:"Inter";font-size:14px;padding:10px;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--ink);resize:vertical;margin-bottom:16px}
.resena-modal-botones{display:flex;justify-content:flex-end;gap:10px}
.btn-primario{background:var(--accent);color:#fff;border:none;font-family:"Inter";font-weight:700;font-size:13px;padding:9px 16px;border-radius:999px;cursor:pointer}
.btn-secundario{background:transparent;color:var(--ink-soft);border:1px solid var(--line);font-family:"Inter";font-size:13px;padding:9px 16px;border-radius:999px;cursor:pointer}

/* about */
.about{padding:40px 0 8px}
.about h2{font-size:19px;font-weight:600;margin-bottom:12px}
.about-grid{display:grid;grid-template-columns:1fr;gap:22px}
@media(min-width:720px){.about-grid{grid-template-columns:1.1fr 1fr}}
.about p{color:var(--ink-soft);font-size:14.5px;margin-bottom:10px;font-family:"Inter"}
.about h3{font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink);margin:14px 0 8px;font-weight:700;font-family:"Inter"}
.checklist li{list-style:none;position:relative;padding-left:18px;color:var(--ink-soft);font-size:14px;margin-bottom:7px;font-family:"Inter"}
.checklist li::before{content:"";position:absolute;left:0;top:7px;width:6px;height:6px;border-radius:50%;background:var(--accent)}

/* tab bar footer */
.tabbar{max-width:420px;margin:34px auto 0;background:var(--surface);border:1px solid var(--line);border-radius:18px;display:flex;box-shadow:var(--shadow);overflow:hidden}
.tabbar a{flex:1;text-align:center;padding:12px 6px;font-size:12.5px;font-weight:700;color:var(--ink-soft);text-decoration:none;font-family:"Inter"}
.tabbar a.active{background:var(--chip-bg);color:var(--navy)}

footer{padding:22px 0 30px;text-align:center}
.footer-note{color:var(--ink-soft);font-size:12px;font-family:"Inter"}