/* horsewelt.css — Styles für das Spiel "horsewelt" (System Architektur V1.1) */

  /* Horse Welt: Satz in kurzen, zentrierten Zeilen; Lücke inline auf Textebene (V1.4). */
  .hw-sentence { display: flex; flex-direction: column; gap: 4px; width: 100%; }
  .hw-line { text-align: center; line-height: 1.6; }
  .hw-blank {
    display: inline-block; min-width: 72px;
    border-bottom: 3px solid currentColor;
    margin: 0 4px; vertical-align: baseline;
  }
  /* Leere Lücke blinkt wie ein Cursor — gefüllte Lücken bleiben ruhig. */
  .hw-blank:empty { animation: blankBlink 1.4s ease-in-out infinite; }
  @keyframes blankBlink {
    0%, 100% { opacity: 1; }
    50% { opacity: .5; }
  }

  /* Horse Welt: Autor-Avatar rechts im Ergebnis (V1.4). */
  .hw-author-avatar {
    flex: none; width: 34px; height: 34px; border-radius: 50%;
    border: 2.5px solid var(--ink); object-fit: cover; background: var(--paper);
  }

  /* Horse Welt 30s Uhr-Countdown (V1.4). */
  .hw-timer-badge {
    display: inline-flex; align-items: center; gap: 8px;
    margin: 4px auto 10px;
    background: var(--ink); color: var(--paper);
    padding: 6px 16px; border-radius: 999px;
    font-family: 'Bangers', sans-serif; font-size: 22px; letter-spacing: 1px;
  }
  .hw-timer-badge svg path, .hw-timer-badge svg line, .hw-timer-badge svg circle,
  .hw-timer-badge svg polyline { stroke: var(--paper) !important; }
  /* Uhr-Icon pendelt im Sekundentakt */
  .hw-timer-badge svg { animation: clockWiggle 1s ease-in-out infinite; }
  @keyframes clockWiggle {
    0%, 100% { transform: rotate(-8deg); }
    50% { transform: rotate(8deg); }
  }