:root{--bg: #0f0f14;--card: #1a1a24;--border: #2a2a3a;--text: #e8e8ed;--muted: #8888a0;--accent: #7c5cff;--accent-hover: #9378ff;--success: #22c55e;--danger: #ef4444;--warning: #eab308;font-family:DM Sans,system-ui,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);min-height:100vh;line-height:1.5}#root{min-height:100vh}body.animations-disabled *,body.animations-disabled *:before,body.animations-disabled *:after{animation-duration:0s!important;animation-delay:0s!important;transition-duration:.15s!important}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}button{font:inherit;cursor:pointer;border:none;border-radius:8px;padding:.6rem 1.2rem;background:var(--accent);color:#fff}button:hover{background:var(--accent-hover)}button:disabled{opacity:.5;cursor:not-allowed}input,select,textarea{font:inherit;padding:.5rem .75rem;border:1px solid var(--border);border-radius:8px;background:var(--card);color:var(--text)}textarea{resize:vertical;min-height:2.5rem}.container{max-width:1320px;margin:0 auto;padding:1.5rem clamp(1.25rem,4vw,2.5rem);width:100%}.page-full{width:100%;padding:1.5rem clamp(1.25rem,4vw,2.5rem);box-sizing:border-box}.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:1.5rem}.admin-layout{display:flex;min-height:calc(100vh - 56px);width:100%}.admin-sidebar{width:220px;flex-shrink:0;background:var(--card);border-right:1px solid var(--border);padding:1.25rem 0}.admin-sidebar nav{display:flex;flex-direction:column;gap:.25rem}.admin-sidebar a{display:block;padding:.6rem 1.25rem;color:var(--muted);text-decoration:none;font-weight:500;font-size:.95rem;border-left:3px solid transparent;transition:color .2s,background .2s,border-color .2s}.admin-sidebar a:hover{color:var(--text);background:#ffffff0a}.admin-sidebar a.active{color:var(--accent);border-left-color:var(--accent);background:#7c5cff14}.admin-main{flex:1;min-width:0;padding:1.5rem clamp(1.25rem,4vw,2.5rem);overflow:auto}@media (max-width: 768px){.admin-layout{flex-direction:column}.admin-sidebar{width:100%;border-right:none;border-bottom:1px solid var(--border);padding:.75rem}.admin-sidebar nav{flex-direction:row;flex-wrap:wrap;gap:.5rem}.admin-sidebar a{border-left:none;border-bottom:2px solid transparent;padding:.5rem .75rem}.admin-sidebar a.active{border-left:none;border-bottom-color:var(--accent)}}.order-slots [draggable=true]:active{cursor:grabbing}.order-question{margin-top:1rem;text-align:center}.order-question__title{font-size:.95rem;color:var(--muted);margin:0 0 1rem;display:flex;align-items:center;justify-content:center;gap:.5rem}.order-question__title:before{content:"";display:inline-block;width:24px;height:24px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238888a0' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 8h16M4 16h16'/%3E%3Cpath d='M8 4v16M16 4v16'/%3E%3C/svg%3E") no-repeat center;opacity:.9}.order-track{display:flex;flex-direction:column;flex-wrap:nowrap;gap:.5rem;align-items:stretch;justify-content:flex-start;position:relative;overflow:visible;padding:0}.order-item{position:relative;display:flex;flex-shrink:0;align-items:center;gap:.75rem;padding:.7rem 1rem;width:100%;min-width:0;background:linear-gradient(145deg,#1a1a24fa,#14141cfa);border:2px solid var(--border);border-radius:12px;cursor:grab;user-select:none;-webkit-user-select:none;-webkit-user-drag:element;transition:box-shadow .2s ease,border-color .2s ease,background .2s ease;box-shadow:0 4px 12px #00000040}.order-item:hover{border-color:#7c5cff80;box-shadow:0 6px 20px #7c5cff26}.order-item--dragging{cursor:grabbing;box-shadow:0 12px 32px #7c5cff59;border-color:var(--accent);background:linear-gradient(145deg,#7c5cff26,#1a1a24fa);z-index:10;opacity:.98;transition:box-shadow .2s ease,border-color .2s ease,background .2s ease}.order-item--drop-target{border-color:var(--accent);border-style:dashed;background:#7c5cff1f;box-shadow:0 0 0 2px #7c5cff4d}.order-item__num{flex-shrink:0;width:32px;height:32px;border-radius:10px;background:linear-gradient(135deg,var(--accent),var(--accent-hover));color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:1rem;box-shadow:0 2px 8px #7c5cff66}.order-item__text{flex:1;min-width:0;font-size:.98rem;line-height:1.4}.order-item__actions{flex-shrink:0;display:flex;flex-direction:column;gap:.25rem}.order-item__btn{width:2.5rem;min-width:2.5rem;height:2.25rem;min-height:2.25rem;padding:0;display:inline-flex;align-items:center;justify-content:center;font-size:1.1rem;line-height:1;border:2px solid var(--border);border-radius:8px;background:var(--card);color:var(--text);cursor:pointer;transition:border-color .2s,background .2s}.order-item__btn:hover:not(:disabled){border-color:var(--accent);background:#7c5cff26}.order-item__btn:disabled{opacity:.4;cursor:not-allowed}@media (pointer: coarse){.order-item__btn{width:3rem;min-width:3rem;height:2.75rem;min-height:2.75rem;font-size:1.25rem}}.order-item--answered{cursor:default;opacity:1}.order-item:not(:last-child):after{content:"";position:absolute;left:50%;bottom:-.35rem;transform:translate(-50%);width:2px;height:6px;background:linear-gradient(180deg,var(--border),transparent);border-radius:1px;pointer-events:none}@media (max-width: 640px){.order-item{padding:.6rem .85rem}.order-item__num{width:28px;height:28px;font-size:.9rem}.order-item__text{font-size:.92rem}.order-item:not(:last-child):after{display:none}}@keyframes game-pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.08);opacity:.95}}@keyframes game-go{0%{transform:scale(.3);opacity:0}60%{transform:scale(1.2);opacity:1}to{transform:scale(1);opacity:1}}@keyframes game-pop-in{0%{opacity:0;transform:scale(.9) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes game-slide-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes game-score-bump{0%,to{transform:scale(1)}50%{transform:scale(1.15)}}@keyframes game-progress-shrink{0%{width:100%}to{width:0%}}@keyframes game-shine{0%{background-position:-200% 0}to{background-position:200% 0}}.game-countdown-digit{font-size:clamp(4rem,15vw,8rem);font-weight:800;color:var(--accent);text-shadow:0 0 40px rgba(124,92,255,.5);animation:game-pulse 1s ease-in-out infinite}.game-countdown-digit.game-go{animation:game-go .6s ease-out forwards;color:var(--success);text-shadow:0 0 50px rgba(34,197,94,.5)}.game-question-card{animation:game-pop-in .35s ease-out}.game-question-card.no-select,.game-question-card.no-select *{user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.game-question-card.no-select button{cursor:pointer}.game-question-card.no-select .order-item{cursor:grab}.game-question-card.no-select .order-item--answered{cursor:default}.game-question-card.no-select .order-item.order-item--dragging{cursor:grabbing}.game-answer-btn{transition:transform .15s ease,box-shadow .15s ease,background .15s ease}.game-answer-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 20px #7c5cff40}.game-answer-btn.selected{box-shadow:0 0 0 2px var(--accent),0 4px 20px #7c5cff4d}.game-results-row{animation:game-slide-up .4s ease-out backwards}.game-results-row.correct{border-left:4px solid var(--success)}.game-results-row.wrong{border-left:4px solid var(--danger)}.game-results-row.partial{border-left:4px solid var(--warning)}.game-score-new{animation:game-score-bump .5s ease-out}.game-timer-bar{height:6px;border-radius:3px;background:var(--border);overflow:hidden}.game-timer-fill{height:100%;border-radius:3px;background:linear-gradient(90deg,var(--accent),var(--accent-hover));transition:width .05s linear}@keyframes profile-float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes profile-glow{0%,to{box-shadow:0 0 30px #7c5cff33}50%{box-shadow:0 0 50px #7c5cff59}}@keyframes profile-progress-fill{0%{width:0}}.profile-hero{animation:game-pop-in .5s ease-out,profile-glow 3s ease-in-out .5s infinite}.profile-stat-card{animation:game-slide-up .5s ease-out backwards}.profile-elo-badge{animation:profile-float 2.5s ease-in-out infinite}.profile-progress-bar{height:12px;border-radius:6px;background:var(--border);overflow:hidden}.profile-progress-fill{height:100%;border-radius:6px;transition:width .8s cubic-bezier(.25,.46,.45,.94);animation:profile-progress-fill .8s ease-out backwards}@keyframes home-title-glow{0%,to{text-shadow:0 0 30px rgba(124,92,255,.4),0 0 60px rgba(124,92,255,.2)}50%{text-shadow:0 0 50px rgba(124,92,255,.6),0 0 100px rgba(124,92,255,.3)}}@keyframes home-card-enter{0%{opacity:0;transform:translateY(24px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes home-bg-shift{0%,to{opacity:.4}50%{opacity:.6}}.home-menu{min-height:100vh;position:relative;overflow:hidden}.home-menu-bg{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 80% 60% at 50% 0%,rgba(124,92,255,.15) 0%,transparent 50%),radial-gradient(ellipse 60% 40% at 80% 80%,rgba(124,92,255,.08) 0%,transparent 50%);pointer-events:none;animation:home-bg-shift 8s ease-in-out infinite}.home-menu-title{animation:home-title-glow 3s ease-in-out infinite}.home-menu-card{animation:home-card-enter .5s ease-out backwards;transition:transform .25s ease,box-shadow .25s ease,border-color .2s ease;background:var(--card)!important;color:var(--text)!important}.home-menu-card:hover:not(:disabled){background:var(--card)!important;color:var(--text)!important;transform:translateY(-4px);box-shadow:0 12px 40px #0000004d,0 0 0 1px var(--accent)}.home-menu-card h2,.home-menu-card p{color:inherit}.home-menu-card p{color:var(--muted)!important}.training-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000bf;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:training-overlay-in .25s ease-out}@keyframes training-overlay-in{0%{opacity:0}to{opacity:1}}.training-modal-content{background:var(--card);border:2px solid var(--border);border-radius:16px;max-width:520px;width:92%;max-height:88vh;overflow:auto;box-shadow:0 24px 60px #0006,0 0 0 1px #7c5cff33;animation:game-pop-in .4s ease-out}.training-modal-title{margin:0 0 .25rem;font-size:1.5rem;font-weight:800;color:var(--text)}.training-modal-desc{color:var(--muted);font-size:.95rem;margin:0 0 1.25rem;line-height:1.4}.training-themes-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.75rem;margin-bottom:1.25rem}.training-theme-card{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100px;padding:1rem .75rem;background:var(--bg);border:2px solid var(--border);border-radius:12px;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease,background .2s ease;animation:training-card-enter .4s ease-out backwards}.training-theme-card:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 8px 24px #00000040;border-color:var(--accent);background:var(--card)}.training-theme-card.selected{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent),0 8px 24px #7c5cff33;background:linear-gradient(135deg,rgba(124,92,255,.12) 0%,var(--card) 100%)}.training-theme-card.selected:after{content:"✓";position:absolute;top:6px;right:8px;width:22px;height:22px;border-radius:50%;background:var(--accent);color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;animation:game-pop-in .25s ease-out}.training-theme-card-icon{font-size:2rem;margin-bottom:.35rem;line-height:1}.training-theme-card-label{font-size:.9rem;font-weight:600;color:var(--text);text-align:center;line-height:1.2}.training-all-card{grid-column:1 / -1;min-height:80px;flex-direction:row;gap:1rem;padding:1rem 1.25rem}.training-all-card .training-theme-card-icon{font-size:2.25rem;margin-bottom:0}.training-all-card .training-theme-card-label{font-size:1.1rem;text-align:left}.training-modal-footer{display:flex;gap:.75rem;justify-content:flex-end;flex-wrap:wrap;padding-top:.5rem;border-top:1px solid var(--border)}.training-modal-btn-start{position:relative;padding:.75rem 1.5rem;font-size:1rem;font-weight:700;color:#fff;background:linear-gradient(135deg,var(--accent) 0%,#8b6cf7 100%);border:none;border-radius:10px;cursor:pointer;box-shadow:0 4px 20px #7c5cff66;transition:transform .15s ease,box-shadow .2s ease}.training-modal-btn-start:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 28px #7c5cff80}.training-modal-btn-start:active:not(:disabled){transform:translateY(0)}.training-modal-btn-start:disabled{opacity:.8;cursor:not-allowed}@keyframes training-card-enter{0%{opacity:0;transform:translateY(16px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.profile-cosmetic-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000bf;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:training-overlay-in .25s ease-out}.profile-cosmetic-content{background:var(--card);border:2px solid var(--border);border-radius:16px;max-width:420px;width:92%;max-height:85vh;overflow:auto;box-shadow:0 24px 60px #0006,0 0 0 1px #7c5cff33;animation:game-pop-in .4s ease-out}.profile-cosmetic-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:.75rem}.profile-cosmetic-card{display:flex;flex-direction:column;align-items:center;padding:.75rem;background:var(--bg);border:2px solid var(--border);border-radius:12px;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;animation:training-card-enter .35s ease-out backwards}.profile-cosmetic-card:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 8px 24px #00000040;border-color:var(--accent)}.profile-cosmetic-card.equipped{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent),0 8px 24px #7c5cff33;background:linear-gradient(135deg,rgba(124,92,255,.12) 0%,var(--card) 100%)}.admin-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000bf;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem;animation:training-overlay-in .25s ease-out}.admin-modal-content{background:var(--card);border:2px solid var(--border);border-radius:16px;max-width:640px;width:100%;max-height:90vh;overflow:auto;box-shadow:0 24px 60px #0006,0 0 0 1px #7c5cff33;animation:game-pop-in .4s ease-out}.admin-modal-content.admin-modal-wide{max-width:720px}.admin-modal-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.25rem;border-bottom:1px solid var(--border);flex-shrink:0}.admin-modal-title{margin:0;font-size:1.25rem;font-weight:700;color:var(--text)}.admin-modal-body{padding:1.25rem;overflow-y:auto}.profile-cosmetic-card-icon{width:56px;height:56px;border-radius:50%;overflow:hidden;background:var(--card);margin-bottom:.35rem;display:flex;align-items:center;justify-content:center;font-size:1.75rem}.profile-cosmetic-card-icon img{width:100%;height:100%;object-fit:cover}.profile-cosmetic-card-label{font-size:.8rem;font-weight:600;text-align:center;line-height:1.2}.profile-cosmetic-card-rarity{font-size:.7rem;color:var(--muted);margin-top:.15rem}.profile-hero-avatar-btn:hover,.profile-hero-frame-btn:hover{transform:scale(1.05);border-color:var(--accent);box-shadow:0 4px 20px #7c5cff4d}.nav-dropdown{position:relative}.nav-dropdown-panel{position:absolute;top:100%;left:auto;right:0;margin-top:.5rem;min-width:160px;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:.5rem;z-index:100;box-shadow:0 10px 40px #0000004d}@media (max-width: 768px){.nav-dropdown-panel{left:100%;right:auto;margin-left:.5rem;max-width:calc(100vw - 1rem)}}.nav-dropdown-item{display:flex;align-items:center;gap:.5rem;width:100%;padding:.5rem .75rem;border:none;border-radius:8px;background:transparent;color:var(--text);cursor:pointer;font-size:.95rem;text-align:left}.nav-dropdown-item:hover{background:var(--border)}.nav-dropdown-item.active{background:#7c5cff33;color:var(--accent)}.nav-icon-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;border:none;border-radius:10px;background:transparent;color:var(--muted);cursor:pointer;transition:background .2s,color .2s}.nav-icon-btn:hover{background:var(--border);color:var(--text)}.nav-icon-btn.logout:hover{background:#ef444433;color:var(--danger)}.nav-challenges-panel li:last-child{border-bottom:none!important}@keyframes lobby-card-in{0%{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.lobby-player-card{animation:lobby-card-in .4s ease-out backwards;transition:transform .2s ease,box-shadow .2s ease}.lobby-player-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px #00000040}
