:root{--bg: #FAF6F0;--ink: #2B2331;--card: #FFFFFF;--muted: #8a8093;--accent: #9B7EDE;--accent2: #7B5FC7;--ok: #3fae6a;--warn: #e8a23c;--bad: #e05555;--radius: 18px;--shadow: 0 6px 24px rgba(43, 35, 49, .1)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%}body{background:var(--bg);color:var(--ink);font-family:Nunito,system-ui,sans-serif;overscroll-behavior:none}#app{display:flex;flex-direction:column;min-height:100dvh;max-width:560px;margin:0 auto;padding-bottom:env(safe-area-inset-bottom)}#topbar{display:flex;align-items:center;gap:12px;padding:12px 18px 4px}.logo{font-family:"Baloo 2",sans-serif;font-weight:800;font-size:24px;background:linear-gradient(120deg,var(--accent),var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:.04em}.logo img{height:30px;display:block}#stepper{display:flex;gap:8px;list-style:none;margin:0 0 0 auto;padding:0}#stepper li{width:10px;height:10px;border-radius:50%;background:#ded7e6;transition:all .3s ease}#stepper li.active{background:var(--accent);transform:scale(1.25)}#stepper li.done{background:var(--accent2)}#sound-toggle{background:none;border:0;font-size:18px;cursor:pointer}#stage-wrap{position:relative;height:38dvh;min-height:240px}#stage{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1}#stage canvas{display:block}#attract-video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:0;display:none;background:var(--bg)}#attract-video-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;display:none;pointer-events:none;background:linear-gradient(to top,#faf6f0eb,#faf6f000 34%)}#app[data-screen=attract] #attract-video.playing,#app[data-screen=attract] #attract-video.playing+#attract-video-overlay{display:block}#app[data-screen=attract] #stage-wrap.video-active #stage{opacity:0}#drink-label{position:absolute;left:50%;bottom:6px;transform:translate(-50%);font-family:"Baloo 2",sans-serif;font-weight:700;font-size:15px;background:#ffffffd9;border-radius:999px;padding:4px 14px;box-shadow:var(--shadow);white-space:nowrap}#panel{flex:1;position:relative;padding:10px 18px 8px;overflow-y:auto}.screen{display:none;animation:rise .35s ease both}.screen.active{display:block}@keyframes rise{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}.hero-title{font-family:"Baloo 2",sans-serif;font-weight:800;font-size:clamp(30px,8vw,40px);line-height:1.05;margin:8px 0 6px}.grad{background:linear-gradient(120deg,var(--accent),var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent}.hero-sub{color:var(--muted);font-size:16px;margin:0 0 18px}.hint{color:var(--muted);font-size:13px;text-align:center;margin-top:10px}.step-title{font-family:"Baloo 2",sans-serif;font-weight:700;font-size:22px;margin:4px 0 12px}.cta{display:block;width:100%;padding:16px;border:0;border-radius:var(--radius);font-family:"Baloo 2",sans-serif;font-weight:700;font-size:18px;color:#fff;background:linear-gradient(120deg,var(--accent),var(--accent2));box-shadow:var(--shadow);cursor:pointer;transition:transform .12s ease}.cta:active{transform:scale(.97)}.cta.ghost{background:var(--card);color:var(--ink);border:2px solid #eee5f5;margin-top:10px}.seg-row{display:flex;gap:8px;margin-bottom:14px}.seg-row button{flex:1;padding:10px 6px;border-radius:14px;border:2px solid transparent;background:var(--card);font-family:Nunito;font-weight:700;font-size:14px;box-shadow:var(--shadow);cursor:pointer;transition:all .2s ease;color:var(--ink)}.seg-row button.active{border-color:var(--accent);background:#fff}.card-row{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.opt-card{background:var(--card);border-radius:var(--radius);padding:14px 12px;border:2px solid transparent;box-shadow:var(--shadow);cursor:pointer;text-align:left;transition:all .18s ease;position:relative;font-family:Nunito}.opt-card.selected{border-color:var(--accent);transform:translateY(-2px)}.opt-card[disabled]{opacity:.42;cursor:not-allowed}.opt-card .swatch{width:34px;height:34px;border-radius:12px;margin-bottom:8px;box-shadow:inset 0 -6px 12px #0000001f;background-size:cover;background-position:center}.opt-card .name{font-weight:800;font-size:15px;color:var(--ink)}.opt-card .price{color:var(--muted);font-size:13px}.opt-card .why{color:var(--bad);font-size:11.5px;font-weight:700}.opt-card .soldout-badge{position:absolute;top:8px;right:8px;font-size:10px;font-weight:800;background:var(--bad);color:#fff;border-radius:999px;padding:2px 8px}.chip-grid{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}.chip{display:inline-flex;align-items:center;gap:7px;padding:9px 14px;background:var(--card);border-radius:999px;border:2px solid transparent;box-shadow:var(--shadow);font-weight:700;font-size:14px;cursor:pointer;transition:all .18s ease;font-family:Nunito;color:var(--ink)}.chip.selected{border-color:var(--accent);background:#f6f0ff}.chip[disabled]{opacity:.42;cursor:not-allowed;text-decoration:line-through}.chip .dot{width:14px;height:14px;border-radius:50%;box-shadow:inset 0 -3px 5px #00000026;background-size:cover}.chip .plus{color:var(--muted);font-size:12px;font-weight:600}.level-row{margin:12px 0}.level-row .lbl{font-weight:800;font-size:13px;margin-bottom:6px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.level-row .opts{display:flex;gap:6px}.level-row .opts button{flex:1;padding:8px 4px;border-radius:12px;border:2px solid transparent;background:var(--card);font-weight:700;font-size:13px;cursor:pointer;box-shadow:var(--shadow);font-family:Nunito;color:var(--ink);transition:all .15s ease}.level-row .opts button.active{border-color:var(--accent)}.level-row .opts button[disabled]{opacity:.4;cursor:not-allowed}#summary-items{list-style:none;padding:0;margin:0 0 12px}#summary-items li{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px dashed #e9e2f1;font-size:15px}.price-row{display:flex;justify-content:space-between;align-items:center;font-size:18px;margin:12px 0 16px;font-weight:800}#allergen-ampel{margin:10px 0}.ampel-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.ampel-light{width:14px;height:14px;border-radius:50%;flex:none}.ampel-light.gruen{background:var(--ok)}.ampel-light.gelb{background:var(--warn)}.allergen-tag{font-size:12px;font-weight:700;background:#fdf3e3;color:#8a6420;padding:3px 10px;border-radius:999px}.ampel-ok{font-size:13px;color:var(--ok);font-weight:700}#order-status-story{margin:4px 0 14px}.story-step{display:flex;align-items:center;gap:10px;padding:7px 0;opacity:.35;transition:opacity .4s ease}.story-step.reached{opacity:1}.story-step.current .story-txt{font-weight:800}.story-ico{width:34px;height:34px;border-radius:12px;background:var(--card);box-shadow:var(--shadow);display:grid;place-items:center;font-size:17px;flex:none}.story-step.current .story-ico{animation:pulse 1.4s ease infinite}@keyframes pulse{50%{transform:scale(1.12)}}.funfact{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:12px 14px;font-size:14px;margin:10px 0}.funfact b{font-family:"Baloo 2"}#game-wrap{margin:10px 0;position:relative}#game-canvas{width:100%;border-radius:var(--radius);background:#f3edfa;display:block;touch-action:none}#game-hud{position:absolute;top:8px;left:12px;font-family:"Baloo 2";font-weight:700;font-size:16px}#highscore-box{margin-top:10px;font-size:14px}#highscore-box table{width:100%;border-collapse:collapse}#highscore-box td{padding:4px 0;border-bottom:1px dashed #e9e2f1}.pickup{font-size:17px}.pickup strong{font-family:"Baloo 2";font-size:24px;color:var(--accent2)}#share-card-slot img,#share-card-slot canvas{width:100%;border-radius:var(--radius);box-shadow:var(--shadow)}#flow-nav{display:flex;gap:10px;padding:8px 18px}.nav-btn{padding:13px 22px;border-radius:var(--radius);border:0;font-family:"Baloo 2";font-weight:700;font-size:16px;cursor:pointer;background:#ece5f3;color:var(--ink)}.nav-btn.primary{flex:1;background:linear-gradient(120deg,var(--accent),var(--accent2));color:#fff;box-shadow:var(--shadow)}.nav-btn[disabled]{opacity:.45;cursor:not-allowed}#powered{text-align:center;font-size:11.5px;color:var(--muted);padding:6px 0 10px}.upsell{display:flex;align-items:center;gap:10px;background:#fff8ec;border:2px dashed #f0d9a8;border-radius:var(--radius);padding:10px 12px;margin-top:4px}.upsell button{border:0;border-radius:999px;padding:7px 14px;font-weight:800;cursor:pointer;font-family:Nunito}.upsell .yes{background:var(--accent);color:#fff}.upsell .no{background:transparent;color:var(--muted)}@media(min-width:700px){#stage-wrap{height:44dvh}}#app[data-mode=signature]:not([data-screen=attract]) #stage-wrap{display:none}#app[data-mode=signature] #stepper{visibility:hidden}#mode-ctas{display:flex;flex-direction:column;gap:10px}#mode-ctas .cta{margin-top:0;min-height:54px}.sig-sub{color:var(--muted);font-size:14.5px;margin:-6px 0 14px}.sig-note{margin:0 0 12px;padding:10px 14px;border-radius:12px;background:#e84a6f1f;color:#c2304f;font-size:13.5px;font-weight:700}.sig-chip-row{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;margin-bottom:14px;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 26px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 26px),transparent)}.sig-chip-row::-webkit-scrollbar{display:none}.sig-chip-row:after{content:"";flex:0 0 26px}.sig-chip{flex:none;min-height:44px;padding:9px 16px;border-radius:999px;border:2px solid transparent;background:var(--card);color:var(--ink);font-family:Nunito;font-weight:700;font-size:14px;cursor:pointer;box-shadow:var(--shadow);transition:all .25s ease}.sig-chip.active{border-color:var(--accent);background:#fff}.sig-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:14px}.sig-card{position:relative;display:block;padding:0;border:0;text-align:left;border-radius:var(--radius);overflow:hidden;background:var(--card);box-shadow:var(--shadow);cursor:pointer;font-family:Nunito;transition:transform .25s ease,box-shadow .25s ease}.sig-card:active{transform:scale(.975)}.sig-card[disabled]{cursor:not-allowed}.sig-card[disabled] .sig-card-img{filter:grayscale(.7);opacity:.55}.sig-card-img{display:block;width:100%;aspect-ratio:3 / 4;object-fit:cover}.sig-card-body{display:block;padding:10px 12px 12px}.sig-card-name{display:block;font-weight:800;font-size:14.5px;color:var(--ink);line-height:1.25}.sig-card-meta{display:block;color:var(--muted);font-size:12.5px;margin-top:2px}.sig-card .soldout-badge{z-index:1}#sig-story-media{position:relative;border-radius:22px;overflow:hidden;aspect-ratio:4 / 5;max-height:48dvh;width:100%;background:#efe9f4;box-shadow:var(--shadow);margin-bottom:14px}#sig-story-media img,#sig-story-media video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover}#sig-story-video{opacity:0;transition:opacity .25s ease}#sig-story-video.playing{opacity:1}@keyframes sig-ken-burns{0%{transform:scale(1) translateY(0)}to{transform:scale(1.07) translateY(-1.5%)}}#sig-story-hero{animation:sig-ken-burns 14s ease-in-out infinite alternate}.sig-story-head{display:flex;align-items:center;gap:10px}.sig-story-head .step-title{margin:0;flex:1}.sig-kat-tag{flex:none;font-size:12px;font-weight:800;color:var(--accent2);background:#fff;border-radius:999px;padding:5px 12px;box-shadow:var(--shadow)}.sig-desc{color:var(--muted);font-size:15px;line-height:1.45;margin:8px 0 12px}.sig-lbl{font-weight:800;font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}.sig-zutaten{list-style:none;display:flex;flex-wrap:wrap;gap:6px;padding:0;margin:0 0 12px}.sig-zutaten li{background:var(--card);border-radius:999px;padding:6px 12px;font-size:13px;font-weight:700;box-shadow:var(--shadow)}.sig-btn-row{display:flex;gap:10px;margin-top:4px}.sig-btn-row .cta{margin-top:0}.sig-btn-row .cta.ghost{flex:0 0 38%}.sig-btn-row .cta:not(.ghost){flex:1}.sig-custom-head{display:flex;align-items:center;gap:12px;margin-bottom:10px}#sig-custom-thumb{width:60px;height:60px;border-radius:16px;object-fit:cover;box-shadow:var(--shadow)}.sig-custom-name{font-family:"Baloo 2";font-weight:700;font-size:18px}.sig-custom-base{color:var(--muted);font-size:13px;font-weight:700}#sig-size-row .opts button small{display:block;font-size:10.5px;color:var(--muted);font-weight:700;margin-top:1px}#sig-size-row .opts button,#sig-suesse-row .opts button,#sig-eis-row .opts button{min-height:44px}.sig-hint{text-align:left;margin:8px 0 0}
