/* atendeQR — estilos
   Cliente (.cli): cores e fontes vêm do tema de cada restaurante (--c-*, --f-*, --t-*)
   Equipe, gestão e admin (.bo): visual fixo da plataforma (--b-*) */
:root{
  /* tema do restaurante (valores padrão; o app troca pelos do restaurante) */
  --c-escuro:#1d1b19; --c-on-escuro:#ffffff;
  --c-primaria:#2b2724; --c-on-primaria:#ffffff;
  --c-destaque:#e0b45c; --c-on-destaque:#16130f;
  --c-acento:#d9512c; --c-on-acento:#ffffff;
  --c-papel:#f5f2ec; --c-ink:#1f1a15;
  --c-muted:color-mix(in srgb, var(--c-ink) 62%, var(--c-papel));
  --c-line:color-mix(in srgb, var(--c-ink) 13%, var(--c-papel));
  --c-card:color-mix(in srgb, var(--c-papel) 45%, #ffffff);
  --c-escuro-2:color-mix(in srgb, var(--c-escuro) 82%, var(--c-on-escuro));
  --c-escuro-line:color-mix(in srgb, var(--c-escuro) 75%, var(--c-on-escuro));
  --f-titulo:"Barlow Condensed","Arial Narrow",Impact,sans-serif;
  --f-texto:"Barlow",system-ui,-apple-system,"Segoe UI",sans-serif;
  --t-estilo:normal; --t-caixa:uppercase;

  /* plataforma */
  --b-bg:#0B2A33; --b-panel:#123C47; --b-panel-2:#184955; --b-line:#24535F;
  --b-tx:#FBF8F4; --b-mut:#BFD8D5; --b-ac:#FF9F2E; --b-on-ac:#0B2A33; --b-acento:#2EC4B6;
  --ok:#2fae66; --warn:#e9a23b; --crit:#e4572e;
  --f-bo-titulo:"Bricolage Grotesque","Arial Black",system-ui,sans-serif;
  --f-bo-texto:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{min-height:100%}
body{margin:0;font:400 16px/1.45 var(--f-bo-texto);-webkit-font-smoothing:antialiased;background:var(--b-bg);color:var(--b-tx)}
body.cli{background:var(--c-papel);color:var(--c-ink);font-family:var(--f-texto)}
img{max-width:100%;display:block}
svg{width:1.1em;height:1.1em;flex:none}
svg.sprite{position:absolute;width:0;height:0;overflow:hidden}
[hidden]{display:none!important}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none;padding:0}
button:disabled{cursor:default}
button,a{touch-action:manipulation}
input,select,textarea{font:inherit;font-size:16px;color:inherit}
a{color:inherit}
:focus-visible{outline:3px solid var(--b-ac);outline-offset:2px;border-radius:6px}
.cli :focus-visible{outline-color:var(--c-destaque)}
h1,h2,h3{margin:0;line-height:.98;text-wrap:balance;font-family:var(--f-bo-titulo);font-weight:800;font-style:normal;letter-spacing:-0.02em}
.cli h1,.cli h2,.cli h3{font-family:var(--f-titulo);font-style:var(--t-estilo);text-transform:var(--t-caixa)}
.price{font-family:var(--f-bo-titulo);font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.cli .price{font-family:var(--f-titulo)}
.price .c{font-size:.6em}
.tnum{font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------- comuns ---------- */
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translate(-50%,20px);opacity:0;background:#16130f;color:#f5f2ec;padding:13px 18px;border-radius:12px;font-weight:600;font-size:15px;z-index:300;transition:.25s;max-width:calc(100% - 32px);text-align:center;pointer-events:none;box-shadow:0 10px 30px -10px rgba(0,0,0,.5)}
.toast.show{opacity:1;transform:translate(-50%,0)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 3px rgba(47,174,102,.25);flex:none}
.chip{display:inline-flex;align-items:center;gap:6px;font:700 13px/1 var(--f-bo-texto);padding:8px 11px;border-radius:999px}
.ph{display:grid;place-items:center;background:linear-gradient(135deg,var(--c-escuro-2),var(--c-escuro));color:var(--c-destaque)}
.ph svg{width:34%;height:auto;opacity:.75}
.carregando{min-height:60vh;display:grid;place-items:center;color:var(--b-mut);font-weight:600}
.cli .carregando{color:var(--c-muted)}
.erro-tela{min-height:70vh;display:grid;place-items:center;text-align:center;padding:24px}
.erro-tela h1{font-size:40px;text-transform:uppercase;margin-bottom:10px}
.erro-tela p{margin:0 auto;max-width:28em;color:var(--b-mut)}
.cli .erro-tela p{color:var(--c-muted)}

/* logo do restaurante */
.rlogo{display:inline-flex;align-items:center;gap:10px;color:inherit;text-decoration:none;min-width:0}
.rlogo img{max-height:44px;max-width:170px;width:auto;object-fit:contain}
.rlogo.txt{flex-direction:column;align-items:flex-start;gap:3px}
.rlogo.txt b{font-family:var(--f-titulo);font-style:var(--t-estilo);text-transform:var(--t-caixa);font-weight:800;font-size:24px;line-height:.9;letter-spacing:.01em}
.rlogo.txt small{font:700 10px/1 var(--f-texto);letter-spacing:.3em;text-transform:uppercase;opacity:.8}
.bo .rlogo.txt b{font-family:var(--f-bo-titulo);font-style:normal;text-transform:uppercase}
.bo .cli .rlogo.txt b,.bo .placa .rlogo.txt b{font-family:var(--f-titulo);font-style:var(--t-estilo);text-transform:var(--t-caixa)}
.rlogo.grande img{max-height:72px;max-width:240px}
.rlogo.grande.txt b{font-size:38px}

/* logo da plataforma */
.plogo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--b-tx);font:700 23px/1 var(--f-bo-titulo);letter-spacing:-0.045em}
.plogo svg{width:30px;height:30px}
.plogo b{font-weight:800;color:var(--b-ac)}

/* botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 20px;border-radius:14px;font-weight:700;font-size:16px;text-decoration:none;transition:transform .15s,background-color .15s,opacity .15s;white-space:nowrap}
.btn:active{transform:scale(.98)}
.btn:disabled{opacity:.55}
.btn svg{width:20px;height:20px}
.btn.block{width:100%}
.btn.sm{min-height:40px;padding:0 14px;font-size:14px;border-radius:10px}
.bo .btn.pri{background:var(--b-ac);color:var(--b-on-ac)}
.bo .btn.sec{background:var(--b-panel-2);color:var(--b-tx);border:1px solid var(--b-line)}
.bo .btn.ghost{background:transparent;color:var(--b-ac);border:1px solid var(--b-line)}
.bo .btn.perigo{background:transparent;color:#ff8a66;border:1px solid rgba(228,87,46,.45)}
.cli .btn.pri{background:var(--c-primaria);color:var(--c-on-primaria)}
.cli .btn.dest{background:var(--c-destaque);color:var(--c-on-destaque)}
.cli .btn.ghost{background:color-mix(in srgb, var(--c-primaria) 9%, transparent);color:var(--c-primaria)}

/* ============================================================
   CLIENTE
   ============================================================ */
.phone{max-width:480px;margin-inline:auto;min-height:100vh;min-height:100dvh;position:relative;background:var(--c-papel)}
.c-top{background:var(--c-escuro);color:var(--c-on-escuro);padding:calc(18px + env(safe-area-inset-top,0px)) 20px 0;position:relative;overflow:hidden}
.c-top::after{content:"";position:absolute;right:-60px;top:-40px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb, var(--c-acento) 35%, transparent),transparent 70%);pointer-events:none}
.c-top .row{display:flex;justify-content:space-between;align-items:center;gap:12px;position:relative;z-index:1}
.mesa-chip{background:var(--c-destaque);color:var(--c-on-destaque);font:800 20px/1 var(--f-titulo);font-style:var(--t-estilo);padding:8px 12px;border-radius:10px;white-space:nowrap;max-width:50%;overflow:hidden;text-overflow:ellipsis}
.c-hello{padding:24px 0 30px;position:relative;z-index:1}
.c-hello .chip{background:color-mix(in srgb, var(--ok) 18%, transparent);color:color-mix(in srgb, var(--ok) 55%, var(--c-on-escuro));margin-bottom:14px}
.c-hello h1{font-size:44px}
.c-hello h1 span{color:var(--c-destaque)}
.c-hello p{margin:8px 0 0;opacity:.78;font-size:15.5px;max-width:28em}
.c-body{padding:0 16px calc(120px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:14px;margin-top:-14px;position:relative;z-index:2}

.call{display:flex;align-items:center;gap:16px;width:100%;text-align:left;background:var(--c-destaque);color:var(--c-on-destaque);border-radius:22px;padding:20px;box-shadow:0 18px 34px -18px color-mix(in srgb, var(--c-escuro) 80%, transparent);transition:transform .15s}
.call:active{transform:scale(.98)}
.call .ic{width:58px;height:58px;border-radius:16px;background:var(--c-escuro);color:var(--c-destaque);display:grid;place-items:center;flex:none}
.call .ic svg{width:28px;height:28px}
.call small{display:block;font:700 11.5px/1 var(--f-texto);letter-spacing:.16em;text-transform:uppercase;opacity:.7;margin-bottom:6px}
.call b{display:block;font:800 clamp(24px,7.6vw,32px)/1 var(--f-titulo);font-style:var(--t-estilo);text-transform:var(--t-caixa);text-wrap:balance;overflow-wrap:anywhere}
.call>span:nth-child(2){min-width:0}
.call .chev{margin-left:auto;width:22px;height:22px}

.status{border-radius:22px;padding:20px;position:relative;overflow:hidden;display:flex;flex-direction:column;gap:8px;animation:pop .35s ease}
@keyframes pop{from{transform:scale(.96);opacity:0}to{transform:none;opacity:1}}
.status.aberto{background:var(--c-acento);color:var(--c-on-acento)}
.status.atendendo{background:var(--ok);color:#fff}
.status .k{font:700 11.5px/1 var(--f-texto);letter-spacing:.16em;text-transform:uppercase;opacity:.88;display:flex;align-items:center;gap:8px}
.status .k .pulse{width:9px;height:9px;border-radius:50%;background:currentColor;animation:pulse 1.2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb, currentColor 70%, transparent)}100%{box-shadow:0 0 0 12px transparent}}
.status h2{font-size:34px}
.status p{margin:0;font-size:15px;opacity:.92}
.status .row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:6px}
.status .timer{font:700 22px/1 var(--f-titulo);font-variant-numeric:tabular-nums}
.status .cancel{background:rgba(0,0,0,.18);color:inherit;font-weight:700;font-size:14px;padding:10px 14px;border-radius:999px}

.tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tile{background:var(--c-card);border:1px solid var(--c-line);border-radius:18px;padding:16px;text-align:left;display:flex;flex-direction:column;gap:10px;min-height:128px;transition:transform .15s}
.tile:active{transform:scale(.97)}
.tile .ti{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb, var(--c-primaria) 9%, transparent);color:var(--c-primaria)}
.tile .ti svg{width:22px;height:22px}
.tile b{font:800 23px/1 var(--f-titulo);font-style:var(--t-estilo);text-transform:var(--t-caixa);color:var(--c-primaria)}
.tile span{font-size:13.5px;color:var(--c-muted);line-height:1.3}
.tile:disabled{opacity:.55}

.reels-card{position:relative;border-radius:22px;overflow:hidden;background:#111;color:#fff;text-align:left;width:100%;display:block;min-height:176px}
.reels-card .strip{position:absolute;inset:0;display:grid;grid-template-columns:repeat(4,1fr);gap:2px}
.reels-card .strip img{width:100%;height:100%;object-fit:cover}
.reels-card::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,14,10,.92) 0%,rgba(20,14,10,.55) 55%,rgba(20,14,10,.1) 100%)}
.reels-card .in{position:relative;z-index:1;padding:20px;display:flex;flex-direction:column;gap:8px;max-width:72%}
.reels-tag{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;background:var(--c-acento);color:var(--c-on-acento);font:700 11px/1 var(--f-texto);letter-spacing:.12em;text-transform:uppercase;padding:6px 9px;border-radius:6px}
.reels-card h3{font-size:30px}
.reels-card p{margin:0;font-size:14px;color:rgba(255,255,255,.8)}
.reels-card .play{position:absolute;z-index:1;right:18px;bottom:18px;width:52px;height:52px;border-radius:50%;background:var(--c-destaque);color:var(--c-on-destaque);display:grid;place-items:center}
.reels-card .play svg{width:22px;height:22px;margin-left:3px}

.links{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:10px}
.links a{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 6px;border-radius:14px;background:var(--c-card);border:1px solid var(--c-line);text-decoration:none;font-weight:600;font-size:13px;color:var(--c-primaria);text-align:center}
.links svg{width:22px;height:22px}
.fine{text-align:center;font-size:13px;color:var(--c-muted);margin:4px 0 0}
.fine b{color:var(--c-primaria)}
.powered{text-align:center;font-size:11.5px;color:var(--c-muted);opacity:.75;margin:8px 0 0}

/* cardápio */
.m-head{position:sticky;top:0;z-index:20;background:var(--c-escuro);color:var(--c-on-escuro);padding:calc(10px + env(safe-area-inset-top,0px)) 12px 0}
.m-bar{display:flex;align-items:center;gap:10px}
.iconbtn{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;flex:none;background:color-mix(in srgb, currentColor 10%, transparent)}
.iconbtn svg{width:22px;height:22px}
.m-bar h1{font-size:26px;flex:1}
.m-bar .mesa-chip{font-size:16px;padding:7px 10px}
.search{display:flex;align-items:center;gap:8px;background:color-mix(in srgb, var(--c-on-escuro) 10%, transparent);border-radius:12px;padding:0 12px;margin-top:10px}
.search svg{width:18px;height:18px;opacity:.7}
.search input{flex:1;min-width:0;border:0;background:transparent;color:var(--c-on-escuro);height:44px;outline:none}
.search input::placeholder{color:color-mix(in srgb, var(--c-on-escuro) 55%, transparent)}
.cats{display:flex;gap:8px;overflow-x:auto;padding:12px;margin-inline:-12px;scrollbar-width:none}
.cats::-webkit-scrollbar{display:none}
.cat{flex:none;padding:9px 14px;border-radius:999px;font-weight:700;font-size:14px;border:1.5px solid color-mix(in srgb, var(--c-on-escuro) 22%, transparent);color:color-mix(in srgb, var(--c-on-escuro) 88%, transparent);white-space:nowrap;display:inline-flex;align-items:center;gap:5px}
.cat svg{width:14px;height:14px}
.cat.on{background:var(--c-destaque);border-color:var(--c-destaque);color:var(--c-on-destaque)}
.m-list{padding:6px 16px calc(130px + env(safe-area-inset-bottom,0px))}
.m-sec{scroll-margin-top:170px;padding-top:18px}
.m-sec h2{font-size:30px;color:var(--c-primaria);display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.m-sec h2 small{font:600 13px/1.3 var(--f-texto);color:var(--c-muted);text-transform:none;font-style:normal}
.m-note{margin:6px 0 4px;font-size:14px;color:var(--c-muted)}
.item{display:grid;grid-template-columns:92px 1fr;gap:14px;padding:14px 0;border-bottom:1px solid var(--c-line);align-items:start;text-align:left;width:100%;cursor:pointer}
.item .th{position:relative;width:92px;height:92px;border-radius:14px;overflow:hidden}
.item .th img,.item .th .ph{width:100%;height:100%;object-fit:cover}
.item .th .vid{position:absolute;right:6px;bottom:6px;width:24px;height:24px;border-radius:7px;background:rgba(0,0,0,.6);color:#fff;display:grid;place-items:center}
.item .th .vid svg{width:13px;height:13px}
.item .n{font:700 21px/1.05 var(--f-titulo);font-style:var(--t-estilo);color:var(--c-ink)}
.item .d{font-size:14px;color:var(--c-muted);line-height:1.35;margin-top:4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.item .meta{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px}
.item .price{font-size:22px;color:var(--c-primaria)}
.item .serve{font-size:12.5px;color:var(--c-muted);font-weight:600;margin-left:6px}
.add{width:36px;height:36px;border-radius:50%;background:var(--c-primaria);color:var(--c-on-primaria);display:grid;place-items:center;flex:none}
.add svg{width:18px;height:18px}
.qty{display:flex;align-items:center;gap:4px;background:var(--c-primaria);color:var(--c-on-primaria);border-radius:999px;padding:3px}
.qty button{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb, currentColor 14%, transparent)}
.qty button svg{width:15px;height:15px}
.qty span{min-width:20px;text-align:center;font-weight:700}
.tag{display:inline-block;font:700 10.5px/1 var(--f-texto);letter-spacing:.08em;text-transform:uppercase;padding:4px 7px;border-radius:5px;margin-right:6px;vertical-align:2px;font-style:normal;background:var(--c-primaria);color:var(--c-on-primaria)}
.tag.hot{background:var(--c-acento);color:var(--c-on-acento)}
.item.out .th img{filter:grayscale(1);opacity:.5}
.item.out .n,.item.out .price{color:var(--c-muted)}
.esg{display:inline-block;font:700 11px/1 var(--f-texto);letter-spacing:.08em;text-transform:uppercase;color:var(--crit);border:1.5px solid var(--crit);padding:4px 7px;border-radius:5px}
.empty{padding:40px 10px;text-align:center;color:var(--c-muted)}

.bagbar{position:fixed;left:50%;transform:translateX(-50%);bottom:0;width:100%;max-width:480px;z-index:30;padding:10px 12px calc(12px + env(safe-area-inset-bottom,0px));background:linear-gradient(180deg,transparent,var(--c-papel) 30%)}
.bagbar button{width:100%;display:flex;align-items:center;gap:12px;background:var(--c-escuro);color:var(--c-on-escuro);border-radius:18px;padding:14px 16px;box-shadow:0 14px 30px -14px rgba(0,0,0,.6);text-align:left}
.bagbar .cnt{width:34px;height:34px;border-radius:10px;background:var(--c-destaque);color:var(--c-on-destaque);display:grid;place-items:center;font-weight:800;flex:none}
.bagbar .lbl{flex:1;font-weight:700;line-height:1.2}
.bagbar .lbl small{display:block;font-weight:500;opacity:.7;font-size:13px}
.bagbar .price{font-size:22px;color:var(--c-destaque)}

/* folhas (sheets) */
.scrim{position:fixed;inset:0;z-index:100;background:rgba(10,8,6,.58);display:flex;align-items:flex-end;justify-content:center;animation:fade .2s}
@keyframes fade{from{opacity:0}}
.sheet{width:100%;max-width:520px;max-height:92vh;max-height:92dvh;overflow:auto;border-radius:24px 24px 0 0;padding:0 0 calc(20px + env(safe-area-inset-bottom,0px));animation:up .28s cubic-bezier(.2,.8,.2,1);background:var(--b-panel);color:var(--b-tx)}
.cli .sheet{background:var(--c-papel);color:var(--c-ink)}
@keyframes up{from{transform:translateY(40px);opacity:.4}}
@media (min-width:760px){.bo .scrim{align-items:center}.bo .sheet{border-radius:22px;max-width:640px}}
.sheet .grab{width:44px;height:5px;border-radius:3px;background:color-mix(in srgb, currentColor 20%, transparent);margin:10px auto}
.sheet .pad{padding:4px 20px 0;display:flex;flex-direction:column;gap:14px}
.sheet h2{font-size:32px}
.cli .sheet h2{color:var(--c-primaria)}
.sheet p{margin:0;opacity:.75}
.sheet .hero{aspect-ratio:4/3;width:100%;object-fit:cover}
.sheet .hero.ph{aspect-ratio:16/9}
.sheet .row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.sheet .price{font-size:30px}
.cli .sheet .price{color:var(--c-primaria)}
.opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:10px}
.opt{border:1.5px solid var(--c-line);background:var(--c-card);border-radius:14px;padding:14px 8px;display:flex;flex-direction:column;align-items:center;gap:6px;font-weight:700;font-size:14px;color:var(--c-primaria)}
.opt svg{width:24px;height:24px}
.opt.on{border-color:var(--c-primaria);background:var(--c-primaria);color:var(--c-on-primaria)}
.stepper{display:flex;align-items:center;gap:14px}
.stepper button{width:40px;height:40px;border-radius:12px;background:color-mix(in srgb, var(--c-primaria) 9%, transparent);color:var(--c-primaria);display:grid;place-items:center}
.stepper button svg{width:18px;height:18px}
.stepper b{font:800 26px/1 var(--f-titulo);min-width:28px;text-align:center}
.lines{list-style:none;margin:0;padding:0}
.lines li{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--c-line)}
.lines li .n{flex:1;font-weight:600;line-height:1.25}
.lines li .n small{display:block;color:var(--c-muted);font-weight:500}
.total{display:flex;justify-content:space-between;align-items:baseline;font-weight:700}
.total .price{font-size:28px}
.hint{font-size:13px;opacity:.7;text-align:center}

/* cardápio em vídeo */
.reels{position:fixed;inset:0;z-index:120;background:#000;color:#fff}
.reels-feed{height:100%;overflow-y:auto;scroll-snap-type:y mandatory;overscroll-behavior:contain;scrollbar-width:none}
.reels-feed::-webkit-scrollbar{display:none}
.reel{height:100vh;height:100dvh;scroll-snap-align:start;scroll-snap-stop:always;position:relative;overflow:hidden}
.reel .media{position:absolute;inset:0}
.reel .media img,.reel .media video{width:100%;height:100%;object-fit:cover}
.reel.live .media img{animation:kb 9s ease-in-out infinite alternate}
@keyframes kb{from{transform:scale(1.04)}to{transform:scale(1.22) translate(-4%,-3%)}}
.reel .media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.45) 0%,transparent 22%,transparent 45%,rgba(0,0,0,.9) 100%)}
.reel .info{position:absolute;left:0;right:0;bottom:0;padding:0 18px calc(24px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:8px;max-width:560px;margin-inline:auto}
.reel .tags{display:flex;gap:6px;flex-wrap:wrap}
.reel .tags span{font:700 11px/1 var(--f-texto);letter-spacing:.1em;text-transform:uppercase;padding:6px 9px;border-radius:6px;background:rgba(255,255,255,.18);backdrop-filter:blur(6px)}
.reel .tags span.r{background:var(--c-acento);color:var(--c-on-acento)}
.reel h2{font-size:42px;text-shadow:0 2px 20px rgba(0,0,0,.5)}
.reel .price{font-size:30px;color:var(--c-destaque)}
.reel p{margin:0;font-size:15px;color:rgba(255,255,255,.85)}
.reel .acts{display:flex;gap:10px;margin-top:6px}
.reel .acts .btn{flex:1;min-height:50px;padding:0 12px;font-size:15px}
.reel .acts .btn.ghost{background:rgba(255,255,255,.16);color:#fff;backdrop-filter:blur(6px)}
.reels-top{position:absolute;z-index:5;left:0;right:0;top:0;padding:calc(12px + env(safe-area-inset-top,0px)) 14px 0;display:flex;align-items:center;gap:10px;pointer-events:none}
.reels-top>*{pointer-events:auto}
.reels-top .pill{background:rgba(0,0,0,.45);backdrop-filter:blur(6px);border-radius:999px;padding:9px 13px;font-weight:700;font-size:13.5px;display:inline-flex;align-items:center;gap:6px;color:#fff}
.reels-top .pill svg{width:16px;height:16px}
.reels-top .sp{flex:1}
.reels-top .iconbtn{background:rgba(0,0,0,.45);color:#fff}
.swipe{position:absolute;left:50%;transform:translateX(-50%);top:calc(66px + env(safe-area-inset-top,0px));background:rgba(0,0,0,.5);backdrop-filter:blur(6px);border-radius:999px;padding:9px 14px;font-weight:700;font-size:13.5px;display:flex;align-items:center;gap:6px;animation:bob 1.6s ease-in-out infinite;white-space:nowrap}
.swipe svg{width:16px;height:16px}
@keyframes bob{50%{transform:translate(-50%,-6px)}}
.reel.out .media img{filter:grayscale(1)}

/* ============================================================
   EQUIPE, GESTÃO E ADMIN (.bo)
   ============================================================ */
.s-wrap{max-width:1180px;margin-inline:auto;padding:calc(14px + env(safe-area-inset-top,0px)) 16px calc(40px + env(safe-area-inset-bottom,0px))}
.s-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-bottom:14px;border-bottom:1px solid var(--b-line)}
.s-nav{display:flex;gap:6px;flex-wrap:wrap}
.s-nav a,.s-nav button{text-decoration:none;font-weight:700;font-size:14px;padding:9px 12px;border-radius:10px;color:var(--b-mut)}
.s-nav a.on{background:var(--b-panel-2);color:var(--b-ac)}
.who{display:flex;align-items:center;gap:10px;font-weight:700}
.who .chip{background:rgba(47,174,102,.14);color:#8fe0b2}
.s-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:14px 0 0}
.s-sum{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0}
.s-sum div{background:var(--b-panel);border:1px solid var(--b-line);border-radius:14px;padding:12px 14px}
.s-sum b{display:block;font:800 34px/1 var(--f-bo-titulo);color:var(--b-ac);font-variant-numeric:tabular-nums}
.s-sum span{font-size:13px;color:var(--b-mut)}
.s-sec{margin-top:22px}
.s-sec>h2{font-size:24px;text-transform:uppercase;color:var(--b-ac);margin-bottom:10px;display:flex;align-items:center;gap:10px}
.s-sec>h2 .n{font:700 14px/1 var(--f-bo-texto);background:var(--crit);color:#fff;border-radius:999px;padding:4px 9px;font-style:normal}
.q{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.qc{background:var(--b-panel);border:1px solid var(--b-line);border-left:6px solid var(--ok);border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:10px}
.qc.warn{border-left-color:var(--warn)}
.qc.crit{border-left-color:var(--crit);animation:glow 1.4s ease-in-out infinite}
@keyframes glow{50%{box-shadow:0 0 0 3px rgba(228,87,46,.35)}}
.qc.mine{border-left-color:var(--b-ac)}
.qc .top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.qc .mesa{font:800 38px/.92 var(--f-bo-titulo);text-transform:uppercase;letter-spacing:-0.03em;min-width:0;word-break:normal;overflow-wrap:break-word}
.qc .tipo{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:15px;margin-top:6px}
.qc .tipo svg{width:18px;height:18px;color:var(--b-ac)}
.qc .wait{text-align:right;flex:none}
.qc .wait b{display:block;font:700 28px/1 var(--f-bo-titulo);font-variant-numeric:tabular-nums}
.qc .wait span{font-size:12px;color:var(--b-mut);text-transform:uppercase;letter-spacing:.1em;font-weight:700}
.qc.warn .wait b{color:var(--warn)} .qc.crit .wait b{color:#ff8a66}
.qc .det{font-size:14.5px;color:color-mix(in srgb, var(--b-tx) 88%, transparent);background:rgba(0,0,0,.2);border-radius:10px;padding:10px 12px}
.qc .det ul{margin:4px 0 0;padding-left:18px}
.qc .acts{display:flex;gap:8px}
.qc .acts button{flex:1;min-height:48px;border-radius:12px;font-weight:700}
.qc .acts .go{background:var(--b-ac);color:var(--b-on-ac)}
.qc .acts .done{background:var(--ok);color:#fff}
.qc .acts .sec{background:var(--b-panel-2);flex:0 0 auto;padding:0 14px}
.qc .by{font-size:13.5px;color:#8fe0b2;font-weight:600}
.s-empty{border:1.5px dashed var(--b-line);border-radius:16px;padding:30px;text-align:center;color:var(--b-mut)}
.banner{font-size:13.5px;line-height:1.45;padding:10px 14px;border-radius:10px;background:rgba(231,183,102,.12);color:#f0d5a3;border:1px solid rgba(231,183,102,.3)}
.banner.erro{background:rgba(228,87,46,.12);color:#ffb59e;border-color:rgba(228,87,46,.35)}

.gate{position:fixed;inset:0;z-index:150;background:color-mix(in srgb, var(--b-bg) 96%, transparent);display:grid;place-items:center;padding:20px;overflow:auto}
.gate .box{width:100%;max-width:380px;text-align:center;display:flex;flex-direction:column;gap:14px;align-items:center}
.gate h2{font-size:38px;text-transform:uppercase;color:var(--b-ac)}
.gate p{margin:0;color:var(--b-mut)}
.gate .btn{width:100%}

.f-in,.gate input,.g-field input,.g-field select,.g-field textarea{width:100%;padding:13px 14px;border-radius:11px;border:1px solid var(--b-line);background:var(--b-bg);color:var(--b-tx);outline:none}
.f-in:focus,.gate input:focus,.g-field input:focus,.g-field select:focus,.g-field textarea:focus{border-color:var(--b-ac)}
.g-field textarea{min-height:84px;resize:vertical}

/* TV */
.tv{padding:28px 32px;min-height:100vh}
.tv-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}
.tv-head h1{font-size:44px;text-transform:uppercase}
.tv-head .clock{font:700 44px/1 var(--f-bo-titulo);color:var(--b-ac);font-variant-numeric:tabular-nums}
.tv-stats{display:flex;gap:28px;font-size:18px;color:var(--b-mut);flex-wrap:wrap}
.tv-stats b{color:var(--b-tx);font:800 30px/1 var(--f-bo-titulo);margin-right:6px}
.tv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px;margin-top:22px}
.tv-grid .qc{padding:22px}
.tv-grid .qc .top{flex-wrap:wrap;gap:8px 20px}
.tv-grid .qc .wait{text-align:left}
.tv-grid .qc .mesa{font-size:56px}
.tv-grid .qc .wait b{font-size:44px}
.tv-grid .qc .tipo{font-size:20px}

/* gestão */
.g-tabs{display:flex;gap:6px;margin:18px 0;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.g-tabs::-webkit-scrollbar{display:none}
.g-tabs button{flex:none;padding:10px 14px;border-radius:10px;font-weight:700;font-size:14.5px;color:var(--b-mut);border:1px solid var(--b-line)}
.g-tabs button.on{background:var(--b-ac);color:var(--b-on-ac);border-color:var(--b-ac)}
.g-card{background:var(--b-panel);border:1px solid var(--b-line);border-radius:16px;padding:18px}
.g-card+.g-card{margin-top:14px}
.g-card h3{font-size:24px;text-transform:uppercase;color:var(--b-ac);margin-bottom:6px}
.g-card>p{margin:0 0 14px;color:var(--b-mut);font-size:14.5px}
.g-field{display:flex;flex-direction:column;gap:6px;margin-bottom:12px;min-width:0}
.g-field label,.g-label{font-size:12.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--b-mut)}
.g-field small{color:var(--b-mut);font-size:13px}
.g-row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.g-row>.g-field{flex:1;min-width:150px}
.g-grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
@media (max-width:640px){.g-grid2{grid-template-columns:1fr}}
.g-acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px}
.checks{display:flex;gap:8px;flex-wrap:wrap}
.check{display:inline-flex;align-items:center;gap:8px;padding:10px 12px;border-radius:10px;border:1px solid var(--b-line);background:var(--b-bg);font-weight:600;font-size:14.5px;cursor:pointer}
.check input{width:18px;height:18px;accent-color:var(--b-ac)}

.tables{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px;margin-top:14px}
.tcard{background:#f5f2ec;color:#1f1a15;border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:10px;align-items:center;text-align:center}
.tcard .mesa{font:800 26px/1 var(--f-bo-titulo);text-transform:uppercase}
.tcard .qr{width:148px;height:148px;display:grid;place-items:center;font-size:12px;color:#6b6157}
.tcard .qr svg{width:100%;height:100%}
.tcard code{font-size:11px;color:#6b6157;word-break:break-all}
.tcard .acts{display:flex;gap:6px;width:100%}
.tcard .acts button,.tcard .acts a{flex:1;min-height:40px;border-radius:10px;font-weight:700;font-size:13px;display:grid;place-items:center;text-decoration:none}
.tcard .nfc{background:#1f1a15;color:#f5f2ec}
.tcard .lk{background:rgba(31,26,21,.08);color:#1f1a15}
.mesas-ed{display:flex;flex-direction:column;gap:8px}
.mesa-ln{display:grid;grid-template-columns:minmax(80px,140px) 1fr auto;gap:8px;align-items:center}
.mesa-ln input{padding:10px 12px;border-radius:10px;border:1px solid var(--b-line);background:var(--b-bg);color:var(--b-tx);min-width:0;outline:none}
.mesa-ln input:focus{border-color:var(--b-ac)}

.cat-blk{border:1px solid var(--b-line);border-radius:14px;overflow:hidden}
.cat-blk+.cat-blk{margin-top:12px}
.cat-hd{display:flex;align-items:center;gap:10px;padding:12px 14px;background:var(--b-panel-2);flex-wrap:wrap}
.cat-hd h4{margin:0;font:800 22px/1 var(--f-bo-titulo);text-transform:uppercase;flex:1;min-width:120px}
.cat-hd .off{font:700 11px/1 var(--f-bo-texto);letter-spacing:.1em;text-transform:uppercase;color:var(--warn);font-style:normal;margin-left:8px}
.it-ln{display:grid;grid-template-columns:52px 1fr auto auto;gap:12px;align-items:center;padding:10px 14px;border-top:1px solid var(--b-line)}
.it-ln .th{width:52px;height:52px;border-radius:10px;overflow:hidden;background:var(--b-panel-2)}
.it-ln .th img{width:100%;height:100%;object-fit:cover}
.it-ln .n{font-weight:700;line-height:1.2;min-width:0}
.it-ln .n small{display:block;color:var(--b-mut);font-weight:500;font-size:13px}
.it-ln .n .badge{display:inline-block;font:700 10.5px/1 var(--f-bo-texto);letter-spacing:.08em;text-transform:uppercase;padding:3px 6px;border-radius:4px;margin-left:6px;vertical-align:2px;background:var(--b-panel-2);color:var(--b-mut)}
.it-ln .n .badge.v{background:rgba(228,87,46,.2);color:#ffb59e}
.ord{display:flex;flex-direction:column;gap:2px}
.ord button{width:32px;height:24px;border-radius:6px;background:var(--b-panel-2);color:var(--b-mut);display:grid;place-items:center}
.ord button svg{width:14px;height:14px}
.ord button:disabled{opacity:.3}
@media (max-width:560px){.it-ln{grid-template-columns:44px 1fr auto}.it-ln .th{width:44px;height:44px}.it-ln .ord{display:none}}

.sw{position:relative;width:52px;height:30px;border-radius:999px;background:var(--b-line);flex:none;transition:.2s}
.sw::after{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:var(--b-tx);transition:.2s}
.sw.on{background:var(--ok)}
.sw.on::after{left:25px}
.sw-ln{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0}
.sw-ln span{font-weight:600}
.sw-ln small{display:block;color:var(--b-mut);font-weight:500;font-size:13px}

.media-pick{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.media-pick .prev{width:96px;height:96px;border-radius:12px;overflow:hidden;background:var(--b-bg);border:1px dashed var(--b-line);display:grid;place-items:center;color:var(--b-mut);font-size:12px;text-align:center;flex:none}
.media-pick .prev img,.media-pick .prev video{width:100%;height:100%;object-fit:cover}
.media-pick input[type=file]{display:none}
.prog{height:4px;border-radius:2px;background:var(--b-line);overflow:hidden;width:100%}
.prog i{display:block;height:100%;width:40%;background:var(--b-ac);animation:prog 1s linear infinite}
@keyframes prog{from{transform:translateX(-100%)}to{transform:translateX(260%)}}

.kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;margin-bottom:14px}
.kpis div{background:var(--b-bg);border-radius:12px;padding:14px}
.kpis b{display:block;font:800 32px/1 var(--f-bo-titulo);color:var(--b-ac);font-variant-numeric:tabular-nums}
.kpis span{font-size:13px;color:var(--b-mut)}
.hist{width:100%;border-collapse:collapse;font-size:14px}
.hist th,.hist td{text-align:left;padding:9px 8px;border-bottom:1px solid var(--b-line);white-space:nowrap}
.hist th{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--b-mut)}
.scroll-x{overflow-x:auto}

/* launchers */
.l-wrap{max-width:960px;margin-inline:auto;padding:calc(36px + env(safe-area-inset-top,0px)) 20px 60px}
.l-wrap h1{font-size:clamp(42px,7vw,68px);text-transform:uppercase;margin:22px 0 10px}
.l-wrap h1 span{color:var(--b-ac)}
.l-wrap>p{color:var(--b-mut);max-width:38em;margin:0 0 26px;font-size:17px}
.l-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.l-card{background:var(--b-panel);border:1px solid var(--b-line);border-radius:18px;padding:20px;text-decoration:none;display:flex;flex-direction:column;gap:8px;transition:transform .15s,border-color .15s;text-align:left}
a.l-card:hover{transform:translateY(-3px);border-color:var(--b-ac)}
.l-card>svg{width:30px;height:30px;color:var(--b-ac)}
.l-card b{font:800 26px/1 var(--f-bo-titulo);text-transform:uppercase}
.l-card span{font-size:14.5px;color:var(--b-mut)}
.l-card .who{font:700 11.5px/1 var(--f-bo-texto);letter-spacing:.14em;text-transform:uppercase;color:var(--b-ac)}

/* admin */
.a-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.a-card{background:var(--b-panel);border:1px solid var(--b-line);border-radius:18px;padding:18px;display:flex;flex-direction:column;gap:12px}
.a-card .hd{display:flex;align-items:center;gap:12px}
.a-card .sw-cor{width:44px;height:44px;border-radius:12px;flex:none;border:1px solid var(--b-line);overflow:hidden;display:grid;grid-template-columns:1fr 1fr}
.a-card .sw-cor i{display:block}
.a-card h3{font-size:26px;text-transform:uppercase;line-height:1}
.a-card .slug{font-size:13px;color:var(--b-mut)}
.a-card .st{display:flex;gap:6px;flex-wrap:wrap}
.pill{font:700 11.5px/1 var(--f-bo-texto);letter-spacing:.06em;text-transform:uppercase;padding:6px 8px;border-radius:6px;background:var(--b-panel-2);color:var(--b-mut)}
.pill.ok{background:rgba(47,174,102,.18);color:#8fe0b2}
.pill.no{background:rgba(228,87,46,.18);color:#ffb59e}
.a-card dl{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0}
.a-card dl div{background:var(--b-bg);border-radius:10px;padding:10px}
.a-card dt{font-size:11.5px;color:var(--b-mut);text-transform:uppercase;letter-spacing:.08em;font-weight:700}
.a-card dd{margin:4px 0 0;font:800 24px/1 var(--f-bo-titulo);font-variant-numeric:tabular-nums}
.ed-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);gap:18px;align-items:start}
@media (max-width:900px){.ed-grid{grid-template-columns:1fr}}
.cores{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.cor{display:flex;align-items:center;gap:10px;padding:10px;border-radius:11px;border:1px solid var(--b-line);background:var(--b-bg)}
.cor input[type=color]{width:42px;height:42px;border:0;padding:0;background:none;border-radius:10px;cursor:pointer;flex:none}
.cor div{min-width:0}
.cor b{display:block;font-size:14px}
.cor code{font-size:12px;color:var(--b-mut)}
.aviso-cor{font-size:13px;color:var(--warn);margin-top:6px}
.preview-wrap{position:sticky;top:16px}
.preview-wrap .g-label{display:block;margin-bottom:8px}
.preview{border-radius:28px;overflow:hidden;border:8px solid #000;max-width:360px;margin-inline:auto;box-shadow:0 30px 60px -30px rgba(0,0,0,.8);background:var(--c-papel);color:var(--c-ink);font-family:var(--f-texto)}
.preview .phone{min-height:0}
.preview .c-body{padding-bottom:20px}
.pin-show{font:800 34px/1 var(--f-bo-titulo);letter-spacing:.08em;color:var(--b-ac);background:var(--b-bg);border-radius:12px;padding:14px;text-align:center;font-variant-numeric:tabular-nums}

/* placas de mesa para imprimir */
.placas{position:fixed;inset:0;z-index:160;background:#4a4a46;overflow:auto;color:#16130f}
.placas-bar{position:sticky;top:0;z-index:2;display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:12px 16px;background:var(--b-panel);color:var(--b-tx);border-bottom:1px solid var(--b-line);font-family:var(--f-bo-texto)}
.placas-bar select,.placas-bar input{padding:9px 10px;border-radius:9px;border:1px solid var(--b-line);background:var(--b-bg);color:var(--b-tx);font-size:14px}
.placas-bar input{width:min(280px,100%)}
.placas-bar label{display:flex;gap:6px;align-items:center;font-size:14px;color:var(--b-mut)}
.placas-bar .sp{flex:1}
.placas-dica{flex-basis:100%;margin:0;font-size:12.5px;color:var(--b-mut)}
.folha{width:210mm;height:297mm;background:#fff;margin:16px auto;box-shadow:0 10px 40px rgba(0,0,0,.4);display:grid;align-content:center;justify-content:center;box-sizing:border-box;padding:8mm;break-after:page;page-break-after:always}
.folha.f-display{grid-template-columns:repeat(2,95mm);grid-auto-rows:140mm;gap:7mm 8mm}
.folha.f-adesivo{grid-template-columns:repeat(2,80mm);grid-auto-rows:80mm;gap:10mm 14mm}
.placa{position:relative;overflow:hidden;border-radius:5mm;background:var(--c-papel);color:var(--c-ink);font-family:var(--f-texto);display:flex;flex-direction:column;outline:.3mm dashed #b0b0b0;outline-offset:2.2mm;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.placa svg{width:auto;height:auto}
.placa .p-top{background:var(--c-escuro);color:var(--c-on-escuro);padding:6mm 5mm 5mm;display:flex;flex-direction:column;align-items:center;gap:3mm;text-align:center}
.placa .rlogo{justify-content:center}
.placa .rlogo img{max-height:14mm;max-width:62mm}
.placa .rlogo.txt{align-items:center}
.placa .rlogo.txt b{font-size:6.2mm}
.placa .rlogo.txt small{font-size:2.4mm}
.placa .p-mesa{font-family:var(--f-titulo);font-weight:800;font-style:var(--t-estilo);text-transform:var(--t-caixa);color:var(--c-destaque);line-height:.95;letter-spacing:.01em}
.placa .p-meio{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3.2mm;padding:4mm 5mm}
.placa .p-chamada{margin:0;font-family:var(--f-titulo);font-weight:800;font-style:var(--t-estilo);text-transform:var(--t-caixa);font-size:5mm;line-height:1.05;color:var(--c-primaria);text-align:center;max-width:78mm}
.placa .p-qr{width:42mm;height:42mm;background:#fff;padding:1.5mm;border-radius:2mm;box-sizing:border-box;display:grid;place-items:center;font-size:2.6mm;color:#888}
.placa .p-qr svg{width:100%;height:100%}
.placa .p-nfc{display:flex;align-items:center;gap:3mm;font-weight:700;font-size:3.4mm;line-height:1.2;color:var(--c-primaria)}
.placa .p-nfc small{font-weight:600;font-size:2.6mm;color:var(--c-ink);opacity:.7}
.placa .alvo{width:13mm;height:13mm;border-radius:50%;border:.5mm dashed var(--c-primaria);display:grid;place-items:center;color:var(--c-primaria);flex:none}
.placa .alvo svg{width:7mm;height:7mm}
.placa .p-base{background:var(--c-destaque);color:var(--c-on-destaque);text-align:center;font-weight:700;font-size:3.1mm;padding:2.6mm 4mm}
.placa.ad .p-top{padding:3.5mm 4mm;gap:1.5mm}
.placa.ad .rlogo img{max-height:8mm;max-width:50mm}
.placa.ad .rlogo.txt b{font-size:4.4mm}
.placa.ad .rlogo.txt small{display:none}
.placa .p-ad-meio{flex:1;display:grid;grid-template-columns:36mm 1fr;gap:3mm;align-items:center;padding:3mm 4mm}
.placa.ad .p-qr{width:36mm;height:36mm}
.placa .p-ad-txt{display:flex;flex-direction:column;align-items:center;gap:2mm;text-align:center;font-size:3mm;line-height:1.15;color:var(--c-primaria)}
.placa.ad .alvo{width:11mm;height:11mm}
.placa.ad .alvo svg{width:6mm;height:6mm}
/* cartão e adesivo de mesa 8 × 5 cm (folha A4 ou rolo da gráfica) */
.placas .pl-mini,.placas .pl-rolo,.placas .pl-res{display:none}
.placas.com-mini .pl-mini,.placas.com-rolo .pl-rolo{display:contents}
.placas.com-rolo.com-verso .pl-res{display:flex}
.placas-bar #plLar,.placas-bar #plRes{width:72px}
.folha.f-cartao{position:relative;grid-template-columns:repeat(2,80mm);grid-auto-rows:50mm;gap:4mm 8mm}
.folha .f-rot{position:absolute;top:3mm;left:0;right:0;margin:0;text-align:center;font:600 3mm/1 Arial,sans-serif;color:#8a8a8a}
.cartao{width:80mm;height:50mm;flex:none;border-radius:3mm;overflow:hidden;box-sizing:border-box;font-family:var(--f-texto);-webkit-print-color-adjust:exact;print-color-adjust:exact}
.folha .cartao{outline:.3mm dashed #b0b0b0;outline-offset:1.5mm}
.cartao svg{flex:none}
.cartao.fr{background:var(--c-escuro);color:var(--c-on-escuro);display:grid;grid-template-columns:minmax(0,1fr) 32mm;gap:3mm;padding:4mm}
.cartao .c-esq{display:flex;flex-direction:column;justify-content:space-between;gap:1.5mm;min-width:0}
.cartao .rlogo img{max-height:8mm;max-width:36mm}
.cartao .rlogo.txt b{font-size:4.2mm}
.cartao .rlogo.txt small{font-size:1.9mm;letter-spacing:.2em}
.bo .cartao .rlogo.txt b{font-family:var(--f-titulo);font-style:var(--t-estilo);text-transform:var(--t-caixa)}
.cartao .c-mesa{font-family:var(--f-titulo);font-weight:800;font-style:var(--t-estilo);text-transform:var(--t-caixa);color:var(--c-destaque);line-height:.92;letter-spacing:.01em;overflow-wrap:anywhere}
.cartao .c-chamada{margin:0;display:flex;gap:1.5mm;align-items:center;font-weight:700;font-size:2.4mm;line-height:1.2}
.cartao .c-chamada svg{width:4mm;height:4mm;color:var(--c-destaque)}
.cartao .c-qr{width:32mm;height:32mm;align-self:center;background:#fff;border-radius:2mm;padding:1.3mm;box-sizing:border-box;display:grid;place-items:center;font-size:2.2mm;color:#888}
.cartao .c-qr svg{width:100%;height:100%}
.cartao.vs{background:var(--c-papel);color:var(--c-ink);display:flex;flex-direction:column}
.cartao .v-meio{flex:1;display:flex;align-items:center;gap:4mm;padding:3mm 5mm}
.cartao .alvo{width:24mm;height:24mm;border-radius:50%;border:.5mm dashed var(--c-primaria);display:grid;place-items:center;color:var(--c-primaria);flex:none}
.cartao .alvo svg{width:10mm;height:10mm}
.cartao .v-meio p{margin:0;display:flex;flex-direction:column;gap:1.2mm}
.cartao .v-meio b{font-family:var(--f-titulo);font-weight:800;font-style:var(--t-estilo);text-transform:var(--t-caixa);font-size:4.2mm;line-height:1.02;color:var(--c-primaria)}
.cartao .v-meio small{font-size:2.3mm;line-height:1.25;font-weight:600;opacity:.75}
.cartao .v-base{background:var(--c-destaque);color:var(--c-on-destaque);text-align:center;font-weight:700;font-size:2.5mm;padding:1.8mm 3mm}
.rolo{background:#fff;margin:16px;padding:5mm 0;box-sizing:border-box;box-shadow:0 10px 40px rgba(0,0,0,.4)}
.rolo .r-rot{margin:0 0 4mm;font:600 3.2mm/1 Arial,sans-serif;color:#777}
.rolo .r-grade{display:flex;flex-wrap:wrap;gap:3mm}
.rolo .cartao{outline:.1mm solid #bdbdbd}

@media print{
  @page{size:A4;margin:0}
  body.placas-on{background:#fff!important}
  body.placas-on>*:not(.placas){display:none!important}
  body.placas-on .placas{position:static;background:none;overflow:visible}
  body.placas-on .placas-bar{display:none}
  body.placas-on .folha,body.placas-on .rolo{margin:0;box-shadow:none}
}

/* capa (foto) no topo da tela da mesa */
.c-top.capa{background-image:linear-gradient(180deg,color-mix(in srgb,var(--c-escuro) 40%,transparent) 0%,color-mix(in srgb,var(--c-escuro) 78%,transparent) 55%,var(--c-escuro) 100%),var(--capa);background-size:cover;background-position:center}
.c-top.capa::after{display:none}
.c-top.capa h1,.c-top.capa p{text-shadow:0 2px 14px rgba(0,0,0,.45)}

/* cadastro: marca */
.up-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.up{border:1.5px dashed var(--b-line);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:8px;background:var(--b-bg);cursor:pointer;position:relative}
.up:hover,.up:focus-within{border-color:var(--b-ac)}
.up input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer}
.up b{font-size:14.5px}
.up small{color:var(--b-mut);font-size:12.5px;line-height:1.35}
.up .mini{height:64px;border-radius:8px;display:grid;place-items:center;overflow:hidden;color:var(--b-mut);font-size:12px;text-align:center;padding:4px}
.up .mini img{max-height:56px;max-width:100%;object-fit:contain}
.up.tem{border-style:solid;border-color:rgba(47,174,102,.6)}
.up .x{position:relative;z-index:2;align-self:flex-start;font-size:12.5px;color:#ffb59e;font-weight:700}
.amostra{margin:6px 0 0;padding:10px 12px;border-radius:10px;background:var(--b-bg);font-size:22px;line-height:1.15;color:var(--b-tx);overflow-wrap:anywhere}
.amostra.txt{font-size:15px}
.g-field label.check{font-size:14.5px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--b-tx)}

/* ===== painel da plataforma (/admin) ===== */
.pn-banner{display:block;margin-top:14px;text-decoration:none}
.pn-kpis{margin-top:18px}
.pn-kpis b small{font-size:18px;color:var(--b-mut);font-weight:700}
.dv{font-style:normal;font-weight:700;font-size:12px;white-space:nowrap;margin-left:4px;color:var(--b-mut)}
.dv.bom{color:#3DCB86}.dv.ruim{color:#ff8a66}
.pn-alertas{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.pn-alertas li{background:var(--b-panel);border:1px solid var(--b-line);border-left:5px solid var(--warn);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:4px;align-items:flex-start}
.pn-alertas li.crit{border-left-color:var(--crit)}.pn-alertas li.no{border-left-color:var(--b-mut)}
.pn-alertas li span{font-weight:700;color:var(--b-tx)}
.pn-alertas li b{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--b-mut)}
.pn-alertas li small{color:var(--b-mut);font-size:13.5px;margin-bottom:6px}
.pn-tab td{vertical-align:middle}
.pn-tab th.r,.pn-tab td.r{text-align:right}
.pn-tab td small{display:block;color:var(--b-mut);font-size:12.5px}
.pn-cli{display:flex;align-items:center;gap:10px}
.pn-cli i{width:26px;height:26px;border-radius:8px;flex:none}
.pn-x{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--warn);color:#0B2A33;font:800 12px/1 var(--f-bo-texto)}
.pn-acts{display:flex;gap:6px}
.pn-nota{font-size:12.5px;color:var(--b-mut);margin:10px 0 0}

/* ===== relatório de atendimento (/admin/relatorio/:cliente) ===== */
.rel-ctl{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:14px 0}
.rel-datas{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13.5px;color:var(--b-mut)}
.rel-datas input{background:var(--b-panel);color:var(--b-tx);border:1px solid var(--b-line);border-radius:10px;padding:7px 9px;font:inherit;color-scheme:dark}
.rel-ctl #rPrint{margin-left:auto}
.rel-doc{--r-papel:#FBF8F4;--r-areia:#F1EBE3;--r-linha:#E2D9CD;--r-tinta:#0B2A33;--r-suave:#3E5A60;--r-manga:#9C5200;--r-barra:#0095A3;--r-pico:#C46A00;
  background:var(--r-papel);color:var(--r-tinta);border-radius:18px;padding:40px;font-family:"Figtree",system-ui,sans-serif;max-width:1000px;margin:6px auto 0;
  -webkit-print-color-adjust:exact;print-color-adjust:exact}
.rel-doc h1,.rel-doc h2,.rel-doc h3{font-family:"Bricolage Grotesque","Arial Black",sans-serif;font-style:normal;text-transform:none;letter-spacing:-.02em;color:var(--r-tinta)}
.rel-cab{display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:center;padding-bottom:22px;border-bottom:2px solid var(--r-tinta)}
.rel-marca{display:flex;align-items:center;gap:8px;font:700 20px/1 "Bricolage Grotesque",sans-serif;letter-spacing:-.045em}
.rel-marca svg{width:28px;height:28px}
.rel-marca b{font-weight:800;background:#FF9F2E;padding:0 3px;border-radius:4px}
.rel-tit p{margin:0;font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--r-manga)}
.rel-tit h1{font-size:34px;line-height:1.05;margin:4px 0}
.rel-tit span{font-size:14.5px;color:var(--r-suave)}
.rel-logo{width:120px;height:72px;border-radius:12px;display:grid;place-items:center;padding:10px;text-align:center;font-weight:700;font-size:13px}
.rel-logo img{max-width:100%;max-height:100%;object-fit:contain}
.rel-kpis{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:12px;margin:24px 0}
.rel-kpis div{background:var(--r-areia);border-radius:14px;padding:16px 18px;display:flex;flex-direction:column;gap:4px}
.rel-kpis div.hero{background:var(--r-tinta);color:#FBF8F4}
.rel-kpis b{font:800 32px/1 "Bricolage Grotesque",sans-serif;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.rel-kpis .hero b{font-size:42px;color:#FF9F2E}
.rel-kpis b small{font-size:18px;color:var(--r-suave)}
.rel-kpis span{font-size:13px;color:var(--r-suave)}
.rel-kpis .hero span{color:#BFD8D5}
.rel-kpis .dv{margin:2px 0 0;font-size:12.5px}
.rel-kpis .dv.bom{color:#1F7A4D}.rel-kpis .dv.ruim{color:#B4441F}
.rel-kpis .hero .dv.bom{color:#3DCB86}.rel-kpis .hero .dv.ruim{color:#ff9a7a}
.rel-sec{margin-top:26px;break-inside:avoid}
.rel-sec h2{font-size:21px;margin:0 0 10px}
.rel-sec h3{font-size:15px;margin:18px 0 8px}
.rel-sub{font-size:13px;color:var(--r-suave);margin:-6px 0 8px}
.rel-leit{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.rel-leit li{position:relative;padding:10px 14px 10px 30px;background:var(--r-areia);border-radius:10px;font-size:14.5px;line-height:1.45}
.rel-leit li::before{content:"";position:absolute;left:13px;top:17px;width:7px;height:7px;border-radius:2px;background:#FF9F2E}
.rel-2{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.rel-2 .rel-sec{min-width:0}
svg.col{width:100%;height:auto;display:block;overflow:visible}
svg.col .gr{stroke:var(--r-linha);stroke-width:1}
svg.col .bl{stroke:#B9AE9F;stroke-width:1}
svg.col .ax{font:500 11px "Figtree",sans-serif;fill:var(--r-suave)}
svg.col .vl{font:700 12px "Figtree",sans-serif;fill:var(--r-tinta)}
svg.col .br{fill:var(--r-barra)}
svg.col .pk{fill:var(--r-pico)}
svg.col .hit{fill:transparent}
svg.col g:hover .br,svg.col g:hover .pk{opacity:.82}
.bh{display:grid;gap:8px}
.bh-l{display:grid;grid-template-columns:150px 1fr auto;gap:10px;align-items:center;font-size:14px}
.bh-t{height:12px;background:var(--r-areia);border-radius:4px;overflow:hidden}
.bh-t i{display:block;height:100%;background:var(--r-barra);border-radius:0 4px 4px 0}
.bh-l b{font-variant-numeric:tabular-nums;min-width:64px;text-align:right}
.bh-l b small{font-weight:500;color:var(--r-suave)}
.rel-t{width:100%;border-collapse:collapse;font-size:14px}
.rel-t th,.rel-t td{padding:8px 6px;border-bottom:1px solid var(--r-linha);text-align:left}
.rel-t th{font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--r-suave)}
.rel-t .r{text-align:right;font-variant-numeric:tabular-nums}
.rel-tab{margin-top:8px;font-size:13px}
.rel-tab summary{cursor:pointer;color:var(--r-manga);font-weight:700}
.rel-tab table{width:100%;border-collapse:collapse;margin-top:8px}
.rel-tab th,.rel-tab td{padding:6px;border-bottom:1px solid var(--r-linha);text-align:left}
.rel-pe{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:32px;padding-top:14px;border-top:1px solid var(--r-linha);font-size:12px;color:var(--r-suave)}
@media (max-width:760px){
  .rel-doc{padding:22px 18px}
  .rel-cab{grid-template-columns:1fr;gap:14px}
  .rel-kpis{grid-template-columns:1fr 1fr}
  .rel-kpis div.hero{grid-column:1/-1}
  .rel-2{grid-template-columns:1fr;gap:0}
  .bh-l{grid-template-columns:110px 1fr auto}
  .rel-ctl #rPrint{margin-left:0}
}
@media print{
  body.rel-on{background:#fff!important}
  body.rel-on .s-head,body.rel-on .rel-ctl,body.rel-on .rel-tab,body.rel-on #toast{display:none!important}
  body.rel-on .s-wrap{max-width:none;padding:0}
  body.rel-on .rel-doc{border-radius:0;margin:0;max-width:none;padding:12mm 13mm;font-size:12px}
  body.rel-on .rel-2{grid-template-columns:1fr 1fr}
  body.rel-on .rel-kpis{grid-template-columns:1.4fr 1fr 1fr 1fr}
}
.rel-nota{font-size:12px;color:var(--r-suave);margin:24px 0 0}

/* avisos com a tela bloqueada (celular do garçom) */
.avisos{display:flex;align-items:center;gap:12px;margin-top:14px;padding:12px 14px;border-radius:14px;background:var(--b-panel);border:1px solid var(--b-line);border-left:4px solid var(--b-ac)}
.avisos>svg{width:22px;height:22px;flex:none;color:var(--b-ac)}
.avisos>div{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.avisos b{font-size:14.5px}
.avisos span{font-size:13px;color:var(--b-mut);line-height:1.4}
.avisos .btn{flex:none}
.avisos.ok{border-left-color:var(--ok)}.avisos.ok>svg{color:#3DCB86}
.avisos.no{border-left-color:var(--b-mut)}.avisos.no>svg{color:var(--b-mut)}
@media (max-width:420px){.avisos{flex-wrap:wrap}.avisos .btn{width:100%}}