@font-face{font-family:Bowlby;src:url(fontes/bowlby-one-latin-400-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:Familjen;src:url(fontes/familjen-grotesk-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Familjen;src:url(fontes/familjen-grotesk-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}
:root{--amarelo:#f6bd16;--papel:#fff6dc;--tinta:#24140a;--suave:#5e4a38;--tomate:#b92d14;--rio:#0a5a6e;--linha:#d9c79a}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:4rem;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{margin:0;background:var(--papel);color:var(--tinta);font:400 1.0625rem/1.45 Familjen,system-ui,sans-serif;overflow-wrap:break-word}
[hidden]{display:none!important}
h1,h2,h3{font-family:Bowlby,Familjen,sans-serif;font-weight:400;line-height:1.1;margin:0}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:3px solid var(--rio);outline-offset:2px}
.so-leitor{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.faixa{display:flex;flex-wrap:wrap;gap:.3rem 1rem;align-items:center;justify-content:space-between;background:var(--tinta);color:#fff;padding:.4rem clamp(1rem,4vw,3rem);font-size:.95rem}
.faixa p{margin:0}
.faixa button{background:transparent;color:#fff;border:1px solid #fff;border-radius:4px;padding:.25rem .7rem;min-height:40px}
.faixa button:focus-visible{outline-color:var(--amarelo)}
.toldo{height:44px;background:repeating-linear-gradient(90deg,var(--tomate) 0 44px,#fff6dc 44px 88px);border-bottom:6px solid var(--tinta);-webkit-mask:radial-gradient(22px at 22px 22px,#000 98%,transparent) 0 22px/44px 44px repeat-x,linear-gradient(#000,#000) 0 0/100% 22px no-repeat;mask:radial-gradient(22px at 22px 22px,#000 98%,transparent) 0 22px/44px 44px repeat-x,linear-gradient(#000,#000) 0 0/100% 22px no-repeat;border-bottom:0;margin-bottom:-22px;position:relative;z-index:1}
.placa{background:var(--amarelo);display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:1rem;padding:calc(22px + clamp(1.2rem,3vw,2.4rem)) clamp(1rem,4vw,3rem) clamp(1.2rem,3vw,2.2rem)}
.placa h1{font-size:clamp(3rem,13vw,8.4rem);letter-spacing:-.01em;line-height:.95}
.placa p{font-size:1.2rem;max-width:44ch;margin:.7rem 0 .5rem}
.ir-cozinha{display:inline-block;color:var(--tinta);font-weight:700;padding:.5rem 0}
.peixe{width:clamp(120px,26vw,330px);height:auto}
.categorias{position:sticky;top:0;z-index:5;display:flex;flex-wrap:wrap;gap:.2rem .3rem;background:var(--tinta);padding:.3rem clamp(1rem,4vw,3rem)}
.categorias a{color:#fff6dc;font-weight:700;text-decoration:none;padding:.4rem .7rem;border-radius:4px;min-height:40px;display:flex;align-items:center}
.categorias a:hover{background:var(--tomate)}
.categorias a:focus-visible{outline-color:var(--amarelo)}
.salao-grade{display:grid;grid-template-columns:minmax(0,1fr) 370px;gap:2.2rem;padding:clamp(1.2rem,3vw,2.4rem) clamp(1rem,4vw,3rem);align-items:start}
.menu section{margin-bottom:2.2rem;scroll-margin-top:4rem}
.menu h2{font-size:clamp(1.8rem,4vw,2.7rem);color:var(--tomate);margin-bottom:.4rem}
.prato{display:block;width:100%;text-align:left;background:none;border:0;border-bottom:2px solid var(--linha);padding:.7rem .2rem;min-height:48px}
.prato:hover{background:#ffecb5}
.prato .topo-prato{display:flex;align-items:baseline;gap:.4rem;font-weight:700;font-size:1.2rem}
.prato .pontos{flex:1;border-bottom:3px dotted var(--tinta);min-width:1rem;transform:translateY(-.2em)}
.prato small{display:block;color:var(--suave);font-size:1rem;max-width:58ch}
.pedido{position:sticky;top:4rem;background:#fff;border:3px solid var(--tinta);padding:1rem;max-height:calc(100vh - 5rem);overflow-y:auto}
.pedido h2{font-size:1.5rem}
.pedido .acomp{margin-top:1.4rem;padding-top:1rem;border-top:3px solid var(--tinta)}
.vazio{color:var(--suave);margin:.5rem 0}
.item{padding:.55rem 0;border-bottom:1px solid var(--linha)}
.item p{margin:0}
.item .l1{display:flex;justify-content:space-between;gap:.6rem;font-weight:700}
.item small{display:block;color:var(--suave);font-size:.95rem}
.item .acoes{display:flex;gap:.3rem;margin-top:.3rem;align-items:center}
.item button{min-width:44px;min-height:44px;background:#fff;border:2px solid var(--tinta);border-radius:4px;font-weight:700;padding:0 .5rem}
.item button:hover{background:#ffecb5}
.soma{display:flex;justify-content:space-between;font-weight:700;font-size:1.3rem;padding:.6rem 0 0}
label{display:block;font-weight:700;margin:.7rem 0 .2rem}
input,select,textarea{width:100%;min-height:46px;padding:.45rem .6rem;border:2px solid var(--tinta);border-radius:4px;background:#fff}
.erro{color:var(--tomate);font-weight:700;margin:.5rem 0 0}
.erro:empty{display:none}
.nota{font-size:.95rem;color:var(--suave);margin:.5rem 0 0}
.botao-tomate{display:block;width:100%;min-height:52px;margin-top:.7rem;background:var(--tomate);color:#fff;border:0;border-radius:4px;font-family:Bowlby,Familjen,sans-serif;font-size:1.05rem;padding:.4rem 1rem}
.botao-tomate:hover{background:var(--tinta)}
.botao-claro{min-height:52px;background:#fff;border:2px solid var(--tinta);border-radius:4px;font-weight:700;padding:.4rem .8rem}
.status{padding:.6rem 0;border-bottom:1px solid var(--linha)}
.status p{margin:0;font-weight:700}
.etapas{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;list-style:none;margin:.4rem 0 0;padding:0}
.etapas li{font-size:.85rem;text-align:center;padding:.25rem .05rem;background:#f4ebd0;color:var(--suave)}
.etapas li.feita{background:var(--amarelo);color:var(--tinta);font-weight:700}
.etapas li.atual{background:var(--rio);color:#fff;font-weight:700}
.barra-pedido{display:none}
dialog{border:3px solid var(--tinta);border-radius:0;padding:1.1rem;width:min(92vw,500px);max-height:90vh;background:var(--papel);color:var(--tinta)}
dialog::backdrop{background:rgb(36 20 10 / .6)}
dialog h2{font-size:1.7rem;color:var(--tomate)}
dialog p{margin:.3rem 0 .6rem}
.qtd{display:flex;align-items:center;gap:.8rem;margin-bottom:.6rem}
.qtd button{width:48px;height:48px;font-size:1.5rem;font-weight:700;border:2px solid var(--tinta);background:#fff;border-radius:4px}
.qtd output{font-weight:700;font-size:1.4rem;min-width:2ch;text-align:center}
fieldset{border:0;padding:0;margin:0}
legend{font-weight:700;padding:0;margin-bottom:.2rem}
.adic{display:flex;align-items:center;gap:.55rem;font-weight:400;margin:0;min-height:44px;cursor:pointer}
.adic input{width:24px;height:24px;min-height:0;flex:none;accent-color:var(--tomate)}
.adic span:last-child{margin-left:auto;font-weight:700;white-space:nowrap}
.d-acoes{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:.5rem;align-items:end;margin-top:.7rem}
.d-acoes .botao-tomate{margin:0}
.como{background:var(--rio);color:#fff;padding:clamp(1.6rem,4vw,3rem) clamp(1rem,4vw,3rem)}
.como h2{font-size:clamp(1.6rem,3.6vw,2.4rem)}
.como-col{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:1.4rem 2rem;margin-top:1rem}
.como h3{font-family:Familjen,sans-serif;font-weight:700;font-size:1.15rem;color:#ffdc6b;margin-bottom:.3rem}
.como p{margin:0;max-width:60ch}
.rodape{color:var(--tinta);display:flex;flex-wrap:wrap;gap:.2rem 1.5rem;justify-content:space-between;padding:.8rem clamp(1rem,4vw,3rem);background:var(--amarelo)}
.rodape p{margin:0}
.rodape a{color:var(--tinta);font-weight:700;display:inline-block;padding:.45rem 0}
/* Cozinha: trilho de comandas em fundo escuro, para ler de longe */
body.cozinha{background:#20302f;color:#fff}
.coz-topo{display:flex;flex-wrap:wrap;gap:.3rem 1.6rem;align-items:baseline;padding:1rem clamp(1rem,3vw,2rem) .4rem}
.coz-topo h1{font-size:clamp(1.6rem,4vw,2.6rem);color:var(--amarelo)}
.coz-topo p{margin:0;font-weight:700}
.coz-topo a{color:#fff;margin-left:auto;padding:.45rem 0}
.cozinha :focus-visible{outline-color:var(--amarelo)}
.trilhos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem;padding:.8rem clamp(1rem,3vw,2rem) 2rem;align-items:start;min-height:50vh}
.trilho h2{font-size:1.25rem;border-bottom:8px solid var(--amarelo);padding-bottom:.4rem;display:flex;justify-content:space-between;gap:.4rem;margin-bottom:.7rem}
.trilho[data-etapa=preparando] h2{border-color:#f28b4b}
.trilho[data-etapa=pronto] h2{border-color:#7dd6a8}
.trilho[data-etapa=entregue] h2{border-color:#b9c6c4}
.trilho .nada{color:#d7e0de;margin:0}
.comanda{background:var(--papel);color:var(--tinta);padding:.75rem;margin-bottom:.7rem;border-top:6px solid var(--tinta)}
.comanda.nova{animation:chega 1.2s ease-out}
@keyframes chega{0%{transform:translateY(-14px);box-shadow:0 0 0 6px var(--amarelo)}100%{transform:none;box-shadow:0 0 0 0 transparent}}
.comanda .cab{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.2rem .6rem;font-weight:700}
.comanda .cab b{font-family:Bowlby,sans-serif;font-weight:400;font-size:1.2rem}
.comanda ul{list-style:none;margin:.45rem 0;padding:0}
.comanda li{padding:.2rem 0;border-top:1px dashed #a8956c}
.comanda small{display:block;font-size:.95rem}
.comanda .obs{font-weight:700;color:#8f2410}
.comanda .acoes{display:flex;flex-wrap:wrap;gap:.3rem}
.comanda button{min-height:46px;border-radius:4px;font-weight:700;padding:.2rem .6rem;border:2px solid var(--tinta);background:#fff}
.comanda button.segue{background:var(--tinta);color:#fff;flex:1}
.comanda button.segue:hover{background:var(--tomate)}
.comanda button:focus-visible{outline-color:var(--rio)}
.atraso{color:#8f2410}
@media (max-width:960px){
  .salao-grade{grid-template-columns:minmax(0,1fr)}
  .pedido{position:static;max-height:none}
  .barra-pedido{display:block;position:fixed;left:0;right:0;bottom:0;z-index:6;background:var(--tomate);color:#fff;font-weight:700;text-align:center;padding:.9rem 1rem;text-decoration:none}
  .barra-pedido[hidden]{display:none!important}
  .barra-pedido:focus-visible{outline-color:#fff;outline-offset:-5px}
  body.tem-itens .rodape{padding-bottom:4.4rem}
  .trilhos{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:560px){
  .placa{grid-template-columns:minmax(0,1fr)}
  .peixe{position:absolute;right:.6rem;width:92px;opacity:1;margin-top:-.2rem;display:none}
  .trilhos{grid-template-columns:minmax(0,1fr)}
  .categorias a{padding:.35rem .5rem}
  .coz-topo a{margin-left:0}
}