:root {
  --qhdt-bg: #050d18;
  --qhdt-panel: #091827;
  --qhdt-panel-2: #0d2237;
  --qhdt-line: rgba(124, 225, 255, .18);
  --qhdt-text: #f7fbff;
  --qhdt-muted: #9ab0c5;
  --qhdt-green: #7ee900;
  --qhdt-green-2: #b4ff42;
  --qhdt-blue: #00a8ff;
  --qhdt-yellow: #ffd323;
  --qhdt-red: #ff5c5c;
  --qhdt-purple: #aa75ff;
  --qhdt-radius: 24px;
  --qhdt-shadow: 0 28px 80px rgba(0, 0, 0, .45);
}

.qhdt-shell,
.qhdt-shell * {
  box-sizing: border-box;
}

.qhdt-shell {
  position: relative;
  width: 100%;
  min-height: 760px;
  padding: clamp(12px, 2.5vw, 30px);
  overflow: hidden;
  color: var(--qhdt-text);
  background:
    radial-gradient(circle at 50% 100%, rgba(66, 216, 0, .17), transparent 38%),
    linear-gradient(145deg, #030914, #071626 58%, #06101d);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  isolation: isolate;
}

.qhdt-shell button,
.qhdt-shell input {
  font: inherit;
}

.qhdt-backdrop,
.qhdt-grid,
.qhdt-glow {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.qhdt-grid {
  opacity: .16;
  background-image:
    linear-gradient(rgba(84, 196, 255, .16) 1px, transparent 1px),
    linear-gradient(90deg, rgba(84, 196, 255, .16) 1px, transparent 1px);
  background-size: 42px 42px;
  transform: perspective(600px) rotateX(62deg) scale(1.35) translateY(26%);
  transform-origin: bottom center;
}

.qhdt-glow {
  width: 340px;
  height: 340px;
  border-radius: 50%;
  filter: blur(80px);
  opacity: .18;
}

.qhdt-glow-one {
  left: -110px;
  top: 8%;
  background: var(--qhdt-blue);
}

.qhdt-glow-two {
  inset: auto -120px 2% auto;
  background: var(--qhdt-green);
}

.qhdt-app-card {
  position: relative;
  z-index: 1;
  width: min(100%, 760px);
  min-height: 700px;
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid rgba(110, 213, 255, .22);
  border-radius: clamp(20px, 4vw, 34px);
  background: rgba(5, 15, 27, .94);
  box-shadow: var(--qhdt-shadow), inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter: blur(16px);
}

.qhdt-topbar {
  min-height: 68px;
  padding: 10px 14px;
  display: grid;
  grid-template-columns: 48px 1fr auto;
  gap: 8px;
  align-items: center;
  border-bottom: 1px solid var(--qhdt-line);
  background: rgba(5, 14, 25, .88);
}

.qhdt-brand-mini {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-width: 0;
  font-weight: 900;
  letter-spacing: -.02em;
  text-transform: uppercase;
}

.qhdt-brand-mini img {
  width: 42px;
  height: 42px;
  object-fit: contain;
  border-radius: 10px;
}

.qhdt-brand-mini span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.qhdt-icon-button {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(122, 218, 255, .18);
  border-radius: 14px;
  color: var(--qhdt-text);
  background: rgba(18, 43, 66, .72);
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}

.qhdt-icon-button:hover,
.qhdt-icon-button:focus-visible {
  transform: translateY(-2px);
  border-color: var(--qhdt-green);
  background: rgba(40, 75, 51, .65);
  outline: none;
}

.qhdt-stage {
  min-height: 590px;
  padding: clamp(20px, 4vw, 38px);
}

.qhdt-loading {
  min-height: 490px;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 14px;
  color: var(--qhdt-muted);
  text-align: center;
}

.qhdt-ball-loader {
  font-size: 46px;
  animation: qhdt-bounce 1s ease-in-out infinite;
}

@keyframes qhdt-bounce {
  0%, 100% { transform: translateY(0) rotate(0); }
  50% { transform: translateY(-16px) rotate(18deg); }
}

.qhdt-home {
  display: grid;
  justify-items: center;
  gap: 22px;
  text-align: center;
  animation: qhdt-enter .35s ease both;
}

.qhdt-logo-large {
  width: min(76vw, 330px);
  aspect-ratio: 1;
  object-fit: contain;
  filter: drop-shadow(0 18px 34px rgba(0,0,0,.35));
}

.qhdt-kicker,
.qhdt-label {
  margin: 0;
  color: var(--qhdt-green-2);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.qhdt-home h1,
.qhdt-result h2,
.qhdt-ranking h2,
.qhdt-info h2 {
  margin: 0;
  font-size: clamp(28px, 6vw, 52px);
  line-height: .98;
  letter-spacing: -.045em;
  text-transform: uppercase;
}

.qhdt-lead {
  max-width: 580px;
  margin: 0;
  color: #c5d4e2;
  font-size: clamp(16px, 2.8vw, 20px);
  line-height: 1.55;
}

.qhdt-home-stats {
  width: min(100%, 560px);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.qhdt-stat {
  min-height: 88px;
  padding: 16px 10px;
  display: grid;
  place-content: center;
  gap: 5px;
  border: 1px solid rgba(103, 202, 255, .16);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(16, 43, 67, .82), rgba(8, 25, 41, .84));
}

.qhdt-stat strong {
  color: var(--qhdt-green-2);
  font-size: 24px;
  line-height: 1;
}

.qhdt-stat span {
  color: var(--qhdt-muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.qhdt-name-field {
  width: min(100%, 460px);
  display: grid;
  gap: 8px;
  text-align: left;
}

.qhdt-name-field span {
  color: var(--qhdt-muted);
  font-size: 13px;
  font-weight: 700;
}

.qhdt-name-field input,
.qhdt-shell input[type="text"] {
  width: 100%;
  height: 52px;
  padding: 0 16px;
  border: 1px solid rgba(108, 201, 255, .28) !important;
  border-radius: 14px;
  color: #f7fbff !important;
  -webkit-text-fill-color: #f7fbff !important;
  caret-color: var(--qhdt-green-2) !important;
  background: #061321 !important;
  background-color: #061321 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
  color-scheme: dark;
  outline: none;
  opacity: 1 !important;
}

.qhdt-name-field input::placeholder,
.qhdt-shell input[type="text"]::placeholder {
  color: #8198ad !important;
  -webkit-text-fill-color: #8198ad !important;
  opacity: 1 !important;
}

.qhdt-name-field input:-webkit-autofill,
.qhdt-name-field input:-webkit-autofill:hover,
.qhdt-name-field input:-webkit-autofill:focus,
.qhdt-shell input[type="text"]:-webkit-autofill {
  color: #f7fbff !important;
  -webkit-text-fill-color: #f7fbff !important;
  caret-color: var(--qhdt-green-2) !important;
  -webkit-box-shadow: 0 0 0 1000px #061321 inset !important;
  box-shadow: 0 0 0 1000px #061321 inset !important;
  transition: background-color 9999s ease-out 0s;
}

.qhdt-name-field input:focus,
.qhdt-shell input[type="text"]:focus {
  border-color: var(--qhdt-green) !important;
  box-shadow: 0 0 0 3px rgba(126, 233, 0, .13), inset 0 1px 0 rgba(255,255,255,.04) !important;
}

.qhdt-actions,
.qhdt-result-actions {
  width: min(100%, 520px);
  display: grid;
  gap: 10px;
}

.qhdt-button {
  min-height: 54px;
  padding: 14px 20px;
  border: 0;
  border-radius: 15px;
  font-weight: 900;
  letter-spacing: .015em;
  cursor: pointer;
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}

.qhdt-button:hover,
.qhdt-button:focus-visible {
  transform: translateY(-2px);
  filter: brightness(1.06);
  outline: none;
}

.qhdt-button-primary {
  color: #071009;
  background: linear-gradient(180deg, var(--qhdt-green-2), var(--qhdt-green));
  box-shadow: 0 12px 28px rgba(116, 225, 0, .2);
}

.qhdt-button-secondary {
  color: var(--qhdt-text);
  border: 1px solid rgba(115, 207, 255, .25);
  background: linear-gradient(180deg, rgba(19, 54, 82, .95), rgba(10, 33, 52, .95));
}

.qhdt-button-ghost {
  color: #c6d7e6;
  border: 1px solid rgba(122, 203, 240, .18);
  background: rgba(5, 17, 30, .55);
}

.qhdt-duel-banner {
  width: min(100%, 560px);
  padding: 15px 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border: 1px solid rgba(255, 211, 35, .35);
  border-radius: 16px;
  color: #fff4b1;
  background: rgba(100, 76, 7, .24);
}

.qhdt-game {
  animation: qhdt-enter .28s ease both;
}

.qhdt-progress-wrap {
  margin-bottom: 18px;
}

.qhdt-progress-meta {
  margin-bottom: 8px;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  color: var(--qhdt-muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.qhdt-progress {
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
}

.qhdt-progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--qhdt-blue), var(--qhdt-green));
  transition: width .35s ease;
}

.qhdt-scoreboard {
  padding: 14px 16px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(108, 211, 255, .2);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(15, 48, 75, .9), rgba(6, 23, 39, .92));
}

.qhdt-team {
  color: #dbe9f5;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.qhdt-team:last-child {
  text-align: right;
}

.qhdt-score-center {
  min-width: 112px;
  text-align: center;
}

.qhdt-minute {
  display: block;
  margin-bottom: 2px;
  color: var(--qhdt-green-2);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.qhdt-score {
  font-size: 30px;
  font-weight: 950;
  letter-spacing: .06em;
}

.qhdt-situation {
  margin: 20px 0;
  padding: clamp(18px, 4vw, 26px);
  border: 1px solid rgba(126, 233, 0, .23);
  border-radius: 20px;
  background:
    linear-gradient(145deg, rgba(17, 43, 42, .76), rgba(6, 24, 34, .88)),
    repeating-linear-gradient(90deg, rgba(126,233,0,.025) 0 1px, transparent 1px 22px);
}

.qhdt-situation h2 {
  margin: 6px 0 12px;
  font-size: clamp(22px, 4.6vw, 34px);
  line-height: 1.06;
  letter-spacing: -.025em;
}

.qhdt-situation p {
  margin: 0;
  color: #d2dfeb;
  font-size: clamp(15px, 2.6vw, 18px);
  line-height: 1.55;
}

.qhdt-question {
  margin: 22px 0 11px;
  color: var(--qhdt-green-2);
  font-size: 14px;
  font-weight: 950;
  letter-spacing: .1em;
  text-align: center;
  text-transform: uppercase;
}

.qhdt-options {
  display: grid;
  gap: 10px;
}

.qhdt-option {
  width: 100%;
  min-height: 68px;
  padding: 11px 14px;
  display: grid;
  grid-template-columns: 44px 1fr;
  align-items: center;
  gap: 13px;
  border: 1px solid rgba(105, 205, 255, .2);
  border-radius: 15px;
  color: var(--qhdt-text);
  text-align: left;
  background: linear-gradient(145deg, rgba(14, 43, 66, .95), rgba(8, 25, 42, .96));
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, background .16s ease;
}

.qhdt-option:nth-child(2) { border-color: rgba(126,233,0,.25); }
.qhdt-option:nth-child(3) { border-color: rgba(255,211,35,.26); }
.qhdt-option:nth-child(4) { border-color: rgba(170,117,255,.3); }

.qhdt-option:hover,
.qhdt-option:focus-visible {
  transform: translateX(4px);
  border-color: var(--qhdt-green);
  background: linear-gradient(145deg, rgba(31, 70, 55, .95), rgba(10, 36, 42, .96));
  outline: none;
}

.qhdt-option:disabled {
  cursor: default;
  opacity: .45;
  transform: none;
}

.qhdt-option.is-selected {
  opacity: 1;
  border-color: var(--qhdt-green);
  box-shadow: 0 0 0 2px rgba(126, 233, 0, .13);
}

.qhdt-option-key {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  color: #08111b;
  background: linear-gradient(180deg, #96e7ff, #30a9e9);
  font-size: 21px;
  font-weight: 950;
}

.qhdt-option:nth-child(2) .qhdt-option-key { background: linear-gradient(180deg, var(--qhdt-green-2), var(--qhdt-green)); }
.qhdt-option:nth-child(3) .qhdt-option-key { background: linear-gradient(180deg, #ffe56a, var(--qhdt-yellow)); }
.qhdt-option:nth-child(4) .qhdt-option-key { background: linear-gradient(180deg, #d0b3ff, var(--qhdt-purple)); }

.qhdt-option-text {
  font-size: 15px;
  font-weight: 800;
  line-height: 1.3;
}

.qhdt-feedback {
  margin-top: 14px;
  padding: 17px;
  border: 1px solid rgba(126, 233, 0, .28);
  border-radius: 15px;
  background: rgba(41, 76, 35, .34);
  animation: qhdt-enter .24s ease both;
}

.qhdt-feedback strong {
  display: block;
  margin-bottom: 5px;
  color: var(--qhdt-green-2);
  text-transform: uppercase;
}

.qhdt-feedback p {
  margin: 0 0 14px;
  color: #d9e7d6;
  line-height: 1.5;
}

.qhdt-feedback .qhdt-button {
  width: 100%;
}

.qhdt-result {
  display: grid;
  justify-items: center;
  gap: 18px;
  text-align: center;
  animation: qhdt-enter .35s ease both;
}

.qhdt-result-badge {
  padding: 8px 14px;
  border: 1px solid rgba(126,233,0,.3);
  border-radius: 999px;
  color: var(--qhdt-green-2);
  background: rgba(50, 90, 31, .3);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.qhdt-final-score {
  width: min(100%, 520px);
  padding: 22px;
  border: 1px solid rgba(91, 204, 255, .22);
  border-radius: 22px;
  background: linear-gradient(145deg, rgba(14, 47, 73, .92), rgba(5, 23, 39, .96));
}

.qhdt-final-score .qhdt-match-result {
  display: block;
  font-size: clamp(48px, 12vw, 80px);
  font-weight: 950;
  letter-spacing: .06em;
  line-height: 1;
}

.qhdt-final-score small {
  display: block;
  margin-top: 7px;
  color: var(--qhdt-muted);
  font-weight: 800;
  text-transform: uppercase;
}

.qhdt-score-ring {
  position: relative !important;
  width: 176px;
  height: 176px;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 176px;
  overflow: hidden;
  border-radius: 50% !important;
  background: conic-gradient(var(--qhdt-green) calc(var(--score) * 1%), rgba(255,255,255,.09) 0);
  box-shadow: 0 0 38px rgba(126,233,0,.15), inset 0 0 0 1px rgba(255,255,255,.04);
  isolation: isolate;
}

.qhdt-score-ring::before {
  content: "";
  position: absolute !important;
  inset: 15px !important;
  z-index: 0;
  border: 1px solid rgba(71, 192, 255, .22);
  border-radius: 50% !important;
  background: radial-gradient(circle at 50% 35%, #10314b 0, #071522 64%);
  box-shadow: inset 0 0 28px rgba(0,0,0,.34);
}

.qhdt-score-ring-inner {
  position: absolute !important;
  inset: 22px !important;
  z-index: 1;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: center !important;
  transform: none !important;
}

.qhdt-score-number {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #ffffff !important;
  font-family: inherit !important;
  font-size: 58px !important;
  font-weight: 950 !important;
  line-height: .9 !important;
  letter-spacing: -.04em !important;
  text-shadow: 0 2px 0 #06111f, 0 0 20px rgba(42, 190, 255, .5) !important;
}

.qhdt-score-ring small {
  display: block !important;
  margin: 0 !important;
  color: #9fc2d8 !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  line-height: 1.15 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
}

.qhdt-profile-card,
.qhdt-duel-result,
.qhdt-decisions-summary,
.qhdt-traits {
  width: min(100%, 560px);
  padding: 20px;
  border: 1px solid rgba(107, 204, 255, .18);
  border-radius: 18px;
  background: rgba(10, 30, 48, .84);
}

.qhdt-profile-card h3,
.qhdt-duel-result h3,
.qhdt-decisions-summary h3,
.qhdt-traits h3 {
  margin: 0 0 8px;
  font-size: 18px;
  text-transform: uppercase;
}

.qhdt-profile-card p,
.qhdt-duel-result p {
  margin: 0;
  color: var(--qhdt-muted);
  line-height: 1.5;
}

.qhdt-trait {
  display: grid;
  grid-template-columns: 88px 1fr 36px;
  align-items: center;
  gap: 10px;
  margin-top: 11px;
  color: #d9e6f1;
  font-size: 12px;
  font-weight: 800;
}

.qhdt-trait-track {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
}

.qhdt-trait-track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--qhdt-blue), var(--qhdt-green));
}

.qhdt-decision-line {
  padding: 12px 0;
  text-align: left;
  border-top: 1px solid rgba(255,255,255,.08);
}

.qhdt-decision-line:first-of-type {
  border-top: 0;
}

.qhdt-decision-line strong {
  display: block;
  margin-bottom: 4px;
  color: var(--qhdt-green-2);
}

.qhdt-decision-line span {
  color: var(--qhdt-muted);
  font-size: 13px;
  line-height: 1.4;
}

.qhdt-duel-score {
  margin: 14px 0;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 14px;
}

.qhdt-duel-player {
  padding: 14px 10px;
  border-radius: 14px;
  background: rgba(255,255,255,.05);
}

.qhdt-duel-player strong {
  display: block;
  color: var(--qhdt-green-2);
  font-size: 28px;
}

.qhdt-ranking,
.qhdt-info,
.qhdt-error {
  animation: qhdt-enter .3s ease both;
}

.qhdt-ranking-header,
.qhdt-info-header {
  margin-bottom: 20px;
  text-align: center;
}

.qhdt-ranking-table {
  overflow: hidden;
  border: 1px solid rgba(104, 205, 255, .18);
  border-radius: 18px;
}

.qhdt-rank-row {
  min-height: 58px;
  padding: 10px 14px;
  display: grid;
  grid-template-columns: 42px 1fr auto;
  align-items: center;
  gap: 10px;
  border-top: 1px solid rgba(255,255,255,.07);
  background: rgba(9, 29, 47, .75);
}

.qhdt-rank-row:first-child {
  border-top: 0;
}

.qhdt-rank-position {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  color: #08111b;
  background: #a8c2d6;
  font-weight: 950;
}

.qhdt-rank-row:nth-child(1) .qhdt-rank-position { background: var(--qhdt-yellow); }
.qhdt-rank-row:nth-child(2) .qhdt-rank-position { background: #d9e5ef; }
.qhdt-rank-row:nth-child(3) .qhdt-rank-position { background: #d59558; }

.qhdt-rank-name {
  min-width: 0;
}

.qhdt-rank-name strong,
.qhdt-rank-name span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.qhdt-rank-name span {
  margin-top: 2px;
  color: var(--qhdt-muted);
  font-size: 11px;
}

.qhdt-rank-score {
  color: var(--qhdt-green-2);
  font-size: 20px;
  font-weight: 950;
}

.qhdt-empty {
  padding: 34px 20px;
  color: var(--qhdt-muted);
  text-align: center;
}

.qhdt-info-list {
  display: grid;
  gap: 12px;
}

.qhdt-info-item {
  padding: 17px;
  display: grid;
  grid-template-columns: 38px 1fr;
  gap: 12px;
  border: 1px solid rgba(108, 205, 255, .17);
  border-radius: 16px;
  background: rgba(9, 29, 47, .75);
}

.qhdt-info-item strong {
  display: block;
  margin-bottom: 3px;
}

.qhdt-info-item p {
  margin: 0;
  color: var(--qhdt-muted);
  line-height: 1.5;
}

.qhdt-error {
  min-height: 470px;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 16px;
  text-align: center;
}

.qhdt-error-icon {
  font-size: 50px;
}

.qhdt-error p {
  max-width: 460px;
  margin: 0;
  color: var(--qhdt-muted);
  line-height: 1.55;
}

.qhdt-footer {
  min-height: 48px;
  padding: 12px 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-top: 1px solid var(--qhdt-line);
  color: #768da3;
  font-size: 11px;
  font-weight: 700;
}

.qhdt-footer a {
  color: #9fcae5;
  text-decoration: none;
}

.qhdt-toast {
  position: fixed;
  z-index: 999999;
  left: 50%;
  bottom: 24px;
  transform: translateX(-50%);
  padding: 12px 18px;
  border: 1px solid rgba(126,233,0,.4);
  border-radius: 12px;
  color: #071109;
  background: var(--qhdt-green-2);
  box-shadow: 0 14px 40px rgba(0,0,0,.36);
  font-weight: 900;
}

@keyframes qhdt-enter {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 560px) {
  .qhdt-shell {
    min-height: 100vh;
    padding: 0;
  }

  .qhdt-app-card {
    min-height: 100vh;
    border: 0;
    border-radius: 0;
  }

  .qhdt-stage {
    min-height: calc(100vh - 116px);
    padding: 18px 15px 24px;
  }

  .qhdt-brand-mini span {
    font-size: 13px;
  }

  .qhdt-home-stats {
    gap: 6px;
  }

  .qhdt-stat {
    min-height: 78px;
    padding: 12px 6px;
  }

  .qhdt-stat strong { font-size: 20px; }
  .qhdt-stat span { font-size: 9px; }

  .qhdt-scoreboard {
    padding: 12px 10px;
  }

  .qhdt-team {
    font-size: 10px;
  }

  .qhdt-score-center {
    min-width: 92px;
  }

  .qhdt-score {
    font-size: 25px;
  }

  .qhdt-option {
    min-height: 62px;
    grid-template-columns: 38px 1fr;
    gap: 10px;
  }

  .qhdt-option-key {
    width: 36px;
    height: 36px;
    font-size: 18px;
  }

  .qhdt-option-text {
    font-size: 14px;
  }

  .qhdt-footer {
    justify-content: center;
  }

  .qhdt-footer span {
    display: none;
  }
}

/*
 * El juego controla de forma estricta los hijos directos de su tarjeta y del
 * escenario. Esto evita que sistemas de anuncios automáticos inserten bloques
 * entre la barra superior y la pantalla del juego.
 */
.qhdt-app-card > :not(.qhdt-topbar):not(.qhdt-stage):not(.qhdt-footer),
.qhdt-stage > :not(.qhdt-loading):not(.qhdt-home):not(.qhdt-game):not(.qhdt-result):not(.qhdt-ranking):not(.qhdt-info):not(.qhdt-error):not(.qhdt-trivia):not(.qhdt-trivia-result):not(.qhdt-profile):not(.qhdt-share):not(.qhdt-auth):not(.qhdt-verify):not(.qhdt-link-history):not(.qhdt-competitions):not(.qhdt-competition-join):not(.qhdt-competition-ranking):not(.qhdt-tutorial):not(.qhdt-leagues):not(.qhdt-league-create):not(.qhdt-league-detail):not(.qhdt-account-settings) {
  display: none !important;
}

.qhdt-shell ins.adsbygoogle,
.qhdt-shell .google-auto-placed,
.qhdt-shell [data-ad-client],
.qhdt-shell [data-ad-slot],
.qhdt-shell [id^="google_ads_"],
.qhdt-shell [id^="google_ads_iframe_"],
.qhdt-shell iframe[id^="aswift_"],
.qhdt-shell iframe[src*="googlesyndication"],
.qhdt-shell iframe[src*="doubleclick"],
body.qhdt-fullscreen-body > ins.adsbygoogle,
body.qhdt-fullscreen-body > .google-auto-placed {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
  visibility: hidden !important;
}

@media (prefers-reduced-motion: reduce) {
  .qhdt-shell *,
  .qhdt-shell *::before,
  .qhdt-shell *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

body.qhdt-fullscreen-body {
  margin: 0;
  min-height: 100vh;
  background: #050d18;
}

body.qhdt-fullscreen-body #wpadminbar ~ .qhdt-shell {
  min-height: calc(100vh - 32px);
}

body.qhdt-fullscreen-body .qhdt-shell {
  min-height: 100vh;
}

@media screen and (max-width: 782px) {
  body.qhdt-fullscreen-body #wpadminbar ~ .qhdt-shell {
    min-height: calc(100vh - 46px);
  }
}

/* --------------------------------------------------------------------------
 * v1.2.0 · Un intento oficial, Trivia Futbolera y revancha
 * ----------------------------------------------------------------------- */

.qhdt-logo-compact {
  width: min(48vw, 190px);
  aspect-ratio: 1;
  object-fit: contain;
  filter: drop-shadow(0 14px 28px rgba(0,0,0,.34));
}

.qhdt-completed-home {
  align-content: start;
}

.qhdt-official-summary {
  width: min(100%, 470px);
  padding: 18px 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  border: 1px solid rgba(80, 202, 255, .24);
  border-radius: 20px;
  background: linear-gradient(145deg, rgba(15, 49, 76, .96), rgba(6, 24, 41, .96));
  text-align: left;
}

.qhdt-official-score {
  min-width: 94px;
  color: #fff;
  font-size: 68px;
  font-weight: 950;
  line-height: .9;
  text-align: center;
  text-shadow: 0 0 22px rgba(0, 168, 255, .38);
}

.qhdt-official-summary div {
  min-width: 0;
}

.qhdt-official-summary strong,
.qhdt-official-summary small {
  display: block;
}

.qhdt-official-summary strong {
  font-size: 19px;
  text-transform: uppercase;
}

.qhdt-official-summary small {
  margin-top: 4px;
  color: var(--qhdt-muted);
  font-weight: 800;
}

.qhdt-rematch-badge,
.qhdt-first-try-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 12px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.qhdt-rematch-badge {
  color: #ffe89a;
  border: 1px solid rgba(255, 211, 35, .33);
  background: rgba(98, 76, 8, .28);
}

.qhdt-first-try-badge {
  color: #d7ffad;
  border: 1px solid rgba(126, 233, 0, .28);
  background: rgba(45, 89, 22, .28);
}

.qhdt-status-copy {
  max-width: 540px;
  margin: 0;
  color: #bdccda;
  font-size: 15px;
  line-height: 1.55;
}

.qhdt-rematch-strip {
  margin-bottom: 16px;
  padding: 10px 14px;
  border: 1px solid rgba(255, 211, 35, .32);
  border-radius: 13px;
  color: #fff0a6;
  background: rgba(91, 69, 4, .27);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .04em;
  text-align: center;
  text-transform: uppercase;
}

.qhdt-result-notice {
  width: min(100%, 560px);
  padding: 14px 17px;
  display: grid;
  gap: 4px;
  border: 1px solid rgba(255, 211, 35, .26);
  border-radius: 15px;
  color: #fff2b3;
  background: rgba(91, 68, 4, .24);
}

.qhdt-result-notice.is-success {
  color: #ddffbc;
  border-color: rgba(126, 233, 0, .34);
  background: rgba(44, 90, 21, .27);
}

.qhdt-result-notice strong {
  text-transform: uppercase;
}

.qhdt-result-notice span {
  color: inherit;
  font-size: 13px;
  line-height: 1.45;
}

.qhdt-trivia-intro,
.qhdt-trivia,
.qhdt-trivia-result {
  animation: qhdt-enter .3s ease both;
}

.qhdt-trivia-intro,
.qhdt-trivia-result {
  display: grid;
  justify-items: center;
  gap: 20px;
  text-align: center;
}

.qhdt-trivia-icon,
.qhdt-trivia-result-icon {
  width: 94px;
  height: 94px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(126, 233, 0, .25);
  border-radius: 50%;
  background: radial-gradient(circle at 50% 35%, rgba(36, 91, 61, .92), rgba(6, 23, 38, .98));
  box-shadow: 0 0 36px rgba(126, 233, 0, .12);
  font-size: 38px;
}

.qhdt-trivia-rules {
  width: min(100%, 520px);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 9px;
}

.qhdt-trivia-rules div {
  min-height: 86px;
  display: grid;
  place-content: center;
  gap: 4px;
  border: 1px solid rgba(90, 200, 255, .18);
  border-radius: 15px;
  background: rgba(10, 31, 50, .82);
}

.qhdt-trivia-rules strong {
  color: var(--qhdt-green-2);
  font-size: 26px;
}

.qhdt-trivia-rules span {
  color: var(--qhdt-muted);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.qhdt-warning-box {
  width: min(100%, 540px);
  padding: 16px 18px;
  border: 1px solid rgba(255, 211, 35, .27);
  border-radius: 16px;
  color: #fff0ad;
  background: rgba(96, 73, 6, .23);
  text-align: left;
}

.qhdt-warning-box strong {
  display: block;
  margin-bottom: 4px;
  text-transform: uppercase;
}

.qhdt-warning-box p {
  margin: 0;
  color: #e6dcae;
  line-height: 1.5;
}

.qhdt-trivia-topline {
  margin-bottom: 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.qhdt-trivia-topline div span,
.qhdt-trivia-topline div strong {
  display: block;
}

.qhdt-trivia-topline div span {
  color: var(--qhdt-muted);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.qhdt-trivia-topline div strong {
  margin-top: 2px;
  font-size: 15px;
}

.qhdt-difficulty {
  padding: 7px 11px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.qhdt-difficulty.is-easy {
  color: #d9ffb4;
  border: 1px solid rgba(126, 233, 0, .28);
  background: rgba(45, 92, 21, .28);
}

.qhdt-difficulty.is-medium {
  color: #fff0a8;
  border: 1px solid rgba(255, 211, 35, .3);
  background: rgba(91, 70, 5, .27);
}

.qhdt-difficulty.is-hard {
  color: #ffc7c7;
  border: 1px solid rgba(255, 92, 92, .3);
  background: rgba(94, 26, 26, .27);
}

.qhdt-timer {
  margin-bottom: 18px;
  display: grid;
  grid-template-columns: 88px 1fr;
  align-items: center;
  gap: 14px;
}

.qhdt-timer-value {
  width: 84px;
  height: 84px;
  display: grid;
  place-content: center;
  border: 1px solid rgba(126, 233, 0, .28);
  border-radius: 50%;
  background: #071827;
  text-align: center;
  box-shadow: inset 0 0 22px rgba(0,0,0,.3), 0 0 24px rgba(126,233,0,.08);
}

.qhdt-timer-value strong,
.qhdt-timer-value small {
  display: block;
}

.qhdt-timer-value strong {
  color: #fff;
  font-size: 34px;
  line-height: .95;
}

.qhdt-timer-value small {
  margin-top: 3px;
  color: var(--qhdt-muted);
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

.qhdt-timer-track {
  height: 11px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
}

.qhdt-timer-track span {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--qhdt-red), var(--qhdt-yellow), var(--qhdt-green));
  transition: width .2s linear;
}

.qhdt-trivia-question {
  margin-bottom: 17px;
  padding: clamp(20px, 4vw, 30px);
  border: 1px solid rgba(105, 205, 255, .21);
  border-radius: 20px;
  background: linear-gradient(145deg, rgba(14, 47, 73, .92), rgba(5, 23, 39, .96));
}

.qhdt-trivia-question h2 {
  margin: 8px 0 0;
  font-size: clamp(22px, 4.5vw, 34px);
  line-height: 1.14;
  letter-spacing: -.025em;
}

.qhdt-trivia-options {
  display: grid;
  gap: 10px;
}

.qhdt-trivia-option {
  width: 100%;
  min-height: 64px;
  padding: 10px 14px;
  display: grid;
  grid-template-columns: 42px 1fr;
  align-items: center;
  gap: 12px;
  border: 1px solid rgba(103, 205, 255, .2);
  border-radius: 15px;
  color: #fff;
  background: linear-gradient(145deg, rgba(14, 43, 66, .96), rgba(8, 25, 42, .97));
  text-align: left;
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, background .16s ease;
}

.qhdt-trivia-option:hover,
.qhdt-trivia-option:focus-visible {
  transform: translateX(4px);
  border-color: var(--qhdt-green);
  background: linear-gradient(145deg, rgba(31, 70, 55, .96), rgba(10, 36, 42, .97));
  outline: none;
}

.qhdt-trivia-option:disabled {
  opacity: .48;
  cursor: default;
  transform: none;
}

.qhdt-trivia-option.is-selected {
  opacity: 1;
  border-color: var(--qhdt-green);
  box-shadow: 0 0 0 2px rgba(126, 233, 0, .12);
}

.qhdt-trivia-option > span {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  color: #07111b;
  background: linear-gradient(180deg, #a9eaff, #3bb4ef);
  font-size: 19px;
  font-weight: 950;
}

.qhdt-trivia-option:nth-child(2) > span { background: linear-gradient(180deg, var(--qhdt-green-2), var(--qhdt-green)); }
.qhdt-trivia-option:nth-child(3) > span { background: linear-gradient(180deg, #ffe779, var(--qhdt-yellow)); }
.qhdt-trivia-option:nth-child(4) > span { background: linear-gradient(180deg, #d4baff, var(--qhdt-purple)); }

.qhdt-trivia-option strong {
  font-size: 15px;
  line-height: 1.35;
}

.qhdt-trivia-feedback {
  margin-top: 14px;
  padding: 14px 16px;
  display: grid;
  gap: 3px;
  border-radius: 14px;
  text-align: center;
}

.qhdt-trivia-feedback.is-correct {
  color: #ddffbd;
  border: 1px solid rgba(126, 233, 0, .31);
  background: rgba(43, 91, 20, .29);
}

.qhdt-trivia-feedback.is-wrong {
  color: #ffd1d1;
  border: 1px solid rgba(255, 92, 92, .31);
  background: rgba(98, 27, 27, .28);
}

.qhdt-trivia-feedback strong {
  text-transform: uppercase;
}

.qhdt-trivia-feedback span {
  font-size: 12px;
  line-height: 1.4;
}

.qhdt-trivia-result h2 {
  margin: 0;
  font-size: clamp(28px, 6vw, 48px);
  line-height: 1;
  text-transform: uppercase;
}

.qhdt-trivia-score {
  width: 170px;
  height: 170px;
  display: grid;
  place-content: center;
  border: 14px solid var(--qhdt-green);
  border-radius: 50%;
  background: radial-gradient(circle at 50% 35%, #10314b, #071522 68%);
  box-shadow: 0 0 36px rgba(126, 233, 0, .14);
}

.qhdt-trivia-score strong,
.qhdt-trivia-score span {
  display: block;
}

.qhdt-trivia-score strong {
  color: #fff;
  font-size: 58px;
  line-height: .95;
}

.qhdt-trivia-score span {
  margin-top: 5px;
  color: var(--qhdt-muted);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.qhdt-ranking-note {
  margin: 14px 2px 0;
  color: var(--qhdt-muted);
  font-size: 11px;
  line-height: 1.45;
  text-align: center;
}

.qhdt-ranking-note span,
.qhdt-inline-rematch {
  color: var(--qhdt-yellow);
  font-weight: 950;
}

.qhdt-inline-rematch {
  display: inline !important;
  margin-left: 3px;
  overflow: visible !important;
  white-space: normal !important;
}

.qhdt-rank-row.is-rematch-score .qhdt-rank-position {
  box-shadow: inset 0 0 0 2px rgba(255, 211, 35, .42);
}

@media (max-width: 560px) {
  .qhdt-official-summary {
    gap: 14px;
    padding: 16px;
  }

  .qhdt-official-score {
    min-width: 78px;
    font-size: 56px;
  }

  .qhdt-trivia-rules {
    gap: 6px;
  }

  .qhdt-trivia-rules div {
    min-height: 76px;
  }

  .qhdt-timer {
    grid-template-columns: 70px 1fr;
  }

  .qhdt-timer-value {
    width: 68px;
    height: 68px;
  }

  .qhdt-timer-value strong {
    font-size: 28px;
  }

  .qhdt-trivia-option {
    grid-template-columns: 36px 1fr;
    padding: 9px 11px;
  }

  .qhdt-trivia-option > span {
    width: 34px;
    height: 34px;
    font-size: 17px;
  }
}

/* v1.2.1 · El indicador se asocia visualmente al puntaje de revancha. */
.qhdt-rank-score {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
  min-width: 58px;
  white-space: nowrap;
}

.qhdt-rank-score b {
  color: var(--qhdt-green-2);
  font: inherit;
}

.qhdt-rank-score .qhdt-inline-rematch {
  margin-left: 0;
  color: var(--qhdt-yellow);
  font-size: 17px;
  font-style: normal;
  line-height: 1;
}


/* --------------------------------------------------------------------------
 * v1.3.0 · Retención, rankings por período, perfil e insignias
 * ----------------------------------------------------------------------- */

.qhdt-top-actions {
  display: flex;
  align-items: center;
  gap: 7px;
}

.qhdt-profile,
.qhdt-share {
  animation: qhdt-enter .3s ease both;
}

.qhdt-streak-banner {
  width: min(100%, 520px);
  padding: 13px 16px;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 0 10px;
  border: 1px solid rgba(255, 211, 35, .28);
  border-radius: 15px;
  background: linear-gradient(135deg, rgba(102, 63, 7, .36), rgba(11, 37, 47, .72));
  text-align: left;
}

.qhdt-streak-banner > span {
  grid-row: 1 / 3;
  font-size: 28px;
}

.qhdt-streak-banner strong {
  color: #fff1a8;
  font-size: 14px;
}

.qhdt-streak-banner small {
  color: var(--qhdt-muted);
  font-size: 11px;
}

.qhdt-streak-banner.is-compact {
  max-width: 410px;
}

.qhdt-ranking-header small {
  display: block;
  margin-top: 7px;
  color: var(--qhdt-muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.qhdt-ranking-tabs {
  margin-bottom: 15px;
  padding: 4px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px;
  border: 1px solid rgba(104, 205, 255, .16);
  border-radius: 14px;
  background: rgba(4, 14, 25, .78);
}

.qhdt-ranking-tabs button {
  min-height: 42px;
  border: 0;
  border-radius: 10px;
  color: var(--qhdt-muted);
  background: transparent;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .05em;
  cursor: pointer;
}

.qhdt-ranking-tabs button:hover,
.qhdt-ranking-tabs button:focus-visible {
  color: #fff;
  outline: 1px solid rgba(126, 233, 0, .4);
}

.qhdt-ranking-tabs button.is-active {
  color: #071009;
  background: linear-gradient(180deg, var(--qhdt-green-2), var(--qhdt-green));
  box-shadow: 0 6px 18px rgba(126, 233, 0, .16);
}

.qhdt-my-rank {
  margin: 0 0 15px;
  padding: 13px 15px;
  display: grid;
  grid-template-columns: auto auto 1fr;
  align-items: center;
  gap: 12px;
  border: 1px solid rgba(126, 233, 0, .32);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(35, 73, 28, .52), rgba(8, 30, 47, .86));
}

.qhdt-my-rank > span {
  color: var(--qhdt-muted);
  font-size: 11px;
  font-weight: 850;
  text-transform: uppercase;
}

.qhdt-my-rank > strong {
  color: var(--qhdt-green-2);
  font-size: 31px;
  line-height: 1;
}

.qhdt-my-rank div {
  min-width: 0;
  text-align: right;
}

.qhdt-my-rank b,
.qhdt-my-rank small {
  display: block;
}

.qhdt-my-rank b {
  color: #fff;
  font-size: 14px;
}

.qhdt-my-rank small {
  margin-top: 2px;
  color: var(--qhdt-muted);
  font-size: 10px;
}

.qhdt-rank-row.is-me {
  background: linear-gradient(90deg, rgba(126, 233, 0, .13), rgba(9, 29, 47, .82));
  box-shadow: inset 3px 0 0 var(--qhdt-green);
}

.qhdt-rank-period .qhdt-rank-score {
  display: grid;
  justify-items: end;
  gap: 0;
}

.qhdt-rank-period .qhdt-rank-score small {
  color: var(--qhdt-muted);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

.qhdt-profile-hero {
  padding: 18px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 15px;
  border: 1px solid rgba(104, 205, 255, .2);
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(13, 46, 72, .94), rgba(8, 28, 43, .94));
}

.qhdt-profile-avatar {
  width: 66px;
  height: 66px;
  display: grid;
  place-items: center;
  border-radius: 19px;
  background: linear-gradient(145deg, #153e5e, #071622);
  box-shadow: inset 0 0 0 1px rgba(126, 233, 0, .24);
  font-size: 34px;
}

.qhdt-profile-hero h2,
.qhdt-profile-hero p {
  margin: 0;
}

.qhdt-profile-hero h2 {
  margin-top: 3px;
  color: #fff;
  font-size: clamp(22px, 5vw, 34px);
  line-height: 1.05;
}

.qhdt-profile-hero div > span {
  color: var(--qhdt-muted);
  font-size: 12px;
}

.qhdt-profile-streak {
  min-width: 88px;
  padding: 10px;
  border-radius: 14px;
  background: rgba(2, 12, 22, .58);
  text-align: center;
}

.qhdt-profile-streak strong,
.qhdt-profile-streak small {
  display: block;
}

.qhdt-profile-streak strong {
  color: #ffe687;
  font-size: 20px;
}

.qhdt-profile-streak small {
  margin-top: 3px;
  color: var(--qhdt-muted);
  font-size: 9px;
  text-transform: uppercase;
}

.qhdt-profile-stats {
  margin-top: 15px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 9px;
}

.qhdt-profile-stats > div,
.qhdt-profile-ranks > div {
  min-height: 76px;
  padding: 12px 8px;
  display: grid;
  place-content: center;
  justify-items: center;
  border: 1px solid rgba(104, 205, 255, .14);
  border-radius: 14px;
  background: rgba(8, 28, 45, .72);
  text-align: center;
}

.qhdt-profile-stats strong {
  color: var(--qhdt-green-2);
  font-size: 24px;
}

.qhdt-profile-stats span,
.qhdt-profile-ranks span {
  color: var(--qhdt-muted);
  font-size: 9px;
  font-weight: 850;
  text-transform: uppercase;
}

.qhdt-profile-ranks {
  margin-top: 9px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 9px;
}

.qhdt-profile-ranks > div {
  min-height: 66px;
}

.qhdt-profile-ranks strong {
  color: #fff;
  font-size: 20px;
}

.qhdt-profile-empty {
  margin-top: 15px;
  border: 1px solid rgba(104, 205, 255, .15);
  border-radius: 15px;
  background: rgba(8, 28, 45, .65);
}

.qhdt-badges-section {
  margin-top: 24px;
}

.qhdt-section-title {
  margin-bottom: 12px;
  text-align: center;
}

.qhdt-section-title h3,
.qhdt-section-title p {
  margin: 0;
}

.qhdt-section-title h3 {
  margin-top: 3px;
  font-size: 26px;
  text-transform: uppercase;
}

.qhdt-section-title > span {
  display: block;
  margin-top: 5px;
  color: var(--qhdt-muted);
  font-size: 11px;
}

.qhdt-badges-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.qhdt-badge-card {
  position: relative;
  min-height: 142px;
  padding: 14px;
  display: grid;
  grid-template-columns: 42px 1fr;
  grid-template-rows: 1fr auto auto;
  gap: 7px 10px;
  overflow: hidden;
  border: 1px solid rgba(104, 205, 255, .16);
  border-radius: 16px;
  background: rgba(8, 28, 45, .78);
}

.qhdt-badge-card.is-unlocked {
  border-color: rgba(126, 233, 0, .34);
  background: linear-gradient(145deg, rgba(29, 68, 34, .7), rgba(8, 28, 45, .84));
  box-shadow: inset 0 0 24px rgba(126, 233, 0, .06);
}

.qhdt-badge-card.is-locked {
  filter: saturate(.42);
  opacity: .66;
}

.qhdt-badge-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 13px;
  background: rgba(255,255,255,.08);
  font-size: 23px;
}

.qhdt-badge-card strong {
  display: block;
  color: #fff;
  font-size: 13px;
}

.qhdt-badge-card p {
  margin: 3px 0 0;
  color: var(--qhdt-muted);
  font-size: 10px;
  line-height: 1.35;
}

.qhdt-badge-card > small {
  grid-column: 1 / 3;
  color: var(--qhdt-green-2);
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

.qhdt-badge-progress {
  grid-column: 1 / 3;
  height: 5px;
  overflow: hidden;
  border-radius: 99px;
  background: rgba(255,255,255,.08);
}

.qhdt-badge-progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--qhdt-blue), var(--qhdt-green));
}

.qhdt-share {
  display: grid;
  justify-items: center;
  gap: 17px;
  text-align: center;
}

.qhdt-share h2,
.qhdt-share p {
  margin: 0;
}

.qhdt-share h2 {
  font-size: clamp(30px, 7vw, 50px);
  line-height: .98;
  text-transform: uppercase;
}

.qhdt-share-icon {
  width: 82px;
  height: 82px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(126, 233, 0, .34);
  border-radius: 24px;
  background: linear-gradient(145deg, #133e57, #102d1d);
  font-size: 39px;
  box-shadow: 0 15px 34px rgba(0,0,0,.25);
}

.qhdt-share-score {
  width: min(100%, 470px);
  padding: 15px 18px;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 15px;
  border: 1px solid rgba(104, 205, 255, .2);
  border-radius: 18px;
  background: rgba(8, 28, 45, .82);
  text-align: left;
}

.qhdt-share-score > span {
  color: #fff;
  font-size: 52px;
  font-weight: 950;
  line-height: 1;
}

.qhdt-share-score strong,
.qhdt-share-score small {
  display: block;
}

.qhdt-share-score strong {
  color: var(--qhdt-green-2);
  font-size: 16px;
}

.qhdt-share-score small {
  margin-top: 4px;
  color: var(--qhdt-muted);
  font-size: 11px;
}

.qhdt-share-options {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.qhdt-share-option {
  min-height: 118px;
  padding: 13px 9px;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 4px;
  border: 1px solid rgba(104, 205, 255, .17);
  border-radius: 16px;
  color: #fff;
  background: linear-gradient(145deg, rgba(14, 43, 66, .96), rgba(8, 25, 42, .97));
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease;
}

.qhdt-share-option:hover,
.qhdt-share-option:focus-visible {
  transform: translateY(-3px);
  border-color: var(--qhdt-green);
  outline: none;
}

.qhdt-share-option > span {
  font-size: 28px;
}

.qhdt-share-option strong {
  font-size: 13px;
}

.qhdt-share-option small {
  color: var(--qhdt-muted);
  font-size: 9px;
  line-height: 1.25;
}

.qhdt-share-option.is-whatsapp {
  border-color: rgba(37, 211, 102, .28);
  background: linear-gradient(145deg, rgba(19, 77, 50, .9), rgba(8, 36, 34, .96));
}

.qhdt-link-preview {
  width: 100%;
  padding: 10px 12px;
  overflow: hidden;
  border: 1px solid rgba(104, 205, 255, .13);
  border-radius: 11px;
  color: var(--qhdt-muted);
  background: rgba(1, 9, 17, .62);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 620px) {
  .qhdt-topbar {
    grid-template-columns: 44px 1fr auto;
    padding-inline: 10px;
  }

  .qhdt-top-actions {
    gap: 4px;
  }

  .qhdt-top-actions .qhdt-icon-button {
    width: 39px;
    height: 39px;
    border-radius: 12px;
  }

  .qhdt-brand-mini span {
    font-size: 12px;
  }

  .qhdt-my-rank {
    grid-template-columns: auto auto 1fr;
    gap: 8px;
    padding: 11px;
  }

  .qhdt-profile-hero {
    grid-template-columns: auto 1fr;
  }

  .qhdt-profile-streak {
    grid-column: 1 / 3;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
  }

  .qhdt-profile-streak small {
    margin: 0;
  }

  .qhdt-profile-stats {
    grid-template-columns: repeat(2, 1fr);
  }

  .qhdt-badges-grid {
    grid-template-columns: 1fr;
  }

  .qhdt-share-options {
    grid-template-columns: 1fr;
  }

  .qhdt-share-option {
    min-height: 72px;
    grid-template-columns: 42px 1fr;
    grid-template-rows: auto auto;
    justify-items: start;
    align-content: center;
    text-align: left;
  }

  .qhdt-share-option > span {
    grid-row: 1 / 3;
  }
}

/* ======================================================================
   Fase 1.4 · Identidad persistente y ranking personal
   ====================================================================== */

.qhdt-shell .screen-reader-text {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.qhdt-identity-banner {
  width: 100%;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 13px 14px;
  border: 1px solid rgba(104, 205, 255, .22);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(7, 30, 49, .96), rgba(8, 21, 35, .94));
  text-align: left;
}

.qhdt-identity-banner.is-account {
  border-color: rgba(126, 233, 0, .24);
  background: linear-gradient(135deg, rgba(17, 47, 29, .9), rgba(7, 27, 42, .96));
}

.qhdt-identity-banner.is-compact {
  margin-top: 6px;
  padding: 10px 12px;
}

.qhdt-identity-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 13px;
  background: rgba(0, 168, 255, .12);
  font-size: 21px;
}

.qhdt-identity-banner strong,
.qhdt-identity-banner small {
  display: block;
}

.qhdt-identity-banner strong {
  color: #fff;
  font-size: 13px;
  line-height: 1.25;
}

.qhdt-identity-banner small {
  margin-top: 3px;
  color: var(--qhdt-muted);
  font-size: 10px;
  line-height: 1.35;
}

.qhdt-identity-actions,
.qhdt-account-panel-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 7px;
}

.qhdt-mini-button,
.qhdt-shell button.qhdt-mini-button {
  min-height: 34px;
  padding: 7px 11px;
  border: 1px solid rgba(126, 233, 0, .45);
  border-radius: 10px;
  color: #08110b;
  background: var(--qhdt-green);
  box-shadow: none;
  font-size: 10px;
  font-weight: 900;
  line-height: 1.1;
  cursor: pointer;
}

.qhdt-mini-button:hover,
.qhdt-mini-button:focus-visible {
  filter: brightness(1.08);
  transform: translateY(-1px);
  outline: 2px solid rgba(126, 233, 0, .25);
  outline-offset: 2px;
}

.qhdt-mini-button.is-secondary {
  color: #e9f6ff;
  border-color: rgba(104, 205, 255, .28);
  background: rgba(14, 51, 77, .85);
}

.qhdt-mini-button.is-danger {
  color: #ffdada;
  border-color: rgba(255, 92, 92, .28);
  background: rgba(92, 25, 31, .55);
}

.qhdt-account-playing-as {
  width: 100%;
  padding: 12px 14px;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 2px 10px;
  align-items: center;
  border: 1px solid rgba(126, 233, 0, .22);
  border-radius: 14px;
  background: rgba(13, 50, 29, .55);
  text-align: left;
}

.qhdt-account-playing-as span {
  color: var(--qhdt-muted);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.qhdt-account-playing-as strong {
  color: #fff;
  font-size: 15px;
}

.qhdt-account-playing-as small {
  grid-column: 1 / -1;
  color: #a9bfd1;
  font-size: 10px;
}

.qhdt-auth,
.qhdt-link-history,
.qhdt-verify {
  width: min(100%, 690px);
  margin: 0 auto;
  display: grid;
  gap: 17px;
  padding: clamp(18px, 4vw, 34px);
}

.qhdt-auth-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  align-items: center;
  text-align: left;
}

.qhdt-auth-hero > span,
.qhdt-link-history-icon,
.qhdt-verify > div:first-child {
  width: 60px;
  height: 60px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(104, 205, 255, .2);
  border-radius: 18px;
  background: rgba(8, 31, 52, .86);
  font-size: 31px;
}

.qhdt-auth-hero h2,
.qhdt-auth-hero p,
.qhdt-auth-copy h3,
.qhdt-auth-copy p,
.qhdt-account-panel-copy h3,
.qhdt-account-panel-copy p {
  margin: 0;
}

.qhdt-auth-hero h2 {
  color: #fff;
  font-size: clamp(23px, 4vw, 32px);
  line-height: 1.05;
}

.qhdt-auth-hero p:last-child,
.qhdt-auth-copy p {
  margin-top: 5px;
  color: var(--qhdt-muted);
  font-size: 12px;
  line-height: 1.5;
}

.qhdt-auth-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding: 4px;
  border: 1px solid rgba(104, 205, 255, .15);
  border-radius: 14px;
  background: rgba(2, 12, 22, .65);
}

.qhdt-auth-tabs button {
  min-height: 42px;
  border: 0;
  border-radius: 10px;
  color: var(--qhdt-muted);
  background: transparent;
  font-weight: 900;
  cursor: pointer;
}

.qhdt-auth-tabs button.is-active {
  color: #071009;
  background: var(--qhdt-green);
}

.qhdt-auth-form {
  display: grid;
  gap: 13px;
  padding: 18px;
  border: 1px solid rgba(104, 205, 255, .16);
  border-radius: 18px;
  background: rgba(5, 21, 35, .82);
}

.qhdt-auth-form > label:not(.qhdt-check-field) {
  display: grid;
  gap: 6px;
  text-align: left;
}

.qhdt-auth-form label > span {
  color: #d8e9f5;
  font-size: 11px;
  font-weight: 800;
}

.qhdt-shell .qhdt-auth-form input[type="text"],
.qhdt-shell .qhdt-auth-form input[type="email"],
.qhdt-shell .qhdt-auth-form input[type="password"],
.qhdt-shell .qhdt-ranking-search input[type="search"] {
  width: 100%;
  min-height: 46px;
  padding: 10px 12px;
  border: 1px solid rgba(104, 205, 255, .25) !important;
  border-radius: 11px !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  caret-color: var(--qhdt-green) !important;
  background: rgba(1, 10, 18, .86) !important;
  box-shadow: none !important;
  outline: none;
}

.qhdt-shell .qhdt-auth-form input:focus,
.qhdt-shell .qhdt-ranking-search input:focus {
  border-color: var(--qhdt-green) !important;
  box-shadow: 0 0 0 3px rgba(126, 233, 0, .12) !important;
}

.qhdt-shell .qhdt-auth-form input::placeholder,
.qhdt-shell .qhdt-ranking-search input::placeholder {
  color: #72889d !important;
  -webkit-text-fill-color: #72889d !important;
}

.qhdt-shell .qhdt-auth-form input:-webkit-autofill,
.qhdt-shell .qhdt-auth-form input:-webkit-autofill:hover,
.qhdt-shell .qhdt-auth-form input:-webkit-autofill:focus {
  -webkit-text-fill-color: #fff !important;
  -webkit-box-shadow: 0 0 0 1000px #06131f inset !important;
  transition: background-color 9999s ease-in-out 0s;
}

.qhdt-check-field {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: start;
  gap: 9px;
  color: #c9dbe8;
  text-align: left;
}

.qhdt-check-field input {
  width: 17px;
  height: 17px;
  margin-top: 2px;
  accent-color: var(--qhdt-green);
}

.qhdt-check-field a {
  color: #8fdcff;
  text-decoration: underline;
}

.qhdt-auth-link {
  justify-self: center;
  padding: 4px;
  border: 0;
  color: #91d7ff;
  background: transparent;
  font-size: 11px;
  font-weight: 800;
  text-decoration: underline;
  cursor: pointer;
}

.qhdt-auth-notice {
  padding: 11px 13px;
  border: 1px solid rgba(255, 211, 35, .25);
  border-radius: 12px;
  color: #fff3bd;
  background: rgba(85, 61, 0, .3);
  font-size: 11px;
  line-height: 1.45;
}

.qhdt-auth-benefits {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
}

.qhdt-auth-benefits span {
  padding: 7px 10px;
  border-radius: 999px;
  color: #cfe6f6;
  background: rgba(12, 42, 65, .75);
  font-size: 9px;
  font-weight: 800;
}

.qhdt-link-history,
.qhdt-verify {
  justify-items: center;
  text-align: center;
}

.qhdt-link-history h2,
.qhdt-verify h2 {
  margin: 0;
  color: #fff;
  font-size: clamp(25px, 5vw, 36px);
}

.qhdt-account-panel {
  width: 100%;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 16px;
  border: 1px solid rgba(126, 233, 0, .25);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(15, 52, 31, .82), rgba(7, 29, 47, .92));
}

.qhdt-account-panel.is-pending {
  border-color: rgba(255, 211, 35, .26);
  background: linear-gradient(135deg, rgba(66, 51, 10, .52), rgba(7, 29, 47, .92));
}

.qhdt-account-panel.is-guest {
  border-color: rgba(104, 205, 255, .2);
  background: linear-gradient(135deg, rgba(7, 34, 55, .88), rgba(7, 22, 36, .92));
}

.qhdt-account-panel-icon {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: rgba(0, 0, 0, .2);
  font-size: 27px;
}

.qhdt-account-panel-copy {
  min-width: 0;
  text-align: left;
}

.qhdt-account-panel-copy h3 {
  margin-top: 2px;
  overflow: hidden;
  color: #fff;
  font-size: 18px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.qhdt-account-panel-copy > span,
.qhdt-account-panel-copy > small {
  display: block;
  overflow-wrap: anywhere;
}

.qhdt-account-panel-copy > span {
  margin-top: 3px;
  color: #bde8ff;
  font-size: 11px;
}

.qhdt-account-panel-copy > small {
  margin-top: 5px;
  color: var(--qhdt-muted);
  font-size: 10px;
  line-height: 1.4;
}

.qhdt-ranking-search {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px;
  margin: 14px 0 10px;
}

.qhdt-ranking-search button,
.qhdt-ranking-pagination button {
  min-height: 44px;
  padding: 8px 13px;
  border: 1px solid rgba(104, 205, 255, .22);
  border-radius: 11px;
  color: #e9f7ff;
  background: rgba(12, 43, 66, .88);
  font-size: 10px;
  font-weight: 900;
  cursor: pointer;
}

.qhdt-ranking-search button[type="submit"] {
  color: #071009;
  border-color: var(--qhdt-green);
  background: var(--qhdt-green);
}

.qhdt-ranking-list-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 7px 2px 10px;
  color: #dff2ff;
  text-align: left;
}

.qhdt-ranking-list-meta strong {
  font-size: 11px;
}

.qhdt-ranking-list-meta small {
  color: var(--qhdt-muted);
  font-size: 9px;
}

.qhdt-ranking-pagination {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
}

.qhdt-ranking-pagination button:last-child {
  justify-self: end;
}

.qhdt-ranking-pagination button:disabled {
  opacity: .35;
  cursor: default;
}

.qhdt-ranking-pagination span {
  color: var(--qhdt-muted);
  font-size: 10px;
  white-space: nowrap;
}

.qhdt-nearby-ranking {
  width: 100%;
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid rgba(104, 205, 255, .14);
}

.qhdt-nearby-ranking .qhdt-section-title {
  margin-bottom: 10px;
}

.qhdt-rank-row.is-nearby:not(.is-me) {
  opacity: .88;
}

.qhdt-my-rank .qhdt-mini-button {
  justify-self: end;
}

@media (max-width: 720px) {
  .qhdt-identity-banner,
  .qhdt-account-panel {
    grid-template-columns: auto 1fr;
  }

  .qhdt-identity-actions,
  .qhdt-account-panel-actions {
    grid-column: 1 / -1;
    justify-content: stretch;
  }

  .qhdt-identity-actions .qhdt-mini-button,
  .qhdt-account-panel-actions .qhdt-mini-button {
    flex: 1 1 135px;
  }

  .qhdt-my-rank {
    grid-template-columns: auto auto 1fr;
  }

  .qhdt-my-rank .qhdt-mini-button {
    grid-column: 1 / -1;
    width: 100%;
  }
}

@media (max-width: 520px) {
  .qhdt-auth,
  .qhdt-link-history,
  .qhdt-verify {
    padding: 16px 10px;
  }

  .qhdt-auth-hero {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
  }

  .qhdt-auth-form {
    padding: 14px;
  }

  .qhdt-ranking-search {
    grid-template-columns: 1fr 1fr;
  }

  .qhdt-ranking-search label {
    grid-column: 1 / -1;
  }

  .qhdt-ranking-list-meta {
    align-items: flex-start;
    flex-direction: column;
    gap: 2px;
  }

  .qhdt-ranking-pagination {
    grid-template-columns: 1fr 1fr;
  }

  .qhdt-ranking-pagination span {
    grid-column: 1 / -1;
    grid-row: 1;
    text-align: center;
  }

  .qhdt-ranking-pagination button {
    grid-row: 2;
    width: 100%;
  }

  .qhdt-account-panel-copy h3 {
    white-space: normal;
  }
}

/* --------------------------------------------------------------------------
 * Fase 1.5 · Competencias patrocinadas y premios
 * ----------------------------------------------------------------------- */
.qhdt-competitions,
.qhdt-competition-join,
.qhdt-competition-ranking {
  width: 100%;
  max-width: 680px;
  margin: 0 auto;
  padding: clamp(18px, 4vw, 34px) clamp(10px, 3vw, 24px) 34px;
}

.qhdt-competitions > .qhdt-section-title,
.qhdt-competition-join > .qhdt-section-title,
.qhdt-competition-ranking > .qhdt-section-title {
  margin-bottom: 20px;
  text-align: center;
}

.qhdt-competitions > .qhdt-section-title h1,
.qhdt-competition-join > .qhdt-section-title h2,
.qhdt-competition-ranking > .qhdt-section-title h2 {
  margin: 2px 0 7px;
  color: #fff;
  font-size: clamp(28px, 6vw, 46px);
  line-height: .98;
  letter-spacing: -.035em;
  text-transform: uppercase;
}

.qhdt-competition-card,
.qhdt-competition-spotlight,
.qhdt-terms-box {
  border: 1px solid rgba(125, 226, 255, .22);
  background: linear-gradient(145deg, rgba(12, 35, 55, .96), rgba(7, 22, 37, .97));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04), 0 18px 44px rgba(0, 0, 0, .2);
}

.qhdt-competition-card {
  margin: 0 0 18px;
  padding: clamp(16px, 4vw, 24px);
  border-radius: 22px;
  text-align: left;
}

.qhdt-competition-card.is-active {
  border-color: rgba(126, 233, 0, .52);
  box-shadow: 0 0 0 1px rgba(126, 233, 0, .09), 0 22px 50px rgba(0, 0, 0, .27);
}

.qhdt-competition-card.is-upcoming {
  border-color: rgba(0, 168, 255, .4);
}

.qhdt-competition-card.is-finished {
  opacity: .88;
}

.qhdt-competition-card > p,
.qhdt-sponsor-box p,
.qhdt-prize-box p {
  color: var(--qhdt-muted);
  line-height: 1.55;
}

.qhdt-competition-card-head {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 16px;
  align-items: center;
  margin-bottom: 16px;
}

.qhdt-competition-card-head h2 {
  margin: 2px 0 5px;
  color: #fff;
  font-size: clamp(22px, 5vw, 34px);
  line-height: 1;
  text-transform: uppercase;
}

.qhdt-competition-card-head span {
  color: var(--qhdt-muted);
  font-size: 12px;
}

.qhdt-sponsor-logo {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  overflow: hidden;
  flex: 0 0 auto;
  border: 1px solid rgba(125, 226, 255, .2);
  border-radius: 14px;
  background: #fff;
}

.qhdt-sponsor-logo.is-large {
  width: 92px;
  height: 92px;
  border-radius: 18px;
}

.qhdt-sponsor-logo img {
  width: 100%;
  height: 100%;
  padding: 7px;
  object-fit: contain;
}

.qhdt-sponsor-logo span {
  color: #07131f;
  font-size: 30px;
}

.qhdt-prize-box,
.qhdt-sponsor-box {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 13px;
  align-items: start;
  margin-top: 14px;
  padding: 15px;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 16px;
  background: rgba(1, 11, 22, .42);
}

.qhdt-prize-box > span {
  font-size: 30px;
}

.qhdt-prize-box small,
.qhdt-sponsor-box small {
  display: block;
  color: var(--qhdt-green-2);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.qhdt-prize-box strong,
.qhdt-sponsor-box strong {
  color: #fff;
  font-size: 16px;
}

.qhdt-prize-box p,
.qhdt-sponsor-box p {
  margin: 5px 0 0;
  font-size: 12px;
}

.qhdt-sponsor-box {
  display: block;
}

.qhdt-sponsor-links {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 12px;
}

.qhdt-sponsor-links a {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border: 1px solid rgba(0, 168, 255, .32);
  border-radius: 10px;
  color: #dff4ff !important;
  background: rgba(0, 112, 174, .17);
  font-size: 10px;
  font-weight: 800;
  text-decoration: none !important;
}

.qhdt-sponsor-links a:hover,
.qhdt-sponsor-links a:focus-visible {
  border-color: var(--qhdt-blue);
  background: rgba(0, 168, 255, .25);
}

.qhdt-sponsor-links.is-compact {
  justify-content: flex-end;
  margin: 0;
}

.qhdt-sponsor-links.is-compact a {
  width: 32px;
  min-height: 32px;
  justify-content: center;
  padding: 4px;
  border-radius: 50%;
  font-size: 13px;
}

.qhdt-eligibility-callout {
  margin-top: 14px;
  padding: 13px 15px;
  border: 1px solid rgba(126, 233, 0, .32);
  border-radius: 14px;
  background: rgba(72, 136, 0, .12);
}

.qhdt-eligibility-callout strong,
.qhdt-eligibility-callout small {
  display: block;
}

.qhdt-eligibility-callout strong {
  color: var(--qhdt-green-2);
  font-size: 13px;
}

.qhdt-eligibility-callout small {
  margin-top: 4px;
  color: #c6d8e7;
  font-size: 10px;
}

.qhdt-entry-status {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 13px;
  padding: 10px 12px;
  border-radius: 12px;
  color: #eaffdb;
  background: rgba(71, 139, 0, .2);
  font-size: 11px;
}

.qhdt-competition-disclaimer,
.qhdt-form-note {
  color: var(--qhdt-muted);
  font-size: 10px;
  line-height: 1.5;
  text-align: center;
}

.qhdt-competition-spotlight {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  width: 100%;
  margin: 16px 0;
  padding: 14px;
  border-color: rgba(126, 233, 0, .38);
  border-radius: 18px;
  text-align: left;
}

.qhdt-competition-spotlight-copy {
  min-width: 0;
}

.qhdt-competition-spotlight-copy h3,
.qhdt-competition-spotlight-copy strong,
.qhdt-competition-spotlight-copy small,
.qhdt-competition-spotlight-copy em {
  display: block;
}

.qhdt-competition-spotlight-copy h3 {
  margin: 1px 0 3px;
  color: #fff;
  font-size: 17px;
  line-height: 1.05;
  text-transform: uppercase;
}

.qhdt-competition-spotlight-copy strong {
  color: var(--qhdt-green-2);
  font-size: 12px;
}

.qhdt-competition-spotlight-copy small {
  margin-top: 3px;
  color: var(--qhdt-muted);
  font-size: 10px;
}

.qhdt-competition-spotlight-copy em {
  margin-top: 5px;
  color: #f2f9ff;
  font-size: 10px;
  font-style: normal;
  font-weight: 750;
}

.qhdt-competition-spotlight-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}

.qhdt-entry-badge {
  color: var(--qhdt-green-2);
  font-size: 10px;
  font-weight: 900;
}

.qhdt-competition-spotlight.is-compact {
  margin: 12px 0 18px;
}

.qhdt-terms-box {
  margin: 16px 0;
  padding: 18px;
  border-radius: 18px;
  text-align: left;
}

.qhdt-terms-box h3 {
  margin: 0 0 10px;
  color: #fff;
}

.qhdt-terms-box div,
.qhdt-terms-box p {
  color: #bfd0df;
  font-size: 12px;
  line-height: 1.6;
}

.qhdt-terms-box a {
  display: inline-block;
  margin-top: 8px;
  color: #7cd7ff !important;
  font-size: 11px;
  font-weight: 800;
}

.qhdt-competition-join-form {
  padding: 17px;
  border: 1px solid rgba(125, 226, 255, .18);
  border-radius: 18px;
  background: rgba(4, 17, 30, .62);
}

.qhdt-check-line {
  display: grid;
  grid-template-columns: 20px 1fr;
  gap: 10px;
  align-items: start;
  padding: 11px 0;
  color: #e8f4fc;
  font-size: 12px;
  line-height: 1.45;
  text-align: left;
}

.qhdt-check-line + .qhdt-check-line {
  border-top: 1px solid rgba(125, 226, 255, .11);
}

.qhdt-check-line input {
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: var(--qhdt-green);
}

.qhdt-competition-ranking .qhdt-ranking-search {
  margin-top: 18px;
}

@media (max-width: 620px) {
  .qhdt-competition-card-head {
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 12px;
  }

  .qhdt-sponsor-logo.is-large {
    width: 72px;
    height: 72px;
  }

  .qhdt-competition-spotlight,
  .qhdt-competition-spotlight.is-compact {
    grid-template-columns: 54px minmax(0, 1fr);
  }

  .qhdt-competition-spotlight .qhdt-sponsor-logo {
    width: 54px;
    height: 54px;
  }

  .qhdt-competition-spotlight-actions {
    grid-column: 1 / -1;
    width: 100%;
    align-items: stretch;
  }

  .qhdt-competition-spotlight-actions .qhdt-mini-button {
    width: 100%;
  }

  .qhdt-sponsor-links.is-compact {
    justify-content: center;
  }
}

.qhdt-entry-badge.is-winner,
.qhdt-entry-status.is-winner {
  color: #fff6bf;
  border-color: rgba(255, 211, 35, .48);
  background: linear-gradient(135deg, rgba(132, 83, 0, .42), rgba(73, 50, 0, .25));
}

.qhdt-entry-status.is-winner span {
  color: var(--qhdt-yellow);
  font-weight: 950;
}

/* Campo señuelo antibot: permanece fuera del flujo visual y accesible solo
 * para robots que completan automáticamente todos los inputs. */
.qhdt-honeypot {
  position: absolute !important;
  left: -10000px !important;
  top: auto !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}


/* --------------------------------------------------------------------------
 * v1.6.0 · Release Candidate, ligas privadas y autoservicio de cuenta
 * ----------------------------------------------------------------------- */
.qhdt-tutorial,
.qhdt-leagues,
.qhdt-league-create,
.qhdt-league-detail,
.qhdt-account-settings {
  animation: qhdt-enter .3s ease both;
}

.qhdt-tutorial {
  min-height: 510px;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 16px;
  text-align: center;
}

.qhdt-tutorial-icon {
  width: 96px;
  height: 96px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(126, 233, 0, .36);
  border-radius: 30px;
  background: radial-gradient(circle, rgba(126,233,0,.22), rgba(7,28,45,.8));
  font-size: 48px;
}

.qhdt-tutorial h2,
.qhdt-leagues h2,
.qhdt-league-create h2,
.qhdt-league-detail h2,
.qhdt-account-settings h2 {
  margin: 0;
  color: #fff;
  font-size: clamp(28px, 5vw, 46px);
  line-height: 1.05;
}

.qhdt-tutorial-dots { display:flex; gap:8px; }
.qhdt-tutorial-dots span { width:10px; height:10px; border-radius:50%; background:rgba(255,255,255,.18); }
.qhdt-tutorial-dots span.is-active { background:var(--qhdt-green); box-shadow:0 0 15px rgba(126,233,0,.65); }

.qhdt-league-grid { display:grid; gap:12px; margin:18px 0; }
.qhdt-league-card,
.qhdt-league-invite-banner,
.qhdt-league-code,
.qhdt-settings-card {
  border:1px solid rgba(125,226,255,.16);
  border-radius:18px;
  background:linear-gradient(135deg,rgba(12,37,58,.88),rgba(5,20,34,.9));
  box-shadow:0 14px 35px rgba(0,0,0,.16);
}
.qhdt-league-card { padding:17px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.qhdt-league-card h3 { margin:3px 0 5px; color:#fff; font-size:20px; }
.qhdt-league-card span { color:var(--qhdt-muted); font-size:13px; }
.qhdt-league-invite-banner { padding:18px; margin:18px 0; display:grid; grid-template-columns:1fr auto; align-items:center; gap:8px 16px; border-color:rgba(126,233,0,.34); }
.qhdt-league-invite-banner strong { color:#fff; font-size:18px; }
.qhdt-league-invite-banner span { color:var(--qhdt-green); font-weight:900; letter-spacing:.08em; }
.qhdt-league-invite-banner .qhdt-button { grid-row:1 / span 2; grid-column:2; }
.qhdt-league-join-form,
.qhdt-league-create-form,
.qhdt-update-email-form,
.qhdt-change-password-form,
.qhdt-delete-account-form { display:grid; gap:13px; margin:18px 0; }
.qhdt-league-join-form { grid-template-columns:1fr auto; align-items:end; }
.qhdt-league-join-form label,
.qhdt-league-create-form label,
.qhdt-settings-card label { display:grid; gap:7px; color:#d9e8f4; font-size:13px; font-weight:800; }
.qhdt-league-join-form input,
.qhdt-league-create-form input,
.qhdt-settings-card input {
  width:100%; min-height:46px; padding:10px 13px;
  border:1px solid rgba(125,226,255,.2); border-radius:12px;
  color:#fff !important; background:#071827 !important; outline:none;
}
.qhdt-league-join-form input:focus,
.qhdt-league-create-form input:focus,
.qhdt-settings-card input:focus { border-color:var(--qhdt-green); box-shadow:0 0 0 3px rgba(126,233,0,.12); }
.qhdt-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.qhdt-league-code { padding:18px; margin:18px 0; display:grid; grid-template-columns:1fr auto; gap:4px 15px; align-items:center; }
.qhdt-league-code span { color:var(--qhdt-muted); font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
.qhdt-league-code strong { color:var(--qhdt-green); font-size:26px; letter-spacing:.12em; }
.qhdt-league-code button { grid-row:1 / span 2; grid-column:2; }

.qhdt-account-settings { max-width:820px; margin:0 auto; }
.qhdt-settings-card { padding:20px; margin-top:15px; }
.qhdt-settings-card h3 { margin:0 0 10px; color:#fff; }
.qhdt-settings-card p { color:var(--qhdt-muted); }
.qhdt-settings-card.is-danger { border-color:rgba(255,91,91,.32); background:linear-gradient(135deg,rgba(73,17,26,.66),rgba(25,11,20,.78)); }
.qhdt-check-row { display:flex !important; grid-template-columns:none !important; flex-direction:row; align-items:flex-start; gap:10px !important; }
.qhdt-check-row input { width:18px !important; min-height:18px !important; margin-top:2px; accent-color:var(--qhdt-green); }
.qhdt-account-tool-grid { display:flex; flex-wrap:wrap; gap:10px; }

@media (max-width:760px) {
  .qhdt-brand-mini span { display:none; }
  .qhdt-top-actions { gap:3px; }
  .qhdt-top-actions .qhdt-icon-button { width:36px; height:36px; font-size:13px; }
  .qhdt-topbar { grid-template-columns:38px minmax(42px,1fr) auto; }
}
@media (max-width:520px) {
  .qhdt-brand-mini { display:none; }
  .qhdt-topbar { grid-template-columns:38px 1fr; }
  .qhdt-top-actions { justify-content:flex-end; }
  .qhdt-league-card { align-items:flex-start; flex-direction:column; }
  .qhdt-league-card .qhdt-mini-button { width:100%; }
  .qhdt-league-join-form { grid-template-columns:1fr; }
  .qhdt-league-invite-banner { grid-template-columns:1fr; }
  .qhdt-league-invite-banner .qhdt-button { grid-column:1; grid-row:auto; width:100%; }
  .qhdt-form-grid { grid-template-columns:1fr; }
  .qhdt-league-code { grid-template-columns:1fr; text-align:center; }
  .qhdt-league-code button { grid-column:1; grid-row:auto; width:100%; }
}

/* --------------------------------------------------------------------------
 * v1.6.1 · Anuncios y comunicación
 * ----------------------------------------------------------------------- */
.qhdt-icon-button {
  position: relative;
}

.qhdt-notification-badge {
  position: absolute;
  top: -6px;
  right: -6px;
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  display: inline-grid;
  place-items: center;
  border: 2px solid #06111f;
  border-radius: 999px;
  color: #06111f;
  background: var(--qhdt-green-2);
  font-size: 10px;
  font-weight: 950;
  line-height: 1;
  box-shadow: 0 5px 15px rgba(0, 0, 0, .35);
}

.qhdt-notification-badge[hidden] {
  display: none !important;
}

.qhdt-competition-dates {
  display: block;
  margin: 3px 0 5px;
  color: var(--qhdt-muted);
  font-size: 11px;
  font-weight: 750;
}

.qhdt-competition-card-head small {
  display: block;
  margin-top: 4px;
  color: var(--qhdt-green-2);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.qhdt-prize-box.is-recreational {
  border-color: rgba(0, 168, 255, .25);
  background: rgba(0, 93, 150, .13);
}

.qhdt-announcement-overlay {
  position: absolute;
  z-index: 50;
  inset: 0;
  display: grid;
  place-items: center;
  padding: clamp(16px, 4vw, 34px);
  background: rgba(1, 7, 14, .82);
  backdrop-filter: blur(10px);
  animation: qhdt-announcement-fade .2s ease-out;
}

.qhdt-announcement-card {
  position: relative;
  width: min(100%, 560px);
  max-height: calc(100% - 24px);
  overflow-y: auto;
  padding: clamp(22px, 5vw, 34px);
  border: 1px solid rgba(126, 233, 0, .4);
  border-radius: 26px;
  color: var(--qhdt-text);
  background:
    radial-gradient(circle at 85% 0%, rgba(126, 233, 0, .13), transparent 34%),
    linear-gradient(145deg, #0b2032, #071320 70%);
  box-shadow: 0 28px 90px rgba(0, 0, 0, .66), inset 0 1px 0 rgba(255, 255, 255, .06);
  text-align: center;
  animation: qhdt-announcement-rise .25s ease-out;
}

.qhdt-announcement-card h2 {
  margin: 5px 0 10px;
  color: #fff;
  font-size: clamp(25px, 7vw, 40px);
  line-height: 1;
  text-transform: uppercase;
}

.qhdt-announcement-card > p:not(.qhdt-kicker):not(.qhdt-announcement-sponsor) {
  margin: 0 auto 18px;
  max-width: 46ch;
  color: var(--qhdt-muted);
  line-height: 1.55;
}

.qhdt-announcement-close {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 12px;
  color: #fff;
  background: rgba(0, 0, 0, .22);
  cursor: pointer;
  font-size: 25px;
  line-height: 1;
}

.qhdt-announcement-close:hover,
.qhdt-announcement-close:focus-visible {
  border-color: var(--qhdt-green);
  outline: 2px solid rgba(126, 233, 0, .2);
}

.qhdt-announcement-icon {
  width: 88px;
  height: 88px;
  margin: 0 auto 14px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(126, 233, 0, .35);
  border-radius: 22px;
  background: #fff;
}

.qhdt-announcement-icon img {
  width: 100%;
  height: 100%;
  padding: 8px;
  object-fit: contain;
}

.qhdt-announcement-icon span {
  color: #07131f;
  font-size: 42px;
}

.qhdt-announcement-facts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 9px;
  margin: 18px 0;
}

.qhdt-announcement-facts > div {
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(125, 226, 255, .17);
  border-radius: 14px;
  background: rgba(1, 11, 22, .42);
}

.qhdt-announcement-facts small {
  display: block;
  margin-bottom: 4px;
  color: var(--qhdt-muted);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.qhdt-announcement-facts strong {
  display: block;
  overflow-wrap: anywhere;
  color: #fff;
  font-size: 14px;
}

.qhdt-announcement-sponsor {
  margin: 0 0 18px;
  color: #dff4ff;
}

.qhdt-announcement-sponsor strong {
  color: var(--qhdt-green-2);
}

@keyframes qhdt-announcement-fade {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes qhdt-announcement-rise {
  from { opacity: 0; transform: translateY(12px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 520px) {
  .qhdt-announcement-overlay { padding: 10px; }
  .qhdt-announcement-card { max-height: calc(100% - 8px); padding: 22px 16px 18px; border-radius: 20px; }
  .qhdt-announcement-icon { width: 70px; height: 70px; border-radius: 17px; }
  .qhdt-announcement-card .qhdt-actions { grid-template-columns: 1fr; }
}

/* v1.6.2 — Países, banderas y elegibilidad territorial */
.qhdt-country-flag{display:inline-block;margin-right:7px;font-size:1.05em;line-height:1;vertical-align:-.08em}
.qhdt-guest-identity-fields{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,.7fr);gap:14px;width:min(760px,100%);margin:0 auto}
.qhdt-country-field,.qhdt-ranking-country-filter label,.qhdt-settings-card label{display:grid;gap:7px;text-align:left}
.qhdt-country-field>span,.qhdt-ranking-country-filter label>span{font-size:13px;font-weight:800;color:#b9cde0;text-transform:uppercase;letter-spacing:.06em}
.qhdt-country-field select,.qhdt-ranking-country-filter select,.qhdt-auth-form select,.qhdt-settings-card select{width:100%;min-height:48px;border:1px solid #23506d;border-radius:12px;background:#071829;color:#f7fbff;padding:10px 12px;font:inherit}
.qhdt-country-field small,.qhdt-settings-card small{color:#91a9bd}
.qhdt-ranking-country-filter{width:min(520px,100%);margin:14px auto}
.qhdt-country-setup{display:grid;justify-items:center;gap:16px;text-align:center;max-width:720px;margin:0 auto;padding:34px 22px}
.qhdt-country-setup .qhdt-country-field{width:min(520px,100%)}
.qhdt-country-setup .qhdt-info-callout{width:min(620px,100%);padding:16px;border:1px solid #234c66;border-radius:14px;background:#092136;text-align:left}
.qhdt-country-setup .qhdt-info-callout strong{color:#8df20f}
.qhdt-country-setup .qhdt-info-callout p{margin:6px 0 0;color:#c3d3e1}
.qhdt-territory-box,.qhdt-territory-confirmation{display:flex;align-items:flex-start;gap:12px;padding:15px;border:1px solid #28516a;border-radius:14px;background:#0a2134;margin:14px 0;text-align:left}
.qhdt-territory-box>span{font-size:25px}.qhdt-territory-box strong,.qhdt-territory-confirmation strong{display:block;color:#f4f8fb}.qhdt-territory-box small,.qhdt-territory-confirmation small{display:block;margin-top:5px;color:#a9bfd1}.qhdt-territory-confirmation p{margin:7px 0;color:#d2dfeb}
.qhdt-territory-box.is-eligible,.qhdt-territory-confirmation.is-eligible{border-color:#397923;background:#102b1d}.qhdt-territory-box.is-not-eligible,.qhdt-territory-confirmation.is-not-eligible{border-color:#7c6421;background:#2c250e}
.qhdt-account-playing-as strong{display:flex;align-items:center;justify-content:center;gap:4px}
@media(max-width:680px){.qhdt-guest-identity-fields{grid-template-columns:1fr}.qhdt-ranking-country-filter{margin:10px 0}.qhdt-country-setup{padding:24px 8px}.qhdt-territory-box,.qhdt-territory-confirmation{padding:12px}}
