/* SHENO Gäste-Karte — Happy-Hour-Band (H3, 26.09.2026). Studie design/studies/happy-hour, Bild „Gäste-Karte“.
   Sitzt im klebenden Kopf der Karte (.sk-kopf) und bleibt beim Rollen stehen. Nur Token (approved-tokens.css). */
.gh-band{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:var(--space-3);margin:0 var(--space-3) var(--space-2);padding:var(--space-2) var(--space-4) var(--space-3) var(--space-3);border-radius:var(--radius);background:var(--danger);color:var(--loading-background);font-family:Montserrat,var(--font-family)}
.gh-band__zeichen{font-size:var(--font-h1);line-height:1}
.gh-band__zeichen[hidden]{display:none}
.gh-band__text{display:grid;min-width:0;line-height:1.2}
.gh-band__text b{overflow:hidden;font-size:var(--font-body);font-weight:var(--weight-bold);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;text-overflow:ellipsis}
.gh-band__text small{overflow:hidden;font-size:var(--font-small);white-space:nowrap;text-overflow:ellipsis}
.gh-band__text small[hidden]{display:none}
.gh-band__uhr{font-size:var(--font-h1);font-weight:var(--weight-bold);font-variant-numeric:tabular-nums;line-height:1}
.gh-band__spur{position:absolute;left:var(--space-3);right:var(--space-3);bottom:var(--space-1);height:calc(var(--space-1) / 2);overflow:hidden;border-radius:var(--control-h-touch);background:color-mix(in srgb,var(--loading-background) 30%,transparent)}
.gh-band__spur[hidden]{display:none}
.gh-band__spur span{display:block;height:100%;border-radius:inherit;background:var(--loading-background);transition:width 1s linear}
.gh-band.is-knapp .gh-band__text small{font-weight:var(--weight-bold);text-transform:uppercase;letter-spacing:.04em}
@media (prefers-reduced-motion:reduce){.gh-band__spur span{transition:none}}
/* H3b: schmal auf der Musik-Seite - unter ihrem Kopf, eine Zeile (Satz nur in den letzten 5 Minuten), steht still beim Rollen */
.gh-band--schmal{margin:0 var(--space-4) var(--space-2);padding:var(--space-1) var(--space-3) var(--space-2);gap:var(--space-2)}
.gh-band--schmal .gh-band__zeichen{font-size:var(--font-body)}
.gh-band--schmal .gh-band__text{grid-auto-flow:column;justify-content:start;align-items:baseline;gap:var(--space-2)}
.gh-band--schmal .gh-band__text small{display:none}
.gh-band--schmal.is-knapp .gh-band__text small{display:block}
.gh-band--schmal .gh-band__uhr{font-size:var(--font-body)}
.gh-band--schmal .gh-band__spur{bottom:calc(var(--space-1) / 2)}
/* Marke auf der Kachel: „Happy Hour“ in derselben Farbe wie das Band (die normale Aktion bleibt in der Akzentfarbe) */
.sk-kachel__aktion.is-happy{top:auto;bottom:var(--space-1);left:var(--space-1);padding:calc(var(--space-1) / 2) var(--space-2);max-width:calc(100% - 2 * var(--space-1));box-sizing:border-box;background:var(--danger);color:var(--loading-background);letter-spacing:.04em;line-height:1.3}   /* unten links (oben rechts sitzt das Plus); in schmalen Kacheln zweizeilig statt abgeschnitten */