/* Neuer Stil · Signatur A Pinselstrich, B Hut-Gruß, Begrüßungszeile (04.11.2026) */
:root{--mh-strich:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 14' preserveAspectRatio='none'%3E%3Cpath d='M3 9 C40 4 110 2 196 5 C198 6 197 9 194 9 C140 10 70 11 8 13 C3 13 1 10 3 9 Z'/%3E%3C/svg%3E")}
.mh-strich{position:relative;display:inline-block;padding-bottom:2px}
.mh-strich::after{content:"";position:absolute;left:-2px;right:-2px;bottom:-5px;height:9px;background:var(--accent,var(--akzent,#B4471A));-webkit-mask:var(--mh-strich) center/100% 100% no-repeat;mask:var(--mh-strich) center/100% 100% no-repeat;transform-origin:left;animation:mhZieh .5s ease-out both}
[dir=rtl] .mh-strich::after{transform-origin:right}
@keyframes mhZieh{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (prefers-reduced-motion:reduce){.mh-strich::after{animation:none}}
.mh-gruss{font-size:clamp(26px,7vw,34px);font-weight:700;line-height:1.15;margin:2px 0 4px;letter-spacing:-.01em}
.mh-unter{font-size:16px;opacity:.82;margin:0 0 6px}
.mh-hut{display:flex;align-items:center;gap:12px;padding:14px 4px;font-size:17px}
.mh-hut svg{width:42px;height:42px;flex:none;color:var(--accent,var(--akzent,#B4471A))}
.mh-hut.wink svg{animation:mhHut 1.2s ease-in-out 1}
@keyframes mhHut{0%,100%{transform:rotate(0)}30%{transform:translateY(-6px) rotate(-12deg)}60%{transform:rotate(4deg)}}
@media (prefers-reduced-motion:reduce){.mh-hut.wink svg{animation:none}}
.mh-haupt{width:100%;min-height:52px;font-size:18px;font-weight:700;border-radius:26px}
/* Erster Start: drei Vorschläge */
.mh-start{position:fixed;inset:0;z-index:50;background:rgba(20,24,32,.45);display:flex;align-items:flex-end;justify-content:center}
.mh-start .blatt{background:var(--panel,#fff);color:var(--fg,#1B2A4A);width:min(560px,100%);border-radius:22px 22px 0 0;padding:22px 18px 26px;max-height:92vh;overflow:auto}
.mh-start h2{margin:6px 0 4px;font-size:24px}
.mh-start p{margin:0 0 14px;opacity:.85}
.mh-wahl{display:grid;gap:10px}
.mh-wahl button{display:flex;align-items:center;gap:14px;text-align:left;min-height:64px;padding:12px 14px;border-radius:16px;border:1px solid var(--line,#DEDAD2);background:var(--panel,#fff);color:inherit;font:inherit;cursor:pointer}
.mh-wahl button[aria-pressed=true]{border:2px solid var(--accent,#B4471A)}
.mh-wahl .muster{width:46px;height:46px;border-radius:12px;flex:none;border:1px solid rgba(0,0,0,.08)}
.mh-wahl b{display:block;font-size:17px}.mh-wahl small{opacity:.75;font-size:14px}
.mh-start .reihe{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}
.mh-start .reihe button{flex:1;min-height:48px;border-radius:24px;font:inherit;font-weight:700;cursor:pointer;border:1px solid var(--line,#DEDAD2);background:transparent;color:inherit}
.mh-start .reihe .los{background:var(--accent,#B4471A);color:var(--accent-fg,#fff);border:0}
.chip[aria-pressed=true]{position:relative}
.chip[aria-pressed=true]::after{content:"";position:absolute;left:14px;right:14px;bottom:5px;height:6px;background:var(--accent,#B4471A);-webkit-mask:var(--mh-strich) center/100% 100% no-repeat;mask:var(--mh-strich) center/100% 100% no-repeat}

/* Kachel unten (04.11.2026): Wetter, Spruch oder nichts */
.kachel{display:flex;flex-direction:column;gap:10px}
.kachel .label{font-size:13px;font-weight:700;color:var(--leise,#5C6577);letter-spacing:.04em;text-transform:uppercase}
.kachel .wetter{display:grid;grid-template-columns:1fr 1fr;gap:12px;text-align:center}
.kachel .wetter .gr{font-size:30px;line-height:1.2}
.kachel .wetter .t{font-size:17px;font-weight:600}
.kachel .leise{font-size:14px;color:var(--leise,#5C6577)}
.kachel .spruch{font-size:19px;margin:0}
.kachel .spruch-wer{font-size:14px;color:var(--leise,#5C6577)}
.kachel .hutgruss{margin:0;font-weight:600;color:var(--akzent,#B4471A)}
.kachel .filmlink,#kachelWahl{background:none;border:0;padding:6px 0;min-height:44px;color:inherit;text-decoration:underline;font:inherit;cursor:pointer;align-self:flex-start}
.kachel[hidden]{display:none}
