/* MAIS TUNER 24.200.57 — aba Pedidos do player do app (pedidos-2026.mjs) e a marca do pedido na fila do A seguir. */
.pa-ped{position:relative;flex:1 1 0;min-height:0;display:flex;flex-direction:column;--ped-art:48px;--ped-bolha:62px}
.pa-ped[hidden]{display:none}
.pa-ped-busca{flex:none;display:flex;align-items:center;gap:9px;height:42px;margin:8px 0 6px;padding:0 6px 0 14px;box-sizing:border-box;border-radius:21px;background:rgba(255,255,255,.09);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);color:rgba(255,255,255,.76)}
.pa-ped-busca>svg{flex:none;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.pa-ped-busca input{flex:1;min-width:0;height:100%;padding:0;border:0;outline:0;background:none;color:#f4f8fd;font:inherit;font-size:16px;font-weight:500;-webkit-appearance:none;appearance:none}
.pa-ped-busca input::placeholder{color:rgba(244,248,253,.68);opacity:1}
.pa-ped-busca input::-webkit-search-cancel-button{display:none}
.pa-ped-limpa{flex:none;display:grid;place-items:center;width:32px;height:32px;padding:0;border:0;border-radius:50%;background:none;color:rgba(255,255,255,.76)}
.pa-ped-limpa[hidden]{display:none}
.pa-ped-limpa svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
.pa-ped-corpo{position:relative;flex:1 1 0;min-height:0}
.pa-ped-rola{position:absolute;inset:0;overflow:hidden auto;overflow-anchor:none;overscroll-behavior:contain;padding:0 0 calc(14px + env(safe-area-inset-bottom));scrollbar-width:none;-webkit-overflow-scrolling:touch}
.pa-ped-todas{padding-right:26px}
.pa-ped-rola::-webkit-scrollbar{display:none}
.pa-ped-s{margin:0 0 14px}
.pa-ped-s[hidden]{display:none}
.pa-ped-s h3{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:6px 0 8px;font-size:14px;font-weight:800;color:rgba(244,248,253,.8)}
.pa-ped-s h3 button{flex:none;display:flex;align-items:center;gap:5px;height:30px;padding:0 11px;border:0;border-radius:15px;background:rgba(255,255,255,.08);color:#f4f8fd!important;font-size:13px;font-weight:700}
.pa-ped-s h3 svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.pa-ped-aviso{margin:16px 0;font-size:15px;line-height:1.4;color:rgba(244,248,253,.8)}
.pa-ped-aviso[hidden]{display:none}
.pa-ped-aviso-acoes{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.pa-ped-aviso-acoes button{height:40px;padding:0 16px;border:0;border-radius:20px;background:rgba(255,255,255,.1);color:#f4f8fd!important;font-size:14px;font-weight:700}
/* bolhas de artista: anel colorido até o story ser visto, como nos stories */
.pa-ped-bolhas{display:flex;gap:10px;padding:3px 3px 2px;overflow:auto hidden;scrollbar-width:none;overscroll-behavior-x:contain}
.pa-ped-bolhas::-webkit-scrollbar{display:none}
.pa-ped-bolha{flex:none;display:flex;flex-direction:column;align-items:center;gap:5px;width:calc(var(--ped-bolha) + 10px);padding:0;border:0;background:none;color:#f4f8fd!important}
.pa-ped-anel{position:relative;display:block;width:var(--ped-bolha);height:var(--ped-bolha);padding:3px;box-sizing:border-box;border-radius:50%;background:conic-gradient(from 210deg,#ffb020,#ff4d8d,#8a5cff,#65efcf,#ffb020)}
.pa-ped-anel.is-visto{background:rgba(255,255,255,.26)}
.pa-ped-rosto{display:grid;place-items:center;width:100%;height:100%;box-sizing:border-box;border:2px solid #0b1512;border-radius:50%;object-fit:cover;background:#27507e;font-style:normal}
.pa-ped-bolha small{display:block;width:100%;font-size:11.5px;font-weight:700;line-height:1.15;text-align:center;overflow-wrap:anywhere}
.pa-ped-bolha.is-on small{color:#ffb020}
.pa-ped-bolha.is-on .pa-ped-anel{box-shadow:0 0 0 2px #ffb020}
/* mosaico de capas */
.pa-ped-mosaico{display:grid;grid-template-columns:repeat(var(--c,3),minmax(0,1fr));grid-auto-flow:dense;gap:7px}
.pa-ped-capa{position:relative;display:block;aspect-ratio:1;min-width:0;padding:0;overflow:hidden;border:0;border-radius:12px;background:#17324f;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);text-align:left;color:#fff!important}
.pa-ped-capa.is-hero{grid-column:span 2;grid-row:span 2;border-radius:16px}
.pa-ped-capa img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pa-ped-capa img.is-broken{display:none}
.pa-ped-capa span{position:absolute;left:0;right:0;bottom:0;display:block;padding:22px 7px 6px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.85))}
.pa-ped-capa b{display:block;font-size:11.5px;font-weight:800;line-height:1.12;overflow-wrap:anywhere}
.pa-ped-capa.is-hero span{padding:34px 12px 12px}
.pa-ped-capa.is-hero b{font-size:17px}
.pa-ped-capa small{display:block;margin-top:2px;font-size:13px;color:rgba(255,255,255,.86)}
.pa-ped-capa em{display:inline-flex;align-items:center;height:30px;margin-top:8px;padding:0 14px;border-radius:15px;background:#65efcf;color:#06221c;font-size:13px;font-style:normal;font-weight:800}
.pa[data-ad] .pa-ped-capa em{background:color-mix(in srgb,var(--ad-c) 62%,#fff)}
/* lista de A a Z */
.pa-ped-grupo h4{position:sticky;top:0;z-index:1;margin:0;padding:6px 0 4px;background:var(--ped-fundo,#050f1d);font-size:17px;font-weight:850;color:#65efcf}
.pa[data-ad] .pa-ped{--ped-fundo:color-mix(in srgb,var(--ad-c) 14%,#050f1d)}
.pa[data-ad] .pa-ped-grupo h4{color:color-mix(in srgb,var(--ad-c) 62%,#fff)}
.pa-ped-row{display:flex;align-items:center;gap:10px;min-height:64px;padding:6px 0;box-sizing:border-box;border-top:1px solid rgba(255,255,255,.08);content-visibility:auto;contain-intrinsic-size:auto 64px}
.pa-ped-art{flex:none;display:grid;place-items:center;width:var(--ped-art);height:var(--ped-art);border-radius:10px;object-fit:cover;background:#27507e;color:#cfe3f7;font-style:normal}
.pa-ped-copia{flex:1;min-width:0;display:grid;gap:1px}
.pa-ped-copia strong{font-size:15px;font-weight:700;line-height:1.2;overflow-wrap:anywhere}
.pa-ped-copia small{font-size:13px;line-height:1.25;color:rgba(255,255,255,.72);overflow-wrap:anywhere}
.pa-ped-row .pa-row-btn,.pa-ped-conf-topo .pa-row-btn{width:38px;height:38px}
.pa-row-btn.is-busca{opacity:.5}
.pa-ped-pedir{flex:none;height:36px;padding:0 13px;border:1px solid #65efcf;border-radius:18px;background:none;color:#65efcf!important;font-size:14px;font-weight:700}
.pa[data-ad] .pa-ped-pedir{border-color:color-mix(in srgb,var(--ad-c) 62%,#fff);color:color-mix(in srgb,var(--ad-c) 62%,#fff)!important}
.pa-ped-mais{margin:12px 0;font-size:14px;color:rgba(244,248,253,.72)}
/* índice na lateral, só na parte da lista de A a Z; tocar ou arrastar o dedo pula para a letra */
.pa-ped-letras{position:absolute;z-index:2;top:0;right:0;bottom:6px;width:22px;display:flex;flex-direction:column;align-items:stretch;justify-content:space-between;opacity:0;pointer-events:none;transition:opacity .18s ease;touch-action:none;user-select:none;-webkit-user-select:none}
.pa-ped-letras.is-vis{opacity:1;pointer-events:auto}
.pa-ped-letras[hidden]{display:none}
.pa-ped-letras button{flex:0 1 auto;min-height:0;padding:0;border:0;border-radius:6px;background:none;color:rgba(244,248,253,.72)!important;font-size:11px;font-weight:800;line-height:1.2}
.pa-ped-letras button.is-on{background:#65efcf;color:#06221c!important}
.pa[data-ad] .pa-ped-letras button.is-on{background:color-mix(in srgb,var(--ad-c) 62%,#fff)}
/* confirmar: fica na própria aba */
.pa-ped-conf{position:absolute;inset:0;z-index:3;display:flex;align-items:flex-end;background:rgba(3,8,14,.5)}
.pa-ped-conf[hidden]{display:none}
.pa-ped-conf-card{width:100%;max-height:100%;margin-bottom:calc(8px + env(safe-area-inset-bottom));padding:12px;box-sizing:border-box;overflow:auto;border-radius:20px;background:#15221e;box-shadow:0 -10px 40px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.14),inset 0 0 0 1px rgba(255,255,255,.08)}
.pa-ped-conf-topo{display:flex;align-items:center;gap:10px}
.pa-ped-q{display:flex;align-items:flex-start;gap:8px;margin:10px 0 4px;font-size:16px;font-weight:700;line-height:1.3}
.pa-ped-q svg{flex:none;width:22px;height:22px;fill:none;stroke:#ffb020;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.pa-ped-q.is-ok{color:#ffb020}
.pa-ped-q.is-erro{color:#ffc46b}
.pa-ped-nota{display:block;font-size:13px;line-height:1.35;color:rgba(244,248,253,.72)}
.pa-ped-nota a{color:inherit;text-decoration:underline}
.pa-ped-acoes{display:flex;gap:8px;margin-top:12px}
.pa-ped-acoes button{flex:1;height:44px;padding:0 10px;border:0;border-radius:22px;background:rgba(255,255,255,.1);color:#f4f8fd!important;font-size:15px;font-weight:800}
.pa-ped-acoes button.is-forte{background:#ffb020;color:#1c1300!important}
/* telas baixas (deitado): tudo mais compacto */
.pa-ped.is-curto{--ped-bolha:46px;--ped-art:42px}
.pa-ped.is-curto .pa-ped-busca{height:36px;margin:4px 0}
.pa-ped.is-curto .pa-ped-s{margin-bottom:8px}
.pa-ped.is-curto .pa-ped-s h3{margin:2px 0 5px;font-size:12.5px}
.pa-ped.is-curto .pa-ped-s h3 button{height:26px;font-size:12px}
.pa-ped.is-curto .pa-ped-bolha small{font-size:10.5px}
.pa-ped.is-curto .pa-ped-capa b{font-size:10.5px}
.pa-ped.is-curto .pa-ped-capa.is-hero b{font-size:14px}
.pa-ped.is-curto .pa-ped-letras button{font-size:10px}
.pa-ped.is-curto .pa-ped-row{min-height:54px;padding:4px 0}
.pa-ped.is-curto .pa-ped-q{margin:6px 0 2px;font-size:14px}
.pa-ped.is-curto .pa-ped-nota{font-size:11.5px}
.pa-ped.is-curto .pa-ped-acoes{margin-top:6px}
.pa-ped.is-curto .pa-ped-acoes button{height:36px;font-size:13.5px}
.pa-ped.is-curto .pa-ped-conf-card{margin-bottom:2px;padding:8px 10px}
/* tablet */
html.mt-tab .pa-ped{--ped-art:60px;--ped-bolha:80px}
html.mt-tab .pa-ped-busca{height:50px;padding-left:18px}
html.mt-tab .pa-ped-s h3{font-size:16px}
html.mt-tab .pa-ped-bolhas{gap:14px}
html.mt-tab .pa-ped-bolha small{font-size:14px}
html.mt-tab .pa-ped-mosaico{gap:10px}
html.mt-tab .pa-ped-capa b{font-size:14px}
html.mt-tab .pa-ped-capa.is-hero b{font-size:21px}
html.mt-tab .pa-ped-capa small{font-size:15px}
html.mt-tab .pa-ped-capa em{height:36px;font-size:15px}
html.mt-tab .pa-ped-row{min-height:84px;gap:14px;contain-intrinsic-size:auto 84px}
html.mt-tab .pa-ped-copia strong{font-size:18px}
html.mt-tab .pa-ped-copia small{font-size:15px}
html.mt-tab .pa-ped-row .pa-row-btn,html.mt-tab .pa-ped-conf-topo .pa-row-btn{width:48px;height:48px}
html.mt-tab .pa-ped-pedir{height:44px;padding:0 18px;border-radius:22px;font-size:16px}
html.mt-tab .pa-ped-grupo h4{font-size:21px}
html.mt-tab .pa-ped-letras{width:26px}
html.mt-tab .pa-ped-letras button{font-size:14px}
html.mt-tab .pa-ped-todas{padding-right:34px}
html.mt-tab .pa-ped-q{font-size:19px}
html.mt-tab .pa-ped-nota{font-size:14px}
html.mt-tab .pa-ped.is-curto{--ped-art:44px;--ped-bolha:48px}
html.mt-tab .pa-ped.is-curto .pa-ped-busca{height:38px}
html.mt-tab .pa-ped.is-curto .pa-ped-s h3{font-size:13px}
html.mt-tab .pa-ped.is-curto .pa-ped-bolha small{font-size:11px}
html.mt-tab .pa-ped.is-curto .pa-ped-capa b{font-size:11px}
html.mt-tab .pa-ped.is-curto .pa-ped-row{min-height:58px;gap:10px;contain-intrinsic-size:auto 58px}
html.mt-tab .pa-ped.is-curto .pa-ped-copia strong{font-size:15px}
html.mt-tab .pa-ped.is-curto .pa-ped-copia small{font-size:13px}
html.mt-tab .pa-ped.is-curto .pa-ped-row .pa-row-btn,html.mt-tab .pa-ped.is-curto .pa-ped-conf-topo .pa-row-btn{width:38px;height:38px}
html.mt-tab .pa-ped.is-curto .pa-ped-pedir{height:36px;padding:0 13px;font-size:14px}
html.mt-tab .pa-ped.is-curto .pa-ped-grupo h4{font-size:16px}
html.mt-tab .pa-ped.is-curto .pa-ped-letras button{font-size:10.5px}
html.mt-tab .pa-ped.is-curto .pa-ped-q{font-size:14.5px}
html.mt-tab .pa-ped.is-curto .pa-ped-nota{font-size:11.5px}
/* a barra com 4 abas numa linha só; se não couber, ela desliza */
html.pa-on .pa:not(.is-talk) .pa-tabs{overflow-x:auto;scrollbar-width:none}
html.pa-on .pa:not(.is-talk) .pa-tabs::-webkit-scrollbar{display:none}
html.pa-on .pa:not(.is-talk) .pa-tabs button{flex:none;white-space:nowrap}
html.pa-on:not(.mt-tab) .pa:not(.is-talk) .pa-tabs:has([data-pa="tab-ped"]:not([hidden])){gap:12px}
/* tablet: as 4 abas não encostam na bolha da rádio em pé, nem cortam na coluna deitado */
@media (max-width:700px){html.pa-on.mt-tab .pa:not(.is-open):not(.is-col):not(.is-talk) .pa-tabs{gap:16px;padding-left:64px;box-sizing:border-box}}
html.pa-on.mt-tab .pa.is-col:not(.is-talk) .pa-tabs:has([data-pa="tab-ped"]:not([hidden])){gap:16px}

/* o pedido na fila do A seguir: cor própria, bem chamativa, com o horário */
.pa-row.is-mine{position:relative;margin:6px 0;padding:8px 10px;border:0;border-radius:16px;background:linear-gradient(100deg,rgba(255,176,32,.28),rgba(255,77,141,.16));box-shadow:inset 0 0 0 2px #ffb020,0 0 22px -6px rgba(255,176,32,.7)}
.pa-row.is-mine .pa-row-n{color:#ffb020}
.pa-row.is-mine .pa-row-copy em{color:#ffb020;font-size:12px}
.pa-row-hora{display:block;margin-top:2px;font-size:14px;font-style:normal;font-weight:800;line-height:1.25;color:#ffb020}
.pa-row.is-mine.is-solto{background:rgba(255,176,32,.14);box-shadow:inset 0 0 0 2px rgba(255,176,32,.7)}
.pa-row.is-mine.is-noar{background:linear-gradient(100deg,rgba(255,176,32,.42),rgba(255,77,141,.3))}
.pa-up.is-mine .pa-up-art{box-shadow:0 0 0 3px #ffb020,0 0 16px rgba(255,176,32,.75)}
.pa-up.is-mine small{color:#ffb020;font-weight:800}
.pa-tabs [data-pa="tab-next"].has-mine .pa-count{background:#ffb020;color:#1c1300}
@keyframes paMine{0%,100%{box-shadow:inset 0 0 0 2px #ffb020,0 0 22px -6px rgba(255,176,32,.7)}50%{box-shadow:inset 0 0 0 2px #ffd27a,0 0 30px -2px rgba(255,176,32,.95)}}
.pa-row.is-mine:not(.is-solto){animation:paMine 1.6s ease-in-out 3}
@media (prefers-reduced-motion:reduce){.pa-row.is-mine:not(.is-solto){animation:none}}
html.mt-tab .pa-row-hora{font-size:16px}
