.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-content{background:#1a1a1a;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:2.5rem;max-width:450px;width:100%;position:relative;box-shadow:0 20px 60px #00000080}.modal-close{position:absolute;top:1rem;right:1rem;background:transparent;border:none;color:#888;font-size:2rem;cursor:pointer;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:8px;transition:all .2s;line-height:1}.modal-close:hover{background:#ffffff0d;color:#fff}.modal-title{font-size:2rem;font-weight:700;margin-bottom:2rem;color:#fff;text-align:center}.auth-form{display:flex;flex-direction:column;gap:1.5rem}.form-group label{font-size:.875rem;font-weight:600;color:#b8b8b8;text-transform:uppercase;letter-spacing:.05em}.form-group input{padding:.875rem 1rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#fff;font-size:1rem;transition:all .2s}.form-group input:focus{outline:none;border-color:#667eea;background:#ffffff14}.form-group input::placeholder{color:#666}.error-message{padding:.875rem 1rem;background:#ef44441a;border:1px solid rgba(239,68,68,.3);border-radius:8px;color:#fca5a5;font-size:.875rem}.submit-button{padding:1rem 2rem;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:8px;color:#fff;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s;box-shadow:0 4px 15px #667eea66;margin-top:.5rem}.submit-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #667eea99}.submit-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.divider{position:relative;text-align:center;margin:1.5rem 0 1rem}.divider:before,.divider:after{content:"";position:absolute;top:50%;width:45%;height:1px;background:#ffffff1a}.divider:before{left:0}.divider:after{right:0}.divider span{color:#666;font-size:.875rem;background:#1a1a1a;padding:0 1rem;position:relative}.google-signin-container{display:flex;justify-content:center;margin-bottom:1rem}.toggle-mode{text-align:center;color:#888;font-size:.875rem;margin-top:.5rem}.toggle-link{background:none;border:none;color:#667eea;cursor:pointer;font-weight:600;padding:0;text-decoration:underline;font-size:inherit}.toggle-link:hover{color:#764ba2}@media (max-width: 768px){.modal-content{padding:2rem 1.5rem}.modal-title{font-size:1.75rem}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:#0a0a0a;color:#fff;overflow-x:hidden}.landing-page{min-height:100vh;position:relative;display:flex;flex-direction:column}.header{position:absolute;top:0;left:0;right:0;z-index:100;padding:2rem 3rem;display:flex;justify-content:space-between;align-items:center}.logo{font-size:1.5rem;font-weight:700;letter-spacing:.05em;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.sign-in-button{padding:.75rem 2rem;font-size:1rem;font-weight:600;color:#fff;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:8px;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #667eea66}.sign-in-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea99}.user-menu{display:flex;align-items:center;gap:1rem}.user-name{font-size:1rem;font-weight:600;color:#fff}.sign-out-button{padding:.75rem 1.5rem;font-size:.875rem;font-weight:600;color:#888;background:transparent;border:1px solid rgba(255,255,255,.2);border-radius:8px;cursor:pointer;transition:all .3s ease}.sign-out-button:hover{color:#fff;border-color:#fff6;background:#ffffff0d}.hero{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:6rem 2rem 4rem;position:relative}.hero:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(ellipse at top,rgba(102,126,234,.15) 0%,transparent 50%),radial-gradient(ellipse at bottom,rgba(118,75,162,.15) 0%,transparent 50%);z-index:-1}.hero-content{max-width:900px;text-align:center;z-index:1}.hero-title{font-size:clamp(2.5rem,8vw,5rem);font-weight:900;margin-bottom:1.5rem;line-height:1.1;background:linear-gradient(135deg,#fff,#a8a8a8);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.02em}.hero-subtitle{font-size:clamp(1.25rem,3vw,1.75rem);color:#b8b8b8;margin-bottom:3rem;line-height:1.5;font-weight:400}.cta-buttons{display:flex;gap:1.5rem;justify-content:center;flex-wrap:wrap}.cta-primary,.cta-secondary{padding:1rem 2.5rem;font-size:1.125rem;font-weight:600;border-radius:10px;cursor:pointer;transition:all .3s ease;border:2px solid transparent}.cta-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 8px 25px #667eea66}.cta-primary:hover{transform:translateY(-3px);box-shadow:0 12px 35px #667eea99}.cta-secondary{background:transparent;color:#fff;border-color:#ffffff4d}.cta-secondary:hover{border-color:#fff9;background:#ffffff0d}.features{padding:4rem 2rem;background:#ffffff05}.features-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem}.feature-card{padding:2rem;background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:12px;transition:all .3s ease}.feature-card:hover{background:#ffffff0d;border-color:#667eea80;transform:translateY(-5px)}.feature-icon{font-size:2.5rem;margin-bottom:1rem}.feature-title{font-size:1.5rem;font-weight:700;margin-bottom:.75rem;color:#fff}.feature-description{color:#b8b8b8;line-height:1.6}.footer{padding:2rem;text-align:center;color:#666;font-size:.875rem;border-top:1px solid rgba(255,255,255,.05)}@media (max-width: 768px){.header{padding:1.5rem}.hero{padding:5rem 1.5rem 3rem}.cta-buttons{flex-direction:column;align-items:stretch}.cta-primary,.cta-secondary{width:100%;max-width:300px;margin:0 auto}}.dashboard{display:grid;grid-template-areas:"header header" "sidebar main";grid-template-columns:240px 1fr;grid-template-rows:64px 1fr;height:100vh;background:#0a0a0a;color:#fff}.dashboard-top-header{grid-area:header;background:#1a1a1a;border-bottom:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:space-between;padding:0 2rem}.dashboard-logo{font-size:1.5rem;font-weight:700;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin:0}.header-stats{display:flex;align-items:center;gap:1.5rem;margin-left:auto;margin-right:2rem}.header-stat{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:#ffffff0d;border-radius:8px}.header-stat-icon{font-size:1.125rem}.header-stat-value{font-weight:600;font-size:.95rem;color:#fff}.header-actions{display:flex;align-items:center;gap:1rem}.icon-button{width:40px;height:40px;border-radius:8px;border:none;background:#ffffff0d;color:#fff;font-size:1.25rem;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center}.icon-button:hover{background:#ffffff1a}.profile-dropdown{position:relative}.profile-button{display:flex;align-items:center;gap:.75rem;padding:.5rem 1rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#fff;cursor:pointer;transition:all .2s}.profile-button:hover{background:#ffffff14;border-color:#fff3}.profile-avatar-small{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;font-size:.875rem;font-weight:700}.profile-name-small{font-weight:500;font-size:.95rem}.dropdown-arrow{font-size:.625rem;color:#888;transition:transform .2s}.dropdown-overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:999}.dropdown-menu{position:absolute;top:calc(100% + .5rem);right:0;min-width:240px;background:#1a1a1a;border:1px solid rgba(255,255,255,.1);border-radius:12px;box-shadow:0 8px 24px #00000080;z-index:1000;overflow:hidden}.dropdown-header{padding:1.25rem;display:flex;align-items:center;gap:1rem;background:#ffffff05}.dropdown-avatar{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;font-size:1.25rem;font-weight:700}.dropdown-user-info{flex:1;min-width:0}.dropdown-user-name{font-weight:600;font-size:.95rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dropdown-user-rank{font-size:.75rem;color:#888;text-transform:uppercase;letter-spacing:.05em}.dropdown-divider{height:1px;background:#ffffff1a;margin:.5rem 0}.dropdown-item{width:100%;padding:.875rem 1.25rem;background:none;border:none;color:#fff;font-size:.95rem;text-align:left;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:.75rem}.dropdown-item:hover{background:#ffffff0d}.dropdown-item.danger{color:#f87171}.dropdown-item.danger:hover{background:#f871711a}.dropdown-item-icon{font-size:1.125rem;width:24px;display:flex;justify-content:center}.dashboard-sidebar{grid-area:sidebar;background:#1a1a1a;border-right:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column;overflow-y:auto}.dashboard-nav{flex:1;padding:1rem 0}.nav-item{display:flex;align-items:center;gap:.875rem;padding:.875rem 1.5rem;color:#888;text-decoration:none;transition:all .2s;border-left:3px solid transparent}.nav-item:hover{background:#ffffff0d;color:#fff}.nav-item.active{background:#667eea1a;color:#fff;border-left-color:#667eea}.nav-icon{font-size:1.25rem}.nav-label{font-weight:500}.nav-item-admin{margin-top:auto;border-top:1px solid rgba(255,255,255,.1);padding-top:1rem}.nav-item-admin.active{background:#f973161a;border-left-color:#f97316;color:#f97316}.dashboard-main{grid-area:main;overflow-y:auto;padding:2rem}@media (max-width: 968px){.dashboard{grid-template-areas:"header" "main";grid-template-columns:1fr;grid-template-rows:64px 1fr}.dashboard-sidebar{display:none}.dashboard-top-header{padding:0 1rem}.dashboard-logo{font-size:1.25rem}.header-stats,.profile-name-small{display:none}.dashboard-main{padding:1rem}}.hero-banner{background:linear-gradient(135deg,#667eea1a,#764ba21a);border:1px solid rgba(102,126,234,.2);border-radius:16px;padding:3rem;display:grid;grid-template-columns:1fr 1fr;gap:3rem;margin-bottom:2rem;align-items:center}.hero-content{display:flex;flex-direction:column;gap:1.5rem}.hero-title{font-size:3rem;font-weight:700;line-height:1.1;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.hero-subtitle{font-size:1.25rem;color:#b8b8b8;line-height:1.5}.hero-cta{padding:1rem 2.5rem;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:8px;color:#fff;font-size:1.125rem;font-weight:600;cursor:pointer;transition:all .3s;box-shadow:0 4px 15px #667eea66;width:fit-content}.hero-cta:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea99}.hero-image-placeholder{aspect-ratio:16 / 9;background:#ffffff0d;border:2px dashed rgba(255,255,255,.1);border-radius:12px;display:flex;align-items:center;justify-content:center}.placeholder-text{color:#666;font-size:1.5rem;font-weight:600}.banner-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.5rem;margin-bottom:2rem}.banner-card{background:#1a1a1a;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:2rem;display:flex;flex-direction:column;gap:1rem;transition:all .3s}.banner-card:hover{border-color:#667eea4d;transform:translateY(-2px)}.banner-card.featured{background:linear-gradient(135deg,#667eea0d,#764ba20d);border-color:#667eea4d}.banner-icon{font-size:2.5rem}.banner-title{font-size:1.25rem;font-weight:600;color:#fff}.banner-description{color:#888;line-height:1.5;flex:1}.banner-button{padding:.75rem 1.5rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#fff;font-weight:500;cursor:pointer;transition:all .2s}.banner-button:hover{background:#ffffff14;border-color:#667eea80}.quick-stats{margin-bottom:2rem}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem}.stat-card{background:#1a1a1a;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:1.5rem;display:flex;align-items:center;gap:1.5rem}.stat-icon{font-size:2.5rem}.stat-content{display:flex;flex-direction:column;gap:.25rem}.stat-label{color:#888;font-size:.875rem;text-transform:uppercase;letter-spacing:.05em}.stat-value{font-size:1.75rem;font-weight:700;color:#fff}.recent-activity{background:#1a1a1a;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:2rem}@media (max-width: 968px){.hero-banner{grid-template-columns:1fr;padding:2rem}.hero-title{font-size:2rem}.banner-grid{grid-template-columns:1fr}.stats-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 640px){.stats-grid{grid-template-columns:1fr}}.lobby-room{max-width:800px;margin:0 auto;background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:2rem}.lobby-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:1px solid rgba(255,255,255,.1)}.lobby-title{font-size:1.75rem;font-weight:700;color:#fff;margin:0 0 .5rem}.lobby-id{font-size:.875rem;color:#888;font-family:monospace;margin:0}.lobby-game-type{font-size:1rem;font-weight:600;padding:.5rem 1rem;background:#667eea26;border:1px solid #667eea;border-radius:8px;color:#fff}.lobby-content{display:grid;grid-template-columns:2fr 1fr;gap:2rem;margin-bottom:2rem}.players-section{display:flex;flex-direction:column}.section-title{font-size:.875rem;font-weight:600;color:#888;text-transform:uppercase;letter-spacing:.05em;margin:0 0 1rem}.players-list{display:flex;flex-direction:column;gap:.75rem}.player-item{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:#ffffff0d;border:2px solid rgba(255,255,255,.1);border-radius:8px;transition:all .2s}.player-item.ready{border-color:#10b981;background:#10b9811a}.player-item.current{border-color:#667eea;background:#667eea1a}.player-item.empty{opacity:.4;border-style:dashed}.player-info{display:flex;align-items:center;gap:.75rem}.player-icon{font-size:1.5rem;line-height:1}.player-name{font-size:1rem;font-weight:600;color:#fff}.player-name.empty-text{color:#666;font-style:italic}.player-status{display:flex;gap:.5rem}.status-badge{font-size:.75rem;font-weight:600;padding:.375rem .75rem;border-radius:6px;text-transform:uppercase;letter-spacing:.05em}.status-badge.ready{background:#10b981;color:#fff}.status-badge.waiting{background:#ffffff1a;color:#888}.lobby-settings-section{display:flex;flex-direction:column}.settings-list{background:#0003;border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:1rem}.setting-row{display:flex;justify-content:space-between;align-items:center;padding:.75rem 0;border-bottom:1px solid rgba(255,255,255,.05)}.setting-row:last-child{border-bottom:none}.setting-label{font-size:.875rem;font-weight:600;color:#888}.setting-value{font-size:.875rem;font-weight:600;color:#fff}.lobby-actions{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding-top:1.5rem;border-top:1px solid rgba(255,255,255,.1)}.lobby-actions-right{display:flex;gap:.75rem}.button-primary,.button-secondary,.button-ready,.button-fill-ai{padding:.875rem 1.5rem;font-size:1rem;font-weight:600;border-radius:8px;border:none;cursor:pointer;transition:all .2s}.button-primary{background:#667eea;color:#fff}.button-primary:hover:not(:disabled){background:#5568d3}.button-primary:disabled{opacity:.5;cursor:not-allowed}.button-secondary{background:#ffffff0d;color:#fff;border:1px solid rgba(255,255,255,.2)}.button-secondary:hover{background:#ffffff14}.button-ready{background:#ffffff0d;color:#fff;border:2px solid rgba(255,255,255,.2)}.button-ready:hover{background:#10b98126;border-color:#10b981}.button-ready.active{background:#10b98133;border-color:#10b981;color:#10b981}.button-fill-ai{background:#667eea26;color:#667eea;border:1px solid #667eea}.button-fill-ai:hover{background:#667eea40}@media (max-width: 768px){.lobby-room{padding:1.5rem}.lobby-content{grid-template-columns:1fr}.lobby-actions{flex-direction:column}.lobby-actions-right{width:100%;flex-direction:column}.button-primary,.button-secondary,.button-ready,.button-fill-ai{width:100%}}.card{background:#1a1a1a;border:2px solid rgba(255,255,255,.2);border-radius:12px;overflow:hidden;transition:all .3s;cursor:pointer;display:flex;flex-direction:column;height:100%}.card:hover{transform:translateY(-4px);box-shadow:0 8px 24px #00000080;border-color:#667eea!important}.card-header{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;color:#fff}.card-name{font-weight:700;font-size:1rem;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card-cost{font-weight:700;font-size:1.25rem;background:#0000004d;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-left:.5rem}.card-image{aspect-ratio:3 / 2;position:relative;display:flex;align-items:center;justify-content:center;border-bottom:1px solid rgba(255,255,255,.1)}.card-type-badge{font-size:.75rem;font-weight:700;letter-spacing:.05em;color:#fff9}.card-stats{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.75rem 1rem;background:#ffffff08;border-bottom:1px solid rgba(255,255,255,.1)}.stat{display:flex;align-items:center;gap:.5rem}.stat-label{font-size:.75rem;color:#888;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.stat-value{font-size:1.25rem;font-weight:700;color:#fff}.card-keywords-inline{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center;flex:1}.keyword-badge{font-size:.75rem;font-weight:500;padding:.25rem .625rem;border-radius:6px;background:#ffffff1a;color:#fff}.card-aspects{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}.aspect-badge{font-size:.75rem;font-weight:600;padding:.25rem .625rem;border-radius:6px;color:#fff;text-transform:uppercase;letter-spacing:.05em}.card-text{padding:.75rem 1rem;font-size:.875rem;line-height:1.5;color:#ccc;flex:1;border-top:1px solid rgba(255,255,255,.1)}.card-footer{padding:.75rem 1rem;border-top:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;align-items:center;gap:.5rem}.card-rarity{font-size:.75rem;font-weight:700;letter-spacing:.05em}.card-preview-container{position:fixed;z-index:1000;display:flex;gap:1.5rem;pointer-events:none;filter:drop-shadow(0 10px 30px rgba(0,0,0,.5))}.card-preview-card{width:350px;background:linear-gradient(135deg,#2a2a2a,#1a1a1a);border:3px solid;border-radius:12px;overflow:hidden;box-shadow:0 10px 40px #0009}.keyword-definitions{width:280px;background:#1a1a1af2;border:1px solid rgba(212,175,55,.3);border-radius:8px;padding:1rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.keyword-definitions h3{margin:0 0 .75rem;font-size:.9rem;color:#d4af37;text-transform:uppercase;letter-spacing:.05em;font-weight:600}.keyword-definition{margin-bottom:.75rem;padding-bottom:.75rem;border-bottom:1px solid rgba(255,255,255,.1)}.keyword-definition:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none}.keyword-name{display:block;font-weight:600;color:#d4af37;margin-bottom:.25rem;font-size:.9rem}.keyword-description{display:block;color:#ccc;font-size:.85rem;line-height:1.4}@media (max-width: 1400px){.card-preview-container{flex-direction:column;max-width:350px}.keyword-definitions{width:100%}}.draft{width:100%;max-width:1600px;margin:0 auto;padding:2rem}.draft-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;gap:1rem}.loading-spinner{width:48px;height:48px;border:4px solid rgba(212,175,55,.1);border-top-color:#d4af37;border-radius:50%;animation:spin 1s linear infinite}.draft-header{margin-bottom:2rem;display:flex;justify-content:space-between;align-items:flex-start}.draft-info h1{margin:0 0 .5rem;color:#fff}.draft-settings{display:flex;align-items:center}.toggle-switch{display:flex;align-items:center;gap:.75rem;cursor:pointer;-webkit-user-select:none;user-select:none}.toggle-switch input{display:none}.toggle-track{position:relative;width:48px;height:26px;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:13px;transition:all .2s ease}.toggle-track:after{content:"";position:absolute;top:2px;left:2px;width:20px;height:20px;background:#666;border-radius:50%;transition:all .2s ease}.toggle-switch input:checked+.toggle-track{background:#d4af374d;border-color:#d4af37}.toggle-switch input:checked+.toggle-track:after{left:24px;background:#d4af37}.toggle-switch:hover .toggle-track{border-color:#d4af3780}.toggle-label-text{color:#999;font-size:.9rem;transition:color .2s ease}.toggle-switch input:checked~.toggle-label-text{color:#d4af37}.draft-progress{display:flex;gap:2rem;color:#999;font-size:.9rem}.pack-number,.pick-number{color:#d4af37;font-weight:600}.picks-total{margin-left:auto;color:#999}.draft-main{display:grid;grid-template-columns:2fr 1fr;gap:2rem}.pack-section{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:1.5rem}.pack-section h2{margin:0 0 1rem;color:#fff;font-size:1.1rem}.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem;margin-bottom:1.5rem}.card-wrapper{cursor:pointer;border-radius:12px;transition:all .2s ease;padding:4px;margin:-4px}.card-wrapper.selected{background:linear-gradient(135deg,#d4af374d,#d4af371a);border:2px solid #d4af37;box-shadow:0 0 20px #d4af3780;transform:scale(1.02)}.pack-actions{margin-top:1.5rem;display:flex;justify-content:center}.pack-actions .button-primary{min-width:200px}.picks-section{background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:1.5rem;max-height:800px;overflow-y:auto}.picks-section h2{margin:0 0 1rem;color:#fff;font-size:1.1rem;position:sticky;top:0;background:#1a1a1af2;padding-bottom:1rem;z-index:1}.picks-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem}.pick-item{opacity:.95}.empty-text{color:#666;text-align:center;padding:2rem;font-style:italic}.pack-transition{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;gap:1.5rem;animation:fadeIn .3s ease-in}.transition-spinner{width:60px;height:60px;border:4px solid rgba(212,175,55,.2);border-top-color:#d4af37;border-radius:50%;animation:spin .8s linear infinite}.transition-text{color:#d4af37;font-size:1.1rem;font-weight:500;animation:pulse 1.5s ease-in-out infinite}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}@media (max-width: 1024px){.draft-main{grid-template-columns:1fr}.picks-section{max-height:400px}}.deck-finalization{width:100%;max-width:1600px;margin:0 auto;padding:2rem}.finalization-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:1px solid rgba(255,255,255,.1)}.finalization-info h1{margin:0 0 .5rem;color:#fff;font-size:1.8rem}.finalization-subtitle{margin:0;color:#999;font-size:.95rem}.finalization-actions{display:flex;gap:1rem;align-items:center}.finalization-main{width:100%}.cards-by-cost{display:flex;flex-direction:column;gap:2rem}.cost-group{background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:1.5rem}.cost-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:.75rem;border-bottom:1px solid rgba(255,255,255,.1)}.cost-label{font-size:1.1rem;font-weight:600;color:#d4af37}.cost-count{font-size:.9rem;color:#999}.cost-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem}.card-wrapper{position:relative;cursor:pointer;border-radius:12px;transition:all .2s ease;padding:4px;margin:-4px}.card-wrapper:hover{transform:translateY(-4px);box-shadow:0 8px 20px #d4af374d}.card-wrapper.selected{background:linear-gradient(135deg,#4caf504d,#4caf501a);border:2px solid #4caf50;box-shadow:0 0 20px #4caf5080}.card-wrapper.disabled{opacity:.5;cursor:not-allowed}.card-wrapper.disabled:hover{transform:none;box-shadow:none}.selection-badge{position:absolute;top:8px;right:8px;width:32px;height:32px;background:#4caf50;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.2rem;font-weight:700;box-shadow:0 2px 8px #0000004d;pointer-events:none}@media (max-width: 1200px){.cost-cards{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}}@media (max-width: 768px){.finalization-header{flex-direction:column;align-items:flex-start;gap:1rem}.finalization-actions{width:100%;flex-direction:column}.finalization-actions button{width:100%}.cost-cards{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}}.page-header{margin-bottom:2rem}.page-title{font-size:2.5rem;font-weight:700;margin-bottom:.5rem;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.page-subtitle{color:#888;font-size:1.1rem}.play-modes{display:grid;gap:2rem;margin-bottom:2rem}.mode-card{background:#1a1a1a;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:2rem}.mode-primary{border-color:#667eea4d;background:linear-gradient(135deg,#667eea0d,#764ba20d)}.mode-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.mode-title{font-size:1.5rem;font-weight:600}.mode-badge{padding:.375rem .875rem;background:#667eea33;border:1px solid rgba(102,126,234,.3);border-radius:20px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:#a5b4fc}.mode-description{color:#b8b8b8;line-height:1.6;margin-bottom:1.5rem}.mode-meta{display:flex;gap:1.5rem;margin-bottom:1.5rem;flex-wrap:wrap}.mode-stat{color:#888;font-size:.875rem}.mode-button{width:100%;padding:1rem 2rem;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s}.mode-button-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 4px 15px #667eea66}.mode-button-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea99}.active-runs{background:#1a1a1a;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:2rem}.section-title{font-size:1.25rem;font-weight:600;margin-bottom:1.5rem}.empty-state{text-align:center;padding:3rem 1rem}.empty-icon{font-size:3rem;margin-bottom:1rem;opacity:.3}.empty-text{color:#888;font-size:1.1rem;margin-bottom:.5rem}.empty-hint{color:#666;font-size:.9rem}.quick-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem}.stat-card{background:#1a1a1a;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:1.5rem;text-align:center}.stat-label{color:#888;font-size:.875rem;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem}.stat-value{font-size:2rem;font-weight:700;color:#fff}.learn-section{margin-bottom:2rem}.tutorial-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}.tutorial-card{background:#1a1a1a;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:1.5rem;display:flex;flex-direction:column;transition:all .2s ease}.tutorial-card:hover:not(.tutorial-disabled){border-color:#2ecc714d;transform:translateY(-2px)}.tutorial-card.tutorial-disabled{opacity:.6}.tutorial-icon{font-size:2rem;margin-bottom:.75rem}.tutorial-title{font-size:1.1rem;font-weight:600;margin-bottom:.5rem;color:#fff}.tutorial-description{color:#888;font-size:.875rem;line-height:1.5;margin-bottom:1rem;flex:1}.tutorial-button{width:100%;padding:.75rem 1rem;border:none;border-radius:6px;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s ease;background:linear-gradient(135deg,#2ecc71,#27ae60);color:#fff}.tutorial-button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #2ecc714d}.tutorial-button:disabled{background:#374151;color:#6b7280;cursor:not-allowed}@media (max-width: 768px){.page-title{font-size:2rem}.mode-header{flex-direction:column;align-items:flex-start;gap:.5rem}.mode-meta{flex-direction:column;gap:.5rem}.quick-stats{grid-template-columns:repeat(2,1fr)}.tutorial-cards{grid-template-columns:1fr}}.learn-filters{display:flex;gap:1rem;margin-bottom:2rem;flex-wrap:wrap}.search-input{flex:1;min-width:250px;padding:.875rem 1rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#fff;font-size:.95rem}.search-input::placeholder{color:#666}.search-input:focus{outline:none;border-color:#667eea;background:#ffffff14}.filter-select{padding:.875rem 2.5rem .875rem 1rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#fff;font-size:.95rem;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23ffffff' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .75rem center}.filter-select:focus{outline:none;border-color:#667eea;background-color:#ffffff14}.filter-select option{background:#1a1a1a;color:#fff;padding:.5rem}.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem;margin-top:2rem}@media (max-width: 768px){.search-input{width:100%}.filter-select{flex:1;min-width:140px}.cards-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1rem}}.draft-history{padding:2rem;max-width:1200px;margin:0 auto}.loading-state,.error-state{text-align:center;padding:4rem 2rem;color:#999}.error-state{color:#dc2626}.error-state p{margin-bottom:1.5rem}.drafts-list{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fill,minmax(400px,1fr))}.draft-card{background:#1a1a1acc;border:1px solid #333;border-radius:8px;padding:1.5rem;transition:all .2s ease}.draft-card:hover{border-color:#d4af37;transform:translateY(-2px);box-shadow:0 4px 12px #d4af3726}.draft-card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1rem}.draft-info{flex:1}.draft-title{font-size:1.25rem;color:#fff;margin:0 0 .25rem}.draft-date{font-size:.875rem;color:#999;margin:0}.status-badge{padding:.25rem .75rem;border-radius:12px;font-size:.75rem;font-weight:600;text-transform:uppercase;background:#333;color:#999}.status-completed{background:#22c55e33;color:#22c55e}.status-in-progress{background:#3b82f633;color:#3b82f6}.status-abandoned{background:#ef444433;color:#ef4444}.draft-stats{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.5rem;padding:1rem 0;border-top:1px solid #333;border-bottom:1px solid #333}.stat-item{display:flex;justify-content:space-between;align-items:center}.stat-label{font-size:.875rem;color:#999}.stat-value{font-weight:600;color:#fff}.draft-actions{display:flex;gap:.75rem}.draft-actions button{flex:1}.button-secondary:disabled{opacity:.4;cursor:not-allowed}.button-secondary:disabled:hover{background:#d4af371a;transform:none}.draft-replay{padding:2rem;max-width:1400px;margin:0 auto}.replay-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem;padding-bottom:1rem;border-bottom:2px solid #333}.replay-header h1{font-size:2rem;color:#d4af37;margin:0}.back-button{padding:.5rem 1rem;background:transparent;border:1px solid #666;border-radius:4px;color:#999;cursor:pointer;transition:all .2s}.back-button:hover{border-color:#d4af37;color:#d4af37}.replay-progress{font-size:1.125rem;color:#999;font-weight:600}.pick-info{background:#1a1a1acc;border:1px solid #333;border-radius:8px;padding:1.5rem;margin-bottom:2rem}.pick-meta{display:flex;gap:2rem;margin-bottom:1rem;font-size:.875rem;color:#999}.pack-info{font-weight:600;color:#d4af37}.pick-result{display:flex;align-items:center;gap:1rem}.picked-label{font-size:1.125rem;font-weight:600;color:#fff}.picked-card-display{cursor:pointer}.available-cards-section{margin-bottom:3rem}.available-cards-section h2{font-size:1.5rem;color:#fff;margin-bottom:1.5rem}.available-cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem}.card-wrapper{position:relative;cursor:pointer;transition:transform .2s ease}.card-wrapper:hover{transform:translateY(-4px)}.card-wrapper.was-picked{border:2px solid #22c55e;border-radius:8px;padding:2px}.card-wrapper.not-picked{opacity:.7}.card-wrapper.not-picked:hover{opacity:1}.picked-badge{position:absolute;top:8px;right:8px;background:#22c55e;color:#fff;padding:.25rem .75rem;border-radius:4px;font-size:.75rem;font-weight:700;text-transform:uppercase;box-shadow:0 2px 8px #22c55e80}.replay-controls{position:fixed;bottom:0;left:0;right:0;background:#1a1a1af2;border-top:2px solid #d4af37;padding:1.5rem 2rem;display:flex;align-items:center;gap:1rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:100}.control-button{padding:.75rem 1.5rem;background:#d4af371a;border:1px solid #d4af37;border-radius:4px;color:#d4af37;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.control-button:hover:not(:disabled){background:#d4af3733;transform:translateY(-2px)}.control-button:disabled{opacity:.3;cursor:not-allowed}.control-main{padding:.75rem 2rem;font-size:1.125rem}.pick-slider-container{flex:1;display:flex;flex-direction:column;gap:.5rem}.pick-slider{width:100%;height:6px;border-radius:3px;background:#333;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.pick-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:#d4af37;cursor:pointer;transition:all .2s}.pick-slider::-webkit-slider-thumb:hover{transform:scale(1.2)}.pick-slider::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#d4af37;cursor:pointer;border:none;transition:all .2s}.pick-slider::-moz-range-thumb:hover{transform:scale(1.2)}.pick-timeline{display:flex;gap:2px;height:8px}.timeline-marker{flex:1;background:#333;border-radius:1px;cursor:pointer;transition:all .2s}.timeline-marker:hover{background:#666}.timeline-marker.past{background:#d4af374d}.timeline-marker.active{background:#d4af37;height:12px;margin-top:-2px}@media (max-width: 768px){.draft-replay{padding:1rem}.replay-header{flex-direction:column;align-items:flex-start;gap:1rem}.available-cards-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.replay-controls{flex-wrap:wrap;padding:1rem}.control-button{padding:.5rem 1rem;font-size:.875rem}.pick-slider-container{width:100%;order:-1}}.store-balance{display:flex;justify-content:space-between;align-items:center;background:#1a1a1a;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:1.5rem 2rem;margin-bottom:2rem}.balance-card{display:flex;flex-direction:column;gap:.5rem}.balance-label{color:#888;font-size:.875rem;text-transform:uppercase;letter-spacing:.05em}.balance-value{font-size:2rem;font-weight:700;background:linear-gradient(135deg,gold,#ffed4e);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.buy-shards-button{padding:.875rem 2rem;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:8px;color:#fff;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .3s;box-shadow:0 4px 15px #667eea66}.buy-shards-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea99}.store-sections{display:flex;flex-direction:column;gap:2rem}.store-section{background:#1a1a1a;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:2rem}@media (max-width: 768px){.store-balance{flex-direction:column;gap:1rem;align-items:stretch}.buy-shards-button{width:100%}}.profile-grid{display:grid;grid-template-columns:320px 1fr;gap:2rem}.profile-card{background:#1a1a1a;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:2rem;text-align:center;height:fit-content}.profile-avatar-large{width:120px;height:120px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;font-size:3rem;font-weight:700;margin:0 auto 1.5rem}.profile-name{font-size:1.5rem;font-weight:600;margin-bottom:.5rem}.profile-rank{color:#888;font-size:.875rem;text-transform:uppercase;letter-spacing:.05em;margin-bottom:2rem}.profile-stats{display:flex;justify-content:space-around;padding-top:2rem;border-top:1px solid rgba(255,255,255,.1)}.profile-stat{display:flex;flex-direction:column;gap:.5rem}.profile-stat .stat-value{font-size:1.5rem;font-weight:700;color:#fff}.profile-stat .stat-label{font-size:.75rem;color:#888;text-transform:uppercase;letter-spacing:.05em}.profile-sections{display:flex;flex-direction:column;gap:2rem}.profile-section{background:#1a1a1a;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:2rem}.info-grid{display:flex;flex-direction:column;gap:1.5rem}.info-item{display:flex;flex-direction:column;gap:.5rem}.info-label{color:#888;font-size:.875rem;text-transform:uppercase;letter-spacing:.05em}.info-value{color:#fff;font-size:1rem}.empty-state-small{text-align:center;padding:2rem;color:#888}.empty-state-small .hint{color:#666;font-size:.875rem;margin-top:.5rem}.settings-list{display:flex;flex-direction:column;gap:1.5rem}.setting-item{display:flex;justify-content:space-between;align-items:center}.setting-label{color:#fff;font-size:.95rem}.setting-toggle{width:48px;height:24px;cursor:pointer}@media (max-width: 968px){.profile-grid{grid-template-columns:1fr}}.social-tabs{display:flex;gap:.5rem;margin-bottom:2rem;border-bottom:1px solid rgba(255,255,255,.1)}.social-content{background:#1a1a1a;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:2rem;min-height:400px;display:flex;align-items:center;justify-content:center}.admin-dashboard{min-height:100vh;background:#0a0a0a;color:#fff}.admin-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 2rem;background:#1a1a1a;border-bottom:1px solid rgba(255,255,255,.1)}.admin-title{font-size:1.5rem;font-weight:600;margin:0;color:#f97316}.admin-back-link{padding:.5rem 1rem;background:#ffffff1a;border-radius:6px;color:#fff;text-decoration:none;font-size:.875rem;transition:background .2s}.admin-back-link:hover{background:#ffffff26}.admin-layout{display:grid;grid-template-columns:220px 1fr;min-height:calc(100vh - 64px)}.admin-sidebar{background:#111;border-right:1px solid rgba(255,255,255,.1);padding:1rem 0}.admin-nav{display:flex;flex-direction:column;gap:.25rem}.admin-nav-item{display:block;padding:.75rem 1.5rem;color:#888;text-decoration:none;font-size:.95rem;transition:all .2s;border-left:3px solid transparent}.admin-nav-item:hover{background:#ffffff0d;color:#fff}.admin-nav-item.active{background:#f973161a;color:#f97316;border-left-color:#f97316}.admin-main{padding:2rem;overflow-y:auto}.admin-overview h2{font-size:1.5rem;font-weight:600;margin:0 0 1.5rem}.admin-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem}.admin-stat-card{background:#1a1a1a;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:1.5rem}.admin-stat-card h3{font-size:.875rem;font-weight:500;color:#888;margin:0 0 .5rem;text-transform:uppercase;letter-spacing:.05em}.admin-stat-value{font-size:2.5rem;font-weight:700;margin:0 0 1rem}.admin-stat-link{color:#f97316;text-decoration:none;font-size:.875rem}.admin-stat-link:hover{text-decoration:underline}.admin-stat-link.disabled{color:#555;cursor:not-allowed}.card-list{max-width:1400px}.card-list-loading,.card-list-error{padding:2rem;text-align:center;color:#888}.card-list-error{color:#ef4444}.card-list-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem}.card-list-header h2{font-size:1.5rem;font-weight:600;margin:0}.btn-primary{padding:.75rem 1.5rem;background:#f97316;color:#fff;border:none;border-radius:8px;font-size:.95rem;font-weight:500;cursor:pointer;transition:background .2s}.btn-primary:hover{background:#ea580c}.card-list-filters{display:flex;gap:1rem;margin-bottom:1rem;flex-wrap:wrap}.filter-input{flex:1;min-width:200px;padding:.75rem 1rem;background:#1a1a1a;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#fff;font-size:.95rem}.filter-input::placeholder{color:#666}.filter-input:focus{outline:none;border-color:#f97316}.filter-select{padding:.75rem 1rem;background:#1a1a1a;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#fff;font-size:.95rem;cursor:pointer}.filter-select:focus{outline:none;border-color:#f97316}.card-list-count{color:#888;font-size:.875rem;margin-bottom:1rem}.card-list-table-wrapper{overflow-x:auto}.card-list-table{width:100%;border-collapse:collapse;background:#1a1a1a;border-radius:12px;overflow:hidden}.card-list-table th{text-align:left;padding:1rem;background:#111;font-weight:600;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:#888;border-bottom:1px solid rgba(255,255,255,.1)}.card-list-table td{padding:1rem;border-bottom:1px solid rgba(255,255,255,.05);vertical-align:middle}.card-list-table tr:hover{background:#ffffff05}.card-name-cell{display:flex;flex-direction:column;gap:.25rem}.card-name{font-weight:500}.card-id{font-size:.75rem;color:#666;font-family:monospace}.card-type{padding:.25rem .75rem;border-radius:4px;font-size:.75rem;font-weight:500;text-transform:uppercase}.card-type-unit{background:#3b82f633;color:#60a5fa}.card-type-spell{background:#a855f733;color:#c084fc}.card-type-support{background:#22c55e33;color:#4ade80}.card-stats{font-weight:600;color:#f97316}.card-aspects{display:flex;gap:.25rem;flex-wrap:wrap}.aspect-badge{padding:.125rem .5rem;border-radius:4px;font-size:.7rem;font-weight:500}.aspect-might{background:#ef444433;color:#f87171}.aspect-growth{background:#22c55e33;color:#4ade80}.aspect-insight{background:#3b82f633;color:#60a5fa}.aspect-shadow{background:#a855f733;color:#c084fc}.card-keywords{font-size:.875rem;color:#888}.card-actions{display:flex;gap:.5rem}.btn-small{padding:.375rem .75rem;border:none;border-radius:4px;font-size:.75rem;font-weight:500;cursor:pointer;transition:all .2s}.btn-edit{background:#3b82f633;color:#60a5fa}.btn-edit:hover{background:#3b82f64d}.btn-delete{background:#ef444433;color:#f87171}.btn-delete:hover{background:#ef44444d}.card-editor{max-width:800px}.card-editor-loading{padding:2rem;text-align:center;color:#888}.card-editor-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem}.card-editor-header h2{font-size:1.5rem;font-weight:600;margin:0}.card-editor-error{padding:1rem;background:#ef44441a;border:1px solid rgba(239,68,68,.3);border-radius:8px;color:#f87171;margin-bottom:1.5rem}.card-editor-form{display:flex;flex-direction:column;gap:2rem}.form-section{background:#1a1a1a;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:1.5rem}.form-section h3{font-size:1rem;font-weight:600;margin:0 0 1rem;color:#f97316}.form-hint{font-size:.875rem;color:#666;margin:-.5rem 0 1rem}.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;margin-bottom:1rem}.form-row:last-child{margin-bottom:0}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-group label{font-size:.875rem;font-weight:500;color:#ccc;display:flex;align-items:center;gap:.5rem}.form-group input,.form-group select,.form-group textarea{padding:.75rem 1rem;background:#111;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#fff;font-size:.95rem;font-family:inherit}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:#f97316}.form-group input:disabled{opacity:.5;cursor:not-allowed}.form-group textarea{resize:vertical;min-height:100px}.btn-generate{padding:.25rem .5rem;background:#f9731633;border:none;border-radius:4px;color:#f97316;font-size:.75rem;cursor:pointer;transition:background .2s}.btn-generate:hover:not(:disabled){background:#f973164d}.btn-generate:disabled{opacity:.5;cursor:not-allowed}.checkbox-group{display:flex;flex-wrap:wrap;gap:.5rem}.checkbox-group-vertical{display:flex;flex-direction:column;gap:.75rem}.checkbox-item{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:6px;cursor:pointer;transition:all .2s;font-size:.875rem}.checkbox-item:hover{background:#ffffff14}.checkbox-item.selected{background:#f9731626;border-color:#f97316}.checkbox-item input{display:none}.checkbox-item-inline{display:flex;align-items:center;gap:.75rem;cursor:pointer;font-size:.95rem;color:#ccc}.checkbox-item-inline input{width:18px;height:18px;accent-color:#f97316}.aspect-checkbox.aspect-might.selected{background:#ef444426;border-color:#ef4444;color:#f87171}.aspect-checkbox.aspect-growth.selected{background:#22c55e26;border-color:#22c55e;color:#4ade80}.aspect-checkbox.aspect-guile.selected{background:#3b82f626;border-color:#3b82f6;color:#60a5fa}.aspect-checkbox.aspect-spirit.selected{background:#a855f726;border-color:#a855f7;color:#c084fc}.form-actions{display:flex;gap:1rem;padding-top:1rem}.btn-primary{padding:.875rem 2rem;background:#f97316;color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:background .2s}.btn-primary:hover:not(:disabled){background:#ea580c}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{padding:.875rem 2rem;background:#ffffff1a;color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s}.btn-secondary:hover{background:#ffffff26}.match-board{display:flex;flex-direction:column;height:100%;position:relative;z-index:1}.match-board.empty{display:flex;align-items:center;justify-content:center;color:#4b5563;font-size:.875rem}.match-board.drag-over{background:#2ecc711a;border:2px dashed #2ecc71;border-radius:8px}.match-board.drag-over .your-side .unit-row{background:#2ecc7126;border-radius:8px}.drop-hint{color:#2ecc71!important;font-style:italic}.board-half{flex:1;display:flex;flex-direction:column;padding:12px 24px;position:relative}.opponent-side{flex-direction:column}.your-side{flex-direction:column-reverse}.unit-row,.support-row{display:flex;gap:12px;min-height:100px;padding:8px;justify-content:center;flex-wrap:wrap;align-items:center}.unit-row{background:#ffffff05;border-radius:8px;border:1px solid rgba(255,255,255,.03)}.support-row{min-height:50px}.empty-row{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#374151;font-size:.75rem;padding:20px}.empty-row:before{content:"🛡️";font-size:1.5rem;opacity:.3}.board-divider{display:flex;align-items:center;justify-content:center;padding:8px 16px;background:linear-gradient(90deg,transparent 0%,rgba(78,205,196,.05) 50%,transparent 100%);border-top:1px solid rgba(78,205,196,.1);border-bottom:1px solid rgba(78,205,196,.1);position:relative}.board-divider.combat-phase{background:linear-gradient(90deg,transparent 0%,rgba(231,76,60,.1) 50%,transparent 100%);border-color:#e74c3c33;animation:combat-pulse 2s ease-in-out infinite}@keyframes combat-pulse{0%,to{opacity:.8}50%{opacity:1}}.turn-indicator{color:#6b7280;font-size:.625rem;text-transform:uppercase;letter-spacing:.15em;font-weight:600}.unit-card{width:90px;min-height:110px;background:linear-gradient(180deg,#1a2535,#0f1318);border:2px solid #2a3545;border-radius:8px;padding:8px;display:flex;flex-direction:column;position:relative;transition:all .2s ease}.unit-card.own{border-color:#2a5545}.unit-card.opponent{border-color:#553a2a}.unit-card.selectable{cursor:pointer}.unit-card.selectable:hover{transform:translateY(-4px);box-shadow:0 8px 16px #0006}.unit-card.selected{border-color:gold;box-shadow:0 0 16px #ffd70080;transform:translateY(-4px)}.unit-card.can-attack{border-color:#2ecc71;box-shadow:0 0 12px #2ecc714d}.unit-card.can-attack:after{content:"⚔️";position:absolute;top:-8px;left:50%;transform:translate(-50%);font-size:.75rem;animation:bounce 1s ease-in-out infinite}@keyframes bounce{0%,to{transform:translate(-50%) translateY(0)}50%{transform:translate(-50%) translateY(-4px)}}.unit-card.exhausted{opacity:.6;filter:saturate(.5)}.unit-card.summoned{opacity:.8}.unit-card.attacked{opacity:.7}.unit-name{font-size:.625rem;font-weight:700;color:#fff;margin-bottom:4px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;text-align:center}.unit-stats{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:auto;padding-top:8px;border-top:1px solid rgba(255,255,255,.05)}.unit-stats .attack{font-size:1rem;font-weight:800;color:#ff6b6b}.unit-stats .separator{color:#374151;font-size:.75rem}.unit-stats .toughness{font-size:1rem;font-weight:800;color:#4ecdc4}.unit-stats .toughness.damaged{color:#f39c12}.unit-keywords{display:flex;flex-wrap:wrap;gap:2px;margin-top:4px;justify-content:center}.unit-keywords .keyword{font-size:.5rem;background:#4ecdc41a;padding:1px 4px;border-radius:2px;color:#4ecdc4;text-transform:uppercase;letter-spacing:.05em}.exhausted-indicator,.summoning-sickness{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-10deg);font-size:.5rem;text-transform:uppercase;padding:2px 6px;border-radius:2px;font-weight:700;letter-spacing:.05em;pointer-events:none}.exhausted-indicator{background:#e74c3ccc;color:#fff}.summoning-sickness{background:#e67e22cc;color:#fff}.support-card{width:70px;min-height:45px;background:linear-gradient(180deg,#1a2535,#0f1318);border:2px solid #3a4555;border-radius:4px;padding:4px 6px;display:flex;flex-direction:column}.support-card.own{border-color:#3a5565}.support-card.opponent{border-color:#65553a}.support-name{font-size:.5rem;font-weight:700;color:#fff;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.support-slots{font-size:.45rem;color:#6b7280;margin-top:auto}.match-board.targeting-mode{cursor:crosshair}.targeting-hint{position:absolute;top:8px;left:50%;transform:translate(-50%);background:#000000e6;color:#fff;padding:8px 16px;border-radius:8px;font-size:.75rem;z-index:1001;display:flex;align-items:center;gap:12px;border:1px solid rgba(255,107,107,.5);box-shadow:0 4px 12px #00000080}.cancel-targeting-btn{background:#ff6b6b33;border:1px solid #ff6b6b;color:#ff6b6b;padding:4px 12px;border-radius:4px;font-size:.625rem;cursor:pointer;transition:all .2s ease}.cancel-targeting-btn:hover{background:#ff6b6b66}.unit-card.valid-target{border-color:#ff6b6b;box-shadow:0 0 16px #ff6b6b80;cursor:pointer;animation:target-pulse 1s ease-in-out infinite}.unit-card.valid-target:hover{transform:scale(1.05);box-shadow:0 0 24px #ff6b6bb3}.unit-card.targeting-source{border-color:#2ecc71;box-shadow:0 0 20px #2ecc7199}.board-half.valid-player-target{background:#ff6b6b1a;cursor:pointer}.board-half.valid-player-target:before{content:"Click to attack player";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#ff6b6b;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;background:#000c;padding:8px 16px;border-radius:4px;border:1px solid #ff6b6b;z-index:10}.empty-row.can-target-player{color:#ff6b6b!important;font-weight:600}.empty-row.can-target-player:before{content:"🎯"}@keyframes target-pulse{0%,to{box-shadow:0 0 12px #ff6b6b66}50%{box-shadow:0 0 20px #ff6b6bb3}}.hand-card{position:relative;flex-shrink:0;transition:transform .2s ease,z-index 0s;margin:0 -4px}.hand-card:hover{z-index:10}.card-frame{width:100px;height:140px;background:linear-gradient(180deg,#1a1f2e,#0f1318);border:2px solid #2a3040;border-radius:8px;padding:0;display:flex;flex-direction:column;position:relative;overflow:hidden;cursor:default;transition:all .2s ease}.hand-card.playable{cursor:grab}.hand-card.playable:active{cursor:grabbing}.hand-card.playable .card-frame{cursor:pointer;border-color:#2ecc71;box-shadow:0 0 8px #2ecc714d}.hand-card.playable .card-frame:hover{transform:translateY(-12px) scale(1.05);box-shadow:0 12px 24px #00000080,0 0 16px #2ecc7166;border-color:#3edc81}.hand-card.unaffordable .card-frame{opacity:.6;border-color:#4b5563}.hand-card.unaffordable .card-frame:hover{transform:translateY(-4px)}.card-cost-gem.too-expensive{background:linear-gradient(135deg,#dc4a4a,#9c2a2a);border-color:#fc6a6a}.card-cost-gem{position:absolute;top:-4px;right:-4px;width:24px;height:24px;background:linear-gradient(135deg,#4a9cdc,#2a6c9c);border:2px solid #6abcfc;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.75rem;color:#fff;z-index:2;box-shadow:0 2px 4px #0000004d}.card-art{height:50px;background:linear-gradient(180deg,#2a3545,#1a2535);margin:6px 6px 0;border-radius:4px;overflow:hidden}.card-art-placeholder{width:100%;height:100%;background:linear-gradient(45deg,rgba(78,205,196,.1) 0%,transparent 50%),linear-gradient(135deg,transparent 50%,rgba(155,89,182,.1) 100%)}.card-info{padding:4px 6px;flex:1;display:flex;flex-direction:column;gap:2px}.card-name-bar{background:linear-gradient(90deg,rgba(0,0,0,.3) 0%,transparent 100%);padding:2px 4px;border-radius:2px}.card-name{font-size:.625rem;font-weight:700;color:#fff;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;display:block}.card-type-line{font-size:.5rem;color:#6b7280;text-transform:uppercase;letter-spacing:.05em}.card-stats-bar{display:flex;align-items:center;justify-content:center;gap:4px;padding:4px 0;background:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.3) 100%);margin-top:auto}.card-attack{font-size:.875rem;font-weight:800;color:#ff6b6b;text-shadow:0 1px 2px rgba(0,0,0,.5)}.card-stats-separator{color:#4b5563;font-size:.75rem}.card-toughness{font-size:.875rem;font-weight:800;color:#4ecdc4;text-shadow:0 1px 2px rgba(0,0,0,.5)}.card-text-box{padding:2px 4px;font-size:.5rem;color:#9ca3af;line-height:1.3;max-height:24px;overflow:hidden}.empty-hand{display:flex;flex-direction:column;align-items:center;gap:8px;padding:24px;color:#4b5563;font-size:.75rem}.empty-hand-icon{font-size:1.5rem;opacity:.5}.hand-tray{min-height:160px;display:flex;align-items:center;justify-content:center}.hand-cards-container{display:flex;align-items:center;justify-content:center;gap:4px;padding:8px}.event-log-compact{display:flex;flex-direction:column;background:#0006;border-radius:6px;overflow:hidden;border:1px solid rgba(255,255,255,.05)}.event-log-content{flex:1;overflow-y:auto;padding:4px;scroll-behavior:smooth}.event-log-content::-webkit-scrollbar{width:4px}.event-log-content::-webkit-scrollbar-track{background:transparent}.event-log-content::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:2px}.event-log-empty{display:flex;align-items:center;justify-content:center;padding:16px 8px;color:#4b5563;font-size:.625rem;text-align:center}.event-entry{display:flex;align-items:center;gap:6px;padding:4px 6px;font-size:.625rem;border-radius:3px;margin-bottom:2px;background:#ffffff05;border-left:2px solid transparent}.event-entry:last-child{margin-bottom:0;animation:flash-new .5s ease-out}@keyframes flash-new{0%{background:#4ecdc433}to{background:#ffffff05}}.event-icon{flex-shrink:0;font-size:.75rem}.event-message{flex:1;color:#9ca3af;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.event-entry.turn_start{border-left-color:#3498db}.event-entry.phase_change{border-left-color:#9b59b6}.event-entry.card_played.you{border-left-color:#2ecc71}.event-entry.card_played.opponent{border-left-color:#e74c3c}.event-entry.damage_dealt{border-left-color:#f39c12}.event-entry.unit_died{border-left-color:#7f8c8d}.event-entry.player_passed{border-left-color:#95a5a6}.event-entry.game_won{border-left-color:#f1c40f;background:#f1c40f1a}.event-entry.game_won .event-message{color:#f1c40f;font-weight:600}.match-page{height:100vh;display:grid;grid-template-rows:auto 1fr auto;background:#0a0a0f;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.match-page.loading{display:flex;align-items:center;justify-content:center;gap:16px}.loading-spinner{width:40px;height:40px;border:3px solid rgba(78,205,196,.2);border-top-color:#4ecdc4;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-text{color:#6b7280;font-size:.875rem;letter-spacing:.05em}.match-top-bar{display:flex;align-items:center;justify-content:space-between;padding:8px 16px;background:linear-gradient(180deg,#000c,#0006);border-bottom:1px solid rgba(78,205,196,.2);min-height:56px}.turn-phase-info{display:flex;flex-direction:column;gap:2px}.turn-phase-main{display:flex;align-items:center;gap:12px}.turn-number{font-size:.875rem;font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:.1em}.phase-badge{display:flex;align-items:center;gap:6px;padding:4px 10px;border-radius:4px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.phase-badge.main{background:#2ecc7133;color:#2ecc71}.phase-badge.combat{background:#e74c3c33;color:#e74c3c}.phase-badge.counterattack{background:#e67e2233;color:#e67e22}.phase-badge.mulligan{background:#9b59b633;color:#9b59b6}.phase-badge.start{background:#3498db33;color:#3498db}.phase-badge.end{background:#95a5a633;color:#95a5a6}.phase-icon{font-size:.875rem}.phase-subtitle{font-size:.625rem;color:#6b7280;font-style:italic}.players-panel{display:flex;align-items:center;gap:16px}.player-panel{display:flex;align-items:center;gap:12px;padding:6px 12px;border-radius:6px;background:#ffffff08;border:1px solid rgba(255,255,255,.08);transition:all .2s ease}.player-panel.active{border-color:#4ecdc480;box-shadow:0 0 8px #4ecdc433}.player-panel.you{border-left:3px solid #2ecc71}.player-panel.opponent{border-left:3px solid #e74c3c}.player-name{font-size:.75rem;font-weight:600;color:#fff;text-transform:uppercase;letter-spacing:.05em}.player-stats{display:flex;align-items:center;gap:12px}.stat-item{display:flex;align-items:center;gap:4px}.stat-icon{font-size:.875rem}.stat-icon.health{color:#ff6b6b}.stat-icon.energy{color:#4ecdc4}.stat-value{font-size:.875rem;font-weight:700;color:#fff}.stat-secondary{font-size:.625rem;color:#6b7280}.spell-mana{font-size:.75rem;color:#9b59b6;font-weight:600}.initiative-marker{font-size:.5rem;padding:2px 5px;background:#ffd70033;color:gold;border-radius:3px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}.match-board-area{position:relative;display:flex;flex-direction:column;background:radial-gradient(ellipse at center,#141e28e6,#0a0a0f 70%),linear-gradient(180deg,#0f1419,#0a0a0f);overflow:hidden}.match-board-area:before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:200px;height:200px;background:radial-gradient(circle,rgba(78,205,196,.08) 0%,transparent 70%);pointer-events:none}.board-lanes{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;pointer-events:none}.lane-marker{flex:1;border-right:1px solid rgba(255,255,255,.03)}.lane-marker:last-child{border-right:none}.match-bottom-tray{display:grid;grid-template-columns:200px 1fr 180px;gap:12px;padding:12px 16px;background:linear-gradient(0deg,#000000e6,#0009);border-top:1px solid rgba(78,205,196,.15)}.event-log-compact{display:flex;flex-direction:column;background:#0006;border-radius:6px;overflow:hidden;max-height:120px}.event-log-header{padding:6px 10px;font-size:.625rem;font-weight:600;color:#6b7280;text-transform:uppercase;letter-spacing:.1em;background:#0000004d;border-bottom:1px solid rgba(255,255,255,.05)}.event-log-content{flex:1;overflow-y:auto;padding:4px}.event-log-empty{padding:12px;text-align:center;color:#4b5563;font-size:.75rem}.hand-tray{display:flex;flex-direction:column;align-items:center}.hand-tray-label{font-size:.625rem;color:#6b7280;margin-bottom:4px}.hand-cards-container{display:flex;justify-content:center;align-items:flex-end;gap:-8px;padding:8px 16px;background:linear-gradient(180deg,#141e2899,#0a0f14cc);border-radius:12px 12px 0 0;border:1px solid rgba(78,205,196,.1);border-bottom:none;min-height:100px;max-width:100%;overflow-x:auto}.hand-cards-container::-webkit-scrollbar{height:4px}.hand-cards-container::-webkit-scrollbar-thumb{background:#4ecdc44d;border-radius:2px}.action-panel{display:flex;flex-direction:column;gap:8px;justify-content:center}.action-btn-primary{padding:14px 20px;border:none;border-radius:8px;font-size:.875rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;cursor:pointer;transition:all .2s ease;background:linear-gradient(135deg,#2ecc71,#27ae60);color:#fff;box-shadow:0 4px 12px #2ecc714d}.action-btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 16px #2ecc7166}.action-btn-primary:disabled{opacity:.5;cursor:not-allowed;background:#374151;box-shadow:none}.action-btn-primary.attack{background:linear-gradient(135deg,#e74c3c,#c0392b);box-shadow:0 4px 12px #e74c3c4d}.action-btn-secondary{padding:8px 14px;border:1px solid rgba(255,255,255,.1);border-radius:6px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;cursor:pointer;transition:all .2s ease;background:#ffffff0d;color:#9ca3af}.action-btn-secondary:hover:not(:disabled){background:#ffffff1a;color:#fff}.action-btn-secondary:disabled{opacity:.5;cursor:not-allowed}.action-hint{font-size:.625rem;color:#6b7280;text-align:center}.waiting-indicator{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px;color:#6b7280;font-size:.75rem}.waiting-dots{display:flex;gap:4px}.waiting-dots span{width:6px;height:6px;background:#4ecdc4;border-radius:50%;animation:pulse-dot 1.4s ease-in-out infinite both}.waiting-dots span:nth-child(2){animation-delay:.2s}.waiting-dots span:nth-child(3){animation-delay:.4s}@keyframes pulse-dot{0%,80%,to{transform:scale(.6);opacity:.5}40%{transform:scale(1);opacity:1}}.opponent-turn-banner{position:absolute;top:60px;left:50%;transform:translate(-50%);padding:8px 24px;background:linear-gradient(135deg,#e74c3ce6,#c0392be6);border-radius:20px;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:#fff;animation:slide-in .3s ease-out;z-index:10}@keyframes slide-in{0%{opacity:0;transform:translate(-50%) translateY(-10px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.error-banner{position:absolute;top:60px;left:50%;transform:translate(-50%);padding:8px 16px;background:#e74c3ce6;border-radius:6px;font-size:.75rem;color:#fff;z-index:20}.disconnect-warning{position:absolute;top:60px;left:50%;transform:translate(-50%);padding:8px 16px;background:#e67e22e6;border-radius:6px;font-size:.75rem;color:#fff;z-index:20}.winner-overlay{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;background:#000c;z-index:100}.winner-banner{padding:32px 64px;border-radius:12px;text-align:center;font-size:2rem;font-weight:800;text-transform:uppercase;letter-spacing:.15em;animation:victory-pulse 2s ease-in-out infinite}.winner-banner.victory{background:linear-gradient(135deg,#2ecc714d,#27ae604d);border:2px solid #2ecc71;color:#2ecc71}.winner-banner.defeat{background:linear-gradient(135deg,#e74c3c4d,#c0392b4d);border:2px solid #e74c3c;color:#e74c3c}@keyframes victory-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@media (max-width: 768px){.match-bottom-tray{grid-template-columns:1fr;grid-template-rows:auto auto auto}.event-log-compact{display:none}.players-panel{flex-direction:column;gap:8px}}