/* ============================================================
   Mittagsheld — Shop v3. Muster der großen Food-Apps:
   Cover + Venue-Karte, sticky Tag-Tabs, Menü als Zeilenliste mit
   Foto rechts und +/− Stepper, Warenkorb-Leiste → eigene Kasse.
   Eigenständiges Stylesheet (lädt app.css NICHT).
   ============================================================ */
:root{
  --bg:#ffffff; --bg-2:#f6f4ef; --line:#e9e5dc; --line-2:#d9d3c6;
  --ink:#171411; --ink-2:#6a635a; --ink-3:#9a9387;
  --navy:#1e2a44; --navy-ink:#15203a; --navy-soft:#e8ecf4;
  --gold:#c8961e; --gold-ink:#8f6a10; --gold-soft:#f7edd3;
  --ok:#2f7a4f; --ok-soft:#e4f0e8; --crit:#b0392a; --crit-soft:#f8e3de;
  --f-display:"Archivo","Helvetica Neue",Arial,sans-serif;
  --f-body:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --r:12px; --r-l:16px; --maxw:760px;
  --shadow:0 1px 2px rgba(30,20,5,.05),0 8px 24px rgba(30,20,5,.08);
  --card:#ffffff; --navy-t:#1e2a44; --glass:255,255,255; --page:#fbf8f2; --page-rgb:251,248,242;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-padding-top:120px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 15px/1.5 var(--f-body)}
button,input,select{font-family:var(--f-body)}
.hidden{display:none!important}
.muted{color:var(--ink-2)}.xs{font-size:12px}.small{font-size:13px}
h1,h2,h3{margin:0;font-family:var(--f-display);letter-spacing:-.01em}

/* ---------- Topbar ---------- */
header.top{position:sticky;top:0;z-index:40;background:rgba(var(--glass),.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
html.native header.top{padding-top:env(safe-area-inset-top)}
.topbar{max-width:var(--maxw);margin:0 auto;height:52px;padding:0 16px;display:flex;align-items:center;gap:10px}
.brand{display:inline-flex;align-items:center;gap:9px;text-decoration:none;color:var(--ink);font:800 17px/1 var(--f-display)}
.brand img{width:30px;height:30px;object-fit:contain}
.iconbtn{margin-left:auto;display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line-2);background:var(--card);color:var(--ink);font:600 13px/1 var(--f-body);padding:8px 11px;border-radius:999px;cursor:pointer}
.s-infoi{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;border:1.5px solid currentColor;font:700 11px/1 var(--f-display);font-style:italic}
@media(max-width:600px){.iconbtn-txt{display:none}.iconbtn{padding:8px}}

/* ---------- Cover + Venue ---------- */
.cover{height:150px;background:radial-gradient(120% 140% at 20% 0%,#2a3a5e 0%,var(--navy) 45%,#101a30 100%);position:relative;overflow:visible}
.cover::after{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Ccircle cx='60' cy='60' r='28' fill='none' stroke='%23c8961e' stroke-opacity='.18' stroke-width='2'/%3E%3Ccircle cx='60' cy='60' r='40' fill='none' stroke='%23c8961e' stroke-opacity='.1' stroke-width='2'/%3E%3C/svg%3E") center/120px 120px;opacity:.9}
.cover-art{position:absolute;left:50%;bottom:-40px;transform:translateX(-50%);width:124px;height:124px;border-radius:28px;background:var(--card);border:4px solid #fff;box-shadow:var(--shadow);display:grid;place-items:center;overflow:hidden;z-index:2}
.cover-art img{width:112px;height:112px;object-fit:contain}
.venue{max-width:var(--maxw);margin:0 auto;padding:50px 16px 0}
.venue-card{text-align:center}
.venue-card h1{font:800 clamp(21px,5.2vw,28px)/1.15 var(--f-display);letter-spacing:-.02em;margin:0 auto 6px;max-width:24ch}
.venue-card h1 b{color:var(--gold-ink)}
.venue-sub{margin:0 auto 12px;color:var(--ink-2);font-size:14px;max-width:48ch}
.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.chip{display:inline-flex;align-items:center;gap:5px;background:var(--bg-2);border:1px solid var(--line);border-radius:999px;padding:7px 10px;font:500 12px/1 var(--f-body);color:var(--ink);white-space:nowrap}
.chip b{font-weight:700}
.chip svg{width:14px;height:14px;color:var(--ink-2)}
@media(min-width:700px){
  .cover{height:190px}
  .venue{padding:52px 16px 0}
}

/* ---------- Tag-Tabs (sticky) ---------- */
.daytabs-wrap{position:sticky;top:52px;z-index:30;background:rgba(var(--glass),.96);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);margin-top:18px}
.daytabs{max-width:var(--maxw);margin:0 auto;display:flex;gap:6px;overflow-x:auto;padding:10px 16px;scrollbar-width:none;scroll-snap-type:x proximity}
.daytabs::-webkit-scrollbar{display:none}
.s-day{flex:0 0 auto;scroll-snap-align:start;background:var(--card);border:1.5px solid var(--line-2);border-radius:999px;padding:8px 13px;display:inline-flex;flex-direction:column;align-items:flex-start;gap:1px;cursor:pointer;position:relative;text-align:left;min-width:0}
.s-day-lab{font:700 13.5px/1.1 var(--f-display);color:var(--ink);white-space:nowrap}
.s-day-num{font:500 11.5px/1.1 var(--f-body);color:var(--ink-2);white-space:nowrap}
.s-day-dish,.s-day-veg,.s-day-off{display:none}
.s-day.sel{background:var(--navy);border-color:var(--navy-t)}
.s-day.sel .s-day-lab,.s-day.sel .s-day-num{color:#fff}
.s-day.sel .s-day-num{color:rgba(255,255,255,.75)}
.s-day.off{opacity:.45;cursor:not-allowed}
.s-day-next{position:absolute;top:-7px;right:-4px;background:var(--gold);color:#fff;font:700 9.5px/1 var(--f-body);padding:3px 6px;border-radius:999px;white-space:nowrap}
.s-day.sel .s-day-next{display:none}

/* ---------- Menü ---------- */
.menu{max-width:var(--maxw);margin:0 auto;padding:6px 16px 140px}
.msec{padding-top:18px}
.msec-h{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:0 0 4px}
.msec-h h2{font:800 19px/1.2 var(--f-display)}
.msec-h .meta{font-size:12.5px;color:var(--ink-2);white-space:nowrap}
.msec-sub{margin:0 0 6px;font-size:13px;color:var(--ink-2)}
.item{display:grid;grid-template-columns:1fr auto;gap:14px;padding:14px 0;border-bottom:1px solid var(--line);align-items:start}
.item:last-child{border-bottom:0}
.item-txt{min-width:0;display:flex;flex-direction:column;gap:4px}
.item-tag{display:inline-block;width:max-content;font:600 11px/1 var(--f-body);padding:4px 7px;border-radius:999px;margin-bottom:1px}
.item-tag.main{background:var(--navy-soft);color:var(--navy-t)}.item-tag.veg{background:var(--ok-soft);color:var(--ok)}.item-tag.des{background:var(--gold-soft);color:var(--gold-ink)}
.item-name{font:700 16px/1.25 var(--f-display);color:var(--ink)}
.item-desc{font-size:13.5px;line-height:1.45;color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.item-price{font:700 15px/1 var(--f-body);color:var(--ink);margin-top:3px;font-variant-numeric:tabular-nums}
.item-allerg{margin-top:2px}
.item-allerg summary{list-style:none;cursor:pointer;font:600 12.5px/1 var(--f-body);color:var(--ink-2);display:inline-flex;align-items:center;gap:5px}
.item-allerg summary::-webkit-details-marker{display:none}
.item-allerg summary::before{content:"";width:5px;height:5px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(-45deg)}
.item-allerg[open] summary::before{transform:rotate(45deg)}
.alist{margin-top:7px;display:flex;flex-wrap:wrap;gap:4px}
.alist span{font:500 11px/1 var(--f-body);background:var(--bg-2);border:1px solid var(--line);padding:4px 7px;border-radius:999px;color:var(--ink-2)}
.item-allerg p{margin:6px 0 0;font-size:11.5px;color:var(--ink-3)}
.item-media{position:relative;width:104px;height:104px;flex:0 0 auto}
.item-media img,.item-ph{width:104px;height:104px;border-radius:14px;object-fit:cover;display:block;background:var(--bg-2)}
.item-ph{display:grid;place-items:center;color:var(--line-2)}
.item-ph svg{width:34px;height:34px}
.item.compact{grid-template-columns:1fr auto;align-items:center;padding:11px 0}
.item.compact .item-media{width:auto;height:auto}
/* Stepper: nur "+" bis etwas gewählt ist, dann − n + */
.stepper{position:absolute;right:6px;bottom:6px;display:inline-flex;align-items:center;background:var(--card);border:1px solid var(--line-2);border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,.12);height:34px;overflow:hidden}
.item.compact .stepper{position:static;box-shadow:none}
.stepper button{width:34px;height:34px;border:0;background:var(--card);color:var(--navy-t);font:600 20px/1 var(--f-body);cursor:pointer;display:grid;place-items:center}
.stepper button:active{background:var(--navy-soft)}
.stepper output{min-width:26px;text-align:center;font:700 14px/1 var(--f-display);font-variant-numeric:tabular-nums;color:var(--ink)}
.stepper:not(.has) button[data-step="-1"],.stepper:not(.has) output{display:none}
.stepper.has{border-color:var(--navy-t)}
.stepper.has button[data-step="1"]{background:var(--navy);color:#fff;border-radius:0 999px 999px 0}

/* ---------- Warenkorb-Leiste ---------- */
.cartbar{position:fixed;left:0;right:0;bottom:0;z-index:50;padding:0 12px calc(10px + env(safe-area-inset-bottom));pointer-events:none}
.cartbar-inner{max-width:var(--maxw);margin:0 auto;background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:0 10px 36px rgba(20,15,5,.18);padding:10px 12px;pointer-events:auto}
.ob-bar{height:4px;background:var(--line);border-radius:999px;overflow:hidden;margin-bottom:9px}
.ob-bar i{display:block;height:100%;width:0;background:var(--gold);transition:width .25s ease}
.ob-bar i.full{background:var(--ok)}
.ob-row{display:flex;align-items:center;gap:12px}
.ob-info{flex:1;min-width:0}
.ob-tot{font:800 18px/1 var(--f-display);font-variant-numeric:tabular-nums;white-space:nowrap}
.ob-tot .xs{font:500 12px/1 var(--f-body);color:var(--ink-2);margin-left:4px}
.ob-hint{display:block;font:500 12px/1.3 var(--f-body);color:var(--ink-2);margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ob-hint.ok{color:var(--ok)}
.ob-hint b{color:var(--ink)}

/* ---------- Buttons ---------- */
.btn{font:700 14.5px/1 var(--f-body);background:var(--bg-2);color:var(--ink);border:1px solid var(--line-2);padding:12px 16px;border-radius:12px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none}
.btn.primary{background:var(--navy);color:#fff;border-color:var(--navy-t);height:46px;padding:0 18px;white-space:nowrap}
.btn.primary:hover{background:var(--navy-ink)}
.btn.primary:disabled{background:var(--line);color:var(--ink-3);border-color:var(--line);cursor:not-allowed}
.btn.big{width:100%;height:50px;font-size:15.5px;margin-top:4px}
.btn.ghost{background:var(--card)}
.btn.sm{padding:8px 12px;font-size:13px;border-radius:10px}
.linkbtn{background:none;border:0;padding:0;font:inherit;color:var(--navy-t);text-decoration:underline;text-underline-offset:2px;cursor:pointer}

/* ---------- Kasse ---------- */
.co-head{max-width:var(--maxw);margin:0 auto;padding:14px 16px 4px;display:flex;align-items:center;gap:10px}
.co-head h1{font:800 22px/1.2 var(--f-display)}
.backbtn{width:38px;height:38px;border-radius:50%;border:1px solid var(--line-2);background:var(--card);font:400 26px/1 var(--f-display);color:var(--ink);cursor:pointer;display:grid;place-items:center;padding-bottom:3px}
.co-layout{max-width:var(--maxw);margin:0 auto;padding:8px 16px 40px}
.co-main{display:flex;flex-direction:column;gap:14px}
.co-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-l);padding:16px;display:flex;flex-direction:column;gap:12px}
.co-card h2{font:800 16px/1.2 var(--f-display);display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.co-day{font:500 13px/1 var(--f-body);color:var(--ink-2)}
.co-lines{display:flex;flex-direction:column;gap:8px;font-size:14px}
.co-lines div{display:flex;justify-content:space-between;gap:10px}
.co-lines .n{font-variant-numeric:tabular-nums;color:var(--ink-2)}
.co-lines .muted{color:var(--ink-3)}
.co-tot{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--line);padding-top:10px;font:800 18px/1 var(--f-display);font-variant-numeric:tabular-nums}
.co-tot span{font:600 14px/1 var(--f-body);color:var(--ink-2)}
.co-note{margin:0;font-size:12.5px;color:var(--ink-2)}
.co-note.ok{color:var(--ok)}
.stackgap{display:flex;flex-direction:column;gap:10px}
.s-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.s-grid > *{min-width:0}
.s-grid .s-full{grid-column:1 / -1}
label.fl{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 5px;font:600 12.5px/1.2 var(--f-body);color:var(--ink);min-width:0;width:100%}
label.fl > .xs{font:500 12px/1 var(--f-body);color:var(--ink-3)}
label.fl input,label.fl select{flex:1 1 100%;width:100%;min-width:0;height:42px;border:1.5px solid var(--line-2);border-radius:10px;padding:0 11px;font:400 15px/1 var(--f-body);color:var(--ink);background:var(--card)}
label.fl input:focus{outline:none;border-color:var(--navy-t);box-shadow:0 0 0 3px var(--navy-soft)}
label.fl input[readonly]{background:var(--bg-2);color:var(--ink-2)}
.s-plzmsg{margin:-4px 0 0;font:500 13px/1.4 var(--f-body)}
.s-plzmsg.ok{color:var(--ok)}.s-plzmsg.err{color:var(--crit)}.s-plzmsg.muted{color:var(--ink-3)}
.payinfo{border:1px solid var(--line);border-radius:12px;padding:12px}
.payrow{display:flex;gap:12px;align-items:flex-start}
.payicon{font-size:20px;line-height:1}
.payrow b{display:block;font:700 14px/1.2 var(--f-body);margin-bottom:3px}
.payrow span{font-size:12.5px;color:var(--ink-2);line-height:1.45}
.check{display:flex;gap:10px;align-items:flex-start;font:400 13px/1.45 var(--f-body);color:var(--ink-2);cursor:pointer}
.check input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--navy-t);flex:0 0 auto}
.err{color:var(--crit);background:var(--crit-soft);border-radius:10px;padding:10px 12px;font:500 13.5px/1.4 var(--f-body)}
.note{max-width:var(--maxw);margin:12px auto 0;background:var(--bg-2);border-left:3px solid var(--gold);border-radius:10px;padding:11px 14px;font-size:14px;line-height:1.5}
.menu .note,.co-card .note{margin:0}
.note.critnote{border-left-color:var(--crit);background:var(--crit-soft)}
.note.warmnote{border-left-color:var(--gold)}
.note.okbox{border-left-color:var(--ok);background:var(--ok-soft)}

/* ---------- Status / Bestätigung ---------- */
.statuswrap{max-width:var(--maxw);margin:0 auto;padding:16px 16px 60px}
.statuswrap .card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-l)}
.statuswrap .pad{padding:16px}
.stack{display:flex;flex-direction:column;gap:12px}
.statuswrap h2{font:800 20px/1.2 var(--f-display)}
.statuswrap h3{font:800 15px/1.2 var(--f-display)}
.statuswrap p{margin:0}
.kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.kpi{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px}
.kpi .h{font:600 12px/1.2 var(--f-body);color:var(--ink-2);margin-bottom:6px}
.kpi .v{font:800 19px/1.15 var(--f-display)}
.kpi .s{font-size:12.5px;color:var(--ink-2);margin-top:3px}
.pill{font:600 12px/1 var(--f-body);padding:6px 10px;border-radius:999px;white-space:nowrap}
.pill.ok{background:var(--ok-soft);color:var(--ok)}.pill.warn{background:var(--gold-soft);color:var(--gold-ink)}.pill.shut{background:var(--crit-soft);color:var(--crit)}.pill.neutral{background:var(--bg-2);color:var(--ink-2);border:1px solid var(--line)}
.timeline{list-style:none;margin:4px 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
.timeline li{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;position:relative;font:600 12px/1.2 var(--f-body);color:var(--ink-2)}
.timeline li .tl-dot{width:14px;height:14px;border-radius:50%;border:2px solid var(--line-2);background:var(--card);z-index:1}
.timeline li::before{content:"";position:absolute;top:6px;left:-50%;width:100%;height:2px;background:var(--line)}
.timeline li:first-child::before{display:none}
.timeline li.done .tl-dot{background:var(--ok);border-color:var(--ok)}
.timeline li.done{color:var(--ink)}.timeline li.done::before{background:var(--ok)}
.timeline .tl-l span{display:block;font-weight:500;margin-top:2px}
.livebox{display:flex;align-items:center;gap:12px;background:var(--gold-soft);border:1px solid var(--gold);border-radius:12px;padding:12px 14px}
.livebox.still{background:var(--bg-2);border-color:var(--line)}
.live-dot{width:12px;height:12px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 0 rgba(47,122,79,.5);animation:livepulse 1.6s infinite;flex:0 0 auto}
@keyframes livepulse{0%{box-shadow:0 0 0 0 rgba(47,122,79,.5)}70%{box-shadow:0 0 0 10px rgba(47,122,79,0)}100%{box-shadow:0 0 0 0 rgba(47,122,79,0)}}
.linkbox{display:flex;gap:8px;align-items:center}
.linkbox code{flex:1;min-width:0;overflow:auto;white-space:nowrap;background:var(--bg-2);border:1px solid var(--line);border-radius:10px;padding:10px 12px;font:500 12.5px/1 ui-monospace,Menlo,monospace}
.zonerow{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* ---------- Footer / Dialog / Toast ---------- */
.foot{max-width:var(--maxw);margin:0 auto;padding:24px 16px 120px;border-top:1px solid var(--line)}
.footlinks{display:flex;flex-wrap:wrap;gap:6px 16px;margin-bottom:10px}
.footlinks button{background:none;border:0;padding:0;font:600 13px/1.4 var(--f-body);color:var(--ink-2);cursor:pointer;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--line-2)}
.foot p{margin:0;font-size:12.5px;line-height:1.5;color:var(--ink-3);max-width:70ch}
dialog{border:1px solid var(--line);border-radius:var(--r-l);max-width:640px;width:calc(100% - 32px);padding:0;box-shadow:0 30px 80px rgba(20,15,5,.25);background:var(--card);color:var(--ink)}
dialog::backdrop{background:rgba(20,15,5,.45)}
.dlg{padding:22px;display:flex;flex-direction:column;gap:12px;max-height:78vh;overflow-y:auto}
.dlg h3{font:800 20px/1.2 var(--f-display)}
.dlg h4{margin:8px 0 0;font:800 14.5px/1.2 var(--f-display)}
.dlg p,.dlg li{margin:0;font-size:14.5px;line-height:1.55}
.dlg ul,.dlg ol{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px}
.dlg .btn{align-self:flex-start}
.dlglede{font-size:15px}
.toast{position:fixed;left:50%;bottom:calc(100px + env(safe-area-inset-bottom));transform:translateX(-50%) translateY(12px);background:var(--ink);color:#fff;padding:11px 16px;border-radius:999px;font:600 13px/1 var(--f-body);opacity:0;transition:opacity .2s ease,transform .2s ease;z-index:60;max-width:calc(100% - 32px);text-align:center}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast.err{background:var(--crit)}
.bump{animation:bump .25s ease}
@keyframes bump{50%{transform:scale(1.15)}}
.status-mode .cover,.status-mode .venue,.status-mode .daytabs-wrap{display:none}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
:focus-visible{outline:3px solid var(--navy-soft);outline-offset:2px}

/* Cover mit echtem Foto */
.cover.has-photo{background-size:cover;background-position:center;height:190px}
.cover.has-photo::after{background:linear-gradient(180deg,rgba(10,14,24,.05) 0%,rgba(10,14,24,.35) 100%);opacity:1}
@media(min-width:700px){.cover.has-photo{height:260px}}

/* ---------- Multi-Tenant: Restaurantname im Shop ---------- */
.top-tenant{font:600 13px/1 var(--f-body);color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;padding-left:10px;border-left:1px solid var(--line-2)}
@media(max-width:480px){.top-tenant{display:none}}
.venue-name{margin:0 0 4px;font:700 13px/1 var(--f-body);color:var(--gold-ink);letter-spacing:.06em;text-transform:uppercase}
.cover-art .mono{font:800 54px/1 var(--f-display);color:var(--navy-t);letter-spacing:-.04em}

/* ---------- Startseite (Verzeichnis) ---------- */
.hero{background:radial-gradient(120% 140% at 20% 0%,#2a3a5e 0%,var(--navy) 45%,#101a30 100%);color:#fff;padding:36px 16px 28px}
.hero-in{max-width:var(--maxw);margin:0 auto;display:flex;flex-direction:column;gap:14px}
.hero h1{font:800 clamp(26px,6vw,38px)/1.1 var(--f-display);letter-spacing:-.02em;max-width:20ch}
.hero h1 b{color:var(--gold)}
.hero p{margin:0;color:rgba(255,255,255,.8);font-size:15px;max-width:52ch}
.plzform{display:flex;gap:8px;max-width:420px}
.plzform input{flex:1;min-width:0;height:48px;border:0;border-radius:12px;padding:0 14px;font:600 17px/1 var(--f-body);letter-spacing:.04em}
.plzform .btn.primary{background:var(--gold);border-color:var(--gold);color:#1a1405;height:48px}
.plzform .btn.primary:hover{background:#d9a52a}
.hero-steps{display:flex;flex-wrap:wrap;gap:6px 14px;font:500 12.5px/1.3 var(--f-body);color:rgba(255,255,255,.75)}
.hero-steps b{color:#fff}
.dir{max-width:var(--maxw);margin:0 auto;padding:18px 16px 40px;display:flex;flex-direction:column;gap:14px}
.dir-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.dir-h h2{font:800 19px/1.2 var(--f-display)}
.rcard{display:grid;grid-template-columns:1fr 112px;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-l);padding:14px;text-decoration:none;color:var(--ink);box-shadow:var(--shadow);transition:transform .12s ease}
.rcard:hover{transform:translateY(-2px)}
.rcard-txt{min-width:0;display:flex;flex-direction:column;gap:5px}
.rcard-name{font:800 18px/1.2 var(--f-display)}
.rcard-slogan{font-size:13.5px;color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rcard .chips{justify-content:flex-start;margin-top:4px}
.rcard-next{font:600 12.5px/1 var(--f-body);color:var(--ok);margin-top:2px}
.rcard-next.off{color:var(--ink-3)}
.rcard-img{width:112px;height:112px;border-radius:14px;object-fit:cover;background:var(--bg-2);display:grid;place-items:center;font:800 40px/1 var(--f-display);color:var(--navy-t)}
.rcard-img img{width:112px;height:112px;border-radius:14px;object-fit:cover;display:block}
.dir-empty{background:var(--bg-2);border:1px dashed var(--line-2);border-radius:var(--r-l);padding:22px;text-align:center;color:var(--ink-2);font-size:14px}
.forrest{max-width:var(--maxw);margin:0 auto;padding:0 16px 20px}
.forrest-card{background:var(--gold-soft);border:1px solid #ecd9a3;border-radius:var(--r-l);padding:18px;display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.forrest-card h2{font:800 17px/1.2 var(--f-display)}
.forrest-card p{margin:4px 0 0;font-size:13.5px;color:var(--ink-2);max-width:46ch}
.footlinks a{font:600 13px/1.4 var(--f-body);color:var(--ink-2);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--line-2)}

/* ---------- Push-Box (Statusseite) ---------- */
.pushbox{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;background:var(--navy-soft);border:1px solid #cfd7e6;border-radius:12px;padding:12px 14px}
.pushbox b{font:700 14px/1.3 var(--f-body)}
.pushbox p{margin:3px 0 0}
.pushbox .btn.primary{height:40px}

/* ---------- Standort + Gerichte-Feed (Startseite) ---------- */
.geobtn{display:inline-flex;align-items:center;gap:7px;background:none;border:0;padding:0;color:rgba(255,255,255,.85);font:600 13px/1 var(--f-body);cursor:pointer;text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(255,255,255,.35);align-self:flex-start}
.geobtn svg{width:16px;height:16px}
.geobtn:disabled{opacity:.6;cursor:wait}
.feedgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.dish{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:var(--r-l);overflow:hidden;text-decoration:none;color:var(--ink);box-shadow:var(--shadow);transition:transform .12s ease}
.dish:hover{transform:translateY(-2px)}
.dish-img{aspect-ratio:4/3;background:var(--bg-2);display:grid;place-items:center;color:var(--line-2);position:relative}
.dish-img img{width:100%;height:100%;object-fit:cover;display:block;position:absolute;inset:0}
.dish-img svg{width:40px;height:40px}
.dish-tag{position:absolute;left:10px;top:10px;font:600 11px/1 var(--f-body);padding:5px 8px;border-radius:999px;background:rgba(var(--glass),.92)}
.dish-tag.veg{color:var(--ok)}.dish-tag.main{color:var(--navy-t)}
.dish-txt{padding:11px 12px 12px;display:flex;flex-direction:column;gap:3px}
.dish-name{font:700 15px/1.25 var(--f-display)}
.dish-desc{font-size:12.5px;color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.dish-meta{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-top:4px;font:500 12.5px/1.2 var(--f-body);color:var(--ink-2)}
.dish-meta b{font:700 15px/1 var(--f-body);color:var(--ink);font-variant-numeric:tabular-nums}
.dish-rest{font:600 12px/1.2 var(--f-body);color:var(--gold-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---------- Kundenkonto ---------- */
.iconbtn.acct{margin-left:auto}
.iconbtn.acct + .iconbtn{margin-left:0}
.iconbtn svg{width:16px;height:16px}
.iconbtn.on{border-color:var(--navy-t);color:var(--navy-t)}
.acct-orders{display:flex;flex-direction:column;gap:8px}
.ao{display:flex;justify-content:space-between;gap:10px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:10px 12px;text-decoration:none;color:var(--ink)}
.ao b{font:700 14px/1.2 var(--f-display)}
.ao .xs{display:block;margin-top:2px}
.ao .pill{flex:0 0 auto}
.wp{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.wp label{display:flex;flex-direction:column;gap:4px;font:600 12px/1 var(--f-body);color:var(--ink-2);min-width:0}
.wp select{height:40px;border:1.5px solid var(--line-2);border-radius:10px;padding:0 6px;font:500 13px/1 var(--f-body);background:var(--card);min-width:0;width:100%}
/* Handy: 5 Spalten à ~60px sind zu schmal für „Tagesgericht“ → ein Tag pro Zeile */
@media (max-width:600px){
  .wp{grid-template-columns:1fr;gap:8px}
  .wp label{display:grid;grid-template-columns:32px 1fr;align-items:center;gap:10px;font-size:14px}
}
.wp select.set{border-color:var(--navy-t);color:var(--navy-t);font-weight:700}
.cardline{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--bg-2);border-radius:10px;padding:10px 12px;font-size:13.5px}
.acct-mode .cover,.acct-mode .venue,.acct-mode .daytabs-wrap{display:none}

/* ---------- Bottom-Tabs: Liquid Glass (CSS/SVG, iOS + Android) ---------- */
.tabbar{display:none}
@media(max-width:700px){
  .tabbar{display:block;position:fixed;left:0;right:0;bottom:0;z-index:55;padding:0 14px calc(10px + env(safe-area-inset-bottom));pointer-events:none}
  .tabbar-glass{position:relative;display:grid;grid-template-columns:repeat(4,1fr);height:64px;border-radius:32px;pointer-events:auto;overflow:hidden;
    background:linear-gradient(180deg,rgba(255,255,255,.88),rgba(255,255,255,.78));
    -webkit-backdrop-filter:blur(22px) saturate(1.7);backdrop-filter:blur(22px) saturate(1.7);
    border:1px solid rgba(255,255,255,.75);
    box-shadow:0 12px 36px rgba(20,15,5,.22),0 1px 0 rgba(255,255,255,.9) inset,0 -1px 0 rgba(30,42,68,.08) inset}
  /* kein SVG-Filter in backdrop-filter: Safari meldet @supports, rendert dann aber gar keinen Blur */
  .tabbar-glass::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
    background:radial-gradient(120% 90% at 50% -40%,rgba(255,255,255,.95),rgba(255,255,255,0) 60%),linear-gradient(90deg,rgba(255,255,255,.35),rgba(255,255,255,0) 30%,rgba(255,255,255,0) 70%,rgba(255,255,255,.3))}
  .tab-blob{position:absolute;top:6px;bottom:6px;left:6px;width:calc(25% - 6px);border-radius:26px;z-index:0;
    background:linear-gradient(180deg,rgba(30,42,68,.14),rgba(30,42,68,.08));
    box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 -1px 0 rgba(30,42,68,.12) inset,0 6px 16px rgba(30,42,68,.18);
    transition:transform .55s cubic-bezier(.22,1.4,.36,1),width .3s ease}
  .tab{position:relative;z-index:1;background:none;border:0;padding:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:var(--ink-2);font:600 10.5px/1 var(--f-body);cursor:pointer;-webkit-tap-highlight-color:transparent}
  .tab svg{width:22px;height:22px;transition:transform .35s cubic-bezier(.22,1.4,.36,1)}
  .tab.on{color:var(--navy-t)}
  .tab.on svg{transform:translateY(-1px) scale(1.08)}
  .tab:active svg{transform:scale(.9)}
  /* Platz unten: Cartbar über den Tabs, Inhalt unter der Cartbar */
  .cartbar{bottom:74px} /* padding der .cartbar enthält schon safe-area-inset-bottom */
  .menu{padding-bottom:210px}
  .statuswrap,.co-layout,#accountView .co-layout{padding-bottom:110px}
  .foot{padding-bottom:120px}
  .toast{bottom:calc(170px + env(safe-area-inset-bottom))}
  /* Kopfzeile schlanker: Konto/Info sitzen unten */
  .iconbtn.acct,.iconbtn[data-dlg="ablauf"]{display:none}
  .top-tenant{display:block;margin-left:auto;border-left:0;padding-left:0;text-align:right}
}
@media(max-width:700px){
  html[data-theme="dark"] .tabbar-glass{background:linear-gradient(180deg,rgba(40,46,60,.88),rgba(30,34,46,.82));border-color:rgba(255,255,255,.18);box-shadow:0 12px 36px rgba(0,0,0,.45),0 1px 0 rgba(255,255,255,.22) inset}
  html[data-theme="dark"] .tab{color:#cfd3dc}html[data-theme="dark"] .tab.on{color:#fff}
  html[data-theme="dark"] .tab-blob{background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,.1))}
}
@media (prefers-reduced-motion:reduce){.tab-blob,.tab svg{transition:none}}
/* iOS-App mit nativem UITabBarController: CSS-Tabbar weg, Safe-Area unten enthält bereits die Tabbar-Höhe */
html.native-tabs .tabbar{display:none}
@media(max-width:700px){
  html.native-tabs .cartbar{bottom:0}
  html.native-tabs .menu{padding-bottom:calc(140px + env(safe-area-inset-bottom))}
  html.native-tabs .statuswrap,html.native-tabs .co-layout,html.native-tabs #accountView .co-layout{padding-bottom:calc(40px + env(safe-area-inset-bottom))}
  html.native-tabs .foot{padding-bottom:calc(48px + env(safe-area-inset-bottom))}
  html.native-tabs .toast{bottom:calc(104px + env(safe-area-inset-bottom))}
}

/* ---------- Kundenkonto: Anmelden / Registrieren ---------- */
.au-card{max-width:440px;width:100%;margin:0 auto}
.au-tabs{display:grid;grid-template-columns:1fr 1fr;background:var(--bg-2);border-radius:12px;padding:4px;gap:4px}
.au-tab{border:0;background:transparent;border-radius:9px;height:40px;font:600 14px/1 var(--f-body);color:var(--ink-2);cursor:pointer}
.au-tab.on{background:var(--card);color:var(--navy-t);box-shadow:0 1px 3px rgba(20,15,5,.12)}
.au-card .btn.primary{width:100%;justify-content:center}
.au-links{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 16px;font-size:13.5px}
.au-msg:empty{display:none}
.au-msg{padding:10px 12px;border-radius:10px;background:var(--bg-2)}
.au-msg.ok{background:var(--ok-soft);color:var(--ok)}
.au-msg.err{background:var(--crit-soft);color:var(--crit)}
/* Plattform-Konto (konto.html) */
.konto-wrap{max-width:720px;margin:0 auto;padding:20px 16px calc(120px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:14px}
.konto-wrap h1{font:800 28px/1.1 var(--f-display);margin:4px 0 2px}
.konto-sub{display:flex;flex-direction:column;gap:8px}
.konto-sub a{display:flex;justify-content:space-between;align-items:center;gap:10px;border:1px solid var(--line);border-radius:12px;padding:10px 12px;color:var(--ink);text-decoration:none}
.hdr-acct{text-decoration:none;margin-right:6px}
.hdr-acct svg{width:16px;height:16px}
html.native-tabs .hdr-acct{display:none}
.so-steps{padding-left:20px;display:flex;flex-direction:column;gap:8px}

/* ---------- Pull-to-Refresh (App): „Cloche“ ---------- */
html.native,html.native body{overscroll-behavior-y:none}
/* zentriert ohne translateX: sonst animiert die Transition bei Textwechsel (andere Breite) seitlich */
.ptr{position:fixed;left:0;right:0;top:calc(env(safe-area-inset-top) + 6px);z-index:90;display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:none;
  transform:translateY(calc(var(--ptr,0px) - 70px));opacity:min(1,calc(var(--k,0) * 1.8));transition:transform .45s cubic-bezier(.2,.9,.25,1.2),opacity .25s}
.ptr.live{transition:none}
.ptr-badge{width:92px;height:80px;border-radius:26px;overflow:hidden;background:rgba(var(--glass),.96);box-shadow:0 14px 34px rgba(30,42,68,.22),0 1px 0 #fff inset;display:grid;place-items:center}
.ptr-art{width:84px;height:70px;overflow:visible}
.ptr-plate{fill:#fff;stroke:#d9d3c6;stroke-width:1.5}
.ptr-plate-in{fill:none;stroke:#ece6d8;stroke-width:1.2}
.ptr-cloche{transform-box:view-box;transform-origin:78px 63px;transform:translateY(calc(var(--k,0) * -13px)) rotate(calc(var(--k,0) * -9deg));transition:transform .2s cubic-bezier(.3,1.4,.5,1)}
.ptr.live .ptr-cloche{transition:none}
.ptr.armed .ptr-cloche{transform:translateY(-16px) rotate(-11deg)}
.ptr-shine{fill:none;stroke:rgba(255,255,255,.75);stroke-width:2.6;stroke-linecap:round}
.ptr-steam path{fill:none;stroke:#b9b2a5;stroke-width:2.6;stroke-linecap:round;stroke-dasharray:44;stroke-dashoffset:calc(44 - var(--k,0) * 44);opacity:calc(var(--k,0) * .9)}
.ptr-glow{opacity:calc(var(--k,0) * .9)}
.ptr-sparks path{fill:none;stroke:#c8961e;stroke-width:2.4;stroke-linecap:round;opacity:0;transform-box:view-box;transform-origin:48px 40px;transform:scale(.4)}
.ptr-label{font:600 12.5px/1 var(--f-body);color:var(--navy-t);background:rgba(var(--glass),.94);padding:6px 11px;border-radius:999px;box-shadow:0 2px 10px rgba(20,15,5,.1);white-space:nowrap;letter-spacing:.1px}
/* Laden: Glocke wippt, Dampf steigt in Wellen */
.ptr.loading .ptr-cloche{animation:ptr-bob 1.1s cubic-bezier(.45,0,.55,1) infinite}
.ptr.loading .ptr-steam path{stroke-dashoffset:0;opacity:1;animation:ptr-steam 1.5s ease-in-out infinite}
.ptr.loading .ptr-steam path:nth-child(2){animation-delay:.25s}
.ptr.loading .ptr-steam path:nth-child(3){animation-delay:.5s}
.ptr.loading .ptr-glow{opacity:1;animation:ptr-glow 1.5s ease-in-out infinite}
/* Fertig: Glocke fliegt ab, Funken */
.ptr.done .ptr-cloche{animation:ptr-lift .55s cubic-bezier(.3,0,.2,1) forwards}
.ptr.done .ptr-sparks path{animation:ptr-spark .6s .15s ease-out forwards}
.ptr.done .ptr-steam path{animation:none;opacity:.5}
.ptr.fail .ptr-cloche{animation:ptr-shake .4s ease-in-out 2}
@keyframes ptr-bob{0%,100%{transform:translateY(-10px) rotate(-6deg)}50%{transform:translateY(-19px) rotate(-13deg)}}
@keyframes ptr-steam{0%{transform:translateY(4px);opacity:0}30%{opacity:1}100%{transform:translateY(-10px);opacity:0}}
@keyframes ptr-glow{0%,100%{opacity:.55}50%{opacity:1}}
@keyframes ptr-lift{0%{transform:translateY(-14px) rotate(-10deg)}100%{transform:translateY(-58px) rotate(-18deg);opacity:0}}
@keyframes ptr-spark{0%{opacity:0;transform:scale(.4)}40%{opacity:1}100%{opacity:0;transform:scale(1.25)}}
@keyframes ptr-shake{0%,100%{transform:translateY(-8px) rotate(0)}25%{transform:translateY(-8px) rotate(-7deg)}75%{transform:translateY(-8px) rotate(7deg)}}
.ptr-veil{position:fixed;inset:0;z-index:85;pointer-events:none;opacity:0;background:rgba(var(--glass),.35);
  -webkit-backdrop-filter:blur(0);backdrop-filter:blur(0);transition:opacity .3s ease,backdrop-filter .3s ease,-webkit-backdrop-filter .3s ease}
.ptr-veil.on{opacity:1;pointer-events:auto;-webkit-backdrop-filter:blur(7px) saturate(1.15);backdrop-filter:blur(7px) saturate(1.15)}
@media (prefers-reduced-motion:reduce){.ptr.loading .ptr-cloche,.ptr.loading .ptr-steam path,.ptr.loading .ptr-glow{animation:none}}

/* =================== Startseite im App-Stil =================== */
.home{max-width:var(--maxw);margin:0 auto;padding-bottom:calc(40px + env(safe-area-inset-bottom))}
html.native .home{padding-bottom:calc(110px + env(safe-area-inset-bottom))}
.home-top{padding:18px 16px 8px;display:flex;flex-direction:column;gap:12px}
.home-greet{margin:0;font:800 26px/1.12 var(--f-display);letter-spacing:-.4px;color:var(--ink)}
.loc{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.loc-lbl{font:600 13px/1 var(--f-body);color:var(--ink-2);margin-right:2px}
.loc-field{display:flex;align-items:center;gap:6px;background:var(--bg-2);border-radius:999px;padding:0 12px;height:40px;color:var(--navy-t)}
.loc-field svg{width:16px;height:16px;flex:none}
.loc-field input{border:0;background:transparent;width:64px;font:700 16px/1 var(--f-body);color:var(--navy-t);outline:none;padding:0}
.loc-geo{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 12px;border-radius:999px;border:1px solid var(--line-2);background:var(--card);font:600 13.5px/1 var(--f-body);color:var(--ink);cursor:pointer}
.loc-geo svg{width:15px;height:15px}
.search{display:flex;align-items:center;gap:10px;height:50px;border-radius:16px;background:var(--card);border:1.5px solid var(--line);padding:0 14px;box-shadow:0 4px 14px rgba(20,15,5,.06)}
.search:focus-within{border-color:var(--navy-t)}
.search svg{width:20px;height:20px;color:var(--gold);flex:none}
.search input{flex:1;border:0;outline:none;background:transparent;font:500 16px/1 var(--f-body);color:var(--ink);min-width:0}
.pills{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:2px 16px}
.pills::-webkit-scrollbar{display:none}
.pill-f{flex:none;display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 15px;border-radius:999px;border:1.5px solid var(--line-2);background:var(--card);font:600 14px/1 var(--f-body);color:var(--ink);cursor:pointer;white-space:nowrap}
.pill-f.on{background:var(--navy);border-color:var(--navy-t);color:#fff}
.pf-dot{width:9px;height:9px;border-radius:50%}.pf-dot.veg{background:var(--ok)}.pf-dot.des{background:var(--gold)}
.hsec{padding:18px 0 4px}
.hsec-h{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:0 16px 10px}
.hsec-h h2{margin:0;font:800 21px/1.15 var(--f-display);letter-spacing:-.3px}
.hsec-sub{font:500 13px/1 var(--f-body);color:var(--ink-3);white-space:nowrap}
.hscroll{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:2px 16px 10px;scroll-padding:16px}
.hscroll::-webkit-scrollbar{display:none}
.hscroll>*{scroll-snap-align:start;flex:none}
.hscroll>.dir-empty{flex:1}
/* Gericht-Karten (Karussell) */
.home .dish{width:min(78vw,300px);display:flex;flex-direction:column;border-radius:20px;overflow:hidden;background:var(--card);border:1px solid var(--line);color:var(--ink);text-decoration:none;box-shadow:0 6px 18px rgba(20,15,5,.07);transition:transform .15s}
.home .dish:active{transform:scale(.98)}
.home .dish-img{position:relative;aspect-ratio:4/3;background:linear-gradient(135deg,#f6efe0,#efe6d2);display:grid;place-items:center}
.home .dish-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.dish-ph svg{width:46px;height:46px;color:#d8ccb2}
.home .dish-tag{position:absolute;left:10px;top:10px;padding:6px 10px;border-radius:999px;font:700 12px/1 var(--f-body);background:rgba(var(--glass),.94);color:var(--navy-t)}
.home .dish-tag.veg{color:var(--ok)}.home .dish-tag.des{color:var(--gold-ink)}
.dish-price{position:absolute;right:10px;bottom:10px;padding:7px 11px;border-radius:12px;background:var(--navy);color:#fff;font:700 14px/1 var(--f-body);box-shadow:0 4px 12px rgba(30,42,68,.3)}
.home .dish-txt{padding:12px 14px 14px;display:flex;flex-direction:column;gap:4px}
.home .dish-name{font:700 17px/1.2 var(--f-display);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.home .dish-rest{font:600 13.5px/1.2 var(--f-body);color:var(--ink-2)}
.dish-when{display:flex;align-items:center;gap:5px;font:500 12.5px/1.2 var(--f-body);color:var(--ink-3)}
.dish-when svg{width:13px;height:13px}
/* Restaurant-Karten */
.rlist{display:grid;gap:16px;padding:0 16px}
@media(min-width:760px){.rlist{grid-template-columns:1fr 1fr}}
.home .rcard{display:flex;flex-direction:column;border-radius:20px;overflow:visible;background:transparent;border:0;color:var(--ink);text-decoration:none;padding:0;box-shadow:none}
.home .rcard:active .rcover{transform:scale(.99)}
.rcover{position:relative;aspect-ratio:16/8;border-radius:20px;background:linear-gradient(135deg,#f6efe0,#e9dfc8);display:grid;place-items:center;transition:transform .15s}
.rcover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:20px}
.rcover-ph svg{width:52px;height:52px;color:#d8ccb2}
.rlogo{position:absolute;left:12px;bottom:-18px;width:52px;height:52px;border-radius:14px;background:var(--card);box-shadow:0 6px 16px rgba(20,15,5,.18);display:grid;place-items:center;font:800 24px/1 var(--f-display);color:var(--navy-t)}
.rbody{padding:26px 4px 2px;display:flex;flex-direction:column;gap:6px}
.rrow{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.home .rcard-name{font:800 18px/1.2 var(--f-display)}
.rcity{font:500 13px/1 var(--f-body);color:var(--ink-3);white-space:nowrap}
.rmeta{display:flex;flex-wrap:wrap;gap:6px 14px;font:500 13.5px/1.2 var(--f-body);color:var(--ink-2)}
.rmeta span{display:inline-flex;align-items:center;gap:5px}
.rmeta svg{width:14px;height:14px;color:var(--gold-ink)}
.rnext{font:600 13.5px/1.3 var(--f-body);color:var(--ok)}
.rnext.off{color:var(--ink-3);font-weight:500}
/* Noch einmal bestellen */
.again{width:min(72vw,280px);display:flex;align-items:center;gap:12px;padding:12px;border-radius:18px;background:var(--card);border:1px solid var(--line);color:var(--ink);text-decoration:none}
.again .rlogo{position:static;box-shadow:none;border:1px solid var(--line);flex:none}
.again-t{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.again-t b{font:700 15px/1.2 var(--f-display)}
.again-t span{font:500 13px/1.2 var(--f-body);color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.again>svg{width:18px;height:18px;color:var(--ink-3);flex:none}
/* So funktioniert's */
.how-c{width:min(64vw,240px);display:flex;flex-direction:column;gap:6px;padding:16px;border-radius:18px;background:var(--navy);color:#fff}
.how-c b{width:32px;height:32px;border-radius:10px;background:var(--gold);color:var(--navy-ink);display:grid;place-items:center;font:800 16px/1 var(--f-display)}
.how-t{font:700 16px/1.2 var(--f-display)}
.how-s{font:500 13px/1.35 var(--f-body);color:#cfd5e2}
.home .dir-empty{margin:0 16px}
.hscroll>.dir-empty{margin:0}
.hdr-acct+.iconbtn{margin-left:0}

/* App: weniger Text – Tabs (Info, Konto) übernehmen Erklärungen und Rechtliches */
html.native .loc-lbl,html.native #geoTxt,html.native .how-sec,html.native .forrest,html.native .home ~ .foot,
html.native .dish-when,html.native .rcity,html.native .rnext,
html.native #promoSub,html.native .chip-city,html.native #footText,html.native .footlinks [data-dlg="ablauf"],html.native #footAll,
html.native .au-intro,html.native main.konto-wrap ~ .foot{display:none !important}
html.native .loc-geo{padding:0;width:40px;justify-content:center}
html.native .foot{padding-top:14px}
html.native .footlinks{gap:6px 14px;font-size:12.5px}
html.native .home-top ~ * .x,html.native header.top .iconbtn[data-dlg="restaurants"]{display:none}
html.native .chip-x{display:none}
/* Anmelden mit Apple / Google / Face ID */
.au-social{display:flex;flex-direction:column;gap:10px}
.au-social:empty{display:none}
.au-sbtn{display:flex;align-items:center;justify-content:center;gap:10px;height:50px;border-radius:14px;font:600 16px/1 var(--f-body);cursor:pointer;border:1.5px solid var(--line-2);background:var(--card);color:var(--ink)}
.au-sbtn svg{width:20px;height:20px;flex:none}
.au-sbtn.apple{background:#000;border-color:#000;color:#fff}
.au-sbtn.bio{background:var(--navy);border-color:var(--navy-t);color:#fff}
.au-sbtn.bio svg{width:22px;height:22px}
.au-sbtn:disabled{opacity:.6}
.au-or{display:flex;align-items:center;gap:10px;color:var(--ink-3);font:500 13px/1 var(--f-body);margin:4px 0}
.au-or::before,.au-or::after{content:"";flex:1;height:1px;background:var(--line)}

/* =================== Konto im App-Stil =================== */
#kTitle{display:flex;align-items:center;gap:10px}
.k-back{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;border:1px solid var(--line-2);color:var(--ink);flex:none}
.k-back svg{width:20px;height:20px}
.k-hello{display:flex;align-items:center;gap:12px;margin-top:-4px}
.k-avatar{width:52px;height:52px;border-radius:50%;background:var(--gold);color:var(--navy-ink);display:grid;place-items:center;font:800 22px/1 var(--f-display);flex:none}
.k-help{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:16px 18px;border-radius:18px;border:0;background:var(--navy);color:#fff;text-align:left;cursor:pointer}
.k-help b{display:block;font:800 18px/1.2 var(--f-display)}
.k-help span span{display:block;font:500 14px/1.3 var(--f-body);color:#cfd5e2;margin-top:3px}
.k-help svg{width:64px;height:52px;flex:none}
.kgroup{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:18px;overflow:hidden}
.kgroup h2{margin:0;padding:16px 16px 6px;font:800 18px/1.2 var(--f-display)}
.krow{display:flex;align-items:center;gap:14px;min-height:56px;padding:10px 16px;border:0;border-top:1px solid var(--line);background:none;color:var(--ink);text-decoration:none;font:500 16px/1.25 var(--f-body);text-align:left;width:100%;cursor:pointer}
.kgroup h2+.krow{border-top:0}
.kgroup>.krow:first-child{border-top:0}
.krow>svg:first-child{width:22px;height:22px;color:var(--ink-2);flex:none}
.krow>svg:last-child:not(:first-child){width:18px;height:18px;color:var(--ink-3);flex:none}
.krow-t{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.krow-t small{font:500 13px/1.25 var(--f-body);color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.krow:active{background:var(--bg-2)}
.krow.danger{color:var(--crit)}.krow.danger>svg{color:var(--crit)}
.k-feedback{margin:6px 16px 16px;justify-content:center;background:var(--bg-2);border:0;font-weight:700}
.k-ver{text-align:center;font:500 12.5px/1 var(--f-body);color:var(--ink-3);margin:6px 0 0}
.k-h3{margin:8px 0 0;font:700 15px/1.2 var(--f-display)}
.k-switch{display:flex;align-items:center;justify-content:space-between;gap:12px}
.k-switch span{display:flex;flex-direction:column;gap:3px}
.k-switch small{font:500 13px/1.3 var(--f-body);color:var(--ink-3)}
.k-switch input{appearance:none;-webkit-appearance:none;width:50px;height:30px;border-radius:999px;background:var(--line-2);position:relative;flex:none;transition:background .2s;cursor:pointer}
.k-switch input::after{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:var(--card);box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .2s}
.k-switch input:checked{background:var(--ok)}
.k-switch input:checked::after{transform:translateX(20px)}
.k-switch input:disabled{opacity:.5}
.loc-city{font:600 14px/1 var(--f-body);color:var(--ink-2);white-space:nowrap;max-width:140px;overflow:hidden;text-overflow:ellipsis}
.loc-field:has(.loc-city:not(.hidden)) input{width:56px}
.loc-geo.busy svg{animation:geo-pulse 1s ease-in-out infinite}
@keyframes geo-pulse{50%{transform:scale(.8);opacity:.5}}
.swipe-hint{position:fixed;left:0;z-index:95;width:44px;height:44px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;opacity:0;pointer-events:none;box-shadow:0 6px 18px rgba(30,42,68,.3);transition:opacity .2s,transform .2s;transform:translateX(-44px) scale(.6)}
.swipe-hint svg{width:22px;height:22px}
/* kompaktere Karten auf der Startseite */
.home .dish{width:min(44vw,210px);border-radius:16px}
.home .dish-img{aspect-ratio:5/4}
.home .dish-tag{left:8px;top:8px;padding:5px 8px;font-size:11px}
.dish-price{right:8px;bottom:8px;padding:5px 8px;border-radius:10px;font-size:13px}
.home .dish-txt{padding:9px 11px 11px;gap:2px}
.home .dish-name{font-size:15px}
.home .dish-rest{font-size:12.5px}
.dish-ph svg{width:34px;height:34px}
.rlist{gap:14px}
.rcover{aspect-ratio:16/6.2;border-radius:16px}
.rcover img{border-radius:16px}
.rcover-ph svg{width:38px;height:38px}
.rlogo{width:42px;height:42px;border-radius:12px;bottom:-14px;font-size:19px}
.rbody{padding:20px 2px 0;gap:4px}
.home .rcard-name{font-size:16.5px}
.rmeta{font-size:13px;gap:4px 12px}
.again{width:min(64vw,250px);padding:10px}
/* App: Info nicht mehr als Tab – im Shop als ⓘ im Kopf */
html.native header.top .iconbtn[data-dlg="ablauf"]{display:inline-flex !important;margin-left:auto;padding:8px}
html.native header.top .iconbtn[data-dlg="ablauf"] .iconbtn-txt{display:none}

/* =================== Karte =================== */
body.map-page{overflow:hidden}
.map-wrap{position:fixed;left:0;right:0;top:calc(57px + env(safe-area-inset-top));bottom:0}
.map{position:absolute;inset:0;background:#efe8d8}
.map-cards{position:absolute;left:0;right:0;bottom:calc(14px + env(safe-area-inset-bottom));z-index:500;padding-bottom:4px}
.mcard{width:min(80vw,320px);display:flex;align-items:center;gap:10px;padding:10px 10px 10px 12px;border-radius:18px;background:rgba(var(--glass),.96);border:1.5px solid transparent;box-shadow:0 8px 24px rgba(20,15,5,.18);cursor:pointer}
.mcard.on{border-color:var(--gold)}
.mcard .rlogo{position:static;box-shadow:none;border:1px solid var(--line);flex:none}
.mcard-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.mcard-t b{font:700 15px/1.2 var(--f-display);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mcard-t small{font:500 12.5px/1.25 var(--f-body);color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mok{color:var(--ok);font-weight:700}
.mcard .btn{flex:none}
.mpin{width:40px;height:46px;display:grid;place-items:start center;filter:drop-shadow(0 4px 6px rgba(20,15,5,.3))}
.mpin span{width:36px;height:36px;border-radius:12px 12px 12px 3px;transform:rotate(-45deg);background:var(--card);border:2.5px solid var(--ink-3);display:grid;place-items:center;font:800 16px/1 var(--f-display);color:var(--navy-t);margin-top:2px}
.mpin span::first-letter{}
.mpin.ok span{border-color:var(--gold);background:#fffaf0}
.mpin.on span{background:var(--navy);color:#fff;border-color:var(--gold);transform:rotate(-45deg) scale(1.12)}
.mpin span{line-height:1}
.mpin span{writing-mode:horizontal-tb}
.mme{width:22px;height:22px;border-radius:50%;background:#2f7bf6;border:3px solid #fff;box-shadow:0 0 0 6px rgba(47,123,246,.22),0 2px 6px rgba(0,0,0,.3)}
.leaflet-container{font-family:var(--f-body)}
.leaflet-control-attribution{font-size:10px;background:rgba(var(--glass),.75)!important}
html.native .map-page .leaflet-control-attribution{margin-bottom:calc(var(--sab,0px))}
.mpin span i{font-style:normal;transform:rotate(45deg);display:block}

/* Stempelkarte im Shop */
.stamp-chip{display:flex;align-items:center;gap:10px;margin:10px auto 0;padding:9px 14px;border-radius:999px;background:var(--gold-soft);color:var(--gold-ink);font:500 13.5px/1.2 var(--f-body);width:max-content;max-width:100%}
.stamp-ico{font-size:17px}
.stamp-dots{display:flex;gap:4px}
.stamp-dots i{width:9px;height:9px;border-radius:50%;background:rgba(143,106,16,.25)}
.stamp-dots i.on{background:var(--gold)}
.stamp-redeem{background:var(--gold-soft);border-radius:12px;padding:10px 12px}
/* Vorteile / Stempelkarten */
.vcard{display:flex;flex-direction:column;gap:12px;padding:16px;border-radius:20px;background:linear-gradient(160deg,#fffdf6,#f7edd3);border:1px solid #ecdcb4;color:var(--ink);text-decoration:none;box-shadow:0 8px 22px rgba(143,106,16,.12)}
.vcard-h{display:flex;align-items:center;gap:12px}
.vcard .rlogo{position:static;box-shadow:none;border:1px solid #ecdcb4;flex:none}
.vcard-t{display:flex;flex-direction:column;gap:3px;min-width:0}
.vcard-t b{font:800 17px/1.2 var(--f-display)}
.vcard-t small{font:500 12.5px/1.3 var(--f-body);color:var(--gold-ink)}
.vdots{display:grid;grid-template-columns:repeat(var(--n),1fr);gap:8px}
.vdot{aspect-ratio:1;border-radius:50%;border:2px dashed #d8c48f;display:grid;place-items:center;font-size:15px;background:#fffaf0}
.vdot.on{border:0;background:radial-gradient(circle at 35% 30%,#f3d27a,#c8961e);box-shadow:inset 0 -2px 0 rgba(0,0,0,.12)}
.vdot.on::after{content:"✓";color:#fff;font:800 14px/1 var(--f-body)}
.vdot.last.on::after{content:""}
.vready{padding:8px 12px;border-radius:12px;background:var(--ok-soft);color:var(--ok);font:700 14px/1.2 var(--f-body)}
.vhero{text-align:center;align-items:center}
.vhero-ico{font-size:44px}
.vhero .btn{width:100%;justify-content:center}
/* Startseite: Filter als Icon neben der Suche */
.search-row{position:relative;display:flex;gap:10px;align-items:center}
.search-row .search{flex:1;min-width:0}
.filter-btn{position:relative;flex:none;width:50px;height:50px;border-radius:16px;border:1.5px solid var(--line);background:var(--card);color:var(--navy-t);display:grid;place-items:center;box-shadow:0 4px 14px rgba(20,15,5,.06);cursor:pointer}
.filter-btn svg{width:22px;height:22px}
.filter-btn[aria-expanded="true"],.filter-btn.on{border-color:var(--navy-t)}

/* Filter-Button: Regler-Knöpfe gleiten beim Öffnen, Badge mit Anzahl aktiver Filter */
.filter-btn{transition:transform .25s cubic-bezier(.3,1.6,.5,1),background .3s,color .3s,border-color .3s}
.filter-btn:active{transform:scale(.92)}
.filter-btn circle{transition:transform .5s cubic-bezier(.3,1.5,.4,1)}
.filter-btn.open,.filter-btn.on{background:var(--navy);color:#fff;border-color:var(--navy-t)}
.filter-btn.open circle,.filter-btn.on circle{fill:var(--navy)}
.filter-btn.open .k1{transform:translateX(-7px)}.filter-btn.open .k2{transform:translateX(7px)}.filter-btn.open .k3{transform:translateX(-9px)}
.filter-badge{position:absolute;top:-6px;right:-6px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:linear-gradient(135deg,#f3c95a,#c8961e);color:#1e2a44;font:800 11px/20px var(--f-body);text-align:center;box-shadow:0 3px 10px rgba(200,150,30,.5);transform:scale(0);transition:transform .35s cubic-bezier(.3,1.8,.5,1)}
.filter-btn.on .filter-badge{transform:scale(1)}

/* Filter-Sheet: Glas, Feder-Einblendung, gestaffelte Kacheln, rotierender Lichtring */
@property --fs-a{syntax:"<angle>";inherits:false;initial-value:0deg}
.fs{position:fixed;inset:0;z-index:1000}
.fs[hidden]{display:none}
html.fs-lock,html.fs-lock body{overflow:hidden}
.fs-veil{position:absolute;inset:0;background:rgba(18,22,34,0);-webkit-backdrop-filter:blur(0) saturate(100%);backdrop-filter:blur(0) saturate(100%);transition:background .45s ease,backdrop-filter .45s ease,-webkit-backdrop-filter .45s ease}
.fs.in .fs-veil{background:rgba(18,22,34,.28);-webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%)}
.fs-card{position:absolute;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));max-width:520px;margin:0 auto;padding:10px 18px 16px;border-radius:34px;overflow:hidden;
  background:rgba(255,253,248,.78);-webkit-backdrop-filter:blur(30px) saturate(190%);backdrop-filter:blur(30px) saturate(190%);
  border:1px solid rgba(255,255,255,.7);box-shadow:0 30px 80px rgba(14,18,30,.35),inset 0 1px 0 rgba(255,255,255,.9);
  transform:translateY(calc(100% + 40px)) scale(.96);transition:transform .62s cubic-bezier(.22,1.28,.36,1)}
.fs.in .fs-card{transform:none}
.fs-card.drag{transition:none}
.fs-aura{position:absolute;inset:-40% -20% auto;height:220px;pointer-events:none;opacity:.55;filter:blur(40px);
  background:radial-gradient(40% 60% at 25% 50%,rgba(243,201,90,.55),transparent 70%),radial-gradient(35% 55% at 75% 40%,rgba(120,150,255,.35),transparent 70%);animation:fsAura 9s ease-in-out infinite alternate}
@keyframes fsAura{to{transform:translateX(12%) rotate(8deg)}}
.fs-grab{position:relative;width:40px;height:5px;border-radius:3px;background:rgba(30,42,68,.22);margin:2px auto 10px}
.fs-head{position:relative;display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}
.fs-head h2{margin:0;font:800 26px/1.1 var(--f-display);letter-spacing:-.02em;color:var(--ink)}
.fs-reset{border:0;background:none;font:600 14px var(--f-body);color:var(--gold-ink);padding:8px 0;transition:opacity .3s}
.fs-reset.off{opacity:.3;pointer-events:none}
.fs-lbl{position:relative;margin:14px 2px 8px;font:700 12px/1 var(--f-body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.fs-tiles{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.fs-tile{position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:14px 12px 12px;min-height:118px;border:0;border-radius:22px;text-align:left;cursor:pointer;
  background:rgba(var(--glass),.72);box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 6px 18px rgba(20,15,5,.07);color:var(--ink);
  opacity:0;transform:translateY(18px) scale(.94);transition:transform .25s cubic-bezier(.3,1.6,.5,1),background .3s,color .3s}
.fs.in .fs-tile{animation:fsTileIn .6s cubic-bezier(.22,1.3,.36,1) var(--d) forwards}
@keyframes fsTileIn{to{opacity:1;transform:none}}
.fs-tile:active{transform:scale(.95)!important}
.fs-tile b{font:800 15px/1.15 var(--f-display);margin-top:auto}
.fs-tile small{font:500 11.5px/1.25 var(--f-body);color:var(--muted)}
.fs-ico{width:38px;height:38px;border-radius:13px;display:grid;place-items:center;background:#f4eedf;color:var(--gold-ink);transition:background .35s,color .35s,transform .35s}
.fs-ico svg{width:22px;height:22px}
.fs-ring{position:absolute;inset:0;z-index:-1;border-radius:inherit;padding:2px;opacity:0;transition:opacity .35s;
  background:conic-gradient(from var(--fs-a),#f3c95a,#7f9cff,#9be3c4,#f3c95a);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:fsSpin 3.2s linear infinite}
@keyframes fsSpin{to{--fs-a:360deg}}
.fs-tile.on{background:linear-gradient(160deg,#243256,#151d33);color:#fff;box-shadow:0 12px 30px rgba(30,42,68,.35)}
.fs-tile.on small{color:rgba(255,255,255,.65)}
.fs-tile.on .fs-ring{opacity:1}
.fs-tile.on .fs-ico{background:rgba(var(--glass),.12);color:#f3c95a}
.fs-tile.pop .fs-ico{animation:fsPop .55s cubic-bezier(.3,1.8,.5,1)}
@keyframes fsPop{0%{transform:scale(1)}35%{transform:scale(.78) rotate(-8deg)}100%{transform:scale(1) rotate(0)}}
.fs-seg{position:relative;display:grid;grid-template-columns:repeat(3,1fr);padding:4px;border-radius:18px;background:rgba(30,42,68,.07)}
.fs-thumb{position:absolute;top:4px;bottom:4px;left:4px;width:calc((100% - 8px)/3);border-radius:14px;background:var(--card);box-shadow:0 4px 14px rgba(20,15,5,.12);
  transform:translateX(calc(var(--i,0) * 100%));transition:transform .5s cubic-bezier(.3,1.35,.4,1)}
.fs-seg button{position:relative;border:0;background:none;padding:11px 4px;font:600 14px var(--f-body);color:var(--muted);transition:color .3s}
.fs-seg button.on{color:var(--navy-t)}
.fs-cta{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:18px;height:56px;border:0;border-radius:20px;
  background:linear-gradient(135deg,#243256,#151d33);color:#fff;font:700 16px var(--f-body);box-shadow:0 14px 30px rgba(30,42,68,.35);transition:transform .2s cubic-bezier(.3,1.6,.5,1)}
.fs-cta:active{transform:scale(.97)}
.fs-cta::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.22) 50%,transparent 65%);transform:translateX(-100%);animation:fsSheen 3.4s ease-in-out 1s infinite}
@keyframes fsSheen{60%,100%{transform:translateX(100%)}}
.fs-num{display:inline-grid;place-items:center;min-width:28px;height:28px;padding:0 6px;border-radius:10px;background:linear-gradient(135deg,#f3c95a,#c8961e);color:#1e2a44;font-weight:800}
.fs-num.roll{animation:fsRoll .45s cubic-bezier(.3,1.6,.5,1)}
@keyframes fsRoll{0%{transform:translateY(60%) scale(.6);opacity:0}100%{transform:none;opacity:1}}
.fs-info{display:block;margin:10px auto 0;border:0;background:none;font:500 13.5px var(--f-body);color:var(--muted);padding:6px}
@media (prefers-reduced-motion:reduce){.fs-card,.fs-veil,.fs-thumb{transition-duration:.01s}.fs.in .fs-tile{animation:none;opacity:1;transform:none}.fs-ring,.fs-aura,.fs-cta::after{animation:none}}

/* =================================================================== Startseite „2040“
   Aurora-Licht, Glas, Live-Countdown, generative Cover, Scroll-Animationen. Reduce Motion wird respektiert. */
.home-page{background:var(--page)}
.home-page header.top{background:rgba(var(--page-rgb),.62);-webkit-backdrop-filter:blur(22px) saturate(180%);backdrop-filter:blur(22px) saturate(180%);border-bottom-color:transparent;transition:border-color .3s}
@supports (animation-timeline:scroll()){
  .home-page header.top{animation:hdrLine linear both;animation-timeline:scroll();animation-range:0 80px}
  @keyframes hdrLine{to{border-bottom-color:rgba(30,42,68,.08);box-shadow:0 6px 24px rgba(20,15,5,.06)}}
}
.home-top{position:relative;isolation:isolate}
.aurora{position:absolute;inset:-70px -10px -30px;z-index:-1;overflow:hidden;pointer-events:none;-webkit-mask:linear-gradient(#000 55%,transparent);mask:linear-gradient(#000 55%,transparent)}
.aurora i{position:absolute;width:280px;height:280px;border-radius:50%;filter:blur(60px);opacity:.55;animation:aur 16s ease-in-out infinite alternate}
.aurora i:nth-child(1){background:#f3c95a;left:-60px;top:10px}
.aurora i:nth-child(2){background:#9fb4ff;right:-80px;top:-40px;animation-duration:19s;animation-delay:-6s;opacity:.4}
.aurora i:nth-child(3){background:#ffb59a;left:40%;top:90px;width:200px;height:200px;animation-duration:23s;animation-delay:-11s;opacity:.35}
@keyframes aur{50%{transform:translate(40px,30px) scale(1.15)}100%{transform:translate(-30px,10px) scale(.9)}}
.greet-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.home-greet{font-size:30px;letter-spacing:-.03em;background:linear-gradient(100deg,#151d33 30%,#4a5a85 60%,#151d33 90%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:greetIn .9s cubic-bezier(.2,1,.3,1) both,greetSheen 7s ease-in-out 1.2s infinite}
@keyframes greetIn{from{opacity:0;transform:translateY(10px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@keyframes greetSheen{0%,100%{background-position:100% 0}50%{background-position:0 0}}
.greet-sub{margin:4px 0 0;font:500 14px/1.3 var(--f-body);color:var(--ink-2);animation:greetIn .9s .12s cubic-bezier(.2,1,.3,1) both}
.greet-sub b{color:var(--navy-t);font-variant-numeric:tabular-nums}
.dl{position:relative;flex:none;width:58px;height:58px;border-radius:50%;background:rgba(var(--glass),.7);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 8px 22px rgba(30,42,68,.14),inset 0 1px 0 #fff;animation:greetIn .9s .2s cubic-bezier(.2,1,.3,1) both}
.dl svg{position:absolute;inset:7px;width:44px;height:44px;transform:rotate(-90deg)}
.dl-bg{fill:none;stroke:rgba(30,42,68,.1);stroke-width:4}
.dl-fg{fill:none;stroke:url(#none);stroke:#c8961e;stroke-width:4;stroke-linecap:round;transition:stroke-dasharray 1s cubic-bezier(.3,1.2,.4,1)}
.dl.urgent .dl-fg{stroke:#e0533d}
.dl.urgent{animation:dlPulse 1.6s ease-in-out infinite}
@keyframes dlPulse{50%{box-shadow:0 0 0 8px rgba(224,83,61,.12),0 8px 22px rgba(30,42,68,.14)}}
.dl-t{position:absolute;inset:0;display:grid;place-content:center;text-align:center;line-height:1}
.dl-t b{font:800 17px/1 var(--f-display);color:var(--navy-t);font-variant-numeric:tabular-nums}
.dl-t small{font:600 9.5px/1 var(--f-body);color:var(--ink-3);margin-top:1px}

/* Standort + Suche: Glas-Pills */
.home-page .loc-field,.home-page .loc-geo,.home-page .search,.home-page .filter-btn:not(.on):not(.open){background:rgba(var(--glass),.66);-webkit-backdrop-filter:blur(16px) saturate(170%);backdrop-filter:blur(16px) saturate(170%);border:1px solid rgba(255,255,255,.85);box-shadow:0 6px 20px rgba(30,42,68,.08),inset 0 1px 0 #fff}
.home-page .search{border-radius:18px;transition:box-shadow .35s,transform .35s cubic-bezier(.3,1.5,.5,1)}
.home-page .search:focus-within{box-shadow:0 0 0 4px rgba(200,150,30,.18),0 12px 30px rgba(30,42,68,.12);transform:translateY(-1px)}
.home-page .filter-btn{border-radius:18px}
.home-page .loc-geo:active,.home-page .loc-field:active{transform:scale(.96)}
.home-page .loc-geo{transition:transform .25s cubic-bezier(.3,1.6,.5,1)}

/* Abschnittstitel */
.home-page .hsec-h h2{font-size:22px;letter-spacing:-.025em}

/* Generative Cover */
.gen{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden;
  background:radial-gradient(60% 80% at 20% 15%,hsl(calc(var(--h) + 0) 85% 82%),transparent 70%),radial-gradient(70% 90% at 85% 90%,hsl(calc(var(--h) + 60) 75% 78%),transparent 70%),linear-gradient(135deg,hsl(calc(var(--h) + 20) 70% 92%),hsl(calc(var(--h) + 40) 60% 86%))}
.gen::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.45) 48%,transparent 62%);transform:translateX(-120%);animation:genSheen 6s ease-in-out infinite}
@keyframes genSheen{55%,100%{transform:translateX(120%)}}
.gen>svg{width:44px;height:44px;color:rgba(255,255,255,.95);filter:drop-shadow(0 4px 10px hsla(var(--h),60%,30%,.25))}
.steam{position:absolute;left:50%;top:50%;width:36px;height:40px;transform:translate(-50%,-105%)}
.steam i{position:absolute;bottom:0;width:4px;height:16px;border-radius:4px;background:rgba(var(--glass),.85);filter:blur(1.5px);animation:steam 2.6s ease-in infinite;opacity:0}
.steam i:nth-child(1){left:8px}.steam i:nth-child(2){left:16px;animation-delay:.8s}.steam i:nth-child(3){left:24px;animation-delay:1.6s}
@keyframes steam{0%{opacity:0;transform:translateY(6px) scaleY(.6)}30%{opacity:.9}100%{opacity:0;transform:translateY(-22px) translateX(4px) scaleY(1.3)}}
.gen-r b{font:800 clamp(64px,22vw,120px)/1 var(--f-display);letter-spacing:-.06em;color:rgba(255,255,255,.75);mix-blend-mode:overlay;transform:translateY(6%)}
.rcover .gen{border-radius:inherit}

/* Gerichte-Karussell: Glas-Karten, 3D-Fokus beim Wischen */
.home-page .dish{border:0;background:rgba(var(--glass),.85);box-shadow:0 1px 0 #fff inset,0 10px 28px rgba(30,42,68,.1);transition:transform .3s cubic-bezier(.3,1.5,.5,1),box-shadow .3s}
.home-page .dish:active{transform:scale(.96)}
.home-page .dish-tag{background:rgba(var(--glass),.72);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.home-page .dish-price{background:rgba(21,29,51,.78);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.18)}
@supports (animation-timeline:view()){
  .feedrow .dish:not(.sk){animation:cardFocus linear both;animation-timeline:view(inline);animation-range:entry 0% exit 100%}
  @keyframes cardFocus{0%{transform:perspective(700px) rotateY(-14deg) scale(.92);opacity:.6}22%,78%{transform:none;opacity:1}100%{transform:perspective(700px) rotateY(14deg) scale(.92);opacity:.6}}
  .rlist .rcard:not(.sk),.how-c,.forrest-card{animation:rise linear both;animation-timeline:view();animation-range:entry 0% entry 60%}
  @keyframes rise{from{opacity:0;transform:translateY(34px) scale(.97)}to{opacity:1;transform:none}}
}

/* Restaurant-Karten */
.home-page .rcover{box-shadow:0 12px 30px rgba(30,42,68,.12);overflow:hidden;transition:transform .3s cubic-bezier(.3,1.5,.5,1)}
.home-page .rcard:active .rcover{transform:scale(.97)}
.home-page .rlogo{background:rgba(var(--glass),.82);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.9);color:var(--navy-t);z-index:2}
.home-page .rcover{overflow:visible}
.home-page .rcover .gen,.home-page .rcover img{border-radius:inherit;overflow:hidden}
.home-page .rmeta span{padding:5px 9px;border-radius:999px;background:rgba(30,42,68,.05)}
.home-page .rnext{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;padding:6px 10px;border-radius:12px;background:linear-gradient(135deg,rgba(47,138,84,.12),rgba(47,138,84,.04));font-size:13px}
.home-page .rnext::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 0 rgba(47,138,84,.5);animation:live 2s infinite}
.home-page .rnext.off::before{display:none}
.home-page .rnext.off{background:rgba(30,42,68,.05)}
@keyframes live{70%{box-shadow:0 0 0 7px rgba(47,138,84,0)}100%{box-shadow:0 0 0 0 rgba(47,138,84,0)}}

/* Skeleton */
.sk{pointer-events:none}
.sk .dish-img,.sk.rcard .rcover,.sk i{background:linear-gradient(100deg,#eee7d8 30%,#f8f3ea 50%,#eee7d8 70%)!important;background-size:300% 100%!important;animation:skel 1.4s ease-in-out infinite}
.sk i{display:block;height:12px;border-radius:6px;margin:4px 0}
.sk i+i{width:60%}
.home .dish.sk{box-shadow:none}
.rcard.sk .rbody{padding-top:14px}
@keyframes skel{from{background-position:100% 0}to{background-position:0 0}}

/* So funktioniert’s: Glas auf Nachtblau mit Icon */
.home-page .how-c{position:relative;overflow:hidden;background:radial-gradient(120% 90% at 100% 0,#3a4c80,transparent 60%),linear-gradient(160deg,#1e2a44,#121a2e);box-shadow:0 14px 32px rgba(18,26,46,.28);border:1px solid rgba(255,255,255,.08)}
.home-page .how-c b{position:absolute;right:10px;top:-8px;width:auto;height:auto;background:none;font:800 72px/1 var(--f-display);color:transparent;-webkit-text-stroke:1.5px rgba(243,201,90,.35)}
.how-ico{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:rgba(243,201,90,.14);color:#f3c95a;margin-bottom:4px}
.how-ico svg{width:22px;height:22px}

/* Restaurant-CTA: rotierender Lichtrand */
.home-page .forrest-card{position:relative;isolation:isolate;background:rgba(255,250,236,.9);border:0;border-radius:24px;box-shadow:0 14px 34px rgba(143,106,16,.14)}
.home-page .forrest-card::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;padding:1.5px;background:conic-gradient(from var(--fs-a),#f3c95a,#ffb59a,#9fb4ff,#f3c95a);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:fsSpin 6s linear infinite}

@media (prefers-reduced-motion:reduce){
  .aurora i,.home-greet,.greet-sub,.dl,.gen::after,.steam i,.home-page .rnext::before,.home-page .forrest-card::before,.sk i,.sk .dish-img,.sk.rcard .rcover{animation:none!important}
  .feedrow .dish,.rlist .rcard,.how-c,.forrest-card{animation:none!important}
}
.home-page header.top{z-index:60;background:rgba(var(--page-rgb),.8)}
.home-page .rlogo{z-index:auto}
.home-page .how-sec,.home-page .hsec{background:transparent}
html:has(body.home-page){background:var(--page)}
.home-page header.top{background:rgba(var(--page-rgb),.9)}

/* Kopfzeile wie Instagram: durchscheinendes Glas statt weißer Fläche (alle Seiten) */
header.top,.home-page header.top{background:rgba(var(--glass),.55);-webkit-backdrop-filter:blur(24px) saturate(180%);backdrop-filter:blur(24px) saturate(180%);border-bottom:.5px solid rgba(30,42,68,.08)}
.home-page header.top{background:rgba(var(--page-rgb),.5)}
.daytabs-wrap{background:rgba(var(--glass),.6);-webkit-backdrop-filter:blur(24px) saturate(180%);backdrop-filter:blur(24px) saturate(180%)}

/* Farbkonzept statt Regenbogen: nur Marke – Nachtblau, Gold, Sand, Graphit */
.aurora i:nth-child(1){background:#e9c46a;opacity:.45}
.aurora i:nth-child(2){background:#1e2a44;opacity:.12}
.aurora i:nth-child(3){background:#d9c7a3;opacity:.4}
.gen{background:none}
.gen.t0{background:radial-gradient(80% 90% at 85% 10%,rgba(233,196,106,.28),transparent 60%),linear-gradient(150deg,#26345a,#141c31)}
.gen.t1{background:radial-gradient(80% 90% at 15% 10%,rgba(255,255,255,.35),transparent 60%),linear-gradient(150deg,#e2bd62,#b8861a)}
.gen.t2{background:radial-gradient(80% 90% at 85% 15%,rgba(255,255,255,.6),transparent 60%),linear-gradient(150deg,#efe5d1,#d9c7a3)}
.gen.t3{background:radial-gradient(80% 90% at 15% 15%,rgba(233,196,106,.2),transparent 60%),linear-gradient(150deg,#3b3f4a,#22252c)}
.gen>svg{filter:drop-shadow(0 4px 10px rgba(0,0,0,.18))}
.gen.t2>svg{color:#1e2a44}
.gen.t2 .steam i{background:rgba(30,42,68,.35)}
.gen-r b{mix-blend-mode:normal;color:rgba(255,255,255,.16)}
.gen-r.t0 b,.gen-r.t3 b{color:transparent;-webkit-text-stroke:2px rgba(233,196,106,.55)}
.gen-r.t1 b{color:rgba(255,255,255,.28)}
.gen-r.t2 b{color:rgba(30,42,68,.12)}
.fs-ring{background:conic-gradient(from var(--fs-a),#e9c46a,#fff3cf,#b8861a,#e9c46a)}
.fs-aura{background:radial-gradient(40% 60% at 25% 50%,rgba(233,196,106,.5),transparent 70%),radial-gradient(35% 55% at 75% 40%,rgba(30,42,68,.15),transparent 70%)}
.home-page .forrest-card::before{background:conic-gradient(from var(--fs-a),#e9c46a,#fff3cf 25%,#b8861a 50%,#fff3cf 75%,#e9c46a)}

/* Kopfzeile wie Instagram (iOS-Material): WKWebView rendert backdrop-filter mit derselben Core-Animation-Unschärfe wie
   UIVisualEffectView. Stärke 60 % (14 px statt 24 px), keine Kante: die Glasfläche läuft nach unten weich aus (Maske). */
header.top,.home-page header.top{background:transparent!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border-bottom:0!important;box-shadow:none!important;animation:none!important}
header.top::before{content:"";position:absolute;left:0;right:0;top:0;bottom:-22px;z-index:-1;pointer-events:none;
  background:linear-gradient(rgba(var(--glass),.62),rgba(var(--glass),.62) calc(100% - 22px),rgba(var(--glass),0));
  -webkit-backdrop-filter:blur(14px) saturate(180%);backdrop-filter:blur(14px) saturate(180%);
  -webkit-mask-image:linear-gradient(#000 calc(100% - 30px),rgba(0,0,0,.5) calc(100% - 14px),transparent);mask-image:linear-gradient(#000 calc(100% - 30px),rgba(0,0,0,.5) calc(100% - 14px),transparent)}
.home-page header.top::before{background:linear-gradient(rgba(var(--page-rgb),.6),rgba(var(--page-rgb),.6) calc(100% - 22px),rgba(var(--page-rgb),0))}
header.top{isolation:isolate}
/* Shop: darunter klebt die Tagesleiste – dort läuft das Glas aus, nicht an der Kopfzeile */
body:not(.status-mode):not(.acct-mode):has(.daytabs-wrap) header.top::before{bottom:0;-webkit-mask-image:none;mask-image:none;background:rgba(var(--glass),.62)}
.daytabs-wrap{background:transparent!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border-bottom:0!important;isolation:isolate}
.daytabs-wrap::before{content:"";position:absolute;left:0;right:0;top:0;bottom:-22px;z-index:-1;pointer-events:none;
  background:linear-gradient(rgba(var(--glass),.62),rgba(var(--glass),.62) calc(100% - 22px),rgba(var(--glass),0));
  -webkit-backdrop-filter:blur(14px) saturate(180%);backdrop-filter:blur(14px) saturate(180%);
  -webkit-mask-image:linear-gradient(#000 calc(100% - 30px),rgba(0,0,0,.5) calc(100% - 14px),transparent);mask-image:linear-gradient(#000 calc(100% - 30px),rgba(0,0,0,.5) calc(100% - 14px),transparent)}

/* =================================================================== Nacht-Theme (19–7 Uhr, js/theme.js)
   Tiefes Nachtblau-Graphit, Gold als Akzent. Flächen über Variablen, Rest gezielt. */
html[data-theme="dark"]{
  --bg:#10141d; --bg-2:#1a202d; --line:#262d3d; --line-2:#343c50;
  --ink:#eef0f5; --ink-2:#aab1c1; --ink-3:#757d90;
  --navy:#2e3f6a; --navy-soft:#1e2740; --navy-t:#dbe3fb;
  --gold:#e2b44f; --gold-ink:#e9c46a; --gold-soft:#2a2416;
  --ok:#63c78f; --ok-soft:#16291f; --crit:#f07a68; --crit-soft:#3a1f1b;
  --card:#181e2b; --glass:24,30,43; --page:#0e121a; --page-rgb:14,18,26;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 10px 28px rgba(0,0,0,.35);
  color-scheme:dark; background:var(--page);
}
html[data-theme="dark"] body{background:var(--page);color:var(--ink)}
html[data-theme="dark"] body,html[data-theme="dark"] .co-card,html[data-theme="dark"] dialog{transition:background-color .6s ease,color .6s ease}
html[data-theme="dark"] dialog{background:var(--card);color:var(--ink)}
html[data-theme="dark"] input,html[data-theme="dark"] select,html[data-theme="dark"] textarea{background:var(--bg-2);color:var(--ink);border-color:var(--line-2)}
html[data-theme="dark"] .brand img{filter:drop-shadow(0 2px 6px rgba(0,0,0,.5))}
/* Startseite */
html[data-theme="dark"] .home-greet{background-image:linear-gradient(100deg,#f3f5fa 30%,#e9c46a 60%,#f3f5fa 90%)}
html[data-theme="dark"] .aurora i:nth-child(1){opacity:.22}
html[data-theme="dark"] .aurora i:nth-child(2){background:#3a5296;opacity:.35}
html[data-theme="dark"] .aurora i:nth-child(3){background:#6b5326;opacity:.3}
html[data-theme="dark"] .home-page .loc-field,html[data-theme="dark"] .home-page .loc-geo,html[data-theme="dark"] .home-page .search,html[data-theme="dark"] .home-page .filter-btn:not(.on):not(.open){border-color:rgba(255,255,255,.08);box-shadow:0 6px 20px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.06)}
html[data-theme="dark"] .dl{box-shadow:0 8px 22px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.08)}
html[data-theme="dark"] .dl-bg{stroke:rgba(255,255,255,.1)}
html[data-theme="dark"] .home-page .dish{box-shadow:0 1px 0 rgba(255,255,255,.05) inset,0 10px 28px rgba(0,0,0,.35)}
html[data-theme="dark"] .home-page .rcover{box-shadow:0 12px 30px rgba(0,0,0,.4)}
html[data-theme="dark"] .home-page .rlogo{border-color:rgba(255,255,255,.1)}
html[data-theme="dark"] .home-page .rmeta span{background:rgba(255,255,255,.06)}
html[data-theme="dark"] .home-page .rnext{background:linear-gradient(135deg,rgba(99,199,143,.16),rgba(99,199,143,.05))}
html[data-theme="dark"] .home-page .rnext.off{background:rgba(255,255,255,.05)}
html[data-theme="dark"] .gen.t2{background:radial-gradient(80% 90% at 85% 15%,rgba(255,255,255,.12),transparent 60%),linear-gradient(150deg,#3a3326,#262118)}
html[data-theme="dark"] .gen.t2>svg{color:#e9c46a}
html[data-theme="dark"] .gen-r.t2 b{color:rgba(233,196,106,.18)}
html[data-theme="dark"] .sk .dish-img,html[data-theme="dark"] .sk.rcard .rcover,html[data-theme="dark"] .sk i{background:linear-gradient(100deg,#1a202d 30%,#252c3c 50%,#1a202d 70%)!important;background-size:300% 100%!important}
html[data-theme="dark"] .home-page .forrest-card{background:rgba(30,26,16,.9);box-shadow:0 14px 34px rgba(0,0,0,.35)}
html[data-theme="dark"] .home-page .how-c{border-color:rgba(255,255,255,.06);background:radial-gradient(120% 90% at 100% 0,#2c3b66,transparent 60%),linear-gradient(160deg,#1b2440,#0f1526)}
html[data-theme="dark"] .btn.primary,html[data-theme="dark"] .fs-cta,html[data-theme="dark"] .dish-price{background:linear-gradient(135deg,#e9c46a,#c8961e);color:#141a2a}
html[data-theme="dark"] .dish-price{border-color:rgba(0,0,0,.1)}
/* Filter-Sheet */
html[data-theme="dark"] .fs-card{border-color:rgba(255,255,255,.08);box-shadow:0 30px 80px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.08)}
html[data-theme="dark"] .fs-ico{background:rgba(233,196,106,.12)}
html[data-theme="dark"] .fs-tile{box-shadow:0 1px 0 rgba(255,255,255,.05) inset,0 6px 18px rgba(0,0,0,.3)}
html[data-theme="dark"] .fs-tile.on{background:linear-gradient(160deg,#2c3b66,#18213a)}
html[data-theme="dark"] .fs-seg{background:rgba(255,255,255,.06)}
html[data-theme="dark"] .fs-thumb{background:#2a3247}
html[data-theme="dark"] .fs-grab{background:rgba(255,255,255,.25)}
html[data-theme="dark"] .filter-btn.open,html[data-theme="dark"] .filter-btn.on{background:#e9c46a;color:#141a2a;border-color:#e9c46a}
html[data-theme="dark"] .filter-btn.open circle,html[data-theme="dark"] .filter-btn.on circle{fill:#e9c46a}
html[data-theme="dark"] .filter-btn circle{fill:var(--card)}
/* Karte: dunkle Kacheln */
html[data-theme="dark"] .leaflet-tile-pane{filter:invert(1) hue-rotate(185deg) brightness(.85) contrast(.9) saturate(.6)}
html[data-theme="dark"] .leaflet-container{background:#0e121a}
html[data-theme="dark"] .leaflet-control-attribution{background:rgba(14,18,26,.75)!important;color:#aab1c1}
html[data-theme="dark"] .leaflet-control-attribution a{color:#e9c46a}
/* Stempelkarte */
html[data-theme="dark"] .vcard{background:linear-gradient(160deg,#211d14,#16130c);border-color:#3a311c;box-shadow:0 8px 22px rgba(0,0,0,.4)}
html[data-theme="dark"] .vdot{background:#1b1810;border-color:#5a4a26}
html[data-theme="dark"] .vcard .rlogo{border-color:#3a311c}
html[data-theme="dark"] .loc-field input,html[data-theme="dark"] .search input{background:transparent;border:0}
html[data-theme="dark"] .fs-card{background:rgba(22,27,39,.82)}
html[data-theme="dark"] .fs-aura{opacity:.35}

/* =================================================================== Lieferung / Abholung (Kasse) */
.ful{position:relative;display:grid;grid-template-columns:1fr 1fr;padding:4px;margin-bottom:16px;border-radius:18px;background:rgba(30,42,68,.06)}
html[data-theme="dark"] .ful{background:rgba(255,255,255,.06)}
.ful.hidden{display:none}
.ful-thumb{position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:14px;background:var(--card);box-shadow:0 4px 14px rgba(20,15,5,.12);transform:translateX(calc(var(--i,0) * 100%));transition:transform .5s cubic-bezier(.3,1.35,.4,1)}
.ful-opt{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 6px;border:0;background:none;font:700 15px var(--f-body);color:var(--ink-2);cursor:pointer;transition:color .3s}
.ful-opt svg{width:20px;height:20px}
.ful-opt.on{color:var(--navy-t)}
.ful-opt.on svg{animation:fsPop .5s cubic-bezier(.3,1.8,.5,1)}
.pk{display:flex;flex-direction:column;gap:10px;margin-bottom:8px;animation:greetIn .45s cubic-bezier(.2,1,.3,1) both}
.pk-place{display:flex;align-items:center;gap:12px;padding:14px;border-radius:18px;background:var(--gold-soft);border:1px solid rgba(200,150,30,.25)}
.pk-place>div{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.pk-place b{font:800 16px/1.2 var(--f-display)}
.pk-place span{font:500 13.5px/1.3 var(--f-body);color:var(--ink-2)}
.pk-place .pk-note{font-style:italic;color:var(--gold-ink)}
.pk-pin{flex:none;width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:var(--card);color:var(--gold-ink);box-shadow:0 4px 12px rgba(143,106,16,.15)}
.pk-pin svg{width:22px;height:22px}
.pk-slots{margin:0 -4px;padding:2px 4px 6px;gap:8px}
.pk-slot{flex:none;min-width:72px;padding:12px 10px;border-radius:14px;border:1.5px solid var(--line-2);background:var(--card);font:700 15px var(--f-body);color:var(--ink);font-variant-numeric:tabular-nums;cursor:pointer;transition:transform .2s cubic-bezier(.3,1.6,.5,1),background .25s,color .25s,border-color .25s}
.pk-slot:active{transform:scale(.94)}
.pk-slot.on{background:var(--navy);border-color:var(--navy);color:#fff;box-shadow:0 8px 20px rgba(30,42,68,.3)}
html[data-theme="dark"] .pk-slot.on{background:linear-gradient(135deg,#e9c46a,#c8961e);border-color:#e9c46a;color:#141a2a}
.chip-pick{background:var(--gold-soft)!important;color:var(--gold-ink)!important}
.chip-pick svg{color:var(--gold-ink)}
.pk-live{align-items:center}
/* Startseite: Abholung-Kennzeichen auf Karten */
.rpick{display:inline-flex;align-items:center;gap:5px;padding:5px 9px;border-radius:999px;background:var(--gold-soft);color:var(--gold-ink);font:600 12.5px/1 var(--f-body)}
.rpick svg{width:13px;height:13px}
.fs-tiles{grid-template-columns:repeat(2,1fr)}
.fs-tile{min-height:104px}
/* Lieferung + Abholung klar nebeneinander */
.rmodes{display:flex;flex-wrap:wrap;gap:6px}
.rmode{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:999px;background:var(--navy);color:#fff;font:700 12.5px/1 var(--f-body)}
.rmode svg{width:15px;height:15px}
.rmode.pick{background:var(--gold-soft);color:var(--gold-ink);box-shadow:inset 0 0 0 1px rgba(200,150,30,.3)}
html[data-theme="dark"] .rmode{background:#2c3b66}
html[data-theme="dark"] .rmode.pick{background:var(--gold-soft)}
.chip-del{background:var(--navy-soft)!important;color:var(--navy-t)!important}
.chip-del svg{color:var(--navy-t)}

/* Standort minimal: eine kleine Pille „📍 88045 Friedrichshafen“ + runder Standort-Knopf (nur Icon) */
.home-page .loc{gap:6px;margin-top:-2px}
.home-page .loc-lbl{display:none}
.home-page .loc-field{height:32px;padding:0 10px 0 8px;gap:5px;border-radius:999px}
.home-page .loc-field svg{width:14px;height:14px;color:var(--gold-ink)}
.home-page .loc-field input{font:700 14px/1 var(--f-body);width:48px}
.home-page .loc-field:has(.loc-city:not(.hidden)) input{width:46px}
.home-page .loc-city{font:500 13px/1 var(--f-body);max-width:150px}
.home-page .loc-geo{width:32px;height:32px;padding:0;justify-content:center;border-radius:50%}
.home-page .loc-geo svg{width:14px;height:14px}
.home-page .loc-geo #geoTxt{display:none}

/* =================================================================== Bestellschluss-Fenster (wächst aus dem Ring) */
.dl{cursor:pointer;transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
.dl:active{transform:scale(.92)}
.dl.open{transform:scale(.9);opacity:.6}
.dlp{position:fixed;inset:0;z-index:1000}
.dlp[hidden]{display:none}
.dlp-veil{position:absolute;inset:0;background:rgba(18,22,34,0);-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0);transition:background .4s,backdrop-filter .4s,-webkit-backdrop-filter .4s}
.dlp.in .dlp-veil{background:rgba(18,22,34,.22);-webkit-backdrop-filter:blur(10px) saturate(150%);backdrop-filter:blur(10px) saturate(150%)}
.dlp-card{position:absolute;left:12px;right:12px;top:calc(env(safe-area-inset-top) + 64px);max-width:440px;margin:0 auto;padding:18px 16px 14px;border-radius:30px;overflow:hidden;
  background:rgba(var(--glass),.84);-webkit-backdrop-filter:blur(28px) saturate(190%);backdrop-filter:blur(28px) saturate(190%);
  border:1px solid rgba(255,255,255,.6);box-shadow:0 30px 80px rgba(14,18,30,.3),inset 0 1px 0 rgba(255,255,255,.8);
  transform-origin:calc(var(--ox) - 12px) calc(var(--oy) - env(safe-area-inset-top) - 64px);
  transform:scale(.12);opacity:0;filter:blur(8px);transition:transform .58s cubic-bezier(.2,1.25,.32,1),opacity .3s ease,filter .4s ease}
.dlp.in .dlp-card{transform:none;opacity:1;filter:none}
html[data-theme="dark"] .dlp-card{border-color:rgba(255,255,255,.08);box-shadow:0 30px 80px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.06)}
.dlp-glow{position:absolute;right:-60px;top:-80px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(233,196,106,.45),transparent 65%);filter:blur(20px);pointer-events:none;animation:aur 12s ease-in-out infinite alternate}
.dlp.urgent .dlp-glow{background:radial-gradient(circle,rgba(224,83,61,.4),transparent 65%)}
.dlp-head{position:relative;display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.dlp-eyebrow{font:700 12px/1 var(--f-body);letter-spacing:.1em;text-transform:uppercase;color:var(--gold-ink)}
.dlp-for{font:600 14px/1.2 var(--f-body);color:var(--ink-2)}
.dlp-clock{position:relative;width:min(70vw,250px);aspect-ratio:1;margin:8px auto 4px;display:grid;place-items:center}
.dlp-clock svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.dlp-bg{fill:none;stroke:rgba(30,42,68,.08);stroke-width:7}
html[data-theme="dark"] .dlp-bg{stroke:rgba(255,255,255,.08)}
.dlp-fg{fill:none;stroke:#c8961e;stroke-width:7;stroke-linecap:round;stroke-dasharray:0 100;transition:stroke-dasharray 1.1s cubic-bezier(.3,1.2,.4,1);filter:drop-shadow(0 0 6px rgba(200,150,30,.45))}
.dlp.urgent .dlp-fg{stroke:#e0533d;filter:drop-shadow(0 0 6px rgba(224,83,61,.5))}
.dlp-time{position:relative;display:flex;align-items:flex-start;gap:2px;font-variant-numeric:tabular-nums}
.dlp-time span{display:flex;flex-direction:column;align-items:center;gap:4px}
.dlp-time b{font:800 clamp(34px,11vw,46px)/1 var(--f-display);letter-spacing:-.03em;color:var(--navy-t)}
.dlp-time small{font:600 10.5px/1 var(--f-body);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.dlp-time em{font:800 34px/1 var(--f-display);color:var(--ink-3);font-style:normal;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:.25}}
#dlpS.tick{animation:tick .45s cubic-bezier(.3,1.6,.5,1)}
@keyframes tick{0%{transform:translateY(-35%);opacity:.2}100%{transform:none;opacity:1}}
.dlp-lbl{position:relative;margin:10px 2px 8px;font:700 12px/1 var(--f-body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.dlp-list{position:relative;display:flex;flex-direction:column;gap:8px;max-height:34vh;overflow:auto}
.dlp-row{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:18px;background:rgba(var(--glass),.7);box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 6px 16px rgba(20,15,5,.06);text-decoration:none;color:var(--ink);
  opacity:0;transform:translateY(12px);transition:transform .2s cubic-bezier(.3,1.6,.5,1)}
.dlp.in .dlp-row{animation:fsTileIn .55s cubic-bezier(.22,1.3,.36,1) var(--d) forwards}
.dlp-row:active{transform:scale(.97)!important}
.dlp-logo{flex:none;width:40px;height:40px;border-radius:13px;display:grid;place-items:center;font:800 18px/1 var(--f-display);color:#fff}
.dlp-logo.t0{background:linear-gradient(150deg,#26345a,#141c31);color:#e9c46a}.dlp-logo.t1{background:linear-gradient(150deg,#e2bd62,#b8861a)}
.dlp-logo.t2{background:linear-gradient(150deg,#efe5d1,#d9c7a3);color:#1e2a44}.dlp-logo.t3{background:linear-gradient(150deg,#3b3f4a,#22252c);color:#e9c46a}
.dlp-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.dlp-txt b{font:800 15px/1.2 var(--f-display);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dlp-txt small{font:500 12.5px/1.25 var(--f-body);color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dlp-txt i{display:block;height:4px;border-radius:2px;background:rgba(30,42,68,.08);position:relative;overflow:hidden;margin-top:3px}
.dlp-txt i::after{content:"";position:absolute;inset:0;width:var(--w);border-radius:inherit;background:linear-gradient(90deg,#e9c46a,#c8961e)}
.dlp-left{flex:none;font:700 13px/1 var(--f-body);color:var(--navy-t);font-variant-numeric:tabular-nums;padding:7px 9px;border-radius:10px;background:rgba(30,42,68,.06)}
html[data-theme="dark"] .dlp-left{background:rgba(255,255,255,.06)}
.dlp-left.hot{color:#e0533d;background:rgba(224,83,61,.1)}
.dlp-note{position:relative;display:flex;gap:8px;align-items:flex-start;margin:12px 2px 2px;font:500 12.5px/1.35 var(--f-body);color:var(--ink-2)}
.dlp-note svg{flex:none;width:16px;height:16px;color:var(--ok)}
@media (prefers-reduced-motion:reduce){.dlp-card,.dlp-veil{transition-duration:.01s}.dlp.in .dlp-row{animation:none;opacity:1;transform:none}.dlp-glow,.dlp-time em,#dlpS.tick{animation:none}}

/* =================================================================== Restaurant öffnen (Startseite → Shop) */
@view-transition{navigation:auto}
#cover{view-transition-name:rest-cover}
#coverArt{view-transition-name:rest-logo}
::view-transition-group(rest-cover){animation-duration:.55s;animation-timing-function:cubic-bezier(.2,1,.3,1)}
::view-transition-group(rest-logo){animation-duration:.6s;animation-timing-function:cubic-bezier(.25,1.25,.35,1)}
::view-transition-old(rest-cover),::view-transition-new(rest-cover){height:100%;object-fit:cover;animation-duration:.45s}
::view-transition-old(root){animation:vtOut .32s ease both}
::view-transition-new(root){animation:vtIn .5s .08s cubic-bezier(.2,1,.3,1) both}
@keyframes vtOut{to{opacity:0;transform:scale(.97);filter:blur(4px)}}
@keyframes vtIn{from{opacity:0;transform:translateY(24px)}}
.rcard.opening .rcover,.dish.opening{transform:scale(.97)}
/* Fallback ohne View Transitions */
.open-fx{position:fixed;z-index:2000;border-radius:16px;pointer-events:none;background:radial-gradient(120% 140% at 20% 0%,#2a3a5e 0%,#1e2a44 45%,#101a30 100%);
  transition:left .34s cubic-bezier(.2,1,.3,1),top .34s cubic-bezier(.2,1,.3,1),width .34s cubic-bezier(.2,1,.3,1),height .34s cubic-bezier(.2,1,.3,1),border-radius .34s}
.open-fx.go{left:0!important;top:0!important;width:100vw!important;height:100vh!important;border-radius:0}
@media (prefers-reduced-motion:reduce){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}}
/* App-Mitteilungen */
.pushbox.native{display:flex;align-items:center;gap:12px;padding:14px;border-radius:18px;background:var(--navy-soft)}
.pushbox.native.on{background:var(--ok-soft)}
.pushbox.native.ask{background:linear-gradient(135deg,var(--gold-soft),var(--navy-soft));animation:greetIn .6s cubic-bezier(.2,1,.3,1) both}
.pushbox.native>div{flex:1;min-width:0}
.pushbox.native p{margin:2px 0 0}
.pb-ico{font-size:24px;flex:none}
.pushbox.native.ask .pb-ico{animation:ring 2.4s ease-in-out 1s infinite;transform-origin:50% 10%}
@keyframes ring{0%,60%,100%{transform:none}65%{transform:rotate(14deg)}72%{transform:rotate(-12deg)}79%{transform:rotate(8deg)}86%{transform:rotate(-4deg)}}
.kpush{display:flex;gap:12px;align-items:center}
.kpush b{display:block;font:800 16px/1.2 var(--f-display)}
.kpush small{display:block;margin-top:3px;font:500 13px/1.35 var(--f-body);color:var(--ink-2)}
.kpush-ico{flex:none;width:46px;height:46px;border-radius:15px;display:grid;place-items:center;background:var(--navy-soft);color:var(--navy-t)}
.kpush.on .kpush-ico{background:var(--ok-soft);color:var(--ok)}
.kpush-ico svg{width:24px;height:24px}
.kpush-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.kpush-list li{display:flex;flex-direction:column;padding-left:18px;position:relative}
.kpush-list li::before{content:"";position:absolute;left:2px;top:7px;width:8px;height:8px;border-radius:50%;background:var(--gold)}
.kpush-list b{font:700 14.5px/1.25 var(--f-body)}
.kpush-list small{font:500 12.5px/1.3 var(--f-body);color:var(--ink-2)}
/* Kein seitliches Wackeln: nichts darf breiter als der Viewport sein (Aurora ragte 10 px raus) */
html,body{overflow-x:hidden;overflow-x:clip}
.home-top{overflow:clip}
.aurora{inset:-70px 0 -30px}

/* =================================================================== Fahrer-Portal */
.fahrer-wrap{max-width:640px}
.f-tenant{margin-left:auto;max-width:160px;height:36px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:600 13px var(--f-body);padding:0 8px}
.f-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:-6px 0 12px}
.f-date{display:flex;align-items:center;gap:8px;font:700 15px var(--f-body)}
.f-dbtn{width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:var(--card);color:var(--ink);font:700 18px/1 var(--f-body)}
.f-prog{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}
.f-bar{height:8px;border-radius:4px;background:rgba(30,42,68,.08);overflow:hidden}
html[data-theme="dark"] .f-bar{background:rgba(255,255,255,.08)}
.f-bar i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,#e9c46a,#c8961e);transition:width .6s cubic-bezier(.2,1,.3,1)}
.f-prog span{font:600 13px var(--f-body);color:var(--ink-2)}
.f-map{height:200px;border-radius:18px;overflow:hidden;margin-bottom:12px;box-shadow:var(--shadow);background:var(--bg-2)}
.f-pin{width:30px;height:30px;border-radius:50%;background:var(--navy);color:#fff;border:2.5px solid #fff;display:grid;place-items:center;font:800 13px/1 var(--f-body);box-shadow:0 4px 10px rgba(0,0,0,.3)}
.f-pin.done{background:var(--ok)}.f-pin.next{background:#c8961e;color:#1e2a44;transform:scale(1.25)}
.f-actions{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.f-actions .btn{flex:1;justify-content:center;min-height:52px;font-size:16px;text-decoration:none}
.f-done{flex:1;text-align:center;padding:14px;border-radius:14px;background:var(--ok-soft);color:var(--ok);font:700 15px var(--f-body)}
.f-hint{margin:0 2px 10px}
.f-h2{margin:18px 0 10px;font:800 20px/1.2 var(--f-display)}
.f-list{display:flex;flex-direction:column;gap:10px}
.f-stop{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;padding:14px;border-radius:18px;background:var(--card);box-shadow:var(--shadow);transition:transform .25s cubic-bezier(.3,1.5,.5,1),opacity .3s}
.f-stop.done{opacity:.55}
.f-stop.next{box-shadow:0 0 0 2px #c8961e,0 12px 28px rgba(200,150,30,.2)}
.f-n{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:var(--navy-soft);color:var(--navy-t);font:800 18px/1 var(--f-display)}
.f-stop.next .f-n{background:#c8961e;color:#1e2a44;animation:dlPulse 1.8s ease-in-out infinite}
.f-stop.done .f-n{background:var(--ok-soft);color:var(--ok)}
.f-n.f-time{font-size:13px}
.f-main{min-width:0;display:flex;flex-direction:column;gap:3px}
.f-main b{font:800 16px/1.2 var(--f-display)}
.f-addr{font:500 14px/1.3 var(--f-body);color:var(--ink)}
.f-hintline{display:block;font-size:13px;color:var(--gold-ink)}
.f-meta{font:500 12.5px/1.3 var(--f-body);color:var(--ink-2)}
.f-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}
.f-row .btn{text-decoration:none}
.f-deliver{min-height:56px;min-width:108px;font-size:15px;border-radius:16px}
.f-deliver.ghost{border:1.5px solid var(--line-2)}
.f-undo{align-self:center}
@media (max-width:420px){.f-stop{grid-template-columns:40px 1fr}.f-deliver,.f-undo{grid-column:1 / -1;width:100%}}

/* =================================================================== Willkommen („Helden-Glocke“, js/splash.js) */
html.splash body>*:not(#mhSplash){visibility:hidden}
html.splash-out body>*:not(#mhSplash){animation:spPageIn .6s cubic-bezier(.2,1,.3,1) both}
@keyframes spPageIn{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}
#mhSplash{position:fixed;inset:0;z-index:5000;overflow:hidden;display:grid;place-items:center;background:linear-gradient(135deg,#ffd86b,#f3b335 55%,#dc9214);color:#15203a;opacity:1;transition:opacity .55s ease,transform .6s cubic-bezier(.2,1,.3,1),filter .5s ease}
#mhSplash.out{opacity:0;transform:scale(1.12);filter:blur(10px);pointer-events:none}
.sp-aura{position:absolute;inset:-20%;pointer-events:none}
.sp-aura i{position:absolute;width:60vmax;height:60vmax;border-radius:50%;filter:blur(70px);opacity:.55;background:#fff2c2;left:-10vmax;top:-10vmax;animation:spAura 4s ease-in-out infinite alternate}
.sp-aura i:nth-child(2){background:#ffb347;left:auto;right:-15vmax;top:30%;animation-delay:-1.3s;opacity:.45}
.sp-aura i:nth-child(3){background:#1e2a44;width:40vmax;height:40vmax;left:30%;bottom:-20vmax;top:auto;opacity:.12;animation-delay:-2.6s}
@keyframes spAura{to{transform:translate(6%,4%) scale(1.12)}}
.sp-grain{position:absolute;inset:0;pointer-events:none;opacity:.06;background-image:radial-gradient(rgba(0,0,0,.5) .6px,transparent .7px);background-size:3px 3px}
.sp-stage{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;transform:translateY(10px)}
.sp-cloche{width:min(62vw,260px);height:auto;overflow:visible}
.sp-plate{transform-origin:200px 240px;transform:scale(.6);opacity:0}
.sp-dome{transform-origin:200px 226px;transform:scale(.6);opacity:0}
.sp-shine{opacity:0;transform:translateX(-60px)}
.sp-steam path{fill:none;stroke:#fff;stroke-width:6;stroke-linecap:round;opacity:0;stroke-dasharray:60;stroke-dashoffset:60}
.sp-word{display:flex;font:800 clamp(30px,9.5vw,42px)/1 var(--f-display);letter-spacing:-.03em;color:#15203a}
.sp-word span{display:inline-block;opacity:0;transform:translateY(22px) rotate(4deg);filter:blur(4px)}
.sp-word .sp-h{color:#fff;text-shadow:0 2px 0 rgba(21,32,58,.25)}
.sp-tag{font:600 13.5px/1 var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:rgba(21,32,58,.7);opacity:0;transform:translateY(8px)}
/* Ablauf (go) */
#mhSplash.go .sp-plate{animation:spPop .7s cubic-bezier(.2,1.5,.4,1) .05s forwards}
#mhSplash.go .sp-dome{animation:spPop .7s cubic-bezier(.2,1.5,.4,1) .12s forwards,spLift .9s cubic-bezier(.3,1.3,.4,1) .62s forwards}
#mhSplash.go .sp-shine{animation:spShine .7s ease-out .5s forwards}
#mhSplash.go .sp-steam path{animation:spSteam 1s ease-out forwards}
#mhSplash.go .sp-steam path:nth-child(1){animation-delay:.8s}#mhSplash.go .sp-steam path:nth-child(2){animation-delay:.9s}#mhSplash.go .sp-steam path:nth-child(3){animation-delay:1s}
#mhSplash.go .sp-word span{animation:spLetter .55s cubic-bezier(.2,1.2,.35,1) forwards}
#mhSplash.go .sp-word span:nth-child(1){animation-delay:.55s}#mhSplash.go .sp-word span:nth-child(2){animation-delay:.59s}#mhSplash.go .sp-word span:nth-child(3){animation-delay:.63s}#mhSplash.go .sp-word span:nth-child(4){animation-delay:.67s}#mhSplash.go .sp-word span:nth-child(5){animation-delay:.71s}#mhSplash.go .sp-word span:nth-child(6){animation-delay:.75s}#mhSplash.go .sp-word span:nth-child(7){animation-delay:.79s}#mhSplash.go .sp-word span:nth-child(8){animation-delay:.86s}#mhSplash.go .sp-word span:nth-child(9){animation-delay:.9s}#mhSplash.go .sp-word span:nth-child(10){animation-delay:.94s}#mhSplash.go .sp-word span:nth-child(11){animation-delay:.98s}
#mhSplash.go .sp-tag{animation:spTag .6s ease-out 1.05s forwards}
@keyframes spPop{to{transform:none;opacity:1}}
@keyframes spLift{0%{transform:none}100%{transform:translateY(-54px) rotate(-7deg)}}
@keyframes spShine{0%{opacity:0;transform:translateX(-60px)}40%{opacity:1}100%{opacity:0;transform:translateX(90px)}}
@keyframes spSteam{0%{opacity:0;stroke-dashoffset:60;transform:translateY(0)}30%{opacity:.9}100%{opacity:0;stroke-dashoffset:0;transform:translateY(-16px)}}
@keyframes spLetter{to{opacity:1;transform:none;filter:none}}
@keyframes spTag{to{opacity:1;transform:none}}
/* Reduce Motion: ruhig einblenden */
#mhSplash.reduce .sp-plate,#mhSplash.reduce .sp-dome,#mhSplash.reduce .sp-word span,#mhSplash.reduce .sp-tag{animation:spFade .4s ease-out forwards!important;transform:none;filter:none}
#mhSplash.reduce .sp-aura i,#mhSplash.reduce .sp-steam path,#mhSplash.reduce .sp-shine{animation:none!important;opacity:0}
@keyframes spFade{to{opacity:1}}
/* Seitliches Wackeln in der App endgültig aus: Touch nur vertikal, außer in Elementen, die selbst seitlich scrollen */
html,body{touch-action:pan-y pinch-zoom}
.hscroll,.pills,.daytabs,.daystrip,.tscroll,.s-days,.pk-slots,.map,.leaflet-container,#map,#fMap,.f-map,input,textarea{touch-action:pan-x pan-y pinch-zoom}
main,#view-shop,.co-layout,.co-card{max-width:100%;overflow-x:clip}
.k-driver .krow{background:linear-gradient(135deg,var(--gold-soft),var(--card));border:1px solid rgba(200,150,30,.35)}
/* Stempelkarte: geschenkte Start-Stempel */
.vdot.gift.on{background:radial-gradient(circle at 35% 30%,#fff3c4,#e9c46a);box-shadow:inset 0 0 0 2px #c8961e}
.vdot.gift.on::after{content:"🎁";font-size:12px}
/* Kasse: Zahlungsarten auf einen Blick (Wortmarken als Text, keine Markenbilder) */
.paylogos{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px}
.plogo{display:inline-flex;align-items:center;gap:4px;height:34px;padding:0 12px;border-radius:9px;border:1px solid var(--line-2);background:var(--card);font:800 13px/1 var(--f-body);letter-spacing:-.01em;color:var(--ink)}
.plogo.apple{background:#000;color:#fff;border-color:#000}
.plogo.apple i{width:12px;height:14px;background:#fff;-webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M16.4 12.6c0-2.5 2-3.7 2.1-3.8-1.2-1.7-3-1.9-3.6-2-1.5-.2-3 .9-3.8.9-.8 0-2-.9-3.3-.9-1.7 0-3.3 1-4.1 2.5-1.8 3.1-.5 7.6 1.3 10.1.8 1.2 1.8 2.6 3.1 2.5 1.3 0 1.7-.8 3.3-.8s2 .8 3.3.8c1.4 0 2.2-1.2 3-2.5.9-1.4 1.3-2.8 1.3-2.8s-2.6-1-2.6-4zM14 5.2c.7-.8 1.2-2 1-3.2-1 0-2.3.7-3 1.5-.7.8-1.2 1.9-1.1 3.1 1.2.1 2.3-.6 3.1-1.4z'/></svg>") center/contain no-repeat;mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M16.4 12.6c0-2.5 2-3.7 2.1-3.8-1.2-1.7-3-1.9-3.6-2-1.5-.2-3 .9-3.8.9-.8 0-2-.9-3.3-.9-1.7 0-3.3 1-4.1 2.5-1.8 3.1-.5 7.6 1.3 10.1.8 1.2 1.8 2.6 3.1 2.5 1.3 0 1.7-.8 3.3-.8s2 .8 3.3.8c1.4 0 2.2-1.2 3-2.5.9-1.4 1.3-2.8 1.3-2.8s-2.6-1-2.6-4zM14 5.2c.7-.8 1.2-2 1-3.2-1 0-2.3.7-3 1.5-.7.8-1.2 1.9-1.1 3.1 1.2.1 2.3-.6 3.1-1.4z'/></svg>") center/contain no-repeat}
.plogo.gpay b{font-weight:900;background:linear-gradient(90deg,#4285f4,#ea4335 35%,#fbbc05 65%,#34a853);-webkit-background-clip:text;background-clip:text;color:transparent;font-size:15px}
.plogo.visa{color:#1a1f71;font-style:italic;font-weight:900;letter-spacing:.02em}
.plogo.mc i{width:14px;height:14px;border-radius:50%;display:inline-block}
.plogo.mc .c1{background:#eb001b}.plogo.mc .c2{background:#f79e1b;margin-left:-8px;opacity:.9}
.plogo.link{background:#00d66f;border-color:#00d66f;color:#011e0f}
html[data-theme="dark"] .plogo{border-color:var(--line-2)}
html[data-theme="dark"] .plogo.visa{color:#9fb4ff}

/* Startseite: aktive Bestellung live */
.live-list{display:flex;flex-direction:column;gap:10px;padding:0 16px}
.live-card{display:flex;align-items:center;gap:12px;padding:12px 12px 12px 14px;border-radius:20px;background:var(--card);color:var(--ink);text-decoration:none;box-shadow:0 10px 28px rgba(30,42,68,.1);border:1.5px solid transparent;transition:transform .25s cubic-bezier(.3,1.5,.5,1)}
.live-card:active{transform:scale(.98)}
.live-card.hot{border-color:#c8961e;box-shadow:0 12px 30px rgba(200,150,30,.25);background:linear-gradient(135deg,var(--gold-soft),var(--card))}
.live-card.done{opacity:.85}
.live-logo{flex:none;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:var(--navy-soft);color:var(--navy-t);font:800 20px/1 var(--f-display)}
.live-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.live-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.live-top b{font:800 15.5px/1.2 var(--f-display);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.live-txt small{font:500 12.5px/1.3 var(--f-body);color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.live-sub{color:var(--ink-3)!important}
.live-pill{flex:none;display:inline-flex;align-items:center;gap:5px;padding:4px 8px;border-radius:999px;font:700 11.5px/1 var(--f-body);background:rgba(30,42,68,.07);color:var(--navy-t)}
.live-pill i{width:7px;height:7px;border-radius:50%;background:var(--ink-3)}
.live-card.ok .live-pill{background:var(--ok-soft);color:var(--ok)}.live-card.ok .live-pill i{background:var(--ok)}
.live-card.live .live-pill,.live-card.hot .live-pill{background:rgba(200,150,30,.16);color:var(--gold-ink)}
.live-card.live .live-pill i,.live-card.hot .live-pill i{background:#c8961e;box-shadow:0 0 0 0 rgba(200,150,30,.5);animation:live 1.6s infinite}
.live-card.done .live-pill{background:var(--ok-soft);color:var(--ok)}.live-card.done .live-pill i{background:var(--ok)}
.live-steps{display:flex;gap:4px;margin-top:4px}
.live-steps i{flex:1;height:4px;border-radius:2px;background:rgba(30,42,68,.1)}
html[data-theme="dark"] .live-steps i{background:rgba(255,255,255,.1)}
.live-steps i.on{background:var(--ok)}.live-card.hot .live-steps i.on,.live-card.live .live-steps i.on{background:#c8961e}
.live-steps i.cur{animation:stepGlow 1.4s ease-in-out infinite alternate}
@keyframes stepGlow{to{opacity:.45}}
.live-chev{flex:none;width:22px;height:22px;color:var(--ink-3)}
.live-chev svg{width:22px;height:22px}
.live-top{flex-wrap:wrap}.live-top b{flex:1 1 120px}
/* Live-Karte kompakt: eine Zeile Status, eine Zeile Details, dünne Fortschrittsstriche */
#live{padding:6px 0 0}
#live .hsec-h{display:none}
.live-card{padding:10px 12px 9px 12px;gap:10px;border-radius:16px;box-shadow:0 6px 18px rgba(30,42,68,.08)}
.live-logo{width:34px;height:34px;border-radius:10px;font-size:15px}
.live-txt{gap:2px}
.live-top b{font-size:14px}
.live-txt small{font-size:12px}
.live-pill{padding:0;background:none!important;font-size:12.5px}
.live-steps{gap:3px;margin-top:4px}
.live-steps i{height:3px}
.live-chev{width:18px;height:18px}.live-chev svg{width:18px;height:18px}
.live-card.hot{box-shadow:0 8px 22px rgba(200,150,30,.22)}

/* Konto: „Mein Restaurant“ (Küche/Büro) – alles Wichtige oben, ein Tipp entfernt */
.kr{gap:12px;background:linear-gradient(160deg,#243256,#151d33);color:#fff;border:0}
.kr-h{display:flex;gap:12px;align-items:center}
.kr-h>div{display:flex;flex-direction:column;gap:2px;min-width:0}
.kr-logo{flex:none;width:48px;height:48px;border-radius:14px;background:rgba(255,255,255,.12);display:grid;place-items:center;font:800 22px/1 var(--f-display);color:#e9c46a}
.kr-eyebrow{font:700 11px/1 var(--f-body);letter-spacing:.1em;text-transform:uppercase;color:#e9c46a}
.kr-h b{font:800 18px/1.2 var(--f-display)}
.kr-h small{font:500 12.5px/1.3 var(--f-body);color:#b9c2d8;display:flex;align-items:center;gap:6px}
.kr .dot{width:8px;height:8px;border-radius:50%;background:#9a9387}.kr .dot.ok{background:#63c78f;box-shadow:0 0 0 0 rgba(99,199,143,.5);animation:live 2s infinite}.kr .dot.warn{background:#e9c46a}
.kr-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.kr-stats>div{padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.07)}
.kr-stats b{display:block;font:800 24px/1 var(--f-display)}
.kr-stats small{display:block;margin-top:3px;font:500 12px/1.2 var(--f-body);color:#b9c2d8}
.kr-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.kr-q{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 4px;border-radius:14px;background:rgba(255,255,255,.07);color:#fff;text-decoration:none;font:600 12px/1 var(--f-body);transition:transform .2s cubic-bezier(.3,1.6,.5,1)}
.kr-q:active{transform:scale(.94)}
.kr-q span{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:rgba(233,196,106,.15);color:#e9c46a}
.kr-q svg{width:20px;height:20px}
.kr-row{display:flex;gap:8px}
.kr-row .btn{flex:1;justify-content:center;text-decoration:none}
.kr-row .btn:not(.ghost){background:linear-gradient(135deg,#e9c46a,#c8961e);color:#141a2a;border:0}
.kr-row .btn.ghost{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.2)}
.hdr-admin{background:var(--navy);color:#fff;border-color:var(--navy)}
html[data-theme="dark"] .hdr-admin{background:#e9c46a;color:#141a2a;border-color:#e9c46a}
.kd .kr-logo{font-size:24px}
.kd-next{display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:14px;background:rgba(233,196,106,.12);border:1px solid rgba(233,196,106,.3)}
.kd-n{flex:none;width:34px;height:34px;border-radius:10px;background:#e9c46a;color:#141a2a;display:grid;place-items:center;font:800 15px/1 var(--f-display)}
.kd-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.kd-t b{font:700 14px/1.2 var(--f-body);color:#fff}
.kd-t small{font:500 12px/1.3 var(--f-body);color:#b9c2d8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
