/* Paleta do PAPEL da Seu Dino (a da logo, nao a do video): #07151E / #262D34 / #FF6A00.
   Mobile-first: o Pedro usa isto no celular, em pe, com o barbeiro na frente. */
* { box-sizing: border-box; margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; }
body { font-family: -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
       background: #07151E; color: #E8ECEF; line-height: 1.5; padding-bottom: 40px; }
/* sem overflow-x:hidden de proposito: se um dia algo estourar, tem de aparecer e ser
   consertado, nao ser escondido. Medido a 360px: nada ultrapassa a largura. */
select { max-width: 100%; text-overflow: ellipsis; }
header { background: #07151E; border-bottom: 3px solid #FF6A00; padding: 18px 16px 14px;
         position: sticky; top: 0; z-index: 10; }
header h1 { font-size: 17px; letter-spacing: .14em; text-transform: uppercase; font-weight: 700; }
header p { font-size: 12.5px; color: #8FA0AD; margin-top: 3px; }
.wrap { max-width: 620px; margin: 0 auto; padding: 16px; }
.card { background: #101F2B; border: 1px solid #23323F; border-radius: 10px;
        padding: 16px; margin-bottom: 14px; }
.card h2 { font-size: 12px; letter-spacing: .12em; text-transform: uppercase;
           color: #FF6A00; margin-bottom: 12px; font-weight: 700; }
label { display: block; font-size: 12.5px; color: #A9B6C1; margin: 12px 0 5px; font-weight: 600; }
label:first-of-type { margin-top: 0; }
input, select, textarea { width: 100%; padding: 12px 12px; font-size: 16px; /* 16px evita zoom no iOS */
        background: #07151E; color: #E8ECEF; border: 1px solid #2C3E4C; border-radius: 7px; }
input:focus, select:focus { outline: none; border-color: #FF6A00; }
input[readonly] { color: #8FA0AD; }
/* min-width:0 obrigatorio: sem ele o item flex nao encolhe abaixo do proprio texto
   (min-width:auto e' o padrao) e a pagina inteira ganha rolagem horizontal no celular. */
.linha { display: flex; gap: 10px; }
.linha > div { flex: 1; min-width: 0; }
.linha .peq { flex: 0 0 92px; min-width: 0; }
button { width: 100%; padding: 15px; font-size: 15px; font-weight: 700; letter-spacing: .06em;
         text-transform: uppercase; border: 0; border-radius: 8px; cursor: pointer;
         background: #FF6A00; color: #07151E; margin-top: 16px; }
button:disabled { background: #3A4A57; color: #8FA0AD; cursor: default; }
button.sec { background: transparent; color: #A9B6C1; border: 1px solid #2C3E4C; }
button.perigo { background: transparent; color: #FF8A6A; border: 1px solid #6B3A2A; }
.msg { padding: 12px 14px; border-radius: 8px; font-size: 14px; margin-bottom: 12px; }
.erro { background: #33161A; border: 1px solid #7A2B33; color: #FFC9CD; }
.aviso { background: #33290F; border: 1px solid #7A5F1E; color: #FFE2A8; }
.ok { background: #12301F; border: 1px solid #2C6B45; color: #A8F0C6; }
.msg ul { margin-left: 18px; }
.dica { font-size: 12px; color: #7E8D99; margin-top: 5px; }
.tab { display: flex; gap: 8px; margin-bottom: 14px; }
.tab button { flex: 1; min-width: 0; margin: 0; padding: 12px 6px; font-size: 12.5px;
              letter-spacing: .03em; background: #101F2B; color: #A9B6C1;
              border: 1px solid #23323F; }
.tab button.on { background: #FF6A00; color: #07151E; border-color: #FF6A00; }
table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
td, th { padding: 9px 6px; border-bottom: 1px solid #23323F; text-align: left; vertical-align: top; }
th { color: #8FA0AD; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
a { color: #FF9A55; }
.pill { display: inline-block; font-size: 11px; padding: 3px 8px; border-radius: 20px;
        background: #23323F; color: #A9B6C1; }
.pill.v { background: #12301F; color: #A8F0C6; }
.pill.a { background: #33290F; color: #FFE2A8; }
.oculto { display: none; }
.carregando { opacity: .55; pointer-events: none; }
.link-bloco { border: 1px solid #2C3E4C; border-radius: 8px; padding: 12px; margin-bottom: 10px;
              background: #07151E; }
.link-bloco b { display: block; font-size: 14px; margin-bottom: 6px; }
.link-bloco code { font-size: 12.5px; color: #FF9A55; word-break: break-all; display: block;
                   margin-bottom: 8px; }
.link-bloco button { margin: 0; padding: 10px; font-size: 12.5px; }