*{box-sizing:border-box}body{margin:0;background:#f4f2ed;color:#25251f;font-family:Arial,sans-serif}header{background:#171713;color:white;display:flex;align-items:center;padding:20px 28px;gap:24px;flex-wrap:wrap}.brand{font-size:22px;color:#ffbe36}.brand small{display:block;font-size:10px;letter-spacing:3px;color:#b4b4a6;margin:6px 0 0 35px}nav{display:flex;gap:8px;flex:1}button{cursor:pointer;border:1px solid #dddcd2;border-radius:12px;padding:15px 18px;background:white;color:inherit;font-size:15px;font-weight:700;min-height:52px}button:disabled{opacity:.35;cursor:not-allowed}nav button{background:transparent;color:#bcbcaf;border:0}nav button.active,.primary{background:#ffb626;color:#211e15;border-color:#ffb626}main{padding:28px;max-width:1600px;margin:auto}h1{font-size:30px;margin:0 0 8px}h2{font-size:20px}p{color:#737368;line-height:1.5}.eyebrow{color:#9a6708;font-size:11px;letter-spacing:2px;font-weight:800}.layout{display:grid;grid-template-columns:1fr 390px;gap:24px}.panel,.card{background:white;border:1px solid #e1e0d7;border-radius:18px;padding:22px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.product{text-align:left;display:flex;flex-direction:column;gap:12px;min-height:118px}.product .emoji{font-size:28px}.product strong{font-size:19px}.product small{color:#78786e}.toolbar,.actions{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}.selected{border:2px solid #d98b00;background:#fff4d9}.muted{font-size:13px;color:#77776b}.total{font-size:32px;font-weight:800}.line{padding:15px 0;border-bottom:1px solid #e5e5dc;display:flex;gap:12px;justify-content:space-between}.danger{color:#a43225;background:#fff0ed;border-color:#efc8c1}.badge{display:inline-block;padding:6px 9px;border-radius:7px;background:#f0efe8;font-size:12px;font-weight:700}.warning{background:#fff1cf;color:#795515;padding:12px;border-radius:10px}.columns{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.columns section>h2{display:flex;justify-content:space-between}.order{margin:12px 0;padding:20px;background:white;border-radius:16px;border:1px solid #deddd4}.order .number{font-size:30px;font-weight:800}.order p{margin:8px 0}.availability{display:flex;align-items:center;justify-content:space-between;gap:10px}.good{background:#eaf5e9;color:#286c36}input,select,textarea{width:100%;padding:15px;border:1px solid #cecec2;border-radius:10px;font-size:17px;margin:8px 0}label{display:block;font-weight:700;margin-top:12px}dialog{border:0;border-radius:20px;width:min(680px,95vw);max-height:92vh;padding:26px}dialog::backdrop{background:#0009}.checks{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.checks label{margin:0}.checks input{width:auto}.receipt{font-family:monospace;color:black;background:white}.receipt h1{text-align:center}.receipt .ticket{font-size:44px;font-weight:bold;text-align:center}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#25251f;color:white;padding:16px 24px;border-radius:12px;display:none;z-index:9}.empty{padding:35px;text-align:center;color:#8c8c7e}aside{align-self:start;position:sticky;top:20px}.full{width:100%}.sectiontitle{margin-top:26px}.metric{font-size:30px;font-weight:800}@media(max-width:1000px){.layout{grid-template-columns:1fr 330px}.grid{grid-template-columns:repeat(2,1fr)}header{padding:16px}main{padding:18px}#clock{display:none}}@media(max-width:720px){.layout,.columns{grid-template-columns:1fr}aside{position:static}nav{flex-wrap:wrap;gap:0}nav button{padding:12px}.grid{grid-template-columns:repeat(2,1fr)}h1{font-size:25px}}
/* Identidade Pão no Grau */
body{background:#11100e;color:#f6f2e8}header{background:#080807;border-bottom:3px solid #ffac12;box-shadow:0 5px 25px #0008}.brand{width:220px;height:105px;font-size:0;background-image:url('marca-cardapio.jpg');background-size:340px 510px;background-position:0 -2px;background-repeat:no-repeat;position:relative}.brand b,.brand small{display:none}.brand:after{content:'BALCÃO • PEDIDOS';position:absolute;bottom:0;left:15px;right:0;background:#080807;color:#ffbf35;font:bold 10px Arial;letter-spacing:3px;padding:6px}nav button{color:#dfd6c5}nav button.active{background:#f5ac12;color:#17100b;box-shadow:0 3px 0 #9c5300}main{background:radial-gradient(ellipse at 0 0,#f6a5190b,transparent 55%)}h1{color:#ffbc28;font-weight:900;letter-spacing:-1px}h2,h3{color:#fff1d6}.eyebrow{color:#ff684b}.panel,.card,.order{background:#1c1a16;border-color:#51402a;box-shadow:0 6px 18px #0002}.product{background:linear-gradient(145deg,#26221b,#191712);border:1px solid #66502b;color:#fff6e7;border-radius:15px;box-shadow:0 4px 0 #080706}.product:hover{border-color:#ffb626;background:#30271a}.product .emoji{background:#ffaf171a;border-radius:12px;padding:9px;width:54px;text-align:center}.product strong{color:#ffbc28;font-size:22px}.product small,p,.muted{color:#bcb2a0}button{background:#302a21;border-color:#65513a;color:#fff4df}.selected{background:#9f251c;border-color:#ff7056;color:white}.primary{background:#ffb626;color:#201607;border-color:#ffb626;box-shadow:0 3px 0 #9c5300}.primary:hover{background:#ffcb56}.line{border-color:#493e2d}.total{color:#ffbf35}.danger{background:#4a1c17;color:#ffb6a4;border-color:#9e3d2e}.good{background:#203b26;color:#abe3ad;border-color:#3f6d48}.badge{background:#423323;color:#ffd48e}.warning{background:#4a3618;color:#ffe0a0}.empty{color:#b0a184}dialog{background:#1c1a16;color:#fff1dd;border:1px solid #8b6630}input,select,textarea{background:#302a22;color:#fff5e7;border-color:#776043}.columns section>h2{padding:15px;background:#981f18;border-radius:12px;border-left:5px solid #ffb626}.columns section:nth-child(2)>h2{background:#735015}.columns section:nth-child(3)>h2{background:#25492d}#toast{background:#ffb626;color:#24180b;font-weight:bold}@media(max-width:1000px){.brand{width:190px;height:95px;background-size:300px 450px}.brand:after{font-size:9px}}@media(max-width:720px){header{gap:12px}.brand{width:100%;height:98px;background-size:310px 465px}.brand:after{left:16px;width:205px}nav{width:100%}}
.brand-hero{width:100%;aspect-ratio:3.15;background:url('marca-cardapio.jpg') center top/100% auto no-repeat;border-bottom:3px solid #ffb626;border-radius:18px;max-height:290px;margin-bottom:24px}.brand{background:none;width:auto;height:auto;font-size:24px;transform:skew(-5deg)}.brand b{display:inline;color:#fff;font-family:Impact,'Arial Black',sans-serif;font-size:32px;letter-spacing:1px}.brand small{display:block;color:#ffb626;font-size:10px;margin:3px 0;letter-spacing:3px}.brand:after{display:none}h1,.columns h2{font-family:Impact,'Arial Black',sans-serif;text-transform:uppercase;letter-spacing:1px}nav button.active{background:#b72519;color:#fff;border-bottom:3px solid #ffb626}.product{border-radius:8px;border-left:4px solid #ffb626}.product b{font-family:'Arial Black',Arial,sans-serif;text-transform:uppercase;font-size:16px}.selected{background:#b72519;color:white}.primary{background:linear-gradient(110deg,#ffae13,#ffcf3e)}.panel{border-radius:10px}@media(max-width:720px){.brand{width:auto;height:auto}.brand b{font-size:26px}.brand-hero{border-radius:8px;margin-bottom:16px}}

/* Marca oficial: vermelho vivo, preto, branco e amarelo */
:root{--brand-red:#df221b;--brand-yellow:#ffc329}body{background:#100d0c}header{background:linear-gradient(105deg,#b91b16,#e72b20 65%,#c51d17);border-bottom:4px solid #ffc329;padding:14px 24px}.brand{display:flex;align-items:center;gap:12px;transform:none;min-width:240px}.brand-mascot{display:block;flex:none;width:78px;height:78px;border-radius:50%;border:3px solid #ffc329;background:#090807 url('marca-cardapio.jpg') -155px -3px/390px 585px no-repeat;box-shadow:0 3px 0 #760f0c}.brand-wordmark b{display:block;color:white;font:italic 30px Impact,'Arial Black',sans-serif;letter-spacing:.5px;text-shadow:2px 3px 0 #640b08}.brand-wordmark em{display:block;color:#ffc329;font-style:italic;font-size:27px;line-height:1}.brand small{color:#fff5df;letter-spacing:2px;margin-top:8px}nav button{color:white;background:#0002;border:1px solid #ffffff25}nav button.active{background:#110e0c;color:#ffc329;border:1px solid #ffc329;border-bottom:3px solid #ffc329}nav button:hover{background:#150f0d;color:#ffc329}.brand-hero{aspect-ratio:5;max-height:210px;background-color:#0b0807;border:1px solid #76221a;border-bottom:4px solid #df221b;border-radius:12px;background-position:left top}.panel,.card,.order{background:#211815;border-color:#654031}.product{background:linear-gradient(140deg,#35221b,#1b1411);border-color:#6b3c2d;border-left:4px solid #e82a20;border-radius:12px}.product:hover{background:#44231c;border-color:#ffc329}.selected{background:#df221b;border-color:#ffc329;box-shadow:0 0 0 1px #ffc329}.primary{background:#ffc329;color:#21120b;border-color:#ffc329;box-shadow:0 3px 0 #a86400}.eyebrow{color:#ff775e}h1{color:#ffc329}.columns section>h2{background:#bd2119}input:focus,select:focus,textarea:focus,button:focus-visible{outline:3px solid #ffc329;outline-offset:3px}dialog{background:#211815;border-color:#a4412e}button{min-height:54px}@media(max-width:1000px){header{gap:16px;padding:14px}.brand{min-width:210px}.brand-wordmark b{font-size:25px}.brand-wordmark em{font-size:24px}}@media(max-width:720px){.brand{width:100%;justify-content:center}.brand-mascot{width:70px;height:70px;background-size:355px 533px;background-position:-141px -3px}.brand-hero{aspect-ratio:3.15}nav{gap:6px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}nav button{font-size:13px;padding:10px 6px}main{padding:14px}}

/* Fundo preto solicitado pela marca */
body,main{background:#000}header{background:#000;border-bottom-color:#df221b}.panel,.card,.order,dialog{background:#0b0b0b;border-color:#363636}.product{background:#111;border-color:#383838;border-left-color:#df221b}.product:hover{background:#1c1c1c;border-color:#ffc329}button{background:#181818;border-color:#444}input,select,textarea{background:#151515;border-color:#555}.line{border-color:#333}.badge{background:#262626;color:#ffc329}.brand-hero{background-color:#000;border-color:#333;border-bottom-color:#df221b}.selected{background:#df221b;border-color:#ffc329}.primary,.primary:hover{background:#ffc329;color:#111;border-color:#ffc329}nav button{background:#111;color:#fff;border-color:#333}nav button.active{background:#df221b;color:#fff;border-color:#ffc329}p,.muted,.product small{color:#c5c5c5}

.brand-mascot{background:#000 url('logo-oficial.jpg') center/contain no-repeat;border:0;box-shadow:none;width:86px;height:86px;border-radius:0}.brand-hero{position:relative;background:#000 url('logo-oficial.jpg') 20px center/auto 100% no-repeat;aspect-ratio:auto;height:160px;max-height:none;border:0;border-bottom:2px solid #df221b;display:flex;align-items:center;padding-left:190px}.brand-hero:after{content:'PÃO NO GRAU';color:#ffc329;font:italic 42px Impact,'Arial Black',sans-serif;letter-spacing:1px}@media(max-width:720px){.brand-mascot{width:76px;height:76px;background:#000 url('logo-oficial.jpg') center/contain no-repeat}.brand-hero{height:125px;background-position:0 center;padding-left:130px}.brand-hero:after{font-size:27px}}

.delivery-summary{border:2px solid #ffc329;margin:16px 0}.delivery-summary .eyebrow{color:#ffc329}.delivery-summary p{white-space:pre-wrap}

/* Logo circular: recorte do entorno preto da imagem original */
.brand-mascot{border-radius:50%;background-color:#f00;background-image:url('logo-oficial.jpg');background-size:135% 135%;background-position:54% 50%;background-repeat:no-repeat;width:78px;height:78px}@media(max-width:720px){.brand-mascot{width:70px;height:70px;background-size:135% 135%;background-position:54% 50%}}

.moto-banner.brand-hero{background:#000;display:block;height:190px;padding:0;overflow:hidden;border:0;border-bottom:2px solid #e5221b;isolation:isolate}.moto-banner:after{display:none}.moto-run{position:absolute;width:440px;height:174px;bottom:12px;left:0;animation:moto-drive 13s linear infinite;will-change:transform}.moto-rider{position:absolute;right:0;bottom:0;width:190px;height:170px;object-fit:contain;animation:moto-bounce .55s ease-in-out infinite alternate}.moto-trail{position:absolute;left:0;bottom:8px;width:275px;height:110px}.moto-trail b{position:absolute;right:20px;top:10px;font:italic 32px Impact,'Arial Black',sans-serif;color:white;line-height:1;text-shadow:2px 3px #d8221c;z-index:2}.moto-trail em{color:#ffc329;font-size:36px}.moto-trail i{position:absolute;border-radius:50%;width:120px;height:60px;background:radial-gradient(ellipse,#c6c6c65c,transparent 70%);filter:blur(4px);left:15px;bottom:0;animation:moto-smoke 1.8s ease-out infinite}.moto-trail i:nth-child(2){left:85px;bottom:28px;animation-delay:-.6s}.moto-trail i:nth-child(3){left:155px;bottom:8px;animation-delay:-1.2s}.moto-road{position:absolute;bottom:6px;left:0;width:100%;height:2px;background:linear-gradient(90deg,transparent,#e5221b,#ffc329,transparent)}@keyframes moto-drive{0%{transform:translateX(-450px)}100%{transform:translateX(calc(100vw + 100px))}}@keyframes moto-bounce{to{transform:translateY(-3px) rotate(-1deg)}}@keyframes moto-smoke{0%{opacity:.7;transform:translateX(30px) scale(.65)}100%{opacity:0;transform:translateX(-55px) scale(1.6)}}@media(max-width:720px){.moto-banner.brand-hero{height:155px}.moto-run{width:330px;height:140px;animation-duration:10s}.moto-rider{width:150px;height:135px}.moto-trail{width:205px;height:95px}.moto-trail b{font-size:24px;right:10px}.moto-trail em{font-size:27px}}@media(prefers-reduced-motion:reduce){.moto-run{animation:none;left:50%;transform:translateX(-50%)}.moto-rider,.moto-trail i{animation:none}.moto-trail i{opacity:.3}}
/* Fumaça parte do escapamento e revela o nome no rastro */
.moto-trail{bottom:12px;height:110px}.moto-trail:after{content:'';position:absolute;right:0;bottom:14px;width:95px;height:22px;border-radius:50%;background:radial-gradient(ellipse,#dedede85,transparent 72%);transform:rotate(-12deg);filter:blur(3px);animation:exhaust-pulse .65s ease-out infinite}.moto-trail i{left:auto;right:0;bottom:15px;width:130px;height:65px;animation:exhaust-cloud 2.1s ease-out infinite}.moto-trail i:nth-child(2){left:auto;right:0;bottom:15px;animation-delay:-.7s}.moto-trail i:nth-child(3){left:auto;right:0;bottom:15px;animation-delay:-1.4s}.moto-trail b{color:#f7f7f7;text-shadow:0 0 9px #ffffff60;animation:smoke-name 13s linear infinite}.moto-trail em{color:#ffe5aa;text-shadow:0 0 12px #ffc32970}@keyframes exhaust-pulse{0%{opacity:.9;transform:translateX(8px) rotate(-12deg) scale(.4)}100%{opacity:0;transform:translateX(-45px) translateY(-7px) rotate(-12deg) scale(1.3)}}@keyframes exhaust-cloud{0%{opacity:.65;transform:translate(20px,12px) scale(.3)}100%{opacity:0;transform:translate(-210px,-48px) scale(1.9)}}@keyframes smoke-name{0%,8%{opacity:0;filter:blur(13px);clip-path:inset(0 0 0 100%);transform:translateX(22px)}22%{opacity:.65;filter:blur(6px);clip-path:inset(0 0 0 38%);transform:translateX(8px)}35%,78%{opacity:1;filter:blur(0);clip-path:inset(0);transform:translateX(0)}100%{opacity:0;filter:blur(10px);clip-path:inset(0);transform:translateX(-25px)}}@media(max-width:720px){.moto-trail b{animation-duration:10s}}@media(prefers-reduced-motion:reduce){.moto-trail b,.moto-trail:after,.moto-trail i{animation:none}.moto-trail b{opacity:1;filter:none;clip-path:none;transform:none}}
/* Fumaça visível e passagem mais lenta */
.moto-run{animation-duration:18s;animation-delay:-4s}.moto-trail:after{width:130px;height:38px;right:-12px;bottom:12px;background:radial-gradient(ellipse,#fff 0%,#eeeeeed9 25%,#dddddd70 52%,transparent 76%);filter:blur(2px);animation:exhaust-visible .9s ease-out infinite}.moto-trail i{width:160px;height:95px;background:radial-gradient(ellipse,#f5f5f5e6 0%,#dededeaa 30%,#bbbbbb44 56%,transparent 74%);filter:blur(2px);animation:exhaust-visible-cloud 2.8s ease-out infinite;z-index:0}.moto-trail i:nth-child(2){animation-delay:-.9s}.moto-trail i:nth-child(3){animation-delay:-1.8s}.moto-trail b{z-index:3;animation-duration:18s;animation-delay:-4s;text-shadow:2px 2px 3px #000,0 0 12px #fff}.moto-trail em{color:#ffc329;text-shadow:2px 2px 3px #000}@keyframes exhaust-visible{0%{opacity:1;transform:translate(12px,4px) scale(.55)}100%{opacity:.15;transform:translate(-85px,-15px) scale(1.5)}}@keyframes exhaust-visible-cloud{0%{opacity:1;transform:translate(25px,12px) scale(.4)}45%{opacity:.9}100%{opacity:0;transform:translate(-235px,-38px) scale(1.8)}}@media(max-width:720px){.moto-run{animation-duration:15s;animation-delay:-3s}.moto-trail b{animation-duration:15s;animation-delay:-3s}.moto-trail i{width:125px;height:75px}}@media(prefers-reduced-motion:reduce){.moto-run,.moto-trail b,.moto-trail:after,.moto-trail i{animation:none}.moto-trail i{opacity:.55}}
/* Jato de fogo de maçarico no escapamento */
.moto-trail:after{right:-12px;bottom:12px;width:160px;height:34px;border-radius:70% 20% 20% 70%;background:linear-gradient(90deg,transparent 0%,#ef2d00 15%,#ff7b00 42%,#ffd22d 75%,#fffbe0 96%);filter:drop-shadow(0 0 10px #ff6000);transform-origin:right center;animation:torch-jet .16s ease-in-out infinite alternate;clip-path:polygon(100% 30%,85% 15%,70% 28%,54% 0%,40% 24%,15% 8%,0% 50%,24% 77%,43% 69%,58% 100%,74% 72%,90% 85%,100% 66%)}.moto-trail i{width:150px;height:56px;border-radius:65% 15% 15% 65%;background:linear-gradient(90deg,transparent,#e52b0099 20%,#ff6500ee 48%,#ffd834 78%,#fff1a0);filter:blur(1px) drop-shadow(0 0 8px #ff5200);animation:torch-flare .8s ease-out infinite;clip-path:polygon(100% 32%,78% 12%,60% 25%,35% 0%,0% 50%,29% 83%,56% 70%,77% 97%,100% 65%)}.moto-trail i:nth-child(2){animation-delay:-.27s}.moto-trail i:nth-child(3){animation-delay:-.54s}.moto-trail b{color:#fff3d0;text-shadow:0 0 7px #ff8b00,0 0 18px #ef3100,2px 2px #4b1000}.moto-trail em{color:#ffc329;text-shadow:0 0 9px #ff5600,2px 2px #4b1000}@keyframes torch-jet{from{opacity:.9;transform:scaleX(.8) scaleY(.85)}to{opacity:1;transform:scaleX(1.18) scaleY(1.15)}}@keyframes torch-flare{0%{opacity:1;transform:translate(18px,12px) scale(.5)}100%{opacity:0;transform:translate(-125px,-5px) scale(1.6)}}@media(prefers-reduced-motion:reduce){.moto-trail:after,.moto-trail i{animation:none}.moto-trail:after{opacity:1}.moto-trail i{opacity:.4}}
