.team-card { grid-column:span 4; }
.team-visual { display:flex; align-items:center; justify-content:center; gap:18px; background:#e6edf0; color:#27717d; font:500 41px Fraunces,serif; }
.team-visual i { color:#fa806c; font:400 25px 'DM Mono',monospace; }
.team-picker { position:fixed; z-index:40; inset:0; display:grid; place-items:center; padding:20px; background:#071b2c9e; opacity:0; visibility:hidden; transition:.2s; }
.team-picker.open { opacity:1; visibility:visible; }
.team-picker-card { position:relative; width:min(660px,100%); padding:40px; background:#f7f4eb; box-shadow:0 25px 70px #0005; }
.team-picker-card h2 { margin:12px 0; color:#173446; font:500 39px/1.03 Fraunces,serif; letter-spacing:-1px; }.team-picker-card h2 em { color:#317783; }
.close-team-picker { position:absolute; top:13px; right:15px; border:0; background:transparent; color:#55747b; font-size:26px; }
.team-profile-selects { display:grid; grid-template-columns:1fr auto 1fr; gap:12px; align-items:end; margin:24px 0 6px; }.team-profile-selects label { display:grid; gap:7px; color:#55747b; font:10px 'DM Mono',monospace; letter-spacing:1px; text-transform:uppercase; }.team-profile-selects select { height:42px; padding:0 10px; border:1px solid #bcd1cc; background:#fff; color:#193d4c; font:600 14px 'DM Sans',sans-serif; }.team-profile-selects > span { padding-bottom:12px; color:#e77461; font:12px 'DM Mono',monospace; }
.team-picker-warning { min-height:18px; margin:7px 0 16px; color:#bb5c50; font-size:12px; }.team-mode-options { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }.team-mode-options button { min-height:48px; border:1px solid #b9d1cb; background:#fff; color:#195967; font:600 13px 'DM Sans',sans-serif; }.team-mode-options button:hover:not(:disabled) { background:#dff0ea; }.team-mode-options button:disabled { opacity:.45; }
.team-scoreboard { display:none; grid-template-columns:1fr 1fr; gap:6px; min-width:230px; }.team-score { position:relative; min-height:38px; padding:5px 8px 5px 35px; border:1px solid #c9dcd7; background:#f7f4eb; text-align:center; }.team-score strong { display:block; overflow:hidden; color:#1b5967; text-overflow:ellipsis; white-space:nowrap; font:600 11px 'DM Sans',sans-serif; }.team-score b { color:#d86d5b; font:10px 'DM Mono',monospace; }.team-score.active { border-color:#e77c68; background:#fff0e9; box-shadow:0 0 0 2px #f7c2b555; }.team-companion { position:absolute; bottom:0; left:0; display:block; width:34px; height:36px; overflow:hidden; }.team-companion .mascot-figure { transform:scale(.38); transform-origin:left bottom; }
.game-screen.team-game .team-scoreboard { display:grid; }.game-screen.team-game .game-score,.game-screen.team-game .game-lives,.game-screen.team-game .medal-progress { display:none; }.game-screen.team-game .challenge-panel .eyebrow::after { content:' · TURNO ACTIVO'; color:#d76a59; }.team-result { margin:-6px 0 19px; color:#477077; font-size:14px; }.team-result strong { color:#1a6771; }
.game-screen.team-game .mascot-companion { display:none; }.team-map-companions { position:absolute; z-index:8; top:14px; right:0; left:0; pointer-events:none; }.team-map-companion { position:absolute; top:0; display:grid; justify-items:center; gap:1px; width:84px; padding:3px; border:1px solid #d5e5dd; border-radius:14px; background:#f9f7eedd; box-shadow:0 7px 17px #12374a2c; opacity:.78; transition:opacity .2s, transform .2s, border-color .2s; }.team-map-companion.team-1 { left:16px; }.team-map-companion.team-2 { right:16px; }.team-map-companion .mascot-figure { width:92px; height:92px; margin:-7px auto -14px; transform:scale(.92); transform-origin:center top; }.team-map-companion span { max-width:78px; overflow:hidden; color:#235d67; font:600 8px 'DM Mono',monospace; letter-spacing:.25px; text-overflow:ellipsis; white-space:nowrap; }.team-map-companion.active { border-color:#e77c68; opacity:1; box-shadow:0 0 0 3px #f5b6a965,0 7px 17px #12374a2c; transform:translateY(3px); }
.team-victory { position:fixed; z-index:70; inset:0; display:grid; place-items:center; overflow:hidden; pointer-events:none; background:#061b2ce8; opacity:0; visibility:hidden; transition:opacity .25s; }.team-victory.show { opacity:1; visibility:visible; }.team-victory-card { position:relative; z-index:2; width:min(560px,calc(100% - 40px)); padding:48px 36px; border:1px solid #edc77e; background:linear-gradient(145deg,#103650,#071a2c); color:#fff8e8; text-align:center; box-shadow:0 26px 80px #0008; transform:scale(.82) translateY(16px); transition:transform .45s cubic-bezier(.2,1.3,.4,1); }.team-victory.show .team-victory-card { transform:scale(1) translateY(0); }.team-victory-card p { margin:0 0 16px; color:#f6cf79; font:10px 'DM Mono',monospace; letter-spacing:2px; }.team-victory-card > span { display:inline-grid; width:62px; height:62px; place-items:center; border-radius:50%; background:#f2bd57; color:#17364b; font-size:30px; box-shadow:0 0 0 8px #f2bd5730; }.team-victory-card h2 { margin:18px 0 7px; font:500 46px/1 Fraunces,serif; letter-spacing:-1.5px; }.team-victory-card strong { color:#b9ddd3; font:600 17px 'DM Sans',sans-serif; }.team-victory-card small { display:block; margin-top:18px; color:#f6cf79; font:11px 'DM Mono',monospace; letter-spacing:2px; text-transform:uppercase; }.team-victory-confetti { position:absolute; inset:0; }.team-confetti { position:absolute; top:-8%; left:var(--x); width:var(--size); height:calc(var(--size) * .55); background:var(--color); opacity:0; transform:rotate(var(--rotation)); animation:team-confetti-fall var(--duration) cubic-bezier(.2,.7,.35,1) var(--delay) forwards; }@keyframes team-confetti-fall{0%{opacity:0;transform:translateY(-20px) rotate(var(--rotation))}8%{opacity:1}100%{opacity:0;transform:translate(var(--drift),112vh) rotate(calc(var(--rotation) + 600deg))}}
@media(max-width:1000px) and (min-width:801px){.team-card{grid-column:span 2}}@media(max-width:800px){.team-card{grid-column:auto}.team-picker-card{padding:34px 22px 24px}.team-mode-options{grid-template-columns:repeat(2,1fr)}}
.team-map-companion .mascot-figure { margin:-26px auto -38px; transform:scale(1.48); }.team-map-companion[data-state="celebrate"] .mascot-figure,.team-map-companion[data-state="victory"] .mascot-figure { animation:team-mascot-cheer .55s cubic-bezier(.2,1.4,.4,1) 2; }.team-map-companion[data-state="concerned"] .mascot-figure,.team-map-companion[data-state="alert"] .mascot-figure { animation:team-mascot-wobble .38s ease-in-out 3; }.team-mascot-message { position:absolute; bottom:calc(100% + 7px); width:max-content; max-width:130px; padding:6px 8px; border:1px solid #c9d9d3; border-radius:5px; background:#fffdf6; color:#41656d; font:9px/1.25 'DM Sans',sans-serif; box-shadow:0 4px 10px #12374a22; }.team-1 .team-mascot-message { left:0; }.team-2 .team-mascot-message { right:0; }@keyframes team-mascot-cheer { 50% { transform:scale(1.62) translateY(-8px) rotate(5deg); } }@keyframes team-mascot-wobble { 25% { transform:scale(1.48) translateX(-5px) rotate(-3deg); }75% { transform:scale(1.48) translateX(5px) rotate(3deg); } }
.team-mascot-message { top:8px; bottom:auto; }.team-1 .team-mascot-message { left:calc(100% + 9px); right:auto; }.team-2 .team-mascot-message { right:calc(100% + 9px); left:auto; }.team-map-companion[data-state="concerned"],.team-map-companion[data-state="alert"] { border-color:#df7c6c; background:#fff1ec; animation:team-error-card .45s ease-in-out 3; }.team-map-companion[data-state="concerned"] .mascot-figure,.team-map-companion[data-state="alert"] .mascot-figure { animation:team-mascot-wobble .56s ease-in-out 3; }@keyframes team-error-card { 50% { box-shadow:0 0 0 5px #ef8a7955,0 7px 17px #12374a2c; } }
