/* Foodly V28 – einheitliche Premium-Oberflaechen, keine Aenderung an Daten oder Roulette-Logik */
:root{--v28-forest:#101b15;--v28-panel:#18251c;--v28-panel2:#213025;--v28-gold:#b8a36b;--v28-mint:#a8dfa6;--v28-cream:#f4eee0;--v28-muted:#b9c5b8;--v28-edge:rgba(190,209,177,.17);--v28-shadow:0 14px 38px rgba(0,0,0,.28)}
html.fds-haupt,html.fds-klassik{color-scheme:dark;scroll-behavior:smooth}
html.fds-haupt body,html.fds-klassik body{background:var(--v28-forest);color:var(--v28-cream);-webkit-font-smoothing:antialiased}
html.fds-haupt button,html.fds-klassik button{transition:background-color .2s,border-color .2s,box-shadow .2s,transform .2s}
html.fds-haupt button:focus-visible,html.fds-klassik button:focus-visible{outline:2px solid var(--v28-gold);outline-offset:3px}
html.fds-haupt .karte,html.fds-haupt .hauptwahl,html.fds-klassik .card,html.fds-klassik .panel{background:linear-gradient(150deg,rgba(38,56,43,.96),rgba(18,29,22,.98));border:1px solid var(--v28-edge);box-shadow:var(--v28-shadow);border-radius:24px}
html.fds-haupt .karte img,html.fds-haupt .hauptwahl img,html.fds-klassik .card img,html.fds-klassik .panel img{object-fit:cover;max-width:100%}
html.fds-haupt .fyBereichIntro,html.fds-klassik .fyBereichIntro{border-color:rgba(184,163,107,.25);box-shadow:var(--v28-shadow)}
html.fds-haupt input:not([type=range]):not([type=checkbox]),html.fds-haupt textarea,html.fds-haupt select,html.fds-klassik input:not([type=range]):not([type=checkbox]),html.fds-klassik textarea,html.fds-klassik select{font-size:16px!important;border-radius:14px;min-height:44px}
html.fds-haupt .knopf:not(.leise),html.fds-klassik .btn-primary{border-radius:15px}
/* Hauptnavigation: 5 Ziele, mittig das bestehende Foodly-Blatt. */
html.fds-haupt #nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:center;gap:0;padding-bottom:max(8px,env(safe-area-inset-bottom));background:linear-gradient(180deg,rgba(20,32,24,.98),#0d1711);border-top:1px solid rgba(184,163,107,.25);box-shadow:0 -12px 32px rgba(0,0,0,.25)}
html.fds-haupt #nav>button{min-width:0;min-height:58px;font-size:11px;letter-spacing:.05px}
html.fds-haupt #nav>button[data-tab=roulette]{isolation:isolate}
html.fds-haupt #nav>button[aria-pressed=true]:not(.navRad){color:var(--v28-mint)}
/* Kommandozentrale: die vorhandenen neun Funktionen behalten ihre Animation und Position. */
html.fds-haupt .fkzKreis,html.fds-klassik .fkzKreis{background:radial-gradient(circle at 35% 22%,#344e3b,#16271b 76%)!important;border:1.5px solid rgba(184,163,107,.56)!important;box-shadow:0 8px 22px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.14)!important}
html.fds-haupt .fkzFn[data-fkz=roulette] .fkzKreis,html.fds-klassik .fkzFn[data-fkz=roulette] .fkzKreis{background:radial-gradient(circle at 30% 20%,#69418b,#271534 80%)!important;border-color:rgba(192,153,236,.65)!important}
html.fds-haupt .fkzName,html.fds-klassik .fkzName{color:var(--v28-cream);text-shadow:0 2px 8px #000;font-weight:700}
html.fds-haupt .fkzBlatt,html.fds-klassik .fkzBlatt{border-color:rgba(184,163,107,.7)!important}
/* Kein Verdecken der Inhalte durch die Navigation */
html.fds-haupt main{padding-bottom:max(104px,calc(85px + env(safe-area-inset-bottom)))}
@media(max-width:390px){html.fds-haupt #nav>button{font-size:10px}html.fds-haupt .karte,html.fds-klassik .card{border-radius:20px}}
@media(prefers-reduced-motion:reduce){html.fds-haupt button,html.fds-klassik button{transition:none}}

/* V28.1 – beide bewusst getrennten Bestaetigungen, immer sichtbar */
html.fds-haupt .reglerfuss.dreier{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;align-items:stretch}
html.fds-haupt .reglerfuss.dreier .uebernehmen{min-width:0;min-height:46px;white-space:normal;border-radius:14px;font-weight:700}
html.fds-haupt .reglerfuss.dreier .uebernehmen.dynamisch{background:linear-gradient(145deg,#b8a36b,#8d7747);color:#111a13;border:1px solid rgba(255,241,187,.55)}
html.fds-haupt .reglerfuss.dreier .uebernehmen.lang{background:linear-gradient(145deg,#35583b,#233b2b);color:#f4eee0;border:1px solid rgba(168,223,166,.4)}
html.fds-haupt .reglerfuss.dreier .kenneIchNicht{min-height:44px;min-width:0;white-space:normal}
html.fds-haupt .k2bild img{width:100%;height:100%;object-fit:cover;image-rendering:auto}
@media(max-width:360px){html.fds-haupt .reglerfuss.dreier{grid-template-columns:1fr}}

/* V31.2: App-wide premium visual language; retain classic and roulette animation. */
html.fds-haupt{--v28-forest:#0c130e;--v28-panel:#19271e;--v28-panel2:#24382a;--v28-gold:#baa66c;--v28-mint:#a1dca2;--v28-cream:#f5f0e5;--v28-muted:#bbc9be}
html.fds-haupt body{background:#0c130e!important;color:var(--v28-cream)!important}
html.fds-haupt .hauptwahl,html.fds-haupt .karte,html.fds-haupt .fyBereichIntro{border:1px solid rgba(185,207,168,.23);box-shadow:0 14px 38px rgba(0,0,0,.28)}
html.fds-haupt .hauptwahl{background:linear-gradient(145deg,#263a2b,#15241a)}
html.fds-haupt button:focus-visible,html.fds-haupt input:focus-visible{outline:2px solid #baa66c;outline-offset:3px}
html.fds-haupt input:not([type=range]),html.fds-haupt select,html.fds-haupt textarea{background:#122016;color:#f5f0e5;border:1px solid rgba(185,207,168,.28)}
html.fds-haupt .knopf:not(.leise){background:linear-gradient(130deg,#a1dca2,#79c589);color:#102018}
html.fds-haupt #nav{border-top-color:rgba(186,166,108,.36)}
html.fds-haupt .fyBereichIntro h2{color:#f5f0e5}