@import"https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800;900&family=Gelasio:wght@600&display=swap";.admin-root{--cream: #f2f2f2;display:flex;min-height:100dvh;background:var(--cream);font-family:var(--font-sans);overflow:hidden}.admin-sidebar{width:240px;flex-shrink:0;background:var(--base);display:flex;flex-direction:column;min-height:100dvh}.admin-sidebar-back{display:flex;align-items:center;gap:8px;padding:14px 20px;font-size:.875rem;font-weight:500;color:#ffffff8c;background:none;border:none;border-bottom:1px solid rgba(255,255,255,.1);cursor:pointer;transition:color .15s,background .15s;text-align:left;width:100%}.admin-sidebar-back:hover{color:#fff;background:#ffffff0d}.admin-nav-item{display:flex;align-items:center;gap:12px;width:100%;padding:11px 16px;border-radius:12px;margin-bottom:2px;font-size:.9rem;font-weight:500;background:none;border:none;border-left:3px solid transparent;cursor:pointer;color:#ffffffa6;transition:color .15s,background .15s;text-align:left}.admin-nav-item:hover{color:#fff;background:#ffffff0f}.admin-nav-item.active{color:#fff;background:#ffffff1a;border-left-color:var(--accent);padding-left:13px}.admin-main{flex:1;overflow:auto}.admin-topbar{position:sticky;top:0;z-index:10;background:#f5f3ebd9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid rgba(48,47,45,.1);padding:16px 32px;display:flex;align-items:center;justify-content:space-between}.admin-content{padding:32px;display:flex;flex-direction:column;gap:24px}.admin-card{background:var(--surface);border-radius:18px;padding:24px;box-shadow:0 1px 4px #302f2d0f}.admin-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.admin-stat-card{background:var(--surface);border-radius:18px;padding:22px;box-shadow:0 1px 4px #302f2d0f;transition:box-shadow .15s}.admin-stat-card:hover{box-shadow:0 4px 12px #302f2d1a}.admin-btn-primary{padding:9px 18px;background:var(--accent);color:var(--almost-black);font-weight:700;font-size:.875rem;border:none;border-radius:12px;cursor:pointer;transition:filter .15s;font-family:var(--font-sans)}.admin-btn-primary:hover{filter:brightness(.93)}.admin-btn-primary:disabled{background:#302f2d1a;color:var(--muted);cursor:not-allowed;filter:none}.admin-btn-ghost{padding:8px 14px;background:none;border:1px solid rgba(48,47,45,.18);border-radius:12px;font-size:.875rem;font-weight:500;color:var(--almost-black);cursor:pointer;transition:background .15s;display:flex;align-items:center;gap:6px;font-family:var(--font-sans)}.admin-btn-ghost:hover{background:#ffffff80}.admin-table{width:100%;border-collapse:collapse}.admin-table th{text-align:left;font-size:.7rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.07em;padding-bottom:10px;border-bottom:1px solid rgba(48,47,45,.1)}.admin-table th.right,.admin-table td.right{text-align:right}.admin-table td{padding:11px 0;font-size:.875rem;border-bottom:1px solid rgba(48,47,45,.05)}.admin-table tr:last-child td{border-bottom:none}.admin-table tr:hover td{background:#ffffff4d}.admin-song-row{display:grid;grid-template-columns:1fr 1.2fr auto auto auto;gap:12px;align-items:center;padding:10px 12px;border-radius:12px;transition:background .12s}.admin-song-row:hover{background:#ffffff73}.admin-song-row:hover .admin-delete-btn{opacity:1}.admin-delete-btn{opacity:0;background:none;border:none;cursor:pointer;padding:6px;border-radius:8px;color:var(--muted);transition:opacity .12s,background .12s,color .12s;display:flex;align-items:center}.admin-delete-btn:hover{background:#bf55371a;color:var(--danger)}.diff-badge{display:inline-block;padding:3px 10px;border-radius:8px;font-size:.72rem;font-weight:700;white-space:nowrap}.diff-easy{background:#dcfce7;color:#15803d}.diff-medium{background:#fef3c7;color:#b45309}.diff-hard{background:#fee2e2;color:#dc2626}.admin-hub-root{min-height:100dvh;background:#fff;font-family:var(--font-sans)}.admin-hub-header{background:var(--base);padding:18px 40px;display:flex;align-items:center;justify-content:space-between}.admin-game-card{background:var(--surface);border-radius:18px;padding:24px;box-shadow:0 1px 4px #302f2d0f;border:2px solid transparent;cursor:pointer;text-align:left;transition:box-shadow .15s,transform .15s,border-color .15s;font-family:var(--font-sans);width:100%}.admin-game-card:hover{box-shadow:0 6px 20px #302f2d1f;transform:translateY(-2px);border-color:#374e4033}.admin-add-card{background:#fff6;border:2px dashed rgba(48,47,45,.18);border-radius:18px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:220px;transition:background .15s,border-color .15s}.admin-add-card:hover{background:#fff9;border-color:#374e4059}.admin-settings-row{display:flex;align-items:center;gap:16px;background:var(--surface);border-radius:18px;padding:20px 24px;box-shadow:0 1px 4px #302f2d0f;cursor:pointer;border:none;width:100%;text-align:left;font-family:var(--font-sans);transition:box-shadow .15s}.admin-settings-row:hover{box-shadow:0 4px 12px #302f2d1a}.status-live{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:8px;font-size:.72rem;font-weight:700;background:#dcfce7;color:#15803d}.status-draft{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:8px;font-size:.72rem;font-weight:700;background:#302f2d14;color:var(--muted)}.status-dot{width:7px;height:7px;border-radius:50%;background:#22c55e;animation:pulse 2s infinite;flex-shrink:0}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.admin-bar-track{height:10px;background:#ffffff80;border-radius:99px;overflow:hidden}.admin-bar-fill{height:100%;background:var(--base);border-radius:99px}.admin-modal-overlay{position:fixed;inset:0;z-index:50;background:#0006;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:16px}.admin-modal{background:var(--cream);border-radius:20px;box-shadow:0 20px 60px #0003;width:100%;max-width:520px;overflow:hidden;font-family:var(--font-sans)}.admin-dropzone{border:2px dashed rgba(48,47,45,.2);border-radius:16px;padding:40px 24px;display:flex;flex-direction:column;align-items:center;gap:12px;cursor:pointer;transition:border-color .15s,background .15s;text-align:center}.admin-dropzone:hover,.admin-dropzone.dragging{border-color:var(--base);background:#374e400a}.admin-dropzone.has-file{border-color:#374e4066;background:#374e400a}.role-staff{padding:3px 10px;border-radius:8px;font-size:.72rem;font-weight:700;background:#374e401a;color:var(--base)}.role-player{padding:3px 10px;border-radius:8px;font-size:.72rem;font-weight:700;background:#302f2d12;color:var(--muted)}@layer theme,base,clerk,components,utilities;:root{--cream: #f5f3eb;--white: #f2f2f2;--base: #374e40;--accent: #d7d966;--neutral1: #6b8f9c;--almost-black: #302f2d;--danger-raw: #bf5537;--bg: var(--white);--surface: #edeae0;--surface2: #e0ddd1;--border: rgba(55, 78, 64, .14);--text: var(--almost-black);--muted: #7a8e84;--accent1: var(--base);--accent2: var(--accent);--accent3: var(--neutral1);--accent4: var(--accent);--danger: var(--danger-raw);--font-sans: "Manrope", system-ui, sans-serif;--font-serif: "Gelasio", Georgia, serif;--font-script: "Roustel", cursive;--radius-sm: 12px;--radius-md: 18px;--radius-lg: 24px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;width:100%;overflow-x:hidden;background:var(--bg);color:var(--text);font-family:var(--font-sans);-webkit-font-smoothing:antialiased}.safe-top{padding-top:max(env(safe-area-inset-top),16px)}.safe-bottom{padding-bottom:max(env(safe-area-inset-bottom),16px)}.shell{max-width:430px;width:100%;min-height:100dvh;margin:0 auto;display:flex;flex-direction:column;padding:0 20px}h1{font-family:var(--font-serif);font-size:2rem;font-weight:600;line-height:1.15;letter-spacing:-.01em}h2{font-family:var(--font-serif);font-size:1.5rem;font-weight:600;line-height:1.2}h3{font-family:var(--font-sans);font-size:1.1rem;font-weight:700;line-height:1.3}p{line-height:1.6}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:20px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:1rem;font-weight:700;font-family:var(--font-sans);border-radius:var(--radius-sm);border:none;cursor:pointer;transition:opacity .15s,transform .1s;text-decoration:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}.btn:active{opacity:.8;transform:scale(.97)}.btn:disabled{opacity:.4;cursor:not-allowed;transform:none}.btn-primary{background:var(--accent1);color:#fff;padding:14px 28px}.btn-ghost{background:var(--surface);color:var(--text);border:1.5px solid var(--border);padding:12px 20px}.btn-full{width:100%}.game-card{border-radius:var(--radius-lg);padding:28px 24px;position:relative;overflow:hidden;cursor:pointer;border:none;text-align:left;display:flex;flex-direction:column;gap:8px;transition:transform .15s,box-shadow .15s;-webkit-tap-highlight-color:transparent;text-decoration:none;color:#fff}.game-card:active{transform:scale(.97)}.game-card-purple{background-color:#374e40}.game-card-orange{background-color:#bf5537}.game-card-cyan{background-color:#6b8f9c}.game-card-green{background-color:#d7d966;color:#302f2d}.game-card:after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:.18;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");background-size:180px 180px;mix-blend-mode:overlay}.game-card-badge{display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:#fff3;border-radius:99px;padding:3px 10px;width:fit-content;margin-bottom:4px}.game-card-icon{position:absolute;right:20px;bottom:16px;font-size:4rem;opacity:.22;line-height:1;pointer-events:none;-webkit-user-select:none;user-select:none}.game-card-coming-soon{opacity:.5;cursor:default}.game-card-coming-soon:active{transform:none}.quiz-progress-bar{height:4px;background:var(--surface2);border-radius:99px;overflow:hidden}.quiz-progress-fill{height:100%;background:var(--accent1);border-radius:99px;transition:width .4s ease}.quiz-question-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:32px 24px;text-align:center}.quiz-answer-btn{width:100%;background:var(--surface);border:2px solid var(--border);border-radius:var(--radius-md);padding:18px 20px;text-align:left;font-size:1rem;font-weight:600;font-family:var(--font-sans);color:var(--text);cursor:pointer;transition:border-color .15s,background .15s,transform .1s;display:flex;align-items:center;gap:14px;-webkit-tap-highlight-color:transparent}.quiz-answer-btn:active{transform:scale(.98)}.quiz-answer-btn:disabled{cursor:default;transform:none}.quiz-answer-btn.correct{border-color:var(--accent2);background:#d7d96626}.quiz-answer-btn.wrong{border-color:var(--danger);background:#bf55371f}.quiz-answer-btn.selected{border-color:var(--accent1);background:#374e401a}.quiz-answer-letter{width:32px;height:32px;border-radius:8px;background:var(--surface2);display:flex;align-items:center;justify-content:center;font-size:.85rem;font-weight:700;color:var(--muted);flex-shrink:0;transition:background .15s,color .15s}.correct .quiz-answer-letter{background:var(--accent2);color:#302f2d}.wrong .quiz-answer-letter{background:var(--danger);color:#fff}.selected .quiz-answer-letter{background:var(--accent1);color:#fff}.score-chip{background:var(--surface2);border-radius:99px;padding:6px 16px;font-size:.85rem;font-weight:700;color:var(--accent1);display:inline-flex;align-items:center;gap:6px}.modal-backdrop{position:fixed;inset:0;background:#302f2d80;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;display:flex;align-items:flex-end;justify-content:center;animation:fade-in .15s ease}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes difficulty-pulse{0%,to{box-shadow:0 0 #d7d96600;transform:scale(1)}50%{box-shadow:0 0 0 5px #d7d96659;transform:scale(1.03)}}.difficulty-pulse{animation:difficulty-pulse 1.6s ease-in-out infinite}.modal-sheet{width:100%;max-width:430px;background:var(--bg);border-radius:28px 28px 0 0;padding:32px 24px max(env(safe-area-inset-bottom),28px);animation:slide-up .25s cubic-bezier(.32,.72,0,1)}@keyframes slide-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}.modal-handle{width:40px;height:4px;background:var(--border);border-radius:99px;margin:0 auto 28px}.auth-tabs{display:flex;gap:4px;background:var(--surface);border-radius:12px;padding:4px;margin-bottom:28px}.auth-tab{flex:1;padding:10px;border:none;border-radius:9px;background:transparent;color:var(--muted);font-size:.9rem;font-weight:700;cursor:pointer;transition:background .15s,color .15s;font-family:var(--font-sans)}.auth-tab.active{background:var(--bg);color:var(--text);box-shadow:0 1px 4px #302f2d1a}.auth-field{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}.auth-field label{font-size:.8rem;font-weight:700;color:var(--muted);letter-spacing:.05em;text-transform:uppercase}.auth-input{width:100%;padding:14px 16px;border:2px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);color:var(--text);font-size:1rem;font-family:var(--font-sans);outline:none;transition:border-color .15s}.auth-input:focus{border-color:var(--accent1)}.auth-input::placeholder{color:var(--muted)}.auth-divider{display:flex;align-items:center;gap:12px;margin:20px 0;color:var(--muted);font-size:.8rem}.auth-divider:before,.auth-divider:after{content:"";flex:1;height:1px;background:var(--border)}.btn-google{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;padding:13px;border:2px solid var(--border);border-radius:var(--radius-sm);background:var(--bg);color:var(--text);font-size:.95rem;font-weight:600;font-family:var(--font-sans);cursor:pointer;transition:border-color .15s,background .15s}.btn-google:hover{border-color:var(--accent1);background:var(--surface)}.top-nav{display:flex;align-items:center;justify-content:space-between;padding-bottom:24px}.nav-logo{font-family:var(--font-serif);font-size:1.15rem;font-weight:600;color:var(--text);letter-spacing:-.01em}.nav-logo span{color:var(--accent1)}.text-muted{color:var(--muted)}.text-accent{color:var(--accent1)}.text-sm{font-size:.875rem}.text-xs{font-size:.75rem}.font-bold{font-weight:700}.flex{display:flex}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-2{gap:8px}.gap-3{gap:12px}.gap-4{gap:16px}.mt-1{margin-top:4px}.mt-2{margin-top:8px}.mt-3{margin-top:12px}.mt-4{margin-top:16px}.mt-6{margin-top:24px}.mt-8{margin-top:32px}.mb-1{margin-bottom:4px}.mb-2{margin-bottom:8px}.mb-4{margin-bottom:16px}.mb-6{margin-bottom:24px}.w-full{width:100%}