@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&display=swap";:root{--primary: #2871FF;--primary-light: #538DFF;--primary-dark: #1A5AE0;--secondary: #FF2869;--secondary-light: #FF5A8E;--accent: #FFD700;--accent-warm: #FF9F43;--background: #2871FF;--background-warm: #2367F0;--surface: rgba(255, 255, 255, .12);--surface-alt: rgba(255, 255, 255, .08);--surface-warm: rgba(255, 255, 255, .15);--surface-solid: #FFFFFF;--text: #FFFFFF;--text-light: rgba(255, 255, 255, .8);--text-lighter: rgba(255, 255, 255, .6);--text-muted: rgba(255, 255, 255, .4);--border: rgba(255, 255, 255, .15);--border-light: rgba(255, 255, 255, .1);--success: #4ADE80;--danger: #FF4D6A;--warning: #FBBF24;--gradient-primary: linear-gradient(135deg, #2871FF 0%, #538DFF 100%);--gradient-secondary: linear-gradient(135deg, #FF2869 0%, #FF5A8E 100%);--gradient-bg: linear-gradient(180deg, #2871FF 0%, #2367F0 100%);--gradient-warm: linear-gradient(135deg, #FF2869 0%, #FF9F43 100%);--gradient-soft: linear-gradient(135deg, #538DFF 0%, #7BA8FF 100%);--shadow-sm: -4px 4px 0px rgba(0, 0, 0, .2);--shadow: -8px 8px 0px rgba(0, 0, 0, .2);--shadow-lg: -16px 16px 0px rgba(0, 0, 0, .2);--shadow-xl: -24px 24px 0px rgba(0, 0, 0, .2);--shadow-card: -8px 8px 0px rgba(0, 0, 0, .2);--shadow-btn: -40px 40px 0px rgba(0, 0, 0, .2);--text-shadow: -4px 4px 0px rgba(0, 0, 0, .2);--text-shadow-lg: -8px 8px 0px rgba(0, 0, 0, .2);--radius: 20px;--radius-sm: 12px;--radius-lg: 28px;--radius-xl: 36px;--radius-full: 500px;--transition: all .3s cubic-bezier(.4, 0, .2, 1);--transition-fast: all .15s ease}*{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;scroll-behavior:smooth}body{font-family:Gilroy,DM Sans,-apple-system,BlinkMacSystemFont,sans-serif;background:var(--background);color:var(--text);min-height:100vh;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(#538DFF 1px,transparent 1px),linear-gradient(90deg,#538DFF 1px,transparent 1px);background-size:60px 60px;opacity:.4;pointer-events:none;z-index:0}body.admin-mode{background:#f5f5f7}body.admin-mode:before{display:none}#app{min-height:100vh;display:flex;flex-direction:column;position:relative;z-index:1}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 1.5rem}h1,h2,h3,h4{font-family:Gilroy,DM Sans,sans-serif;font-weight:700;line-height:1.2;color:var(--text);text-shadow:var(--text-shadow)}h1{font-size:2.75rem;letter-spacing:-.02em}h2{font-size:2rem}h3{font-size:1.5rem}h4{font-size:1.25rem}p{color:var(--text-light)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:1rem 2.5rem;font-family:Gilroy,DM Sans,sans-serif;font-size:1rem;font-weight:600;text-decoration:none;border:none;border-radius:var(--radius-full);cursor:pointer;transition:var(--transition);white-space:nowrap;text-shadow:var(--text-shadow)}.btn-primary{background:var(--secondary);color:#fff;box-shadow:var(--shadow-lg);font-size:1.1rem;padding:1.25rem 3rem}.btn-primary:hover{background:#e81f5a;transform:translate(4px,-4px);box-shadow:-20px 20px #0003}.btn-primary:active{transform:translate(0);box-shadow:-4px 4px #0003}.btn-secondary{background:#ffffff26;color:#fff;border:2px solid rgba(255,255,255,.3);box-shadow:var(--shadow);text-shadow:var(--text-shadow)}.btn-secondary:hover{background:#ffffff40;border-color:#ffffff80;transform:translate(4px,-4px);box-shadow:-12px 12px #0003}.btn-danger{background:var(--danger);color:#fff;box-shadow:var(--shadow)}.btn-danger:hover{background:#e8364f;transform:translate(4px,-4px)}.btn-success{background:var(--success);color:#fff;box-shadow:var(--shadow)}.btn-success:hover{background:#38c96e;transform:translate(4px,-4px)}.btn-warm{background:var(--accent-warm);color:#fff;box-shadow:var(--shadow)}.btn-warm:hover{background:#e88a30;transform:translate(4px,-4px)}.btn-icon{width:48px;height:48px;padding:0;border-radius:50%}.btn-sm{padding:.5rem 1.25rem;font-size:.875rem;box-shadow:var(--shadow-sm)}.btn-lg{padding:1.25rem 3rem;font-size:1.15rem}.card{background:#ffffff1f;border-radius:var(--radius-lg);box-shadow:var(--shadow-card);padding:1.75rem;transition:var(--transition);border:1px solid rgba(255,255,255,.15);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.card:hover{box-shadow:var(--shadow-lg);transform:translate(4px,-4px)}.card-soft{background:#ffffff14;border:none}.card-glass{background:#ffffff26;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.2)}.input-group{margin-bottom:1.25rem}.input-group label{display:block;font-weight:600;margin-bottom:.5rem;color:var(--text);font-size:.9rem}.input{width:100%;padding:.875rem 1.25rem;font-family:inherit;font-size:1rem;border:2px solid rgba(255,255,255,.3);border-radius:var(--radius);background:#ffffff1a;color:var(--text);transition:var(--transition)}.input:focus{outline:none;border-color:#fff9;box-shadow:0 0 0 4px #ffffff1a;background:#ffffff26}.input::placeholder{color:var(--text-muted)}.gender-selector{display:flex;gap:.75rem}.gender-option{flex:1;padding:.75rem 1rem;text-align:center;border:2px solid rgba(255,255,255,.2);border-radius:var(--radius);cursor:pointer;transition:var(--transition);background:#ffffff0d;color:var(--text)}.gender-option:hover{border-color:#fff6;background:#ffffff1a}.gender-option.active{border-color:var(--secondary);background:#ff286933;color:#fff}.gender-option span{display:block;font-size:1.5rem;margin-bottom:.25rem}.player-list{display:flex;flex-direction:column;gap:.75rem}.player-item{display:flex;align-items:center;gap:1rem;padding:1rem 1.25rem;background:#ffffff1a;border-radius:var(--radius);transition:var(--transition);border:1px solid rgba(255,255,255,.1)}.player-item:hover{background:#ffffff26;box-shadow:var(--shadow-sm)}.player-avatar{width:48px;height:48px;border-radius:50%;background:var(--gradient-secondary);display:flex;align-items:center;justify-content:center;font-size:1.5rem;flex-shrink:0}.player-avatar.male{background:var(--gradient-soft)}.player-info{flex:1}.player-name{font-weight:600;color:var(--text)}.player-order{font-size:.875rem;color:var(--text-lighter)}.game-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}.game-card{background:#ffffff1f;border-radius:var(--radius-lg);padding:2rem;text-align:center;cursor:pointer;transition:var(--transition);border:1px solid rgba(255,255,255,.15);box-shadow:var(--shadow-card)}.game-card:hover{transform:translate(4px,-4px);box-shadow:var(--shadow-lg);border-color:#ffffff4d}.game-icon{font-size:3.5rem;margin-bottom:1rem}.game-title{margin-bottom:.5rem;color:var(--text)}.game-description{font-size:.875rem;line-height:1.5;color:var(--text-light)}.timer{font-family:Gilroy,DM Sans,sans-serif;font-size:5rem;font-weight:700;text-align:center;color:#fff;text-shadow:var(--text-shadow-lg)}.timer.warning{color:var(--warning);animation:pulse 1s infinite}.timer.danger{color:var(--danger);animation:pulse .5s infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.bingo-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:.75rem;max-width:500px;margin:0 auto}.bingo-cell{aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:1.5rem;font-weight:700;background:#ffffff1a;border:2px solid rgba(255,255,255,.2);border-radius:var(--radius);cursor:pointer;transition:var(--transition);color:#fff}.bingo-cell:hover:not(.used){border-color:var(--secondary);background:#ff286933;transform:scale(1.05)}.bingo-cell.used{background:#ffffff0d;color:var(--text-muted);cursor:not-allowed;opacity:.6}.bingo-cell.answered{background:var(--success);border-color:var(--success);color:#fff}.bingo-cell.skipped{background:var(--danger);border-color:var(--danger);color:#fff}.game-image{width:100%;max-width:800px;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);margin:2rem auto;display:block}.results-table{width:100%;border-collapse:separate;border-spacing:0;margin-top:1.5rem;border-radius:var(--radius);overflow:hidden}.results-table th,.results-table td{padding:1rem 1.25rem;text-align:left}.results-table th{background:#ffffff26;font-weight:600;color:var(--text);border-bottom:1px solid rgba(255,255,255,.1)}.results-table td{border-bottom:1px solid rgba(255,255,255,.05);background:#ffffff14;color:var(--text)}.results-table tr:last-child td{border-bottom:none}.results-table tr:hover td{background:#ffffff1f}.tabs{display:flex;gap:.5rem;padding:.25rem;background:#ffffff14;border-radius:var(--radius-full);width:fit-content}.tab{padding:.625rem 1.25rem;font-size:.875rem;font-weight:600;color:var(--text-light);background:transparent;border:none;border-radius:var(--radius-full);cursor:pointer;transition:var(--transition-fast)}.tab:hover{color:var(--text)}.tab.active{background:#fff3;color:#fff;box-shadow:var(--shadow-sm)}.badge{display:inline-flex;align-items:center;gap:.375rem;padding:.375rem .875rem;font-size:.8rem;font-weight:600;border-radius:var(--radius-full);background:#ffffff26;color:var(--text)}.badge-primary{background:#2871ff4d;color:#fff}.badge-warm{background:#ff286940;color:#fff}.badge-success{background:#4ade8040;color:#fff}.price{display:inline-flex;align-items:center;gap:.25rem;font-weight:700;color:var(--text)}.price-icon{color:var(--accent)}.price-old{color:var(--text-muted);text-decoration:line-through;font-weight:500;font-size:.9em;margin-right:.25rem}.fade-enter-active,.fade-leave-active{transition:opacity .3s ease}.fade-enter-from,.fade-leave-to{opacity:0}.slide-up-enter-active,.slide-up-leave-active{transition:all .4s ease}.slide-up-enter-from,.slide-up-leave-to{opacity:0;transform:translateY(20px)}@media (max-width: 768px){h1{font-size:2rem}h2{font-size:1.5rem}.container{padding:0 1rem}.card{padding:1.25rem}.timer{font-size:3.5rem}.bingo-grid{gap:.5rem}.bingo-cell{font-size:1rem}.btn-lg{padding:1rem 2rem}}.text-center{text-align:center}.text-primary{color:var(--primary)}.text-success{color:var(--success)}.text-danger{color:var(--danger)}.text-warm{color:var(--secondary)}.mt-1{margin-top:.5rem}.mt-2{margin-top:1rem}.mt-3{margin-top:1.5rem}.mt-4{margin-top:2rem}.mb-1{margin-bottom:.5rem}.mb-2{margin-bottom:1rem}.mb-3{margin-bottom:1.5rem}.mb-4{margin-bottom:2rem}.flex{display:flex}.flex-center{display:flex;align-items:center;justify-content:center}.gap-1{gap:.5rem}.gap-2{gap:1rem}.gap-3{gap:1.5rem}
