@font-face{font-family:"black-ops-one";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/065cd2efba-black-ops-one-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"rajdhani";font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/9041cb37df-rajdhani-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"rajdhani";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/dc0f8ac1da-rajdhani-latin-700-normal.woff2) format("woff2")}
/* Honkdle: a chunky hardware soundboard: brushed panel, big amber arcade buttons, VU-meter stripes. */
body.dle-honkdle {
  background:
    repeating-linear-gradient(90deg, #ffffff05 0 1px, transparent 1px 4px),
    radial-gradient(ellipse at 50% 0%, #2a3440, transparent 70%),
    var(--background);
  background-attachment: fixed;
}
.dle-honkdle .site-header { background: #0b0f12; border-bottom: 4px solid var(--primary); }
.dle-honkdle .site-header .brand { color: var(--primary); letter-spacing: 0.06em; }
.dle-honkdle .page-title,
.dle-honkdle .reveal-name,
.dle-honkdle .reveal-title { color: var(--primary); letter-spacing: 0.04em; text-shadow: 3px 3px 0 #000; }
.dle-honkdle .guess-input { background: #0b0f12; border: 2px solid #3a4652; border-radius: 8px; font-weight: 700; }
.dle-honkdle .guess-input:focus { border-color: var(--primary); }
.dle-honkdle .guess-button, .dle-honkdle .share-button { background: var(--accent); color: #fff; border: 0; border-radius: 8px; font-family: var(--headingFont); letter-spacing: 0.06em; box-shadow: 0 5px 0 #8f3104; }
.dle-honkdle .guess-button:active, .dle-honkdle .share-button:active { transform: translateY(4px); box-shadow: 0 1px 0 #8f3104; }
.dle-honkdle .clue-card { background: linear-gradient(180deg, #27303a, #1a2129); border: 2px solid #3a4652; border-radius: 16px; box-shadow: inset 0 2px 0 #ffffff14, 0 10px 30px #0008; }
.dle-honkdle .play-button {
  width: 124px; height: 124px; font-family: var(--headingFont); font-size: 20px; color: #3a2500;
  background: radial-gradient(circle at 35% 30%, #ffe08a, var(--primary) 55%, #c98a00);
  border: 6px solid #0b0f12; box-shadow: 0 8px 0 #7a5400, 0 0 0 4px #3a4652, 0 14px 30px #0008;
}
.dle-honkdle .play-button:active { transform: translateY(6px); box-shadow: 0 2px 0 #7a5400, 0 0 0 4px #3a4652; }
.dle-honkdle .listen-card.is-playing .play-button { animation: none; box-shadow: 0 8px 0 #7a5400, 0 0 0 4px #3a4652, 0 0 40px var(--primary); }
.dle-honkdle .listen-card.is-playing::after {
  content: ""; display: block; width: 70%; height: 10px; border-radius: 4px;
  background: linear-gradient(90deg, #2ec27e 0 55%, var(--primary) 55% 80%, var(--accent) 80%);
  animation: vu 0.25s steps(4) infinite alternate;
}
@keyframes vu { from { clip-path: inset(0 60% 0 0); } to { clip-path: inset(0 5% 0 0); } }
.dle-honkdle .stage-dot { border-radius: 6px; }
.dle-honkdle .stage-dot.current { background: var(--primary); color: #3a2500; border-color: var(--primary); }
.dle-honkdle .cell { border-radius: 6px; }
@media (prefers-reduced-motion: reduce) { .dle-honkdle .listen-card.is-playing::after { animation: none; } }