/* Foodly Premium Slate · 2026-10-31. Scoped: taste UI only. */
:root{--fp-gold:#cbae71;--fp-cream:#f3e7cf;--fp-neon:#8bfa63}
/* Stronger premium slate textures for onboarding cards */
:root{
  --fp-veins:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 1200'%3E%3Cg fill='none'%3E%3Cpath d='M40 150C120 130 180 180 260 160S430 80 520 120s130 140 240 130' stroke='rgba(214,182,115,0.38)' stroke-width='3' stroke-linecap='round'/%3E%3Cpath d='M-30 500C80 460 130 560 240 530S430 420 560 470s150 110 270 90' stroke='rgba(214,182,115,0.28)' stroke-width='2.4' stroke-linecap='round'/%3E%3Cpath d='M50 960c90-30 140 35 250 0s150-110 270-90 150 70 250 40' stroke='rgba(214,182,115,0.34)' stroke-width='2.8' stroke-linecap='round'/%3E%3Cpath d='M100 0c40 70 12 150 58 220s90 105 94 180-42 135-26 220 86 130 80 230' stroke='rgba(230,233,225,0.09)' stroke-width='4' stroke-linecap='round'/%3E%3Cpath d='M610-30c45 90 10 140 42 220s115 120 110 200-68 140-62 220 55 128 45 220' stroke='rgba(230,233,225,0.08)' stroke-width='4' stroke-linecap='round'/%3E%3C/g%3E%3C/svg%3E");
  --fp-slate:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 700 1000'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='1 0 0 0 0.08 0 1 0 0 0.11 0 0 1 0 0.09 0 0 0 0.9 0'/%3E%3C/filter%3E%3Crect width='700' height='1000' fill='%230d1311'/%3E%3Crect width='700' height='1000' filter='url(%23n)' opacity='0.42'/%3E%3Cpath d='M0 160H700M0 330H700M0 520H700M0 760H700M0 910H700' stroke='rgba(245,246,243,0.05)' stroke-width='2'/%3E%3Cpath d='M0 220H700M0 620H700' stroke='rgba(0,0,0,0.22)' stroke-width='12'/%3E%3C/svg%3E");
}

html.fds-haupt .fbSeite,html.fds-haupt .fbListenInhalt {color:var(--fp-cream)}
html.fds-haupt .fbSeite{background:radial-gradient(ellipse at 120% 8%,rgba(100,139,56,.17),transparent 46%),linear-gradient(155deg,#131a17,#090f0d 75%);padding:10px 10px 18px;max-width:540px;margin:0 auto}
html.fds-haupt .fbOben{border-bottom:0!important;padding:4px 4px 12px}
html.fds-haupt .fbSchritt{color:var(--fp-cream);letter-spacing:.03em}
html.fds-haupt .fbZurueck,html.fds-haupt .fbBeenden{background:linear-gradient(160deg,#25251f,#0b100d)!important;border:1px solid rgba(204,174,107,.48)!important;border-radius:999px!important;color:var(--fp-cream)!important;box-shadow:inset 0 1px 1px #fff2,0 5px 15px #0006}
html.fds-haupt .fbFortschritt .fy-fortschritt{border:1px solid #bda97077;background:#171c18;box-shadow:inset 0 2px 4px #0009}
html.fds-haupt .fbFortschritt .fy-fortschritt i{background:linear-gradient(90deg,#387f35,#a1fd6a);box-shadow:0 0 11px #88f95166}
html.fds-haupt .fbKarte,html.fds-haupt .regler.k2,html.fds-haupt .auswahl.k2{
 position:relative!important;
 isolation:isolate!important;
 background-color:#101513!important;
 background-image:linear-gradient(160deg,#1a221e 0%,#121816 34%,#0a0f0d 100%)!important;
 border:1px solid rgba(196,162,90,.72)!important;
 border-radius:25px!important;
 overflow:hidden;
 box-shadow:inset 0 1px 0 #e9c78738, inset 0 -1px 0 rgba(255,255,255,.03), 0 18px 40px rgba(0,0,0,.55)!important}
html.fds-haupt .fbKarte::before,html.fds-haupt .regler.k2::before,html.fds-haupt .auswahl.k2::before{
 content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.92;
 background-image:var(--fp-slate), radial-gradient(circle at 18% 12%, rgba(127,160,126,.09), transparent 24%), radial-gradient(circle at 85% 20%, rgba(228,192,111,.08), transparent 17%), linear-gradient(180deg,rgba(255,255,255,.03),transparent 24%);
 background-size:cover,auto,auto,auto;
 background-position:center,0 0,0 0,0 0;
 mix-blend-mode:normal;
}
html.fds-haupt .fbKarte::after,html.fds-haupt .regler.k2::after,html.fds-haupt .auswahl.k2::after{
 content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.8;
 background-image:var(--fp-veins), linear-gradient(125deg, transparent 0 34%, rgba(214,182,115,.08) 36%, transparent 39%, transparent 100%);
 background-size:cover,100% 100%;
 background-position:center;
}
html.fds-haupt .fbKarte > *,html.fds-haupt .regler.k2 > *,html.fds-haupt .auswahl.k2 > *{position:relative;z-index:1}
html.fds-haupt .regler.k2 .k2rechts,html.fds-haupt .auswahl.k2 .k2rechts{position:relative;z-index:1;background:linear-gradient(180deg,rgba(8,12,10,.1),rgba(8,12,10,.04));backdrop-filter:blur(.2px)}
html.fds-haupt .fbKarte{padding:10px!important;display:flex;flex-direction:column;gap:0}
html.fds-haupt .fbBild{height:clamp(140px,25dvh,230px)!important;min-height:0!important;border-radius:19px 19px 12px 12px!important;border:1px solid rgba(214,182,115,.45)!important;overflow:hidden;box-shadow:0 10px 25px #0008;position:relative;background:#0e1311!important}
html.fds-haupt .fbBild::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(5,8,6,.02),rgba(5,8,6,.22) 72%,rgba(5,8,6,.46));}
html.fds-haupt .fbBild img{height:100%!important;width:100%!important;object-fit:cover!important;display:block}
html.fds-haupt .fbText{text-align:center!important;padding:8px 4px 0!important}
html.fds-haupt .fbFrage{font-family:Georgia,serif!important;color:var(--fp-cream)!important;font-size:clamp(20px,5.7vw,28px)!important;line-height:1.12!important;font-weight:650!important;text-shadow:0 2px 9px #000!important}
html.fds-haupt .fbHinweis{color:#cfc1a2!important;font-size:12px!important}
html.fds-haupt .fbWert{display:flex!important;flex-direction:column!important;align-items:center!important;gap:1px!important;padding:6px 0 1px!important}
html.fds-haupt .fbProzent{font-size:clamp(27px,7vw,39px)!important;color:#a2ff85!important;text-shadow:0 0 13px #6dff605c!important;font-weight:800!important;line-height:1.05!important;position:static!important;transform:none!important}
html.fds-haupt .fbStatus{color:#a1ed8d!important;font-weight:650!important;text-align:center!important;font-size:13px!important;min-height:15px!important}
html.fds-haupt .fbRegler{display:flex!important;align-items:center!important;gap:8px!important;padding:2px 4px!important;margin:0!important}
html.fds-haupt .fbRegler .reglerstufe{background:linear-gradient(140deg,#2c2d23,#0b100d)!important;border:1px solid #b09b6a8c!important;box-shadow:0 3px 9px #0008!important;color:var(--fp-cream)!important;min-width:42px!important;width:42px!important;height:43px!important;border-radius:13px!important;font-size:25px!important}
html.fds-haupt .fbRegler .schiene{flex:1!important;min-width:0!important;position:relative!important;overflow:visible!important}
html.fds-haupt .fbRegler .schieber{accent-color:#82ef64!important}
html.fds-haupt .fbRegler .knopfgesicht{position:absolute!important;left:calc(var(--p)* (100% - 34px) + 17px)!important;top:50%!important;transform:translate(-50%,-50%)!important;font-size:29px!important;z-index:5!important;pointer-events:none!important;opacity:1!important;filter:drop-shadow(0 2px 4px #000)!important}
html.fds-haupt .fbKarte .reglerskala{margin:0 0 6px!important;display:flex!important;justify-content:space-around!important}
html.fds-haupt .fbKarte .reglerskala button{border:1px solid #bcb7a060!important;border-radius:30px!important;background:#101713!important;color:#f2e8d9!important;padding:6px 15px!important;font-size:12px!important;min-height:31px!important;box-shadow:inset 0 1px #fff1}
html.fds-haupt .fbAktionen{display:block!important;margin:3px 10px 6px!important}
html.fds-haupt .fbAktionen .fy-btn{width:100%!important;background:linear-gradient(140deg,#1e241b,#090f0d)!important;border:1px solid var(--fp-gold)!important;border-radius:999px!important;color:#e8cc91!important;min-height:42px!important;font-weight:650!important;box-shadow:inset 0 1px #fff1!important}
html.fds-haupt .fbPremiumWeiter{display:block!important;min-height:48px!important;width:calc(100% - 20px)!important;margin:8px 10px!important;border-radius:999px!important;background:linear-gradient(155deg,#98ed67,#3d8d39 70%,#23612e)!important;border:1px solid #aaff7a!important;color:#f7fff4!important;font-size:18px!important;font-weight:800!important;box-shadow:0 3px 17px #7fec573e,inset 0 1px #ffffff6b!important}
html.fds-haupt .fbNeben{display:flex!important;gap:7px!important;margin:3px 7px 5px!important;flex-wrap:wrap!important}
html.fds-haupt .fbNeben .fy-btn{flex:1 1 38%!important;background:linear-gradient(155deg,#1b2a21,#101713)!important;border:1px solid #a49d7c78!important;border-radius:17px!important;color:#e9e9dc!important;padding:10px 5px!important;min-height:40px!important;font-size:12px!important}
html.fds-haupt .regler.k2{grid-template-columns:1fr!important;gap:0!important;padding:10px!important}
html.fds-haupt .regler.k2 .k2bild{height:154px!important;min-height:154px!important;border-radius:16px!important;border:1px solid rgba(214,182,115,.34)!important;box-shadow:0 10px 24px rgba(0,0,0,.42)!important;background:#0d1210!important;overflow:hidden!important;position:relative!important}
html.fds-haupt .regler.k2 .k2bild::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(5,8,6,.03),rgba(5,8,6,.24) 74%,rgba(5,8,6,.42));}
html.fds-haupt .regler.k2 .reglerkopf{text-align:center!important;margin:10px 0 0!important}
html.fds-haupt .regler.k2 .reglername,html.fds-haupt .auswahl.k2 .auswahlname{font-size:clamp(18px,5.2vw,24px)!important;line-height:1.15!important;font-family:Georgia,serif!important;color:var(--fp-cream)!important;font-weight:700!important;text-shadow:0 2px 8px rgba(0,0,0,.6)!important}
html.fds-haupt .regler.k2 .k2wert{text-align:center!important;color:#d5d0c1!important;min-height:26px!important;font-size:13px!important}
html.fds-haupt .reglerfuss.dreier{grid-template-columns:1fr 1fr!important;gap:8px!important}
html.fds-haupt .reglerfuss.dreier .uebernehmen.lang{grid-column:1/-1!important;background:linear-gradient(140deg,#1c251b,#0a0f0c)!important;border:1px solid var(--fp-gold)!important;border-radius:999px!important;color:#edcf8e!important}
html.fds-haupt .reglerfuss.dreier .kenneIchNicht{background:#1a251e!important;border:1px solid #8c907d90!important;color:#eae7d8!important;border-radius:14px!important}
html.fds-haupt .regler.k2 .prozentmitte{color:#a0f982!important;font-size:31px!important;font-weight:780!important;text-align:center!important;text-shadow:0 0 14px rgba(127,254,102,.38)!important;margin:4px 0 1px!important}
html.fds-haupt .regler.k2 .knopfgesicht{filter:drop-shadow(0 2px 4px #000)!important;font-size:30px!important}
html.fds-haupt .regler.k2 .reglerzeile{padding:2px 2px 0!important;gap:10px!important}
html.fds-haupt .regler.k2 .reglerstufe{background:linear-gradient(140deg,#2c2d23,#0b100d)!important;border:1px solid #b09b6a8c!important;box-shadow:0 3px 9px #0008!important;color:var(--fp-cream)!important;min-width:42px!important;width:42px!important;height:43px!important;border-radius:13px!important;font-size:25px!important}
html.fds-haupt .regler.k2 .schiene{position:relative!important;overflow:visible!important}
html.fds-haupt .regler.k2 input[type=range].schieber::-webkit-slider-runnable-track{background:linear-gradient(to right,#87f765 0 var(--f,50%),rgba(244,239,230,.1) var(--f,50%) 100%)!important;box-shadow:inset 0 1px 2px rgba(0,0,0,.6)!important}
html.fds-haupt .regler.k2 input[type=range].schieber::-moz-range-track{background:linear-gradient(to right,#87f765 0 var(--f,50%),rgba(244,239,230,.1) var(--f,50%) 100%)!important;box-shadow:inset 0 1px 2px rgba(0,0,0,.6)!important}
html.fds-haupt .regler.k2[data-beruehrt="0"] input[type=range].schieber::-webkit-slider-runnable-track{background:rgba(244,239,230,.08)!important}
html.fds-haupt .regler.k2[data-beruehrt="0"] input[type=range].schieber::-moz-range-track{background:rgba(244,239,230,.08)!important}
html.fds-haupt .regler.k2 .reglerskala{margin:1px 0 8px!important;display:flex!important;justify-content:space-around!important}
html.fds-haupt .regler.k2 .reglerskala button{border:1px solid rgba(188,183,160,.38)!important;border-radius:30px!important;background:rgba(12,17,14,.68)!important;color:#f2e8d9!important;padding:7px 15px!important;font-size:12px!important;min-height:31px!important;box-shadow:inset 0 1px rgba(255,255,255,.06)!important}
.ff-dialog{background:radial-gradient(ellipse at 30% 0,#28302b,#0d1210 80%)!important;border-color:#b89b5c!important}.ff-shell .ff-secondary{background:#151b16!important;border:1px solid #cbae71!important;color:#ead399!important}.ff-shell .ff-primary{background:linear-gradient(130deg,#8ee763,#2d823b)!important;color:#fff!important;text-align:center!important}
@media(max-width:375px), (max-height:690px){html.fds-haupt .fbSeite{padding:3px 6px 12px!important}html.fds-haupt .fbKarte{padding:6px!important;border-radius:19px!important}html.fds-haupt .fbBild{height:clamp(102px,19dvh,155px)!important}html.fds-haupt .fbFrage{font-size:20px!important}html.fds-haupt .fbRegler .reglerstufe{height:38px!important;width:38px!important;min-width:38px!important}html.fds-haupt .fbPremiumWeiter{min-height:42px!important;margin-top:3px!important}html.fds-haupt .fbNeben .fy-btn{min-height:36px!important;padding:7px 3px!important}html.fds-haupt .fbAktionen .fy-btn{min-height:38px!important}}
@media(prefers-reduced-motion:reduce){html.fds-haupt .fbPremiumWeiter,html.fds-haupt .fbRegler .knopfgesicht{animation:none!important;transition:none!important}}

html.fds-haupt .fbPremiumWeiter:disabled{opacity:.42!important;filter:grayscale(.65)!important;box-shadow:none!important;cursor:not-allowed!important}


html.fds-haupt .auswahl.k2 .k2bild{height:154px!important;min-height:154px!important;border-radius:16px!important;border:1px solid rgba(214,182,115,.34)!important;box-shadow:0 10px 24px rgba(0,0,0,.42)!important;background:#0d1210!important;overflow:hidden!important;position:relative!important}
html.fds-haupt .auswahl.k2 .k2bild::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(5,8,6,.03),rgba(5,8,6,.24) 74%,rgba(5,8,6,.42));}
html.fds-haupt .auswahl.k2 .k2wert{color:#d5d0c1!important;min-height:24px!important;font-size:13px!important}
html.fds-haupt .auswahl.k2 .auswahlbalken{background:transparent!important;color:var(--fp-cream)!important}
html.fds-haupt .auswahl.k2 .auswahlhaken{border-color:rgba(214,182,115,.55)!important;background:rgba(12,17,14,.65)!important;box-shadow:inset 0 1px rgba(255,255,255,.06)!important}
html.fds-haupt .auswahl.k2[data-gewaehlt="1"] .auswahlhaken{background:linear-gradient(140deg,#89e96b,#2e7c39)!important;color:#fff!important;border-color:#9ef87c!important}

/* Onboarding: no persistent bottom navigation or radial command centre. */
html.fds-haupt body.ohne-nav #nav,
html.fds-haupt body.ohne-nav .fkz,
html.fds-haupt body.ohne-nav .fkzSchleier {display:none!important;visibility:hidden!important;pointer-events:none!important}
html.fds-haupt body.ohne-nav {padding-bottom:env(safe-area-inset-bottom, 0px)!important}

/* V33.14: stone scenery OUTSIDE cards, while cards remain independently scrollable. */
body.fbAktiv, body.fbListe {
  background:#060b08 url("../bilder/design/schiefer-aussen.svg") center top / cover fixed no-repeat !important;
  background-attachment:fixed!important;
}
body.fbAktiv main,body.fbListe main {
  background:transparent!important;
}
body.fbAktiv .fbSeite {
  background:transparent!important;
}
body.fbAktiv::before,body.fbListe::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(ellipse at 50% 16%,transparent 10%,rgba(0,0,0,.27) 90%);
}
body.fbAktiv main,body.fbListe main{position:relative;z-index:1}
@media (max-width:600px){
 body.fbAktiv,body.fbListe{background-size:auto 100vh!important;background-position:center center!important}
}

/* Real slate lithographic asset, shared by cards and surroundings */
html.fds-haupt body.fbAktiv,html.fds-haupt body.fbListe,body.fbAktiv,body.fbListe {
 background-color:#080d0b!important;
 background-image:linear-gradient(180deg,rgba(0,0,0,.30),rgba(0,0,0,.12)),url("../bilder/design/schiefer-echt.webp")!important;
 background-position:center top!important;background-repeat:repeat-y!important;background-size:100% auto!important;
}
html.fds-haupt .fbSeite{background:transparent!important}
html.fds-haupt .fbKarte::before,html.fds-haupt .regler.k2::before,html.fds-haupt .auswahl.k2::before{
 background-image:linear-gradient(145deg,rgba(10,17,12,.10),rgba(0,0,0,.22)),url("../bilder/design/schiefer-echt.webp")!important;
 background-size:cover,cover!important;background-position:center,center!important;
 opacity:.96!important
}
html.fds-haupt .fbKarte::after,html.fds-haupt .regler.k2::after,html.fds-haupt .auswahl.k2::after{opacity:.22!important}

/* Schieferoberflächen: vorhandene fotografische Textur, keine SVG-Marmoradern. */
html.fds-haupt .fbKarte,html.fds-haupt .regler.k2,html.fds-haupt .auswahl.k2{background-image:linear-gradient(115deg,rgba(8,12,10,.20),rgba(3,8,5,.24)),url('../bilder/design/schiefer-echt.webp')!important;background-size:cover!important;background-position:center!important}
html.fds-haupt .fbKarte::after,html.fds-haupt .regler.k2::after,html.fds-haupt .auswahl.k2::after{background-image:none!important;opacity:0!important}
body.fbAktiv,body.fbListe{background:#070d0a url('../bilder/design/schiefer-echt.webp') center top/cover fixed no-repeat!important}

/* Phase 1: Realistic local slate material; no drawn marble veins. */
html.fds-haupt .fbKarte,html.fds-haupt .regler.k2,html.fds-haupt .auswahl.k2{
 background-color:#111917!important;
 background-image:linear-gradient(150deg,rgba(35,46,39,.2),rgba(4,8,7,.24)),url('../bilder/design/foodly-slate-authentic.webp')!important;
 background-size:cover,cover!important;background-position:center!important;
 border-color:rgba(207,178,112,.67)!important;
 box-shadow:inset 0 1px rgba(255,232,179,.21),0 12px 32px rgba(0,0,0,.58)!important;
}
html.fds-haupt .fbKarte::before,html.fds-haupt .fbKarte::after,html.fds-haupt .regler.k2::before,html.fds-haupt .regler.k2::after,html.fds-haupt .auswahl.k2::before,html.fds-haupt .auswahl.k2::after{
 background:none!important;opacity:0!important;
}
html.fds-haupt .regler.k2 .k2rechts,html.fds-haupt .auswahl.k2 .k2rechts{
 background:linear-gradient(180deg,rgba(5,9,7,.10),rgba(5,9,7,.32))!important;
 backdrop-filter:none!important;
}
body.fbAktiv,body.fbListe{
 background:linear-gradient(180deg,rgba(4,9,7,.24),rgba(4,9,7,.72)),url('../bilder/design/foodly-slate-authentic.webp') center top / cover fixed!important;
}
body.fbAktiv .fbSeite{background:transparent!important}
body.fbListe .fbListenInhalt{background:transparent!important}
body.fbAktiv main,body.fbListe main{background:transparent!important}
/* The smiley is placed on the interactive track, never beside it. */
html.fds-haupt .regler.k2 .knopfgesicht,html.fds-haupt .fbRegler .knopfgesicht{
 position:absolute!important;pointer-events:none!important;top:50%!important;
 transform:translate(-50%,-50%)!important;z-index:6!important;
 left:calc(var(--p)* (100% - 38px) + 19px)!important;
}