/* El reloj de cada ronda */
#tira-reloj { position: sticky; top: 55px; z-index: 10; margin-bottom: 10px; }
.tira {
  position: relative; display: flex; align-items: stretch; overflow: hidden; border-radius: 12px;
  background: #0d3f2d; border: 1px solid #1d8460; box-shadow: 0 6px 16px rgba(0, 0, 0, .4);
}
.tira.descanso { background: #16364d; border-color: #2f7199; }
.tira.quieta { background: #2a241c; border-color: #5b4f40; }
.tira-play { flex: none; width: 50px; font-size: 1rem; background: rgba(255, 255, 255, .08); color: var(--oro); }
.tira-play:hover { background: rgba(255, 255, 255, .15); }
.tira-info { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; padding: 7px 12px 9px; text-align: left; }
.t-niv { font: 700 1.05rem var(--titulo); white-space: nowrap; }
.t-cie { font: 600 1.05rem var(--titulo); color: #ffe6ad; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
.t-est { font-size: .78rem; color: var(--suave); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.t-tiempo { margin-left: auto; font: 700 1.65rem/1 var(--titulo); font-variant-numeric: tabular-nums; }
[data-tiempo].pronto { color: var(--oro); }
[data-tiempo].ultimo { color: var(--rojo); animation: titila 1s steps(2) infinite; }
@keyframes titila { 50% { opacity: .55; } }
.barra-tiempo { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: rgba(0, 0, 0, .35); }
.barra-tiempo i { display: block; height: 100%; width: 100%; background: var(--oro); transition: width .25s linear; }
.barra-tiempo.grande { position: static; display: block; height: 8px; border-radius: 99px; overflow: hidden; width: min(100%, 640px); margin: 2px auto 0; background: rgba(0, 0, 0, .45); }

.pantalla-reloj {
  display: flex; flex-direction: column; align-items: center; text-align: center; padding: 22px 14px 18px; border-radius: 16px;
  background: radial-gradient(ellipse at 50% 10%, #187250, var(--pano) 50%, var(--pano-2)); border: 1px solid #1d8460; margin-bottom: 14px;
}
.pantalla-reloj.descanso { background: radial-gradient(ellipse at 50% 10%, #2a6b93, #1a4765 55%, #122f44); border-color: #2f7199; }
.pantalla-reloj.quieta { background: radial-gradient(ellipse at 50% 10%, #3b342a, #28231c 60%, #1d1915); border-color: #5b4f40; }
.pr-nivel { font: 700 1.9rem/1.1 var(--titulo); }
.pr-nivel span { display: block; font: 500 .9rem var(--cuerpo); color: #cfe3d8; margin-top: 2px; }
.pr-tiempo { font: 700 clamp(5.4rem, 27vw, 13rem)/1 var(--titulo); font-variant-numeric: tabular-nums; color: #fff8e6; letter-spacing: .01em; margin: 6px 0 8px; }
.pr-estado { min-height: 1.4em; margin-top: 6px; font-weight: 600; color: var(--oro); }
.pr-ciegas { display: flex; gap: 34px; justify-content: center; margin-top: 2px; }
.pr-ciegas small { display: block; font-size: .76rem; text-transform: uppercase; letter-spacing: .1em; color: #cfe3d8; }
.pr-ciegas b { font: 700 clamp(2.4rem, 10vw, 4.4rem)/1.05 var(--titulo); color: #ffe6ad; font-variant-numeric: tabular-nums; }
.pr-sigue { margin-top: 6px; color: #d7e7de; }
.pr-datos { display: flex; gap: 22px; margin-top: 8px; color: #cfe3d8; font-size: .95rem; }
.pr-datos b { color: #fff8e6; font: 700 1.2rem var(--titulo); margin-left: 2px; }
.pr-control { display: grid; grid-template-columns: 1fr 1.3fr 1fr; gap: 8px; width: min(100%, 460px); margin-top: 16px; }
.pr-extra { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 20px; margin-top: 12px; }
.pantalla-reloj .enlace { color: #f2eadb; }
.pantalla-reloj:fullscreen { justify-content: center; border: 0; border-radius: 0; padding: 3vh 4vw; }
.pantalla-reloj:fullscreen .pr-tiempo { font-size: min(38vw, 50vh); }
.pantalla-reloj:fullscreen .pr-nivel { font-size: 5vh; }
.pantalla-reloj:fullscreen .pr-ciegas b { font-size: 11vh; }
.pantalla-reloj:fullscreen .pr-sigue, .pantalla-reloj:fullscreen .pr-datos { font-size: 3vh; }
.pantalla-reloj:fullscreen .pr-datos b { font-size: 3.6vh; }
.pantalla-reloj:fullscreen .pr-control { display: none; }

.niveles { list-style: none; margin: 0; padding: 0; }
.niveles li { display: grid; grid-template-columns: 84px 1fr auto; gap: 10px; align-items: baseline; padding: 6px 8px; border-top: 1px solid var(--linea); border-radius: 6px; }
.niveles li:first-child { border-top: 0; }
.n-et { font: 600 1.02rem var(--titulo); }
.n-cie { font-variant-numeric: tabular-nums; }
.n-min { color: var(--suave); font-size: .9rem; white-space: nowrap; }
.niveles li.descanso .n-et { color: #9ed3ee; }
.niveles li.paso { opacity: .5; }
.niveles li.actual { background: #2b2312; outline: 1px solid var(--oro-osc); }
.niveles li.actual .n-et { color: var(--oro); }

.ed-niveles { margin-top: 10px; }
.niv-todos { display: flex; align-items: flex-end; gap: 8px; margin-bottom: 12px; }
.niv-todos label { flex: 1; }
.niv-todos .bot { flex: none; min-height: 44px; }
.niv-enc, .niv-fila { display: grid; grid-template-columns: 24px 1fr 1fr 1fr 1fr 30px; gap: 5px; align-items: center; }
.niv-enc { font-size: .74rem; color: var(--suave); margin-bottom: 3px; }
.niv-filas { display: flex; flex-direction: column; gap: 5px; }
.niv-fila input { min-height: 38px; padding: 6px 7px; min-width: 0; font-size: .95rem; }
.niv-et { font: 600 1rem var(--titulo); color: var(--suave); text-align: center; }
.niv-fila.es-descanso { background: #16364d; border-radius: 8px; padding: 2px 0 2px 8px; }
.niv-fila.es-descanso .niv-et { grid-column: 1 / 5; text-align: left; color: #9ed3ee; }
.niv-pie { display: flex; gap: 20px; margin-top: 8px; }

@media (min-width: 700px) {
  #tira-reloj { top: 58px; max-width: 760px; }
  .pantalla-reloj { padding: 28px 24px 22px; }
  .pr-tiempo { font-size: clamp(8rem, 17vw, 13rem); }
}

/* Aviso de cuando suben las ciegas */
.t-sig { font-size: .82rem; font-weight: 600; color: var(--oro); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; display: none; }
.tira.sube-pronto .t-sig { display: inline; }
.tira.sube-pronto .t-cie { display: none; }
.anuncio {
  position: fixed; z-index: 70; left: 50%; top: 50%; width: min(92vw, 620px); transform: translate(-50%, -50%) scale(.9);
  display: flex; flex-direction: column; align-items: center; text-align: center; gap: 2px; padding: 26px 20px 30px; border-radius: 20px; cursor: pointer;
  background: linear-gradient(160deg, #4c3a12, #1f180c); border: 2px solid var(--oro); box-shadow: 0 24px 70px rgba(0, 0, 0, .75);
  opacity: 0; visibility: hidden; transition: opacity .2s, transform .2s, visibility .2s;
}
.anuncio.ver { opacity: 1; visibility: visible; transform: translate(-50%, -50%) scale(1); }
.anuncio small { font-size: .85rem; text-transform: uppercase; letter-spacing: .12em; color: var(--oro); }
.anuncio b { font: 700 clamp(2.2rem, 9vw, 3.6rem)/1.1 var(--titulo); color: #fff8e6; }
.anuncio strong { font: 700 clamp(2.8rem, 13vw, 5.2rem)/1.05 var(--titulo); color: #ffe6ad; font-variant-numeric: tabular-nums; }
@media (min-width: 700px) {
  .t-sig { display: inline; }
  .tira.sube-pronto .t-cie { display: inline; }
}