/* Base visual das três versões da Cuelho Sports: marca (azul #00baff, Bebas Neue), campos e componentes. */
@font-face{font-family:"Bebas Neue";src:url("../fontes/BebasNeue-latin.woff2") format("woff2"),url("../fontes/BebasNeue.ttf") format("truetype");font-display:swap}
:root{--fundo:#06141f;--painel:#0c2233;--painel2:#0f2b40;--linha:#1d4560;--azul:#00baff;--azul-claro:#4dd0ff;--txt:#eaf6fd;--mudo:#a9c3d4;--ok:#25d366;--erro:#ff8a8a;--aviso:#ffd23f;--titulo:"Bebas Neue",Impact,"Arial Narrow",sans-serif;--corpo:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--raio:.8rem;--toque:48px;--borda-ui:#7aa0bb}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fundo);color:var(--txt);font-family:var(--corpo);line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--azul)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,canvas:focus-visible,summary:focus-visible{outline:3px solid var(--aviso);outline-offset:3px}
h1,h2,h3{font-family:var(--titulo);font-weight:400;letter-spacing:.03em;margin:0}
.pular{position:absolute;left:-999px;top:0;background:var(--azul);color:#00131d;padding:.6rem 1rem;z-index:99}
.pular:focus{left:0}
.faixa-previa{background:#021019;color:var(--mudo);font-size:.75rem;text-align:center;padding:.4rem 1rem}
.faixa-previa a{color:var(--azul-claro)}
.marca{min-height:44px;display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--txt);font:400 1.9rem/1 var(--titulo);letter-spacing:.04em}
.marca b{color:var(--azul);font-weight:400}
.marca img{height:40px;width:auto}
.botao{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:var(--toque);background:var(--azul);color:#00131d;font:400 1.3rem/1 var(--titulo);letter-spacing:.06em;padding:.7rem 1.4rem;border:2px solid var(--azul);border-radius:.6rem;text-decoration:none;cursor:pointer;transition:transform .12s,background .2s}
.botao:hover{background:var(--azul-claro)}
.botao:disabled{opacity:.4;cursor:not-allowed}
.botao.fantasma{background:transparent;color:var(--azul)}
.botao.fantasma:hover{background:rgba(0,186,255,.12)}
.botao.verde{background:var(--ok);border-color:var(--ok);color:#012611}
.botao.verde:hover{background:#4be58a}
.botao.grande{display:flex;width:100%;font-size:1.5rem;padding:1rem}
.mini{min-height:44px;background:var(--painel);color:var(--txt);border:1px solid var(--borda-ui);border-radius:.5rem;padding:.35rem .8rem;font:inherit;font-size:.85rem;cursor:pointer}
.mini[aria-pressed="true"]{border-color:var(--azul);color:var(--azul)}
.nota{font-size:.82rem;color:var(--mudo);margin:.7rem 0 0}
.dica{color:var(--mudo);margin:.2rem 0 1rem}
.erro{color:var(--erro);font-size:.9rem;margin:.5rem 0 0}
.erros{color:var(--erro);font-size:.9rem;padding-left:1.1rem;margin:.7rem 0 0}
.pendente{color:var(--mudo);border-bottom:1px dotted var(--aviso);cursor:help}
.so-leitor{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
input[type=text],input[type=number],select{width:100%;min-height:var(--toque);background:var(--painel2);color:var(--txt);border:1px solid var(--borda-ui);border-radius:.55rem;padding:.55rem .7rem;font:inherit;font-size:1rem}
.campo{display:grid;gap:.3rem;margin-bottom:.9rem}
.campo label,.cor>label{font-size:.88rem;color:var(--mudo)}
/* cores */
.cores{display:grid;gap:1rem}
.cor{display:grid;gap:.35rem}
.cor-linha{display:flex;gap:.7rem;align-items:center}
.cor input[type=color]{flex:0 0 auto;width:3.2rem;height:var(--toque);padding:0;border:2px solid var(--borda-ui);border-radius:.55rem;background:none;cursor:pointer}
.amostras{display:flex;flex-wrap:wrap;gap:.3rem}
.amostra{width:2rem;height:2rem;border-radius:50%;border:2px solid var(--borda-ui);cursor:pointer;padding:0;position:relative}
.amostra::after{content:"";position:absolute;inset:-6px}
@media (pointer:coarse),(max-width:900px){.amostras{gap:.2rem}.amostra{width:44px;height:44px}.amostra::after{inset:0}}
.amostra[aria-pressed="true"]{border-color:#fff;box-shadow:0 0 0 2px var(--azul)}
/* padrões, modelos, fontes */
.grade-padroes,.galeria{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:.6rem}
.galeria{grid-template-columns:repeat(auto-fill,minmax(132px,1fr))}
.padrao,.modelo{background:var(--painel2);border:2px solid var(--borda-ui);border-radius:var(--raio);padding:.45rem;color:var(--txt);font:inherit;font-size:.82rem;cursor:pointer;display:grid;gap:.35rem;justify-items:center;min-height:var(--toque)}
.padrao canvas,.modelo canvas{width:100%;height:auto;border-radius:.5rem;display:block}
.mini-caixa{display:block;width:100%}
.padrao[aria-checked="true"]{border-color:var(--azul);background:rgba(0,186,255,.12)}
/* seletor de estampas (catálogo gerado por receitas): busca, família, grade virtualizada */
.estampas{display:grid;gap:.6rem;min-width:0}
.estampas h3{font-size:1.25rem;color:var(--azul)}
.est-barra{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.6rem;align-items:end}
.est-barra>.est-campo:first-child{grid-column:1/-1}
.est-campo{display:grid;gap:.25rem;min-width:0}
.est-campo label{font-size:.8rem;color:var(--mudo)}
.est-campo input[type=search]{width:100%;min-height:var(--toque);background:var(--painel2);color:var(--txt);border:1px solid var(--borda-ui);border-radius:.55rem;padding:.55rem .7rem;font:inherit;font-size:1rem}
.est-surpresa,.est-so{min-height:var(--toque);padding:.4rem 1rem;background:var(--painel2);color:var(--txt);border:2px solid var(--borda-ui);border-radius:var(--raio);font:inherit;cursor:pointer}
.est-surpresa{background:var(--azul);color:#fff;border-color:var(--azul);font-weight:600}
.est-so{text-align:left}
.est-so[aria-pressed="true"]{border-color:var(--azul);background:rgba(0,186,255,.12)}
.est-atual,.est-contagem{margin:0;font-size:.9rem}
.est-contagem,.est-vazio{color:var(--mudo)}
.est-titulo{margin-top:.4rem}
.est-rolagem{height:min(24rem,56vh);overflow-y:auto;overflow-x:hidden;border:1px solid var(--linha);border-radius:var(--raio);padding:.4rem;overscroll-behavior:contain}
.est-grade{display:grid;gap:8px;grid-auto-rows:148px;box-sizing:border-box;min-width:0}
.est-tile{position:relative;min-width:0;height:148px;box-sizing:border-box;background:var(--painel2);border:2px solid var(--borda-ui);border-radius:var(--raio);padding:.3rem;color:var(--txt);font:inherit;font-size:.74rem;line-height:1.15;cursor:pointer;display:grid;grid-template-rows:auto 1fr;gap:.15rem;justify-items:center;overflow:hidden}
.est-tile canvas{display:block;width:min(100%,96px);height:auto}
.est-tile .est-nome{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-align:center;word-break:break-word}
.est-tile[aria-checked="true"]{border-color:var(--azul);background:rgba(0,186,255,.12)}
.est-tile:hover{border-color:var(--azul)}
.est-aviso{border-style:dashed}
.est-selo{position:absolute;top:3px;right:3px;width:18px;height:18px;border-radius:50%;background:#b86e00;color:#fff;font:700 .72rem/18px system-ui,sans-serif;text-align:center}
@media (max-width:520px){.est-barra{grid-template-columns:minmax(0,1fr)}}
.modelo:hover{border-color:var(--azul)}
.fontes{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.6rem}
.fonte{background:var(--painel2);border:2px solid var(--borda-ui);border-radius:var(--raio);padding:.7rem;color:var(--txt);cursor:pointer;text-align:center;font:inherit;min-height:var(--toque)}
.fonte .amostra-texto{display:block;font-size:1.9rem;line-height:1.1}
.fonte small{color:var(--mudo)}
.fonte[aria-checked="true"]{border-color:var(--azul);background:rgba(0,186,255,.12)}
/* modelo (opções) */
.opcoes{border:1px solid var(--linha);border-radius:var(--raio);margin:0 0 .7rem;padding:.3rem .6rem .6rem;display:grid;gap:.25rem}
.opcoes legend{padding:0 .4rem;color:var(--azul);font:400 1.2rem/1 var(--titulo);letter-spacing:.05em}
.opcoes label{display:flex;justify-content:space-between;align-items:center;gap:.6rem;min-height:var(--toque);padding:.35rem .6rem;border-radius:.5rem;cursor:pointer;border:1px solid transparent}
.opcoes label:has(input:checked){background:rgba(0,186,255,.12);border-color:var(--azul)}
.opcoes input{accent-color:var(--azul);margin-right:.6rem;width:1.25rem;height:1.25rem}
.opcoes .extra{color:var(--mudo);font-variant-numeric:tabular-nums;white-space:nowrap}
.total-linha{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--linha);padding-top:.7rem;margin:.9rem 0 0;color:var(--mudo)}
.total-linha b{font:400 2rem/1 var(--titulo);color:var(--txt);letter-spacing:.03em}
/* quantidade */
.quantidades{display:grid;grid-template-columns:1fr 1fr;gap:.9rem}
.qtd-campo{display:grid;gap:.3rem;color:var(--mudo);font-size:.9rem}
.qtd-linha{display:grid;grid-template-columns:var(--toque) 1fr var(--toque);gap:.4rem}
.qtd-linha input{text-align:center;font-size:1.3rem;font-weight:700}
.passo-btn{min-height:var(--toque);background:var(--painel2);color:var(--azul);border:1px solid var(--borda-ui);border-radius:.55rem;font:700 1.5rem/1 var(--corpo);cursor:pointer}
.quantidades~.nota,.quantidades~.erro,.quantidades~.total-linha{grid-column:1/-1}
/* pessoas */
.lote{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;font-size:.85rem;color:var(--mudo);margin-bottom:.7rem}
.lote select{width:auto;min-width:7rem}
.pessoas-corpo{display:grid;gap:.6rem}
.pessoa{display:grid;grid-template-columns:2.6rem minmax(0,1fr) 4.2rem;gap:.4rem .5rem;align-items:center;background:var(--painel2);border:1px solid var(--linha);border-radius:var(--raio);padding:.6rem}
.pessoa.goleiro{border-color:var(--azul)}
.pessoa-n{font-size:.85rem;color:var(--mudo)}
.pessoa .num{text-align:center}
.pessoa .tam{display:grid;gap:.15rem;font-size:.72rem;color:var(--mudo)}
.pessoa .tam:nth-of-type(1){grid-column:2/3}
.pessoa .tam:nth-of-type(2){grid-column:3/4}
.pessoa .so{grid-column:2/4}
.so{display:flex;align-items:center;gap:.5rem;min-height:var(--toque);cursor:pointer;font-size:.9rem}
.so input{accent-color:var(--azul);width:1.3rem;height:1.3rem}
/* marcas */
.marcas-bloco{display:grid;gap:.5rem}
.marca-item{display:grid;grid-template-columns:48px 1fr auto;gap:.7rem;align-items:center;background:var(--painel2);border:1px solid var(--linha);border-radius:var(--raio);padding:.6rem}
.marca-previa{width:48px;height:48px;border-radius:.5rem;background:repeating-conic-gradient(#14384f 0 25%,#0f2b40 0 50%) 0 0/12px 12px;display:grid;place-items:center;overflow:hidden}
.marca-previa img{max-width:100%;max-height:100%}
.marca-item small{display:block;color:var(--mudo)}
.botao-arquivo{display:inline-flex;align-items:center;min-height:var(--toque);color:var(--azul);font-weight:600;cursor:pointer}
.so-leitor:focus-visible+*{outline:3px solid var(--aviso)}
/* pedido */
.resumo{display:grid;gap:.25rem;font-size:.95rem;margin-bottom:1rem}
.resumo div{display:flex;justify-content:space-between;gap:1rem;border-bottom:1px dashed var(--linha);padding:.3rem 0}
.resumo span:first-child{color:var(--mudo)}
.resumo span:last-child{text-align:right}
.condicoes{display:grid;gap:.2rem;margin:0 0 .6rem}
.condicoes div{display:flex;justify-content:space-between;align-items:baseline;padding:.35rem 0}
.condicoes dt{color:var(--mudo)}
.condicoes dd{margin:0;font:400 1.6rem/1 var(--titulo);letter-spacing:.03em}
.condicoes .grande{border-top:1px solid var(--linha)}
.condicoes .grande dd{font-size:2.6rem;color:var(--azul)}
.ferramentas{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.8rem}
.ferramentas .botao{font-size:1.1rem;padding:.55rem 1rem}
/* avisos de cor, pendências, identificação e barra de pedido */
.avisos-cor{list-style:none;margin:1rem 0 0;padding:0;display:grid;gap:.4rem}
.avisos-cor li{border-radius:.5rem;padding:.55rem .75rem;font-size:.9rem;border-left:4px solid var(--aviso);background:rgba(255,210,63,.1)}
.avisos-cor li.info{border-left-color:var(--azul);background:rgba(0,186,255,.08);color:var(--mudo)}
details.pendencias{margin-top:1rem;border:1px solid var(--linha);border-radius:var(--raio);padding:.2rem .8rem;font-size:.88rem;color:var(--mudo)}
details.pendencias summary{cursor:pointer;min-height:44px;display:flex;align-items:center;color:var(--txt)}
details.pendencias ul{margin:.2rem 0 .6rem;padding-left:1.1rem}
.quem{margin:1rem 0}
.quem h3{font-size:1.4rem;margin-bottom:.5rem;color:var(--azul)}
.atencao-so{color:var(--aviso)}
.cta{display:flex;align-items:center;justify-content:space-between;gap:.8rem;padding:.6rem .9rem calc(.6rem + env(safe-area-inset-bottom,0px));background:rgba(6,20,31,.96);border-top:1px solid var(--linha);z-index:30}
.cta-total{display:grid;line-height:1.1;min-width:0}
.cta-total span{font-size:.78rem;color:var(--mudo);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cta-total b{font:400 1.9rem/1 var(--titulo);letter-spacing:.03em}
.cta .botao{flex:0 1 auto;min-height:48px;font-size:1.35rem;white-space:nowrap}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* palco de estúdio branco: tudo que mora sobre ele usa tokens claros (o resto da página segue escuro) */
.palco,.vista{--txt:#0b2a3f;--mudo:#3e5668;--linha:#b9c8d3;--painel:#fff;--painel2:#f1f5f8;--borda-ui:#6f8da3;--azul:#0077b6;color:var(--txt)}
.palco .mini,.vista .mini,.vista .papeis,.palco .papeis{background:rgba(255,255,255,.9);color:var(--txt);border-color:var(--borda-ui)}
.vista .papeis button,.palco .papeis button{color:var(--mudo)}
.vista .papeis button[aria-selected="true"],.palco .papeis button[aria-selected="true"]{background:var(--azul);color:#fff;border-color:var(--azul)}
.vista .mini[aria-pressed="true"],.palco .mini[aria-pressed="true"]{border-color:var(--azul);color:var(--azul)}

.vista .lado .mini,.palco .vista-botoes .mini{background:rgba(255,255,255,.92);color:var(--txt);border-color:var(--borda-ui)}
.vista .lado .mini[aria-pressed="true"],.palco .vista-botoes .mini[aria-pressed="true"]{color:var(--azul);border-color:var(--azul)}
.aviso-3d{background:rgba(255,255,255,.95)!important;color:var(--txt)}
/* rodapé abaixo da dobra: o navegador pula layout e pintura até ele chegar perto (altura reservada = sem salto) */
.rodape{content-visibility:auto;contain-intrinsic-size:auto 11rem}
.colar{margin:.6rem 0;border:1px solid var(--borda-ui);border-radius:var(--raio);padding:.2rem .8rem}
.colar summary{min-height:var(--toque);display:flex;align-items:center;cursor:pointer;font-weight:600}
.colar textarea{width:100%;box-sizing:border-box;min-height:7rem;background:var(--painel2);color:var(--txt);border:1px solid var(--borda-ui);border-radius:.5rem;padding:.6rem;font:inherit}
.projetos{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;width:100%;margin-top:.4rem}
.projetos input,.projetos select{min-height:var(--toque);background:var(--painel2);color:var(--txt);border:1px solid var(--borda-ui);border-radius:.5rem;padding:0 .6rem;font:inherit;min-width:0;flex:1 1 9rem}