:root{--paper:#f5f1e8;--surface:#fffdf8;--ink:#29261f;--muted:#777064;--forest:#183d30;--line:#ded8cc;--sage:#deece4;--amber:#f1e5bc;--red:#a5413d;font-family:"Plus Jakarta Sans",sans-serif;color:var(--ink);background:var(--paper)}
html[data-text-size=large]{font-size:18px}html[data-text-size=extra-large]{font-size:20px}
*{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{opacity:.5;cursor:default}a{color:var(--forest)}[hidden]{display:none!important}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #b68c37;outline-offset:3px}.material-symbols-rounded{display:inline-flex;align-items:center;justify-content:center;font-size:24px;line-height:1;font-weight:normal;flex-shrink:0}
.appbar{height:76px;position:fixed;inset:0 0 auto;z-index:10;display:flex;align-items:center;gap:18px;padding:0 max(20px,calc((100vw - 1160px)/2));background:var(--forest);color:white}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit;font-size:1.45rem}.brand-icon{width:42px;height:42px;border-radius:50%;background:#ffffff14}.app-context{font-size:.9rem;opacity:.7}.badge{display:inline-flex;align-items:center;width:max-content;border-radius:20px;background:var(--sage);color:var(--forest);padding:6px 10px;font-size:.72rem;font-weight:700;white-space:nowrap}.demo{margin-left:auto;background:#ffffff18;color:#dce8e0}.badge.warn{background:var(--amber);color:#735a1d}.badge.error{background:#f7e3df;color:var(--red)}
main{max-width:1200px;margin:0 auto;padding:108px 24px 110px}body[data-page=order] main,body[data-page=track] main,body[data-page=rider] main{max-width:800px}.page-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:24px}.page-head h1{font-size:2rem;letter-spacing:-.04em;margin:0}.page-head .heading{display:flex;align-items:center;gap:12px}.icon-button{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--forest);padding:0;text-decoration:none;flex-shrink:0}.icon-button:hover{background:var(--sage)}h2,h3,p{margin:0}h2{font-size:1.25rem}h3{font-size:1rem}.muted{color:var(--muted);font-size:.85rem;line-height:1.6}.eyebrow{text-transform:uppercase;letter-spacing:.13em;font-size:.68rem;color:#9a7839;font-weight:700}.stack{display:grid;gap:16px}.row{display:flex;align-items:center;gap:12px}.between{justify-content:space-between}.wrap{flex-wrap:wrap}.grow{flex:1;min-width:0}.right{text-align:right}.small{font-size:.8rem}.primary,.secondary{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:11px 20px;border-radius:24px;border:0;font-weight:700;font-size:.88rem;text-decoration:none}.primary{background:var(--forest);color:white}.secondary{background:var(--sage);color:var(--forest)}.primary:hover{background:#275442}.wide{width:100%}.outline{background:transparent;border:1px solid var(--line)}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:24px}.stat{background:#ebe5d9;border-radius:22px;padding:18px}.stat strong{display:block;font-size:1.8rem;font-weight:600;margin-bottom:3px}.stat span{font-size:.78rem;color:var(--muted)}.stat:first-child{background:var(--sage)}.toolbar{display:flex;gap:10px;align-items:center;margin-bottom:20px}.search{flex:1;border:1px solid var(--line);border-radius:28px;padding:12px 18px;background:var(--surface);min-width:0;color:var(--ink)}.chips{display:flex;gap:8px;overflow:auto;scrollbar-width:none;padding:2px 0 12px}.chip{border:1px solid var(--line);border-radius:20px;padding:9px 15px;background:transparent;color:var(--ink);white-space:nowrap;font-size:.82rem}.chip.active{background:var(--forest);border-color:var(--forest);color:white}
.order-grid,.rider-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.card{background:var(--surface);border:1px solid var(--line);border-radius:24px;padding:22px;min-width:0}.order-card{cursor:pointer}.order-card:hover{border-color:#80a08e}.order-card .row+.row{margin-top:15px}.card-title{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}.order-card h3{font-size:1.02rem}.order-card .customer{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:240px}.rider-avatar{display:flex;align-items:center;justify-content:center;width:52px;height:52px;background:var(--sage);color:var(--forest);border-radius:50%;flex-shrink:0}.rider-card{display:grid;gap:18px}.empty{grid-column:1/-1;text-align:center;padding:64px 16px;color:var(--muted)}.empty>.material-symbols-rounded{font-size:64px;color:var(--forest);margin-bottom:18px;font-variation-settings:"FILL" 1,"wght" 700}.empty h2,.empty h1{color:var(--ink);font-size:1.3rem;margin-bottom:10px}.empty p{font-size:.87rem}.bottom-nav{position:fixed;bottom:0;left:0;right:0;background:var(--forest);display:flex;justify-content:center;padding:10px 12px calc(12px + env(safe-area-inset-bottom));z-index:10;gap:40px}.bottom-nav a{color:#b6c9bd;text-decoration:none;display:grid;justify-items:center;gap:5px;font-size:.75rem;min-width:110px}.bottom-nav a .material-symbols-rounded{border-radius:20px;padding:5px 22px}.bottom-nav a.active{color:white}.bottom-nav a.active .material-symbols-rounded{background:#ffffff15}
dialog{width:min(580px,calc(100vw - 24px));max-height:calc(100dvh - 40px);border:0;border-radius:28px;background:var(--paper);color:var(--ink);padding:22px;box-shadow:0 16px 70px #0003}dialog::backdrop{background:#0b201f70}.modal-head{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:22px}.modal-head h2{font-size:1.4rem;letter-spacing:-.04em}.modal-head .icon-button{flex-shrink:0}.modal-body{display:grid;gap:16px}label{display:grid;gap:8px;font-size:.85rem;font-weight:600}input:not([type=checkbox]):not([type=radio]),textarea,select{border:1px solid var(--line);border-radius:14px;padding:13px;background:var(--surface);color:var(--ink);width:100%;min-width:0}textarea{min-height:86px;resize:vertical}select{appearance:auto}form{display:grid;gap:16px}.divider{height:1px;background:var(--line);margin:4px 0}.item-line{display:flex;justify-content:space-between;gap:14px;font-size:.87rem;line-height:1.6;padding:8px 0}.total{font-size:1.2rem;font-weight:750}.address{line-height:1.7;font-size:.92rem;white-space:pre-wrap;overflow-wrap:anywhere}.notice{padding:12px 16px;border-radius:16px;background:var(--amber);color:#624c1e;font-size:.8rem;line-height:1.7}.error-text{color:var(--red)}#snackbar{position:fixed;z-index:50;bottom:100px;left:50%;transform:translateX(-50%);background:#303d35;color:white;border-radius:8px;padding:15px 22px;max-width:calc(100vw - 32px);width:max-content;box-shadow:0 4px 15px #0002;font-size:.86rem}.form-error{color:var(--red);font-size:.85rem;line-height:1.5}
.menu-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.menu-item{display:grid;gap:12px;padding:18px}.menu-item .description{color:var(--muted);font-size:.78rem;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.quantity{display:flex;align-items:center;justify-content:space-between;gap:8px;border-radius:24px;background:var(--sage);padding:2px}.quantity button{width:32px;height:32px;border:0;border-radius:50%;background:transparent;color:var(--forest);display:grid;place-items:center}.quantity span{font-size:.85rem;font-weight:700;min-width:14px;text-align:center}.cart-fab{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);border:0;border-radius:20px;padding:18px 30px;background:var(--forest);color:white;display:flex;gap:12px;align-items:center;font-weight:700;box-shadow:0 6px 20px #0003;min-width:250px;justify-content:center;z-index:12}.payment-options{display:flex;gap:10px}.payment-options label{flex:1;padding:14px;border:1px solid var(--line);border-radius:16px;display:flex;align-items:center;font-size:.8rem;background:var(--surface)}.qr{max-width:220px;max-height:240px;object-fit:contain;display:block;margin:12px auto;border-radius:12px}.tracking-hero{background:var(--forest);color:#fff;padding:30px;border-radius:28px;margin-bottom:20px}.tracking-hero .eyebrow{color:#c2d5c7}.eta{font-size:2.5rem;letter-spacing:-.04em;font-weight:600;margin:14px 0}.tracking-hero p{font-size:.87rem;opacity:.75;line-height:1.6}.steps{display:flex;gap:5px;margin:24px 0 0}.steps span{height:5px;border-radius:4px;background:#ffffff20;flex:1}.steps span.done{background:#b8e8ce}.map{width:100%;height:250px;border:0;border-radius:20px;background:var(--sage)}.detail-list{display:grid;gap:12px}.detail-list .item-line{border-bottom:1px solid var(--line)}.check-row{display:flex;align-items:center;gap:12px;font-weight:500;line-height:1.5}.check-row input{width:22px;height:22px;accent-color:var(--forest)}.screen-note{margin-bottom:18px}.live{color:var(--forest);font-size:.78rem}.gps{display:flex;align-items:center;gap:8px}
@media(max-width:650px){.appbar{height:68px;padding:0 16px;gap:12px}.app-context{font-size:.73rem}.brand{font-size:1.3rem;gap:8px}.brand-icon{width:36px;height:36px}main{padding:94px 16px 110px}.page-head h1{font-size:1.7rem}.order-grid{grid-template-columns:1fr}.rider-grid{grid-template-columns:1fr}.stat{padding:14px;border-radius:20px}.stat strong{font-size:1.65rem}.stat span{font-size:.68rem}.card{padding:18px}.menu-item{padding:15px}.menu-grid{gap:10px}.menu-item .row{gap:6px}.menu-item h3{font-size:.9rem;line-height:1.5}.menu-item .price{font-size:.83rem}.quantity{gap:1px}.quantity button{width:28px;height:28px}.menu-item .material-symbols-rounded{font-size:19px}.tracking-hero{padding:25px}.eta{font-size:2.1rem}.payment-options{flex-direction:column}.modal-head h2{font-size:1.25rem}.order-card .customer{max-width:200px}}
.card-title{flex-wrap:wrap}
@media(max-width:360px){.menu-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
