*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);min-height:100vh;color:#333}.app-container{min-height:100vh;padding:1rem}.app-header{background:white;padding:1rem 1.5rem;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:1.5rem;display:flex;justify-content:space-between;align-items:center}.user-info{display:flex;align-items:center;gap:.4rem}.username{font-weight:600;color:#667eea;text-transform:uppercase}.page-container{width:80vw;margin:0;background:white;padding:2rem;border-radius:12px;box-shadow:0 4px 16px #0000001a;position:absolute;left:50%;transform:translate(-50%)}.page-container-small{max-width:500px;margin:2rem auto;background:white;padding:2.5rem;border-radius:12px;box-shadow:0 4px 16px #00000026}h1,h2,h3{color:#2d3748;margin-bottom:1rem}h1{font-size:2rem;font-weight:700}h2{font-size:1.75rem;font-weight:600}h3{font-size:1.25rem;font-weight:600}form{margin:1.5rem 0}.form-group{margin-bottom:1.25rem}label{display:block;margin-bottom:.5rem;font-weight:500;color:#4a5568}input,select{width:100%;padding:.75rem;border:2px solid #e2e8f0;border-radius:8px;font-size:1rem;transition:all .2s;font-family:inherit}input:focus,select:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}input[type=checkbox]{margin-right:.5rem;width:18px;height:18px;cursor:pointer}.checkbox-label{display:flex;align-items:center;cursor:pointer}button{padding:.75rem 1.5rem;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s;font-family:inherit}button:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}button[type=submit]{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;width:100%}button[type=submit]:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.btn-secondary{background:#e2e8f0;color:#2d3748}.btn-secondary:hover:not(:disabled){background:#cbd5e0}.btn-danger{background:#fc8181;color:#fff}.btn-danger:hover:not(:disabled){background:#f56565}.btn-small{padding:.5rem 1rem;font-size:.875rem}a{color:#667eea;text-decoration:none;font-weight:500;transition:color .2s}a:hover{color:#764ba2;text-decoration:underline}table{width:100%;border-collapse:collapse;margin:1.5rem 0}thead{background:#f7fafc}th{text-align:left;padding:1rem;font-weight:600;color:#2d3748;border-bottom:2px solid #e2e8f0}td{padding:1rem;border-bottom:1px solid #e2e8f0}tbody tr:hover{background:#f7fafc}.bingo-board{display:inline-block;margin:1rem 0}.bingo-board table{border-collapse:collapse;margin:0}.bingo-board td{border:2px solid #cbd5e0;padding:1rem;min-width:100px;min-height:100px;text-align:center;cursor:pointer;transition:all .2s;background:white;font-weight:500}.bingo-board td:hover{background:#f7fafc;transform:scale(1.02)}.bingo-board td.marked{background:linear-gradient(135deg,#a0eacb 0%,#7ed7b0 100%);color:#1a5a3a;font-weight:600}.bingo-board td.opponent-marked{background:linear-gradient(135deg,#fad7d7 0%,#f7a7a7 100%);color:#7a2020;font-weight:600}.bingo-boards{display:flex;flex-wrap:wrap;gap:2rem;margin:1.5rem 0}.board-section{flex:1;min-width:300px}.board-title{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem}.bingo-badge{background:linear-gradient(135deg,#ffd700 0%,#ffed4e 100%);color:#7a5a00;padding:.25rem .75rem;border-radius:20px;font-size:.875rem;font-weight:700;animation:pulse 1s infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.error-message{background:#fff5f5;border-left:4px solid #fc8181;color:#c53030;padding:1rem;border-radius:8px;margin:1rem 0}.success-message{background:#f0fff4;border-left:4px solid #68d391;color:#22543d;padding:1rem;border-radius:8px;margin:1rem 0}.info-message{background:#ebf8ff;border-left:4px solid #63b3ed;color:#2c5282;padding:1rem;border-radius:8px;margin:1rem 0}.events-list{list-style:none;margin:1rem 0}.events-list li{padding:.75rem;border-left:3px solid #667eea;background:#f7fafc;margin-bottom:.5rem;border-radius:4px;font-size:.875rem}.invite-section{background:#f7fafc;padding:1.5rem;border-radius:8px;margin:1.5rem 0}.invite-link-container{display:flex;gap:.5rem;margin-top:1rem}.invite-link-container input{flex:1}.text-center{text-align:center}.mt-1{margin-top:.5rem}.mt-2{margin-top:1rem}.mt-3{margin-top:1.5rem}.mb-1{margin-bottom:.5rem}.mb-2{margin-bottom:1rem}.mb-3{margin-bottom:1.5rem}.flex{display:flex}.flex-col{flex-direction:column}.gap-1{gap:.5rem}.gap-2{gap:1rem}.gap-3{gap:1.5rem}.items-center{align-items:center}.justify-between{justify-content:space-between}.loading{text-align:center;padding:3rem;color:#4a5568;font-size:1.125rem}hr{border:none;border-top:2px solid #e2e8f0;margin:2rem 0}@media (max-width: 768px){.page-container{padding:1.5rem}.page-container-small{padding:1.5rem;margin:1rem}.bingo-boards{flex-direction:column}.bingo-board td{min-width:60px;min-height:60px;padding:.5rem;font-size:.875rem}h1{font-size:1.5rem}h2{font-size:1.25rem}}