/* Silbermuschel Ayurveda – im Silbermuschel-Aussehen, überall Comic Sans MS.
   Harmonische Farben: Safran, Lotusrosa, Salbei; die drei Doshas in
   Lavendelblau (Vata), Safranorange (Pitta) und Salbeigrün (Kapha).
   Ein Bildschirm ohne Scrollen, Leiste unten, kräftige Abwehr gegen das Theme. */

.say-w, .say-box, .say-druck{
  --w-creme:#fbf3e4; --w-perg:#fffdf8; --w-moos:#4f6f52; --w-moos-tief:#2f4434;
  --w-gold:#c9a24a; --w-safran:#e9b949; --w-lotus:#f2c4cc; --w-tinte:#3b3427; --w-rand:#eadbbf;
  --w-leise:#6b6250;
}
.say-w, .say-w *, .say-box, .say-box *{
  font-family:"Comic Sans MS","Comic Neue","Comic Sans","Chalkboard SE","Segoe Print",cursive !important;
  box-sizing:border-box;
  letter-spacing:normal !important; hyphens:manual !important; -webkit-hyphens:manual !important;
  word-break:normal !important; overflow-wrap:break-word; text-transform:none !important;
}

/* --- Der Kasten ------------------------------------------------------ */
.say-w{
  position:relative; overflow:hidden; isolation:isolate;
  max-width:1000px; margin:12px auto !important; border-radius:22px;
  border:1px solid var(--w-rand); color:var(--w-tinte); text-align:left;
  background:
    radial-gradient(110% 70% at 50% 0%, rgba(233,185,73,.24) 0%, rgba(233,185,73,0) 60%),
    radial-gradient(80% 70% at 100% 100%, rgba(156,197,154,.22) 0%, rgba(156,197,154,0) 70%),
    radial-gradient(70% 60% at 0% 100%, rgba(242,196,204,.26) 0%, rgba(242,196,204,0) 70%),
    linear-gradient(180deg,#fffaf0 0%,#fbf2e2 60%,#f4f1e4 100%);
  box-shadow:0 18px 40px -24px rgba(90,70,40,.55), inset 0 0 0 4px rgba(255,255,255,.6);
  height:calc(100vh - 24px); height:calc(100svh - 24px); max-height:860px; min-height:520px;
  display:flex; flex-direction:column;
}
.say-w-licht{position:absolute; inset:0; width:100%; height:100%; z-index:0; pointer-events:none}
.say-w-buehne{position:relative; z-index:1; flex:1 1 auto; min-height:0; display:flex; flex-direction:column; overflow:auto; padding:14px 22px 8px}
.say-szene{flex:1 1 auto; min-height:0; display:flex; flex-direction:column; animation:sayRein .55s cubic-bezier(.2,.7,.2,1) both}
.say-szene.raus{animation:sayRaus .24s ease both}
@keyframes sayRein{from{opacity:0;transform:translateY(12px) scale(.99)}to{opacity:1;transform:none}}
@keyframes sayRaus{to{opacity:0;transform:translateY(-8px)}}
@keyframes sayAuf{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes sayPop{0%{transform:scale(0)}70%{transform:scale(1.08)}100%{transform:scale(1)}}
@keyframes sayVonRechts{from{opacity:0; transform:translateX(36px)}to{opacity:1; transform:none}}
@keyframes sayVonLinks{from{opacity:0; transform:translateX(-36px)}to{opacity:1; transform:none}}
@keyframes saySchweben{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes sayWelle{to{transform:translateX(60px)}}
@keyframes sayAtmen{0%,100%{opacity:.45}50%{opacity:.75}}

.say-w h2,.say-w h3,.say-w h4{color:var(--w-moos-tief); margin:0; line-height:1.22; font-weight:700; padding:0; border:0; background:none; text-align:left}
.say-w h2:focus,.say-w h3:focus{outline:none}
.say-w h2{font-size:clamp(1.3rem,2.4vw,1.8rem)}
.say-w h3{font-size:1.15rem}
.say-w h4{font-size:1rem}
.say-w p{margin:0; line-height:1.5}
.say-w ul,.say-w ol{margin:0; padding:0}
.say-w li{margin:0}
.say-w a{opacity:1 !important}
.say-w svg{overflow:visible; max-width:100%}
.say-w img{border:0 !important; box-shadow:none !important; margin:0 !important; max-width:100%}
.say-w .say-ic{width:1.1em; height:1.1em; display:inline-block; vertical-align:-.16em; flex:0 0 auto}
.say-unter{color:var(--w-leise); font-size:.93rem}
.say-klein-hinweis{font-size:.8rem !important; color:var(--w-leise); line-height:1.4 !important}
.say-hinweis-text{font-size:.9rem !important; color:var(--w-leise)}
.say-feldname{font-weight:700; color:var(--w-moos-tief); font-size:.92rem !important; margin:0 0 5px !important}

/* --- Knöpfe: Abwehr gegen das Theme ------------------------------------ */
.say-w button, .say-w select, .say-w input{margin:0 !important; box-shadow:none !important; text-shadow:none !important; letter-spacing:normal !important; max-width:100%}
.say-w button{cursor:pointer; width:auto !important; flex:0 0 auto; gap:0 !important; font-weight:400; min-height:0; line-height:1.2; border-radius:0}
.say-w button:disabled{cursor:default; opacity:.4}
.say-w button:focus{outline:none !important}
.say-w button:focus-visible{outline:2px solid #b79a48 !important; outline-offset:2px}
.say-w button::before,.say-w button::after,.say-box a::before,.say-box a::after,.say-w a::before,.say-w a::after{content:none !important; display:none !important}

.say-w .say-knopf{
  display:inline-flex !important; align-items:center; justify-content:center; gap:7px !important;
  font-size:.95rem !important; padding:7px 16px !important; min-height:38px !important; line-height:1.15 !important; text-decoration:none !important; white-space:nowrap;
  border:1px solid #c9a24a !important; border-radius:999px !important;
  background:linear-gradient(180deg,#fff8ea 0%,#f4e3c2 100%) !important; color:#3a2f1c !important;
  transition:background .25s, color .25s, transform .2s}
.say-w .say-knopf:not(:disabled):hover,.say-w .say-knopf:focus-visible{background:var(--w-moos) !important; color:#f3efe2 !important; border-color:var(--w-moos-tief) !important; transform:translateY(-1px)}
.say-w .say-knopf.haupt{background:var(--w-moos) !important; color:#f6f1e3 !important; border-color:var(--w-moos-tief) !important}
.say-w .say-knopf.haupt:not(:disabled):hover{background:var(--w-moos-tief) !important}
.say-w .say-klein{padding:5px 13px !important; min-height:34px !important; font-size:.88rem !important}
.say-w .say-gross{font-size:1.05rem !important; padding:10px 22px !important; min-height:46px !important}
.say-w .say-pfeil-knopf{width:44px !important; padding:0 !important}
.say-w .say-link{display:inline-flex !important; align-items:center; gap:6px !important; background:none !important; border:0 !important;
  color:var(--w-moos) !important; text-decoration:underline !important; text-underline-offset:3px; padding:4px 2px !important; font-size:.9rem !important}
.say-w .say-link:hover{color:var(--w-moos-tief) !important}
.say-w .say-mini-knopf{display:inline-flex !important; align-items:center; justify-content:center; width:34px !important; height:34px !important; padding:0 !important;
  border-radius:50% !important; border:1px solid #c9a24a !important; background:#fffdf8 !important; color:var(--w-moos-tief) !important; font-size:1.05rem !important}
.say-w .say-mini-knopf:hover{background:var(--w-moos) !important; color:#fff !important}
.say-knopfzeile{display:flex !important; gap:8px; align-items:center; flex-wrap:wrap; flex:0 0 auto; margin-top:8px}
.say-knopfzeile.say-mitte{justify-content:center}
.say-zaehler{font-size:.85rem; color:var(--w-leise); min-width:54px; text-align:center}

.say-w .say-nav{display:flex !important; gap:10px; align-items:center; margin:0 0 8px; flex:0 0 auto}
.say-w .say-zurueck-knopf{display:inline-flex !important; align-items:center; height:32px !important; padding:0 14px !important; white-space:nowrap;
  border-radius:999px !important; border:1px solid #c9a24a !important; background:rgba(255,253,248,.92) !important; color:#3b3427 !important; font-size:.86rem !important; transition:background .2s,color .2s,transform .2s}
.say-w .say-zurueck-knopf:hover{background:var(--w-moos) !important; color:#fff !important; transform:translateX(-2px)}
.say-nav-kat{font-size:.82rem; color:var(--w-leise); margin-left:auto}

.say-kopf{display:flex; gap:12px; align-items:center; flex:0 0 auto; margin:0 0 10px}
.say-kopf-ic{flex:0 0 44px; width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.35rem;
  color:#8a6a1f; background:radial-gradient(circle at 35% 30%,#fff,#fbe6b8 75%); border:1px solid #ecd59a}
.say-kopf-text{min-width:0}
.say-kopf .say-unter{font-size:.88rem; line-height:1.38}

.say-sek{flex:1 1 auto; min-height:0; display:flex; flex-direction:column}
.say-rumpf{flex:1 1 auto; min-height:0; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:20px; align-items:stretch}
.say-rumpf > *{min-height:0; min-width:0}

/* --- Fußleiste --------------------------------------------------------- */
.say-w .say-fussleiste{position:relative; z-index:5; flex:0 0 auto; display:flex !important; justify-content:center; gap:2px; flex-wrap:nowrap;
  padding:7px 8px 9px; border-top:1px solid rgba(234,219,191,.9); background:rgba(255,253,248,.6); margin:0}
.say-w .say-leisten-knopf{display:inline-flex !important; align-items:center; justify-content:center; gap:5px !important;
  height:34px !important; padding:0 9px !important; border-radius:999px !important; font-size:.78rem !important; white-space:nowrap;
  border:1px solid transparent !important; background:transparent !important; color:#5a5140 !important; transition:background .2s,color .2s,border-color .2s; min-width:0}
.say-w .say-leisten-knopf span{overflow:hidden; text-overflow:ellipsis; max-width:130px}
.say-w .say-leisten-knopf:hover{background:#fffdf8 !important; border-color:var(--w-rand) !important; color:var(--w-moos-tief) !important}
.say-w .say-leisten-knopf[aria-current="page"]{background:var(--w-moos) !important; color:#f6f1e3 !important; border-color:var(--w-moos-tief) !important}
.say-w .say-musik-knopf{margin-left:6px !important; border-color:#e2cf9e !important; background:rgba(255,253,248,.9) !important}
.say-w .say-musik-knopf[aria-pressed="false"]{color:#9a9277 !important}
.say-w .say-leisten-knopf.nur-klein{display:none !important}
/* 1.0.1: Die Leiste misst selbst (JS) – Stufen statt fester Bildschirmbreiten. */
.say-w .say-fussleiste{justify-content:safe center}
.say-w .say-leisten-knopf{flex-shrink:0}
.say-w .say-musik-knopf span{max-width:150px}
.say-w .say-fussleiste.eng .say-leisten-knopf:not(.say-musik-knopf):not([aria-current="page"]) span{display:none}
.say-w .say-fussleiste.eng .say-leisten-knopf:not(.say-musik-knopf){padding:0 9px !important; font-size:.95rem !important}
.say-w .say-fussleiste.enger .say-leisten-knopf:not(.say-musik-knopf) span{display:none}
.say-w .say-fussleiste.enger .say-musik-knopf span{max-width:90px}
.say-w .say-fussleiste.mit-mehr .say-leisten-knopf.nur-klein{display:inline-flex !important}
.say-w .say-leisten-knopf.ausgelagert{display:none !important}
.say-w .say-fussleiste.knapp .say-musik-knopf span{display:none}
.say-w .say-fussleiste.knapp .say-musik-knopf{margin-left:2px !important}

/* --- Fenster ------------------------------------------------------------ */
.say-overlay{position:absolute; inset:0; z-index:20; background:rgba(60,50,30,.32); backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px);
  display:flex; align-items:center; justify-content:center; padding:14px; animation:sayRein .3s both}
.say-overlay-kasten{position:relative; max-width:700px; width:100%; max-height:100%; overflow:auto; background:#fffdf8; border-radius:18px;
  border:1px solid var(--w-rand); padding:14px 20px 18px; box-shadow:0 20px 40px -20px rgba(0,0,0,.5); color:var(--w-tinte); scrollbar-color:#c9a24a #f3ead2}
.say-overlay-kasten.klein{max-width:520px}
.say-overlay-kasten h3{margin:2px 40px 10px 0 !important}
.say-overlay-kasten p{margin:0 0 8px !important; font-size:.95rem}
.say-w .say-overlay-zu{position:absolute; top:10px; right:10px; z-index:2; display:flex !important; align-items:center; justify-content:center;
  width:38px !important; height:34px !important; padding:0 !important; border-radius:999px !important; border:1px solid #c9a24a !important; background:#fff !important;
  color:var(--w-moos-tief) !important; font-size:1.35rem !important; line-height:1 !important}
.say-w .say-overlay-zu:hover{background:var(--w-moos) !important; color:#fff !important}
.say-quellen{list-style:disc !important; margin:0 0 10px 20px !important}
.say-quellen li{margin:0 0 4px !important; font-size:.9rem}
.say-quellen a{color:var(--w-moos) !important}
.say-mehr-raster{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px}
.say-w .say-mehr-kachel span{min-width:0; white-space:normal; line-height:1.2}
.say-w .say-mehr-kachel{display:flex !important; align-items:center; gap:10px !important; width:100% !important; padding:10px 12px !important; border-radius:14px !important;
  border:1px solid var(--w-rand) !important; background:#fffaf0 !important; color:var(--w-tinte) !important; font-size:.92rem !important; text-align:left}
.say-w .say-mehr-kachel .say-ic{font-size:1.3rem; color:#8a6a1f}
.say-w .say-mehr-kachel.an{background:var(--w-moos) !important; color:#fff !important}
.say-w .say-mehr-kachel.an .say-ic{color:#fff}

/* --- Chips, Reiter, Felder ---------------------------------------------- */
.say-chips{display:flex !important; flex-wrap:wrap; gap:6px; align-items:center}
.say-w .say-chip{display:inline-flex !important; align-items:center; gap:6px !important; padding:5px 13px !important; border-radius:999px !important; font-size:.88rem !important;
  border:1px solid var(--w-rand) !important; background:rgba(255,253,248,.92) !important; color:var(--w-tinte) !important; transition:background .2s,border-color .2s,transform .2s}
.say-w .say-chip:hover{border-color:var(--w-gold) !important; transform:translateY(-1px)}
.say-w .say-chip.farbig::before{content:"" !important; display:inline-block !important; width:10px; height:10px; border-radius:50%; background:var(--d)}
.say-w .say-chip[aria-pressed="true"]{background:var(--w-moos) !important; color:#fff !important; border-color:var(--w-moos-tief) !important}
.say-w .say-chip.farbig[aria-pressed="true"]{background:var(--d) !important; color:#2b2416 !important; border-color:rgba(0,0,0,.25) !important}
.say-w .say-chip.farbig[aria-pressed="true"]::before{background:#fffdf8}
.say-chips.klein .say-chip{padding:3px 10px !important; font-size:.82rem !important}
.say-mitte-chips{justify-content:center; flex:0 0 auto; margin:0 0 8px}
.say-reiter{display:flex !important; gap:3px; border-bottom:2px solid var(--w-rand); flex:0 0 auto; margin:4px 0 0; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none}
.say-reiter::-webkit-scrollbar{display:none}
.say-w .say-reiter-knopf{display:inline-flex !important; align-items:center; padding:7px 11px !important; font-size:.88rem !important; white-space:nowrap;
  border:0 !important; border-bottom:3px solid transparent !important; margin-bottom:-2px !important; background:transparent !important; color:var(--w-leise) !important; border-radius:8px 8px 0 0 !important}
.say-w .say-reiter-knopf:hover{color:var(--w-moos-tief) !important; background:rgba(255,253,248,.7) !important}
.say-w .say-reiter-knopf[aria-selected="true"]{color:var(--w-moos-tief) !important; border-bottom-color:var(--w-safran) !important; font-weight:700; background:rgba(255,253,248,.85) !important}
.say-tafel{flex:1 1 auto; min-height:0; overflow:auto; padding:10px 6px 4px 0; scrollbar-color:#c9a24a #f3ead2}
.say-tafel.neu > *{animation:sayAuf .4s both}
.say-w .say-eingabe, .say-w .say-auswahl{font-size:.95rem !important; padding:6px 12px !important; height:38px !important; border-radius:12px !important; border:1px solid #c9a24a !important;
  background:#fffdf8 !important; color:var(--w-tinte) !important; width:100% !important; outline:none; min-width:0; line-height:1.2 !important}
.say-w .say-eingabe:focus,.say-w .say-auswahl:focus{border-color:var(--w-moos) !important}
.say-w .say-auswahl{cursor:pointer; padding-right:6px !important; width:auto !important}

/* ============ 1. START ============ */
.say-start{display:grid !important; grid-template-columns:minmax(0,.9fr) minmax(0,1.15fr); gap:20px}
.say-start-bild{position:relative; border-radius:22px; overflow:hidden; border:1px solid var(--w-rand); min-height:0; background:#fbe6d4}
.say-landschaft{position:absolute; inset:0; width:100%; height:100%; display:block; max-width:none !important}
.say-sonne{animation:sayAtmen 6s ease-in-out infinite}
.say-wellen path{animation:sayWelle 7s linear infinite}
.say-wellen path:nth-child(2){animation-duration:9s; animation-direction:reverse}
.say-wellen path:nth-child(3){animation-duration:11s}
.say-schwebe{animation:saySchweben 6s ease-in-out infinite}
.say-lotus{animation:sayAuf 1.2s .2s both}
.say-start-panel{display:flex; flex-direction:column; justify-content:center; gap:10px; min-height:0}
.say-w .say-seitentitel{font-size:clamp(1.7rem,3.2vw,2.4rem) !important}
.say-einleitung{font-size:.98rem !important}
.say-start-zeile{display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:8px}
.say-w .say-typ-knopf,.say-w .say-heute{display:flex !important; align-items:center; gap:10px !important; width:100% !important; text-align:left;
  padding:8px 10px !important; border-radius:16px !important; border:1px solid #ecd59a !important; background:linear-gradient(90deg,#fdf1d4,#fffdf8) !important;
  color:var(--w-tinte) !important; font-size:.88rem !important; line-height:1.3 !important; transition:transform .25s,border-color .25s; animation:sayAuf .6s .1s both}
.say-w .say-typ-knopf:hover,.say-w .say-heute:hover{transform:translateY(-2px); border-color:var(--w-gold) !important}
.say-w .say-typ-knopf small,.say-w .say-heute small{display:block; font-size:.72rem; color:#8a6a1f; font-weight:700}
.say-w .say-typ-knopf > span:last-child,.say-heute-text{display:block; min-width:0}
.say-typ-punkte{flex:0 0 auto; display:flex; gap:3px}
.say-typ-punkte i{width:16px; height:30px; border-radius:8px; display:block; border:1px solid rgba(0,0,0,.12)}
.say-typ-punkte.leer{width:36px; height:36px; border-radius:50%; align-items:center; justify-content:center; background:#fffdf8; border:1px dashed #c9a24a; color:#8a6a1f; font-size:1.1rem}
.say-heute-ic{flex:0 0 36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.15rem; background:#fffdf8; border:1px solid #ecd59a; color:#8a6a1f}
.say-kacheln{display:grid; grid-template-columns:repeat(2,1fr); gap:7px}
.say-w .say-kachel{display:flex !important; align-items:center; gap:9px !important; width:100% !important; text-align:left;
  padding:7px 9px !important; border-radius:14px !important; border:1px solid var(--w-rand) !important; background:rgba(255,253,248,.9) !important;
  color:var(--w-tinte) !important; line-height:1.22 !important; transition:transform .25s,border-color .25s; animation:sayAuf .5s both}
.say-w .say-kachel:hover{transform:translateY(-2px); border-color:var(--w-gold) !important; background:#fffdf8 !important}
.say-kachel-ic{flex:0 0 34px; width:34px; height:34px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.1rem;
  background:radial-gradient(circle at 35% 30%,#fff,#fbe6b8 80%); border:1px solid #ecd59a; color:#8a6a1f}
.say-kachel-text{display:block; min-width:0}
.say-kachel-text b{display:block; font-size:.93rem; color:var(--w-moos-tief)}
.say-kachel-text small{display:block; font-size:.74rem; color:var(--w-leise)}

/* ============ 2. TEST ============ */
.say-test{align-items:stretch}
.say-fortschritt{display:flex; gap:12px; align-items:center; flex:0 0 auto; margin:0 0 6px}
.say-fortschritt-text{font-size:.82rem; color:var(--w-leise); white-space:nowrap}
.say-fortschritt-balken{flex:1 1 auto; height:10px; border-radius:6px; background:#f1e6cc; overflow:hidden}
.say-fortschritt-balken i{display:block; height:100%; border-radius:6px; background:linear-gradient(90deg,#9fb3d9,#eba27c,#9cc59a); transition:width .5s cubic-bezier(.3,1,.4,1)}
.say-frage-buehne{flex:1 1 auto; min-height:0; display:flex; align-items:center; justify-content:center; overflow:hidden}
.say-frage{width:100%; max-width:640px; display:flex; flex-direction:column; gap:12px}
.say-frage.von-rechts{animation:sayVonRechts .45s cubic-bezier(.2,.8,.2,1) both}
.say-frage.von-links{animation:sayVonLinks .45s cubic-bezier(.2,.8,.2,1) both}
.say-frage-kat{align-self:flex-start; font-size:.78rem; padding:2px 12px; border-radius:999px; background:#fbe6b8; color:#6b4f12; font-weight:700}
.say-w .say-frage h3{font-size:clamp(1.2rem,2.4vw,1.55rem) !important}
.say-antworten{display:flex; flex-direction:column; gap:8px}
.say-w .say-antwort{display:flex !important; align-items:center; gap:12px !important; width:100% !important; text-align:left; padding:11px 14px !important;
  border-radius:16px !important; border:1px solid var(--w-rand) !important; background:rgba(255,253,248,.95) !important; color:var(--w-tinte) !important;
  font-size:1rem !important; line-height:1.35 !important; transition:transform .2s,border-color .2s,background .2s; animation:sayAuf .4s both}
.say-w .say-antwort i{flex:0 0 30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-style:normal; font-weight:700; background:#fbe6b8; color:#6b4f12}
.say-w .say-antwort:hover{transform:translateX(3px); border-color:var(--w-gold) !important}
.say-w .say-antwort.gewaehlt{background:#eef3e6 !important; border-color:var(--w-moos) !important}
.say-w .say-antwort.gewaehlt i{background:var(--w-moos); color:#fff}

/* Ergebnis */
.say-erg-links{display:flex; flex-direction:column; gap:6px}
.say-dreieck-box{flex:1 1 auto; min-height:0; display:flex; align-items:center; justify-content:center}
.say-dreieck{width:100%; height:100%; display:block}
.say-hof{animation:sayAtmen 5s ease-in-out infinite}
.say-ecke-name{font-size:14px; font-weight:700; fill:#3b3427; paint-order:stroke; stroke:#fffdf8; stroke-width:3px}
.say-punkt{transform:translate(var(--x),var(--y)); animation:sayPunkt 1.6s cubic-bezier(.3,1.3,.5,1) both}
@keyframes sayPunkt{from{transform:translate(0,0) scale(.3)}to{transform:translate(var(--x),var(--y)) scale(1)}}
.say-erg-balken{display:flex; flex-direction:column; gap:4px; flex:0 0 auto}
.say-zeile-balken{display:grid; grid-template-columns:52px 1fr 40px; gap:8px; align-items:center; font-size:.86rem}
.say-zeile-balken span{height:12px; border-radius:7px; background:#f1e6cc; overflow:hidden}
.say-zeile-balken span i{display:block; height:100%; width:var(--w); border-radius:7px; animation:sayBalken 1.2s cubic-bezier(.3,1,.4,1) both}
@keyframes sayBalken{from{width:0}}
.say-zeile-balken em{font-style:normal; text-align:right}
.say-erg-panel{display:flex; flex-direction:column; min-height:0}
.say-typ-block{border-left:4px solid var(--d); background:linear-gradient(120deg,var(--dh),rgba(255,253,248,.8) 70%); border-radius:12px; padding:8px 12px; margin:0 0 8px}
.say-typ-block h4{display:flex; align-items:center; gap:7px; color:var(--dt) !important; margin:0 0 4px !important}
.say-typ-block p{font-size:.9rem !important; margin:0 0 5px !important}
.say-zwei{display:grid; grid-template-columns:1fr 1fr; gap:10px; font-size:.86rem}
.say-zwei ul{list-style:disc !important; margin:3px 0 0 16px !important}
.say-haken{list-style:none !important; display:flex; flex-direction:column; gap:4px}
.say-haken li{display:flex; gap:7px; align-items:flex-start; font-size:.9rem}
.say-haken li .say-ic{color:var(--w-moos); margin-top:2px}

/* ============ 3. DOSHAS ============ */
.say-d-links{display:flex; flex-direction:column; align-items:center}
.say-d-bild{flex:1 1 auto; min-height:0; width:100%; display:flex; align-items:center; justify-content:center}
.say-elementkreis{width:100%; height:100%; display:block}
.say-strahl{transition:opacity .5s, stroke-width .5s}
.say-el{animation:sayPop .6s both; transform-box:fill-box; transform-origin:center; opacity:.45; transition:opacity .4s}
.say-el.an{opacity:1}
.say-el.an circle{fill:#fdf1d4; stroke:#c9a24a; stroke-width:3}
.say-el text{font-size:13px; fill:#3b3427; font-weight:700}
.say-mitte-d circle{transition:r .4s}
.say-mitte-d text{font-size:11px; font-weight:700; fill:#2b2416}
.say-d-panel{display:flex; flex-direction:column; justify-content:center; min-height:0}
.say-d-karte{border-radius:18px; padding:14px 16px; background:linear-gradient(160deg,var(--dh,#fffaf0),#fffdf8 75%); border:1px solid var(--d,#eadbbf); overflow:auto; min-height:0}
.say-d-karte.neu{animation:sayAuf .45s both}
.say-d-karte > p{font-size:.92rem !important; margin:0 0 8px !important}
.say-d-kopf{display:flex; gap:12px; align-items:center; margin:0 0 8px}
.say-d-gross{flex:0 0 54px; width:54px; height:54px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.7rem; background:var(--d); color:var(--dt); border:3px solid #fffdf8; box-shadow:0 0 0 1px var(--d) !important}
.say-d-kopf h3{color:var(--dt) !important; font-size:1.35rem !important}
.say-d-kopf p{font-size:.84rem !important; color:var(--w-leise)}
.say-gunas{display:flex; flex-wrap:wrap; gap:5px; margin:0 0 8px; align-items:center}
.say-gunas i,.say-d-raster i{display:block; width:100%; font-style:normal; font-size:.74rem; font-weight:700; color:var(--dt,#6b4f12)}
.say-gunas span{font-size:.82rem; padding:2px 10px; border-radius:999px; background:#fffdf8; border:1px solid var(--d)}
.say-d-raster{display:grid; grid-template-columns:1fr 1fr; gap:6px 14px; font-size:.86rem; margin:0 0 8px}
.say-d-raster i{display:flex !important; align-items:center; gap:4px}
.say-gleich{display:flex; flex-direction:column; gap:3px; font-size:.84rem !important; color:var(--w-leise); border-top:1px dashed var(--d); padding-top:6px}
.say-el-liste{list-style:none !important; display:flex; flex-direction:column; gap:7px; margin-top:6px !important}
.say-el-liste li{display:flex; gap:10px; align-items:flex-start; font-size:.88rem}
.say-el-liste em{color:var(--w-leise)}
.say-el-ic{flex:0 0 34px; height:34px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:#fdf1d4; border:1px solid #ecd59a; color:#6b4f12; font-size:1.1rem}

/* ============ 4. ERNÄHRUNG ============ */
.say-wahlzeile{display:flex; gap:10px 18px; flex-wrap:wrap; align-items:center; justify-content:space-between; flex:0 0 auto; margin:0 0 4px}
.say-ampel-oben{display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin:0 0 6px}
.say-ampel-oben .say-gruppen{flex:1 1 420px}
.say-ampel-oben .say-suche{flex:0 1 220px; width:220px !important}
.say-legende{font-size:.8rem !important; color:var(--w-leise); margin:0 0 8px !important}
.say-legende i,.say-lm i{display:inline-block; width:10px; height:10px; border-radius:50%; margin:0 4px 0 10px; vertical-align:-1px}
.say-legende i:first-child{margin-left:0}
.say-legende i.g,.say-lm.g i{background:#7fb36f}
.say-legende i.m,.say-lm.m i{background:#e7c04f}
.say-legende i.r,.say-lm.r i{background:#d77a66}
.say-ampel{display:flex; flex-wrap:wrap; gap:6px}
.say-lm{display:inline-flex; align-items:center; font-size:.88rem; padding:4px 11px 4px 4px; border-radius:999px; border:1px solid var(--w-rand); background:#fffdf8; animation:sayAuf .35s both}
.say-lm i{margin:0 6px 0 4px !important}
.say-lm.g{background:#eef6e9; border-color:#c3dcb6}
.say-lm.r{background:#fbeae5; border-color:#efc4b8; color:#7a3a2c}
.say-rasas{display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:8px}
.say-rasa{display:flex; flex-direction:column; gap:3px; padding:8px 10px; border-radius:14px; background:linear-gradient(160deg,var(--r),#fffdf8 70%); border:1px solid rgba(0,0,0,.08); font-size:.82rem; line-height:1.35; animation:sayAuf .45s both}
.say-rasa b{font-size:1rem; color:var(--w-moos-tief)}
.say-rasa b small{font-weight:400; font-size:.74rem; color:var(--w-leise)}
.say-rasa-el{font-size:.74rem; color:#6b4f12}
.say-rasa-bsp{color:var(--w-leise); font-style:italic}
.say-rasa-d{display:flex; flex-wrap:wrap; gap:3px; margin-top:2px}
.say-rasa-d em{font-style:normal; font-size:.72rem; padding:1px 7px; border-radius:999px; border:1px solid var(--d); background:#fffdf8}
.say-rasa-d em.ab{background:var(--d)}
.say-rasa-d em.hier{font-weight:700; box-shadow:0 0 0 2px rgba(47,68,52,.35) !important}
.say-agni{display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:8px}
.say-agni-karte{display:flex; flex-direction:column; gap:2px; padding:8px 10px; border-radius:14px; background:#fffdf8; border:1px solid var(--w-rand); border-left:4px solid var(--d,#c9a24a); font-size:.84rem; line-height:1.38}
.say-agni-karte.hier{background:#fdf3dc; border-color:#e9b949}
.say-agni-karte b{color:var(--w-moos-tief)}
.say-agni-karte small{color:var(--w-leise); font-size:.74rem}
.say-zwischen{margin:12px 0 6px !important}
.say-regeln{margin:0 0 0 20px !important; display:flex; flex-direction:column; gap:3px; font-size:.88rem}
.say-plan{display:flex; flex-direction:column; gap:7px; margin-top:8px}
.say-w .say-plan-zeile{display:grid !important; grid-template-columns:130px 1fr auto; gap:10px !important; align-items:center; width:100% !important; text-align:left;
  padding:9px 12px !important; border-radius:14px !important; border:1px solid var(--w-rand) !important; background:#fffdf8 !important; color:var(--w-tinte) !important; font-size:.92rem !important; animation:sayAuf .45s both}
.say-w .say-plan-zeile b{color:#8a6a1f}
.say-w .say-plan-zeile:hover{border-color:var(--w-gold) !important}
.say-saison-karte{border-radius:18px; padding:14px 16px; background:linear-gradient(160deg,var(--s),#fffdf8 72%); border:1px solid rgba(0,0,0,.08)}
.say-saison-karte.neu{animation:sayAuf .45s both}
.say-saison-karte h3{margin:0 0 6px !important}
.say-saison-karte p{font-size:.92rem !important; margin:0 0 6px !important}
.say-achtung,.say-ok{display:flex; gap:8px; align-items:flex-start; padding:7px 10px; border-radius:12px; font-size:.88rem !important}
.say-achtung{background:#fbeae5; color:#7a3a2c}
.say-ok{background:#eef6e9; color:#2f4d2b}

/* ============ 5. KOCHBUCH ============ */
.say-koch-oben{display:flex !important; gap:8px 10px; align-items:center; flex:0 0 auto; flex-wrap:wrap; margin:0 0 6px}
.say-w .say-koch-titel{display:flex !important; align-items:center; gap:8px; font-size:1.45rem !important; white-space:nowrap; flex:0 0 auto !important; min-width:max-content; overflow:visible !important; margin:0 !important}
.say-koch-titel .say-ic{color:#8a6a1f}
.say-w .say-koch-oben .say-suche{flex:1 1 220px !important; width:auto !important; min-width:170px; max-width:440px}
.say-w .say-koch-oben .say-merk-filter{flex:0 0 auto; margin-left:auto !important}
.say-w .say-merk-filter[aria-pressed="true"]{background:#c94f6a !important; color:#fff !important; border-color:#9e3550 !important}
.say-koch-filter{display:flex; gap:8px; align-items:center; flex-wrap:wrap; flex:0 0 auto; margin:0 0 8px}
.say-koch-filter .say-chips{flex:1 1 auto; min-width:0}
.say-w .say-koch-filter .say-auswahl{flex:0 1 190px; width:auto !important; min-width:140px}
.say-rezept-feld{flex:1 1 auto; min-height:0; overflow:hidden}
.say-rraster{display:grid; grid-template-columns:repeat(var(--spalten,4),minmax(0,1fr)); gap:10px}
.say-rkarte{position:relative; animation:sayAuf .45s both}
.say-w .say-rkarte-auf{display:flex !important; flex-direction:column; width:100% !important; height:100% !important; padding:0 !important; text-align:left; overflow:hidden; align-items:stretch;
  border-radius:16px !important; border:1px solid var(--w-rand) !important; background:#fffdf8 !important; color:var(--w-tinte) !important; transition:transform .25s,border-color .25s}
.say-w .say-rkarte-auf:hover{transform:translateY(-3px); border-color:var(--w-gold) !important}
/* 1.0.1: feste Bildfläche (auch gegen Theme-Regeln wie img{height:auto}),
   darunter der volle Name in zwei Zeilen, Zeit/Kategorie, V/P/K. */
.say-rkarte{display:flex}
.say-rkarte-bildbox{position:relative; display:block; flex:0 0 74px; height:74px; overflow:hidden; background:linear-gradient(160deg,#fdf3df,#f6ead0)}
.say-w .say-rkarte-bild{position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; max-width:none !important; max-height:none !important; margin:0 !important; border:0 !important; border-radius:0 !important; box-shadow:none !important; object-fit:cover; display:block; background:transparent}
.say-w .say-rkarte-bild:not(.ist-foto){object-fit:contain; padding:4px !important}
.say-rkarte-text{display:flex; flex-direction:column; gap:3px; padding:6px 9px 8px; min-height:0; flex:1 1 auto}
.say-rkarte-text b{font-size:.84rem; line-height:1.22; min-height:2.44em; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; white-space:normal; overflow-wrap:break-word}
.say-rkarte-text small{display:block; font-size:.7rem; line-height:1.25; color:var(--w-leise); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.say-eig{display:inline-flex; gap:3px}
.say-eig i{font-style:normal; font-size:.68rem; width:18px; height:18px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--d); color:#3b3427; opacity:.35}
.say-eig i.e1{opacity:.75; background:#fffdf8}
.say-eig i.e2{opacity:1; background:var(--d); font-weight:700}
.say-w .say-herz{position:absolute; top:6px; right:6px; display:flex !important; align-items:center; justify-content:center; width:32px !important; height:32px !important; padding:0 !important;
  border-radius:50% !important; border:0 !important; background:rgba(255,253,248,.9) !important; color:#b58c96 !important; font-size:1.05rem !important; transition:transform .2s,color .2s}
.say-w .say-herz:hover{transform:scale(1.12)}
.say-w .say-herz.an{color:#c94f6a !important}
.say-w .say-herz.an svg{fill:#c94f6a}
.say-leer{text-align:center; color:var(--w-leise); padding:40px 10px; font-size:.95rem}
.say-seiten{margin-top:6px}

/* Ein Rezept */
.say-rezept-rumpf{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr)}
.say-r-links{display:flex; flex-direction:column; gap:6px; min-height:0}
.say-r-bild{flex:1 1 auto; min-height:90px; border-radius:18px; overflow:hidden; border:1px solid var(--w-rand); background:linear-gradient(160deg,#fdf3df,#f6ead0); display:flex; align-items:center; justify-content:center}
.say-r-bild img{width:100%; height:100%; object-fit:contain; display:block; padding:8px}
.say-r-bild img.ist-foto{object-fit:cover; padding:0}
.say-w .say-r-titel{font-size:1.4rem !important}
.say-r-meta{display:flex; flex-wrap:wrap; gap:6px 14px; align-items:center; font-size:.84rem; color:var(--w-leise)}
.say-r-meta > span{display:inline-flex; align-items:center; gap:4px}
.say-portionen{display:flex; align-items:center; gap:8px; font-size:.92rem}
.say-port-ic{color:#8a6a1f; font-size:1.2rem}
.say-port-text{min-width:96px; text-align:center; font-weight:700}
.say-w .say-merk.an{background:#c94f6a !important; color:#fff !important; border-color:#9e3550 !important}
.say-r-panel{display:flex; flex-direction:column; min-height:0}
.say-zutaten{list-style:none !important; display:flex; flex-direction:column}
.say-zutaten li{display:grid; grid-template-columns:72px 1fr; gap:10px; padding:6px 4px; border-bottom:1px dashed #eadbbf; font-size:.94rem; animation:sayAuf .35s both}
.say-zutaten li b{text-align:right; color:#8a6a1f}
.say-schritte{list-style:none !important; display:flex; flex-direction:column; gap:8px}
.say-schritte li{display:flex; gap:10px; align-items:flex-start; font-size:.93rem; line-height:1.45; animation:sayAuf .4s both}
.say-schritte li i{flex:0 0 26px; height:26px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-style:normal; font-weight:700; background:#fbe6b8; color:#6b4f12; font-size:.84rem}
.say-hinweis-karte{display:flex; gap:10px; align-items:flex-start; padding:9px 12px; border-radius:14px; background:#fffdf8; border:1px solid var(--w-rand); margin:0 0 8px; font-size:.92rem; line-height:1.45}
.say-hinweis-karte b{display:block; color:var(--w-moos-tief)}
.say-hinweis-karte .say-ic{color:#8a6a1f; font-size:1.2rem; margin-top:2px}

/* Kochmodus */
.say-km-kasten{max-width:820px; height:100%; display:flex; flex-direction:column}
.say-kochmodus{display:flex; flex-direction:column; gap:12px; flex:1 1 auto; min-height:0}
.say-km-kopf{display:flex; flex-wrap:wrap; gap:4px 14px; align-items:center; padding-right:44px}
.say-km-kopf b{font-size:1.1rem; color:var(--w-moos-tief)}
.say-km-kopf > span{font-size:.86rem; color:var(--w-leise)}
.say-km-punkte{display:flex; gap:4px; width:100%}
.say-km-punkte i{flex:1 1 0; height:6px; border-radius:3px; background:#f1e6cc}
.say-km-punkte i.an{background:var(--w-safran)}
.say-km-schritt{flex:1 1 auto; min-height:0; display:flex; align-items:center; justify-content:center; overflow:auto; padding:6px}
.say-km-schritt p{font-size:clamp(1.25rem,3vw,1.9rem) !important; line-height:1.45 !important; text-align:center; color:var(--w-moos-tief); max-width:640px}
.say-km-schritt p.von-rechts{animation:sayVonRechts .4s both}
.say-km-schritt p.von-links{animation:sayVonLinks .4s both}
.say-km-zutaten{flex:0 1 auto; max-height:40%; overflow:auto; background:#fdf6e6; border-radius:12px; padding:8px 12px; font-size:.9rem}
.say-km-zutaten ul{list-style:none !important; columns:2; margin-top:4px !important}
.say-km-zutaten[hidden]{display:none !important}

/* ============ 6. RECHNER ============ */
.say-re-form{display:flex; flex-direction:column; gap:8px; min-height:0}
.say-felder{display:grid; grid-template-columns:1fr 1fr; gap:8px}
.say-feld{display:flex; flex-direction:column; gap:3px; font-size:.84rem; color:var(--w-moos-tief); font-weight:700; margin:0 !important}
.say-feld em{font-style:normal; font-weight:400; font-size:.72rem; color:var(--w-leise)}
.say-re-form .say-auswahl{width:100% !important}
.say-re-erg{display:flex; flex-direction:column; gap:8px; min-height:0; overflow:auto}
.say-re-leer{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; height:100%; text-align:center; color:var(--w-leise)}
.say-re-leer .say-ic{font-size:3rem; color:#e2cf9e}
.say-bmi{padding:10px 12px; border-radius:16px; background:#fffdf8; border:1px solid var(--w-rand); animation:sayAuf .4s both}
.say-bmi-kopf{display:flex; align-items:baseline; gap:10px; flex-wrap:wrap}
.say-bmi-kopf b{font-size:1.8rem; color:var(--w-moos-tief)}
.say-bmi-kopf em{font-style:normal; font-size:.84rem; padding:2px 10px; border-radius:999px}
.k-u{background:#e3ecf7; color:#3e5a8c}
.k-n{background:#e3f0dc; color:#2f5d2b}
.k-ue{background:#fbefcf; color:#7a5a12}
.k-a{background:#f7ddd5; color:#8a3a2c}
.say-bmi-skala{position:relative; display:flex; height:12px; border-radius:7px; overflow:visible; margin:10px 0 4px}
.say-bmi-skala i{display:block; height:100%}
.say-bmi-skala .z1{width:14%; background:#bfd0ea; border-radius:7px 0 0 7px}
.say-bmi-skala .z2{width:26%; background:#b9d9a8}
.say-bmi-skala .z3{width:20%; background:#f0d98c}
.say-bmi-skala .z4{width:40%; background:#efb9a8; border-radius:0 7px 7px 0}
.say-bmi-zeiger{position:absolute; top:-6px; left:var(--p); width:4px; height:24px; margin-left:-2px; border-radius:2px; background:#2f4434; animation:sayZeiger 1.2s cubic-bezier(.3,1.3,.5,1) both}
@keyframes sayZeiger{from{left:0}}
.say-bmi-zahlen{display:flex; justify-content:space-between; font-size:.68rem; color:var(--w-leise)}
.say-bmi-zahlen span:nth-child(2){margin-left:-6%} .say-bmi-zahlen span:nth-child(3){margin-left:-8%}
.say-re-karten{display:grid; grid-template-columns:repeat(3,1fr); gap:8px}
.say-re-karte{display:flex; flex-direction:column; gap:2px; padding:9px 10px; border-radius:14px; background:#fffdf8; border:1px solid var(--w-rand); animation:sayAuf .45s both}
.say-re-karte span{font-size:.78rem; color:var(--w-leise)}
.say-re-karte b{font-size:1.12rem; color:var(--w-moos-tief); white-space:nowrap}
.say-re-karte small{font-size:.7rem; color:var(--w-leise)}
.say-glaeser{display:flex; flex-wrap:wrap; gap:1px; color:#6f9cc4 !important; font-size:.85rem !important}
.say-glaeser i{animation:sayPop .4s both}
.say-wunsch p{display:flex; gap:8px; align-items:flex-start; font-size:.88rem !important; padding:7px 10px; border-radius:12px; background:#fdf6e6}
.say-wunsch p.say-achtung{background:#fbeae5}
.say-dosha-hinweis{display:flex; flex-direction:column; gap:4px; font-size:.84rem !important}
.say-dosha-hinweis span{padding:6px 10px; border-radius:12px; background:#fffdf8; border-left:4px solid var(--d,#c9a24a)}
.say-arzt{display:flex; gap:8px; align-items:flex-start; flex:0 0 auto; margin-top:8px !important; padding:7px 12px; border-radius:12px; background:#eef3f9; border:1px solid #c9d6ea; color:#2f3f5c; font-size:.82rem !important; line-height:1.4 !important}
.say-arzt .say-ic{color:#3e5a8c; font-size:1.15rem; margin-top:1px}

/* ============ 7. FARBEN ============ */
.say-farben .say-dosha-wahl{justify-content:center; flex:0 0 auto; margin:0 0 6px}
.say-f-links{display:flex; align-items:center; justify-content:center; min-height:0}
.say-farb-lotus{width:100%; height:100%; display:block}
.say-blatt{animation:sayBlatt .8s cubic-bezier(.3,1.3,.5,1) both; transform-box:view-box; transform-origin:0 0}
@keyframes sayBlatt{from{transform:scale(0) rotate(-30deg); opacity:0}to{transform:none; opacity:1}}
.say-blatt-name{font-size:12.5px; font-weight:700}
.say-f-panel{display:flex; flex-direction:column; min-height:0}
.say-f-text h3{margin:0 0 4px !important}
.say-f-text p{font-size:.92rem !important; margin:0 0 4px !important}
.say-f-text.neu{animation:sayAuf .4s both}
.say-f-zeile{font-size:.92rem !important; padding:7px 10px; border-left:4px solid var(--d); background:#fffdf8; border-radius:10px; margin:0 0 6px !important}
.say-bruecke{display:flex; gap:10px; align-items:center; flex-wrap:wrap; flex:0 0 auto; margin-top:8px; padding:8px 12px; border-radius:14px; background:linear-gradient(90deg,#eef3e6,#fffdf8); font-size:.86rem}

/* ============ 8. TAG ============ */
.say-t-links{display:flex; align-items:center; justify-content:center; min-height:0}
.say-uhr-box{width:100%; height:100%; display:flex; align-items:center; justify-content:center}
.say-uhr{width:100%; height:100%; display:block}
.say-zeit{cursor:pointer; outline:none; animation:sayPop .5s both; transform-box:fill-box; transform-origin:center}
.say-zeit path{transition:filter .2s, stroke-width .2s}
.say-zeit:hover path,.say-zeit:focus path{filter:brightness(.96) saturate(1.3)}
.say-zeit.an path{stroke:#2f4434; stroke-width:3.5}
.say-zeit-d{font-size:13px; font-weight:700; fill:#2b2416; pointer-events:none}
.say-zeit-n{font-size:10.5px; fill:#4a4232; pointer-events:none}
.say-stunde{font-size:10px; fill:#8a7d5c}
.say-uhr-zeiger{transform:rotate(var(--w)); transition:transform 1.2s cubic-bezier(.3,1.3,.5,1)}
.say-uhr-zeit{font-size:11px; font-weight:700; fill:#2f4434}
.say-t-panel{display:flex; flex-direction:column; justify-content:center; gap:8px; min-height:0}
.say-t-karte{border-radius:18px; padding:14px 16px; background:linear-gradient(160deg,var(--dh),#fffdf8 75%); border:1px solid var(--d); border-left:6px solid var(--d)}
.say-t-karte.neu{animation:sayAuf .4s both}
.say-t-zeit{display:inline-block; font-size:.78rem; padding:2px 10px; border-radius:999px; background:var(--d); color:#2b2416; margin:0 0 6px}
.say-t-karte h3{color:var(--dt) !important; margin:0 0 8px !important}
.say-saisons{display:grid; grid-template-columns:1fr 1fr; gap:10px; width:100%; max-width:420px}
.say-w .say-saison{display:flex !important; flex-direction:column; align-items:center; gap:4px !important; width:100% !important; padding:16px 8px !important; border-radius:18px !important;
  border:1px solid rgba(0,0,0,.08) !important; background:linear-gradient(160deg,var(--s),#fffdf8) !important; color:var(--w-tinte) !important; animation:sayPop .5s both; transition:transform .2s}
.say-w .say-saison .say-ic{font-size:2rem; color:#6b4f12}
.say-w .say-saison b{font-size:1rem}
.say-w .say-saison small{font-size:.76rem; color:var(--w-leise)}
.say-w .say-saison:hover{transform:translateY(-2px)}
.say-w .say-saison.an{box-shadow:0 0 0 3px #2f4434 !important}

/* ============ 9. GESCHICHTE ============ */
.say-zeitleiste{position:relative; display:flex !important; flex:0 0 auto; overflow-x:auto; scrollbar-width:none; margin:0 0 10px; padding:2px 0}
.say-zeitleiste::-webkit-scrollbar{display:none}
.say-zeitleiste::before{content:""; position:absolute; left:18px; right:18px; top:12px; height:2px; background:#eadbbf}
.say-w .say-zeitpunkt{position:relative; flex:1 0 84px !important; display:flex !important; flex-direction:column; align-items:center; gap:4px !important; padding:4px 2px !important;
  border:0 !important; background:transparent !important; color:var(--w-leise) !important; font-size:.7rem !important; line-height:1.15 !important; text-align:center}
.say-zeitpunkt i{width:14px; height:14px; border-radius:50%; background:#fffdf8; border:2px solid #d8bf86; transition:transform .3s, background .3s}
.say-zeitpunkt.vorbei i{background:#f0d58f}
.say-zeitpunkt.an i{background:var(--w-moos); border-color:var(--w-moos); transform:scale(1.35)}
.say-w .say-zeitpunkt.an{color:var(--w-moos-tief) !important; font-weight:700}
.say-hist-buehne{flex:1 1 auto; min-height:0; position:relative; overflow:hidden}
.say-hist-karte{position:absolute; inset:0; display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:22px; align-items:center;
  background:rgba(255,253,248,.88); border:1px solid var(--w-rand); border-radius:20px; padding:16px 20px}
.say-hist-karte.von-rechts{animation:sayVonRechts .5s cubic-bezier(.2,.8,.2,1) both}
.say-hist-karte.von-links{animation:sayVonLinks .5s cubic-bezier(.2,.8,.2,1) both}
.say-hist-bild{margin:0; height:100%; min-height:0; display:flex; flex-direction:column; align-items:center; justify-content:center}
.say-hist-bild img{display:block; max-width:100%; max-height:100%; min-height:0; object-fit:contain; border-radius:14px; background:#fbf6ea; border:1px solid var(--w-rand) !important}
.say-hist-bild.ist-foto img{object-fit:cover}
.say-hist-bild figcaption{font-size:.72rem; color:var(--w-leise); margin-top:4px; text-align:center; font-style:italic}
.say-hist-text{min-height:0; max-height:100%; overflow:auto; padding-right:4px}
.say-hist-jahr{display:inline-block; font-size:.8rem; padding:2px 12px; border-radius:999px; background:#f0d58f; color:#5a4a1a; font-weight:700; margin:0 0 6px}
.say-hist-text h3{font-size:1.3rem !important; margin:0 0 8px !important}
.say-hist-text p{font-size:.96rem !important; line-height:1.6 !important}
.say-w .say-quellen-knopf{margin-left:14px !important; font-size:.82rem !important}

/* ============ 10. IMPULS ============ */
.say-impuls{align-items:center; justify-content:center; gap:10px}
.say-impuls-karte{position:relative; max-width:640px; width:100%; text-align:center; padding:26px 30px 22px; border-radius:26px; overflow:hidden;
  background:radial-gradient(90% 70% at 50% 0%,var(--dh),#fffdf8 75%); border:1px solid var(--d); box-shadow:0 16px 34px -24px rgba(90,70,40,.6); animation:sayAuf .7s both}
.say-impuls-zeichen{width:84px; height:84px; margin:0 auto 10px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:2.6rem;
  background:radial-gradient(circle at 35% 30%,#fff,var(--dh) 55%,var(--d) 125%); color:var(--dt); border:2px solid var(--d); animation:saySchweben 5s ease-in-out infinite}
.say-impuls-datum{font-size:.85rem !important; color:var(--w-leise); margin:0 0 2px !important}
.say-w .say-impuls-titel{text-align:center !important; font-size:1.1rem !important; color:var(--dt) !important; margin:0 0 10px !important}
.say-impuls-text{margin:0 0 14px !important; padding:0 !important; border:0 !important; background:none !important; font-size:clamp(1.15rem,2.4vw,1.5rem) !important; line-height:1.5 !important;
  color:var(--w-moos-tief); font-style:normal !important; quotes:none}
.say-impuls-text::before,.say-impuls-text::after{content:none !important}
.say-impuls-d{font-size:.88rem !important; color:var(--w-leise)}
.say-passt{display:inline-block; margin-left:6px; font-size:.76rem; padding:1px 10px; border-radius:999px; background:var(--w-moos); color:#fff}

/* ============ Box ============ */
.say-box{display:flex; gap:20px; align-items:center; max-width:760px; margin:20px auto; padding:18px 22px; border-radius:22px;
  border:1px solid #eadbbf; background:linear-gradient(135deg,#fffaf0,#fbeee4 60%,#eef3e6); box-shadow:0 12px 28px -20px rgba(90,70,40,.6); color:#3b3427; text-align:left}
.say-box-bild{flex:0 0 130px; width:130px; height:130px; display:block; border:0 !important; box-shadow:none !important; border-radius:0 !important; margin:0 !important}
.say-box-text{min-width:0}
.say-box h3{margin:0 0 4px !important; padding:0 !important; color:#2f4434; font-size:1.25rem; line-height:1.25; border:0; background:none}
.say-box p{margin:0 0 12px !important; line-height:1.5; font-size:1rem}
.say-box a.say-box-knopf,.say-box a.say-box-knopf:visited{display:inline-flex !important; align-items:center; padding:9px 22px !important; border-radius:999px !important;
  background:#4f6f52 !important; color:#f6f1e3 !important; border:1px solid #2f4434 !important; text-decoration:none !important; opacity:1 !important; font-size:1rem; box-shadow:none !important; transition:background .2s}
.say-box a.say-box-knopf:hover,.say-box a.say-box-knopf:focus{background:#2f4434 !important; color:#fff !important}
.say-w a.say-knopf,.say-w a.say-knopf:visited{color:#3a2f1c !important}
@media (max-width:560px){ .say-box{flex-direction:column; text-align:center} .say-box-bild{width:110px; height:110px; flex-basis:auto} }

/* ============ Drucken ============ */
.say-druck{display:none}
@media print{
  html.say-drucken body > *:not(.say-druck){display:none !important}
  html.say-drucken .say-druck{display:block !important; font-family:"Comic Sans MS","Comic Neue",cursive; color:#222; padding:8mm}
  .say-druck h1{font-size:20pt; margin:0 0 1mm; color:#2f4434}
  .say-druck h2{font-size:13pt; margin:5mm 0 2mm; color:#2f4434}
  .say-druck-unter{color:#666; margin:0 0 4mm}
  .say-druck-zwei{display:flex; gap:8mm}
  .say-druck-zwei > div:first-child{flex:0 0 65mm}
  .say-druck li{margin:0 0 1.5mm}
  .say-druck-fuss{margin-top:6mm; color:#777; font-size:9pt}
}

/* ============ Niedrige Bildschirme am Rechner ============ */
@media (min-width:761px) and (max-height:820px){
  .say-w-buehne{padding:12px 20px 6px}
  .say-kopf{margin-bottom:6px}
  .say-kopf-ic{flex-basis:38px; width:38px; height:38px}
  .say-impuls-karte{padding:18px 24px 16px}
  .say-impuls-zeichen{width:70px; height:70px; font-size:2.2rem}
}

/* ============ Handy ============ */
@media (max-width:760px){
  .say-w{max-height:none; border-radius:16px; margin:8px auto !important}
  .say-w-buehne{padding:10px 12px 6px}
  .say-w .say-fussleiste{padding:5px 4px 7px; gap:4px; justify-content:space-around}
  .say-w .say-leisten-knopf{width:44px !important; height:40px !important; padding:0 !important; font-size:1.15rem !important; flex:0 0 44px !important}
  .say-w .say-leisten-knopf span{display:none}
  .say-w .say-leisten-knopf.nur-gross{display:none !important}
  .say-w .say-leisten-knopf.nur-klein{display:inline-flex !important}
  .say-w .say-musik-knopf{margin-left:0 !important}
  .say-w h2{font-size:1.18rem}
  .say-kopf{gap:9px; margin-bottom:6px}
  .say-kopf-ic{flex-basis:32px; width:32px; height:32px; font-size:1.05rem}
  .say-kopf .say-unter{font-size:.74rem; line-height:1.3}
  .say-rumpf{grid-template-columns:1fr !important; gap:8px}
  .say-w .say-knopf{font-size:.84rem !important; padding:5px 11px !important; min-height:34px !important; gap:5px !important}
  .say-knopfzeile{margin-top:6px; gap:6px}
  .say-w .say-reiter-knopf{padding:5px 8px !important; font-size:.78rem !important}
  .say-w .say-chip{padding:4px 10px !important; font-size:.8rem !important}
  .say-w .say-zurueck-knopf{height:28px !important; padding:0 10px !important; font-size:.76rem !important}

  .say-start{grid-template-columns:1fr; grid-template-rows:minmax(90px,1fr) auto; gap:8px}
  .say-start-panel{justify-content:flex-start; gap:6px}
  .say-w .say-seitentitel{font-size:1.35rem !important; text-align:center !important}
  .say-einleitung{font-size:.78rem !important; line-height:1.35 !important; text-align:center}
  .say-start-zeile{grid-template-columns:1fr; gap:5px}
  .say-w .say-typ-knopf,.say-w .say-heute{font-size:.78rem !important; padding:5px 8px !important}
  .say-heute-ic{flex-basis:30px; height:30px}
  .say-typ-punkte i{height:24px; width:13px}
  .say-kacheln{grid-template-columns:repeat(2,1fr); gap:5px}
  .say-w .say-kachel{padding:5px 6px !important; gap:6px !important}
  .say-kachel-ic{flex-basis:28px; width:28px; height:28px; font-size:.95rem}
  .say-kachel-text b{font-size:.8rem}
  .say-kachel-text small{font-size:.68rem}

  .say-w .say-frage h3{font-size:1.12rem !important}
  .say-w .say-antwort{padding:8px 10px !important; font-size:.88rem !important; gap:9px !important}
  .say-w .say-antwort i{flex-basis:26px; height:26px}
  .say-frage{gap:8px}

  .say-ergebnis .say-rumpf{grid-template-rows:minmax(150px,38%) minmax(0,1fr); gap:4px}
  .say-erg-balken{display:none}
  .say-ecke-name{font-size:17px}
  .say-typ-block{padding:6px 9px}
  .say-typ-block p,.say-haken li{font-size:.8rem !important}
  .say-zwei{font-size:.76rem}
  .say-klein-hinweis{font-size:.72rem !important}

  .say-doshas .say-rumpf{grid-template-rows:minmax(150px,40%) minmax(0,1fr); gap:6px}
  .say-d-karte{padding:9px 11px}
  .say-d-gross{flex-basis:40px; width:40px; height:40px; font-size:1.25rem}
  .say-d-kopf h3{font-size:1.1rem !important}
  .say-d-kopf p,.say-gleich{font-size:.72rem !important}
  .say-d-karte > p{font-size:.8rem !important}
  .say-gunas span{font-size:.72rem; padding:1px 7px}
  .say-d-raster{font-size:.74rem; gap:4px 10px}
  .say-el-liste li{font-size:.78rem}

  .say-wahlzeile{gap:5px}
  .say-ampel-oben .say-suche{flex:1 1 100%; width:100% !important}
  .say-lm{font-size:.8rem}
  .say-rasas{grid-template-columns:1fr 1fr; gap:6px}
  .say-rasa{font-size:.74rem; padding:6px 8px}
  .say-agni{grid-template-columns:1fr; gap:5px}
  .say-agni-karte{font-size:.76rem}
  .say-regeln{font-size:.78rem}
  .say-w .say-plan-zeile{grid-template-columns:90px 1fr auto; font-size:.8rem !important; padding:7px 9px !important}
  .say-saison-karte p{font-size:.8rem !important}

  .say-koch-oben{gap:6px}
  .say-w .say-koch-titel{font-size:1.1rem !important}
  .say-w .say-koch-titel .say-ic{display:none}
  .say-w .say-merk-filter span{display:none}
  .say-koch-filter{gap:5px}
  .say-koch-filter .say-auswahl{flex:1 1 40%; width:auto !important; height:32px !important; font-size:.8rem !important}
  .say-rkarte-bildbox{flex-basis:56px; height:56px}
  .say-rkarte-text{padding:5px 7px}
  .say-rkarte-text b{font-size:.76rem; line-height:1.18}
  .say-rraster{gap:8px}

  .say-rezept-rumpf{grid-template-rows:auto minmax(0,1fr); gap:6px}
  .say-r-bild{display:none}
  .say-w .say-r-titel{font-size:1.1rem !important}
  .say-r-links .say-unter{display:none}
  .say-r-links{gap:4px}
  .say-r-meta{font-size:.74rem; gap:4px 10px}
  .say-portionen{font-size:.82rem}
  .say-zutaten li{font-size:.84rem; padding:4px 2px; grid-template-columns:58px 1fr}
  .say-schritte li,.say-hinweis-karte{font-size:.82rem}
  .say-km-zutaten ul{columns:1}

  .say-felder{gap:6px}
  .say-rechner .say-rumpf{grid-template-rows:auto minmax(0,1fr); gap:6px}
  .say-re-form{gap:5px}
  .say-re-form .say-feldname{display:none}
  .say-re-karten{gap:5px}
  .say-re-karte{padding:6px 7px}
  .say-re-karte b{font-size:.9rem}
  .say-bmi{padding:7px 9px}
  .say-bmi-kopf b{font-size:1.4rem}
  .say-wunsch p,.say-dosha-hinweis{font-size:.76rem !important}
  .say-arzt{font-size:.72rem !important; padding:5px 9px; margin-top:5px !important}

  .say-farben .say-rumpf{grid-template-rows:minmax(150px,40%) minmax(0,1fr); gap:6px}
  .say-f-text p,.say-f-zeile{font-size:.8rem !important}
  .say-f-text h3{font-size:1rem !important}
  .say-bruecke{font-size:.76rem; padding:6px 9px}

  .say-tag .say-rumpf{grid-template-rows:minmax(170px,48%) minmax(0,1fr); gap:6px}
  .say-t-panel{justify-content:flex-start}
  .say-t-karte{padding:9px 11px}
  .say-haken li{font-size:.8rem}
  .say-zeit-d{font-size:15px}
  .say-zeit-n{display:none}
  .say-saisons{gap:6px}
  .say-w .say-saison{padding:8px 6px !important}
  .say-w .say-saison .say-ic{font-size:1.4rem}

  .say-zeitleiste{margin-bottom:6px}
  .say-w .say-zeitpunkt{flex:0 0 72px !important; font-size:.68rem !important}
  .say-hist-karte{grid-template-columns:1fr; grid-template-rows:minmax(90px,34%) minmax(0,1fr); gap:8px; padding:10px 12px; align-items:stretch}
  .say-hist-text h3{font-size:1.05rem !important; margin-bottom:4px !important}
  .say-hist-text p{font-size:.82rem !important; line-height:1.48 !important}

  .say-impuls-karte{padding:18px 16px 16px; border-radius:20px}
  .say-impuls-zeichen{width:64px; height:64px; font-size:2rem; margin-bottom:6px}
  .say-impuls-text{font-size:1.08rem !important}
  .say-mehr-raster{gap:6px}
}
@media (max-width:380px){
  .say-w .say-leisten-knopf{width:40px !important; flex:0 0 40px !important}
}
@media (prefers-reduced-motion:reduce){
  .say-w *, .say-box *{animation:none !important; transition:none !important}
}

/* --- „Ton erlauben" (14.10.2026), im Stil des Zauberwalds --- */
.say-tonfrage{position:fixed !important; inset:0 !important; z-index:2147483000 !important; display:flex !important; align-items:center; justify-content:center;
  padding:16px; background:rgba(10,20,14,.35); -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); opacity:0; transition:opacity .4s ease; margin:0 !important}
.say-tonfrage.offen{opacity:1}
.say-tonfrage-kasten{max-width:460px; width:100%; box-sizing:border-box; padding:22px 26px 24px; border-radius:16px; text-align:center;
  background:#1d3326 !important; color:#e9f1e6 !important; box-shadow:0 18px 50px -12px rgba(0,0,0,.55); border:1px solid rgba(160,200,170,.22);
  font-family:"Comic Sans MS","Comic Neue","Comic Sans","Chalkboard SE",cursive !important; transform:translateY(8px) scale(.98); transition:transform .4s ease}
.say-tonfrage.offen .say-tonfrage-kasten{transform:none}
.say-tonfrage-kasten h3{margin:0 0 8px !important; padding:0 !important; border:0 !important; background:none !important; color:#f3f8f1 !important;
  font:400 1.25rem/1.3 "Comic Sans MS","Comic Neue",cursive !important; text-align:center !important; text-transform:none !important; letter-spacing:0 !important}
.say-tonfrage-kasten p{margin:0 0 16px !important; color:#d6e3d3 !important; font:400 .95rem/1.5 "Comic Sans MS","Comic Neue",cursive !important; text-align:center !important}
.say-tonfrage-reihe{display:flex; gap:14px; justify-content:center; flex-wrap:wrap}
.say-tonfrage-reihe button{appearance:none; cursor:pointer; min-width:120px; padding:9px 20px !important; border-radius:999px !important; margin:0 !important;
  font:400 1rem/1.2 "Comic Sans MS","Comic Neue",cursive !important; letter-spacing:.04em; box-shadow:none !important; text-transform:none !important;
  border:2px solid #e9f1e6 !important; background:transparent !important; color:#f3f8f1 !important; width:auto !important}
.say-tonfrage-reihe .say-tonfrage-ja{background:#6f9c80 !important; border-color:#cfe6d6 !important}
.say-tonfrage-reihe button:hover,.say-tonfrage-reihe button:focus-visible{background:#86b496 !important; outline:none}
@media (prefers-reduced-motion:reduce){.say-tonfrage,.say-tonfrage-kasten{transition:none}}

/* --- 14.10.2026: Musik-Knopf oben rechts im Kasten --- */
.say-w.mit-musik .say-w-buehne{padding-right:58px}
.say-w .say-musik-oben{position:absolute !important; top:12px; right:12px; z-index:6; width:38px !important; height:38px !important; min-width:0 !important;
  padding:0 !important; margin:0 !important; border-radius:50% !important; display:inline-flex !important; align-items:center; justify-content:center;
  border:1px solid #e2cf9e !important; background:rgba(255,253,248,.95) !important; color:var(--w-moos-tief) !important; box-shadow:0 4px 12px -6px rgba(90,70,40,.5) !important; cursor:pointer}
.say-w .say-musik-oben .say-ic{width:20px; height:20px}
.say-w .say-musik-oben.laeuft{background:#4f6f52 !important; color:#fff !important; border-color:#2f4434 !important; animation:sayMusikPuls 2.6s ease-in-out infinite}
.say-w .say-musik-oben.aus{color:#9a9277 !important}
.say-w .say-musik-oben.aus::after{content:""; position:absolute; left:8px; right:8px; top:50%; height:2px; background:currentColor; transform:rotate(-40deg); border-radius:2px}
@keyframes sayMusikPuls{0%,100%{box-shadow:0 0 0 0 rgba(79,111,82,.35)}50%{box-shadow:0 0 0 6px rgba(79,111,82,0)}}
@media (max-width:700px){ .say-w.mit-musik .say-w-buehne{padding-right:48px} .say-w .say-musik-oben{top:8px; right:8px; width:34px !important; height:34px !important} }
@media (prefers-reduced-motion:reduce){ .say-w .say-musik-oben.laeuft{animation:none} }
/* 14.10.2026: auch am Handy mit Beschriftung – Symbol oben, Wort darunter. */
@media (max-width:760px){
  .say-w .say-leisten-knopf{flex:1 1 0 !important; width:auto !important; min-width:0 !important; height:46px !important; flex-direction:column !important; gap:1px !important; padding:2px 2px 3px !important; font-size:1.05rem !important}
  .say-w .say-leisten-knopf span{display:block !important; font-size:.62rem !important; line-height:1.1; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
  .say-w .say-fussleiste.eng .say-leisten-knopf span, .say-w .say-fussleiste.enger .say-leisten-knopf span{display:block !important}
}