:root{--green:#005b3b;--dark:#00345a;--yellow:#ffd21c;--blue:#004681;--blue-light:#004681}*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:radial-gradient(circle at 50% 20%,#00548f,#00375f 72%);color:#fff;min-height:100vh}.top{display:flex;justify-content:space-between;align-items:center;padding:12px 4%;background:#003b68ee;border-bottom:1px solid #ffffff25}.brand{display:flex;gap:12px;align-items:center}.brand b{display:block;font-size:17px}.brand strong{display:block;color:var(--yellow);font-size:27px}.shield{width:52px;height:58px;background:var(--yellow);color:var(--green);display:grid;place-items:center;font-size:30px;font-weight:900;border-radius:10px 10px 20px 20px}.prodema-logo{width:70px;height:60px;object-fit:contain;display:block}.admin-link{color:#fff;text-decoration:none}main{max-width:1180px;margin:28px auto;padding:0 16px}.card{background:#003a61e8;border:1px solid #ffffff25;border-radius:18px;padding:22px;box-shadow:0 15px 40px #0006}.join{max-width:500px;margin:60px auto;text-align:center}h1{font-size:34px;color:var(--yellow)}label{display:block;text-align:left;margin-top:12px;font-weight:bold}input,select{width:100%;padding:14px;border-radius:10px;border:1px solid #ffffff35;background:#00416d;color:#fff;margin:7px 0;font-size:16px}button{width:100%;padding:14px;border:0;border-radius:10px;background:#08a45b;color:#fff;font-weight:900;font-size:16px;margin-top:10px;cursor:pointer}button:hover{filter:brightness(1.1)}.game-grid,.admin-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:20px}.section-title{font-weight:900;font-size:18px;margin-bottom:15px}.small{margin-top:22px;font-size:14px}.center{text-align:center}.bingo90{display:grid;grid-template-columns:repeat(9,1fr);gap:5px;background:#004681;padding:7px;border-radius:14px}.cell90,.blank{min-height:82px;margin:0;border-radius:8px}.cell90{background:#f5f8fa;color:#12466b;font-size:24px;box-shadow:inset 0 -2px #d4dde3}.cell90.marked{background:var(--yellow);color:#6a5500}.blank{background:#174c70}.current{font-size:100px;font-weight:900;color:var(--yellow);padding:25px 0}.status{padding:12px;background:#ffffff0d;border-radius:10px}.history{display:flex;flex-wrap:wrap;gap:7px;justify-content:center}.history span{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#00558f;border:1px solid #ffffff35;font-weight:bold}.history .last{background:var(--yellow);color:#173b4f}.code-big{font-size:76px;letter-spacing:12px;text-align:center;color:var(--yellow);font-weight:900;margin:10px 0}.qr-box{margin-top:18px}.muted{opacity:.72;font-size:13px}.error{background:#7d2020;padding:12px;border-radius:8px}.player-head{display:flex;gap:14px;align-items:center;margin-bottom:20px}.avatar{width:58px;height:58px;border-radius:50%;overflow:hidden;background:#00558f;display:grid;place-items:center;font-weight:900;font-size:25px}.avatar img{width:100%;height:100%;object-fit:cover}.player-head span{display:block;opacity:.7;font-size:13px;margin-top:4px}#qrcode{background:#fff;padding:10px;width:max-content;margin:10px auto;border-radius:10px}@media(max-width:800px){.game-grid,.admin-grid{grid-template-columns:1fr}.cell90,.blank{min-height:58px}.cell90{font-size:19px}.current{font-size:75px}.brand strong{font-size:20px}.code-big{font-size:58px}}

.claim-buttons{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.claim-buttons button{margin:0;background:#0a6f91}
.claim-buttons button:last-child{background:#08a45b}
.claim-msg{margin-top:10px;padding:10px;border-radius:9px;font-weight:800}
.claim-msg.valid{background:#087c4a}
.claim-msg.invalid{background:#7d2020}
.claims{display:flex;flex-direction:column;gap:7px}
.claim{padding:10px;border-radius:8px;background:#ffffff0d}
.claim.valid{border-left:4px solid #08a45b}
.claim.invalid{border-left:4px solid #d9534f}
@media(max-width:600px){.claim-buttons{grid-template-columns:1fr}}

.claim-buttons button:disabled{opacity:.45;cursor:not-allowed}
.claim-msg.winner{background:#b38b00;color:#fff}
.winner-box{margin-top:10px;padding:14px;border-radius:10px;background:#b38b00;color:#fff;font-size:18px;font-weight:900;text-align:center}
.winner-admin{padding:18px;border-radius:12px;background:#b38b00;text-align:center;font-size:22px}
.winner-admin span{font-size:13px;opacity:.85}
.claim.late{border-left:4px solid #d99a00}
.balls-info{margin:8px 0 14px;padding:10px 12px;border-radius:10px;background:#00558f;border:1px solid #ffffff20;font-weight:800;text-align:center;letter-spacing:.4px}
.cell90:disabled{opacity:1;cursor:not-allowed;background:#f5f8fa;color:#12466b}
.cell90.marked:disabled{opacity:1;background:var(--yellow);color:#6a5500}

/* =========================
   PÁGINA DO JOGADOR — MOBILE
   ========================= */
.player-body main{max-width:1100px}
.player-card{min-width:0}
.player-help{
    margin:-4px 0 14px;
    padding:10px 12px;
    border-radius:10px;
    background:#ffffff0b;
    border:1px solid #ffffff16;
    font-size:14px;
    line-height:1.4;
}
.bingo90{
    width:100%;
    display:grid;
    grid-template-columns:repeat(9,minmax(0,1fr));
    gap:5px;
    padding:7px;
}
.cell90{
    min-width:0;
    width:100%;
    aspect-ratio:1 / 1;
    min-height:0;
    padding:0;
    font-size:clamp(15px,2.2vw,24px);
}
.bingo75{
    width:min(100%,520px);
    margin:0 auto;
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:6px;
    padding:7px;
    background:#004681;
    border-radius:14px;
}
.cell75{
    min-width:0;
    aspect-ratio:1 / 1;
    border-radius:8px;
    border:0;
    background:#f5f8fa;
    color:#12466b;
    font-size:clamp(17px,4vw,28px);
    font-weight:900;
    display:grid;
    place-items:center;
    box-shadow:inset 0 -2px #d4dde3;
}
button.cell75{cursor:pointer}
.cell75.marked{background:var(--yellow);color:#6a5500}
.cell75.free{background:#0b8d5b;color:#fff}
.cell75:disabled{opacity:.48;cursor:not-allowed}
.cell75.marked:disabled{opacity:1;background:var(--yellow);color:#6a5500}
.player-status-card{min-width:0}
.claim-msg:empty{display:none}
.claim-msg{line-height:1.35}
@media(max-width:800px){
    .player-body .top{padding:10px 12px}
    .player-body .shield{width:42px;height:46px;font-size:24px}
    .player-body .brand b{font-size:13px}
    .player-body .brand strong{font-size:18px}
    .player-body .admin-link{font-size:13px}
    .player-body main{margin:12px auto;padding:0 10px}
    .player-body .player-head{margin-bottom:10px;padding:13px}
    .player-body .game-grid{grid-template-columns:1fr;gap:10px}
    .player-body .card{padding:14px;border-radius:14px}
    .player-body .player-card{order:1}
    .player-body .player-status-card{order:2}
    .player-body .current{font-size:clamp(64px,20vw,92px);padding:10px 0}
    .player-body .balls-info{font-size:13px;margin:8px 0 10px}
    .player-body .history{gap:5px;max-height:130px;overflow:auto}
    .player-body .history span{width:34px;height:34px;font-size:13px}
    .player-body .section-title{font-size:16px}
    .player-help{font-size:13px}
    .bingo90{gap:3px;padding:5px}
    .cell90{border-radius:5px;font-size:clamp(13px,4.8vw,20px)}
    .bingo75{gap:4px;padding:5px}
    .cell75{border-radius:5px;font-size:clamp(15px,7vw,24px)}
}
@media(max-width:380px){
    .player-body main{padding:0 6px}
    .player-body .card{padding:10px}
    .bingo90{gap:2px;padding:4px}
    .cell90{font-size:13px;border-radius:4px}
    .history span{width:31px;height:31px}
}

@media(max-width:800px){
    .prodema-logo{width:48px;height:46px}
}
