/* TOASTED menu: one list going down the page, like the board over their counter. Heavy uppercase Archivo Black
   headings, prices in the same heavy type, a square black + on every line (the home page's add block), the
   category bar as the black header strip with marigold for where you are. Order layer coloured to match. */
:root{--o-accent:#111111;--o-on-accent:#FFFFFF;--o-ink:#111111;--o-muted:rgba(17,17,17,.7);--o-bg:#FFFFFF;--o-line:rgba(17,17,17,.14);--o-font:Archivo,system-ui,sans-serif}

.menu-head{background:var(--ink);color:#fff;padding-block:48px 36px}
.menu-head h1{font-size:clamp(52px,15vw,120px);color:var(--gold)}
.menu-head p{margin-top:14px;color:rgba(255,255,255,.85)}
.menu-head .ue{margin-top:10px;font-weight:700}
.menu-head .ue a{min-height:44px;display:inline-flex;align-items:center;color:#fff;text-underline-offset:4px}

.jump-bar{position:sticky;top:var(--head-h);z-index:15;background:var(--ink);border-top:1px solid rgba(255,255,255,.14)}
.jump{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none}
.jump::-webkit-scrollbar{display:none}
.jump a{flex:none;min-height:46px;display:inline-flex;align-items:center;padding:0 12px;color:rgba(255,255,255,.78);text-decoration:none;font:700 13px/1 var(--body);font-stretch:80%;letter-spacing:.08em;text-transform:uppercase}
.jump a.jg{display:none}
.jump a[aria-current]{color:var(--ink);background:var(--gold)}

.menu{padding-top:28px}
.menu .wrap{max-width:820px;display:grid;gap:36px}
.msearch input{width:100%;min-height:52px;border:2px solid var(--ink);border-radius:0;padding:12px 16px;font:500 16px var(--body);background:#fff;color:var(--ink)}
.msearch input:focus{outline:none;box-shadow:0 0 0 3px var(--gold)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
#mcount{margin-top:-26px;font-size:14px;color:var(--muted)}
#menu{display:grid;gap:48px}
.mgroup{scroll-margin-top:130px;padding-top:8px}
.mgroup h2{font:700 14px/1.2 var(--body);font-stretch:80%;letter-spacing:.14em;color:var(--muted)}
.mgroup p{color:var(--muted);font-size:15px;margin-top:6px}
.mcat{scroll-margin-top:130px}
.mcat h3{font:400 clamp(30px,8vw,44px)/1 var(--display);text-transform:uppercase;letter-spacing:-.02em}
.mfig{margin:14px 0 0}
.mph{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
@media (min-width:900px){.mfig{max-width:600px}.mph{aspect-ratio:16/9}.jump{flex-wrap:wrap}}
.mnote{color:var(--muted);font-size:15.5px;margin:12px 0 0}
.mlist{list-style:none;margin:10px 0 0;padding:0}
.mlist li{display:flex;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid var(--line)}
.mlist li div{flex:1;min-width:0}
.mlist b{font-weight:700;font-size:17.5px}
.idesc{display:block;font-size:14.5px;line-height:1.45;color:var(--muted);margin-top:3px}
.iopts{display:block;font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-top:5px}
.sz{font-size:13px;color:var(--muted);font-weight:600}
.dots{display:none}
.mlist .p{font:400 19px/1 var(--display);font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--ink);text-decoration:none}
.mlist .p.ask{font:700 13px/1 var(--body);text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.mnone{padding:24px;border:2px solid var(--ink);text-align:center}
.menu-hours{display:none}

/* The add control: the square black + from the home page */
.o-ctl{margin-left:0}
.o-add{width:44px;height:44px;min-height:44px;padding:0;border:0;border-radius:0;background:var(--ink);color:#fff;font:400 0/1 var(--display)}
.o-add::before{content:"+";font-size:24px}
.o-add:hover{background:var(--gold);color:var(--ink)}
.o-q{width:36px;height:36px;border-radius:0;border:2px solid var(--ink)}
.o-bar>button,.o-bar-b,.o-pay,.o-opt{border-radius:0}
.o-bar-b{background:var(--gold);color:var(--ink)}
.o-sheet{border-radius:0}
.o-f select,.o-f textarea,.o-f input{border-radius:0}
.o-x,.o-back{border-radius:0}
#focaccia .iopts{display:none}
