:root{--bg:#0f0c1c;--panel:#19152a;--panel2:#211c35;--ink:#f8f7ff;--muted:#a7a0bd;--line:rgba(221,206,255,.13);--pink:#ff68bb;--purple:#a87bff;--yellow:#ffdc80;--green:#70edc0;--radius:24px;--shadow:0 32px 90px rgba(0,0,0,.3);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html{min-height:100%;background:var(--bg)}body{margin:0;min-width:310px;min-height:100vh;color:var(--ink);background:radial-gradient(ellipse at 35% -20%,#29163f 0%,transparent 45%),radial-gradient(ellipse at 100% 76%,#221c46 0%,transparent 45%),#100e20;overflow-x:hidden}button{font:inherit;cursor:pointer}button:disabled{cursor:not-allowed;opacity:.52}button:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}.ambient{position:fixed;pointer-events:none;border-radius:100%;filter:blur(60px);opacity:.16;z-index:0}.ambient-one{width:330px;height:330px;background:#ed39bb;left:-180px;top:22vh}.ambient-two{width:360px;height:360px;background:#644dff;right:-170px;bottom:-80px}.app-shell{position:relative;z-index:1;max-width:1200px;margin:auto;padding:26px 36px 20px}.topbar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-bottom:22px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:11px;font-size:12px;letter-spacing:.13em;font-weight:900}.brand-mark{display:inline-flex;width:32px;height:32px;align-items:center;justify-content:center;color:#1b1232;background:linear-gradient(140deg,#ffe39b,#ff79b4);font-size:24px;border-radius:11px}.heart{color:var(--pink)}.status-pill{display:flex;align-items:center;gap:8px;padding:9px 13px;border:1px solid rgba(112,237,192,.24);background:rgba(59,156,123,.11);border-radius:100px;color:#9af3d3;font-size:11px;font-weight:750;max-width:58%}.status-pill.is-loading{color:#f9d898;border-color:rgba(255,220,128,.23);background:rgba(255,220,128,.08)}.status-pill.is-error{color:#ffadb9;border-color:rgba(255,99,128,.25);background:rgba(255,99,128,.1)}.status-dot{width:6px;height:6px;flex:none;border-radius:50%;background:currentColor;box-shadow:0 0 12px currentColor}.main-layout{display:grid;grid-template-columns:minmax(0,1.33fr) minmax(285px,.84fr);gap:48px;align-items:center;padding:39px 0 14px}.hero-area{text-align:center;min-width:0}.eyebrow,.panel-kicker,.modal-eyebrow{font-size:10px;letter-spacing:.22em;font-weight:900;color:#f4bde2}.eyebrow-spark{color:var(--yellow);margin-right:5px}.hero-area h1{font-size:clamp(44px,5.4vw,72px);line-height:1.09;letter-spacing:-.052em;margin:13px 0 8px;font-weight:950}.title-accent{background:linear-gradient(100deg,#ff87be 5%,#b89bff 85%);-webkit-background-clip:text;background-clip:text;color:transparent}.subtitle{font-size:15px;color:var(--muted);margin:0}.subtitle strong{font-weight:700;color:#f3efff}.wheel-stage{margin:32px auto 9px;max-width:515px;padding:0 16px}.wheel-outer-ring{position:relative;isolation:isolate;aspect-ratio:1/1;border-radius:50%;padding:10px;background:linear-gradient(137deg,#fff0ba,#bfa6ff 36%,#3e345c 67%,#f7add3 100%);box-shadow:0 0 0 7px rgba(169,121,255,.07),0 24px 55px #06050b8f,0 0 65px rgba(175,96,255,.18)}.wheel-outer-ring:before{content:"";position:absolute;inset:4px;pointer-events:none;border:1px solid rgba(255,255,255,.5);border-radius:50%;z-index:2}.wheel-glow{pointer-events:none;position:absolute;inset:12px;border-radius:50%;box-shadow:inset 0 0 18px #08061d87;z-index:1}.wheel-rotor{width:100%;height:100%;aspect-ratio:1;border-radius:50%;overflow:hidden;transform:rotate(0deg);will-change:transform;backface-visibility:hidden;background:#4b345b}.wheel-rotor canvas{display:block;width:100%;height:100%;border-radius:50%}.wheel-pointer{position:absolute;top:-16px;left:50%;transform:translateX(-50%);z-index:10;filter:drop-shadow(0 4px 3px #080512bd)}.pointer-head{width:0;height:0;border-style:solid;border-width:32px 19px 0 19px;border-color:#ffe69a transparent transparent transparent}.wheel-pointer:before{content:"";display:block;width:16px;height:9px;border-radius:5px 5px 0 0;background:#fff0c5;position:absolute;top:-5px;left:11px}.wheel-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:94px;height:94px;border-radius:50%;border:7px solid #f3e7ff;z-index:5;background:radial-gradient(circle at 35% 20%,#31234e,#140f2b 80%);box-shadow:0 5px 22px #06040fbd,0 0 0 4px #4c365e;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;font-size:15px;font-weight:1000;letter-spacing:.055em}.wheel-center:disabled{opacity:1}.center-symbol{font-size:23px;line-height:1;color:var(--yellow);margin-bottom:3px}.spin-hint{margin-top:21px;color:#b6aacb;font-size:12px;min-height:20px}.primary-button{border:0;border-radius:17px;background:linear-gradient(105deg,#ff8cad 0%,#e76dbd 45%,#b38aff 100%);color:#24132e;box-shadow:0 11px 32px rgba(236,92,192,.22),inset 0 1px 0 #fff8;font-size:14px;font-weight:1000;letter-spacing:.085em;display:flex;align-items:center;justify-content:center;gap:13px;min-height:58px;padding:13px 26px;transition:filter .15s,transform .15s}.primary-button:not(:disabled):active{transform:translateY(2px)}.primary-button:not(:disabled):hover{filter:brightness(1.06)}#spinButton{width:min(100%,380px);margin:12px auto 0}.button-spark{font-size:23px}.button-arrow{margin-left:auto;font-size:21px}.under-button{font-size:11px;color:#88819f;margin:13px 0 0}.side-panel{border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(135deg,rgba(38,32,62,.94),rgba(24,20,42,.96));box-shadow:var(--shadow);padding:25px 24px;align-self:center}.panel-head{display:flex;align-items:center;gap:13px;margin-bottom:23px}.panel-head-icon{width:47px;height:47px;background:rgba(178,133,255,.13);border:1px solid rgba(191,153,255,.17);display:grid;place-items:center;border-radius:15px;font-size:23px;flex:none}.panel-head-text{flex:1}.panel-kicker{color:#a69abf;font-size:9px;letter-spacing:.15em}.panel-head h2{margin:5px 0 0;font-size:21px;line-height:1.1;letter-spacing:-.035em}.counter{background:#393051;color:#e3d8ff;border:1px solid #504465;border-radius:10px;min-width:37px;text-align:center;padding:8px;font-size:14px;font-weight:900}.candidate-list{display:flex;flex-direction:column;gap:9px;min-height:355px}.candidate{display:flex;gap:12px;align-items:center;min-height:41px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.055);padding:7px 10px;border-radius:12px;font-size:13px;font-weight:700;transition:background .18s}.candidate-number{height:25px;width:26px;flex:none;border-radius:8px;background:var(--segment);display:grid;place-items:center;color:#191226;font-size:12px;font-weight:1000}.candidate-label{overflow-wrap:anywhere}.candidate.highlight{background:rgba(255,216,137,.16);border-color:rgba(255,216,137,.37)}.candidate.highlight .candidate-label{color:#ffe4a4}.empty-list{border:1px dashed rgba(221,206,255,.16);border-radius:15px;padding:30px 12px;text-align:center;display:grid;place-items:center;min-height:218px;font-size:13px;color:var(--muted);line-height:1.6}.panel-footer{border-top:1px solid var(--line);margin-top:20px;padding-top:20px}.secondary-button{display:flex;align-items:center;justify-content:center;gap:9px;border:1px solid rgba(210,192,255,.18);border-radius:13px;background:#302844;color:#e9e0ff;font-size:12px;letter-spacing:.01em;font-weight:850;min-height:47px;padding:11px 12px;width:100%;transition:background .18s}.secondary-button:not(:disabled):hover{background:#42345d}.refresh-icon{font-size:23px;line-height:.6}.pool-info{font-size:11px;color:#b1a7c4;display:flex;gap:7px;align-items:center;margin-top:17px}.pool-indicator{height:7px;width:7px;border-radius:50%;background:#70e8c4;box-shadow:0 0 10px #5bf4aa7c}.small-note{display:flex;gap:10px;margin-top:23px;background:#ffffff07;border:1px solid var(--line);border-radius:12px;padding:14px 12px;color:#b6a9cc;font-size:11px;line-height:1.5}.small-note>span:first-child{font-size:18px}.footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:10px;color:#776e90;font-size:10px;letter-spacing:.12em;font-weight:800;padding:20px 1px 8px}.footer-action{border:0;background:none;color:#b7a0df;font-size:11px;font-weight:750;letter-spacing:0}.footer-action:hover{color:#f3e3ff}.overlay{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:20px;background:rgba(6,5,15,.81);-webkit-backdrop-filter:blur(13px);backdrop-filter:blur(13px);opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s}.overlay.open{opacity:1;visibility:visible}.modal{width:min(100%,465px);max-height:90dvh;overflow-y:auto;text-align:center;position:relative;border-radius:27px;background:radial-gradient(circle at 48% -6%,#483466,#231b38 51%,#1b172b 100%);box-shadow:0 20px 120px #000c;border:1px solid rgba(246,214,255,.22);padding:34px 29px 28px;transform:translateY(25px) scale(.95);transition:transform .25s}.overlay.open .modal{transform:translateY(0) scale(1)}.modal-star{font-size:50px;line-height:1;color:#ffe2a5;text-shadow:0 0 33px #ffcc9f77;margin-bottom:15px}.modal-eyebrow{font-size:10px;color:#e8b5e4}.modal h2{font-size:30px;letter-spacing:-.04em;margin:13px 0 18px}.meal-result{min-height:120px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:rgba(255,255,255,.075);border:1px solid rgba(255,255,255,.14);border-radius:20px;padding:18px;margin:0 0 16px}.meal-emoji{font-size:28px}.meal-result>span:last-child{font-weight:950;font-size:clamp(20px,5vw,30px);color:#ffda99;line-height:1.2;overflow-wrap:anywhere}.result-subtitle{color:#c1b5d1;line-height:1.6;font-size:13px;margin:0 0 24px}.modal-actions{display:grid;gap:10px}.modal-primary{width:100%;min-height:55px}.modal-secondary{background:transparent;min-height:50px}.modal-error{background:#ff607518;color:#ffb8c5;border:1px solid #ff607549;padding:12px;border-radius:10px;font-size:12px;line-height:1.5;margin-top:13px}.success-emoji{font-size:52px;margin-bottom:16px}.success-meal{font-size:26px;font-weight:950;color:#ffe1a7;margin:12px 0 17px;overflow-wrap:anywhere}.toast{position:fixed;left:50%;bottom:max(25px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:120;width:max-content;max-width:calc(100% - 32px);padding:13px 19px;border:1px solid #ff93ac66;border-radius:14px;background:#4a2238;color:#ffe3e8;box-shadow:0 12px 35px #0009;font-size:12px;line-height:1.4;text-align:center}.confetti-piece{position:fixed;z-index:120;top:-24px;left:var(--x);width:var(--s);height:calc(var(--s) * 1.8);background:var(--color);transform:rotate(var(--rot));pointer-events:none;animation:fall var(--dur) ease-in forwards}@keyframes fall{to{transform:translate3d(var(--drift),110vh,0) rotate(680deg);opacity:.2}}
@media(max-width:920px){.app-shell{padding:20px 24px}.main-layout{gap:24px;grid-template-columns:minmax(0,1.15fr) minmax(250px,.85fr)}.hero-area h1{font-size:47px}.wheel-stage{margin-top:29px}.side-panel{padding:18px 15px}.candidate-list{min-height:322px}}
@media(max-width:700px){.app-shell{padding:17px 17px 12px;max-width:550px}.topbar{padding-bottom:16px}.brand{font-size:10px}.status-pill{font-size:10px;padding:8px 9px}.main-layout{grid-template-columns:1fr;gap:28px;padding-top:30px}.hero-area h1{font-size:clamp(43px,11vw,61px);margin-top:10px}.subtitle{font-size:13px}.wheel-stage{width:min(100%,440px);padding:0 9px;margin-top:27px}.wheel-outer-ring{padding:8px}.wheel-center{width:77px;height:77px;border-width:5px;font-size:13px}.center-symbol{font-size:21px}.wheel-pointer{top:-11px}.pointer-head{border-width:25px 15px 0 15px}.wheel-pointer:before{left:8px;width:14px}.spin-hint{margin-top:17px}.side-panel{padding:22px 19px;margin-bottom:10px}.candidate-list{min-height:unset;display:grid;grid-template-columns:1fr 1fr;gap:8px}.candidate{min-width:0;font-size:11px;gap:8px;min-height:47px;padding:6px}.candidate-number{width:24px;height:24px}.panel-head{margin-bottom:17px}.footer{font-size:8px}.under-button{margin-bottom:0}}
@media(max-width:370px){.candidate-list{grid-template-columns:1fr}.candidate{font-size:12px}.brand{letter-spacing:.07em}.status-pill{font-size:9px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.wheel-rotor{will-change:auto}}

/* V5 – kleine Rezeptbilder und flexible Namen im Ergebnis-Popup. */
.recipe-image-wrap {width:min(100%,238px);height:132px;border-radius:15px;overflow:hidden;background:#161126;border:1px solid rgba(255,255,255,.15);margin:0 auto 5px;}
.recipe-image-wrap img {display:block;width:100%;height:100%;object-fit:cover;object-position:center;}
.meal-result>.meal-name {display:block;max-width:100%;min-width:0;font-size:clamp(19px,4.7vw,29px);line-height:1.24;overflow-wrap:anywhere;hyphens:auto;text-wrap:balance;}
.meal-result>.meal-name.long-name{font-size:clamp(17px,4.1vw,24px);}
.meal-result>.meal-name.extra-long-name{font-size:clamp(15px,3.8vw,20px);}
.meal-result{min-width:0;}
.modal h2,.success-meal{overflow-wrap:anywhere;hyphens:auto;}
[hidden]{display:none!important;}