@import "https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,300;0,14..32,400;0,14..32,500;0,14..32,600;0,14..32,700;0,14..32,800;1,14..32,400&display=swap";:root{--bg-deep:#030712;--bg-base:#080f1f;--bg-card:#0d162dd9;--bg-card-hover:#111c3af2;--border:#334155b3;--border-bright:#6366f180;--text-primary:#eef2ff;--text-secondary:#7c8db5;--text-muted:#3d4e72;--accent:#6366f1;--accent-bright:#818cf8;--accent-glow:#6366f140;--gold:#f59e0b;--gold-bright:#fbbf24;--gold-glow:#f59e0b40;--silver:#94a3b8;--bronze:#b45309;--green:#10b981;--green-glow:#10b98140;--red:#ef4444;--radius-sm:.5rem;--radius:.875rem;--radius-lg:1.25rem;--radius-xl:1.75rem;--shadow-sm:0 1px 3px #00000080;--shadow-md:0 4px 20px #0009;--shadow-lg:0 12px 48px #000c;--shadow-glow:0 0 30px var(--accent-glow)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-deep);color:var(--text-primary);-webkit-font-smoothing:antialiased;background-image:radial-gradient(at 20% 10%,#6366f114 0%,#0000 50%),radial-gradient(at 80% 90%,#f59e0b0d 0%,#0000 50%);justify-content:center;min-height:100vh;font-family:Inter,system-ui,sans-serif;display:flex}#root{flex-direction:column;width:100%;max-width:100%;min-height:100vh;display:flex}main{flex-direction:column;flex:1;align-items:center;padding:2rem 1rem;display:flex}h1,h2,h3{letter-spacing:-.02em;font-weight:700}h2{color:var(--text-primary);font-size:1.5rem}.gradient-text{background:linear-gradient(135deg, var(--accent-bright), var(--gold));-webkit-text-fill-color:transparent;-webkit-background-clip:text}.navbar{z-index:50;border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(20px);background:#080f1fe6;justify-content:space-between;align-items:center;padding:.875rem 1.5rem;display:flex;position:sticky;top:0}.nav-brand{background:linear-gradient(135deg, var(--accent-bright), var(--gold));-webkit-text-fill-color:transparent;letter-spacing:-.03em;-webkit-background-clip:text;font-size:1.4rem;font-weight:800;text-decoration:none}.nav-links{align-items:center;gap:.25rem;display:flex}.nav-links a{color:var(--text-secondary);border-radius:var(--radius-sm);padding:.4rem .875rem;font-size:.9rem;font-weight:500;text-decoration:none;transition:color .2s,background .2s}.nav-links a:hover{color:var(--text-primary);background:#ffffff0d}.nav-links a.active-link{color:var(--accent-bright);background:var(--accent-glow)}.balance-chip{background:var(--green-glow);color:var(--green);border:1px solid #10b9814d;border-radius:2rem;align-items:center;gap:.4rem;padding:.35rem .875rem;font-size:.9rem;font-weight:700;display:flex}.desktop-only{display:none}.mobile-only{display:flex}@media (width>=768px){.desktop-only{display:flex}.mobile-only{display:none}}.menu-btn{border:1px solid var(--border);color:var(--text-primary);border-radius:var(--radius-sm);cursor:pointer;background:0 0;padding:.35rem .75rem;font-size:1.25rem;transition:background .2s}.menu-btn:hover{background:#ffffff12}.mobile-drawer-backdrop{-webkit-backdrop-filter:blur(6px);z-index:1000;background:#070a14a6;animation:.25s fadeIn;position:fixed;inset:0}.mobile-drawer{-webkit-backdrop-filter:blur(20px);border-left:1px solid var(--border);z-index:1001;background:#0d1829f2;flex-direction:column;width:290px;padding:2rem 1.5rem;animation:.35s cubic-bezier(.16,1,.3,1) slideInRight;display:flex;position:fixed;top:0;bottom:0;right:0;box-shadow:-10px 0 40px #0009}.drawer-close-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-self:flex-end;align-items:center;width:36px;height:36px;margin-bottom:1rem;font-size:1.5rem;transition:all .2s;display:flex}.drawer-close-btn:hover{color:var(--text-primary);background:#ffffff0d}.drawer-links a{color:var(--text-secondary);border-radius:var(--radius);border-left:3px solid #0000;padding:.85rem 1.25rem;font-size:.95rem;font-weight:700;text-decoration:none;transition:all .2s;display:block}.drawer-links a.active-link{color:var(--accent-bright);border-left-color:var(--accent);background:#6366f11a}.drawer-links a:hover:not(.active-link){color:var(--text-primary);background:#ffffff08}.drawer-logout-btn{color:#ef4444;text-align:left;border-radius:var(--radius);cursor:pointer;background:#ef44441a;border:1px solid #ef444433;padding:.85rem 1.25rem;font-size:.95rem;font-weight:700;transition:all .2s}.drawer-logout-btn:hover{background:#ef444433;border-color:#ef444473}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(12px);box-shadow:var(--shadow-md);padding:2rem}.card-glow{box-shadow:var(--shadow-md), var(--shadow-glow);border-color:var(--border-bright)}.info-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:var(--shadow-md);text-align:center;max-width:480px;margin:0 auto;padding:2rem}.info-card h2{color:var(--accent-bright);border-bottom:1px solid var(--border);margin-top:0;margin-bottom:1.5rem;padding-bottom:1rem}.action-btn{color:#fff;background:linear-gradient(135deg, var(--accent), #4f46e5);border-radius:var(--radius-sm);cursor:pointer;box-shadow:0 4px 15px var(--accent-glow);border:none;justify-content:center;align-items:center;gap:.5rem;padding:.75rem 2rem;font-family:inherit;font-size:.95rem;font-weight:600;text-decoration:none;transition:all .2s;display:inline-flex}.action-btn:hover{box-shadow:0 8px 25px var(--accent-glow);transform:translateY(-2px)}.action-btn:active{transform:translateY(0)}.action-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.action-btn.sm{padding:.5rem 1.25rem;font-size:.85rem}.btn-sm{cursor:pointer;color:#fff;border:none;border-radius:.375rem;padding:.375rem .75rem;font-size:.8rem;font-weight:600;transition:opacity .2s}.btn-sm:hover{opacity:.8}.btn-warn{background:linear-gradient(135deg,#f59e0b,#d97706)}.btn-danger{background:linear-gradient(135deg,#ef4444,#dc2626)}.btn-success{background:linear-gradient(135deg,#10b981,#059669)}.input-field{border:1px solid var(--border);border-radius:var(--radius-sm);width:100%;color:var(--text-primary);background:#080f1fcc;outline:none;padding:.75rem 1rem;font-family:inherit;font-size:.95rem;transition:border-color .2s,box-shadow .2s}.input-field:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.input-field::placeholder{color:var(--text-muted)}label{color:var(--text-secondary);font-size:.85rem;font-weight:500}.status-pill{text-transform:uppercase;letter-spacing:.05em;border-radius:2rem;padding:.2rem .7rem;font-size:.72rem;font-weight:700;display:inline-block}.status-pill.waiting{color:var(--accent-bright);background:#6366f126}.status-pill.starting{color:var(--gold-bright);background:#f59e0b26}.status-pill.playing{color:var(--green);background:#10b98126}.status-pill.completed{color:var(--silver);background:#6b728026}.spot-grid{grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:.75rem;display:grid}.room-header-grid{grid-template-columns:1.2fr 1fr;gap:1.25rem;animation:.4s fadeIn;display:grid}@media (width<=640px){.room-header-grid{grid-template-columns:1fr}.spot-grid{grid-template-columns:repeat(auto-fill,minmax(75px,1fr))}}.spot-card{aspect-ratio:1;border-radius:var(--radius);border:2px solid var(--border);cursor:pointer;-webkit-user-select:none;user-select:none;background:#0d162db3;justify-content:center;align-items:center;font-size:1.25rem;font-weight:800;transition:all .2s;display:flex;position:relative;overflow:hidden}.spot-card:before{content:"";background:linear-gradient(135deg,#0000 40%,#ffffff08 100%);position:absolute;inset:0}.spot-card:hover:not(.taken):not(.mine){border-color:var(--accent);background:var(--accent-glow);box-shadow:0 0 20px var(--accent-glow);transform:scale(1.05)}.spot-card.mine{border-color:var(--green);box-shadow:0 0 20px var(--green-glow);cursor:pointer;background:linear-gradient(135deg,#10b98133,#10b9811a)}.spot-card.taken{color:#fee2e2cc;cursor:not-allowed;background:#ef44441f;border-color:#ef444473;box-shadow:inset 0 0 10px #ef444426}.spot-card.empty{color:var(--text-secondary)}.room-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);cursor:pointer;padding:1.5rem;transition:all .25s;position:relative;overflow:hidden}.room-card:after{content:"";pointer-events:none;background:linear-gradient(135deg,#0000,#6366f108);position:absolute;inset:0}.room-card:hover{border-color:var(--border-bright);box-shadow:0 16px 40px #0009, 0 0 30px var(--accent-glow);transform:translateY(-3px)}.admin-tabs{border-bottom:1px solid var(--border);gap:.5rem;margin-bottom:2rem;padding-bottom:.75rem;display:flex}.tab-btn{color:var(--text-secondary);cursor:pointer;border-radius:var(--radius-sm);background:0 0;border:none;padding:.6rem 1.25rem;font-family:inherit;font-size:.95rem;font-weight:600;transition:all .2s}.admin-panel-container{background:var(--bg-main);width:100%;min-height:100vh;display:flex}.admin-sidebar{-webkit-backdrop-filter:blur(20px);border-right:1px solid var(--border);z-index:100;background:#0d1829f2;flex-direction:column;flex-shrink:0;gap:1.5rem;width:280px;padding:2rem 1.25rem;transition:transform .3s cubic-bezier(.16,1,.3,1);display:flex}.admin-sidebar-title{color:var(--gold);letter-spacing:.04em;text-transform:uppercase;align-items:center;gap:.4rem;margin-bottom:1.5rem;padding-left:.5rem;font-size:1.25rem;font-weight:900;display:flex}.admin-sidebar-menu{flex-direction:column;gap:.5rem;display:flex}.admin-sidebar-menu .tab-btn{width:100%;color:var(--text-secondary);text-align:left;border-radius:var(--radius);cursor:pointer;background:0 0;border:none;border-left:3px solid #0000;align-items:center;gap:.75rem;padding:.85rem 1rem;font-weight:700;transition:all .2s;display:flex}.admin-sidebar-menu .tab-btn:hover{color:var(--text-primary);background:#ffffff08}.admin-sidebar-menu .tab-btn.active{color:var(--accent-bright);border-left-color:var(--accent);box-shadow:none;background:#6366f11a}.admin-sidebar-menu a.back-game-btn{width:100%;color:var(--gold);border-radius:var(--radius);background:#f59e0b08;border:1px dashed #f59e0b4d;align-items:center;gap:.75rem;margin-top:1.5rem;padding:.85rem 1rem;font-size:.95rem;font-weight:700;text-decoration:none;transition:all .2s;display:flex}.admin-sidebar-menu a.back-game-btn:hover{border-color:var(--gold);background:#f59e0b14}.admin-main{box-sizing:border-box;flex:1;min-width:0;padding:2.5rem 5%;overflow-y:auto}.admin-mobile-header{border-bottom:1px solid var(--border);z-index:99;background:#0d1829f2;justify-content:space-between;align-items:center;padding:.85rem 1.25rem;display:none;position:sticky;top:0}.admin-mobile-header h3{color:var(--text-primary);margin:0;font-size:1rem;font-weight:800}.admin-card{background:var(--bg-card);border-radius:var(--radius-lg);border:1px solid var(--border);box-shadow:var(--shadow-md);padding:2rem}.admin-card h2{border-bottom:1px solid var(--border);margin-top:0;margin-bottom:1.5rem;padding-bottom:1rem;font-size:1.3rem}.admin-form{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.25rem;display:grid}.admin-form .action-btn{grid-column:1/-1;justify-self:start}.form-group{flex-direction:column;gap:.5rem;display:flex}.form-group input,.form-group select{border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);background:#080f1fcc;outline:none;padding:.65rem .875rem;font-family:inherit;font-size:.9rem;transition:border-color .2s}.form-group input:focus,.form-group select:focus{border-color:var(--accent)}.rooms-header{border-bottom:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.5rem;padding-bottom:1rem;display:flex}.rooms-header h2{border:none;margin:0;padding:0}.create-room-form{gap:.5rem;display:flex}.create-room-form input{border-radius:var(--radius-sm);border:1px solid var(--border);color:#fff;background:#080f1fcc;width:130px;padding:.5rem .875rem}.table-responsive{width:100%;overflow-x:auto}.rooms-table{border-collapse:collapse;text-align:center;width:100%;margin:0 auto}.rooms-table th,.rooms-table td{border-bottom:1px solid var(--border);white-space:nowrap;text-align:center;vertical-align:middle;padding:1rem}.rooms-table th{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;text-align:center;font-size:.8rem;font-weight:600}.rooms-table tr:last-child td{border-bottom:none}.rooms-table tr:hover td{background:#ffffff05}.actions-cell{flex-wrap:wrap;justify-content:center;gap:.4rem;display:flex}@media (width<=1024px){.admin-panel-container{flex-direction:column}.admin-mobile-header{display:flex}.admin-sidebar{z-index:1001;width:270px;position:fixed;top:0;bottom:0;left:0;transform:translate(-100%);box-shadow:10px 0 30px #00000080}.admin-sidebar.open{transform:translate(0)}.rooms-table thead{display:none}.rooms-table,.rooms-table tbody,.rooms-table tr,.rooms-table td{box-sizing:border-box;width:100%;display:block}.rooms-table tr{border:1px solid var(--border);border-radius:var(--radius);background:#080f1f66;margin-bottom:1.25rem;padding:.5rem}.rooms-table td{text-align:right;white-space:normal;border-bottom:1px solid #ffffff0d;justify-content:space-between;align-items:center;padding:.75rem .5rem;display:flex}.rooms-table td:last-child{border-bottom:none}.rooms-table td:before{content:attr(data-label);color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;font-size:.75rem;font-weight:700}.rooms-table .actions-cell{justify-content:flex-end}.admin-card{padding:1.25rem}.rooms-header,.create-room-form{flex-wrap:wrap!important;justify-content:center!important}.admin-form{grid-template-columns:1fr}.admin-sidebar-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background:#070a14a6;position:fixed;inset:0}.admin-main{box-sizing:border-box;width:100%;max-width:100vw;padding:1.5rem 1rem}}.text-muted{color:var(--text-secondary)}.fw-bold{font-weight:700}.wheel-stage{flex-direction:column;align-items:center;gap:1rem;display:flex;position:relative}@keyframes popIn{0%{opacity:0;transform:scale(.85)translateY(20px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}@keyframes glow-pulse{0%,to{box-shadow:0 0 15px var(--gold-glow)}50%{box-shadow:0 0 35px var(--gold-glow), 0 0 60px var(--gold-glow)}}@keyframes spin-badge-in{0%{opacity:0;transform:scale(.5)rotate(-10deg)}to{opacity:1;transform:scale(1)rotate(0)}}@keyframes countdown-tick{0%{color:var(--gold);transform:scale(1.15)}to{color:var(--text-secondary);transform:scale(1)}}.app-container{flex-direction:column;width:100%;min-height:100vh;display:flex}
