*{box-sizing:border-box}
:root{
  --bg:#030807;--panel:#0b1213;--panel2:#10191b;--line:#314043;--blue:#315f84;
  --orange:#d98619;--red:#c93124;--yellow:#e7c23a;--green:#3fcf68;
  --lcd:#d9dfc7;--lcd2:#bac2a7;--lcdText:#16201d;--text:#f5f0dc;--muted:#9ca89b;
}
html,body{margin:0;min-height:100%;background:radial-gradient(circle at center,#10201b 0,#020706 70%);color:var(--text);font-family:"Courier New",monospace}
button,a,input,select,textarea{font-family:inherit}
.app{width:100%;min-height:100vh;display:flex;justify-content:center;align-items:flex-start;padding:14px}
.screen{display:none;width:100%}.screen.active{display:block}
.device{width:min(96vw,520px);margin:0 auto;background:linear-gradient(145deg,#050909,#111b1d);border:10px solid #050707;border-radius:32px;padding:22px;box-shadow:inset 0 0 0 6px #263033,inset 0 0 0 12px #050707,inset 0 0 0 17px var(--blue),0 20px 60px rgba(0,0,0,.75)}
.game-device{padding-bottom:calc(118px + env(safe-area-inset-bottom))}
.app-header,.game-header{text-align:center;margin-bottom:16px}
.game-header{display:flex;justify-content:space-between;align-items:center;text-align:left}
.brand{font-size:30px;letter-spacing:4px;font-weight:900;text-align:center}.brand.small{font-size:22px;text-align:left}
.subtitle{color:var(--orange);letter-spacing:2px;font-size:13px;text-align:center;margin-top:6px}
.lcd{background:linear-gradient(135deg,rgba(255,255,255,.22),transparent 25%),repeating-linear-gradient(90deg,rgba(0,0,0,.04) 0 3px,transparent 3px 8px),var(--lcd);border:7px solid #050707;color:var(--lcdText);box-shadow:inset 0 0 20px rgba(0,0,0,.25)}
.hero-lcd{text-align:center;padding:22px}.hero-lcd h1{margin:0;font-size:40px}.hero-lcd p{font-weight:900;margin:8px 0 0;color:var(--lcdText)}
.setup-card{margin-top:16px;background:rgba(0,0,0,.35);border:2px solid var(--line);padding:14px;display:grid;gap:12px}
label{display:grid;gap:6px;color:var(--orange);font-weight:900;font-size:14px}
input,select,textarea{width:100%;background:var(--lcd);border:4px solid #050707;padding:11px;color:#111;font-weight:900;font-size:16px}
.checkbox-row{display:flex;align-items:center;gap:8px;color:var(--text)}.checkbox-row input{width:auto}
.compact-options{display:grid;gap:8px}
.main-start-btn,.action-btn{border:4px solid #050707;font-weight:900;letter-spacing:1px;cursor:pointer;box-shadow:0 5px 0 #020303}
.main-start-btn{background:var(--red);color:#fff;padding:18px;font-size:20px}
.setup-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:8px;margin-top:12px}
.setup-links button,.setup-links a,.side-menu button,.side-menu a,.support-link{background:rgba(0,0,0,.28);border:2px solid var(--line);color:var(--orange);text-decoration:none;text-align:center;padding:10px;font-weight:900;cursor:pointer;font-size:13px}
.coming-soon,.sponsor-slot,.version-footer{margin-top:14px;background:rgba(0,0,0,.35);border:2px solid var(--line);padding:12px;text-align:center;font-size:13px;color:var(--muted)}
.coming-soon strong,.sponsor-slot strong,.version-footer strong{color:var(--orange)}.coming-soon p,.sponsor-slot p{margin:5px 0 0}.tag{display:inline-block;border:1px solid var(--orange);color:var(--orange);padding:3px 6px;margin-bottom:6px}
.half-pill{display:inline-block;margin-top:5px;color:var(--orange);border:2px solid var(--orange);padding:4px 8px;font-weight:900}
.menu-btn,.close-btn{background:transparent;border:2px solid var(--line);color:var(--orange);font-size:24px;padding:6px 12px;cursor:pointer}
.scoreboard{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:center;margin:14px 0}
.team-card{position:relative;background:#050808;border:2px solid var(--line);padding:10px;text-align:center;min-height:92px}
.team-card.active{border-color:var(--orange);box-shadow:0 0 18px rgba(217,134,25,.25)}
.team-card .turn-arrow{display:none;position:absolute;left:7px;top:7px;color:var(--green)}.team-card.active .turn-arrow{display:block}
.team-card span:nth-child(2){display:block;color:var(--orange);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.team-card strong{display:block;font-size:40px;margin-top:5px}.team-card small{display:block;min-height:15px;color:var(--yellow);font-size:12px}
.score-dash{font-size:36px;color:var(--red);font-weight:900}
.game-lcd{padding:18px;margin:12px 0;text-align:center}.timer{font-size:clamp(48px,14vw,82px);font-weight:900;letter-spacing:-5px}.last-two{font-size:34px;font-weight:900}
.event-card{border:3px solid var(--line);background:#050808;padding:12px;text-align:center;transition:.2s}
.event-card strong{display:block;font-size:30px;color:var(--orange);letter-spacing:2px}.event-card p{margin:4px 0 0;color:var(--text)}
.event-label{font-size:12px;color:var(--muted)}.event-goal{border-color:var(--green);animation:flash .75s}.event-goal strong{color:var(--green)}
.event-yellow{border-color:var(--yellow)}.event-yellow strong{color:var(--yellow)}.event-red{border-color:var(--red)}.event-red strong{color:var(--red)}
.event-special{border-color:var(--blue)}.event-special strong{color:#6bb6ff}
@keyframes flash{0%,100%{transform:scale(1)}30%{transform:scale(1.04)}60%{transform:scale(.98)}}
.turn-panel{text-align:center;margin:12px 0}.turn-panel span{display:block;color:var(--muted);font-size:12px}.turn-panel strong{display:block;color:var(--orange);font-size:24px}
.action-zone{display:grid;gap:8px;margin:14px 0}.action-btn{width:100%;min-height:86px;background:var(--green);color:#08100b;font-size:34px}.action-btn.stop{background:var(--red);color:#fff}.action-special{background:var(--blue);color:#fff;font-size:22px}
.reset-link{background:transparent;border:0;color:var(--muted);text-decoration:underline;cursor:pointer;padding:8px}
.special-panel,.shootout-panel,.collapsible{background:rgba(0,0,0,.35);border:2px solid var(--line);padding:12px;margin-top:10px}
.collapsible summary{color:var(--orange);cursor:pointer;font-weight:900}
.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.stats-grid strong{color:var(--orange)}
.broadcast-log{padding-left:22px;margin:10px 0 0}.broadcast-log li{margin-bottom:6px;color:#dce2d2;font-size:13px}
.debug-controls{display:flex;gap:8px;margin-top:10px}.debug-controls input{max-width:130px}.debug-controls button{flex:1}
.modal,.side-menu{position:fixed;inset:0;background:rgba(0,0,0,.82);z-index:20;display:flex;align-items:center;justify-content:center;padding:18px}
.modal-card,.side-menu-card{width:min(92vw,470px);max-height:90vh;overflow:auto;background:var(--panel2);border:6px solid var(--line);padding:22px;text-align:center}
.modal-card h2,.side-menu-card h2{color:var(--orange);margin-top:0}.modal-actions{display:grid;gap:8px;margin-top:16px}.modal-actions button{background:var(--red);color:#fff;border:4px solid #050707;padding:13px;font-weight:900;cursor:pointer}
.side-menu-card{display:grid;gap:10px}.close-btn{justify-self:end}.hidden{display:none!important}
.donation-data{display:grid;gap:10px;margin-top:12px}.donation-item{border:2px solid var(--line);padding:10px;text-align:left}.donation-item strong{color:var(--orange)}
.bizum-direct-btn{width:100%;margin-top:10px;background:var(--blue);color:#fff;padding:12px;border:3px solid #050707;font-weight:900;cursor:pointer}
.toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);background:#101719;border:3px solid var(--orange);padding:12px;z-index:40;font-weight:900}
.static-page{width:100%;max-width:760px;margin:0 auto;padding:18px}.static-card{background:linear-gradient(145deg,#050909,#111b1d);border:8px solid #050707;border-radius:28px;padding:24px;box-shadow:inset 0 0 0 6px #263033,inset 0 0 0 12px #050707,inset 0 0 0 17px var(--blue)}
.static-card h1,.static-card h2{color:var(--orange)}.static-card p,.static-card li{line-height:1.55}.callout{border:2px solid var(--orange);background:rgba(217,134,25,.12);padding:14px;margin:16px 0}
.footer-nav{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px;margin-top:24px}.footer-nav a{color:var(--orange);border:2px solid var(--line);padding:9px;text-align:center;text-decoration:none;font-weight:900}
.feedback-form{display:grid;gap:12px}.feedback-status{margin-top:14px;padding:12px;border:2px solid var(--line);background:rgba(0,0,0,.35)}.feedback-status.success{border-color:var(--green);color:var(--green)}.feedback-status.error{border-color:var(--red)}
.feedback-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}.support-link{display:block;background:var(--blue);color:#fff!important;border:3px solid #050707}
@media(max-width:560px){
  .app{padding:8px}.device{border-radius:24px;padding:16px}.scoreboard{grid-template-columns:1fr}.score-dash{display:none}.brand{font-size:24px}.timer{letter-spacing:-3px}
  .action-zone{position:sticky;bottom:8px;z-index:10;background:rgba(5,8,8,.92);border:2px solid var(--line);padding:8px}.action-btn{min-height:96px}
  .stats-grid,.feedback-actions{grid-template-columns:1fr}.game-device{padding-bottom:22px}
}


/* ===== CronoGol v1.6.2: feedback con Formspree ===== */
.feedback-status{margin-top:14px;padding:12px;border:2px solid var(--line);background:rgba(0,0,0,.35)}
.feedback-status.success{border-color:var(--green);color:var(--green)}
.feedback-status.error{border-color:var(--red);color:var(--text)}
.feedback-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}
@media(max-width:470px){.feedback-actions{grid-template-columns:1fr}}


/* ===== CronoGol v1.6.5: pulido UX/UI ===== */

/* Configuración con menos carga cognitiva */
.segmented-field {
  display: grid;
  gap: 8px;
}

.segmented-field > span {
  color: var(--orange);
  font-weight: 900;
  font-size: 14px;
}

.segmented-control {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.segment-btn {
  min-height: 48px;
  background: rgba(0,0,0,.35);
  border: 2px solid var(--line);
  color: var(--text);
  font-weight: 900;
  cursor: pointer;
}

.segment-btn.active {
  background: var(--orange);
  color: #120b00;
  border-color: var(--orange);
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.16);
}

.native-select-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Transición suave para dificultad máquina */
.machine-level-field {
  max-height: 110px;
  opacity: 1;
  overflow: hidden;
  transition: max-height .22s ease, opacity .18s ease, margin .22s ease;
}

.machine-level-field.is-hidden {
  max-height: 0;
  opacity: 0;
  margin: 0;
  pointer-events: none;
}

/* START/STOP debe dominar */
.action-zone {
  padding-bottom: max(8px, env(safe-area-inset-bottom));
}

.action-btn {
  transition: background .15s ease, color .15s ease, transform .08s ease, box-shadow .15s ease;
}

.action-btn.stop {
  background: #d23824;
  color: #fff7e8;
  box-shadow: 0 5px 0 #3a0a05, 0 0 20px rgba(210,56,36,.28);
}

.action-btn:disabled {
  opacity: .52;
  cursor: not-allowed;
}

/* Panel de tirada especial con parpadeo Casio */
.special-panel:not(.hidden) {
  animation: specialPulse 1s infinite;
}

@keyframes specialPulse {
  0%, 100% { border-color: var(--blue); box-shadow: 0 0 0 rgba(49,95,132,0); }
  50% { border-color: var(--orange); box-shadow: 0 0 18px rgba(217,134,25,.28); }
}

/* Turno activo más evidente */
.team-card.active .turn-arrow {
  animation: activeArrow 1s infinite;
}

@keyframes activeArrow {
  0%, 100% { opacity: .25; transform: translateX(0); }
  50% { opacity: 1; transform: translateX(3px); }
}

/* Cronómetro con aspecto más digital/LCD sin depender de fuentes externas */
.timer,
.last-two {
  font-family: "Orbitron", "Digital-7", "Share Tech Mono", "Courier New", monospace;
  font-variant-numeric: tabular-nums;
  text-shadow: 0 1px 0 rgba(255,255,255,.18), 0 0 8px rgba(22,32,29,.12);
}

/* Menú/links consistentes con la home */
.footer-nav a,
.setup-links button,
.setup-links a,
.side-menu button,
.side-menu a {
  border-radius: 0;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.side-menu-card {
  border-color: var(--blue);
}

.sponsor-slot {
  background: rgba(49,95,132,.10);
  border-color: rgba(49,95,132,.75);
}

.sponsor-slot strong::before {
  content: "▣ ";
  color: var(--orange);
}

/* Reset fuera del área caliente: queda solo en menú */
.action-zone .reset-link.hidden {
  display: none !important;
}

/* Evitar que textos largos roben foco visual durante el partido */
.event-card p {
  font-size: 14px;
}

@media(max-width:560px){
  .segmented-control {
    grid-template-columns: 1fr;
  }

  .action-zone {
    bottom: max(8px, env(safe-area-inset-bottom));
  }
}


/* ===== CronoGol v1.7.1: recuperación estable + Casio Lite ===== */
/* Esta versión no toca la lógica ni la estructura principal; solo mejora visualmente sin romper eventos. */

.device {
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.10), transparent 28%),
    linear-gradient(145deg, #333 0%, #141818 42%, #050707 100%);
  border-color: #555;
  box-shadow:
    inset 0 0 16px rgba(255,255,255,.06),
    inset 0 -14px 30px rgba(0,0,0,.78),
    inset 0 0 0 8px #050707,
    inset 0 0 0 14px #263033,
    inset 0 0 0 18px var(--blue),
    0 18px 45px rgba(0,0,0,.70);
}

.device::before {
  content: "";
  position: absolute;
  inset: 9px;
  border-radius: 28px;
  border: 1px solid rgba(255,255,255,.12);
  pointer-events: none;
}

.app-header .brand,
.game-header .brand {
  font-family: Arial Black, Impact, "Courier New", monospace;
  text-shadow: 1px 1px 0 #000;
}

.lcd,
.game-lcd,
.hero-lcd {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(255,255,255,.22), transparent 20%),
    linear-gradient(180deg, #b7c2a0, #87916f);
  color: #182114;
  border-radius: 12px;
  border: 5px solid #1d1d1d;
  box-shadow:
    inset 0 4px 12px rgba(0,0,0,0.50),
    inset 0 -2px 5px rgba(255,255,255,0.25);
}

.lcd::after,
.game-lcd::after,
.hero-lcd::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(
      to bottom,
      rgba(0,0,0,0.08) 0px,
      rgba(0,0,0,0.08) 1px,
      transparent 1px,
      transparent 4px
    ),
    repeating-linear-gradient(
      to right,
      rgba(0,0,0,0.035) 0px,
      rgba(0,0,0,0.035) 1px,
      transparent 1px,
      transparent 7px
    );
  pointer-events: none;
  opacity: 0.34;
  z-index: 2;
}

.timer,
.last-two,
.hero-lcd h1,
.hero-lcd p {
  position: relative;
  z-index: 3;
}

.timer,
.last-two {
  color: #10170d;
  font-family: "Orbitron", "Digital-7", "Share Tech Mono", "Courier New", monospace;
  font-variant-numeric: tabular-nums;
  text-shadow: 1px 1px 0 rgba(255,255,255,.22);
}

.action-btn,
.main-start-btn {
  border-radius: 999px;
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,0.23),
    0 5px 0 #000,
    0 8px 12px rgba(0,0,0,0.45);
}

.action-btn.stop {
  background: linear-gradient(180deg, #ff5a42, #9e1f12);
  color: #fff7e8;
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,0.25),
    0 5px 0 #3a0a05,
    0 8px 12px rgba(0,0,0,0.45),
    0 0 22px rgba(210,56,36,.32);
}

.team-card.active .turn-arrow {
  animation: activeArrow 1s infinite;
}

@keyframes activeArrow {
  0%, 100% { opacity: .25; transform: translateX(0); }
  50% { opacity: 1; transform: translateX(3px); }
}

.event-goal {
  animation: goalFlash 0.45s ease-in-out 3;
}

@keyframes goalFlash {
  0%, 100% { filter: brightness(1); }
  50% { filter: brightness(1.55); }
}

.special-panel:not(.hidden) {
  animation: specialPulse 1s infinite;
}

@keyframes specialPulse {
  0%, 100% { border-color: var(--blue); box-shadow: 0 0 0 rgba(49,95,132,0); }
  50% { border-color: var(--orange); box-shadow: 0 0 18px rgba(217,134,25,.28); }
}


/* ===== CronoGol v1.7.2: fix línea/cuadro fantasma ===== */
/*
  El cuadrado/línea tenue venía del pseudo-elemento .device::before.
  En algunos navegadores, al no estar .device posicionado/recortado de forma
  suficientemente explícita, el borde decorativo podía renderizarse fuera del reloj.
*/
.device {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.device > * {
  position: relative;
  z-index: 1;
}

.device::before {
  z-index: 0;
  inset: 9px;
  max-width: calc(100% - 18px);
  max-height: calc(100% - 18px);
}

/* Evita que overlays/modales hereden recortes raros dentro del reloj */
.modal,
.side-menu {
  isolation: auto;
}


/* ===== CronoGol v1.7.3: integración visual segura del logo + Casio Lite ===== */

.cg-header {
  text-align: center;
  margin: 8px auto 14px;
}

.cg-logo {
  width: min(280px, 82vw);
  height: auto;
  display: block;
  margin: 0 auto 6px;
  filter: drop-shadow(0 4px 0 #111) drop-shadow(0 10px 20px rgba(0,0,0,.42));
}

.cg-logo-static {
  width: min(300px, 82vw);
  margin-bottom: 14px;
}

.cg-subtitle {
  margin-top: 6px;
  font-family: "Courier New", monospace;
  font-size: .85rem;
  letter-spacing: 1px;
  color: #d9d9c3;
  text-transform: uppercase;
}

.watch-brand {
  font-family: "Arial Black", Impact, sans-serif;
  font-size: .82rem;
  letter-spacing: 2px;
  color: #d8d8c8;
  text-align: center;
  margin-bottom: 6px;
  text-shadow: 1px 1px 0 #000;
}

/* Detalles Casio seguros sin modificar estructura ni JS */
.watch-top-labels {
  display: flex;
  justify-content: space-between;
  color: #c8c8b8;
  font-size: .65rem;
  letter-spacing: 1px;
  margin: 0 8px 10px;
  padding: 0 4px;
  text-transform: uppercase;
  opacity: .82;
}

.watch-footer-labels {
  display: flex;
  justify-content: space-between;
  margin-top: 12px;
  color: #aaa;
  font-size: .58rem;
  letter-spacing: 1px;
  padding: 0 8px;
  text-transform: uppercase;
}

/* Carcasa tipo reloj, manteniendo la base estable */
.device {
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.10), transparent 28%),
    linear-gradient(145deg, #333 0%, #141818 42%, #050707 100%);
  border-color: #555;
  box-shadow:
    inset 0 0 16px rgba(255,255,255,.06),
    inset 0 -14px 30px rgba(0,0,0,.78),
    inset 0 0 0 8px #050707,
    inset 0 0 0 14px #263033,
    inset 0 0 0 18px var(--blue),
    0 18px 45px rgba(0,0,0,.70);
}

/* LCD envejecido */
.lcd,
.game-lcd,
.hero-lcd {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(255,255,255,.20), transparent 18%),
    linear-gradient(180deg, #b7c2a0, #87916f);
  color: #182114;
  border-radius: 12px;
  border: 5px solid #1d1d1d;
  box-shadow:
    inset 0 4px 12px rgba(0,0,0,.50),
    inset 0 -2px 5px rgba(255,255,255,.25);
}

.lcd::after,
.game-lcd::after,
.hero-lcd::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(
      to bottom,
      rgba(0,0,0,.08) 0px,
      rgba(0,0,0,.08) 1px,
      transparent 1px,
      transparent 4px
    ),
    repeating-linear-gradient(
      to right,
      rgba(0,0,0,.035) 0px,
      rgba(0,0,0,.035) 1px,
      transparent 1px,
      transparent 7px
    );
  pointer-events: none;
  opacity: .34;
  z-index: 2;
}

.timer,
.last-two,
.hero-lcd h1,
.hero-lcd p {
  position: relative;
  z-index: 3;
  color: #10170d;
}

/* Botones más físicos, sin mover lógica */
.action-btn,
.main-start-btn {
  border-radius: 999px;
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.23),
    0 5px 0 #000,
    0 8px 12px rgba(0,0,0,.45);
}

.action-btn.stop {
  background: linear-gradient(180deg, #ff5a42, #9e1f12);
  color: #fff7e8;
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.25),
    0 5px 0 #3a0a05,
    0 8px 12px rgba(0,0,0,.45),
    0 0 22px rgba(210,56,36,.32);
}

/* Estados visuales suaves */
.event-goal {
  animation: goalFlash 0.45s ease-in-out 3;
}

@keyframes goalFlash {
  0%, 100% { filter: brightness(1); }
  50% { filter: brightness(1.55); }
}

.special-panel:not(.hidden) {
  animation: specialPulse 1s infinite;
}

@keyframes specialPulse {
  0%, 100% { border-color: var(--blue); box-shadow: 0 0 0 rgba(49,95,132,0); }
  50% { border-color: var(--orange); box-shadow: 0 0 18px rgba(217,134,25,.28); }
}

@media(max-width:560px){
  .cg-logo {
    width: min(240px, 78vw);
  }

  .watch-top-labels {
    font-size: .56rem;
  }

  .watch-footer-labels {
    font-size: .52rem;
  }
}


/* ===== CronoGol v1.7.4: limpieza de logo duplicado ===== */

.cg-header {
  text-align: center;
  margin: 10px auto 14px;
}

.cg-logo {
  width: min(360px, 90vw);
  height: auto;
  display: block;
  margin: 0 auto 14px;
  filter: drop-shadow(0 4px 0 #111) drop-shadow(0 10px 20px rgba(0,0,0,.42));
  cursor: pointer;
}

.cg-logo-static {
  width: min(360px, 88vw);
  margin: 0 auto 18px;
}

.cg-subtitle {
  display: none;
}

/* En la home el logo ya contiene CronoGol y claim; evitamos duplicidad visual. */
.app-header.cg-header .watch-brand {
  display: none;
}

/* En páginas estáticas, si queda alguna marca duplicada tras el logo, se oculta. */
.static-card > .cg-logo + .watch-brand,
.static-card > .cg-logo + .watch-brand + .subtitle {
  display: none;
}

/* El debug sigue activo tocando 5 veces el logo. */
#version-tap-target {
  -webkit-tap-highlight-color: transparent;
}

/* Ligero ajuste para que la home respire mejor en móvil */
.setup-card {
  margin-top: 12px;
}

.hero-lcd {
  margin-bottom: 12px;
}

@media(max-width:560px){
  .cg-logo {
    width: min(310px, 86vw);
    margin-bottom: 10px;
  }

  .cg-logo-static {
    width: min(310px, 84vw);
  }
}


/* ===== CronoGol v1.7.5: logo oscuro integrado ===== */

.cg-header {
  margin: 6px auto 10px;
}

.cg-logo {
  width: min(430px, 94vw);
  max-height: 170px;
  object-fit: contain;
  margin: 0 auto 10px;
  filter: drop-shadow(0 10px 22px rgba(0,0,0,.45));
  border-radius: 8px;
}

.cg-logo-static {
  width: min(460px, 92vw);
  max-height: 180px;
  object-fit: contain;
}

@media(max-width:560px){
  .cg-logo {
    width: min(350px, 92vw);
    max-height: 135px;
    margin-bottom: 8px;
  }

  .cg-logo-static {
    width: min(340px, 90vw);
  }
}


/* ===== CronoGol v1.7.6: nuevo logo integrado ===== */

.cg-header {
  margin: 6px auto 10px;
  text-align: center;
}

.cg-logo {
  width: min(520px, 96vw);
  max-height: 220px;
  object-fit: contain;
  margin: 0 auto 10px;
  filter: drop-shadow(0 10px 20px rgba(0,0,0,.38));
  border-radius: 10px;
}

.cg-logo-static {
  width: min(540px, 94vw);
  max-height: 230px;
  object-fit: contain;
  margin: 0 auto 16px;
}

@media(max-width:560px){
  .cg-logo {
    width: min(360px, 94vw);
    max-height: 150px;
    margin-bottom: 8px;
  }

  .cg-logo-static {
    width: min(350px, 92vw);
    max-height: 160px;
  }
}


/* ===== CronoGol v1.7.7: logo fuera del reloj + selector idioma ===== */

.app {
  position: relative;
  padding-top: 44px;
}

.top-language-switch {
  position: fixed;
  top: 10px;
  right: 12px;
  z-index: 60;
  display: inline-flex;
  gap: 4px;
  padding: 4px;
  border: 1px solid rgba(216,216,200,.20);
  background: rgba(3,8,7,.72);
  backdrop-filter: blur(6px);
  border-radius: 999px;
}

.lang-btn {
  min-width: 34px;
  height: 28px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #d9d9c3;
  font-family: "Courier New", monospace;
  font-size: .72rem;
  font-weight: 900;
  cursor: pointer;
  letter-spacing: .5px;
}

.lang-btn.active {
  background: #d98619;
  color: #111;
}

.outside-logo-header {
  width: min(540px, 96vw);
  margin: 0 auto 10px;
  text-align: center;
}

.outside-logo-header .cg-logo {
  width: min(520px, 96vw);
  max-height: 190px;
  object-fit: contain;
  margin: 0 auto;
  display: block;
  filter: drop-shadow(0 10px 22px rgba(0,0,0,.42));
  border-radius: 10px;
  cursor: pointer;
}

/* Dentro del reloj ya no mostramos el logo grande. */
.setup-device .app-header.cg-header {
  display: none;
}

/* Evita que el reloj quede demasiado abajo tras sacar el logo. */
.screen-setup .device {
  margin-top: 0;
}

/* En la pantalla de partido mantenemos marca pequeña, no logo completo. */
.game-header .brand.small,
.watch-brand {
  font-size: .78rem;
  letter-spacing: 2px;
}

@media(max-width:560px){
  .app {
    padding-top: 42px;
  }

  .top-language-switch {
    top: 8px;
    right: 8px;
  }

  .lang-btn {
    min-width: 32px;
    height: 26px;
    font-size: .68rem;
  }

  .outside-logo-header {
    width: min(360px, 94vw);
    margin-bottom: 8px;
  }

  .outside-logo-header .cg-logo {
    width: min(350px, 94vw);
    max-height: 142px;
  }
}


/* ===== CronoGol v1.7.8: logo realmente fuera del reloj ===== */

.app {
  display: block;
  padding-top: 42px;
}

.outside-logo-header {
  width: min(620px, 96vw);
  margin: 0 auto 14px;
  text-align: center;
  position: relative;
  z-index: 5;
}

.outside-logo-header .cg-logo {
  width: min(560px, 96vw);
  max-height: 170px;
  object-fit: contain;
  display: block;
  margin: 0 auto;
  filter: drop-shadow(0 12px 24px rgba(0,0,0,.45));
  border-radius: 10px;
  cursor: pointer;
}

/* La pantalla inicial empieza debajo del logo, no lo envuelve. */
.screen-setup.active {
  display: block;
}

.screen-setup .setup-device {
  margin-top: 0;
}

/* En setup quitamos etiquetas superiores para que no parezca que el logo está dentro del reloj. */
.screen-setup .watch-top-labels {
  display: none;
}

/* Ajusta el LCD inicial para que no compita tanto con el logo. */
.hero-lcd {
  padding: 16px;
}

.hero-lcd h1 {
  font-size: 34px;
}

.hero-lcd p {
  font-size: 14px;
}

/* Evita que el logo quede oculto por el contenedor del reloj en móviles. */
@media(max-width:560px){
  .app {
    padding-top: 40px;
  }

  .outside-logo-header {
    width: min(380px, 94vw);
    margin-bottom: 10px;
  }

  .outside-logo-header .cg-logo {
    width: min(360px, 94vw);
    max-height: 118px;
  }

  .hero-lcd h1 {
    font-size: 30px;
  }
}


/* ===== CronoGol v1.7.9: fix selector idioma ===== */

.top-language-switch {
  position: fixed;
  top: 10px;
  right: 12px;
  z-index: 999;
  display: inline-flex;
  gap: 4px;
  padding: 4px;
  border: 1px solid rgba(216,216,200,.25);
  background: rgba(3,8,7,.80);
  backdrop-filter: blur(6px);
  border-radius: 999px;
  box-shadow: 0 8px 18px rgba(0,0,0,.35);
}

.lang-btn {
  appearance: none;
  -webkit-appearance: none;
  min-width: 34px;
  height: 28px;
  padding: 0 8px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #d9d9c3;
  font-family: "Courier New", monospace;
  font-size: .72rem;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
  letter-spacing: .5px;
}

.lang-btn.active {
  background: #d98619;
  color: #111;
}

@media(max-width:560px){
  .top-language-switch {
    top: 8px;
    right: 8px;
  }

  .lang-btn {
    min-width: 32px;
    height: 26px;
    font-size: .68rem;
  }
}


/* ===== CronoGol v1.8.0: logo integrado + EN reglas ===== */

.outside-logo-header.brand-plate {
  width: min(520px, 92vw);
  margin: 0 auto 10px;
  padding: 8px 12px;
  border: 2px solid rgba(49,95,132,.55);
  border-radius: 18px;
  background:
    linear-gradient(145deg, rgba(58,58,58,.38), rgba(5,7,7,.72)),
    radial-gradient(circle at center, rgba(49,95,132,.12), transparent 68%);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.05),
    0 12px 26px rgba(0,0,0,.38);
}

.outside-logo-header.brand-plate .cg-logo {
  width: min(455px, 86vw);
  max-height: 128px;
  object-fit: contain;
  margin: 0 auto;
  display: block;
  filter: drop-shadow(0 8px 18px rgba(0,0,0,.52));
  border-radius: 0;
  background: transparent;
}

.screen-setup .setup-device {
  margin-left: auto;
  margin-right: auto;
}

@media(max-width:560px){
  .outside-logo-header.brand-plate {
    width: min(352px, 92vw);
    padding: 6px 8px;
    margin-bottom: 8px;
    border-radius: 14px;
  }

  .outside-logo-header.brand-plate .cg-logo {
    width: min(320px, 86vw);
    max-height: 92px;
  }
}


/* ===== CronoGol v1.8.1: modal rules readability ===== */
.modal-card {
  width: min(94vw, 560px);
}

.modal-card .donation-item {
  line-height: 1.45;
}

@media(max-width:560px){
  .modal-card {
    width: min(96vw, 480px);
    padding: 16px;
  }
}
