:root{
  --bg:#090807;
  --panel:#100e0c;
  --panel-2:#17130f;
  --paper:#eee7dc;
  --paper-2:#f7f2ea;
  --ink:#211c18;
  --muted:#71675e;
  --gold:#b78a4f;
  --gold-2:#d8ad6b;
  --red:#901a18;
  --line-dark:rgba(255,255,255,.09);
  --line-light:rgba(33,28,24,.12);
  --max:1440px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink)}
button,input{font:inherit}

.explorer-hero{
  position:relative;
  overflow:hidden;
  color:#fff;
  background:
    radial-gradient(circle at 78% 42%,rgba(183,138,79,.22),transparent 25rem),
    linear-gradient(120deg,#080706 0%,#15100c 54%,#070706 100%);
}
.explorer-hero::after{
  position:absolute;inset:auto 0 0;height:1px;content:"";
  background:linear-gradient(90deg,transparent,rgba(183,138,79,.55),transparent);
}
.explorer-hero-inner{
  width:min(1180px,calc(100% - 40px));
  margin:0 auto;
  padding:clamp(75px,9vw,120px) 0;
}
.explorer-hero h1{
  margin:0;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(4rem,8vw,7rem);
  font-weight:500;
  line-height:.88;
  letter-spacing:-.055em;
}
.explorer-hero p:not(.eyebrow){
  max-width:720px;
  margin:28px 0 0;
  color:rgba(255,255,255,.7);
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.05rem,2vw,1.28rem);
  line-height:1.8;
}

.app-shell{
  display:grid;
  grid-template-columns:minmax(300px,34%) minmax(0,1fr);
  width:min(var(--max),100%);
  min-height:820px;
  margin:0 auto;
  border-left:1px solid var(--line-light);
  border-right:1px solid var(--line-light);
  background:var(--paper);
}

.sidebar{
  min-width:0;
  color:#fff;
  background:
    radial-gradient(circle at 15% 10%,rgba(144,26,24,.13),transparent 25rem),
    var(--panel);
  border-right:1px solid var(--line-dark);
}

.sidebar-top{
  position:sticky;
  top:74px;
  z-index:4;
  padding:22px;
  background:rgba(16,14,12,.97);
  backdrop-filter:blur(15px);
  border-bottom:1px solid var(--line-dark);
}

.search-box{
  display:flex;
  min-height:52px;
  align-items:center;
  padding:0 15px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
}
.search-box:focus-within{
  border-color:rgba(216,173,107,.8);
  box-shadow:0 0 0 3px rgba(216,173,107,.08);
}
.search-box input{
  width:100%;
  border:0;
  outline:0;
  color:#fff;
  background:transparent;
}
.search-box input::placeholder{color:rgba(255,255,255,.4)}

.mode-switch{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-top:12px;
}
.mode-switch button,
.type-filter{
  min-height:38px;
  border:1px solid rgba(255,255,255,.11);
  color:rgba(255,255,255,.65);
  background:transparent;
  cursor:pointer;
}
.mode-switch button.active,
.type-filter.active{
  color:#17120d;
  border-color:var(--gold-2);
  background:var(--gold-2);
}

.type-filters{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:12px;
}
.type-filter{padding:7px 10px;border-radius:999px;font-size:.8rem}

.era-list{
  display:grid;
  padding:14px 22px;
  border-bottom:1px solid var(--line-dark);
}
.era-button{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:13px 0;
  border:0;
  border-bottom:1px solid rgba(255,255,255,.06);
  color:rgba(255,255,255,.66);
  background:transparent;
  text-align:left;
  cursor:pointer;
}
.era-button:hover,.era-button.active{color:#fff}
.era-button span:first-child{
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.03rem;
}
.era-button small{
  color:var(--gold-2);
  font-size:.7rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.results-list{padding:8px 0 40px}
.result-item{
  position:relative;
  display:grid;
  grid-template-columns:74px 22px minmax(0,1fr);
  align-items:center;
  width:100%;
  min-height:74px;
  padding:10px 22px;
  border:0;
  color:#fff;
  background:transparent;
  text-align:left;
  cursor:pointer;
}
.result-item::before{
  position:absolute;
  top:0;
  bottom:0;
  left:106px;
  width:1px;
  content:"";
  background:rgba(255,255,255,.1);
}
.result-item:hover,.result-item.active{background:rgba(255,255,255,.055)}
.result-date{
  color:rgba(255,255,255,.45);
  font-family:Georgia,"Times New Roman",serif;
  font-size:.8rem;
  line-height:1.25;
}
.result-node{
  position:relative;
  z-index:1;
  justify-self:center;
  width:10px;
  height:10px;
  border:3px solid var(--panel);
  border-radius:50%;
  background:#8d857d;
  box-shadow:0 0 0 1px #8d857d;
}
.result-item[data-featured="true"] .result-node{
  width:16px;height:16px;background:var(--red);
  box-shadow:0 0 0 1px var(--red),0 0 0 6px rgba(144,26,24,.1);
}
.result-item[data-type="imperio"] .result-node{border-radius:2px;background:var(--gold)}
.result-item[data-type="mito"] .result-node{background:#756090}
.result-copy{padding-left:13px}
.result-copy strong{
  display:block;
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.08rem;
  font-weight:500;
  line-height:1.1;
}
.result-copy small{
  display:block;
  margin-top:4px;
  color:rgba(255,255,255,.4);
  font-size:.73rem;
}

.detail-panel{
  min-width:0;
  background:
    radial-gradient(circle at 82% 16%,rgba(183,138,79,.08),transparent 28rem),
    var(--paper);
}
.detail-empty{
  display:grid;
  min-height:820px;
  place-content:center;
  padding:50px;
  text-align:center;
}
.detail-empty h2,
.detail-copy h2{
  margin:0;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(3rem,6vw,6rem);
  font-weight:500;
  line-height:.92;
  letter-spacing:-.05em;
}
.detail-empty p:last-child{
  max-width:620px;
  color:var(--muted);
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.1rem;
  line-height:1.8;
}

.detail-hero{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(300px,.95fr);
  min-height:520px;
  border-bottom:1px solid var(--line-light);
  background:rgba(255,255,255,.4);
}
.detail-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:clamp(34px,6vw,72px);
}
.detail-kicker{
  margin:0 0 15px;
  color:var(--red);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.detail-date{
  margin:18px 0 0;
  color:var(--gold);
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.1rem;
}
.detail-summary{
  max-width:680px;
  margin:25px 0 0;
  color:var(--muted);
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.12rem;
  line-height:1.8;
}
.detail-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:29px;
}
.detail-actions a{
  display:inline-flex;
  min-height:44px;
  align-items:center;
  padding:10px 15px;
  color:#fff;
  background:var(--red);
  text-decoration:none;
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.detail-actions a.secondary{
  color:#433a32;
  border:1px solid var(--line-light);
  background:transparent;
}
.detail-visual{
  position:relative;
  min-height:520px;
  overflow:hidden;
  background:linear-gradient(135deg,#8c633a,#17110c);
}
.detail-visual img{
  width:100%;
  height:100%;
  min-height:520px;
  display:block;
  object-fit:cover;
}
.detail-visual.no-image::after{
  position:absolute;
  inset:auto -20px -40px auto;
  content:attr(data-word);
  color:rgba(255,255,255,.11);
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(5rem,10vw,9rem);
  white-space:nowrap;
}

.detail-sections{
  display:grid;
  grid-template-columns:1fr 1fr;
}
.detail-section{
  padding:clamp(34px,5vw,60px);
  border-bottom:1px solid var(--line-light);
}
.detail-section:nth-child(odd){border-right:1px solid var(--line-light)}
.detail-section h3{
  margin:0 0 20px;
  color:var(--ink);
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.8rem,3vw,2.7rem);
  font-weight:500;
  letter-spacing:-.03em;
}
.detail-section p,
.detail-section li{
  color:var(--muted);
  line-height:1.75;
}
.detail-section ul{margin:0;padding-left:20px}
.chip-list{display:flex;flex-wrap:wrap;gap:9px}
.chip{
  padding:8px 11px;
  border:1px solid var(--line-light);
  border-radius:999px;
  color:#5b5047;
  background:rgba(255,255,255,.48);
  cursor:pointer;
}
.chip:hover{border-color:rgba(144,26,24,.35);color:var(--red)}

.sr-only{
  position:absolute;width:1px;height:1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;
}

@media(max-width:960px){
  .app-shell{grid-template-columns:1fr}
  .sidebar{border-right:0}
  .sidebar-top{top:74px}
  .era-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .era-button{padding:10px;border:1px solid rgba(255,255,255,.08)}
  .results-list{max-height:460px;overflow:auto}
  .detail-hero{grid-template-columns:1fr}
  .detail-visual{order:-1;min-height:320px;max-height:420px}
  .detail-visual img{min-height:320px;max-height:420px}
}
@media(max-width:680px){
  .explorer-hero h1{font-size:clamp(3.5rem,17vw,5.1rem)}
  .era-list{grid-template-columns:1fr 1fr}
  .result-item{grid-template-columns:64px 20px minmax(0,1fr);padding:10px 14px}
  .result-item::before{left:88px}
  .detail-copy{padding:32px 22px 38px}
  .detail-sections{grid-template-columns:1fr}
  .detail-section:nth-child(odd){border-right:0}
}


/* =========================================================
   V2 · BARRA IZQUIERDA COMPLETA COMO CRONOLOGÍA
   ========================================================= */

.sidebar {
  display: flex;
  min-height: 100%;
  flex-direction: column;
}

.sidebar-top {
  position: sticky;
  top: 74px;
  z-index: 8;
  padding: 24px 22px 20px;
}

.sidebar-title {
  margin: 0 0 14px;
  color: var(--gold-2);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.era-buttons {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  margin-top: 14px;
}

.era-button {
  min-height: 42px;
  padding: 10px 13px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 4px;
  color: rgba(255,255,255,.66);
  background: rgba(255,255,255,.025);
}

.era-button span:first-child {
  font-family: Arial, Helvetica, sans-serif;
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.era-button small {
  color: rgba(255,255,255,.36);
}

.era-button:hover {
  border-color: rgba(255,255,255,.22);
  background: rgba(255,255,255,.05);
}

.era-button.active {
  color: #17120d;
  border-color: var(--gold-2);
  background: var(--gold-2);
}

.era-button.active small {
  color: rgba(23,18,13,.58);
}

.sidebar-secondary-filters {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 12px;
}

.secondary-filter {
  min-height: 38px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 4px;
  color: rgba(255,255,255,.56);
  background: transparent;
  cursor: pointer;
}

.secondary-filter:hover {
  color: #fff;
  border-color: rgba(255,255,255,.22);
}

.secondary-filter.active {
  color: #fff;
  border-color: var(--red);
  background: rgba(144,26,24,.32);
}

.timeline-sidebar-label {
  position: sticky;
  top: 368px;
  z-index: 7;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 22px;
  color: rgba(255,255,255,.72);
  background: rgba(16,14,12,.97);
  border-top: 1px solid rgba(255,255,255,.07);
  border-bottom: 1px solid rgba(255,255,255,.07);
  backdrop-filter: blur(14px);
}

.timeline-sidebar-label span {
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.timeline-sidebar-label small {
  color: rgba(255,255,255,.36);
}

.results-list {
  position: relative;
  padding: 8px 0 44px;
}

.result-item {
  grid-template-columns: 78px 24px minmax(0,1fr);
  min-height: 78px;
  padding: 10px 18px;
}

.result-item::before {
  left: 108px;
}

.result-date {
  padding-right: 6px;
}

@media (max-width: 960px) {
  .sidebar-top,
  .timeline-sidebar-label {
    position: static;
  }

  .era-buttons {
    grid-template-columns: repeat(5, minmax(145px,1fr));
    overflow-x: auto;
    padding-bottom: 5px;
  }

  .results-list {
    max-height: 540px;
    overflow-y: auto;
  }
}

@media (max-width: 680px) {
  .era-buttons {
    grid-template-columns: 1fr;
    overflow: visible;
  }

  .result-item {
    grid-template-columns: 66px 22px minmax(0,1fr);
    padding: 10px 14px;
  }

  .result-item::before {
    left: 89px;
  }
}


/* =========================================================
   V3 · BARRA HORIZONTAL FIJA + CRONOLOGÍA / DETALLE
   ========================================================= */

.explorer-toolbar {
  position: sticky;
  top: 74px;
  z-index: 30;
  color: #fff;
  background: rgba(16,14,12,.97);
  border-top: 1px solid rgba(255,255,255,.06);
  border-bottom: 1px solid rgba(255,255,255,.09);
  backdrop-filter: blur(16px);
}

.explorer-toolbar-inner {
  display: grid;
  grid-template-columns: minmax(210px, 1.15fr) minmax(560px, 3fr) auto;
  gap: 12px;
  align-items: center;
  width: min(var(--max), calc(100% - 32px));
  margin: 0 auto;
  padding: 13px 0;
}

.toolbar-search {
  display: flex;
  min-height: 44px;
  align-items: center;
  padding: 0 14px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 4px;
  background: rgba(255,255,255,.04);
}

.toolbar-search:focus-within {
  border-color: rgba(216,173,107,.85);
  box-shadow: 0 0 0 3px rgba(216,173,107,.08);
}

.toolbar-search input {
  width: 100%;
  border: 0;
  outline: 0;
  color: #fff;
  background: transparent;
}

.toolbar-search input::placeholder {
  color: rgba(255,255,255,.42);
}

.toolbar-eras {
  display: grid;
  grid-template-columns: repeat(5, minmax(0,1fr));
  gap: 7px;
}

.toolbar-eras .era-button {
  min-height: 44px;
  padding: 8px 9px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 4px;
  color: rgba(255,255,255,.66);
  background: rgba(255,255,255,.025);
  text-align: center;
  cursor: pointer;
}

.toolbar-eras .era-button span:first-child {
  font-family: Arial, Helvetica, sans-serif;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .045em;
  text-transform: uppercase;
}

.toolbar-eras .era-button small {
  display: none;
}

.toolbar-eras .era-button:hover {
  color: #fff;
  border-color: rgba(255,255,255,.24);
  background: rgba(255,255,255,.055);
}

.toolbar-eras .era-button.active {
  color: #17120d;
  border-color: var(--gold-2);
  background: var(--gold-2);
  box-shadow: 0 5px 16px rgba(216,173,107,.14);
  transform: translateY(1px);
}

.toolbar-mode {
  display: grid;
  grid-template-columns: auto auto;
  gap: 7px;
}

.toolbar-mode-button {
  min-height: 44px;
  padding: 8px 12px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 4px;
  color: rgba(255,255,255,.58);
  background: transparent;
  white-space: nowrap;
  cursor: pointer;
}

.toolbar-mode-button:hover {
  color: #fff;
  border-color: rgba(255,255,255,.24);
}

.toolbar-mode-button.active {
  color: #fff;
  border-color: var(--red);
  background: rgba(144,26,24,.34);
}

.app-shell {
  display: grid;
  grid-template-columns: minmax(330px, 34%) minmax(0, 1fr);
  width: min(var(--max), 100%);
  min-height: calc(100vh - 148px);
  margin: 0 auto;
  margin-top: 52px;
  border-right: 1px solid var(--line-light);
  border-left: 1px solid var(--line-light);
  background: var(--paper);
}

.timeline-panel {
  min-width: 0;
  color: #fff;
  background:
    radial-gradient(circle at 15% 10%, rgba(144,26,24,.13), transparent 25rem),
    var(--panel);
  border-right: 1px solid var(--line-dark);
}

.timeline-panel-heading {
  position: sticky;
  top: 144px;
  z-index: 9;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 48px;
  padding: 0 20px;
  color: rgba(255,255,255,.7);
  background: rgba(16,14,12,.97);
  border-bottom: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(14px);
}

.timeline-panel-heading span {
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.timeline-panel-heading small {
  color: rgba(255,255,255,.38);
}

.results-list {
  position: relative;
  padding: 10px 0 50px;
}

.result-item {
  position: relative;
  display: grid;
  grid-template-columns: 76px 24px minmax(0,1fr);
  align-items: center;
  width: 100%;
  min-height: 78px;
  padding: 10px 18px;
  border: 0;
  color: #fff;
  background: transparent;
  text-align: left;
  cursor: pointer;
  transition:
    background .18s ease,
    box-shadow .18s ease,
    transform .18s ease;
}

.result-item::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 106px;
  width: 1px;
  content: "";
  background: rgba(255,255,255,.11);
}

.result-item:hover {
  background: rgba(255,255,255,.055);
}

.result-item.active {
  background:
    linear-gradient(90deg, rgba(144,26,24,.42), rgba(144,26,24,.13));
  box-shadow:
    inset 4px 0 0 var(--gold-2),
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 -1px 0 rgba(255,255,255,.06);
  transform: translateX(2px);
}

.result-item.active .result-copy strong {
  color: #fff;
}

.result-item.active .result-copy small,
.result-item.active .result-date {
  color: rgba(255,255,255,.72);
}

.result-item.active .result-node {
  width: 18px;
  height: 18px;
  background: var(--gold-2);
  box-shadow:
    0 0 0 1px var(--gold-2),
    0 0 0 7px rgba(216,173,107,.13),
    0 0 20px rgba(216,173,107,.28);
}

.detail-panel {
  min-width: 0;
  min-height: calc(100vh - 148px);
  background:
    radial-gradient(circle at 82% 16%, rgba(183,138,79,.08), transparent 28rem),
    var(--paper);
}

.detail-empty {
  min-height: calc(100vh - 148px);
}

@media (min-width: 961px) {
  .timeline-panel {
    max-height: calc(100vh - 148px);
    overflow-y: auto;
  }

  .detail-panel {
    max-height: calc(100vh - 148px);
    overflow-y: auto;
  }
}

@media (max-width: 1120px) {
  .explorer-toolbar-inner {
    grid-template-columns: minmax(200px, .9fr) minmax(500px, 2.5fr);
  }

  .toolbar-mode {
    grid-column: 1 / -1;
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 960px) {
  .explorer-toolbar {
    position: static;
  }

  .explorer-toolbar-inner {
    grid-template-columns: 1fr;
  }

  .toolbar-eras {
    overflow-x: auto;
    grid-template-columns: repeat(5, minmax(145px,1fr));
    padding-bottom: 3px;
  }

  .app-shell {
    grid-template-columns: 1fr;
  }

  .timeline-panel {
    border-right: 0;
  }

  .timeline-panel-heading {
    position: static;
  }

  .results-list {
    max-height: 520px;
    overflow-y: auto;
  }

  .detail-panel,
  .detail-empty {
    min-height: auto;
  }
}

@media (max-width: 680px) {
  .explorer-toolbar-inner {
    width: min(100% - 20px, var(--max));
  }

  .toolbar-mode {
    grid-template-columns: 1fr 1fr;
  }

  .result-item {
    grid-template-columns: 64px 22px minmax(0,1fr);
    padding: 10px 13px;
  }

  .result-item::before {
    left: 87px;
  }
}


/* =========================================================
   CABECERA IGUAL A styles.css
   Este bloque debe permanecer al final de explorador.css.
   ========================================================= */

.site-header {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  padding: 12px max(22px, calc((100% - 1240px) / 2));
  color: #fff;
  background: linear-gradient(rgba(6, 5, 4, .92), rgba(6, 5, 4, .72));
  border-bottom: 1px solid rgba(255, 255, 255, .09);
  backdrop-filter: blur(14px);
}

.brand,
.footer-brand {
  display: flex;
  align-items: center;
  gap: 13px;
  text-decoration: none;
}

.brand img {
  width: 50px;
  height: auto;
  max-height: 50px;
  object-fit: contain;
  flex-shrink: 0;
}

.brand span {
  display: flex;
  flex-direction: column;
}

.brand b {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.28rem;
  letter-spacing: .03em;
}

.brand small {
  margin-top: 3px;
  color: rgba(255, 255, 255, .55);
  font-size: .62rem;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.main-nav {
  display: flex;
  align-items: center;
  gap: 25px;
}

.main-nav a {
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-decoration: none;
  text-transform: uppercase;
}

.main-nav a:hover {
  color: #e1bd82;
}

.nav-youtube {
  padding: 10px 14px;
  border: 1px solid rgba(255, 255, 255, .27);
  border-radius: 999px;
}

.nav-toggle {
  display: none;
  padding: 9px 11px;
  color: #fff;
  background: none;
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 6px;
}

@media (max-width: 780px) {
  .site-header {
    position: absolute;
  }

  .nav-toggle {
    display: block;
  }

  .main-nav {
    position: absolute;
    top: 75px;
    right: 14px;
    left: 14px;
    display: none;
    flex-direction: column;
    align-items: stretch;
    padding: 20px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 10px;
    background: rgba(6, 5, 4, .98);
  }

  .main-nav.open {
    display: flex;
  }
}

@media (max-width: 620px) {
  .brand b {
    font-size: 1.05rem;
  }

  .brand small {
    font-size: .5rem;
  }

  .brand img {
    width: 44px;
    height: 44px;
  }
}


/* =========================================================
   AJUSTE FINAL · CRONOLOGÍA Y CONTADOR BAJO EL BUSCADOR
   ========================================================= */

.explorer-toolbar-inner {
  display: grid;
  grid-template-columns: minmax(300px, 34%) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
  width: min(var(--max), 100%);
  margin: 0 auto;
  padding: 13px 16px;
}

.toolbar-left {
  display: flex;
  flex-direction: column;
  gap: 13px;
  min-width: 0;
}

.timeline-info {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 30px;
  padding: 0 2px 10px;
  color: rgba(255,255,255,.74);
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.timeline-info span {
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.timeline-info small {
  color: rgba(255,255,255,.4);
  font-size: .72rem;
}

.toolbar-right {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 12px;
  align-items: start;
  min-width: 0;
}

.timeline-panel-heading {
  display: none !important;
}

.timeline-panel {
  padding-top: 0;
}

.results-list {
  padding-top: 10px;
}

@media (max-width: 1120px) {
  .explorer-toolbar-inner {
    grid-template-columns: minmax(260px, 34%) minmax(0,1fr);
  }

  .toolbar-right {
    grid-template-columns: 1fr;
  }

  .toolbar-mode {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 960px) {
  .explorer-toolbar-inner {
    grid-template-columns: 1fr;
    width: min(100% - 20px, var(--max));
  }

  .toolbar-right {
    grid-template-columns: 1fr;
  }

  .toolbar-eras {
    grid-template-columns: repeat(5, minmax(145px,1fr));
    overflow-x: auto;
  }
}


/* =========================================================
   V3 DASHBOARD EDITORIAL · SOLO PANEL DERECHO
   Buscador, filtros y cronología izquierda permanecen intactos.
   ========================================================= */

.detail-panel{
  min-width:0;
  padding:0;
  background:
    radial-gradient(circle at 86% 4%,rgba(183,138,79,.10),transparent 30rem),
    linear-gradient(180deg,#f4efe6 0%,#ece5da 100%);
}

.v3-dashboard{
  width:min(1080px,calc(100% - 54px));
  margin:0 auto;
  padding:32px 0 84px;
}

.v3-hero{
  position:relative;
  min-height:430px;
  padding:38px clamp(30px,5vw,62px) 48px;
  overflow:hidden;
  color:#fff;
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  background:
    radial-gradient(circle at 82% 20%,rgba(183,138,79,.27),transparent 25rem),
    linear-gradient(135deg,#17120f,#080706 72%);
  box-shadow:0 28px 75px rgba(28,20,15,.22);
  isolation:isolate;
}

.v3-watermark{
  position:absolute;
  right:-28px;
  bottom:-24px;
  z-index:-1;
  color:rgba(255,255,255,.055);
  font-family:Arial,Helvetica,sans-serif;
  font-size:clamp(5.5rem,11vw,10rem);
  font-weight:900;
  letter-spacing:-.08em;
  line-height:.8;
  white-space:nowrap;
}

.v3-topline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}

.v3-topline p{
  margin:0;
  color:var(--gold-2);
  font-size:.68rem;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.v3-status{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 11px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:999px;
  color:rgba(255,255,255,.75);
  background:rgba(255,255,255,.055);
  font-size:.68rem;
  font-weight:800;
}

.v3-status::before{
  width:7px;
  height:7px;
  border-radius:50%;
  content:"";
  background:#d8ad6b;
  box-shadow:0 0 0 5px rgba(216,173,107,.10);
}

.v3-title-block{
  max-width:820px;
  margin-top:70px;
}

.v3-type{
  margin:0 0 14px;
  color:rgba(255,255,255,.47);
  font-size:.68rem;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.v3-hero h2{
  margin:0;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(4.4rem,8vw,8.4rem);
  font-weight:500;
  line-height:.84;
  letter-spacing:-.065em;
}

.v3-hero blockquote{
  max-width:720px;
  margin:30px 0 0;
  color:rgba(255,255,255,.78);
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.12rem,2vw,1.42rem);
  font-style:italic;
  line-height:1.55;
}

.v3-meta-line{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:28px;
}

.v3-meta-line span{
  padding:8px 11px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:999px;
  color:rgba(255,255,255,.68);
  font-size:.74rem;
}

.v3-stat-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin-top:16px;
}

.v3-stat{
  display:flex;
  min-height:150px;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-end;
  padding:22px;
  border:1px solid var(--line-light);
  border-radius:14px;
  background:rgba(255,255,255,.76);
  box-shadow:0 12px 34px rgba(40,30,22,.055);
}

.v3-stat-symbol{
  display:grid;
  width:42px;
  height:42px;
  place-items:center;
  margin-bottom:auto;
  color:var(--red);
  border:1px solid rgba(144,26,24,.16);
  border-radius:50%;
  font-size:.68rem;
  font-weight:900;
}

.v3-stat small{
  margin-bottom:6px;
  color:var(--muted);
  font-size:.63rem;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.v3-stat strong{
  color:var(--ink);
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.04rem;
  font-weight:500;
  line-height:1.25;
}

.v3-content-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
  margin-top:16px;
}

.v3-card{
  position:relative;
  padding:30px;
  overflow:hidden;
  border:1px solid var(--line-light);
  border-radius:14px;
  background:rgba(255,255,255,.72);
  box-shadow:0 12px 36px rgba(40,30,22,.05);
}

.v3-card::after{
  position:absolute;
  right:-45px;
  bottom:-55px;
  width:140px;
  height:140px;
  border:1px solid rgba(144,26,24,.055);
  border-radius:50%;
  content:"";
}

.v3-label{
  margin:0 0 22px;
  color:var(--red);
  font-size:.67rem;
  font-weight:900;
  letter-spacing:.15em;
  text-transform:uppercase;
}

.v3-summary p:last-child{
  margin:0;
  color:#463c35;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.12rem,2vw,1.32rem);
  line-height:1.72;
}

.v3-impact ul,
.v3-context ul{
  display:grid;
  gap:13px;
  margin:0;
  padding:0;
  list-style:none;
}

.v3-impact li,
.v3-context li{
  position:relative;
  padding-left:26px;
  color:var(--muted);
  line-height:1.6;
}

.v3-impact li::before,
.v3-context li::before{
  position:absolute;
  left:0;
  color:var(--red);
  content:"✓";
  font-weight:900;
}

.v3-connections{
  grid-column:1/-1;
  min-height:260px;
}

.v3-network{
  display:grid;
  grid-template-columns:minmax(150px,.8fr) minmax(0,2fr);
  gap:28px;
  align-items:center;
}

.v3-network-center{
  display:grid;
  min-height:150px;
  place-items:center;
  padding:20px;
  color:#fff;
  border-radius:50%;
  background:
    radial-gradient(circle at 30% 25%,rgba(216,173,107,.35),transparent 45%),
    #17120f;
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.15rem;
  text-align:center;
  box-shadow:0 18px 42px rgba(23,18,15,.18);
}

.v3-network-nodes{
  position:relative;
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-content:center;
}

.v3-node{
  min-height:46px;
  padding:11px 15px;
  border:1px solid var(--line-light);
  border-radius:999px;
  color:#4d433b;
  background:#fff;
  cursor:pointer;
  transition:.18s ease;
}

.v3-node:hover{
  color:#fff;
  border-color:var(--red);
  background:var(--red);
  transform:translateY(-2px);
}

.v3-legacy{
  grid-column:1/-1;
  position:relative;
  min-height:260px;
  padding:44px;
  overflow:hidden;
  color:#fff;
  border-radius:16px;
  background:
    radial-gradient(circle at 85% 15%,rgba(183,138,79,.24),transparent 25rem),
    #17120f;
  box-shadow:0 22px 58px rgba(23,18,15,.16);
}

.v3-legacy::after{
  position:absolute;
  right:-10px;
  bottom:-70px;
  color:rgba(255,255,255,.035);
  content:"HYL";
  font-size:13rem;
  font-weight:900;
  line-height:.8;
}

.v3-legacy .v3-label{
  color:var(--gold-2);
}

.v3-legacy blockquote{
  position:relative;
  z-index:1;
  max-width:820px;
  margin:0;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.8rem,4vw,3.4rem);
  font-weight:500;
  line-height:1.12;
}

.v3-curiosity{
  grid-column:1/-1;
}

.v3-curiosity p:last-child{
  margin:0;
  color:var(--muted);
  font-size:1.02rem;
  line-height:1.72;
}

.v3-actions{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}

.v3-action{
  display:flex;
  min-height:60px;
  align-items:center;
  justify-content:center;
  padding:15px 20px;
  border-radius:9px;
  font-size:.76rem;
  font-weight:900;
  letter-spacing:.1em;
  text-decoration:none;
  text-transform:uppercase;
  transition:.18s ease;
}

.v3-action-page{
  color:var(--ink);
  border:1px solid var(--line-light);
  background:#fff;
}

.v3-action-video{
  color:#fff;
  border:1px solid var(--red);
  background:var(--red);
}

.v3-action:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 30px rgba(32,24,17,.12);
}

.detail-hero,
.detail-visual,
.detail-sections,
.editorial-detail,
.hyl-dossier{
  display:none;
}

@media(max-width:1050px){
  .v3-stat-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:760px){
  .v3-dashboard{
    width:min(100% - 26px,1080px);
    padding-top:20px;
  }

  .v3-hero{
    min-height:400px;
    padding:28px 24px 36px;
  }

  .v3-topline{
    align-items:flex-start;
    flex-direction:column;
  }

  .v3-title-block{
    margin-top:48px;
  }

  .v3-stat-grid,
  .v3-content-grid{
    grid-template-columns:1fr;
  }

  .v3-connections,
  .v3-legacy,
  .v3-curiosity,
  .v3-actions{
    grid-column:auto;
  }

  .v3-network{
    grid-template-columns:1fr;
  }

  .v3-network-center{
    min-height:110px;
    border-radius:14px;
  }

  .v3-actions{
    grid-template-columns:1fr;
  }
}
