.auth-container{min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:2rem 1.5rem;max-width:480px;margin:0 auto;gap:2rem}.auth-hero{text-align:center}.auth-hero h1{font-size:clamp(3rem,8vw,4.5rem);margin:0;font-weight:900;letter-spacing:-.05em;line-height:1.1}.auth-hero p{font-size:1rem;color:#94a3b8;margin-top:.5rem}.auth-card{width:100%;border-radius:24px;overflow:hidden}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid hsla(0,0%,100%,.05)}.auth-tab{padding:1rem;font-weight:700;font-size:.95rem;text-align:center;color:#64748b;background:transparent;border:none;cursor:pointer;transition:all .3s;position:relative}.auth-tab.active{color:#fff;background:rgba(99,102,241,.1)}.auth-tab.active:after{content:"";position:absolute;bottom:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#6366f1,#818cf8);border-radius:3px 3px 0 0}.auth-form{padding:1.5rem;display:flex;flex-direction:column;gap:1rem}.auth-input-group{position:relative;display:flex;flex-direction:row;align-items:center}.auth-input-icon{position:absolute;left:1rem;color:#475569;pointer-events:none;z-index:1}.auth-input{width:100%;padding:1rem 1rem 1rem 3rem;background:rgba(0,0,0,.3);border:1px solid hsla(0,0%,100%,.1);border-radius:16px;color:#fff;font-size:1rem;outline:none;transition:all .3s}.auth-input:focus{border-color:#6366f1;background:rgba(0,0,0,.5);box-shadow:0 0 0 3px rgba(99,102,241,.1)}.auth-input::-moz-placeholder{color:#475569}.auth-input::placeholder{color:#475569}.auth-submit{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:1rem 2rem;background:linear-gradient(135deg,#6366f1,#818cf8);color:#fff;border:none;border-radius:16px;font-size:1rem;font-weight:700;cursor:pointer;transition:all .3s;box-shadow:0 4px 15px rgba(99,102,241,.3);margin-top:.5rem}.auth-submit:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 25px rgba(99,102,241,.5);filter:brightness(1.1)}.auth-submit:disabled{opacity:.6;cursor:not-allowed}.auth-spinner{width:24px;height:24px;border:3px solid hsla(0,0%,100%,.3);border-top-color:#fff;border-radius:50%;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}.auth-switch{text-align:center;padding:1rem 1.5rem 1.5rem;color:#64748b;font-size:.875rem}.auth-switch button{color:#818cf8;background:none;border:none;font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:2px}.auth-switch button:hover{color:#a5b4fc}.auth-error{position:fixed;bottom:2rem;left:50%;transform:translateX(-50%);z-index:200;display:flex;align-items:center;gap:.75rem;padding:1rem 1.5rem;background:rgba(220,38,38,.9);backdrop-filter:blur(12px);color:#fff;border-radius:16px;border:1px solid hsla(0,0%,100%,.2);box-shadow:0 8px 30px rgba(0,0,0,.3);font-weight:600;font-size:.9rem}.auth-error button{background:none;border:none;color:#fff;cursor:pointer;padding:4px;border-radius:8px;transition:background .2s}.auth-error button:hover{background:hsla(0,0%,100%,.2)}.profile-bar{position:fixed;top:1rem;left:50%;transform:translateX(-50%);z-index:50;justify-content:space-between;gap:1rem;padding:.75rem 1.25rem;border-radius:20px;max-width:400px;width:calc(100% - 3rem)}.profile-bar,.profile-info{display:flex;align-items:center}.profile-info{gap:.75rem}.profile-avatar{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#6366f1,#818cf8);display:flex;align-items:center;justify-content:center;color:#fff;overflow:hidden;flex-shrink:0;border:2px solid rgba(99,102,241,.3)}.profile-avatar img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.profile-details{display:flex;flex-direction:column;gap:2px}.profile-name{font-weight:800;font-size:.95rem;color:#fff}.profile-stats-mini{display:flex;gap:.5rem}.stat-badge{display:flex;align-items:center;gap:3px;font-size:.7rem;font-weight:700;padding:1px 6px;border-radius:6px}.stat-badge.win{background:rgba(34,197,94,.15);color:#4ade80}.stat-badge.loss{background:rgba(239,68,68,.15);color:#f87171}.logout-btn{padding:.5rem;border-radius:12px;background:hsla(0,0%,100%,.05);border:1px solid hsla(0,0%,100%,.1);color:#94a3b8;cursor:pointer;transition:all .3s}.logout-btn:hover{background:rgba(239,68,68,.15);color:#f87171;border-color:rgba(239,68,68,.3)}.home-container{min-height:100vh;justify-content:center;padding:2rem 1.5rem;max-width:600px;margin:0 auto;gap:2.5rem}.hero-section,.home-container{display:flex;flex-direction:column;align-items:center}.hero-section{margin-top:6rem;text-align:center;gap:.5rem}.hero-section h1{font-size:clamp(3rem,8vw,4.5rem);margin:0;font-weight:900;letter-spacing:-.05em;line-height:1.1}.hero-section p{font-size:clamp(1rem,3vw,1.2rem);color:#94a3b8;font-weight:400;max-width:80%}.main-card{width:100%;border-radius:24px;padding:clamp(1.5rem,5vw,2.5rem);display:flex;flex-direction:column;gap:1.5rem;position:relative}.main-card:before{content:"";position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;background:linear-gradient(135deg,rgba(99,102,241,.2),rgba(168,85,247,.1),transparent 60%);border-radius:26px;z-index:-1;pointer-events:none}.input-wrapper{display:flex;flex-direction:column;gap:.5rem}.input-wrapper label{font-size:.875rem;font-weight:600;color:#94a3b8;text-transform:uppercase;letter-spacing:.05em;padding-left:.5rem}.modern-input{background:rgba(0,0,0,.2);border:1px solid var(--glass-border);padding:1rem 1.25rem;border-radius:16px;color:#fff;font-size:1rem;outline:none;transition:all .3s cubic-bezier(.4,0,.2,1);width:100%}.modern-input:focus{border-color:var(--primary);background:rgba(0,0,0,.4);box-shadow:0 0 0 3px rgba(99,102,241,.1)}.modern-input::-moz-placeholder{color:#475569}.modern-input::placeholder{color:#475569}.btn-primary,.btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:1rem 1.5rem;border-radius:16px;font-weight:600;font-size:1rem;cursor:pointer;transition:all .25s cubic-bezier(.4,0,.2,1);border:none;text-align:center}.btn-primary{background:linear-gradient(135deg,var(--primary),#818cf8);color:#fff;box-shadow:0 4px 12px rgba(99,102,241,.25)}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 20px rgba(99,102,241,.4);filter:brightness(1.1)}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-primary:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn-secondary{background:var(--secondary);color:#fff;border:1px solid var(--glass-border)}.btn-secondary:hover:not(:disabled){background:var(--secondary-hover);border-color:hsla(0,0%,100%,.2);transform:translateY(-2px)}.btn-secondary:active:not(:disabled){transform:translateY(0)}.btn-group{display:flex;gap:1rem}.btn-group>button{flex:1}.divider{display:flex;align-items:center;text-align:center;color:#475569;font-size:.875rem;font-weight:500;margin:.5rem 0}.divider:after,.divider:before{content:"";flex:1;border-bottom:1px solid var(--glass-border)}.divider:not(:empty):before{margin-right:1em}.divider:not(:empty):after{margin-left:1em}.join-row{display:flex;gap:.75rem}.room-list-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:1rem;padding-top:1rem}.room-list-header h3{font-size:1.25rem;font-weight:700;margin:0;color:#e2e8f0}.room-list{display:flex;flex-direction:column;gap:.75rem;max-height:250px;overflow-y:auto;padding-right:4px}.room-item{background:rgba(0,0,0,.2);border:1px solid var(--glass-border);border-radius:16px;padding:1rem 1.25rem;display:flex;justify-content:space-between;align-items:center;transition:all .2s ease}.room-item:hover{background:hsla(0,0%,100%,.03);border-color:hsla(0,0%,100%,.1);transform:translateX(4px)}.room-info{display:flex;flex-direction:column;gap:.25rem}.room-id{font-weight:700;font-size:1.1rem;color:#fff;gap:.5rem}.room-id,.room-players{display:flex;align-items:center}.room-players{font-size:.875rem;color:#94a3b8;gap:.25rem}@media (max-width:640px){.btn-group,.join-row{flex-direction:column}.join-row button{width:100%}.home-container{padding-top:1rem;justify-content:flex-start}}@keyframes slide-up{0%{transform:translate(-50%,100%);opacity:0}to{transform:translate(-50%);opacity:1}}.animate-slide-up{animation:slide-up .4s cubic-bezier(.16,1,.3,1)}.game-container{box-sizing:border-box;gap:1rem;max-width:1400px;margin:0 auto;animation:fadeScaleIn .4s ease-out;padding:clamp(.5rem,2vw,1.5rem) clamp(.5rem,2vw,1.5rem) env(safe-area-inset-bottom)}.game-container,.lobby-container{display:flex;flex-direction:column;min-height:100vh}.lobby-container{align-items:center;justify-content:center;padding:1rem}.game-layout{display:grid;grid-template-columns:280px 1fr 280px;gap:clamp(1rem,2vw,2rem);flex:1}.sidebar{gap:1.5rem;height:100%}.board-area,.sidebar{display:flex;flex-direction:column}.board-area{align-items:center;gap:clamp(1rem,3vw,2rem);width:100%;max-width:100%}.board-wrapper{width:100%;display:flex;justify-content:center;position:relative}.board{display:grid;grid-template-columns:repeat(15,1fr);grid-template-rows:repeat(15,1fr);gap:2px;background:var(--background-end);padding:4px;border-radius:8px;box-shadow:0 20px 40px rgba(0,0,0,.6);border:1px solid var(--glass-border);width:100%;max-width:650px;aspect-ratio:1/1}.cell{background:#1e293b;border-radius:2px;display:flex;align-items:center;justify-content:center;font-weight:700;cursor:pointer;transition:all .2s ease;position:relative;overflow:hidden}.cell:hover{filter:brightness(1.2);transform:scale(.95)}.cell-label{font-size:clamp(.4rem,1.5vw,.7rem);opacity:.6;text-transform:uppercase;font-weight:800;pointer-events:none}.cell.center{background:#ea580c;box-shadow:inset 0 0 15px rgba(255,165,0,.4)}.special-te{background:linear-gradient(135deg,#f87171,#dc2626);color:#fff;box-shadow:inset 0 0 10px rgba(0,0,0,.2),0 0 5px rgba(220,38,38,.4)}.special-de{background:linear-gradient(135deg,#fbbf24,#d97706);color:#fff;box-shadow:inset 0 0 10px rgba(0,0,0,.2),0 0 5px rgba(217,119,6,.4)}.special-tp{background:linear-gradient(135deg,#60a5fa,#2563eb);color:#fff;box-shadow:inset 0 0 10px rgba(0,0,0,.2),0 0 5px rgba(37,99,235,.4)}.special-dp{background:linear-gradient(135deg,#fb923c,#ea580c);color:#fff;box-shadow:inset 0 0 10px rgba(0,0,0,.2),0 0 5px rgba(234,88,12,.4)}.special-label{font-size:clamp(.5rem,1.2vw,.8rem);font-weight:900;text-transform:uppercase;letter-spacing:-.05em;opacity:.9}.tile{width:100%;height:100%;background:linear-gradient(135deg,#fef08a,#eab308);color:#451a03;border-radius:3px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;box-shadow:inset 0 -3px 0 rgba(0,0,0,.15),0 2px 5px rgba(0,0,0,.3);animation:fadeScaleIn .2s cubic-bezier(.34,1.56,.64,1)}.tile-value{font-size:clamp(.9rem,3vw,1.4rem);font-weight:900;line-height:1}.tile-score{font-size:clamp(.4rem,1.2vw,.6rem);position:absolute;bottom:2px;right:4px;font-weight:700}.rack-area-fixed{position:fixed;bottom:0;left:0;width:100%;z-index:40;padding:1rem;pointer-events:none}.rack-container{max-width:600px;margin:0 auto;padding:1rem 1.5rem;border-radius:20px;box-shadow:0 10px 40px rgba(0,0,0,.5);pointer-events:auto;background:rgba(15,23,42,.95);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.action-btn:active:not(:disabled){transform:translateY(1px) scale(.98)}.action-btn.primary{background:var(--primary);color:#fff;box-shadow:var(--shadow-glow);position:relative;overflow:hidden}.action-btn.primary:after{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(45deg,transparent,hsla(0,0%,100%,.1),transparent);transform:rotate(45deg);animation:shine 3s infinite}@keyframes shine{0%{transform:translateX(-100%) rotate(45deg)}20%,to{transform:translateX(100%) rotate(45deg)}}.action-btn.primary:hover:not(:disabled){filter:brightness(1.1);transform:translateY(-2px);box-shadow:0 8px 25px rgba(99,102,241,.5)}.action-btn.secondary{background:hsla(0,0%,100%,.05);color:#cbd5e1;border-color:hsla(0,0%,100%,.1)}.action-btn.secondary:hover:not(:disabled){background:hsla(0,0%,100%,.1);color:#fff}.action-btn:disabled{opacity:.4;cursor:not-allowed;filter:grayscale(1)}.bag-card-icon{width:32px;height:32px;background:linear-gradient(135deg,#fef08a,#eab308);border-radius:6px;align-items:center;box-shadow:0 4px 10px rgba(0,0,0,.3)}.bag-card-icon,.rack{display:flex;justify-content:center}.rack{gap:clamp(4px,1vw,12px);width:100%}.rack-tile{width:clamp(35px,8vw,55px);height:clamp(35px,8vw,55px);cursor:pointer;transition:transform .2s cubic-bezier(.34,1.56,.64,1);border-radius:6px}.rack-tile:hover{transform:translateY(-4px) scale(1.05)}.rack-tile.active{transform:translateY(-8px) scale(1.1);box-shadow:0 10px 20px rgba(0,0,0,.3),0 0 20px rgba(99,102,241,.7);border:3px solid #fff;z-index:10;animation:pulse-selection 1.5s infinite}@keyframes pulse-selection{0%{border-color:#fff;box-shadow:0 0 15px rgba(99,102,241,.7)}50%{border-color:var(--primary);box-shadow:0 0 30px rgba(99,102,241,.9)}to{border-color:#fff;box-shadow:0 0 15px rgba(99,102,241,.7)}}.rack.swap-mode .rack-tile.active{border-color:#f59e0b;box-shadow:0 10px 20px rgba(0,0,0,.3),0 0 15px rgba(245,158,11,.4);transform:translateY(-4px) scale(1.05)}.rack-tile.swapping{border:3px solid #f59e0b!important;background:linear-gradient(135deg,#451a03,#78350f)!important;color:#fbbf24!important;box-shadow:0 0 20px rgba(245,158,11,.5)!important;opacity:.8!important;transform:scale(.9) translateY(4px)}.rack-tile.reordering{transform:translateY(-12px) scale(1.15);box-shadow:0 15px 30px rgba(0,0,0,.4),0 0 20px rgba(99,102,241,.6);border:2px solid var(--primary);z-index:10}.rack.swap-mode .rack-tile:not(.active){opacity:.6;filter:grayscale(.4)}.player-card{padding:1.25rem;border-radius:16px;background:var(--glass-bg);border:1px solid var(--glass-border);transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.player-card.active{border-color:var(--primary);background:rgba(99,102,241,.1);box-shadow:var(--shadow-glow);transform:translateX(4px)}.player-card.active:before{content:"";position:absolute;top:0;left:0;bottom:0;width:4px;background:var(--primary)}.player-card.low-time.active{border-color:#ef4444;animation:pulseRed 1s infinite alternate}.player-card.low-time.active .text-indigo-400{color:#f87171!important}.player-card.overtime.active{border-color:#ef4444;animation:pulseRedStrong .5s infinite alternate;background:rgba(239,68,68,.1)}.player-card.overtime .text-red-500{text-shadow:0 0 10px rgba(239,68,68,.5)}@keyframes pulseRedStrong{0%{box-shadow:0 0 15px rgba(239,68,68,.3)}to{box-shadow:0 0 35px rgba(239,68,68,.7)}}@keyframes pulseRed{0%{box-shadow:0 0 10px rgba(239,68,68,.2)}to{box-shadow:0 0 25px rgba(239,68,68,.5)}}.turn-badge{font-size:.65rem;background:var(--primary);color:#fff;padding:.2rem .5rem;border-radius:999px;text-transform:uppercase;letter-spacing:.05em;font-weight:700;animation:pulseGlow 2s infinite}.actions-sidebar{display:flex;flex-direction:column;gap:1.5rem;height:-moz-min-content;height:min-content}.actions-panel,.legend-panel{position:sticky;top:1.5rem;border-radius:24px;border:1px solid var(--glass-border);box-shadow:0 20px 50px rgba(0,0,0,.3);padding:1.5rem;background:var(--glass-bg);backdrop-filter:blur(20px)}.actions-panel{display:flex;flex-direction:column;gap:1.5rem}.blank-option-btn{display:flex;align-items:center;justify-content:center;background:var(--glass-bg);border:1px solid var(--glass-border);color:#fff;min-height:3rem;font-weight:800;border-radius:12px;transition:all .2s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 12px rgba(0,0,0,.2);-webkit-user-select:none;-moz-user-select:none;user-select:none}.blank-option-btn:hover{transform:translateY(-2px) scale(1.05);background:hsla(0,0%,100%,.15);border-color:hsla(0,0%,100%,.3);box-shadow:0 8px 20px rgba(0,0,0,.4)}.blank-option-btn:active{transform:translateY(1px) scale(.95)}.blank-option-btn.number{background:linear-gradient(135deg,hsla(0,0%,100%,.05),hsla(0,0%,100%,.1))}.blank-option-btn.operator{background:linear-gradient(135deg,rgba(99,102,241,.1),rgba(99,102,241,.2));border-color:rgba(99,102,241,.3);color:#a5b4fc}.blank-option-btn.operator:hover{background:linear-gradient(135deg,rgba(99,102,241,.2),rgba(99,102,241,.3));border-color:#818cf8;color:#fff}.blank-option-btn.equals{background:linear-gradient(135deg,rgba(16,185,129,.1),rgba(16,185,129,.2));border-color:rgba(16,185,129,.3);color:#6ee7b7}.blank-option-btn.secondary{background:linear-gradient(135deg,rgba(239,68,68,.1),rgba(239,68,68,.2));border-color:rgba(239,68,68,.3);color:#fca5a5;font-size:.75rem;letter-spacing:.1em;text-transform:uppercase}@media (max-width:1200px){.game-layout{grid-template-columns:240px 1fr 240px;gap:1rem}}@media (max-width:1024px){.game-layout{grid-template-columns:1fr;display:flex;flex-direction:column}.sidebar{width:100%;order:2}.board-area{order:1}.actions-sidebar{order:3;width:100%}.actions-sidebar,.sidebar{width:100%}.actions-panel,.legend-panel{position:static;margin-top:1rem;border-radius:16px;padding:1.25rem}.actions-panel .grid-cols-2{gap:.5rem}.info-card{display:block;opacity:.8}.players-mobile-row{display:flex;gap:.5rem;width:100%;justify-content:space-between}.player-card{flex:1;min-width:0;padding:.75rem;border-radius:12px}.player-card.active:before{width:100%;height:3px;bottom:0;top:auto}.actions-sidebar{margin-top:0}.actions-sidebar .glass-panel{border-radius:16px;padding:1rem;gap:1rem}.actions-sidebar .grid-cols-2{gap:.5rem}.actions-sidebar button{font-size:.8rem;padding:.75rem .5rem}.rack-area-fixed{padding:.5rem}.rack-container{max-width:100%;border-radius:16px;padding:.75rem}}