html,body{margin:0;height:100%}
body{background:var(--bg-sunken);font-family:var(--font-ui);color:var(--text);display:flex;align-items:center;justify-content:center;padding:0;box-sizing:border-box;height:100vh;overflow:hidden}
.phone{width:390px;height:844px;flex:0 0 auto;background:var(--bg-base);border-radius:40px;box-shadow:0 20px 60px rgba(15,20,25,.22),0 0 0 10px #1b1f27,0 0 0 11px #2a2f3a;overflow:hidden;position:relative}
html.embed body{background:transparent;padding:0}
html.embed .phone{box-shadow:none;border-radius:0;max-height:none}
html.allmode body{padding-bottom:96px;box-sizing:border-box}
.statusbar{height:44px;display:flex;align-items:center;justify-content:space-between;padding:0 22px;font:600 14px var(--font-ui);color:var(--text);background:var(--bg-base)}
.statusbar .dots{display:flex;gap:5px;align-items:center}
#app{position:relative;width:100%;height:calc(100% - 44px);background:var(--bg-base);overflow:hidden}
.scroll{height:100%;overflow-y:auto;-webkit-overflow-scrolling:touch}
/* shared header brand */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px}
.brand{display:inline-flex;align-items:center;gap:8px;font:800 17px var(--font-mono);letter-spacing:.02em;color:var(--text)}
.brand img{height:20px}
[data-theme="dark"] .brand img{filter:invert(1)}
.htools{display:flex;align-items:center;gap:8px}
.langwrap{position:relative}
.langbtn{display:inline-flex;align-items:center;gap:5px;height:34px;padding:0 9px 0 10px;border:1px solid var(--border);border-radius:999px;background:var(--bg-base);color:var(--text);font:700 12px var(--font-ui);cursor:pointer}
.langmenu{position:absolute;top:40px;right:0;z-index:50;background:var(--bg-surface);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-float);padding:6px;min-width:168px;display:flex;flex-direction:column;gap:2px}
.langmenu button{display:flex;align-items:center;gap:10px;width:100%;height:46px;padding:0 12px;border:none;background:transparent;border-radius:10px;color:var(--text);font:600 15px var(--font-ui);cursor:pointer;text-align:left}
.langmenu button:hover{background:var(--bg-sunken)}
.langmenu button.on{background:var(--accent-soft);color:var(--accent-text)}
.langmenu .flag{font-size:19px;line-height:1}
.langmenu .tick{margin-left:auto;color:var(--accent-text)}
.langback{position:fixed;inset:0;z-index:49}
.iconbtn{width:34px;height:34px;border:1px solid var(--border);border-radius:999px;background:var(--bg-base);color:var(--text-soft);display:flex;align-items:center;justify-content:center;cursor:pointer}
/* restaurant cover */
.cover{position:relative;height:188px;background:var(--bg-sunken);overflow:hidden}
.cover img{width:100%;height:100%;object-fit:cover;display:block}
.cover::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,20,25,0) 35%,rgba(15,20,25,.62) 100%)}
.cover .info{position:absolute;left:18px;right:18px;bottom:14px;z-index:2;color:#fff}
.cover .rn{font:800 25px var(--font-ui);letter-spacing:-.02em;margin:0}
.cover .rm{display:flex;align-items:center;gap:12px;font:600 13px var(--font-ui);margin-top:6px;opacity:.95;flex-wrap:wrap}
.cover .rm .d{width:3px;height:3px;border-radius:50%;background:rgba(255,255,255,.7)}
.openpill{position:absolute;top:14px;left:18px;z-index:2;display:inline-flex;align-items:center;gap:6px;background:rgba(16,159,110,.95);color:#fff;font:700 12px var(--font-ui);padding:6px 11px;border-radius:999px}
/* mode select */
.pad{padding:18px 18px 26px}
.sechead{font:700 12px var(--font-ui);letter-spacing:.05em;text-transform:uppercase;color:var(--text-muted);margin:6px 2px 12px}
.modecard{display:flex;align-items:center;gap:16px;width:100%;text-align:left;padding:18px;border:1.5px solid var(--border);border-radius:18px;background:var(--bg-base);cursor:pointer;margin-bottom:12px}
.modecard:hover{border-color:var(--accent)}
.modecard .mi{width:54px;height:54px;border-radius:14px;flex:none;background:var(--accent-soft);color:var(--accent-text);display:flex;align-items:center;justify-content:center}
.modecard .mt{flex:1;min-width:0}
.modecard .mt b{font:700 18px var(--font-ui);color:var(--text);display:block}
.modecard .mt span{font:500 13px var(--font-ui);color:var(--text-muted);display:block;margin-top:3px;line-height:1.4}
.modecard .arr{color:var(--text-muted);flex:none}
.provline{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:14px;font:600 13px var(--font-ui);color:var(--success)}
/* plz gate */
.gate{padding:22px 20px}
.gate h1{font:800 23px var(--font-ui);letter-spacing:-.02em;margin:18px 0 6px}
.gate p.lead{font:500 14px var(--font-ui);color:var(--text-muted);margin:0 0 22px;line-height:1.5}
.plzfield{display:flex;gap:10px}
.plzfield input{flex:1;min-width:0;height:56px;box-sizing:border-box;padding:0 16px;border:1.5px solid var(--border);border-radius:14px;background:var(--bg-base);color:var(--text);font:700 20px var(--font-mono);letter-spacing:.08em;outline:none}
.plzfield input:focus{border-color:var(--accent)}
.zoneres{margin-top:18px;border-radius:14px;padding:16px;display:flex;gap:13px;align-items:flex-start}
.zoneres.ok{background:color-mix(in srgb,var(--success) 12%,transparent)}
.zoneres.no{background:color-mix(in srgb,var(--danger) 11%,transparent)}
.zoneres .zi{flex:none;margin-top:1px}
.zoneres b{font:700 15px var(--font-ui);color:var(--text);display:block}
.zoneres span{font:500 13px var(--font-ui);color:var(--text-muted);display:block;margin-top:3px;line-height:1.45}
.zonelist{margin-top:14px;padding-top:2px}
.zonelist .zr{display:flex;justify-content:space-between;align-items:center;padding:9px 0;font:600 13px var(--font-ui);color:var(--text-soft)}
.zonelist .zr .zv{font:700 14px var(--font-mono);color:var(--text)}
.zonelist .zr+.zr{border-top:1px solid color-mix(in srgb,var(--success) 18%,transparent)}
/* mode strip on menu */
.modestrip{display:flex;align-items:center;gap:8px;padding:10px 16px;background:var(--bg-surface);border-bottom:1px solid var(--border);font:600 13px var(--font-ui);color:var(--text-soft);cursor:pointer}
.modestrip .mtag{display:inline-flex;align-items:center;gap:6px;color:var(--text);font-weight:700}
.modestrip .chg{margin-left:auto;color:var(--accent-text);font-weight:700}
/* chips + menu (reused) */
.chips{position:sticky;top:0;z-index:10;display:flex;gap:8px;overflow-x:auto;padding:12px 16px;background:var(--bg-base);border-bottom:1px solid var(--border);scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex:0 0 auto;height:34px;padding:0 15px;border-radius:999px;border:1px solid var(--border);background:var(--bg-surface);color:var(--text-soft);font:600 13px var(--font-ui);cursor:pointer;white-space:nowrap}
.chip.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.menu{padding:8px 16px 130px}
.cat-h{font:700 16px var(--font-ui);color:var(--text);margin:18px 4px 10px}
/* Ausverkauft: gepflegt an der Kasse, im Shop nicht bestellbar. */
.item.out{opacity:.5}
.item.out .thumb{filter:grayscale(1)}
.outtag{display:inline-block;font:700 11px var(--font-ui);letter-spacing:.03em;text-transform:uppercase;color:var(--danger);background:color-mix(in srgb,var(--danger) 13%,transparent);padding:3px 8px;border-radius:99px;margin-top:5px}
.item{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid var(--border);cursor:pointer}
.item .meta{flex:1;min-width:0}
.item .nm{font:600 16px var(--font-ui);color:var(--text)}
.item .ds{font:500 13px var(--font-ui);color:var(--text-muted);margin-top:3px;line-height:1.4}
.item .pr{font:700 15px var(--font-mono);color:var(--text);margin-top:8px}
.thumb{position:relative;width:96px;height:96px;border-radius:14px;flex:none;overflow:hidden;background:var(--bg-sunken)}
.thumb img{width:100%;height:100%;object-fit:cover;display:block}
.thumb .ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.thumb .corner{position:absolute;right:6px;bottom:6px}
.addbtn{width:30px;height:30px;border-radius:999px;background:var(--bg-surface);border:1px solid var(--border);color:var(--accent-text);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-float)}
.qbadge{width:30px;height:30px;border-radius:999px;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font:700 14px var(--font-mono);box-shadow:var(--shadow-float)}
/* dock + cart button */
.dock{position:absolute;bottom:0;left:0;width:100%;padding:12px 16px calc(12px + var(--safe-bottom));background:var(--bg-surface);border-top:1px solid var(--border);box-shadow:0 -4px 16px rgba(15,20,25,.08);z-index:30;display:flex;flex-direction:column;gap:8px}
.minnote{font:600 12px var(--font-ui);color:var(--danger);text-align:center}
.cartbtn{width:100%;height:52px;border:none;border-radius:14px;background:var(--accent);color:#fff;font:600 16px var(--font-ui);cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:0 18px}
.cartbtn.ghost{background:var(--bg-base);color:var(--text);border:1px solid var(--border)}
.cartbtn.block{justify-content:center;gap:10px}
.cartbtn:disabled{opacity:.5;cursor:not-allowed}
.cartbtn .n{background:rgba(255,255,255,.22);min-width:26px;height:26px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font:700 14px var(--font-mono)}
.cartbtn .amt{font-family:var(--font-mono);font-weight:700}
/* sheets */
.ovl{position:absolute;inset:0;background:rgba(15,20,25,.45);display:flex;align-items:flex-end;z-index:40}
.sheet{width:100%;background:var(--bg-surface);border-radius:20px 20px 0 0;max-height:92%;display:flex;flex-direction:column}
.ihero{position:relative;height:200px;background:var(--bg-sunken);border-radius:20px 20px 0 0;overflow:hidden}
.ihero img{width:100%;height:100%;object-fit:cover}
.ihero .ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.closex{position:absolute;top:12px;right:12px;width:34px;height:34px;border:none;border-radius:999px;background:rgba(255,255,255,.92);color:#0F1419;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-float)}
.galwrap{position:relative;height:300px;border-radius:20px 20px 0 0;overflow:hidden;background:var(--bg-sunken)}
.gal{height:100%;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.gal::-webkit-scrollbar{display:none}
.gal .slide{flex:0 0 100%;scroll-snap-align:start;position:relative;height:100%}
.gal .slide img{width:100%;height:100%;object-fit:cover}
.gal .slide .ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.galcount{position:absolute;top:12px;left:12px;z-index:2;background:rgba(15,20,25,.6);color:#fff;font:600 12px var(--font-ui);padding:4px 10px;border-radius:999px;display:flex;align-items:center;gap:5px;backdrop-filter:blur(4px)}
.galdots{position:absolute;left:0;right:0;bottom:12px;display:flex;gap:6px;justify-content:center;z-index:2}
.galdot{width:6px;height:6px;border-radius:999px;background:rgba(255,255,255,.55);transition:width .2s}
.galdot.on{background:#fff;width:18px}
.szrow{display:flex;flex-wrap:wrap;gap:8px}
.szpill{min-width:54px;padding:11px 15px;border:1.5px solid var(--border-strong);border-radius:12px;background:var(--bg-base);font:700 15px var(--font-ui);color:var(--text);cursor:pointer;text-align:center}
.szpill.on{background:var(--accent);border-color:var(--accent);color:#fff}
.sb{overflow-y:auto;padding:18px}
.sb h2{font:700 21px var(--font-ui);margin:0 0 4px}
.sb .sdesc{font:500 14px var(--font-ui);color:var(--text-muted);margin:0 0 18px;line-height:1.45}
.grp{margin-bottom:18px}
.grp .gh{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:8px}
.grp .gt{font:600 15px var(--font-ui)}
.grp .gm{font:500 12px var(--font-ui);color:var(--text-muted)}
.opt-row{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--border);border-radius:12px;margin-bottom:7px;cursor:pointer;background:var(--bg-base)}
.opt-row.on{background:var(--accent-soft);border-color:transparent}
.opt-row .bx{width:22px;height:22px;flex:none;border:2px solid var(--border-strong);display:flex;align-items:center;justify-content:center}
.opt-row.on .bx{background:var(--accent);border-color:var(--accent)}
.opt-row .on-n{flex:1;font:600 15px var(--font-ui)}
.opt-row .on-p{font:600 14px var(--font-mono);color:var(--text-soft)}
.notef{width:100%;box-sizing:border-box;height:46px;padding:0 14px;background:var(--bg-sunken);border:1px solid var(--border);border-radius:12px;font:500 15px var(--font-ui);color:var(--text);outline:none}
.sfoot{padding:14px 18px calc(16px + var(--safe-bottom));border-top:1px solid var(--border)}
.sh{display:flex;align-items:center;justify-content:space-between;padding:18px 18px 12px}
.sh h2{font:700 19px var(--font-ui);margin:0}
.x{width:34px;height:34px;border:none;background:var(--bg-sunken);border-radius:9px;color:var(--text-soft);cursor:pointer;display:flex;align-items:center;justify-content:center}
.cl{display:flex;align-items:flex-start;gap:12px;padding:13px 0;border-bottom:1px solid var(--border)}
.cl .cn{flex:1}
.cl .cn b{font:600 15px var(--font-ui);color:var(--text)}
.cl .cmods{font:500 12px var(--font-ui);color:var(--text-muted);margin-top:2px;line-height:1.4}
.noteadd{display:inline-flex;align-items:center;gap:5px;margin-top:7px;padding:5px 10px 5px 8px;background:none;border:1px dashed var(--border);border-radius:8px;color:var(--accent);font:600 12px var(--font-ui);cursor:pointer}
.noteadd:hover{background:var(--accent-soft);border-style:solid}
.notechip{display:inline-flex;align-items:center;gap:6px;margin-top:7px;padding:5px 10px;background:var(--accent-soft);border:none;border-radius:8px;color:var(--accent-text);font:500 12px var(--font-ui);cursor:pointer;max-width:230px}
.notechip span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.noteedit{margin-top:8px}
.noteedit textarea{width:100%;box-sizing:border-box;resize:none;border:1px solid var(--border);border-radius:10px;padding:9px 11px;font:500 13px var(--font-ui);color:var(--text);background:var(--bg-base);outline:none}
.noteedit textarea:focus{border-color:var(--accent)}
.notebtns{display:flex;justify-content:flex-end;margin-top:6px}
.ntx{padding:6px 16px;background:var(--accent);color:#fff;border:none;border-radius:8px;font:600 12px var(--font-ui);cursor:pointer}
.cl .cpr{font:700 14px var(--font-mono);white-space:nowrap}
.stp{display:flex;align-items:center;gap:2px;background:var(--bg-base);border:1px solid var(--border);border-radius:10px}
.stp button{width:32px;height:32px;border:none;background:transparent;color:var(--text);font:700 17px var(--font-ui);cursor:pointer}
.row-sb{display:flex;justify-content:space-between;align-items:center}
.sumrow{display:flex;justify-content:space-between;align-items:center;font:600 14px var(--font-ui);color:var(--text-soft);padding:5px 0}
.sumrow.tot{font:700 17px var(--font-ui);color:var(--text);border-top:1px solid var(--border);margin-top:6px;padding-top:12px}
.sumrow .v{font-family:var(--font-mono)}
/* checkout */
.coscroll{height:100%;overflow-y:auto;padding-bottom:120px}
.timewrap{margin-top:12px}
.timecap{display:flex;align-items:center;gap:6px;font:600 12px var(--font-ui);color:var(--text-muted);margin:0 2px 9px}
.timepick{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
.timepick::-webkit-scrollbar{display:none}
.tchip{flex:0 0 auto;height:42px;min-width:62px;padding:0 14px;border-radius:12px;border:1.5px solid var(--border);background:var(--bg-base);color:var(--text);font:700 15px var(--font-mono);cursor:pointer}
.tchip.on{background:var(--accent);border-color:var(--accent);color:#fff}
.cohead{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--border)}
.cohead h1{font:700 19px var(--font-ui);margin:0}
.cosec{padding:18px 18px 6px}
.cosec h3{font:700 12px var(--font-ui);letter-spacing:.05em;text-transform:uppercase;color:var(--text-muted);margin:0 0 12px}
.field{margin-bottom:12px}
.field label{display:block;font:600 12px var(--font-ui);color:var(--text-soft);margin-bottom:6px}
.field input{width:100%;box-sizing:border-box;height:50px;padding:0 14px;border:1.5px solid var(--border);border-radius:12px;background:var(--bg-base);color:var(--text);font:500 15px var(--font-ui);outline:none}
.field input:focus{border-color:var(--accent)}
.grid2{display:flex;gap:10px}
.grid2 .field{flex:1}
.slot{display:flex;gap:8px}
.slot button{flex:1;height:50px;border:1.5px solid var(--border);border-radius:12px;background:var(--bg-base);color:var(--text);font:600 14px var(--font-ui);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px}
.slot button.on{background:var(--accent-soft);border-color:transparent;color:var(--accent-text)}
.slot .ss{font:600 11px var(--font-mono);color:var(--text-muted)}
.slot button.on .ss{color:var(--accent-text)}
.tender{display:flex;gap:10px;margin:6px 0 4px}
.tender button{flex:1;height:80px;border:1px solid var(--border);border-radius:14px;background:var(--bg-base);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;font:600 13px var(--font-ui);color:var(--text)}
.tender button:hover{border-color:var(--accent)}
/* express + card payment */
.express{display:flex;flex-direction:column;gap:9px;margin:2px 0 14px}
.xbtn{height:52px;border-radius:12px;border:1.5px solid transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;font:700 16px var(--font-ui);position:relative}
.xbtn .chk{position:absolute;right:14px;opacity:0}
.xbtn.sel{outline:2.5px solid var(--accent);outline-offset:2px}
.xbtn.sel .chk{opacity:1}
.xbtn.apple{background:#000;color:#fff}
.xbtn.gpay{background:#fff;color:#3c4043;border-color:#dadce0}
.xbtn.paypal{background:#FFC439;color:#003087}
.paydiv{display:flex;align-items:center;gap:12px;color:var(--text-muted);font:600 12px var(--font-ui);margin:6px 0 12px;text-transform:uppercase;letter-spacing:.04em}
.paydiv::before,.paydiv::after{content:"";height:1px;background:var(--border);flex:1}
.payrow{width:100%;box-sizing:border-box;display:flex;align-items:center;gap:13px;min-height:62px;padding:0 14px;border:1.5px solid var(--border);border-radius:13px;background:var(--bg-base);cursor:pointer;margin-bottom:10px;color:var(--text);text-align:left}
.payrow .ptxt{flex:1;display:flex;flex-direction:column;font:700 15px var(--font-ui)}
.payrow .psub{font:600 11px var(--font-ui);color:var(--text-muted);margin-top:2px}
.payrow.sel{border-color:var(--accent);background:var(--accent-soft)}
.payrow .radio{width:20px;height:20px;border-radius:50%;border:2px solid var(--border);flex:0 0 auto;display:flex;align-items:center;justify-content:center}
.payrow.sel .radio{border-color:var(--accent)}
.payrow.sel .radio::after{content:"";width:10px;height:10px;border-radius:50%;background:var(--accent)}
.cardlogos{display:flex;gap:5px;margin-left:auto;align-items:center}
.cardlogos .cl-visa{background:#fff;color:#1A1F71;font:italic 800 11px var(--font-ui);letter-spacing:.01em;padding:4px 6px;border:1px solid var(--border);border-radius:4px}
.cardlogos .cl-amex{background:#2E77BC;color:#fff;font:800 10px var(--font-ui);letter-spacing:.01em;padding:4px 5px;border-radius:4px}
.cardlogos .cl-mc{display:flex;align-items:center}
.cardform{padding:2px 2px 8px;animation:fadein .2s ease}
.savecard{display:flex;align-items:center;gap:9px;font:600 13px var(--font-ui);color:var(--text-soft);cursor:pointer;margin:2px 0 4px}
.savecard input{width:18px;height:18px;accent-color:var(--accent)}
@keyframes fadein{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.tracknote{display:flex;gap:11px;margin:2px 22px 10px;padding:13px 15px;border:1px solid var(--border);border-radius:14px;background:var(--bg-sunken)}
.tracknote b{display:block;font:700 13px var(--font-ui);margin-bottom:3px}
.tracknote span{font:500 12px var(--font-ui);color:var(--text-muted);line-height:1.45}
/* process + status */
.center{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}
.center .track{padding:24px 22px}
.center .tk-top{margin-bottom:0}
.track{padding:24px 22px calc(24px + var(--safe-bottom))}
.tk-top{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;margin-bottom:24px}
.donecircle{width:78px;height:78px;border-radius:50%;background:var(--success);color:#fff;display:flex;align-items:center;justify-content:center;animation:pop .4s cubic-bezier(.2,.8,.2,1)}
@keyframes pop{from{transform:scale(.6);opacity:0}to{transform:none;opacity:1}}
@keyframes spin{to{transform:rotate(360deg)}}
.payspin{position:absolute;inset:0;border-radius:50%;border:4px solid var(--border);border-top-color:var(--accent);animation:spin .8s linear infinite}
.ordnum{display:inline-flex;align-items:center;gap:8px;background:var(--bg-sunken);color:var(--text-soft);font:700 13px var(--font-ui);padding:8px 14px;border-radius:999px;margin:0 auto}
.ordnum b{font-family:var(--font-mono);color:var(--text)}
.etabox{text-align:center;padding:20px 18px;border-bottom:1px solid var(--border)}
.etabox .el{font:600 12px var(--font-ui);letter-spacing:.05em;text-transform:uppercase;color:var(--text-muted)}
.etabox .ev{font:800 34px var(--font-ui);letter-spacing:-.02em;color:var(--text);margin-top:4px}
.stepwrap{padding:22px 22px 0}
.step{display:flex;gap:14px;align-items:flex-start;padding-bottom:22px;position:relative}
.step:last-child{padding-bottom:8px}
.step .ln{position:absolute;left:15px;top:32px;bottom:0;width:2px;background:var(--border)}
.step.done .ln,.step.active .ln{background:var(--success)}
.step .dot{width:32px;height:32px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;border:2px solid var(--border);background:var(--bg-surface);color:var(--text-muted);z-index:1}
.step.done .dot{background:var(--success);border-color:var(--success);color:#fff}
.step.active .dot{background:var(--accent);border-color:var(--accent);color:#fff;animation:pulse 1.6s infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 45%,transparent)}50%{box-shadow:0 0 0 7px transparent}}
.step .st{font:600 15px var(--font-ui);color:var(--text);padding-top:5px}
.step.todo .st{color:var(--text-muted)}
.step .ss{font:500 12px var(--font-ui);color:var(--text-muted);margin-top:2px}
.scrim{font:500 13px var(--font-ui);color:var(--text-muted)}
.toast{position:absolute;left:50%;bottom:calc(24px + var(--safe-bottom));transform:translateX(-50%);background:var(--text);color:var(--bg-base);font:600 14px var(--font-ui);padding:13px 20px;border-radius:12px;z-index:60;box-shadow:var(--shadow-float);display:flex;align-items:center;gap:9px;max-width:340px;animation:pop .3s}