.collection-fullscreen{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--felt-deep);background-image:radial-gradient(circle at 20% 30%,color-mix(in srgb,var(--brass) 10%,transparent) 0%,transparent 50%),radial-gradient(circle at 80% 70%,color-mix(in srgb,var(--brass) 8%,transparent) 0%,transparent 50%);display:flex;flex-direction:column;z-index:10000;overflow:hidden;visibility:visible;opacity:1}.collection-header{display:flex;justify-content:space-between;align-items:center;padding:20px 40px;border-bottom:2px solid var(--brass);background:color-mix(in srgb,var(--felt-deep) 80%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);flex-shrink:0;flex-wrap:wrap;gap:12px}.collection-header h2{color:var(--brass);margin:0}.header-right{display:flex;align-items:center;gap:15px;flex-wrap:wrap;min-width:0}.header-controls{display:flex;align-items:center;gap:20px;flex-wrap:wrap;min-width:0}.header-right .victory-points,.header-controls .victory-points{display:flex;align-items:center;gap:8px}.header-right .trophy-icon,.header-controls .trophy-icon{font-size:1.2rem}.header-right .points-text,.header-controls .points-text{color:var(--bone);font-size:1rem;font-weight:600}.filter-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.control-group{display:flex;align-items:center;gap:6px}.filter-controls label{color:var(--bone);font-weight:700;font-size:14px}.sort-dropdown,.filter-dropdown{background:color-mix(in srgb,var(--brass) 30%,transparent);border:2px solid var(--brass);border-radius:6px;color:var(--bone);padding:8px 12px;font-size:14px;cursor:pointer;transition:all .3s ease;font-weight:500}.search-input{background:color-mix(in srgb,var(--brass) 30%,transparent);border:2px solid var(--brass);border-radius:6px;color:var(--bone);padding:8px 12px;font-size:14px;transition:all .3s ease;font-weight:500;min-width:150px}.search-input::placeholder{color:color-mix(in srgb,var(--bone) 50%,transparent)}.sort-dropdown:hover,.filter-dropdown:hover,.search-input:hover{background:color-mix(in srgb,var(--brass) 40%,transparent);box-shadow:0 0 10px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.sort-dropdown:focus,.filter-dropdown:focus,.search-input:focus{outline:none;box-shadow:0 0 15px color-mix(in srgb,var(--felt-deep) 70%,transparent)}.sort-dropdown option,.filter-dropdown option{background:var(--walnut);color:var(--bone);padding:5px}@media (max-width: 600px),(max-width: 1000px) and (max-height: 600px){.collection-fullscreen .collection-header{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:6px 10px;padding:6px 12px}.collection-fullscreen .collection-header h2{grid-row:1;grid-column:1;font-size:16px}.collection-fullscreen .header-controls,.collection-fullscreen .header-right{display:contents}.collection-fullscreen .collection-header .victory-points{grid-row:1;grid-column:2;gap:4px;padding:3px 6px;margin:0;min-width:0;border-radius:6px}.collection-fullscreen .collection-header .points-text,.collection-fullscreen .collection-header .trophy-icon{font-size:11px}.collection-fullscreen .collection-header .game-close-btn{grid-row:1;grid-column:3;width:30px;height:30px;min-width:30px;margin:0}.collection-fullscreen .filter-controls{grid-row:2;grid-column:1 / -1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.collection-fullscreen .control-group{min-width:0;gap:4px}.collection-fullscreen .filter-controls label{font-size:11px;white-space:nowrap}.collection-fullscreen .filter-dropdown,.collection-fullscreen .sort-dropdown,.collection-fullscreen .search-input{flex:1;width:100%;min-width:0;height:30px;padding:3px 6px;box-sizing:border-box;font-size:12px}}@media (max-width: 480px){.collection-fullscreen .filter-controls{gap:6px}.collection-fullscreen .control-group{flex-direction:column;align-items:stretch;gap:2px}}.loading-state{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;color:var(--brass)}.loading-spinner{width:50px;height:50px;border:3px solid color-mix(in srgb,var(--brass) 30%,transparent);border-top:3px solid var(--brass);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:20px}.collection-content{display:flex;flex-direction:column;flex:1;overflow:hidden;min-height:0}.collection-grid-container{position:relative;flex:1;display:flex;align-items:stretch;justify-content:center;padding:12px 52px 48px;min-height:0;overflow-y:auto;overflow-x:hidden}.responsive-card-viewport .collection-grid.responsive-card-grid{grid-template-rows:repeat(var(--grid-rows),var(--grid-row-height))}.collection-grid.transitioning{opacity:0}.collection-grid{opacity:1;transition:opacity .2s ease-in-out}.collection-grid-container .left-arrow{left:6px!important}.collection-grid-container .right-arrow{right:6px!important}.collection-grid-container .pagination-arrow-overlay{position:absolute;top:50%;transform:translateY(-50%);background:color-mix(in srgb,var(--brass) 20%,transparent)!important;border:2px solid var(--brass)!important;color:var(--brass)!important;font-size:1.5rem;width:40px;height:40px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;box-shadow:none!important;font-weight:700;z-index:20;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.collection-grid-container .pagination-arrow-overlay:hover{background:var(--brass)!important;color:var(--bone)!important;transform:translateY(-50%) scale(1.1);box-shadow:none!important}.collection-grid-container .pagination-arrow-overlay:active{transform:translateY(-50%) scale(1.05)}.collection-grid-container .pagination-arrow-overlay.disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.page-indicator-overlay{position:absolute;bottom:10px;left:50%;transform:translate(-50%);background:color-mix(in srgb,var(--felt-deep) 80%,transparent);border:1px solid var(--brass);border-radius:15px;padding:4px 12px;color:var(--brass);font-size:.9rem;font-weight:700;text-shadow:1px 1px 2px color-mix(in srgb,var(--felt-deep) 50%,transparent);box-shadow:0 0 8px color-mix(in srgb,var(--felt-deep) 50%,transparent);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:20}.filter-controls{display:flex;gap:20px;align-items:center}.control-group{display:flex;align-items:center;gap:8px}.filter-dropdown{background:color-mix(in srgb,var(--brass) 30%,transparent);border:2px solid var(--brass);border-radius:6px;color:var(--bone);padding:8px 12px;font-size:14px;cursor:pointer;transition:all .3s ease;font-weight:500}.hero-card.disabled-hero{opacity:.6;position:relative}.disabled-badge{display:block;font-size:.7rem;color:var(--ember-hi);font-weight:700;margin-top:2px;text-transform:none;letter-spacing:.5px}.selection-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:color-mix(in srgb,var(--felt-deep) 80%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:50;animation:fadeIn .3s ease-out}@media (max-width: 1200px){.collection-grid-container .pagination-arrow-overlay{width:35px;height:35px;font-size:1.3rem}}@media (max-width: 768px){.collection-header{padding:15px 20px}.collection-grid-container .pagination-arrow-overlay{width:30px;height:30px;font-size:1.1rem}.page-indicator-overlay{bottom:8px;font-size:.8rem;padding:3px 8px}}@media (max-width: 480px){.collection-header{padding:12px}.collection-grid-container{padding:8px 12px 52px}.collection-grid-container .pagination-arrow-overlay{top:auto;bottom:6px;transform:none}.collection-grid-container .pagination-arrow-overlay:hover{transform:scale(1.05)}.collection-header h2{font-size:1.5rem}.collection-grid-container .pagination-arrow-overlay{width:45px;height:45px;font-size:1.8rem}.page-indicator-overlay{bottom:10px;font-size:.8rem;padding:5px 10px}}.favorite-star{position:absolute;top:8px;left:8px;font-size:24px;z-index:10;filter:drop-shadow(0 0 3px color-mix(in srgb,var(--felt-deep) 80%,transparent));pointer-events:none}.favorite-button-container{margin-top:15px;padding-top:15px;border-top:1px solid color-mix(in srgb,var(--brass) 30%,transparent);display:flex;justify-content:center}.favorite-button{padding:10px 20px;background:color-mix(in srgb,var(--brass) 20%,transparent);border:2px solid var(--brass);border-radius:8px;color:var(--bone);cursor:pointer;font-size:16px;font-weight:600;transition:all .3s ease;display:flex;align-items:center;gap:8px}.favorite-button:hover{background:color-mix(in srgb,var(--brass) 40%,transparent);transform:translateY(-2px);box-shadow:0 4px 12px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.favorite-button.favorited{background:color-mix(in srgb,var(--brass-hi) 20%,transparent);border-color:var(--brass-hi);color:var(--brass-hi)}.favorite-button.favorited:hover{background:color-mix(in srgb,var(--brass-hi) 30%,transparent);box-shadow:0 4px 12px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.game-close-btn{flex-shrink:0;width:2.25rem;height:2.25rem;padding:0;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-control);border:1px solid var(--brass-dim);background:var(--leather);color:var(--bone-dim);cursor:pointer;transition:background var(--dur) var(--ease),border-color var(--dur) var(--ease),color var(--dur) var(--ease)}.game-close-btn svg{display:block}.game-close-btn:hover{background:var(--leather-hi);border-color:var(--brass);color:var(--bone);transform:none;box-shadow:none}.game-close-btn:active{transform:translateY(1px)}.game-close-btn:focus-visible{outline:var(--focus-outline);outline-offset:2px}@media (prefers-reduced-motion: reduce){.game-close-btn{transition:none}}.card-layout-test{position:relative;display:flex;flex-direction:column;min-height:100vh;overflow:auto;color:var(--bone);background:transparent}.card-layout-test-exit{position:fixed;z-index:100;top:12px;right:12px;display:grid;width:40px;height:40px;place-items:center;padding:8px;border:1px solid color-mix(in srgb,var(--bone) 38%,transparent);border-radius:50%;color:var(--bone);background:color-mix(in srgb,var(--felt-deep) 55%,transparent);cursor:pointer}.card-layout-test-exit:hover{background:color-mix(in srgb,var(--felt-deep) 85%,transparent)}.card-layout-test-exit svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-linecap:round;stroke-width:2}.card-layout-test-teams{display:flex;flex:1;flex-direction:column;min-height:100vh}.card-layout-test-team{display:flex;flex:1 0 max(50vh,391px);align-items:center;justify-content:center;min-height:max(50vh,391px);padding:clamp(12px,1.5vw,20px);box-sizing:border-box}.card-layout-test-team.card-layout-test-opponents{background:color-mix(in srgb,var(--leather) 30%,transparent)}.card-layout-test-team.card-layout-test-players{background:color-mix(in srgb,var(--brass) 25%,transparent)}.card-layout-test-team-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;justify-items:center;gap:clamp(10px,1.5vw,22px);width:100%}.hero-card.hero-layout-card.hero-layout-card{--card-steel-texture: repeating-linear-gradient(125deg, var(--walnut) 0 3px, var(--leather-hi) 4px, var(--leather) 6px, var(--bone-dim) 7px, var(--leather) 10px);width:260px;height:391px;min-height:391px;max-height:none;flex:0 0 260px;margin:0;overflow:visible;cursor:default;border:2px solid var(--leather-hi);border-radius:5px;background:linear-gradient(180deg,var(--walnut),var(--walnut));box-shadow:0 8px 24px color-mix(in srgb,var(--felt-deep) 45%,transparent);zoom:min(var(--hero-card-scale, 1),var(--hero-card-height-scale, var(--hero-card-scale, 1)))}.hero-card.hero-layout-card:after{content:"";position:absolute;top:-5px;right:-5px;bottom:-5px;left:-5px;z-index:3;border:5px solid transparent;border-radius:10px;background:linear-gradient(var(--walnut),var(--walnut)) padding-box,var(--card-steel-texture) border-box;background-clip:border-box;mask:linear-gradient(var(--bone) 0 0) padding-box,linear-gradient(var(--bone) 0 0);mask-composite:exclude;box-shadow:inset 0 0 2px var(--felt-deep);pointer-events:none}.hero-card.hero-layout-card.enemy,.hero-card.hero-layout-card.ally{border-color:var(--leather-hi)}.hero-card.hero-layout-card:hover,.hero-card.hero-layout-card.selectable:hover:not(.shop-hero-card){transform:none;z-index:auto;border-color:var(--leather-hi);box-shadow:0 8px 24px color-mix(in srgb,var(--felt-deep) 45%,transparent)}.hero-card.hero-layout-card.hero-layout-card:hover:not(.shop-hero-card){border-color:var(--leather-hi)}.battle-layout .hero-card.hero-layout-card.hero-layout-card.selected:not(.dead){transform:scale(1.1);z-index:15}.hero-card.hero-layout-card.hero-layout-card .hero-image{height:241px;flex:0 0 241px;object-fit:cover;object-position:center top;border-radius:0}.hero-card.hero-layout-card .card-stats{position:absolute;top:0;left:0;box-sizing:border-box;display:grid;align-content:end;gap:7px;width:100%;height:241px;padding:28px 12px 10px;color:var(--bone);background:linear-gradient(180deg,transparent 28%,color-mix(in srgb,var(--felt-deep) 84%,transparent) 100%);pointer-events:none}.hero-card.hero-layout-card .hero-stats-row{display:flex;align-items:center;gap:4px;margin:0;font-size:15px;line-height:1;pointer-events:auto}.hero-card.hero-layout-card .card-stat-icon{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;flex:0 0 24px;margin-right:0;border:0;border-radius:0;background:none;font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;font-size:19px;line-height:1;filter:drop-shadow(0 1px 2px color-mix(in srgb,var(--felt-deep) 90%,transparent))}.hero-card.hero-layout-card.hero-layout-card .hero-card-content{height:146px;min-height:0;padding:0;overflow:visible;flex:0 0 146px}.card-details{position:relative;box-sizing:border-box;height:100%;padding:10px 12px 12px;overflow-y:auto;color:var(--bone);font-weight:400;text-align:left}.card-details-compact{padding:8px 10px}.card-details-compact .card-text-section{margin-bottom:5px}.card-details-compact .card-text-section h4{font-size:11.5px}.card-details-compact .card-text-section p{font-size:11px;line-height:1.2}.card-details-dense{padding:5px 9px}.card-details-dense .card-text-section{margin-bottom:2px}.card-details-dense .card-special{padding-top:4px}.card-details-dense .card-text-section h4{margin-bottom:1px;font-size:11px}.card-details-dense .card-text-section p{font-size:10.5px;line-height:1.2}.card-hero-name{position:absolute;top:-2px;left:12px;right:12px;z-index:2;margin:0;padding:2px 8px;border:2px solid transparent;border-radius:3px;background:linear-gradient(var(--felt-deep),var(--felt-deep)) padding-box,linear-gradient(color-mix(in srgb,var(--leather) 75%,transparent),color-mix(in srgb,var(--leather) 75%,transparent)) border-box,var(--card-steel-texture) border-box;box-shadow:0 1px 2px color-mix(in srgb,var(--felt-deep) 30%,transparent);color:var(--bone);font-family:var(--font-display);font-size:17px;font-weight:400;letter-spacing:.5px;line-height:1.1;text-align:center;text-shadow:0 1px 3px var(--felt-deep);pointer-events:none}.card-text-section{margin:0 0 8px}.card-text-section h4{margin:0 0 2px;color:var(--bone);font-size:12px}.card-type-label{color:var(--brass-hi);font-weight:800}.card-text-section p{margin:0;color:var(--bone);font-size:11.5px;line-height:1.3}.card-special{padding-top:6px;border-top:1px solid color-mix(in srgb,var(--bone) 14%,transparent)}.card-details .card-text-section h4{font-size:calc(var(--card-text-size, 11.5px) + .5px)}.card-details .card-text-section p{font-size:var(--card-text-size, 11.5px)}.hero-card.hero-layout-card.hero-layout-card.current-turn,.battle-layout .hero-card.hero-layout-card.hero-layout-card.current-turn.current-turn{border-color:var(--brass-hi)!important;box-shadow:0 0 0 7px color-mix(in srgb,var(--felt-deep) 35%,transparent),0 0 22px 8px color-mix(in srgb,var(--felt-deep) 75%,transparent)}.hero-card.hero-layout-card.current-turn:after,.battle-layout .hero-card.hero-layout-card.current-turn.current-turn:after{background:linear-gradient(var(--walnut),var(--walnut)) padding-box,linear-gradient(135deg,var(--bone),var(--brass-hi) 45%,var(--brass-hi) 100%) border-box;box-shadow:inset 0 0 0 1px var(--felt-deep)}.hero-card.hero-layout-card.selected:after{outline:2px solid var(--verdigris)}.battle-layout .hero-card.hero-layout-card.hero-layout-card.selectable{border-color:var(--verdigris)!important;box-shadow:0 0 0 5px color-mix(in srgb,var(--felt-deep) 30%,transparent),0 0 20px 6px color-mix(in srgb,var(--felt-deep) 70%,transparent);cursor:pointer}.battle-layout .hero-card.hero-layout-card.selectable:after{background:linear-gradient(var(--walnut),var(--walnut)) padding-box,linear-gradient(135deg,var(--bone),var(--verdigris) 45%,var(--verdigris) 100%) border-box;box-shadow:inset 0 0 0 1px var(--felt-deep)}.battle-layout .hero-card.hero-layout-card.hero-layout-card.target-blocked{border-color:var(--ember-hi)!important;box-shadow:0 0 0 5px color-mix(in srgb,var(--felt-deep) 30%,transparent),0 0 20px 6px color-mix(in srgb,var(--felt-deep) 70%,transparent);cursor:not-allowed}.battle-layout .hero-card.hero-layout-card.target-blocked:after{background:linear-gradient(var(--walnut),var(--walnut)) padding-box,linear-gradient(135deg,var(--bone),var(--ember-hi) 45%,var(--ember) 100%) border-box;box-shadow:inset 0 0 0 1px var(--felt-deep)}.hero-card.hero-layout-card .status-effects-buffs,.hero-card.hero-layout-card .status-effects-debuffs,.hero-card.hero-layout-card .favorite-star,.hero-card.hero-layout-card .selection-indicator{top:32px}.draft-phase .hero-layout-card,.shop-hero-card .hero-layout-card,.hero-card-back .hero-layout-card,.gauntlet-hero-wrapper .hero-layout-card,.team-slot .hero-layout-card,.favorite-hero-display .hero-layout-card{--hero-card-scale: .75}.pack-opening-container{--pack-card-scale: .75}.pack-opening-container .pack-card-slot{width:calc(260px * var(--pack-card-scale));height:calc(391px * var(--pack-card-scale))}.hero-card-back .hero-layout-card{--hero-card-scale: var(--pack-card-scale, .75)}.draft-phase .teams-display .hero-layout-card{--hero-card-scale: .55}.shop-hero-card:has(.hero-layout-card){width:195px;min-height:293.25px}.hero-card.hero-layout-card.disabled-hero:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;background:repeating-linear-gradient(45deg,transparent 0 10px,color-mix(in srgb,var(--ember) 10%,transparent) 10px 20px);pointer-events:none}.collection-card-preview{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;overflow:auto;padding:24px;pointer-events:none}.collection-card-preview>*{pointer-events:auto}.collection-card-preview .hero-layout-card{--hero-card-scale: 1.35}.collection-card-preview>.game-close-btn{position:fixed;top:16px;right:16px}.survival-card-slot.survival-card-placeholder{visibility:hidden;pointer-events:none}.battle-layout .game-board .team-display{container-type:inline-size;container-name:hero-team;width:calc(100% - clamp(140px,15vw,200px) - 36px);left:auto;right:12px;transform:translateY(-50%);flex-wrap:nowrap;gap:12px}@container hero-team (max-width: 820px){.hero-layout-card{--hero-card-scale: .9}}@container hero-team (max-width: 740px){.hero-layout-card{--hero-card-scale: .8}}@container hero-team (max-width: 660px){.hero-layout-card{--hero-card-scale: .7}}@container hero-team (max-width: 580px){.hero-layout-card{--hero-card-scale: .6}}@container hero-team (max-width: 500px){.hero-layout-card{--hero-card-scale: .5}}@container hero-team (max-width: 420px){.hero-layout-card{--hero-card-scale: .4}}@container hero-team (max-width: 340px){.hero-layout-card{--hero-card-scale: .3}}@media (max-width: 1200px){.shop-hero-card .hero-layout-card{--hero-card-scale: .6}.shop-hero-card:has(.hero-layout-card){width:156px;min-height:234.6px}}@media (max-width: 768px){.pack-opening-container{--pack-card-scale: .45}}@media (max-width: 500px){.collection-card-preview .hero-layout-card{--hero-card-scale: 1.1}}@media (max-height: 700px){.game-board .hero-layout-card{--hero-card-height-scale: .7}}@media (max-height: 550px){.game-board .hero-layout-card{--hero-card-height-scale: .5}.collection-card-preview .hero-layout-card{--hero-card-height-scale: .85}}@media (max-width: 900px){.battle-layout.battle-layout{flex-direction:column;margin-right:0;max-height:none}.battle-layout .action-bar{position:relative;width:100%;height:auto;border-left:0}.battle-layout .game-board .opponent-area,.battle-layout .game-board .player-area{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center}.battle-layout .game-board .team-label-container{position:static;transform:none;display:flex;align-items:center;gap:8px;margin:12px 0}.battle-layout .game-board .profile-icon-small{width:32px;height:32px}.battle-layout .game-board .team-display{position:relative;top:auto;right:auto;width:100%;transform:none;container-type:normal;display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));justify-items:center}.battle-layout .game-board .hero-layout-card{--hero-card-scale: .75}}@media (max-width: 360px){.battle-layout .game-board .hero-layout-card{--hero-card-scale: .55}.battle-layout .game-board .team-display{grid-template-columns:1fr}}.card-layout-test-message{position:fixed;z-index:101;top:50%;left:50%;box-sizing:border-box;width:min(560px,calc(100vw - 32px));padding:24px;transform:translate(-50%,-50%);border:1px solid color-mix(in srgb,var(--bone) 35%,transparent);border-radius:12px;color:var(--bone);background:color-mix(in srgb,var(--walnut) 95%,transparent);text-align:center}.card-layout-test-message button{padding:10px 16px;border:1px solid color-mix(in srgb,var(--bone) 60%,transparent);border-radius:8px;color:var(--bone);background:color-mix(in srgb,var(--walnut) 75%,transparent);font:inherit;font-weight:700}.card-layout-test-loading{position:fixed;top:50%;left:50%;width:32px;height:32px;transform:translate(-50%,-50%);border:3px solid color-mix(in srgb,var(--bone) 30%,transparent);border-top-color:var(--bone);border-radius:50%;animation:card-layout-test-spin .8s linear infinite}@keyframes card-layout-test-spin{to{transform:translate(-50%,-50%) rotate(360deg)}}@media (max-width: 760px){.card-layout-test-team-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.card-layout-test-team{flex-basis:auto;min-height:0}}@media (max-width: 500px){.card-layout-test-team-cards{grid-template-columns:minmax(0,1fr)}}.responsive-card-viewport{display:flex;flex:1;min-width:0;min-height:0;align-items:center;justify-content:center}.responsive-card-viewport .responsive-card-grid{display:grid;grid-template-columns:repeat(var(--grid-columns),var(--grid-card-width));grid-auto-rows:var(--grid-row-height);align-content:center;justify-content:center;justify-items:center;gap:18px;width:100%;max-width:none;padding:6px;margin:0;box-sizing:border-box}.responsive-card-grid .hero-card.hero-layout-card{--hero-card-scale: var(--grid-card-scale);transition:border-color .2s ease,box-shadow .2s ease}.responsive-card-grid .survival-card-slot{--hero-card-scale: var(--grid-card-scale)}.responsive-card-grid .shop-hero-card:has(.hero-layout-card){width:var(--grid-card-width);min-height:var(--grid-card-height);margin:0;transform:none;overflow:visible}.responsive-card-grid .shop-hero-wrapper{width:var(--grid-card-width);margin:0}.responsive-card-grid .shop-buy-btn{max-width:none}.binder-intro,.collection-fullscreen.binder-theme{--leather: radial-gradient(color-mix(in srgb, var(--bone) 6%, transparent) 1px, transparent 1.5px) 0 0 / 7px 7px, radial-gradient(color-mix(in srgb, var(--felt-deep) 20%, transparent) 1px, transparent 1.5px) 3px 3px / 7px 7px, linear-gradient(135deg, var(--brass) 0%, var(--walnut) 55%, var(--walnut) 100%);--paper: linear-gradient(135deg, var(--bone) 0%, var(--brass-hi) 100%);--gold: var(--brass-hi);--gold-light: var(--brass-hi)}.binder-intro{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10001;display:flex;align-items:center;justify-content:center;overflow:hidden;cursor:pointer;background:radial-gradient(ellipse at center,var(--walnut) 0%,var(--felt-deep) 85%);animation:biOverlay 1.7s linear forwards}@keyframes biOverlay{0%,82%{opacity:1}to{opacity:0}}.binder-intro-stage{--bw: min(30vw, 36vh);--bh: calc(var(--bw) * 1.3);perspective:1800px;animation:biStage 1.7s ease-in-out forwards}@keyframes biStage{0%{transform:scale(.85);opacity:0}12%{transform:scale(1);opacity:1}62%{transform:scale(1)}to{transform:scale(1.9)}}.binder-intro-book{position:relative;width:var(--bw);height:var(--bh);transform-style:preserve-3d;filter:drop-shadow(0 18px 24px color-mix(in srgb,var(--felt-deep) 60%,transparent));animation:biBook 1.7s ease-in-out forwards}@keyframes biBook{0%,12%{transform:translate(0) rotateY(-18deg)}62%,to{transform:translate(calc(var(--bw) / 2)) rotateY(0)}}.bi-cover{position:absolute;top:0;right:0;bottom:0;left:0;transform-origin:left center;transform-style:preserve-3d;animation:biCover 1.7s ease-in-out forwards}@keyframes biCover{0%,14%{transform:rotateY(0)}58%,to{transform:rotateY(-180deg)}}.bi-face{position:absolute;top:0;right:0;bottom:0;left:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:4px 12px 12px 4px;overflow:hidden}.bi-cover-back{transform:rotateY(180deg)}.bi-cover-front{background:var(--leather);box-shadow:inset 0 0 0 3px color-mix(in srgb,var(--felt-deep) 35%,transparent),inset 0 0 40px color-mix(in srgb,var(--felt-deep) 45%,transparent);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6%}.bi-cover-front:before{content:"";position:absolute;top:5%;right:5%;bottom:5%;left:5%;border:2px dashed var(--gold);border-radius:6px;opacity:.8}.bi-rings{position:absolute;left:3%;top:0;bottom:0;display:flex;flex-direction:column;justify-content:space-evenly}.bi-rings span{width:14px;height:14px;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--bone),var(--bone-dim) 60%,var(--leather));box-shadow:0 1px 3px color-mix(in srgb,var(--felt-deep) 60%,transparent)}.bi-crest{width:42%;filter:drop-shadow(0 0 6px color-mix(in srgb,var(--felt-deep) 45%,transparent))}.bi-crest svg{display:block;width:100%}.bi-title{font-family:var(--font-ui);font-weight:700;font-size:clamp(.8rem,1.6vw,1.4rem);letter-spacing:3px;text-transform:none;color:var(--gold-light);text-shadow:0 2px 4px color-mix(in srgb,var(--felt-deep) 80%,transparent)}.bi-page{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--leather);padding:7%;box-sizing:border-box;border-radius:4px 12px 12px 4px}.bi-page-right{transform:translateZ(-1px)}.bi-page-left{border-radius:12px 4px 4px 12px}.bi-pocket-grid{width:100%;height:100%;box-sizing:border-box;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:6%;padding:6%;background:var(--paper);border-radius:4px;box-shadow:inset 0 0 12px color-mix(in srgb,var(--felt-deep) 35%,transparent)}.bi-pocket{border-radius:4px;background:linear-gradient(115deg,color-mix(in srgb,var(--bone) 55%,transparent),color-mix(in srgb,var(--bone) 15%,transparent));border:1px solid color-mix(in srgb,var(--bone) 70%,transparent);box-shadow:0 1px 3px color-mix(in srgb,var(--felt-deep) 35%,transparent)}.collection-fullscreen.binder-theme{background-color:var(--felt-deep);background-image:repeating-linear-gradient(90deg,color-mix(in srgb,var(--bone) 3%,transparent) 0 2px,transparent 2px 7px),radial-gradient(ellipse at center,var(--walnut) 0%,var(--felt-deep) 80%)}.binder-theme .collection-header{background:linear-gradient(var(--walnut),var(--walnut));border-bottom:2px solid var(--gold);box-shadow:0 4px 14px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.binder-theme .collection-header h2{color:var(--gold-light);font-family:var(--font-ui);text-shadow:0 2px 6px color-mix(in srgb,var(--felt-deep) 70%,transparent)}.binder-theme .filter-controls label{color:var(--bone)}.binder-theme .sort-dropdown,.binder-theme .filter-dropdown,.binder-theme .search-input{background:color-mix(in srgb,var(--brass-hi) 14%,transparent);border:2px solid var(--gold);color:var(--bone)}.binder-theme .sort-dropdown:hover,.binder-theme .filter-dropdown:hover,.binder-theme .search-input:hover{background:color-mix(in srgb,var(--brass-hi) 28%,transparent);box-shadow:0 0 10px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.binder-theme .sort-dropdown:focus,.binder-theme .filter-dropdown:focus,.binder-theme .search-input:focus{box-shadow:0 0 14px color-mix(in srgb,var(--felt-deep) 70%,transparent)}.binder-theme .sort-dropdown option,.binder-theme .filter-dropdown option{background:var(--walnut);color:var(--bone)}.binder-theme .search-input::placeholder{color:color-mix(in srgb,var(--bone) 50%,transparent)}.binder-theme .loading-state{color:var(--gold-light)}.binder-theme .loading-spinner{border-color:color-mix(in srgb,var(--brass-hi) 30%,transparent);border-top-color:var(--gold-light)}.binder-theme .collection-grid-container{padding:14px 60px 44px}.binder-cover{flex:1;min-width:0;max-width:1600px;margin:0 auto;display:flex;padding:clamp(10px,1.6vw,20px);position:relative;box-sizing:border-box;border-radius:16px;background:var(--leather);box-shadow:0 14px 40px color-mix(in srgb,var(--felt-deep) 70%,transparent),inset 0 0 0 2px color-mix(in srgb,var(--felt-deep) 40%,transparent),inset 0 0 50px color-mix(in srgb,var(--felt-deep) 45%,transparent)}.binder-cover:before{content:"";position:absolute;inset:clamp(4px,.7vw,8px);border:2px dashed var(--gold);border-radius:11px;opacity:.75;pointer-events:none}.binder-pages{flex:1;min-width:0;display:flex;position:relative;perspective:2200px;border-radius:6px;overflow:hidden;box-shadow:0 0 0 2px color-mix(in srgb,var(--felt-deep) 45%,transparent)}.binder-page{flex:1;min-width:0;display:flex;box-sizing:border-box;padding:clamp(8px,1vw,14px)}.binder-page.left{padding-right:clamp(26px,3vw,40px);background:linear-gradient(90deg,var(--bone) 0%,var(--bone) 82%,var(--brass-hi) 100%)}.binder-page.right{padding-left:clamp(26px,3vw,40px);background:linear-gradient(270deg,var(--bone) 0%,var(--bone) 82%,var(--brass-hi) 100%)}.binder-spine{position:absolute;top:0;bottom:0;left:50%;width:56px;transform:translate(-50%);pointer-events:none;z-index:10;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--walnut) 28%,transparent) 42%,color-mix(in srgb,var(--walnut) 40%,transparent) 50%,color-mix(in srgb,var(--walnut) 28%,transparent) 58%,transparent)}.binder-ring{position:absolute;left:50%;width:52px;height:20px;transform:translate(-50%);border-radius:12px;background:linear-gradient(180deg,var(--bone) 0%,var(--bone-dim) 42%,var(--bone) 58%,var(--leather-hi) 100%);box-shadow:0 3px 6px color-mix(in srgb,var(--felt-deep) 50%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--felt-deep) 25%,transparent)}.binder-ring:nth-child(1){top:14%}.binder-ring:nth-child(2){top:calc(50% - 10px)}.binder-ring:nth-child(3){bottom:14%}.binder-pocket{position:relative;width:var(--grid-card-width);height:var(--grid-card-height)}.binder-pocket:before{content:"";position:absolute;top:-6px;right:-6px;bottom:-6px;left:-6px;border-radius:10px;border:1px solid color-mix(in srgb,var(--bone) 75%,transparent);background:linear-gradient(115deg,color-mix(in srgb,var(--bone) 14%,transparent) 0%,color-mix(in srgb,var(--bone) 2%,transparent) 40%,color-mix(in srgb,var(--bone) 10%,transparent) 100%);box-shadow:0 2px 6px color-mix(in srgb,var(--felt-deep) 40%,transparent),inset 0 -3px 0 color-mix(in srgb,var(--felt-deep) 10%,transparent);pointer-events:none;z-index:2}.binder-pocket.empty:before{background:color-mix(in srgb,var(--walnut) 7%,transparent);border-color:color-mix(in srgb,var(--brass) 35%,transparent);box-shadow:inset 0 2px 5px color-mix(in srgb,var(--felt-deep) 25%,transparent)}.binder-leaf{position:absolute;top:0;bottom:0;width:50%;z-index:15;transform-style:preserve-3d;pointer-events:none}.binder-leaf.next{right:0;transform-origin:left center;animation:binderFlipNext .48s ease-in-out forwards}.binder-leaf.prev{left:0;transform-origin:right center;animation:binderFlipPrev .48s ease-in-out forwards}.binder-leaf-face{position:absolute;top:0;right:0;bottom:0;left:0;flex:none;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden}.binder-leaf-face.back{transform:rotateY(180deg)}@keyframes binderFlipNext{0%{transform:rotateY(0)}to{transform:rotateY(-180deg)}}@keyframes binderFlipPrev{0%{transform:rotateY(0)}to{transform:rotateY(180deg)}}.collection-fullscreen.binder-theme .collection-grid-container .pagination-arrow-overlay{background:color-mix(in srgb,var(--walnut) 85%,transparent)!important;border:2px solid var(--gold)!important;color:var(--gold-light)!important}.collection-fullscreen.binder-theme .collection-grid-container .pagination-arrow-overlay:hover{background:var(--gold)!important;color:var(--walnut)!important}.binder-theme .page-indicator-overlay{background:color-mix(in srgb,var(--walnut) 90%,transparent);border-color:var(--gold);color:var(--gold-light);box-shadow:0 0 8px color-mix(in srgb,var(--felt-deep) 40%,transparent)}@media (max-width: 480px){.binder-theme .collection-grid-container{padding:8px 8px 56px}.binder-ring{width:36px;height:14px}.binder-spine{width:40px}}@media (prefers-reduced-motion: reduce){.binder-leaf{animation-duration:.01s}}.xp-bar-container{position:relative;width:100%}.xp-bar{position:relative;height:1.5rem;overflow:hidden;background:var(--felt-deep);border:1px solid var(--brass-dim);border-radius:999px;box-shadow:inset 0 2px 4px var(--shade)}.xp-fill{position:relative;height:100%;background:var(--brass-dim);box-shadow:inset 0 1px 0 var(--brass);transition:width .3s var(--ease)}.xp-fill.animating{transition:none}.xp-shine{display:none}.xp-text{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;gap:var(--space-1);font:700 var(--text-xs) / 1 var(--font-ui);font-variant-numeric:tabular-nums;color:var(--bone);text-shadow:0 0 3px var(--felt-deep),0 0 3px var(--felt-deep)}.xp-separator{opacity:.7}.xp-label{margin-left:var(--space-1);color:var(--bone-dim)}.xp-bar.level-up{animation:xp-level-up 2s var(--ease)}@keyframes xp-level-up{30%{box-shadow:inset 0 2px 4px var(--shade),0 0 0 3px var(--brass-hi)}}.xp-gain-popup{position:absolute;top:-1.5rem;right:0;font:700 var(--text-sm) / 1 var(--font-ui);color:var(--brass-hi);opacity:0;transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease)}.xp-gain-popup.show{opacity:1;transform:translateY(-.25rem)}@media (prefers-reduced-motion: reduce){.xp-bar.level-up{animation:none}.xp-fill,.xp-gain-popup{transition:none}}.profile-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:color-mix(in srgb,var(--felt-deep) 80%,transparent);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease-out}.profile-modal{background:linear-gradient(135deg,var(--walnut) 0%,var(--walnut) 50%,var(--walnut) 100%);border:2px solid var(--brass-hi);border-radius:20px;width:min(94vw,980px);height:min(720px,94dvh);display:flex;flex-direction:column;box-sizing:border-box;box-shadow:0 0 50px color-mix(in srgb,var(--felt-deep) 30%,transparent),inset 0 0 50px color-mix(in srgb,var(--felt-deep) 10%,transparent);animation:slideIn .4s ease-out;position:relative}@keyframes slideIn{0%{transform:scale(.9) translateY(-50px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}.profile-header{flex-shrink:0;padding:clamp(8px,1.6dvh,20px) 30px;border-bottom:1px solid color-mix(in srgb,var(--brass) 30%,transparent);display:flex;align-items:center;justify-content:center;position:relative}.profile-header h2{color:var(--brass-hi);font-family:var(--font-ui);font-size:1.8rem;margin:0;text-shadow:0 0 10px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.profile-close-btn{position:absolute;right:30px;top:calc(50% - 18px)}.profile-header-tools{position:absolute;left:30px;top:50%;transform:translateY(-50%);display:flex;gap:8px}.profile-tool-btn{width:36px;height:36px;padding:0;box-sizing:border-box;display:flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid color-mix(in srgb,var(--brass) 40%,transparent);background:color-mix(in srgb,var(--brass) 12%,transparent);color:var(--brass-hi);font-family:var(--font-ui);font-size:1.15rem;font-weight:700;cursor:pointer;transition:all .2s ease}.profile-tool-btn svg{width:22px;height:22px;flex-shrink:0;display:block}.profile-tool-btn:hover{background:color-mix(in srgb,var(--brass) 28%,transparent);box-shadow:0 0 12px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.profile-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;color:var(--bone-dim)}.loading-spinner{width:40px;height:40px;border:3px solid color-mix(in srgb,var(--brass) 30%,transparent);border-top:3px solid var(--brass-hi);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:20px}.profile-main{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(12px,2.5vw,30px);padding:clamp(10px,2dvh,25px) clamp(12px,2.5vw,25px)}.profile-left{min-width:0;min-height:0;display:flex;flex-direction:column;gap:clamp(10px,2dvh,22px)}.profile-identity{display:flex;gap:clamp(12px,2vw,24px);align-items:center;padding-bottom:clamp(10px,2dvh,20px);border-bottom:1px solid color-mix(in srgb,var(--brass) 20%,transparent)}.profile-icon-section{display:flex;flex-direction:column;align-items:center;gap:clamp(6px,1.2dvh,12px);flex-shrink:0}.profile-icon-container{width:clamp(64px,15dvh,110px);height:clamp(64px,15dvh,110px);border-radius:50%;border:3px solid var(--brass-hi);overflow:hidden;box-shadow:0 0 20px color-mix(in srgb,var(--felt-deep) 40%,transparent);position:relative}.profile-icon{width:100%;height:100%;object-fit:cover}.change-icon-btn{background:linear-gradient(135deg,var(--brass-hi) 0%,var(--brass) 100%);border:none;color:var(--bone);padding:clamp(4px,.8dvh,8px) clamp(10px,1.4vw,16px);border-radius:15px;font-size:clamp(.7rem,1.5dvh,.9rem);cursor:pointer;transition:all .3s ease;font-family:var(--font-ui);white-space:nowrap}.change-icon-btn:hover{transform:translateY(-2px);box-shadow:0 5px 15px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.profile-info{flex:1;min-width:0}.level-section{display:flex;flex-direction:column;gap:clamp(4px,1dvh,10px)}.level-display{display:flex;align-items:baseline;gap:10px}.level-label{color:var(--bone-dim);font-size:clamp(.8rem,1.8dvh,1rem)}.level-number{color:var(--accent-orange);font-family:var(--font-ui);font-size:clamp(1.3rem,3.6dvh,2rem);font-weight:700;text-shadow:0 0 10px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.profile-info .xp-bar-container{min-width:0;max-width:260px;gap:4px}.profile-info .xp-bar{height:clamp(14px,2.4dvh,18px);border-width:1px}.profile-info .xp-text{font-size:clamp(.55rem,1.2dvh,.7rem);gap:2px}.profile-info .next-level-info,.profile-info .max-level-info{font-size:.65rem}.profile-stats{flex:1;min-height:0;display:flex;flex-direction:column}.profile-stats h4,.favorite-hero-section h4{flex-shrink:0;color:var(--brass-hi);font-family:var(--font-ui);font-size:clamp(1rem,2.4dvh,1.4rem);margin:0 0 clamp(6px,1.4dvh,16px) 0;text-shadow:0 0 5px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.stats-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:clamp(8px,1.8dvh,18px);flex:1;min-height:0}.profile-stats .stat-item{background:color-mix(in srgb,var(--walnut) 60%,transparent);border:2px solid var(--brass);border-radius:15px;padding:6px 10px;min-height:0;text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center}.profile-stats .stat-label{display:block;color:color-mix(in srgb,var(--bone) 90%,transparent);font-size:clamp(.6rem,1.8dvh,.9rem);margin-bottom:clamp(4px,1.4dvh,14px);font-weight:400;text-align:center;text-transform:none;letter-spacing:1px;font-family:var(--font-ui)}.profile-stats .stat-value{display:block;color:var(--bone);font-family:var(--font-ui);font-size:clamp(1.1rem,4.6dvh,2.4rem);font-weight:700;text-shadow:0 0 15px color-mix(in srgb,var(--felt-deep) 30%,transparent);text-align:center;background:linear-gradient(180deg,var(--bone) 0%,var(--brass) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;filter:drop-shadow(0 0 10px color-mix(in srgb,var(--felt-deep) 50%,transparent))}.favorite-hero-section{min-width:0;min-height:0;display:flex;flex-direction:column;align-items:center}.favorite-hero-display{flex:1;min-height:0;width:100%;display:flex;flex-direction:column;align-items:center;gap:clamp(4px,1dvh,12px);text-align:center}.favorite-hero-display .responsive-card-viewport{width:100%}.favorite-hero-section .favorite-hero-display .hero-layout-card{--hero-card-scale: var(--grid-card-scale);--hero-card-height-scale: var(--grid-card-scale)}.favorite-hero-section .favorite-hero-display .hero-card.hero-layout-card:hover:not(.shop-hero-card){transform:none;z-index:auto;border-color:var(--leather-hi);box-shadow:0 8px 24px color-mix(in srgb,var(--felt-deep) 45%,transparent)}.favorite-hero-stats{flex-shrink:0;color:var(--bone-dim);font-size:clamp(.75rem,1.7dvh,1rem)}.favorite-hero-stats p{margin:0}.no-favorite-hero{background:color-mix(in srgb,var(--brass-hi) 10%,transparent);border:1px solid color-mix(in srgb,var(--brass-hi) 30%,transparent);border-radius:10px;padding:20px;text-align:center;color:var(--bone-dim)}.icon-selector-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:color-mix(in srgb,var(--felt-deep) 90%,transparent);display:flex;align-items:center;justify-content:center;border-radius:20px;z-index:10}.icon-selector{--icon-size: clamp(44px, min(13dvh, 9vw), 110px);background:linear-gradient(135deg,var(--walnut) 0%,var(--walnut) 100%);border:2px solid var(--brass-hi);border-radius:15px;padding:clamp(10px,2.5dvh,30px) clamp(10px,2.5vw,30px);width:96%;max-width:900px;max-height:calc(100% - 20px);height:calc(100% - 20px);box-sizing:border-box;display:flex;flex-direction:column}.icon-selector-header{flex-shrink:0;display:flex;justify-content:space-between;align-items:center;margin-bottom:clamp(8px,2dvh,25px);padding-bottom:clamp(6px,1.5dvh,15px);border-bottom:1px solid color-mix(in srgb,var(--brass) 30%,transparent)}.icon-selector-header h3{color:var(--brass-hi);font-family:var(--font-ui);font-size:clamp(.9rem,2.4dvh,1.17rem);margin:0;text-shadow:0 0 5px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.available-icons{flex:1;min-height:0;overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(calc(var(--icon-size) + 24px),1fr));gap:8px;padding:4px;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--brass) 50%,transparent) transparent}.icon-option{display:flex;flex-direction:column;align-items:center;padding:6px 4px;border:2px solid transparent;border-radius:15px;cursor:pointer;transition:all .3s ease;background:color-mix(in srgb,var(--brass) 5%,transparent)}.icon-option:hover{border-color:var(--brass-hi);background:color-mix(in srgb,var(--brass) 10%,transparent);transform:translateY(-5px)}.icon-option.selected{border-color:var(--accent-orange);background:color-mix(in srgb,var(--brass-hi) 10%,transparent);box-shadow:0 0 20px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.icon-option.selected .icon-option-image{border-color:var(--accent-orange);box-shadow:0 0 20px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.icon-option-image{position:relative;width:var(--icon-size);height:var(--icon-size);border-radius:50%;overflow:hidden;margin-bottom:6px;border:3px solid color-mix(in srgb,var(--brass) 30%,transparent);box-shadow:0 0 15px color-mix(in srgb,var(--felt-deep) 20%,transparent)}.icon-option-image img{width:100%;height:100%;object-fit:cover}.icon-option-name{color:var(--bone-dim);font-size:clamp(.5rem,calc(var(--icon-size) * .15),.9rem);line-height:1.2;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;font-family:var(--font-ui)}.icon-option.selected .icon-option-name{color:var(--accent-orange)}.available-icons.no-names .icon-option-name{display:none}.available-icons.no-names .icon-option-image{margin-bottom:0}.icon-option.locked{cursor:not-allowed;opacity:.55}.icon-option.locked:hover{border-color:transparent;background:color-mix(in srgb,var(--brass) 5%,transparent);transform:none}.icon-option.locked .icon-option-image img{filter:grayscale(1) brightness(.45)}.icon-lock{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:calc(var(--icon-size) * .4);filter:drop-shadow(0 0 4px color-mix(in srgb,var(--felt-deep) 80%,transparent))}@media (max-width: 560px){.profile-modal{width:98vw}.profile-identity{flex-direction:column;text-align:center}}.pack-opening-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:color-mix(in srgb,var(--felt-deep) 95%,transparent);display:flex;justify-content:center;align-items:center;z-index:10000;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:clamp(12px,3vw,40px);box-sizing:border-box}.pack-opening-overlay .pack-opening-container{display:grid;grid-template-columns:repeat(var(--grid-columns),var(--grid-card-width));grid-auto-rows:var(--grid-card-height);column-gap:calc(18px + var(--grid-card-width) * .15);row-gap:calc(18px + var(--grid-card-height) * .15);padding:0;width:100%;height:100%;align-content:center;justify-content:center}.pack-opening-overlay .pack-card-slot{width:var(--grid-card-width);height:var(--grid-card-height)}.pack-opening-overlay .hero-card-back .hero-layout-card{--hero-card-scale: var(--grid-card-scale)}.pack-opening-container{display:flex;gap:clamp(2rem,5vw,4rem);justify-content:center;align-items:center;perspective:1500px}.pack-card-slot{position:relative;width:clamp(180px,15vw,280px);height:clamp(270px,22.5vw,420px);transform-style:preserve-3d;transition:transform .8s ease}.pack-card-slot.zoom-in{animation:zoomToCenter 1s ease-out forwards}@keyframes zoomToCenter{0%{transform:scale(.3) translateY(100vh);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}.pack-card-slot.flipped{animation:flipCard .8s ease-in-out forwards}@keyframes flipCard{0%{transform:rotateY(0) scale(1)}50%{transform:rotateY(90deg) scale(1.1)}to{transform:rotateY(180deg) scale(1)}}.pack-card-slot.revealed{animation:revealBounce .6s ease-out forwards}@keyframes revealBounce{0%{transform:rotateY(180deg) scale(1)}50%{transform:rotateY(180deg) scale(1.15)}to{transform:rotateY(180deg) scale(1.05)}}.pack-front{position:absolute;width:100%;height:100%;backface-visibility:hidden;display:flex;justify-content:center;align-items:center;background:linear-gradient(135deg,color-mix(in srgb,var(--brass) 30%,transparent) 0%,color-mix(in srgb,var(--leather) 30%,transparent) 100%);border:3px solid color-mix(in srgb,var(--brass) 60%,transparent);border-radius:12px;box-shadow:0 10px 40px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.pack-image-full{width:100%;height:100%;object-fit:cover;border-radius:10px}.hero-card-back{position:absolute;width:100%;height:100%;backface-visibility:hidden;transform:rotateY(180deg);display:flex;justify-content:center;align-items:center}.hero-card-revealed{width:100%;height:100%;background:linear-gradient(135deg,var(--walnut) 0%,var(--walnut) 100%);border:3px solid var(--brass);border-radius:12px;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 10px 40px color-mix(in srgb,var(--felt-deep) 40%,transparent);transition:all .3s ease}.hero-card-revealed.glow{animation:cardGlow 2s ease-in-out infinite;border-color:var(--brass)}@keyframes cardGlow{0%,to{box-shadow:0 0 15px color-mix(in srgb,var(--felt-deep) 40%,transparent),0 0 25px color-mix(in srgb,var(--felt-deep) 30%,transparent),0 0 35px color-mix(in srgb,var(--felt-deep) 20%,transparent);border-color:var(--brass)}50%{box-shadow:0 0 20px color-mix(in srgb,var(--felt-deep) 60%,transparent),0 0 35px color-mix(in srgb,var(--felt-deep) 40%,transparent),0 0 50px color-mix(in srgb,var(--felt-deep) 30%,transparent);border-color:var(--brass)}}.hero-reveal-image{width:100%;height:60%;object-fit:cover;background:var(--walnut)}.hero-card-revealed .hero-card-content{flex:1;display:flex;flex-direction:column;padding:0;background:color-mix(in srgb,var(--felt-deep) 80%,transparent)}.hero-card-revealed .hero-stats{background:color-mix(in srgb,var(--felt-deep) 80%,transparent);color:var(--bone);padding:clamp(10px,1vw,14px) clamp(12px,1.2vw,16px) clamp(8px,.8vw,12px) clamp(12px,1.2vw,16px);border-radius:0 0 10px 10px;font-size:clamp(.85rem,1vw,1.1rem);margin:0;width:100%;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center}.hero-card-revealed .hero-name{font-weight:700;font-size:clamp(1.1rem,1.3vw,1.5rem);margin-bottom:clamp(5px,.6vw,8px);text-align:center;color:var(--bone);padding-bottom:clamp(5px,.6vw,8px);border-bottom:1px solid color-mix(in srgb,var(--bone) 30%,transparent)}.hero-card-revealed .hero-stats-row{display:flex;align-items:center;font-size:clamp(.85rem,1vw,1.1rem);color:var(--bone);margin-bottom:clamp(4px,.5vw,6px);font-weight:700;line-height:1.3}.hero-card-revealed .hero-stats-row:last-child{margin-bottom:0}.hero-card-revealed .stat-icon{width:clamp(16px,1.3vw,20px);height:clamp(16px,1.3vw,20px);margin-right:clamp(7px,.7vw,10px);flex-shrink:0}@keyframes tooltipFadeInLeft{0%{opacity:0;transform:translateY(-50%) translate(10px)}to{opacity:1;transform:translateY(-50%) translate(0)}}.hero-card-back:hover .hero-card-revealed{transform:scale(1.05);transition:transform .2s ease;z-index:10}.hero-card-revealed{transition:transform .2s ease}@media (max-width: 768px){.pack-opening-container{gap:1rem;flex-wrap:wrap;padding:1rem}.pack-card-slot{width:clamp(120px,25vw,180px);height:clamp(180px,37.5vw,270px)}}.shop-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:color-mix(in srgb,var(--felt-deep) 85%,transparent);display:flex;justify-content:center;align-items:center;z-index:1000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.shop-container{background:linear-gradient(135deg,var(--walnut) 0%,var(--walnut) 100%);border:2px solid var(--brass);border-radius:12px;width:95vw;max-width:1400px;height:90dvh;display:flex;flex-direction:column;box-shadow:0 10px 50px color-mix(in srgb,var(--felt-deep) 50%,transparent);position:relative;overflow:hidden}.shop-header{display:flex;justify-content:space-between;align-items:center;padding:clamp(.8rem,1.5vw,1.2rem) clamp(1rem,2vw,1.5rem);background:color-mix(in srgb,var(--felt-deep) 30%,transparent);border-bottom:2px solid color-mix(in srgb,var(--brass) 30%,transparent)}.shop-header h2{margin:0;font-size:clamp(1.3rem,2vw,1.8rem);color:var(--brass);text-shadow:0 0 10px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.shop-header-right{display:flex;align-items:center;gap:1rem}.shop-vp-display{display:flex;align-items:center;gap:.5rem;background:color-mix(in srgb,var(--brass-hi) 10%,transparent);padding:clamp(.4rem,.8vw,.6rem) clamp(.8rem,1.2vw,1rem);border-radius:8px;border:2px solid color-mix(in srgb,var(--brass-hi) 30%,transparent)}.shop-vp-display .vp-icon{font-size:clamp(1.2rem,1.8vw,1.5rem)}.shop-vp-display .vp-amount{font-size:clamp(1rem,1.5vw,1.3rem);font-weight:700;color:var(--brass-hi);text-shadow:0 0 10px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.shop-message{padding:clamp(.6rem,1vw,.8rem);margin:clamp(.5rem,1vw,1rem) clamp(1rem,2vw,1.5rem);border-radius:8px;font-weight:700;text-align:center;animation:slideDown .3s ease}.shop-message.success{background:color-mix(in srgb,var(--verdigris) 20%,transparent);border:2px solid var(--verdigris);color:var(--verdigris)}.shop-message.error{background:color-mix(in srgb,var(--ember) 20%,transparent);border:2px solid var(--ember);color:var(--ember)}@keyframes slideDown{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}.shop-main-content{display:flex;gap:clamp(1rem,2vw,1.5rem);padding:clamp(.8rem,1.5vw,1rem) clamp(1rem,2vw,1.5rem);flex:1;overflow:auto;min-height:0}.shop-sale-section{flex:1;display:flex;flex-direction:column;overflow:visible;padding-right:clamp(.5rem,1vw,1rem);min-width:0}.shop-section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:clamp(.8rem,1.5vw,1.2rem);padding-bottom:clamp(.5rem,1vw,.8rem);border-bottom:2px solid color-mix(in srgb,var(--brass) 30%,transparent)}.shop-section-header h3{margin:0;font-size:clamp(1.3rem,2vw,1.6rem);color:var(--brass);text-shadow:0 0 10px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.sale-timer{display:flex;align-items:center;gap:.5rem;background:color-mix(in srgb,var(--brass-hi) 10%,transparent);padding:clamp(.4rem,.8vw,.6rem) clamp(.8rem,1.2vw,1rem);border-radius:8px;border:2px solid color-mix(in srgb,var(--brass-hi) 30%,transparent);font-size:clamp(.9rem,1.2vw,1.1rem);color:var(--brass-hi)}.timer-icon{font-size:clamp(1.1rem,1.5vw,1.3rem)}.shop-sale-container{display:flex;align-items:stretch;gap:clamp(.5rem,1vw,1rem);padding:clamp(.5rem,1vw,1rem) 0;flex:1;min-height:0}.shop-pagination-arrow{background:linear-gradient(135deg,var(--brass) 0%,var(--brass) 100%);border:2px solid var(--brass);color:var(--bone);font-size:clamp(1.5rem,2.5vw,2rem);width:clamp(40px,5vw,50px);height:clamp(40px,5vw,50px);border-radius:50%;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;flex-shrink:0;align-self:center}.shop-pagination-arrow:hover:not(:disabled){background:linear-gradient(135deg,var(--brass) 0%,var(--brass) 100%);transform:scale(1.1);box-shadow:0 4px 15px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.shop-pagination-arrow:disabled{opacity:.3;cursor:not-allowed;background:var(--leather-hi);border-color:var(--leather-hi)}.shop-sale-grid{display:flex;gap:clamp(.3rem,.5vw,.4rem);justify-content:center;flex:0 1 auto;min-width:0;overflow:visible}.shop-pack-section{flex:0 0 clamp(240px,25%,320px);box-sizing:border-box;display:flex;flex-direction:column;padding:clamp(1rem,1.5vw,1.5rem);background:color-mix(in srgb,var(--brass) 10%,transparent);border:2px solid color-mix(in srgb,var(--brass) 30%,transparent);border-radius:12px;align-items:center}.pack-description{text-align:center;color:var(--bone-dim);font-size:clamp(.85rem,1.1vw,1rem);margin-bottom:clamp(1rem,1.5vw,1.5rem);line-height:1.4}.pack-wrapper{width:100%;display:flex;flex-direction:column;align-items:center;max-width:280px}.pack-card-display{width:100%;max-width:280px;height:380px;margin:clamp(3px,.4vw,6px);cursor:pointer;transition:all .3s ease;border-radius:8px;overflow:hidden;background:linear-gradient(135deg,color-mix(in srgb,var(--brass) 20%,transparent) 0%,color-mix(in srgb,var(--leather) 20%,transparent) 100%);border:2px solid color-mix(in srgb,var(--brass) 50%,transparent);position:relative;display:flex;align-items:center;justify-content:center}.pack-card-display:hover{box-shadow:0 8px 25px color-mix(in srgb,var(--felt-deep) 50%,transparent);border-color:var(--brass)}.shop-pack-section .pack-card-display.shop-hero-card{width:100%;min-height:0;height:clamp(200px,calc(100dvh - 440px),420px);box-sizing:border-box}.pack-image{width:100%;height:100%;object-fit:cover;object-position:center 40%;border-radius:6px}.pack-title-overlay{position:absolute;bottom:15px;left:50%;transform:translate(-50%);font-family:var(--font-ui);font-size:clamp(1rem,1.4vw,1.3rem);font-weight:700;color:var(--ember);text-shadow:0 0 10px color-mix(in srgb,var(--felt-deep) 90%,transparent),0 0 20px color-mix(in srgb,var(--felt-deep) 70%,transparent),2px 2px 4px color-mix(in srgb,var(--felt-deep) 80%,transparent),0 0 30px color-mix(in srgb,var(--felt-deep) 50%,transparent);letter-spacing:1px;text-align:center;padding:8px 16px;background:linear-gradient(180deg,color-mix(in srgb,var(--felt-deep) 40%,transparent) 0%,color-mix(in srgb,var(--felt-deep) 70%,transparent) 100%);border-radius:8px;border:1px solid color-mix(in srgb,var(--ember) 40%,transparent);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);white-space:nowrap}.pack-fallback{font-size:clamp(1.5rem,2.5vw,2rem);color:var(--brass);text-align:center;font-weight:700;line-height:1.5}.shop-pack-section .shop-buy-btn{max-width:none}.pack-buy-btn{width:100%;background:linear-gradient(135deg,var(--brass) 0%,var(--brass) 100%);border:2px solid var(--brass)}.pack-buy-btn:hover:not(:disabled){background:linear-gradient(135deg,var(--brass) 0%,var(--brass) 100%);box-shadow:0 4px 15px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.pack-description{margin:12px 0 8px;color:var(--bone);font-size:clamp(.85rem,1vw,.95rem);text-align:center;line-height:1.4;font-style:italic}.pack-info-btn{width:100%;background:linear-gradient(135deg,var(--leather) 0%,var(--walnut) 100%);border:2px solid var(--brass);margin-top:8px}.pack-info-btn:hover:not(:disabled){background:linear-gradient(135deg,var(--leather) 0%,var(--leather) 100%);box-shadow:0 4px 15px color-mix(in srgb,var(--felt-deep) 40%,transparent);border-color:var(--leather-hi)}.pack-vp-badge{position:absolute;top:clamp(5px,.8vw,8px);left:clamp(5px,.8vw,8px);z-index:10001}.shop-section-title{text-align:center;margin-bottom:clamp(1rem,1.5vw,1.5rem)}.shop-section-title h3{margin:0 0 clamp(.3rem,.5vw,.5rem) 0;font-size:clamp(1.2rem,1.8vw,1.5rem);color:var(--brass)}.shop-section-title p{margin:0;font-size:clamp(.85rem,1.1vw,1rem);color:var(--bone-dim)}.shop-empty{text-align:center;padding:clamp(2rem,4vw,4rem);color:var(--bone-dim)}.shop-empty .empty-icon{font-size:clamp(3rem,5vw,4rem);margin-bottom:clamp(1rem,1.5vw,1.5rem)}.shop-empty h3{color:var(--verdigris);margin-bottom:clamp(.5rem,1vw,1rem)}.shop-heroes-grid{display:flex;justify-content:center;gap:clamp(8px,1vw,12px);flex-wrap:wrap;padding:clamp(.5rem,1vw,1rem) 0}.shop-hero-wrapper{position:relative;display:flex;flex-direction:column;align-items:center;gap:clamp(4px,.6vw,8px);overflow:visible;transform:none!important}.shop-vp-badge{position:absolute;top:clamp(5px,.5vw,8px);left:clamp(5px,.5vw,8px);background:linear-gradient(135deg,var(--brass-hi) 0%,var(--brass-hi) 100%);color:var(--felt-deep);padding:clamp(2px,.25vw,3px) clamp(5px,.5vw,8px);border-radius:clamp(10px,1vw,15px);font-size:clamp(.6rem,.8vw,.85rem);font-weight:700;box-shadow:0 2px 6px color-mix(in srgb,var(--felt-deep) 40%,transparent);border:1px solid color-mix(in srgb,var(--brass-hi) 60%,transparent);z-index:10001;pointer-events:none}.shop-hero-card{width:clamp(156px,12vw,234px);min-height:clamp(240px,18.5vw,360px);margin:clamp(3px,.4vw,6px);cursor:pointer;transition:box-shadow .3s ease;border-radius:8px;transform:none!important;position:relative;overflow:visible}.shop-hero-card .hero-card{transform:none!important;filter:none!important;width:100%;margin:0}.shop-hero-card .hero-card:hover{transform:none!important;filter:none!important;z-index:10000!important}.shop-hero-card:hover{z-index:10000}.shop-hero-card.purchased{opacity:.6;cursor:not-allowed;filter:grayscale(50%);pointer-events:none}.shop-hero-card.purchased:hover{opacity:.6!important;filter:grayscale(50%)!important;transform:none!important}.shop-hero-purchased-overlay{position:absolute;top:0;left:0;right:0;bottom:3px;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--felt-deep) 70%,transparent);border-radius:8px;pointer-events:none;z-index:5}.purchased-text{font-size:clamp(1.2rem,1.8vw,1.8rem);font-weight:700;color:var(--verdigris);text-shadow:0 0 10px color-mix(in srgb,var(--felt-deep) 80%,transparent),0 0 20px color-mix(in srgb,var(--felt-deep) 60%,transparent),2px 2px 4px color-mix(in srgb,var(--felt-deep) 80%,transparent);transform:rotate(-15deg);letter-spacing:2px;background:linear-gradient(135deg,var(--verdigris) 0%,var(--verdigris) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:purchasedPulse 2s ease-in-out infinite}@keyframes purchasedPulse{0%,to{filter:brightness(1);text-shadow:0 0 10px color-mix(in srgb,var(--felt-deep) 80%,transparent),0 0 20px color-mix(in srgb,var(--felt-deep) 60%,transparent)}50%{filter:brightness(1.3);text-shadow:0 0 15px var(--felt-deep),0 0 30px color-mix(in srgb,var(--felt-deep) 80%,transparent)}}.shop-hero-card:hover,.shop-hero-wrapper .shop-hero-card:hover,.shop-sale-grid .shop-hero-wrapper .shop-hero-card:hover{transform:none!important;scale:1!important;box-shadow:none}.shop-hero-card.selected{box-shadow:0 10px 30px color-mix(in srgb,var(--felt-deep) 60%,transparent);transform:none!important;scale:1!important}.shop-buy-btn{background:linear-gradient(135deg,var(--verdigris) 0%,var(--verdigris) 100%);border:2px solid var(--verdigris);color:var(--bone);padding:clamp(.4rem,.7vw,.6rem) clamp(.8rem,1.2vw,1.2rem);border-radius:6px;font-size:clamp(.75rem,.95vw,.9rem);font-weight:700;cursor:pointer;transition:all .3s ease;white-space:nowrap;width:100%;max-width:clamp(156px,12vw,234px)}.shop-buy-btn:hover:not(:disabled){background:linear-gradient(135deg,var(--verdigris) 0%,var(--verdigris) 100%);transform:scale(1.05);box-shadow:0 4px 15px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.shop-buy-btn:disabled{opacity:.5;cursor:not-allowed;background:var(--leather-hi);border-color:var(--leather-hi)}.pack-animation{font-size:clamp(4rem,8vw,6rem);animation:packShake .5s infinite;margin-bottom:clamp(1rem,2vw,2rem)}@keyframes packShake{0%,to{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}.revealed-heroes{display:flex;flex-direction:column;gap:clamp(.8rem,1.2vw,1rem);margin-top:clamp(1rem,1.5vw,1.5rem)}.revealed-hero{font-size:clamp(1.2rem,1.8vw,1.5rem);color:var(--brass-hi);font-weight:700;animation:revealHero .5s ease;text-shadow:0 0 20px color-mix(in srgb,var(--felt-deep) 60%,transparent)}@keyframes revealHero{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.shop-loading{display:flex;justify-content:center;align-items:center;height:100%;font-size:clamp(1.2rem,1.8vw,1.5rem);color:var(--bone-dim)}@media (max-width: 1400px){.shop-heroes-grid{gap:clamp(6px,.8vw,10px)}.shop-hero-card{width:clamp(140px,11vw,210px);min-height:clamp(220px,17vw,340px)}.shop-buy-btn{max-width:clamp(140px,11vw,210px)}}@media (max-width: 1024px){.shop-hero-card{width:clamp(130px,10vw,190px);min-height:clamp(200px,15.5vw,310px)}.shop-buy-btn{max-width:clamp(130px,10vw,190px)}}@media (max-width: 768px){.shop-main-content{flex-direction:column}.shop-sale-section{flex:none;height:max(520px,75dvh)}.shop-pack-section{flex:none}.shop-section-header{flex-wrap:wrap;gap:8px}.shop-sale-container{position:relative;padding-bottom:52px}.shop-sale-container .shop-pagination-arrow{position:absolute;bottom:0}.shop-sale-container .shop-pagination-arrow.left{left:0}.shop-sale-container .shop-pagination-arrow.right{right:0}.shop-container{width:98vw;height:95vh}.shop-header{flex-wrap:wrap;gap:.5rem}.pack-card{flex-direction:column;text-align:center}.shop-hero-card{width:clamp(120px,28vw,160px);min-height:clamp(180px,42vw,260px)}.shop-buy-btn{max-width:clamp(120px,28vw,160px);font-size:.75rem;padding:.4rem .6rem}}.pack-contents-modal{position:fixed;top:0;left:0;width:100vw;height:100vh;background:color-mix(in srgb,var(--felt-deep) 85%,transparent);display:flex;align-items:center;justify-content:center;z-index:10000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.pack-contents-container{background:linear-gradient(135deg,var(--walnut) 0%,var(--walnut) 100%);border-radius:16px;border:2px solid var(--brass);box-shadow:0 8px 32px color-mix(in srgb,var(--felt-deep) 30%,transparent);padding:24px;width:min(96vw,1600px);height:92dvh;box-sizing:border-box;display:flex;flex-direction:column;min-height:0;overflow:hidden;position:relative}.modal-close-btn{position:absolute;top:12px;right:12px}.pack-contents-title{color:var(--brass);font-size:clamp(1.5rem,2.5vw,2rem);margin:0 0 16px;text-align:center;text-shadow:0 0 10px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.pack-contents-wrapper{display:flex;align-items:center;gap:16px;position:relative}.pack-contents-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;flex:1}.pack-content-hero .shop-hero-card{cursor:pointer;transition:none;transform:scale(.85);transform-origin:center;overflow:hidden}.pack-content-hero .hero-card{height:100%;display:flex;flex-direction:column}.pack-content-hero .hero-image{object-fit:cover;object-position:center center;width:100%;flex-shrink:0}.pack-content-hero .shop-hero-card.purchased{opacity:.6;cursor:not-allowed;filter:grayscale(50%);pointer-events:none}.pack-content-hero .shop-hero-card.purchased:hover{opacity:.6!important;filter:grayscale(50%)!important;transform:scale(.85)!important}.pack-pagination-arrow{background:linear-gradient(135deg,color-mix(in srgb,var(--brass) 20%,transparent) 0%,color-mix(in srgb,var(--brass) 20%,transparent) 100%);border:2px solid color-mix(in srgb,var(--brass) 30%,transparent);color:var(--brass);font-size:2rem;width:50px;height:50px;border-radius:50%;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;flex-shrink:0}.pack-pagination-arrow:hover:not(:disabled){background:linear-gradient(135deg,color-mix(in srgb,var(--brass) 30%,transparent) 0%,color-mix(in srgb,var(--brass) 30%,transparent) 100%);border-color:color-mix(in srgb,var(--brass) 50%,transparent);transform:scale(1.05)}.pack-pagination-arrow:disabled{opacity:.3;cursor:not-allowed}.pack-contents-pagination-info{text-align:center;color:var(--bone);font-size:.9rem;margin-top:12px;opacity:.8}.pack-contents-pagination{display:flex;align-items:center;justify-content:center;gap:40px;margin-top:20px;min-height:48px;flex-shrink:0}@media (max-width: 600px){.pack-contents-container{padding:48px 12px 12px;height:96dvh}.pack-contents-title{font-size:1.25rem}.pack-contents-pagination{gap:12px}}.pagination-arrow{background:linear-gradient(135deg,color-mix(in srgb,var(--brass) 30%,transparent) 0%,color-mix(in srgb,var(--brass) 30%,transparent) 100%);border:2px solid color-mix(in srgb,var(--brass) 50%,transparent);border-radius:8px;padding:10px 20px;font-size:1.5rem;color:var(--brass);cursor:pointer;transition:all .3s ease;font-weight:700}.pagination-arrow:hover:not(:disabled){background:linear-gradient(135deg,color-mix(in srgb,var(--brass) 50%,transparent) 0%,color-mix(in srgb,var(--brass) 50%,transparent) 100%);border-color:var(--brass);transform:translateY(-2px);box-shadow:0 4px 15px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.pagination-arrow:disabled{opacity:.3;cursor:not-allowed}.pagination-info{color:var(--bone);font-size:clamp(.9rem,1.1vw,1rem);font-weight:600}.requirement-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:color-mix(in srgb,var(--felt-deep) 70%,transparent);display:flex;justify-content:center;align-items:center;z-index:2000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.requirement-modal-container{background:linear-gradient(135deg,var(--walnut) 0%,var(--walnut) 100%);border:2px solid var(--ember-hi);border-radius:12px;width:90%;max-width:380px;padding:0;box-shadow:0 10px 40px color-mix(in srgb,var(--felt-deep) 40%,transparent);animation:modalSlideIn .3s ease}@keyframes modalSlideIn{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}.requirement-modal-content{padding:1.5rem}.requirement-modal-header{display:flex;align-items:center;gap:.75rem;padding:1.25rem 1.5rem;background:color-mix(in srgb,var(--ember-hi) 15%,transparent);border-bottom:2px solid color-mix(in srgb,var(--ember-hi) 30%,transparent)}.requirement-warning-icon{font-size:1.75rem;line-height:1;filter:drop-shadow(0 0 8px color-mix(in srgb,var(--felt-deep) 60%,transparent))}.requirement-title{margin:0;font-size:1.25rem;color:var(--ember-hi);font-weight:600;text-shadow:0 0 10px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.requirement-message{margin:0 0 1.25rem;font-size:1rem;color:var(--bone);line-height:1.6;text-align:center}.requirement-display{background:color-mix(in srgb,var(--felt-deep) 40%,transparent);border:1px solid color-mix(in srgb,var(--ember-hi) 30%,transparent);border-radius:8px;padding:1rem 1.25rem;margin-bottom:1rem}.requirement-row{display:flex;justify-content:space-between;align-items:center}.requirement-label{font-size:1rem;color:var(--bone-dim);font-weight:500}.requirement-value{font-size:1.15rem;color:var(--brass-hi);font-weight:600}.current-count{color:var(--ember-hi);font-weight:700;font-size:1.2rem}.requirement-hint{margin:0;font-size:.9rem;color:var(--brass);text-align:center;font-style:italic}.requirement-modal-button{width:100%;padding:1rem;background:linear-gradient(135deg,var(--brass) 0%,var(--leather) 100%);color:var(--bone);border:none;border-radius:0 0 10px 10px;font-size:1rem;font-weight:700;cursor:pointer;transition:all .3s ease;text-transform:none;letter-spacing:1px}.requirement-modal-button:hover{background:linear-gradient(135deg,var(--brass) 0%,var(--brass) 100%);box-shadow:0 0 15px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.requirement-modal-button:active{transform:scale(.98)}.rules-modal{background:var(--walnut);border:2px solid var(--brass-dim);border-radius:20px;padding:0;max-width:700px;width:90%;max-height:85vh;overflow:hidden;box-shadow:0 20px 40px color-mix(in srgb,var(--felt-deep) 50%,transparent);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.rules-modal-header{background:linear-gradient(135deg,color-mix(in srgb,var(--brass) 30%,transparent) 0%,color-mix(in srgb,var(--brass) 40%,transparent) 100%);padding:20px 30px;border-bottom:1px solid color-mix(in srgb,var(--brass) 30%,transparent);display:flex;justify-content:space-between;align-items:center}.rules-modal-header h3{margin:0;color:var(--bone);font-size:1.5rem;font-weight:700;font-family:var(--font-ui)}.rules-modal-content{padding:25px 30px;max-height:calc(85vh - 80px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--brass-hi) color-mix(in srgb,var(--bone) 10%,transparent)}.rules-modal-content::-webkit-scrollbar{width:8px}.rules-modal-content::-webkit-scrollbar-track{background:color-mix(in srgb,var(--bone) 5%,transparent);border-radius:10px}.rules-modal-content::-webkit-scrollbar-thumb{background:var(--brass-hi);border-radius:10px}.rules-modal-content::-webkit-scrollbar-thumb:hover{background:var(--brass)}@media (max-width: 768px){.rules-modal{max-width:95%;max-height:90vh}.rules-modal-content{padding:20px}.rules-category{padding:15px 18px}.rule-item{flex-direction:column;gap:5px}.rule-label{min-width:auto}}.rules-category{background:var(--leather);border:1px solid color-mix(in srgb,var(--bone) 10%,transparent);border-radius:12px;padding:18px 22px;margin-bottom:18px;transition:all .3s ease}.rules-category:hover{border-color:color-mix(in srgb,var(--brass) 30%,transparent);background:color-mix(in srgb,var(--bone) 8%,transparent)}.rules-category h4{margin:0 0 15px;color:var(--brass-hi);font-size:1.1rem;font-weight:700;font-family:var(--font-ui);text-transform:none;letter-spacing:1px;padding-bottom:10px;border-bottom:1px solid color-mix(in srgb,var(--brass-hi) 20%,transparent)}.rule-item{display:flex;gap:12px;margin-bottom:12px;padding:10px 0;border-bottom:1px solid color-mix(in srgb,var(--bone) 5%,transparent);align-items:flex-start}.rule-item:last-child{border-bottom:none;margin-bottom:0}.rule-label{color:var(--brass-hi);font-weight:700;min-width:140px;font-size:.95rem;flex-shrink:0}.rule-value{color:var(--bone-dim);line-height:1.5;font-size:.95rem}.rule-text{color:var(--bone-dim);line-height:1.6;margin-bottom:10px;padding-left:0;font-size:.95rem}.rule-text:last-child{margin-bottom:0}.rule-text strong{color:var(--brass-hi);font-weight:700}@keyframes questCheckPop{0%{transform:scale(.2) rotate(-30deg);opacity:0}60%{transform:scale(1.5) rotate(8deg);opacity:1}to{transform:scale(1) rotate(0)}}@keyframes questRowFlash{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--felt-deep) 0%,transparent)}35%{box-shadow:0 0 24px 6px color-mix(in srgb,var(--felt-deep) 80%,transparent)}to{box-shadow:0 0 0 0 color-mix(in srgb,var(--felt-deep) 0%,transparent)}}.quest-reward-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:3000;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--felt-deep) 65%,transparent);animation:questOverlayIn .25s ease-out}.quest-reward-modal{position:relative;min-width:300px;max-width:90vw;padding:28px 32px 24px;border-radius:16px;text-align:center;color:var(--bone);background:linear-gradient(160deg,var(--walnut) 0%,var(--walnut) 100%);border:2px solid var(--verdigris);box-shadow:0 0 40px color-mix(in srgb,var(--felt-deep) 45%,transparent);animation:questModalIn .55s cubic-bezier(.2,1.4,.4,1)}.quest-reward-modal h3{margin:6px 0 14px;font-size:1.5rem;color:var(--verdigris)}.quest-reward-star{font-size:2.6rem;color:var(--brass-hi);animation:questStarSpin 1.2s ease-out;text-shadow:0 0 16px color-mix(in srgb,var(--felt-deep) 90%,transparent)}.quest-reward-list{list-style:none;margin:0 0 16px;padding:0;display:flex;flex-direction:column;gap:8px}.quest-reward-list li{opacity:0;animation:questItemIn .4s ease-out forwards}.quest-reward-check{color:var(--verdigris);font-weight:700;margin-right:8px}.quest-reward-chips{display:flex;justify-content:center;gap:12px;margin-bottom:18px}.quest-reward-chip{padding:6px 14px;border-radius:999px;font-weight:700;opacity:0;animation:questChipIn .4s cubic-bezier(.2,1.6,.4,1) forwards}.quest-reward-chip.xp{background:color-mix(in srgb,var(--brass) 20%,transparent);color:var(--brass);border:1px solid var(--brass);animation-delay:.8s}.quest-reward-chip.vp{background:color-mix(in srgb,var(--brass-hi) 20%,transparent);color:var(--brass-hi);border:1px solid var(--brass-hi);animation-delay:.95s}.quest-reward-levelup{margin-bottom:14px;font-weight:800;color:var(--brass-hi);animation:vpBump .5s ease-in-out infinite alternate}.quest-reward-ok{padding:8px 32px;border:none;border-radius:999px;font-weight:700;font-size:1rem;color:var(--walnut);background:var(--verdigris);cursor:pointer;opacity:0;animation:questItemIn .4s ease-out 1.1s forwards}.quest-reward-ok:hover{background:var(--verdigris)}@keyframes questOverlayIn{0%{opacity:0}to{opacity:1}}@keyframes questModalIn{0%{opacity:0;transform:scale(.5) translateY(30px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes questStarSpin{0%{transform:scale(0) rotate(-180deg)}to{transform:scale(1) rotate(0)}}@keyframes questItemIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes questChipIn{0%{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}@media (prefers-reduced-motion: reduce){.quest-reward-overlay,.quest-reward-modal,.quest-reward-star,.quest-reward-levelup{animation:none}.quest-reward-list li,.quest-reward-chip,.quest-reward-ok{animation:none;opacity:1}}.settings-modal{max-width:520px}.settings-content{display:flex;flex-direction:column;gap:8px;padding:20px 30px 26px}.settings-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 0;border-bottom:1px solid color-mix(in srgb,var(--bone) 8%,transparent)}.settings-row:last-child{border-bottom:none}.settings-row.disabled{opacity:.45}.settings-label{display:flex;flex-direction:column;gap:2px;color:var(--bone);font-weight:600}.settings-label small{color:var(--bone-dim);font-weight:400;font-size:.8rem}.settings-segmented{display:flex;padding:3px;border-radius:999px;background:color-mix(in srgb,var(--felt-deep) 35%,transparent)}.settings-segmented button{border:none;border-radius:999px;padding:6px 14px;font-size:.85rem;color:var(--bone-dim);background:transparent;cursor:pointer;transition:background .2s ease,color .2s ease}.settings-segmented button.active{background:var(--brass);color:var(--bone)}.settings-switch{position:relative;flex-shrink:0;width:46px;height:26px;border:none;border-radius:999px;background:color-mix(in srgb,var(--bone) 20%,transparent);cursor:pointer;transition:background .2s ease}.settings-switch.on{background:var(--verdigris)}.settings-switch-knob{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:var(--bone);transition:transform .2s ease}.settings-switch.on .settings-switch-knob{transform:translate(20px)}.settings-ping{flex-shrink:0;padding:5px 14px;border-radius:999px;font-family:var(--font-ui);font-size:.9rem;font-weight:700;color:var(--bone-dim);background:color-mix(in srgb,var(--felt-deep) 35%,transparent)}.settings-ping.good{color:var(--verdigris)}.settings-ping.ok{color:var(--brass-hi)}.settings-ping.bad{color:var(--ember-hi)}.settings-slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:190px;height:6px;border-radius:999px;outline:none;cursor:pointer}.settings-slider:disabled{cursor:not-allowed}.settings-slider::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:var(--bone);border:2px solid var(--verdigris)}.settings-slider::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--bone);border:2px solid var(--verdigris)}.lobby{position:relative;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;background:var(--felt-surface);color:var(--bone);font-family:var(--font-ui);text-align:left;font-variant-numeric:lining-nums}.lobby-bar{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding:var(--space-4) var(--space-6);background:var(--walnut);border-bottom:1px solid var(--brass-dim);box-shadow:0 6px 18px var(--shade)}.lobby-title{margin:0;font:400 var(--text-xl) / 1 var(--font-display);letter-spacing:.01em;color:var(--bone)}.lobby-status{display:flex;align-items:center;gap:var(--space-5)}.lobby-coins .coin-icon{width:1.25em;height:1.25em;align-self:center}.lobby-coins-amount{display:inline-block}.lobby-coins-amount.vp-bump{animation:lobby-bump .42s var(--ease)}@keyframes lobby-bump{40%{transform:scale(1.3);color:var(--brass-hi)}}.lobby-level{display:flex;flex-direction:column;gap:var(--space-1);min-width:11rem}.lobby-level-text{font:700 var(--text-sm) / 1 var(--font-ui);color:var(--bone-dim)}.lobby-main{flex:1;min-height:0;display:grid;grid-template-columns:minmax(16rem,20rem) minmax(0,1fr);gap:var(--space-6);padding:var(--space-6)}.lobby-ledger{align-self:stretch;display:flex;flex-direction:column;gap:var(--space-4);padding:var(--space-5) var(--space-5) 5.25rem}.lobby-player{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}.lobby-player h2{margin:0;min-width:0;font:700 var(--text-xl) / 1.1 var(--font-ui);overflow-wrap:anywhere}.profile-avatar-btn{flex-shrink:0;width:3.5rem;height:3.5rem;padding:0;overflow:hidden;background:var(--felt-deep);border:1px solid var(--brass);border-radius:var(--radius-control);cursor:pointer}.profile-avatar-btn:hover{transform:none;box-shadow:none;border-color:var(--brass-hi)}.profile-avatar-btn:focus-visible{outline:var(--focus-outline);outline-offset:2px}.profile-avatar-btn img{display:block;width:100%;height:100%;object-fit:cover}.lobby-section-title{margin:0;padding-bottom:var(--space-2);font:700 var(--text-md) / 1 var(--font-ui);color:var(--bone);border-bottom:1px solid var(--brass-dim)}.lobby-quests{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-2)}.lobby-quest{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-3);font-size:var(--text-sm);line-height:1.3;background:var(--leather);border:1px solid var(--brass-dim);border-radius:var(--radius-control)}.lobby-quest-text{min-width:0;overflow-wrap:anywhere}.lobby-quest-progress{flex-shrink:0;display:inline-flex;align-items:center;font-weight:700;font-variant-numeric:tabular-nums;color:var(--brass-hi)}.lobby-quest.completed{border-color:var(--verdigris);color:var(--bone-dim)}.lobby-quest.completed .lobby-quest-text{text-decoration:line-through}.lobby-quest.completed .lobby-quest-progress{color:var(--verdigris)}.lobby-quest.just-completed{animation:lobby-quest-pop .6s var(--ease)}@keyframes lobby-quest-pop{50%{transform:scale(1.03)}}.lobby-empty{margin:0;font-size:var(--text-sm);color:var(--bone-dim)}.lobby-table{display:flex;flex-direction:column;gap:var(--space-6);min-width:0;min-height:0}.lobby-stage{flex:1;min-height:0;display:grid;align-items:center;justify-content:center}.lobby-tiles{margin-top:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3)}.lobby-tile{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);padding:var(--space-4) var(--space-3);font:700 var(--text-md) / 1 var(--font-ui);color:var(--bone);background:var(--walnut);border:1px solid var(--brass-dim);border-radius:var(--radius-panel);box-shadow:var(--inset-frame);cursor:pointer;transition:background var(--dur) var(--ease),border-color var(--dur) var(--ease)}.lobby-tile:hover{background:var(--leather);border-color:var(--brass);transform:none;box-shadow:var(--inset-frame)}.lobby-tile:focus-visible{outline:var(--focus-outline);outline-offset:2px}.lobby-tile-icon{width:5.5rem;height:5.5rem;filter:drop-shadow(0 3px 4px var(--shade))}.lobby-tile-icon .li-brass-fill{fill:var(--brass-hi);stroke:var(--brass-dim)}.lobby-tile-icon .li-brass{stroke:var(--brass-hi)}.lobby-tile-icon .li-ember-fill{fill:var(--ember);stroke:var(--felt-deep)}.lobby-tile-icon .li-bone-fill{fill:var(--bone);stroke:var(--bone-dim)}.lobby-tile-icon .li-wood{stroke:var(--leather-hi)}.lobby-tile-icon .li-wood-fill{fill:var(--leather);stroke:var(--brass-dim)}.lobby-tile-icon .li-leather-fill{fill:var(--ember);stroke:var(--felt-deep)}.lobby-tile-icon .li-spine{fill:color-mix(in srgb,var(--ember) 60%,var(--felt-deep));stroke:var(--felt-deep)}.lobby-tile-icon .li-line{stroke:var(--brass-dim)}.lobby-tile:hover .lobby-tile-icon{transform:translateY(-2px)}.lobby-tile-icon{transition:transform var(--dur) var(--ease)}.lobby-hero-viewport{align-self:stretch;min-height:20rem;display:flex;align-items:center;justify-content:center}.random-hero-card{transition:opacity .3s var(--ease),transform .3s var(--ease)}.random-hero-card.transitioning{opacity:0;transform:scale(.97)}.random-hero-card .hero-card,.random-hero-card .hero-card:hover{transform:none!important;transition:none!important;z-index:auto!important}.lobby-hero-viewport{position:relative;isolation:isolate}.lobby-hero-viewport:before{content:"";position:absolute;top:-4%;right:-12%;bottom:-4%;left:-12%;z-index:-2;background:radial-gradient(ellipse at 50% 45%,color-mix(in srgb,var(--brass-hi) 22%,transparent),transparent 62%);pointer-events:none}.random-hero-card{position:relative}.random-hero-card:after{content:"";position:absolute;left:50%;bottom:-1.6rem;width:125%;height:4rem;transform:translate(-50%);z-index:-1;border:1px solid var(--brass-dim);border-radius:50%;background:radial-gradient(ellipse at 50% 40%,color-mix(in srgb,var(--felt-deep) 85%,transparent),transparent 72%);box-shadow:0 0 0 6px color-mix(in srgb,var(--brass-dim) 25%,transparent),inset 0 0 0 5px var(--felt);pointer-events:none}.random-hero-card{filter:drop-shadow(0 14px 18px var(--shade))}.lobby-tile{position:relative;padding-top:var(--space-5);gap:var(--space-3);font:400 var(--text-lg) / 1 var(--font-display);background:linear-gradient(var(--walnut),color-mix(in srgb,var(--walnut) 80%,var(--felt-deep)))}.lobby-tile:before{content:"";position:absolute;top:-1px;left:18%;right:18%;height:3px;background:var(--brass);border-radius:0 0 3px 3px}.lobby-tile:hover:before{background:var(--brass-hi)}.lobby-title:before,.lobby-title:after{content:"";display:inline-block;width:.45em;height:.45em;margin:0 .45em .12em 0;background:var(--brass);transform:rotate(45deg)}.lobby-title:after{margin:0 0 .12em .45em}.lobby-section-title{font:400 var(--text-lg) / 1 var(--font-display)}.lobby-ledger{background:linear-gradient(var(--walnut),color-mix(in srgb,var(--walnut) 85%,var(--felt-deep)))}.placard:before{content:"";position:absolute;top:-1px;left:var(--space-5);right:var(--space-5);height:2px;background:linear-gradient(90deg,transparent,var(--brass-hi),transparent);opacity:.7}.placard:hover:before{opacity:1}.lobby-placards{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:var(--space-4)}.placard{position:relative;display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-5);background:var(--walnut);border:1px solid var(--brass-dim);border-radius:var(--radius-panel);box-shadow:var(--shadow-panel),var(--inset-frame);cursor:pointer;transition:border-color var(--dur) var(--ease)}.placard:hover{border-color:var(--brass)}.placard-head{display:flex;align-items:center;gap:var(--space-3)}.placard-icon{flex-shrink:0;color:var(--brass-hi)}.placard-title{flex:1;margin:0;font:400 var(--text-lg) / 1.1 var(--font-display)}.placard-text{margin:0;min-height:1.4em;font-size:var(--text-sm);color:var(--bone-dim)}.placard--searching{border-color:var(--brass-hi);cursor:default}.placard-dots{display:inline-flex;gap:var(--space-1);margin-left:var(--space-2)}.placard-dots .dot{width:.4rem;height:.4rem;background:var(--brass-hi);border-radius:50%;animation:lobby-dot 1.2s var(--ease) infinite}.placard-dots .dot:nth-child(2){animation-delay:.2s}.placard-dots .dot:nth-child(3){animation-delay:.4s}@keyframes lobby-dot{0%,80%,to{opacity:.25}40%{opacity:1}}.mode-unlock-reveal{animation:lobby-rise .7s var(--ease) both}@keyframes lobby-rise{0%{opacity:0;transform:translateY(1rem)}to{opacity:1;transform:none}}.mode-unlock-toast{position:fixed;left:50%;top:5rem;z-index:900;display:flex;align-items:center;gap:var(--space-3);width:max-content;max-width:min(28rem,calc(100vw - 2rem));padding:var(--space-4) var(--space-5);transform:translate(-50%);background:var(--walnut);border:1px solid var(--brass);border-radius:var(--radius-panel);box-shadow:var(--shadow-panel),var(--inset-frame);cursor:pointer;animation:lobby-fade .4s var(--ease) both}.mode-unlock-toast-icon{color:var(--brass-hi)}.mode-unlock-toast-text{display:flex;flex-direction:column;gap:var(--space-1);font-size:var(--text-sm);color:var(--bone-dim)}.mode-unlock-toast-text strong{font-size:var(--text-md);color:var(--bone)}@keyframes lobby-fade{0%{opacity:0}}@media (max-width: 768px),(max-width: 1000px) and (max-height: 600px){body:has(.game-lobby-modern) .friends-icon,body:has(.game-lobby-modern) .message-icon{width:36px;height:36px;bottom:max(6px,env(safe-area-inset-bottom))}body:has(.game-lobby-modern) .friends-icon{left:8px}body:has(.game-lobby-modern) .message-icon{left:50px}body:has(.game-lobby-modern) .friends-icon-svg,body:has(.game-lobby-modern) .message-icon-svg{width:18px;height:18px}body:has(.game-lobby-modern) .friends-icon .notification-badge,body:has(.game-lobby-modern) .message-icon .notification-badge{min-width:14px;height:14px;padding:0 2px;top:-5px;right:-5px;font-size:9px}body:has(.game-lobby-modern) .friends-icon-tooltip,body:has(.game-lobby-modern) .message-icon-tooltip{bottom:42px}}@media (max-width: 1000px),(max-height: 700px){.lobby-main{grid-template-columns:minmax(0,1fr);align-content:start;padding:var(--space-4);gap:var(--space-4)}.lobby-ledger{align-self:stretch;padding-bottom:var(--space-5)}.lobby-stage{display:none}.lobby{padding-bottom:3.5rem}}@media (max-width: 600px){.lobby-placards{grid-template-columns:minmax(0,1fr)}.lobby-bar{flex-wrap:wrap;padding:var(--space-3) var(--space-4)}.lobby-status{width:100%;justify-content:space-between;gap:var(--space-3)}.lobby-level{flex:1;min-width:0}}@media (prefers-reduced-motion: reduce){.lobby-coins-amount.vp-bump,.lobby-quest.just-completed,.mode-unlock-reveal,.mode-unlock-toast,.placard-dots .dot{animation:none}.random-hero-card,.placard,.lobby-tile{transition:none}}.survival-battle-transition{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:9999;overflow:hidden}.transition-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:var(--felt-deep);opacity:1;transition:opacity .8s ease-out}.survival-battle-transition.fade-out .transition-overlay{opacity:0}.auth-page{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:flex-start;justify-content:center;overflow-x:hidden;overflow-y:auto;padding:max(var(--space-4),env(safe-area-inset-top)) max(var(--space-4),env(safe-area-inset-right)) max(var(--space-4),env(safe-area-inset-bottom)) max(var(--space-4),env(safe-area-inset-left));background:var(--felt-surface);color:var(--bone);font-family:var(--font-ui)}.auth-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;opacity:.16;filter:saturate(.4);pointer-events:none}.auth-page--login .auth-backdrop{background:var(--login-background-image)}.auth-page--register .auth-backdrop{background:var(--register-background-image)}.auth-book{position:relative;width:100%;max-width:26rem;margin:auto;padding:var(--space-8) var(--space-7) var(--space-7);background:var(--walnut);border:1px solid var(--brass-dim);border-radius:var(--radius-panel);box-shadow:var(--shadow-panel),var(--inset-frame)}.auth-book:before{content:"";position:absolute;top:-.65rem;left:50%;width:3.5rem;height:1.3rem;transform:translate(-50%);background:var(--brass);border-radius:3px 3px 7px 7px;box-shadow:inset 0 -3px 0 var(--brass-dim),0 2px 6px var(--shade);animation:auth-clasp .52s var(--ease) both}.auth-book:after{content:"";position:absolute;top:-.2rem;left:50%;width:.4rem;height:.4rem;transform:translate(-50%);background:var(--felt-deep);border-radius:50%}@keyframes auth-clasp{0%{transform:translate(-50%) translateY(1.1rem)}to{transform:translate(-50%) translateY(0)}}.auth-title{margin:0;text-align:center;font:400 var(--text-3xl) / 1.05 var(--font-display);letter-spacing:.01em;color:var(--bone)}.auth-lede{margin:var(--space-2) 0 var(--space-6);text-align:center;font-size:var(--text-md);color:var(--bone-dim)}.auth-form{display:flex;flex-direction:column;gap:var(--space-5)}.auth-actions{display:flex;flex-direction:column;gap:var(--space-3);margin-top:var(--space-2)}.auth-switch{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:var(--space-2);font-size:var(--text-sm);color:var(--bone-dim)}.auth-devtools{margin-top:var(--space-6);padding-top:var(--space-4);border-top:1px solid var(--leather-hi);display:flex;flex-direction:column;align-items:center;gap:var(--space-2)}.auth-devtools .ui-hint{text-align:center}@media (max-width: 480px){.auth-book{padding:var(--space-8) var(--space-5) var(--space-6)}.auth-title{font-size:var(--text-2xl)}}@media (prefers-reduced-motion: reduce){.auth-book:before{animation:none}}.hero-card.tutorial-hidden{visibility:hidden}.hero-card.tutorial-grow{animation:tutorial-grow-in .55s cubic-bezier(.2,1.4,.4,1) backwards}@keyframes tutorial-grow-in{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.tut-block{position:fixed;z-index:4000;background:transparent}.tut-block.dim{background:color-mix(in srgb,var(--felt-deep) 55%,transparent)}.tut-spot{position:fixed;z-index:4001;pointer-events:none;border-radius:10px;border:2px solid var(--verdigris);box-shadow:0 0 0 9999px color-mix(in srgb,var(--felt-deep) 55%,transparent),0 0 18px 4px color-mix(in srgb,var(--felt-deep) 65%,transparent);animation:tut-spot-pulse 1.4s ease-in-out infinite}@keyframes tut-spot-pulse{0%,to{border-color:color-mix(in srgb,var(--verdigris) 55%,transparent)}50%{border-color:var(--bone)}}.tut-arrow{position:fixed;z-index:4002;width:56px;height:40px;pointer-events:none;filter:drop-shadow(0 0 6px var(--felt-deep)) drop-shadow(0 0 14px color-mix(in srgb,var(--felt-deep) 80%,transparent))}.tut-arrow.side-left{transform:rotate(0)}.tut-arrow.side-right{transform:rotate(180deg)}.tut-arrow.side-top{transform:rotate(90deg)}.tut-arrow.side-bottom{transform:rotate(-90deg)}.tut-arrow svg{display:block;animation:tut-arrow-bob .7s ease-in-out infinite alternate}@keyframes tut-arrow-bob{0%{transform:translate(-6px)}to{transform:translate(8px)}}.tut-speaker{position:fixed;z-index:4003;display:flex;align-items:center;gap:8px;max-width:min(420px,calc(100vw - 16px))}.tut-speaker.centered{left:50%;bottom:10vh;transform:translate(-50%)}.tut-speaker.middle{left:50%;top:50%;transform:translate(-50%,-50%)}.tut-speaker.topleft{left:12px;top:12px}.tut-bubble{position:relative;background:var(--bone);color:var(--walnut);border:3px solid var(--leather);border-radius:14px;padding:12px 14px;font-size:15px;line-height:1.4;box-shadow:0 6px 18px color-mix(in srgb,var(--felt-deep) 50%,transparent);min-width:190px;cursor:default}.tut-bubble:before{content:"";position:absolute;left:-11px;top:50%;margin-top:-8px;border:8px solid transparent;border-right-color:var(--leather);border-left:0}.tut-text{position:relative}.tut-text .tut-full{visibility:hidden}.tut-text .tut-typed{position:absolute;top:0;right:0;bottom:0;left:0}.tut-next{display:block;margin:10px 0 0 auto;padding:6px 16px;background:var(--leather);color:var(--bone);border:none;border-radius:8px;font-weight:700;font-size:14px;cursor:pointer;animation:tut-next-pulse 1.2s ease-in-out infinite}.tut-next:hover{background:var(--brass)}@keyframes tut-next-pulse{0%,to{box-shadow:0 0 0 0 color-mix(in srgb,var(--felt-deep) 0%,transparent)}50%{box-shadow:0 0 10px 2px color-mix(in srgb,var(--felt-deep) 70%,transparent)}}.tut-skip{position:fixed;top:10px;right:14px;z-index:4004;background:color-mix(in srgb,var(--felt-deep) 70%,transparent);color:var(--bone);border:1px solid var(--leather-hi);border-radius:8px;padding:6px 12px;font-size:13px;cursor:pointer}.tut-skip:hover{color:var(--bone);border-color:var(--bone-dim)}.tutorial-skull{display:block;flex-shrink:0;filter:drop-shadow(0 4px 8px color-mix(in srgb,var(--felt-deep) 60%,transparent));animation:skull-bob 2.6s ease-in-out infinite}.tutorial-skull.talking{animation:skull-bob-talk .32s ease-in-out infinite alternate}.tutorial-skull .skull-jaw{transform-origin:60px 96px}.tutorial-skull.talking .skull-jaw{animation:skull-jaw .17s ease-in-out infinite alternate}.tutorial-skull .skull-eye-glow{animation:skull-eye 1.6s ease-in-out infinite alternate}@keyframes skull-bob{0%,to{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-3px) rotate(1deg)}}@keyframes skull-bob-talk{0%{transform:translateY(0) rotate(-2deg)}to{transform:translateY(-2px) rotate(2deg)}}@keyframes skull-jaw{0%{transform:translateY(0) rotate(0)}to{transform:translateY(9px) rotate(3deg)}}@keyframes skull-eye{0%{opacity:.55}to{opacity:1}}@media (prefers-reduced-motion: reduce){.tutorial-skull,.tut-arrow svg,.tut-spot,.tut-next{animation:none}.tutorial-skull.talking .skull-jaw{animation:skull-jaw .17s ease-in-out infinite alternate}}body,html{margin:0;padding:0;overflow:auto;height:100vh}.waiting{font-size:1.5rem;margin-top:2rem}.game-ended{background:color-mix(in srgb,var(--bone) 10%,transparent);padding:2rem;border-radius:12px;margin:2rem auto;max-width:400px}.game-ended h2{margin-top:0;font-size:2.5rem}@keyframes titleGlow{0%{filter:drop-shadow(0 0 10px currentColor)}to{filter:drop-shadow(0 0 20px currentColor)}}@media (max-width: 1600px){.battle-phase{transform:scale(1);transform-origin:top center}}@media (max-width: 1400px){.battle-phase{transform:scale(1);transform-origin:top center}}@media (max-width: 1200px){.battle-phase{transform:scale(.995);transform-origin:top center}}@media (max-width: 768px){.draft-phase .teams-display .hero-card{max-height:240px}}@media (max-width: 480px){.draft-phase .teams-display .hero-card{max-height:220px}}.error{background:var(--ember);color:var(--bone);padding:1rem;border-radius:4px;margin:1rem 0}.turn-indicator{font-size:clamp(.9rem,1.1vw,1.2rem);font-weight:700;padding:clamp(8px,.8vw,12px) clamp(12px,1.2vw,20px);border-radius:clamp(5px,.5vw,8px);margin:clamp(10px,1vw,16px) 0;text-align:center;animation:pulse 2s infinite}.turn-indicator.my-turn{background:color-mix(in srgb,var(--verdigris) 30%,transparent);border:2px solid var(--verdigris);color:var(--verdigris)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.hero-card{background:linear-gradient(145deg,var(--bone) 0%,var(--bone) 100%);border:2px solid var(--bone);border-radius:clamp(8px,.8vw,12px);padding:0;margin:clamp(3px,.4vw,6px);cursor:pointer;transition:all .3s ease;color:var(--leather);width:clamp(156px,12vw,234px);height:clamp(240px,18.5vw,360px);position:relative;height:100%;max-height:350px;display:flex;flex-direction:column;box-sizing:border-box}.hero-card:hover:not(.shop-hero-card){overflow:visible}.hero-card:hover:not(.shop-hero-card){transform:scale(1.1);z-index:15;box-shadow:0 10px 25px color-mix(in srgb,var(--felt-deep) 30%,transparent);border-color:var(--brass);display:flex;flex-direction:column}.hero-card.selected{border-color:var(--verdigris);background:linear-gradient(145deg,var(--bone) 0%,var(--bone) 100%);display:flex;flex-direction:column}.hero-card.banned{opacity:.3;filter:grayscale(100%);display:flex;flex-direction:column}.hero-card.enemy{border-color:var(--ember);display:flex;flex-direction:column}.hero-card.ally{border-color:var(--verdigris);display:flex;flex-direction:column}.hero-card.current-turn{border:2px solid var(--brass-hi)!important}.hero-card.dead{opacity:.3;filter:grayscale(80%);pointer-events:none;border-color:var(--leather-hi);background:color-mix(in srgb,var(--leather-hi) 10%,transparent);display:flex;flex-direction:column}.hero-card.selectable{border-color:var(--verdigris);cursor:pointer;display:flex;flex-direction:column}.hero-card.selectable:hover:not(.shop-hero-card){border-color:var(--brass);transform:scale(1.1);z-index:15;display:flex;flex-direction:column}.hero-card.hovered{z-index:15;display:flex;flex-direction:column}.hero-image{width:100%;height:clamp(121px,9.3vw,182px);object-fit:cover;border-radius:clamp(7px,.65vw,10px) clamp(7px,.65vw,10px) 0 0;margin:0;padding:0;display:block;flex-shrink:0}@keyframes cardFlip{0%{transform:rotateY(0)}50%{transform:rotateY(90deg)}to{transform:rotateY(0)}}.hero-image.card-flip{animation:cardFlip .6s ease-in-out}.hero-card-content{padding:0;margin:0;position:relative;flex:1;display:flex;flex-direction:column;font-weight:700}.hero-stats{background:color-mix(in srgb,var(--felt-deep) 80%,transparent);color:var(--bone);padding:clamp(6px,.6vw,10px) clamp(8px,.8vw,12px) clamp(5px,.5vw,8px) clamp(8px,.8vw,12px);border-radius:0 0 clamp(7px,.65vw,10px) clamp(7px,.65vw,10px);font-size:clamp(.7rem,.8vw,.9rem);margin:-1px 0 0;position:relative;width:100%;box-sizing:border-box;flex:1;display:flex;flex-direction:column;justify-content:flex-start}.hero-stats-row{display:flex;align-items:center;margin-bottom:clamp(2px,.25vw,3px);font-size:clamp(.65rem,.75vw,.85rem);font-weight:700;line-height:1.2}.hero-stats-row:last-child{margin-bottom:0}.stat-icon{width:clamp(12px,1vw,16px);height:clamp(12px,1vw,16px);margin-right:clamp(5px,.5vw,8px);flex-shrink:0}.hero-special-name{font-weight:700;color:var(--brass-hi)}.status-effects-buffs{position:absolute;top:clamp(5px,.5vw,8px);left:clamp(5px,.5vw,8px);display:flex;flex-direction:column;gap:clamp(2px,.3vw,4px);align-items:flex-start;z-index:10}.status-effects-debuffs{position:absolute;top:clamp(5px,.5vw,8px);right:clamp(5px,.5vw,8px);display:flex;flex-direction:column;gap:clamp(3px,.4vw,5px);align-items:flex-end;z-index:10}.status-effect{background:color-mix(in srgb,var(--felt-deep) 80%,transparent);color:var(--bone);padding:clamp(2px,.25vw,3px) clamp(5px,.5vw,8px);border-radius:clamp(10px,1vw,15px);font-size:clamp(.6rem,.8vw,.91rem);font-weight:700;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 4px color-mix(in srgb,var(--felt-deep) 30%,transparent);border:1px solid color-mix(in srgb,var(--bone) 20%,transparent)}.status-effect.beast-active{background:linear-gradient(135deg,var(--verdigris) 0%,var(--verdigris) 100%);border-color:var(--verdigris);box-shadow:0 2px 6px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.status-effect.totem-count{background:linear-gradient(135deg,color-mix(in srgb,var(--brass) 95%,transparent) 0%,color-mix(in srgb,var(--leather) 95%,transparent) 100%);color:var(--bone);border-color:var(--brass);box-shadow:0 2px 6px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.status-effect.inspiration{background:linear-gradient(135deg,var(--brass-hi) 0%,var(--brass) 100%);color:var(--felt-deep);border-color:var(--brass);box-shadow:0 2px 6px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.status-effect.damage-stacks{background:linear-gradient(135deg,var(--verdigris) 0%,var(--verdigris) 100%);color:var(--bone);border-color:var(--verdigris);box-shadow:0 2px 6px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.status-effect.untargetable{background:linear-gradient(135deg,var(--brass) 0%,var(--brass) 100%);border-color:var(--brass);box-shadow:0 2px 6px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.status-effect.buff{background:linear-gradient(135deg,var(--verdigris) 0%,var(--verdigris) 100%);border-color:var(--verdigris);box-shadow:0 2px 6px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.status-effect.poison{background:linear-gradient(135deg,var(--verdigris) 0%,var(--verdigris) 100%);border-color:var(--verdigris);box-shadow:0 2px 6px color-mix(in srgb,var(--felt-deep) 40%,transparent);transition:all .3s ease}@keyframes poisonIncrease{0%{box-shadow:0 2px 6px color-mix(in srgb,var(--felt-deep) 40%,transparent)}50%{box-shadow:0 0 20px var(--felt-deep),0 0 30px color-mix(in srgb,var(--felt-deep) 80%,transparent);transform:scale(1.15)}to{box-shadow:0 2px 6px color-mix(in srgb,var(--felt-deep) 40%,transparent)}}.status-effect.poison.poison-glow-increase{animation:poisonIncrease .8s ease-in-out}@keyframes poisonCleanse{0%{box-shadow:0 2px 6px color-mix(in srgb,var(--felt-deep) 40%,transparent);background:linear-gradient(135deg,var(--verdigris) 0%,var(--verdigris) 100%)}50%{box-shadow:0 0 20px var(--felt-deep),0 0 30px color-mix(in srgb,var(--felt-deep) 80%,transparent);background:linear-gradient(135deg,var(--brass) 0%,var(--brass) 100%);transform:scale(1.15)}to{box-shadow:0 0 15px color-mix(in srgb,var(--felt-deep) 60%,transparent);background:linear-gradient(135deg,var(--brass) 0%,var(--brass) 100%);opacity:.7}}.status-effect.poison.poison-glow-cleanse{animation:poisonCleanse .8s ease-in-out}.status-effect.taunt{background:linear-gradient(135deg,var(--ember) 0%,var(--ember) 100%);border-color:var(--ember);box-shadow:0 2px 6px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.status-effect.silenced{background:linear-gradient(135deg,var(--leather-hi) 0%,var(--leather-hi) 100%);border-color:var(--leather-hi);box-shadow:0 2px 6px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.status-effect.disable-attack{background:linear-gradient(135deg,var(--ember) 0%,var(--ember) 100%);border-color:var(--ember);box-shadow:0 2px 6px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.status-effect.bribed{background:linear-gradient(135deg,var(--brass-hi) 0%,var(--brass) 100%);color:var(--felt-deep);border-color:var(--brass);box-shadow:0 2px 6px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.status-effect.grant-advantage,.status-effect.ride-down-debuff,.status-effect.debuff{background:linear-gradient(135deg,var(--ember) 0%,var(--ember) 100%);border-color:var(--ember);box-shadow:0 2px 6px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.companions{position:absolute;top:clamp(26px,2.5vw,40px);left:clamp(5px,.5vw,8px);display:flex;gap:clamp(2px,.3vw,4px);z-index:5}.companion{background:color-mix(in srgb,var(--verdigris) 90%,transparent);color:var(--bone);padding:clamp(1px,.15vw,2px) clamp(4px,.4vw,6px);border-radius:clamp(3px,.3vw,4px);font-size:clamp(.6rem,.7vw,.8rem);font-weight:700;border:1px solid var(--leather);box-shadow:0 2px 4px color-mix(in srgb,var(--felt-deep) 30%,transparent)}.shaman-totems{position:absolute;top:clamp(5px,.5vw,8px);left:clamp(5px,.5vw,8px);z-index:10}.totem-counter{background:color-mix(in srgb,var(--brass) 90%,transparent);color:var(--bone);padding:clamp(3px,.3vw,4px) clamp(5px,.5vw,8px);border-radius:clamp(4px,.4vw,6px);font-size:clamp(.7rem,.8vw,.9rem);font-weight:700;border:2px solid var(--brass);box-shadow:0 2px 6px color-mix(in srgb,var(--felt-deep) 40%,transparent);display:inline-block}.tooltip{position:relative;display:inline-block}.tooltip .tooltiptext{visibility:hidden;width:200px;background-color:var(--leather);color:var(--bone);text-align:center;border-radius:6px;padding:8px;position:absolute;z-index:1000;bottom:125%;left:50%;margin-left:-100px;opacity:0;transition:opacity .3s;font-size:.8rem}.tooltip .tooltiptext:after{content:"";position:absolute;top:100%;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:var(--leather) transparent transparent transparent}.tooltip:hover .tooltiptext{visibility:visible;opacity:1}.status-effect-tooltip{position:relative;display:inline-block}.status-effect-tooltip .status-tooltip-text{visibility:hidden;position:absolute;top:125%;right:0;background:linear-gradient(135deg,var(--leather) 0%,var(--walnut) 100%);color:var(--bone);padding:12px 16px;border-radius:12px;font-size:.85rem;font-weight:500;line-height:1.4;white-space:nowrap;z-index:1100;box-shadow:0 8px 32px color-mix(in srgb,var(--felt-deep) 30%,transparent),0 2px 8px color-mix(in srgb,var(--felt-deep) 20%,transparent);border:1px solid color-mix(in srgb,var(--bone) 10%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0;transition:opacity .2s ease-out,visibility .2s ease-out;pointer-events:none;min-width:200px;max-width:300px;word-wrap:break-word;white-space:normal;text-align:left}.status-effect-tooltip .status-tooltip-text:after{content:"";position:absolute;bottom:100%;right:20px;margin-bottom:-1px;border-width:6px;border-style:solid;border-color:transparent transparent var(--leather) transparent}.status-effect-tooltip:hover .status-tooltip-text{visibility:visible;opacity:1}.status-effect:hover{transform:scale(1.05);box-shadow:0 4px 12px color-mix(in srgb,var(--felt-deep) 30%,transparent);z-index:10}.keyword{text-decoration:underline;cursor:help}.keyword.poison{color:var(--verdigris)}.keyword.taunt{color:var(--ember)}.keyword.inspiration{color:var(--brass-hi)}.game-lobby{display:flex;justify-content:center;align-items:center;min-height:80vh;padding:2rem}.lobby-content{background:color-mix(in srgb,var(--bone) 10%,transparent);padding:3rem;border-radius:16px;text-align:center;max-width:800px;width:100%;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 8px 32px color-mix(in srgb,var(--felt-deep) 30%,transparent)}.game-title{margin:0 0 3rem;font-size:3.5rem;font-weight:700;background:linear-gradient(45deg,var(--brass),var(--verdigris));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:2px 2px 4px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.mode-selection{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-top:2rem}.mode-option{background:color-mix(in srgb,var(--bone) 5%,transparent);padding:2rem;border-radius:12px;border:2px solid transparent;transition:all .3s ease}.mode-option:hover{border-color:var(--brass);background:color-mix(in srgb,var(--bone) 10%,transparent);transform:translateY(-5px)}.mode-option h3{margin-top:0;font-size:1.8rem;color:var(--brass);margin-bottom:1rem}.mode-option p{font-size:1.1rem;margin-bottom:1.5rem;color:var(--bone)}.mode-option ul{text-align:left;margin:1.5rem 0;padding-left:1.5rem}.mode-option li{margin-bottom:.5rem;color:var(--bone)}.mode-button{background:linear-gradient(45deg,var(--brass),var(--brass));color:var(--bone);padding:15px 30px;font-size:1.2rem;font-weight:700;border:none;border-radius:8px;cursor:pointer;transition:all .3s ease;width:100%;margin-top:1rem}.mode-button:hover:not(:disabled){background:linear-gradient(45deg,var(--brass),var(--leather));transform:translateY(-2px);box-shadow:0 6px 20px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.mode-button:disabled{background:var(--leather-hi);cursor:not-allowed;transform:none;box-shadow:none}.random-button{background:linear-gradient(45deg,var(--verdigris),var(--verdigris))}.random-button:hover:not(:disabled){background:linear-gradient(45deg,var(--verdigris),var(--leather));box-shadow:0 6px 20px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.game-rules{background:color-mix(in srgb,var(--felt-deep) 20%,transparent);padding:1.5rem;border-radius:8px;margin-top:2rem;text-align:left}.game-rules h3{margin-top:0;text-align:center}.game-rules ul{margin:0;padding-left:1.5rem}.game-rules li{margin-bottom:.5rem}.player-matchup{text-align:center;padding:clamp(.3rem,.8vw,.6rem);margin-bottom:clamp(.2rem,.4vw,.4rem);font-size:clamp(1rem,1.2vw,1.3rem);font-weight:700;background:color-mix(in srgb,var(--bone) 5%,transparent);border-radius:6px;display:flex;align-items:center;justify-content:center;gap:clamp(.8rem,1vw,1.2rem)}.player-matchup .player-name{color:var(--brass);text-shadow:0 0 10px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.player-matchup .opponent-name{color:var(--ember-hi);text-shadow:0 0 10px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.player-matchup .vs-text{color:var(--brass-hi);font-size:1.2rem;font-weight:900;text-shadow:0 0 15px color-mix(in srgb,var(--felt-deep) 60%,transparent)}.draft-phase .teams-display .hero-card{width:clamp(156px,12vw,234px);height:auto;min-height:clamp(240px,18.5vw,360px);margin:clamp(3px,.4vw,6px);font-size:clamp(.75rem,.9vw,.9rem)}.draft-phase .teams-display .hero-card .hero-name{font-size:clamp(.75rem,.9vw,.9rem)}.draft-phase .teams-display .hero-card .stat-row{font-size:clamp(.65rem,.75vw,.75rem)}.turn-indicator{text-align:center;padding:8px 16px;border-radius:6px;margin:.5rem 0;font-weight:700}.turn-indicator.my-turn{background-color:color-mix(in srgb,var(--verdigris) 20%,transparent);border:2px solid var(--verdigris);color:var(--verdigris)}.draft-info-sidebar{position:fixed;left:clamp(8px,1vw,15px);top:clamp(60px,8vh,80px);width:clamp(180px,20vw,240px);background:linear-gradient(135deg,color-mix(in srgb,var(--walnut) 95%,transparent) 0%,var(--walnut) 100%);border:2px solid color-mix(in srgb,var(--brass) 35%,transparent);border-radius:12px;padding:clamp(12px,1.4vw,16px);z-index:101;box-shadow:0 8px 32px color-mix(in srgb,var(--felt-deep) 60%,transparent),inset 0 1px 0 color-mix(in srgb,var(--felt-deep) 5%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);max-height:calc(100vh - 80px);overflow-y:auto}.draft-players{display:flex;align-items:center;justify-content:center;gap:clamp(6px,.8vw,8px);margin-bottom:clamp(12px,1.4vw,16px)}.draft-players .player-name{font-size:clamp(.75rem,.9vw,.9rem);font-weight:600}.draft-players .player-name.opponent{color:var(--ember-hi)}.draft-players .player-name.current{color:var(--brass)}.draft-players .vs-text{font-size:clamp(.65rem,.75vw,.75rem);color:var(--bone-dim);font-weight:700}.turn-indicator{text-align:center;color:var(--verdigris);font-size:clamp(.7rem,.85vw,.85rem);font-weight:600;padding:clamp(8px,1vw,10px);background:color-mix(in srgb,var(--verdigris) 10%,transparent);border-radius:6px;margin-bottom:clamp(12px,1.4vw,16px)}.waiting-indicator{text-align:center;color:var(--brass-hi);font-size:clamp(.7rem,.85vw,.85rem);font-weight:600;padding:clamp(8px,1vw,10px);background:color-mix(in srgb,var(--brass-hi) 10%,transparent);border-radius:6px;margin-bottom:clamp(12px,1.4vw,16px)}.attack-order-setup{display:flex;gap:2rem;justify-content:center;margin:2rem 0}.available-heroes,.attack-order{background:color-mix(in srgb,var(--bone) 10%,transparent);padding:1rem;border-radius:8px;min-width:300px}.available-heroes h3,.attack-order h3{text-align:center;margin-top:0}.ordered-heroes{display:flex;flex-direction:column;gap:8px}.ordered-hero{display:flex;align-items:center;gap:8px}.position-number{background:var(--brass);color:var(--bone);width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700}.battle-phase{padding:20px}.initiative-choice{background:color-mix(in srgb,var(--walnut) 95%,transparent);border:2px solid var(--verdigris);border-radius:clamp(10px,1.2vw,16px);padding:clamp(1.5rem,2vw,2rem);text-align:center;max-width:clamp(350px,40vw,500px);width:90%;box-shadow:0 8px 32px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.initiative-choice h2{color:var(--verdigris);margin-top:0;font-size:clamp(1.5rem,2vw,2rem);text-shadow:0 0 10px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.initiative-results{background:color-mix(in srgb,var(--felt-deep) 40%,transparent);border-radius:12px;padding:1.5rem;margin:1.5rem 0}.player-roll{margin:.5rem 0;font-size:1.2rem;padding:.5rem;background:color-mix(in srgb,var(--bone) 10%,transparent);border-radius:8px}.winner-choice h3{color:var(--brass-hi);margin:1rem 0;font-size:1.5rem}.initiative-loading{background:color-mix(in srgb,var(--walnut) 95%,transparent);border:2px solid var(--brass);border-radius:16px;padding:2rem;text-align:center;max-width:400px;width:90%;box-shadow:0 8px 32px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.initiative-loading h2{color:var(--brass);margin-top:0;font-size:1.8rem;text-shadow:0 0 10px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.loading-dots{display:flex;justify-content:center;gap:.5rem;margin-top:1rem}.loading-dots span{display:inline-block;width:12px;height:12px;border-radius:50%;background:var(--brass);animation:bounce 1.4s ease-in-out infinite both}.loading-dots span:nth-child(1){animation-delay:-.32s}.loading-dots span:nth-child(2){animation-delay:-.16s}.loading-dots span:nth-child(3){animation-delay:0}@keyframes bounce{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}.team-display:has(.hero-card:hover){z-index:20}.action-panel{background:color-mix(in srgb,var(--bone) 10%,transparent);padding:1.5rem;border-radius:8px;margin-top:2rem}.action-panel h3{margin-top:0;text-align:center}.ability-button{background:var(--brass);color:var(--bone);padding:8px 16px;border-radius:6px}.ability-button.selected,.ability-button.selected:hover{background:var(--verdigris)}.attack-button{background:var(--ember)}.ability-button{background:var(--brass)}@media (max-width: 1200px){.draft-phase .teams-display .hero-card{max-height:280px}}@keyframes shimmer{0%{left:-100%}to{left:100%}}.opponent-area h3:not(.team-label):not(.card-hero-name),.player-area h3:not(.team-label):not(.card-hero-name){display:none}.battle-info{background:color-mix(in srgb,var(--felt-deep) 30%,transparent);padding:1rem;border-radius:8px;margin-bottom:1rem}.turn-indicator{font-size:1.2rem;font-weight:700;margin-bottom:.5rem}.action-button.silenced{background:var(--leather-hi);color:var(--bone-dim);opacity:.6;position:relative}.action-button.silenced:after{content:"🔇";position:absolute;top:2px;right:4px;font-size:.8rem}.action-button.disable-attack{background:var(--ember);color:var(--bone-dim);opacity:.6;position:relative}.action-button.disable-attack:after{content:"❌";position:absolute;top:2px;right:4px;font-size:.8rem}@keyframes pulse{0%{opacity:1}50%{opacity:.7}to{opacity:1}}.initiative-choice{background:color-mix(in srgb,var(--bone) 10%,transparent);padding:2rem;border-radius:12px;margin:2rem auto;max-width:500px;text-align:center}.initiative-results{background:color-mix(in srgb,var(--felt-deep) 30%,transparent);padding:1rem;border-radius:8px;margin:1rem 0}.player-roll{font-size:1.2rem;margin:.5rem 0}.winner-choice h3{color:var(--verdigris);margin:1rem 0}.current-phase{font-size:1.2rem;font-weight:700;color:var(--verdigris);text-transform:capitalize}.player-entry{margin-bottom:8px;padding:8px;border-radius:6px}.current-player{background:color-mix(in srgb,var(--verdigris) 20%,transparent);border-left:3px solid var(--verdigris)}.opponent-player{background:color-mix(in srgb,var(--ember) 20%,transparent);border-left:3px solid var(--ember)}.draft-progress{font-size:.9rem;color:var(--bone);margin-top:4px}.draft-round{font-size:1.1rem;font-weight:700;color:var(--brass-hi)}.initiative-rolls{margin:8px 0}.initiative-rolls>div{margin:4px 0;padding:4px 8px;background:color-mix(in srgb,var(--felt-deep) 30%,transparent);border-radius:4px}.initiative-winner{color:var(--verdigris);font-weight:700}.initiative-loser{color:var(--ember)}.setup-status{color:var(--brass-hi);font-weight:700}.action-status{margin-top:12px}.actions-used{margin-bottom:10px}.action-used{color:var(--leather-hi);font-size:.9rem;margin:2px 0}.action-available{color:var(--verdigris);font-weight:700}.battle-log{background:color-mix(in srgb,var(--bone) 10%,transparent);border-radius:8px;padding:15px;border-left:4px solid var(--ember);max-height:40vh;overflow:hidden;flex:0 0 auto;display:flex;flex-direction:column}.status{color:var(--brass);font-weight:700}.current-hero-info{background:color-mix(in srgb,var(--bone) 10%,transparent);border-radius:8px;padding:15px;border-left:4px solid var(--brass);text-align:center}.current-hero-info h4{margin:0 0 10px;color:var(--brass);font-size:1.1rem;text-transform:none;letter-spacing:.5px}.current-hero-info p{margin:0;color:var(--bone);font-size:.9rem}.ability-button{background:var(--leather);color:var(--bone);border:2px solid var(--leather-hi);border-radius:6px;padding:10px;cursor:pointer;transition:all .2s;font-size:.9rem}.ability-button:hover{background:var(--leather-hi);border-color:var(--bone-dim)}.ability-button.selected{background:var(--brass);border-color:var(--brass)}.ability-button:disabled{background:var(--walnut);color:var(--leather-hi);border-color:var(--leather);cursor:not-allowed}.end-turn-section{background:color-mix(in srgb,var(--bone) 10%,transparent);border-radius:8px;padding:15px;border-left:4px solid var(--brass-hi)}.end-turn-section h4{margin:0 0 10px;color:var(--brass-hi);font-size:1.1rem;text-transform:none;letter-spacing:.5px;text-align:center}.simple-actions{display:flex;flex-direction:column;gap:12px}.attack-button{background:var(--ember);color:var(--bone)}.attack-button:hover:not(:disabled){background:var(--ember)}.ability-button{background:var(--brass);color:var(--bone)}.ability-button:hover:not(:disabled){background:var(--brass)}.target-info{background:color-mix(in srgb,var(--bone) 10%,transparent);border-radius:8px;padding:15px;border-left:4px solid var(--verdigris);text-align:center}.target-info p{margin:0;color:var(--bone);font-size:.9rem}.target-info h4{margin:0 0 10px;color:var(--verdigris);font-size:1.1rem;text-transform:none;letter-spacing:.5px}.wait-message{background:color-mix(in srgb,var(--bone) 10%,transparent);border-radius:8px;padding:15px;border-left:4px solid var(--leather-hi);text-align:center;margin-top:20px}.wait-message h4{margin:0 0 10px;color:var(--leather-hi);font-size:1.1rem;text-transform:none;letter-spacing:.5px}.wait-message p{margin:0;color:var(--bone);font-style:italic}.buffed-stat{position:relative;display:inline-block}.buffed-text{color:var(--brass);text-shadow:0 0 8px color-mix(in srgb,var(--felt-deep) 60%,transparent);font-weight:700}.buff-tooltip{position:relative;display:inline-block}.buff-tooltiptext{visibility:hidden;width:180px;background-color:color-mix(in srgb,var(--felt-deep) 95%,transparent);color:var(--bone);text-align:center;border-radius:6px;padding:8px;position:absolute;z-index:1000;top:-80px;left:50%;margin-left:-90px;opacity:0;transition:opacity .3s;font-size:.8rem;border:1px solid var(--brass);box-shadow:0 4px 8px color-mix(in srgb,var(--felt-deep) 30%,transparent);pointer-events:none}.buff-tooltiptext:after{content:"";position:absolute;bottom:-10px;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:color-mix(in srgb,var(--felt-deep) 95%,transparent) transparent transparent transparent}.buffed-stat:hover .buff-tooltiptext{visibility:visible;opacity:1}.buffed-stat.has-debuff{color:var(--ember-hi);text-shadow:0 0 8px color-mix(in srgb,var(--felt-deep) 60%,transparent);font-weight:700}.stat-buffed{color:var(--brass);text-shadow:0 0 8px color-mix(in srgb,var(--felt-deep) 80%,transparent);font-weight:700}.stat-debuffed{color:var(--ember-hi);text-shadow:0 0 8px color-mix(in srgb,var(--felt-deep) 80%,transparent);font-weight:700}.stat-berserker-stacks{color:var(--brass-hi);text-shadow:0 0 8px color-mix(in srgb,var(--felt-deep) 80%,transparent);font-weight:700}.status-effect.stat-modifier.debuff{background-color:color-mix(in srgb,var(--ember-hi) 20%,transparent);border:1px solid var(--ember-hi);color:var(--ember-hi)}.special-ability-section{display:flex;flex-direction:column;align-items:center;gap:8px}.ability-instruction{font-size:.85em;color:var(--bone);background:color-mix(in srgb,var(--brass) 10%,transparent);border:1px solid color-mix(in srgb,var(--brass) 30%,transparent);border-radius:4px;padding:6px 12px;text-align:center;max-width:200px;line-height:1.2}.survival-goal{color:var(--brass-hi);font-style:italic;font-size:.85rem;margin-top:4px;text-align:center}@keyframes pulse-notification{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}@keyframes friends-glow{0%{box-shadow:0 4px 15px color-mix(in srgb,var(--felt-deep) 30%,transparent);border-color:color-mix(in srgb,var(--brass) 70%,transparent)}to{box-shadow:0 8px 25px color-mix(in srgb,var(--felt-deep) 60%,transparent);border-color:var(--brass)}}.friends-icon-tooltip{position:absolute;bottom:70px;left:50%;transform:translate(-50%);background:color-mix(in srgb,var(--felt-deep) 90%,transparent);color:var(--bone);padding:8px 12px;border-radius:6px;font-size:.85rem;white-space:nowrap;opacity:0;visibility:hidden;transition:all .2s ease;pointer-events:none;z-index:10000}@keyframes message-glow{0%{box-shadow:0 4px 15px color-mix(in srgb,var(--felt-deep) 30%,transparent);border-color:color-mix(in srgb,var(--verdigris) 70%,transparent)}to{box-shadow:0 8px 25px color-mix(in srgb,var(--felt-deep) 60%,transparent);border-color:var(--verdigris)}}.message-icon-tooltip{position:absolute;bottom:70px;left:50%;transform:translate(-50%);background:color-mix(in srgb,var(--felt-deep) 90%,transparent);color:var(--bone);padding:8px 12px;border-radius:6px;font-size:.85rem;white-space:nowrap;opacity:0;visibility:hidden;transition:all .2s ease;pointer-events:none;z-index:2000}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading,.error{text-align:center;padding:20px;color:var(--bone);font-style:italic}.error{color:var(--ember)}@keyframes tooltipFadeIn{0%{opacity:0;transform:translateY(-50%) translate(-10px)}to{opacity:1;transform:translateY(-50%) translate(0)}}.coin-icon{width:1.3em;height:1.3em;vertical-align:middle;flex-shrink:0}.App{min-height:100vh;color:var(--bone);overflow:auto}.app-layout{display:flex;min-height:100vh;overflow:auto}.game-sidebar{width:clamp(200px,18vw,300px);background:color-mix(in srgb,var(--felt-deep) 80%,transparent);border-right:2px solid var(--brass);padding:0;overflow-y:auto;overflow-x:hidden;flex-shrink:0;max-height:100vh;transition:width .3s ease}@media (max-width: 1400px){.game-sidebar{width:clamp(180px,16vw,250px)}}@media (max-width: 1200px){.game-sidebar{width:clamp(160px,14vw,220px)}}@media (max-width: 1000px){.game-sidebar{width:clamp(140px,12vw,200px)}}.game-sidebar>*{padding:clamp(10px,1.5vw,20px)}.sidebar-header h2{margin:0 0 clamp(10px,1.5vw,20px) 0;padding:clamp(10px,1.5vw,20px) clamp(10px,1.5vw,20px) 0px clamp(10px,1.5vw,20px);font-size:clamp(1.2rem,2vw,1.8rem);text-shadow:2px 2px 4px color-mix(in srgb,var(--felt-deep) 50%,transparent);color:var(--brass);text-align:center}.game-content{flex:1;padding:0;text-align:center;margin-right:0}.connection-status{background:var(--brass-hi);color:var(--felt-deep);padding:6px 12px;border-radius:4px;margin-top:8px;display:block;font-size:.9rem;text-align:center}.game-over-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:color-mix(in srgb,var(--felt-deep) 80%,transparent);display:flex;align-items:center;justify-content:center;z-index:2000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.game-over-modal{background:linear-gradient(135deg,color-mix(in srgb,var(--leather) 95%,transparent) 0%,var(--walnut) 100%);border:3px solid color-mix(in srgb,var(--brass) 70%,transparent);border-radius:clamp(12px,1.5vw,20px);padding:0;max-width:clamp(350px,40vw,500px);width:90%;box-shadow:0 25px 50px color-mix(in srgb,var(--felt-deep) 70%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);text-align:center;overflow:hidden}.game-over-content{padding:clamp(25px,3vw,40px) clamp(20px,2.5vw,30px)}.game-over-title{font-size:clamp(2rem,3vw,3rem);font-weight:700;margin:0 0 clamp(12px,1.5vw,20px) 0;text-shadow:2px 2px 4px color-mix(in srgb,var(--felt-deep) 70%,transparent);animation:titleGlow 2s ease-in-out infinite alternate}.game-over-title.winner{color:var(--verdigris);border-bottom:3px solid var(--verdigris);padding-bottom:15px}.game-over-title.loser{color:var(--ember);border-bottom:3px solid var(--ember);padding-bottom:15px}.game-over-message{color:color-mix(in srgb,var(--bone) 90%,transparent);font-size:clamp(1rem,1.2vw,1.2rem);line-height:1.5;margin:clamp(12px,1.5vw,20px) 0 clamp(20px,2.5vw,30px) 0}.return-to-lobby-button{background:linear-gradient(135deg,var(--brass) 0%,var(--brass) 100%);color:var(--bone);border:none;border-radius:clamp(8px,1vw,12px);padding:clamp(10px,1.2vw,15px) clamp(20px,2.5vw,30px);font-weight:700;font-size:clamp(.9rem,1vw,1.1rem);cursor:pointer;transition:all .3s ease;min-width:clamp(140px,15vw,180px);box-shadow:0 4px 15px color-mix(in srgb,var(--felt-deep) 30%,transparent)}.return-to-lobby-button:hover{background:linear-gradient(135deg,var(--brass) 0%,var(--leather) 100%);transform:translateY(-2px);box-shadow:0 6px 20px color-mix(in srgb,var(--felt-deep) 50%,transparent)}@media (max-width: 1600px){body,.App{font-size:15px}}@media (max-width: 1400px){body,.App{font-size:14px}}@media (max-width: 1200px){body,.App{font-size:13px}}@media (max-width: 768px){.game-over-modal{width:95%;margin:20px}.game-over-title{font-size:2.5rem}.game-over-content{padding:30px 20px}.game-over-message{font-size:1.1rem}}.turn-indicator.opponent-turn{background:color-mix(in srgb,var(--ember) 30%,transparent);border:2px solid var(--ember);color:var(--ember)}.hero-stats .hero-name{font-weight:700;font-size:clamp(.85rem,1vw,1.1rem);margin-bottom:clamp(3px,.35vw,5px);text-align:center;color:var(--bone);padding-bottom:clamp(3px,.35vw,5px);border-bottom:1px solid color-mix(in srgb,var(--bone) 30%,transparent)}.game-board{display:flex;flex-direction:column;height:100vh;padding:0;overflow:hidden}.draft-phase{padding:clamp(5px,.8vw,10px);max-height:100vh;overflow-y:auto;overflow-x:hidden;position:relative}.abandon-draft-button{width:100%;padding:clamp(10px,1.2vw,12px);background:color-mix(in srgb,var(--ember) 12%,transparent);border:1.5px solid color-mix(in srgb,var(--ember-hi) 30%,transparent);border-radius:8px;color:var(--ember-hi);font-size:clamp(.75rem,.9vw,.9rem);font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:6px;margin-top:clamp(12px,1.4vw,16px);text-transform:none;letter-spacing:.3px}.abandon-draft-button:hover{background:color-mix(in srgb,var(--ember) 20%,transparent);border-color:color-mix(in srgb,var(--ember-hi) 50%,transparent);color:var(--ember-hi);transform:translateY(-1px);box-shadow:0 4px 12px color-mix(in srgb,var(--felt-deep) 30%,transparent)}.abandon-draft-button:active{transform:translateY(0);box-shadow:0 2px 6px color-mix(in srgb,var(--felt-deep) 20%,transparent)}.setup-phase{position:relative}.draft-cards{display:flex;justify-content:center;gap:clamp(6px,.8vw,12px);flex-wrap:wrap;margin:0 0 clamp(.5rem,.8vw,1rem) 0;padding-top:0}.draft-phase .draft-cards.ban-phase{display:flex;flex-direction:row;gap:clamp(8px,1vw,12px);justify-content:center;align-items:center;max-width:100%;margin:clamp(.2rem,.3vw,.4rem) auto clamp(.5rem,.8vw,1rem) auto;padding:.5rem 20px 0;flex-wrap:nowrap}.draft-phase .draft-cards.pick-phase{margin-top:0;padding-top:0}.draft-phase .draft-cards.ban-phase .ban-row-1,.draft-phase .draft-cards.ban-phase .ban-row-2{display:contents}.draft-actions{display:flex;justify-content:center;gap:clamp(6px,.8vw,10px);margin:clamp(.4rem,.8vw,.8rem) 0}.teams-display{display:flex;justify-content:space-around;margin:clamp(.2rem,.4vw,.4rem) 0 clamp(.3rem,.5vw,.6rem) 0;gap:clamp(.5rem,.8vw,.8rem);padding-top:clamp(.2rem,.4vw,.4rem);padding-bottom:clamp(.2rem,.4vw,.4rem);min-height:clamp(280px,36vh,420px)}.current-team,.opponent-team{flex:1;background:color-mix(in srgb,var(--bone) 10%,transparent);padding:clamp(.4rem,.8vw,.8rem);border-radius:6px;min-height:clamp(260px,35vh,400px);display:flex;flex-direction:column}.current-team h3,.opponent-team h3{margin-top:0;margin-bottom:clamp(.3rem,.5vw,.5rem);font-size:clamp(.85rem,1vw,1rem);text-align:center}.team-cards{display:flex;gap:clamp(4px,.6vw,6px);justify-content:center;flex-wrap:wrap}.turn-indicator.opponent-turn{background-color:color-mix(in srgb,var(--ember) 20%,transparent);border:2px solid var(--ember);color:var(--ember)}.setup-phase{padding:20px;text-align:center;max-height:100vh;overflow-y:auto;overflow-x:hidden}.setup-phase h2{margin-bottom:.5rem}.setup-phase>p{margin-bottom:2rem;color:var(--bone-dim)}.opponent-ready-indicator{background:color-mix(in srgb,var(--verdigris) 20%,transparent);border:2px solid var(--verdigris);color:var(--verdigris);padding:.75rem;border-radius:8px;margin-bottom:1.5rem;font-weight:700}.team-order-setup{display:flex;justify-content:center;margin:2rem 0}.draggable-team{display:flex;gap:1.5rem;justify-content:center;flex-wrap:wrap;max-width:900px}.draggable-hero-slot{position:relative;cursor:grab;transition:transform .3s cubic-bezier(.4,0,.2,1),opacity .15s ease;will-change:transform}.draggable-hero-slot:active{cursor:grabbing}.draggable-hero-slot.dragging{transform:scale(.95)}.banned-cards-section{margin-top:clamp(12px,1.4vw,16px);padding-top:clamp(12px,1.4vw,16px);border-top:1px solid color-mix(in srgb,var(--ember-hi) 25%,transparent)}.banned-cards-section h3{color:var(--ember-hi);font-size:clamp(.9rem,1.05vw,1.05rem);margin:0 0 clamp(8px,1vw,10px) 0;text-align:center;text-shadow:0 0 12px color-mix(in srgb,var(--felt-deep) 60%,transparent);font-weight:700;letter-spacing:.5px}.banned-cards-subtitle{font-size:clamp(.6rem,.7vw,.7rem);color:color-mix(in srgb,var(--bone) 40%,transparent);text-align:center;margin-bottom:clamp(10px,1.2vw,14px);font-style:italic}.banned-cards-list{display:flex;flex-direction:column;gap:clamp(6px,.8vw,8px)}.banned-card-item{display:flex;align-items:center;gap:clamp(6px,.8vw,8px);background:color-mix(in srgb,var(--ember-hi) 8%,transparent);padding:clamp(6px,.8vw,8px);border-radius:6px;transition:all .2s ease;border:1px solid color-mix(in srgb,var(--ember-hi) 15%,transparent)}.banned-card-item:hover{background:color-mix(in srgb,var(--ember-hi) 15%,transparent);border-color:color-mix(in srgb,var(--ember-hi) 30%,transparent);transform:translate(2px)}.banned-card-image{width:clamp(28px,3.5vw,35px);height:clamp(28px,3.5vw,35px);border-radius:3px;object-fit:cover;border:1px solid color-mix(in srgb,var(--ember-hi) 30%,transparent);flex-shrink:0}.banned-card-name{flex:1;font-size:clamp(.65rem,.75vw,.75rem);font-weight:600;color:var(--bone);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.banned-by-label{font-size:clamp(.55rem,.65vw,.65rem);color:var(--bone-dim);font-style:italic;flex-shrink:0}.banned-cards-count{margin-top:clamp(10px,1.2vw,12px);padding-top:clamp(10px,1.2vw,12px);border-top:1px solid color-mix(in srgb,var(--ember-hi) 15%,transparent);text-align:center;font-size:clamp(.65rem,.75vw,.75rem);color:color-mix(in srgb,var(--bone) 50%,transparent);font-weight:600}.draft-main-content{transition:margin-left .3s ease}.draft-main-content.with-sidebar{margin-left:0}.draggable-hero-slot:hover{transform:translateY(-5px);z-index:10000}.position-badge{position:absolute;top:-10px;left:-10px;background:var(--brass);color:var(--bone);width:35px;height:35px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.1rem;z-index:10;border:3px solid var(--bone);box-shadow:0 2px 8px color-mix(in srgb,var(--felt-deep) 30%,transparent)}.setup-actions{display:flex;justify-content:center;margin-top:2rem}.ready-button{background:var(--verdigris);font-size:1.2rem;padding:1rem 3rem;font-weight:700}.ready-button:hover:not(:disabled){background:var(--verdigris)}.ready-status{background:color-mix(in srgb,var(--verdigris) 20%,transparent);border:2px solid var(--verdigris);color:var(--verdigris);padding:1rem 2rem;border-radius:8px;font-weight:700}.ready-indicator{display:flex;align-items:center;gap:.5rem}.initiative-phase{display:flex;flex-direction:column;align-items:center;padding:2rem}.initiative-actions{margin:2rem 0}.turn-order-choice{background:color-mix(in srgb,var(--bone) 10%,transparent);padding:1.5rem;border-radius:8px;margin-top:2rem}.turn-order-choice h3{margin-top:0;text-align:center}.battle-with-overlay{position:relative;width:100%;height:100vh}.initiative-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:color-mix(in srgb,var(--felt-deep) 70%,transparent);display:flex;align-items:center;justify-content:center;z-index:2000;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.choice-buttons{display:flex;gap:1rem;justify-content:center;margin-top:1.5rem}.choice-buttons .action-button{background:linear-gradient(135deg,var(--verdigris) 0%,var(--verdigris) 100%);border:none;color:var(--bone);padding:12px 24px;font-size:1rem;border-radius:8px;cursor:pointer;transition:all .3s ease;min-width:120px}.choice-buttons .action-button:hover{background:linear-gradient(135deg,var(--verdigris) 0%,var(--verdigris) 100%);transform:translateY(-2px);box-shadow:0 4px 12px color-mix(in srgb,var(--felt-deep) 30%,transparent)}.waiting-choice{color:var(--brass-hi)}.team-display{display:flex;gap:clamp(10px,1vw,16px);justify-content:center;flex-wrap:wrap;padding:clamp(12px,1.5vw,20px);width:100%;margin:0 auto;box-sizing:border-box;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.opponent-area .team-display{transform:translate(-50%,calc(-50% + clamp(12px,1.5vw,20px)))}@media (max-width: 1600px){.team-display{left:52%}}@media (max-width: 1400px){.team-display{left:54%}}@media (max-width: 1200px){.team-display{left:56%}}@media (max-width: 1000px){.team-display{left:58%}}.ability-selection{display:flex;gap:10px;justify-content:center;margin:1rem 0;flex-wrap:wrap}.end-turn-button{background:var(--leather-hi)}.end-turn-button:hover:not(:disabled){background:var(--leather-hi)}.opponent-area{display:block;margin:0;padding:0;background:color-mix(in srgb,var(--leather) 30%,transparent);border-radius:0;flex:1;min-height:50vh;position:relative;box-sizing:border-box}.team-label-container{position:absolute;left:clamp(10px,1.2vw,20px);top:50%;transform:translateY(-70%);z-index:10;text-align:center}.team-label{text-align:center;margin:0;padding:clamp(8px,.8vw,12px) clamp(15px,1.5vw,24px);border-radius:clamp(8px,.8vw,12px);color:var(--bone);font-size:clamp(1rem,1.3vw,1.4rem);font-weight:700;box-shadow:0 4px 12px color-mix(in srgb,var(--felt-deep) 40%,transparent);white-space:nowrap;line-height:1.2;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:3px solid transparent;background-clip:padding-box;position:relative;overflow:hidden;min-width:clamp(140px,15vw,200px)}@media (max-width: 1400px){.team-label{padding:clamp(6px,.7vw,10px) clamp(12px,1.2vw,18px);font-size:clamp(.9rem,1.15vw,1.25rem);border:2px solid transparent;min-width:clamp(120px,13vw,170px)}}@media (max-width: 1200px){.team-label{padding:clamp(5px,.6vw,8px) clamp(10px,1vw,14px);font-size:clamp(.85rem,1.05vw,1.1rem);border:2px solid transparent;min-width:clamp(100px,12vw,140px)}}.opponent-label{background:linear-gradient(135deg,color-mix(in srgb,var(--leather) 85%,transparent) 0%,color-mix(in srgb,var(--ember) 90%,transparent) 100%);border-color:color-mix(in srgb,var(--ember) 80%,transparent);color:var(--bone);text-shadow:2px 2px 4px color-mix(in srgb,var(--felt-deep) 70%,transparent)}.opponent-label:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--bone) 15%,transparent),transparent);animation:shimmer 3s infinite}.player-label{background:linear-gradient(135deg,color-mix(in srgb,var(--brass) 85%,transparent) 0%,color-mix(in srgb,var(--brass) 90%,transparent) 100%);border-color:color-mix(in srgb,var(--brass) 80%,transparent);color:var(--bone);text-shadow:2px 2px 4px color-mix(in srgb,var(--felt-deep) 70%,transparent)}.player-label:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--bone) 15%,transparent),transparent);animation:shimmer 3s infinite 1.5s}.team-label:hover{transform:scale(1.05);box-shadow:0 6px 18px color-mix(in srgb,var(--felt-deep) 50%,transparent)}.opponent-label:hover{border-color:var(--ember);box-shadow:0 6px 18px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.player-label:hover{border-color:var(--brass);box-shadow:0 6px 18px color-mix(in srgb,var(--felt-deep) 40%,transparent)}.player-area{display:block;margin:0;padding:0;background:color-mix(in srgb,var(--brass) 25%,transparent);border-radius:0;flex:1;min-height:50vh;position:relative;box-sizing:border-box}.battle-combined-info{background:color-mix(in srgb,var(--felt-deep) 30%,transparent);padding:1rem;border-radius:8px;margin-bottom:1rem}.action-buttons{display:flex;gap:10px;justify-content:center;margin-top:1rem}.action-button{background:var(--brass);color:var(--bone);padding:clamp(6px,.7vw,10px) clamp(12px,1.2vw,20px);font-size:clamp(.8rem,.9vw,1rem)}.action-button:hover{background:var(--brass)}.action-button:disabled{background:var(--leather-hi)}.action-button.used{background:var(--leather-hi);color:var(--bone-dim);opacity:.7}.action-button.permanently-disabled{background:var(--leather);color:var(--leather-hi);opacity:.4;position:relative;border:1px solid var(--leather-hi)}.action-button.permanently-disabled:after{content:"🚫";position:absolute;top:2px;right:4px;font-size:.8rem}.action-button.selecting{background:var(--brass);color:var(--bone);border:2px solid var(--brass);animation:pulse 1.5s infinite}.waiting-choice h3{color:var(--brass-hi);margin:1rem 0}.choice-buttons{display:flex;gap:1rem;justify-content:center;margin-top:1rem}.game-info{display:flex;flex-direction:column;gap:20px}.phase-info,.player-info,.draft-info,.initiative-info{background:color-mix(in srgb,var(--bone) 10%,transparent);border-radius:8px;padding:15px;border-left:4px solid var(--brass)}.game-info h3{margin:0 0 10px;font-size:1.1rem;color:var(--brass);text-transform:none;letter-spacing:.5px}.turn-status{margin-top:8px;font-weight:700;padding:6px;border-radius:4px;background:color-mix(in srgb,var(--felt-deep) 30%,transparent)}.matchup-display{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px;margin:8px 0;background:color-mix(in srgb,var(--felt-deep) 30%,transparent);border-radius:6px;font-size:.95rem}.player-name-sidebar{color:var(--brass);font-weight:700;text-shadow:0 0 8px color-mix(in srgb,var(--felt-deep) 50%,transparent);font-size:1.5em}.opponent-name-sidebar{color:var(--ember-hi);font-weight:700;text-shadow:0 0 8px color-mix(in srgb,var(--felt-deep) 50%,transparent);font-size:1.5em}.vs-text-sidebar{color:var(--brass-hi);font-weight:900;font-size:1.1em;text-shadow:0 0 10px color-mix(in srgb,var(--felt-deep) 60%,transparent)}.setup-info,.battle-info,.battle-combined-info{background:color-mix(in srgb,var(--bone) 10%,transparent);border-radius:8px;padding:15px;border:1px solid color-mix(in srgb,var(--brass-hi) 25%,transparent);box-shadow:inset 0 0 18px color-mix(in srgb,var(--felt-deep) 35%,transparent)}.current-turn{font-weight:700;font-size:1.1rem;background:color-mix(in srgb,var(--verdigris) 20%,transparent);border-style:4px solid var(--brass-hi);margin-bottom:10px}.opponent-turn{color:var(--ember);font-weight:700;font-size:1.1rem;padding:8px;background:color-mix(in srgb,var(--ember) 20%,transparent);border-radius:6px;margin-bottom:10px}.active-hero{background:color-mix(in srgb,var(--felt-deep) 30%,transparent);border-radius:6px;padding:10px;margin-top:8px}.active-hero h4{margin:0 0 6px;color:var(--brass);font-size:.95rem}.active-hero .hero-name{font-weight:700;margin-bottom:4px}.active-hero .hero-hp{font-size:.9rem;color:var(--bone)}.battle-layout{display:flex;gap:0;min-height:100vh;max-height:100vh;overflow:auto;margin:0;margin-right:clamp(200px,18vw,300px)}.game-board{flex:1;display:flex;flex-direction:column;gap:0;padding:0;margin:0;width:100%;min-height:100vh;overflow-y:auto}.action-bar{width:clamp(200px,18vw,300px);background:color-mix(in srgb,var(--felt-deep) 80%,transparent);border-left:2px solid var(--brass);padding:0;margin:0;overflow-y:auto;overflow-x:hidden;flex-shrink:0;display:flex;flex-direction:column;gap:0;position:fixed;top:0;right:0;bottom:0;height:100vh;z-index:1000}.action-bar>*{padding:clamp(10px,1.5vw,20px)}.action-bar h3{margin:0;padding:clamp(10px,1.5vw,20px) clamp(10px,1.5vw,20px) clamp(5px,.7vw,10px) clamp(10px,1.5vw,20px);font-size:clamp(1.2rem,2vw,1.8rem);text-shadow:2px 2px 4px color-mix(in srgb,var(--felt-deep) 50%,transparent);color:var(--brass);text-align:center}.ability-selection{display:flex;flex-direction:column;gap:8px;background:color-mix(in srgb,var(--bone) 10%,transparent);border-radius:8px;padding:15px;border-left:4px solid var(--brass)}.ability-selection h4{margin:0 0 10px;color:var(--brass);font-size:1.1rem;text-transform:none;letter-spacing:.5px;text-align:center}.ability-options{display:flex;flex-direction:column;gap:8px}.ability-option-button{background:color-mix(in srgb,var(--brass) 20%,transparent);color:var(--bone);border:2px solid var(--brass);border-radius:6px;padding:12px;cursor:pointer;transition:all .2s ease;text-align:left}.ability-option-button:hover{background:color-mix(in srgb,var(--brass) 40%,transparent);border-color:var(--brass);transform:translateY(-1px)}.ability-option-button:active{transform:translateY(0)}.ability-name{font-weight:700;font-size:1rem;margin-bottom:4px;color:var(--brass)}.ability-description{font-size:.85rem;color:var(--brass);line-height:1.3}.cancel-ability-selection{background:var(--ember)!important;border-color:var(--ember)!important}.action-buttons{display:flex;flex-direction:column;gap:10px;background:color-mix(in srgb,var(--bone) 10%,transparent);border-radius:8px;padding:15px;border-left:4px solid var(--ember)}.action-buttons h4{margin:0 0 10px;color:var(--ember);font-size:1.1rem;text-transform:none;letter-spacing:.5px;text-align:center}.simple-actions .action-button{padding:14px 16px;border:none;border-radius:6px;cursor:pointer;font-weight:700;font-size:1rem;transition:all .2s;text-align:center}.action-button{padding:12px;border:none;border-radius:6px;cursor:pointer;font-weight:700;transition:all .2s;font-size:.95rem;min-width:140px;width:100%}.end-turn-button{background:var(--leather-hi);color:var(--bone)}.end-turn-button:hover{background:var(--leather-hi)}.action-button:disabled{background:var(--leather);color:var(--leather-hi);cursor:not-allowed}.special-ability{color:var(--brass);font-weight:700;text-shadow:0 0 8px color-mix(in srgb,var(--felt-deep) 60%,transparent)}.survival-info{background:linear-gradient(135deg,color-mix(in srgb,var(--brass-hi) 10%,transparent) 0%,color-mix(in srgb,var(--brass-hi) 10%,transparent) 100%);border:1px solid color-mix(in srgb,var(--brass-hi) 30%,transparent);border-radius:8px;padding:15px;margin-bottom:20px;border-left:4px solid var(--brass-hi)}.survival-stats{display:flex;flex-direction:column;gap:8px}.survival-wins{color:var(--brass-hi);font-weight:700;font-size:1rem}.survival-losses{color:var(--ember-hi);font-weight:700;font-size:1rem}.action-button:disabled{opacity:.5;cursor:not-allowed}.player-profile-icon{display:flex;justify-content:center;margin-top:4px}.profile-icon-small{width:90px;height:90px;border-radius:50%;border:2px solid var(--brass);object-fit:cover;background:color-mix(in srgb,var(--felt-deep) 30%,transparent)}.opponent-area .profile-icon-small{border-color:var(--ember)}.player-area .profile-icon-small{border-color:var(--verdigris)}.challenge-actions{display:flex;gap:12px;justify-content:center;margin-top:16px}.challenge-actions .action-button.secondary{background:color-mix(in srgb,var(--bone) 12%,transparent)}.challenge-notice{position:fixed;top:20px;left:50%;transform:translate(-50%);z-index:3000;display:flex;align-items:center;gap:14px;padding:10px 18px;border-radius:10px;background:color-mix(in srgb,var(--walnut) 95%,transparent);border:1px solid color-mix(in srgb,var(--brass) 50%,transparent);color:var(--bone);font-size:.95rem}.challenge-notice button{background:var(--ember-hi);border:none;border-radius:6px;color:var(--bone);padding:4px 12px;cursor:pointer}.friends-icon{position:fixed;bottom:20px;left:30px;z-index:1500;background:linear-gradient(135deg,color-mix(in srgb,var(--brass) 90%,transparent) 0%,color-mix(in srgb,var(--brass) 95%,transparent) 100%);border:2px solid color-mix(in srgb,var(--brass) 70%,transparent);border-radius:50%;width:60px;height:60px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px color-mix(in srgb,var(--felt-deep) 30%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.friends-icon:hover{transform:scale(1.1);box-shadow:0 6px 20px color-mix(in srgb,var(--felt-deep) 50%,transparent);border-color:color-mix(in srgb,var(--brass) 90%,transparent)}.friends-icon-content{position:relative;display:flex;align-items:center;justify-content:center}.friends-icon-svg{width:28px;height:28px;color:var(--bone);filter:drop-shadow(0 2px 4px color-mix(in srgb,var(--felt-deep) 30%,transparent))}.notification-badge{position:absolute;top:-8px;right:-8px;background:var(--ember);color:var(--bone);border-radius:50%;min-width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700;border:2px solid var(--bone);box-shadow:0 2px 8px color-mix(in srgb,var(--felt-deep) 40%,transparent);animation:pulse-notification 2s infinite}.friends-icon.has-notifications{animation:friends-glow 1.5s ease-in-out infinite alternate}.friends-icon:hover .friends-icon-tooltip{opacity:1;visibility:visible}.message-icon{position:fixed;bottom:20px;left:110px;width:60px;height:60px;background:color-mix(in srgb,var(--walnut) 95%,transparent);border:2px solid color-mix(in srgb,var(--leather-hi) 30%,transparent);border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;z-index:1500;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.message-icon:hover{background:var(--walnut);transform:scale(1.05);border-color:color-mix(in srgb,var(--bone-dim) 50%,transparent)}.message-icon-content{position:relative;display:flex;align-items:center;justify-content:center}.message-icon-svg{width:24px;height:24px;color:var(--bone);transition:color .3s ease}.message-icon:hover .message-icon-svg{color:var(--verdigris)}.message-icon .notification-badge{position:absolute;top:-8px;right:-8px;background:var(--ember);color:var(--bone);font-size:.7rem;font-weight:700;padding:2px 6px;border-radius:10px;min-width:18px;height:18px;display:flex;align-items:center;justify-content:center;border:2px solid color-mix(in srgb,var(--walnut) 95%,transparent)}.message-icon .minimized-chat-indicator{position:absolute;top:-8px;right:-8px;background:var(--verdigris);width:12px;height:12px;border-radius:50%;border:2px solid color-mix(in srgb,var(--walnut) 95%,transparent)}.message-icon.has-notifications{animation:message-glow 1.5s ease-in-out infinite alternate}.message-icon.has-minimized{border-color:color-mix(in srgb,var(--verdigris) 50%,transparent)}.message-icon:hover .message-icon-tooltip{opacity:1;visibility:visible}.friends-overlay-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;z-index:2000;pointer-events:none}.friends-overlay{position:fixed;bottom:100px;left:30px;background:linear-gradient(135deg,var(--walnut) 0%,var(--leather) 100%);border:2px solid color-mix(in srgb,var(--brass) 70%,transparent);border-radius:16px;width:300px;overflow:visible;box-shadow:0 25px 50px color-mix(in srgb,var(--felt-deep) 70%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);pointer-events:all;display:flex;flex-direction:column}.friends-overlay-content{flex:1;overflow:visible;padding:20px;display:flex;flex-direction:column}.friends-overlay-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid color-mix(in srgb,var(--bone) 10%,transparent);flex-shrink:0;background:color-mix(in srgb,var(--brass) 10%,transparent)}.friends-overlay-header h3{margin:0;color:var(--brass);font-size:1.3rem;font-weight:700}.friends-overlay-content{padding:20px;max-height:60vh;overflow-y:auto}.friend-requests-section{margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid color-mix(in srgb,var(--bone) 10%,transparent)}.friend-requests-section h4{margin:0 0 15px;color:var(--brass-hi);font-size:1rem;display:flex;align-items:center;gap:8px}.friend-requests-list{display:flex;flex-direction:column;gap:10px}.friend-request-item{display:flex;justify-content:space-between;align-items:center;background:color-mix(in srgb,var(--brass-hi) 10%,transparent);border:1px solid color-mix(in srgb,var(--brass-hi) 30%,transparent);border-radius:8px;padding:12px}.request-username{font-weight:700;color:var(--bone)}.request-actions{display:flex;gap:8px}.accept-button,.reject-button{width:36px;height:36px;border:2px solid transparent;border-radius:50%;cursor:pointer;font-weight:700;font-size:1.1rem;transition:all .3s ease;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px color-mix(in srgb,var(--felt-deep) 30%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.accept-button{background:linear-gradient(135deg,var(--verdigris) 0%,var(--verdigris) 50%,var(--brass) 100%);color:var(--bone);border-color:color-mix(in srgb,var(--verdigris) 50%,transparent)}.accept-button:hover{background:linear-gradient(135deg,var(--verdigris) 0%,var(--verdigris) 50%,var(--brass) 100%);transform:scale(1.15) translateY(-2px);box-shadow:0 8px 20px color-mix(in srgb,var(--felt-deep) 40%,transparent);border-color:color-mix(in srgb,var(--verdigris) 80%,transparent)}.reject-button{background:linear-gradient(135deg,var(--ember) 0%,var(--ember) 50%,var(--ember) 100%);color:var(--bone);border-color:color-mix(in srgb,var(--ember) 50%,transparent)}.reject-button:hover{background:linear-gradient(135deg,var(--ember) 0%,var(--ember) 50%,var(--ember) 100%);transform:scale(1.15) translateY(-2px);box-shadow:0 8px 20px color-mix(in srgb,var(--felt-deep) 40%,transparent);border-color:color-mix(in srgb,var(--ember) 80%,transparent)}.add-friend-section{margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid color-mix(in srgb,var(--bone) 10%,transparent)}.add-friend-button{background:linear-gradient(135deg,var(--verdigris) 0%,var(--verdigris) 100%);color:var(--bone);border:none;border-radius:8px;padding:10px 20px;cursor:pointer;font-weight:700;transition:all .3s ease;width:100%}.add-friend-button:hover{background:linear-gradient(135deg,var(--verdigris) 0%,var(--verdigris) 100%);transform:translateY(-2px);box-shadow:0 4px 15px color-mix(in srgb,var(--felt-deep) 30%,transparent)}.add-friend-input-section{display:flex;gap:8px;align-items:center}.add-friend-input{flex:1;padding:8px 12px;border:1px solid color-mix(in srgb,var(--bone) 30%,transparent);border-radius:6px;background:color-mix(in srgb,var(--bone) 10%,transparent);color:var(--bone);font-size:.9rem}.add-friend-input::placeholder{color:color-mix(in srgb,var(--bone) 60%,transparent)}.add-friend-input:focus{outline:none;border-color:var(--brass);box-shadow:0 0 8px color-mix(in srgb,var(--felt-deep) 30%,transparent)}.send-request-button{background:var(--brass);color:var(--bone);border:none;border-radius:6px;padding:8px 12px;cursor:pointer;font-size:.9rem;transition:all .2s ease}.send-request-button:hover{background:var(--brass)}.cancel-button{background:var(--leather-hi);color:var(--bone);border:none;border-radius:6px;padding:8px 12px;cursor:pointer;font-size:.9rem;transition:all .2s ease}.cancel-button:hover{background:var(--leather-hi)}.online-players-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.online-players-section h4{margin:0;color:var(--brass);font-size:1rem}.online-players-section{flex:1;overflow:visible;display:flex;flex-direction:column}.players-list{display:flex;flex-direction:column;gap:8px;margin-bottom:15px;overflow:visible}.player-item{border-radius:8px;overflow:visible;transition:all .2s ease;margin-bottom:8px}.player-info{display:flex;align-items:center;justify-content:space-between;padding:12px;background:color-mix(in srgb,var(--bone) 5%,transparent);border:1px solid color-mix(in srgb,var(--bone) 10%,transparent);cursor:pointer;transition:all .2s ease;position:relative;border-radius:8px}.player-info:hover{background:color-mix(in srgb,var(--bone) 10%,transparent);border-color:color-mix(in srgb,var(--brass) 50%,transparent)}.player-info.friend{border-color:color-mix(in srgb,var(--brass) 30%,transparent);background:color-mix(in srgb,var(--brass) 10%,transparent)}.player-username{font-weight:700;color:var(--bone)}.friend-badge{background:var(--brass);color:var(--bone);padding:2px 8px;border-radius:12px;font-size:.75rem;font-weight:700;margin-left:8px}.in-game-badge{background:var(--verdigris);color:var(--bone);padding:2px 8px;border-radius:12px;font-size:.75rem;font-weight:700;margin-left:8px}.player-tooltip{position:fixed;left:370px;top:200px;display:flex;flex-direction:column;gap:6px;padding:12px;background:color-mix(in srgb,var(--walnut) 95%,transparent);border:2px solid color-mix(in srgb,var(--brass) 60%,transparent);border-radius:12px;box-shadow:0 12px 30px color-mix(in srgb,var(--felt-deep) 70%,transparent);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:9999;min-width:140px;animation:tooltipFadeIn .2s ease-out;white-space:nowrap}.tooltip-action{padding:8px 12px;border:none;border-radius:8px;cursor:pointer;font-size:.8rem;font-weight:600;transition:all .2s ease;background:color-mix(in srgb,var(--bone) 10%,transparent);color:var(--bone);border:1px solid color-mix(in srgb,var(--bone) 20%,transparent);white-space:nowrap}.add-friend-action{background:var(--verdigris);color:var(--bone)}.add-friend-action:hover:not(:disabled){background:var(--verdigris)}.remove-friend-action{background:var(--ember);color:var(--bone)}.remove-friend-action:hover:not(:disabled){background:var(--ember)}.message-action{background:var(--brass);color:var(--bone)}.message-action:hover:not(:disabled){background:var(--brass)}.watch-action{background:var(--leather-hi);color:var(--bone)}.watch-action:hover:not(:disabled){background:var(--leather-hi)}.online-count{text-align:center;padding:15px;border-top:1px solid color-mix(in srgb,var(--bone) 10%,transparent);background:color-mix(in srgb,var(--felt-deep) 20%,transparent);color:var(--bone);margin:0 -20px -20px}.online-count .count{color:var(--verdigris);font-weight:700;font-size:1.1rem}.message-chat-window{position:fixed;width:350px;height:400px;background:linear-gradient(135deg,var(--walnut) 0%,var(--leather) 100%);border:2px solid color-mix(in srgb,var(--brass) 70%,transparent);border-radius:12px;box-shadow:0 15px 35px color-mix(in srgb,var(--felt-deep) 60%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:2100;display:flex;flex-direction:column;resize:both;overflow:hidden;min-width:300px;min-height:250px}.chat-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:color-mix(in srgb,var(--brass) 20%,transparent);border-bottom:1px solid color-mix(in srgb,var(--bone) 10%,transparent);-webkit-user-select:none;user-select:none}.chat-title{font-weight:700;color:var(--bone);font-size:1rem}.chat-controls{display:flex;gap:8px;align-items:center}.chat-minimize-button{--minimize-blue: var(--brass);flex-shrink:0;width:36px;height:36px;padding:0;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;border:2px solid var(--minimize-blue);background:color-mix(in srgb,var(--brass) 10%,transparent);color:var(--minimize-blue);cursor:pointer;box-shadow:0 0 8px color-mix(in srgb,var(--felt-deep) 35%,transparent),inset 0 0 6px color-mix(in srgb,var(--felt-deep) 15%,transparent);transition:background .2s ease,color .2s ease,box-shadow .2s ease,transform .2s ease}.chat-minimize-button svg{display:block}.chat-minimize-button:hover{background:var(--minimize-blue);color:var(--bone);box-shadow:0 0 16px color-mix(in srgb,var(--felt-deep) 75%,transparent);transform:scale(1.08)}.chat-minimize-button:active{transform:scale(.94)}.chat-minimize-button:focus-visible{outline:2px solid var(--bone);outline-offset:2px}.chat-body{flex:1;display:flex;flex-direction:column;overflow:hidden}.messages-container{flex:1;padding:16px;overflow-y:auto;display:flex;flex-direction:column;gap:12px}.chat-loading,.no-messages{text-align:center;color:var(--bone);font-style:italic;padding:20px}.message{display:flex;flex-direction:column;max-width:80%}.message.sent{align-self:flex-end;align-items:flex-end}.message.received{align-self:flex-start;align-items:flex-start}.message-content{background:color-mix(in srgb,var(--bone) 10%,transparent);padding:8px 12px;border-radius:12px;color:var(--bone);word-wrap:break-word;line-height:1.4}.message.sent .message-content{background:linear-gradient(135deg,var(--brass) 0%,var(--brass) 100%);border-bottom-right-radius:4px}.message.received .message-content{background:color-mix(in srgb,var(--bone) 15%,transparent);border-bottom-left-radius:4px}.message-time{font-size:.75rem;color:var(--bone-dim);margin-top:4px}.message-input-container{display:flex;gap:8px;padding:16px;border-top:1px solid color-mix(in srgb,var(--bone) 10%,transparent);background:color-mix(in srgb,var(--felt-deep) 20%,transparent)}.message-input{flex:1;padding:8px 12px;border:1px solid color-mix(in srgb,var(--bone) 30%,transparent);border-radius:8px;background:color-mix(in srgb,var(--bone) 10%,transparent);color:var(--bone);font-size:.9rem;resize:none;font-family:inherit}.message-input::placeholder{color:color-mix(in srgb,var(--bone) 60%,transparent)}.message-input:focus{outline:none;border-color:var(--brass);box-shadow:0 0 8px color-mix(in srgb,var(--felt-deep) 30%,transparent)}.send-button{background:var(--brass);color:var(--bone);border:none;border-radius:8px;padding:8px 16px;cursor:pointer;font-weight:700;transition:all .2s ease}.send-button:hover:not(:disabled){background:var(--brass)}.send-button:disabled{background:var(--leather-hi);cursor:not-allowed}.messages-container::-webkit-scrollbar{width:6px}.messages-container::-webkit-scrollbar-track{background:color-mix(in srgb,var(--bone) 10%,transparent);border-radius:3px}.messages-container::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--bone) 30%,transparent);border-radius:3px}.messages-container::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--bone) 50%,transparent)}@media (max-width: 768px){.friends-overlay{width:95vw;max-height:90vh;left:2.5vw;bottom:80px}.message-chat-window{width:90vw;max-width:350px;height:50vh;max-height:400px}.friends-icon{width:50px;height:50px;bottom:15px;left:25px}.friends-icon-svg{width:24px;height:24px}.message-icon{width:50px;height:50px;bottom:15px;left:85px}}.game-content{min-width:0}.draft-phase,.setup-phase{box-sizing:border-box}.opponent-area{background:color-mix(in srgb,var(--ember) 14%,transparent)}.player-area{background:color-mix(in srgb,var(--verdigris) 12%,transparent)}.team-label{font-family:var(--font-display);font-weight:400;color:var(--bone);text-shadow:none}.player-profile-icon img,.profile-icon-small{border:1px solid var(--brass);border-radius:var(--radius-control)}.game-sidebar{background:var(--walnut);border-right:1px solid var(--brass-dim);color:var(--bone);font-family:var(--font-ui)}.action-bar{background:var(--walnut);border-left:1px solid var(--brass-dim);color:var(--bone);font-family:var(--font-ui)}.game-sidebar h3,.game-sidebar h4,.action-bar h3{font-family:var(--font-display);font-weight:400;color:var(--bone);text-shadow:none}.connection-status{background:var(--leather);color:var(--bone);border:1px solid var(--brass-dim)}.action-button{background:var(--brass);color:var(--felt-deep);border:1px solid var(--brass-hi);border-radius:var(--radius-control);font:700 var(--text-md) / 1.1 var(--font-ui);box-shadow:none}.action-button:hover:not(:disabled){background:var(--brass-hi);transform:none;box-shadow:none}.action-button:focus-visible,.return-to-lobby-button:focus-visible,.abandon-draft-button:focus-visible{outline:var(--focus-outline);outline-offset:2px}.action-button:disabled,.action-button.used{background:var(--leather);color:var(--bone-dim);border-color:var(--brass-dim);opacity:.7;cursor:not-allowed}.action-button.end-turn-button,.action-button.cancel-ability-selection{background:transparent;color:var(--bone);border-color:var(--brass)}.action-button.end-turn-button:hover:not(:disabled),.action-button.cancel-ability-selection:hover:not(:disabled){background:var(--leather)}.ability-option-button{background:var(--leather);color:var(--bone);border:1px solid var(--brass-dim);border-radius:var(--radius-control)}.ability-option-button:hover:not(:disabled){border-color:var(--brass);background:var(--leather-hi)}.abandon-draft-button{background:transparent;color:var(--ember-hi);border:1px solid var(--ember);border-radius:var(--radius-control);text-transform:none;letter-spacing:0;font-family:var(--font-ui)}.abandon-draft-button:hover{background:var(--ember);color:var(--bone);transform:none;box-shadow:none}.current-turn,.turn-status{color:var(--bone);font-weight:700}.current-turn{color:var(--verdigris)}.opponent-turn{color:var(--bone-dim)}.spectator-turn,.spectator-label{color:var(--bone)}.initiative-overlay,.game-over-overlay{background:var(--scrim);-webkit-backdrop-filter:none;backdrop-filter:none}.initiative-phase,.game-over-modal{background:var(--walnut);border:1px solid var(--brass-dim);border-radius:var(--radius-panel);box-shadow:var(--shadow-panel),var(--inset-frame);color:var(--bone);font-family:var(--font-ui)}.initiative-phase h2,.initiative-phase h3,.game-over-title{font-family:var(--font-display);font-weight:400;text-shadow:none}.game-over-title{animation:none;filter:none}.game-over-title.winner{color:var(--verdigris);border-bottom-color:var(--verdigris)}.game-over-title.loser{color:var(--ember-hi);border-bottom-color:var(--ember)}.game-over-message{color:var(--bone-dim)}.return-to-lobby-button{background:var(--brass);color:var(--felt-deep);border:1px solid var(--brass-hi);border-radius:var(--radius-control);font:700 var(--text-md) / 1.1 var(--font-ui);box-shadow:none}.return-to-lobby-button:hover{background:var(--brass-hi);transform:none;box-shadow:none}.game-over-content>.return-to-lobby-button{margin-top:var(--space-5)}.return-to-lobby-button.secondary{background:transparent;color:var(--bone);border-color:var(--brass)}.return-to-lobby-button.danger{background:transparent;color:var(--ember-hi);border-color:var(--ember)}.return-to-lobby-button.danger:hover{background:var(--ember);color:var(--bone)}.game-over-content .button-group{display:flex;gap:var(--space-3);justify-content:center;margin-top:var(--space-5)}.surrender-title{margin:0;font:400 var(--text-xl) / 1.1 var(--font-display)}.surrender-message{margin:var(--space-3) 0 0;color:var(--bone-dim)}.current-team,.opponent-team{background:color-mix(in srgb,var(--leather) 70%,transparent);border:1px solid var(--brass-dim)}.draggable-hero-slot{cursor:grab}.position-badge{background:var(--brass);color:var(--felt-deep);border:2px solid var(--walnut);font-family:var(--font-ui)}.ready-status,.opponent-ready-indicator{background:color-mix(in srgb,var(--verdigris) 18%,transparent);border:1px solid var(--verdigris);color:var(--bone)}.ready-indicator,.opponent-ready-indicator span{display:inline-flex;align-items:center;gap:var(--space-2)}.ready-button{background:var(--brass)}.banned-cards-section h3{color:var(--ember-hi);text-shadow:none;letter-spacing:0}.floating-surrender-button,.spectator-count-button,.spectator-list-modal,.opponent-disconnect-notice{position:fixed;z-index:1000}.floating-surrender-button{right:20px;bottom:20px}.spectator-count-button{right:220px;bottom:20px;width:3.5rem;height:3.5rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:0;font:700 var(--text-sm) / 1 var(--font-ui);color:var(--bone);background:var(--walnut);border:1px solid var(--brass);border-radius:50%;box-shadow:var(--shadow-panel)}.spectator-count-button:hover{background:var(--leather);transform:none}.spectator-list-modal{right:220px;bottom:90px;min-width:220px;max-width:300px;max-height:300px;overflow-y:auto;padding:var(--space-4);background:var(--walnut);color:var(--bone);border:1px solid var(--brass-dim);border-radius:var(--radius-panel);box-shadow:var(--shadow-panel),var(--inset-frame)}.spectator-list-modal h3{margin:0 0 var(--space-3);padding-bottom:var(--space-2);font:400 var(--text-lg) / 1.1 var(--font-display);border-bottom:1px solid var(--brass-dim)}.spectator-list-modal ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-1)}.spectator-list-modal li{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);background:var(--leather);border-radius:var(--radius-control);font-size:var(--text-sm)}.opponent-disconnect-notice{right:20px;bottom:130px;min-width:200px;padding:var(--space-3) var(--space-5);text-align:center;color:var(--bone);background:var(--walnut);border:1px solid var(--ember);border-radius:var(--radius-panel);box-shadow:var(--shadow-panel)}.opponent-disconnect-notice .notice-title{display:flex;align-items:center;justify-content:center;gap:var(--space-2);font-size:var(--text-sm);margin-bottom:var(--space-1)}.opponent-disconnect-notice .notice-count{font:400 var(--text-2xl) / 1 var(--font-display);color:var(--ember-hi)}.opponent-disconnect-notice .notice-hint{font-size:var(--text-xs);color:var(--bone-dim);margin-top:var(--space-1)}@media (prefers-reduced-motion: reduce){.turn-indicator,.game-over-title{animation:none}.action-button,.return-to-lobby-button{transition:none}}.draft-clock{position:fixed;top:var(--space-5);right:var(--space-5);z-index:900;width:6rem;height:6rem;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--walnut);border:1px solid var(--brass);border-radius:50%;box-shadow:var(--shadow-panel),var(--inset-frame);color:var(--bone)}.draft-clock svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.draft-clock-track{fill:none;stroke:var(--leather);stroke-width:6}.draft-clock-hand{fill:none;stroke:var(--brass-hi);stroke-width:6;stroke-linecap:round;transition:stroke-dashoffset .2s linear}.draft-clock--urgent .draft-clock-hand{stroke:var(--ember-hi)}.draft-clock-seconds{font:400 var(--text-2xl) / 1 var(--font-display)}.draft-clock-note{font-size:var(--text-xs);color:var(--bone-dim)}.rotate-prompt{display:none}@media (orientation: portrait) and (max-width: 700px){.rotate-prompt{position:fixed;top:0;right:0;bottom:0;left:0;z-index:5000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-4);padding:var(--space-6);text-align:center;background:var(--felt-surface);color:var(--bone)}.rotate-prompt h2{margin:0;font:400 var(--text-xl) / 1.1 var(--font-display)}.rotate-prompt p{margin:0;max-width:18rem;color:var(--bone-dim)}.rotate-prompt-icon{color:var(--brass-hi);animation:rotate-hint .9s var(--ease) both}}@keyframes rotate-hint{0%{transform:rotate(-90deg)}to{transform:rotate(0)}}@media (prefers-reduced-motion: reduce){.draft-clock-hand{transition:none}.rotate-prompt-icon{animation:none}}.game-sidebar:has(.battle-combined-info){width:clamp(220px,20vw,320px)}.game-sidebar>.game-info:has(.battle-combined-info){padding:var(--space-2)}.battle-combined-info{background:none;padding:var(--space-2);margin:0;border-radius:0}.battle-combined-info>h3{margin:0 0 var(--space-3);font:400 var(--text-xl) / 1 var(--font-display);color:var(--bone)}.turn-info>div{padding:var(--space-2) var(--space-3);font:700 var(--text-sm) / 1.2 var(--font-ui);background:var(--leather);border-left:3px solid var(--brass-dim);border-radius:var(--radius-control)}.turn-info .current-turn{color:var(--bone);border-left-color:var(--verdigris);background:color-mix(in srgb,var(--verdigris) 18%,var(--leather))}.turn-info .opponent-turn{color:var(--bone-dim);border-left-color:var(--ember);background:color-mix(in srgb,var(--ember) 14%,var(--leather))}.turn-info .spectator-turn{color:var(--bone);border-left-color:var(--brass)}.active-hero{margin-top:var(--space-3);padding:var(--space-3);background:var(--leather);border:1px solid var(--brass-dim);border-radius:var(--radius-control)}.active-hero h4{margin:0 0 var(--space-1);font:700 var(--text-xs) / 1 var(--font-ui);color:var(--bone-dim)}.active-hero .hero-name{margin:0;font:400 var(--text-lg) / 1.1 var(--font-display);color:var(--brass-hi)}.active-hero .hero-hp{font-size:var(--text-sm);color:var(--bone);font-variant-numeric:tabular-nums}.battle-log-section{display:flex;flex-direction:column;min-width:0;max-height:52vh;margin-top:var(--space-3);padding:var(--space-2);overflow:hidden;background:var(--felt-deep);border:1px solid var(--brass-dim);border-radius:var(--radius-panel);box-shadow:inset 0 2px 6px var(--shade)}.battle-log-section h4{margin:0 0 var(--space-3);padding-bottom:var(--space-2);font:400 var(--text-lg) / 1.1 var(--font-display);color:var(--bone);border-bottom:1px solid var(--brass-dim)}.log-entries{display:flex;flex-direction:column;gap:var(--space-2);max-height:44vh;padding-right:var(--space-1);overflow-x:hidden;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--brass-dim) transparent}.log-placeholder{font-size:var(--text-sm);color:var(--bone-dim)}.log-entry{position:relative;padding:var(--space-2);font-size:var(--text-sm);line-height:1.35;color:var(--bone);background:var(--leather);border-left:3px solid var(--brass-dim);border-radius:var(--radius-control);overflow-wrap:anywhere;animation:log-entry-in .32s var(--ease)}.log-entry.crit{border-left-color:var(--brass-hi);background:color-mix(in srgb,var(--brass) 14%,var(--leather))}.log-entry.killed{border-left-color:var(--ember)}.log-entry.crit:before{content:"Critical hit";display:block;margin-bottom:2px;font-size:var(--text-xs);font-weight:700;color:var(--brass-hi)}.log-entry.killed:after{content:"Defeated";display:block;margin-top:2px;font-size:var(--text-xs);font-weight:700;color:var(--ember-hi)}@keyframes log-entry-in{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:none}}.log-action{margin-bottom:2px;color:var(--bone)}.log-result{color:var(--bone-dim)}.log-entries .hero-name,.log-entries .target-name{color:var(--bone);font-weight:700}.log-entries .ability-name,.log-entries .special-name{color:var(--brass-hi);font-weight:600}.log-entries .special-name{font-style:italic}.log-entries .hit{color:var(--ember-hi)}.log-entries .miss{color:var(--bone-dim)}.log-entries .heal{color:var(--verdigris);font-weight:700}.log-entries .crit,.log-entries .buff,.log-entries .advantage-chosen,.log-entries .special-ability,.log-entries .special-reflection,.log-entries .timekeeper-command{color:var(--brass-hi);font-weight:700}.log-entries .status{color:var(--bone);font-weight:700}.log-entries .special-note,.log-entries .trigger-context,.log-entries .heal-info{color:var(--bone-dim);font-style:italic}.log-entries .roll-info,.log-entries .damage-roll-info,.log-entries .heal-roll-info{margin-left:var(--space-1);font-size:var(--text-xs);color:var(--bone-dim);font-variant-numeric:tabular-nums}@media (prefers-reduced-motion: reduce){.log-entry{animation:none}}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;z-index:1000}.shop-overlay,.profile-modal-overlay,.friends-overlay-backdrop,.requirement-modal-overlay,.quest-reward-overlay,.pack-opening-overlay,.icon-selector-overlay,.modal-overlay{background:var(--scrim);-webkit-backdrop-filter:none;backdrop-filter:none}.shop-container,.profile-modal,.friends-overlay,.message-chat-window,.settings-modal,.rules-modal,.requirement-modal-container,.quest-reward-modal,.pack-contents-container,.icon-selector{background:var(--walnut);border:1px solid var(--brass-dim);border-radius:var(--radius-panel);box-shadow:var(--shadow-panel),var(--inset-frame);color:var(--bone);font-family:var(--font-ui)}.shop-header h2,.profile-header h2,.friends-overlay-header h3,.rules-modal-header h3,.chat-title,.requirement-title,.quest-reward-modal h3,.pack-contents-title,.icon-selector-header h3{font-family:var(--font-display);font-weight:400;color:var(--bone);text-shadow:none;letter-spacing:0}.shop-section-header h3,.online-players-header h3,.favorite-hero-section h3{font-family:var(--font-display);font-weight:400;color:var(--bone);text-shadow:none}.rules-modal-header,.friends-overlay-header,.chat-header,.profile-header,.shop-header{background:var(--leather);border-bottom:1px solid var(--brass-dim)}.shop-buy-btn,.pack-buy-btn,.change-icon-btn,.send-request-button,.accept-button,.add-friend-button,.requirement-modal-button,.quest-reward-ok,.send-button{background:var(--brass);color:var(--felt-deep);border:1px solid var(--brass-hi);border-radius:var(--radius-control);font:700 var(--text-md) / 1.1 var(--font-ui);box-shadow:none;text-shadow:none}.shop-buy-btn:hover:not(:disabled),.pack-buy-btn:hover:not(:disabled),.change-icon-btn:hover:not(:disabled),.send-request-button:hover:not(:disabled),.accept-button:hover:not(:disabled),.add-friend-button:hover:not(:disabled),.requirement-modal-button:hover:not(:disabled),.quest-reward-ok:hover:not(:disabled),.send-button:hover:not(:disabled){background:var(--brass-hi);transform:none;box-shadow:none}.pack-info-btn,.cancel-button,.profile-tool-btn,.favorite-button,.tooltip-action{background:transparent;color:var(--bone);border:1px solid var(--brass);border-radius:var(--radius-control);font-family:var(--font-ui);box-shadow:none;text-shadow:none}.pack-info-btn:hover:not(:disabled),.cancel-button:hover:not(:disabled),.profile-tool-btn:hover:not(:disabled),.favorite-button:hover:not(:disabled),.tooltip-action:hover:not(:disabled){background:var(--leather);transform:none;box-shadow:none}.reject-button,.remove-friend-action{background:transparent;color:var(--ember-hi);border:1px solid var(--ember);border-radius:var(--radius-control);box-shadow:none}.reject-button:hover:not(:disabled),.remove-friend-action:hover:not(:disabled){background:var(--ember);color:var(--bone);transform:none}.tooltip-action{display:flex;align-items:center;gap:var(--space-2)}.tooltip-action:disabled,.tooltip-action.disabled{opacity:.5;cursor:not-allowed}.accept-button,.reject-button{display:inline-flex;align-items:center;justify-content:center;padding:0;border-radius:var(--radius-control)}.accept-button svg,.reject-button svg{flex-shrink:0}.accept-button{background:var(--verdigris);border:1px solid var(--verdigris)}.accept-button:hover:not(:disabled){background:var(--verdigris);filter:brightness(1.15);transform:none}.reject-button:hover:not(:disabled){transform:none}button:focus-visible{outline:var(--focus-outline);outline-offset:2px}.add-friend-input,.message-input,.search-input,.filter-dropdown,.sort-dropdown{background:var(--felt-deep);color:var(--bone);border:1px solid var(--brass-dim);border-radius:var(--radius-control);font-family:var(--font-ui);box-shadow:inset 0 2px 4px var(--shade)}.add-friend-input:focus-visible,.message-input:focus-visible,.search-input:focus-visible,.filter-dropdown:focus-visible,.sort-dropdown:focus-visible{outline:var(--focus-outline);outline-offset:1px;border-color:var(--brass-hi)}.shop-message{background:var(--leather);color:var(--bone);border:1px solid var(--brass-dim);border-left-width:4px;border-radius:var(--radius-control);text-shadow:none}.shop-message.error{border-color:var(--ember)}.shop-message.success{border-color:var(--verdigris)}.shop-hero-purchased-overlay{background:color-mix(in srgb,var(--felt-deep) 70%,transparent)}.purchased-text{font:400 var(--text-xl) / 1 var(--font-display);color:var(--brass-hi);text-shadow:none}.empty-icon{color:var(--verdigris)}.favorite-star,.quest-reward-star{fill:currentColor;color:var(--brass-hi)}.icon-lock{color:var(--bone-dim)}.requirement-warning-icon{color:var(--ember-hi)}.quest-reward-check{color:var(--verdigris)}@media (prefers-reduced-motion: reduce){.shop-buy-btn,.pack-buy-btn,.send-button,.quest-reward-ok{transition:none}}.timer-icon{color:var(--brass-hi)}.pack-title-overlay{font-family:var(--font-display);font-weight:400;color:var(--bone);border-color:var(--brass-dim);letter-spacing:.02em}@font-face{font-family:IM Fell English;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/im-fell-english-latin-400-normal-248300df.woff2) format("woff2"),url(/assets/im-fell-english-latin-400-normal-8541cb19.woff) format("woff");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:IM Fell English;font-style:italic;font-display:swap;font-weight:400;src:url(/assets/im-fell-english-latin-400-italic-8fc67857.woff2) format("woff2"),url(/assets/im-fell-english-latin-400-italic-01d129b4.woff) format("woff");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Alegreya Sans;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/alegreya-sans-cyrillic-ext-400-normal-a524ea27.woff2) format("woff2"),url(/assets/alegreya-sans-cyrillic-ext-400-normal-5a95ba80.woff) format("woff");unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Alegreya Sans;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/alegreya-sans-cyrillic-400-normal-76bb1525.woff2) format("woff2"),url(/assets/alegreya-sans-cyrillic-400-normal-6060d48c.woff) format("woff");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:Alegreya Sans;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/alegreya-sans-greek-ext-400-normal-b8b3e42a.woff2) format("woff2"),url(/assets/alegreya-sans-greek-ext-400-normal-a98b676d.woff) format("woff");unicode-range:U+1F00-1FFF}@font-face{font-family:Alegreya Sans;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/alegreya-sans-greek-400-normal-04d76341.woff2) format("woff2"),url(/assets/alegreya-sans-greek-400-normal-670da430.woff) format("woff");unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:Alegreya Sans;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/alegreya-sans-vietnamese-400-normal-14b3ac7d.woff2) format("woff2"),url(/assets/alegreya-sans-vietnamese-400-normal-a62903c1.woff) format("woff");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Alegreya Sans;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/alegreya-sans-latin-ext-400-normal-c76008bc.woff2) format("woff2"),url(/assets/alegreya-sans-latin-ext-400-normal-fa7efb1d.woff) format("woff");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Alegreya Sans;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/alegreya-sans-latin-400-normal-b2a5a35a.woff2) format("woff2"),url(/assets/alegreya-sans-latin-400-normal-ead93e74.woff) format("woff");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Alegreya Sans;font-style:normal;font-display:swap;font-weight:500;src:url(/assets/alegreya-sans-cyrillic-ext-500-normal-a14bf231.woff2) format("woff2"),url(/assets/alegreya-sans-cyrillic-ext-500-normal-69376750.woff) format("woff");unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Alegreya Sans;font-style:normal;font-display:swap;font-weight:500;src:url(/assets/alegreya-sans-cyrillic-500-normal-0c34b191.woff2) format("woff2"),url(/assets/alegreya-sans-cyrillic-500-normal-13d975d7.woff) format("woff");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:Alegreya Sans;font-style:normal;font-display:swap;font-weight:500;src:url(/assets/alegreya-sans-greek-ext-500-normal-3309b6d6.woff2) format("woff2"),url(/assets/alegreya-sans-greek-ext-500-normal-19c9be99.woff) format("woff");unicode-range:U+1F00-1FFF}@font-face{font-family:Alegreya Sans;font-style:normal;font-display:swap;font-weight:500;src:url(/assets/alegreya-sans-greek-500-normal-f789069e.woff2) format("woff2"),url(/assets/alegreya-sans-greek-500-normal-05357f51.woff) format("woff");unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:Alegreya Sans;font-style:normal;font-display:swap;font-weight:500;src:url(/assets/alegreya-sans-vietnamese-500-normal-3fb778de.woff2) format("woff2"),url(/assets/alegreya-sans-vietnamese-500-normal-f19aa486.woff) format("woff");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Alegreya Sans;font-style:normal;font-display:swap;font-weight:500;src:url(/assets/alegreya-sans-latin-ext-500-normal-578e5203.woff2) format("woff2"),url(/assets/alegreya-sans-latin-ext-500-normal-fe1ec289.woff) format("woff");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Alegreya Sans;font-style:normal;font-display:swap;font-weight:500;src:url(/assets/alegreya-sans-latin-500-normal-55b61d22.woff2) format("woff2"),url(/assets/alegreya-sans-latin-500-normal-cf92dcb8.woff) format("woff");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Alegreya Sans;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/alegreya-sans-cyrillic-ext-700-normal-b210cfb6.woff2) format("woff2"),url(/assets/alegreya-sans-cyrillic-ext-700-normal-bd81cbd7.woff) format("woff");unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Alegreya Sans;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/alegreya-sans-cyrillic-700-normal-21a8f694.woff2) format("woff2"),url(/assets/alegreya-sans-cyrillic-700-normal-5571d646.woff) format("woff");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:Alegreya Sans;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/alegreya-sans-greek-ext-700-normal-947530a1.woff2) format("woff2"),url(/assets/alegreya-sans-greek-ext-700-normal-a120256e.woff) format("woff");unicode-range:U+1F00-1FFF}@font-face{font-family:Alegreya Sans;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/alegreya-sans-greek-700-normal-cd667677.woff2) format("woff2"),url(/assets/alegreya-sans-greek-700-normal-097318dc.woff) format("woff");unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:Alegreya Sans;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/alegreya-sans-vietnamese-700-normal-960cf8c7.woff2) format("woff2"),url(/assets/alegreya-sans-vietnamese-700-normal-d9da24b5.woff) format("woff");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Alegreya Sans;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/alegreya-sans-latin-ext-700-normal-8f289f33.woff2) format("woff2"),url(/assets/alegreya-sans-latin-ext-700-normal-7cd21f5b.woff) format("woff");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Alegreya Sans;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/alegreya-sans-latin-700-normal-5acd19a5.woff2) format("woff2"),url(/assets/alegreya-sans-latin-700-normal-0f0925ab.woff) format("woff");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--felt: #101b18;--felt-deep: #0b1311;--walnut: #241a14;--leather: #33261d;--leather-hi: #40322a;--brass: #b08a45;--brass-hi: #cfa95f;--brass-dim: #6e5629;--bone: #e6dfcf;--bone-dim: #a89f8c;--ember: #c4482f;--ember-hi: #dc6246;--verdigris: #5fa08a;--scrim: rgb(5 9 8 / .72);--shade: rgb(0 0 0 / .45);--felt-weave: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");--felt-surface: radial-gradient(ellipse at 50% 28%, color-mix(in srgb, var(--verdigris) 9%, var(--felt)), var(--felt) 58%, var(--felt-deep)), var(--felt-weave), var(--felt);--font-display: "IM Fell English", Georgia, "Times New Roman", serif;--font-ui: "Alegreya Sans", "Segoe UI", system-ui, sans-serif;--text-xs: .875rem;--text-sm: 1rem;--text-md: 1.125rem;--text-lg: 1.25rem;--text-xl: 1.625rem;--text-2xl: 2.25rem;--text-3xl: 3.25rem;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-7: 2rem;--space-8: 2.5rem;--space-9: 3.5rem;--radius-control: 4px;--radius-panel: 8px;--shadow-panel: 0 18px 40px var(--shade);--inset-frame: inset 0 0 0 4px var(--walnut), inset 0 0 0 5px var(--brass-dim);--focus-outline: 2px solid var(--brass-hi);--ease: cubic-bezier(.2, .7, .2, 1);--dur: .16s}*{margin:0;padding:0;box-sizing:border-box}.ui-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:2.5rem;padding:0 var(--space-5);font:700 var(--text-md) / 1 var(--font-ui);color:var(--bone);background:var(--leather);border:1px solid var(--brass-dim);border-radius:var(--radius-control);cursor:pointer;transition:background var(--dur) var(--ease),border-color var(--dur) var(--ease),color var(--dur) var(--ease)}.ui-btn:hover:not(:disabled){background:var(--leather-hi);border-color:var(--brass);transform:none;box-shadow:none}.ui-btn:active:not(:disabled){transform:translateY(1px)}.ui-btn:focus-visible{outline:var(--focus-outline);outline-offset:2px}.ui-btn:disabled{opacity:.5;cursor:not-allowed}.ui-btn--primary{background:var(--brass);border-color:var(--brass-hi);color:var(--felt-deep)}.ui-btn--primary:hover:not(:disabled){background:var(--brass-hi);border-color:var(--brass-hi)}.ui-btn--danger{background:transparent;border-color:var(--ember);color:var(--ember-hi)}.ui-btn--danger:hover:not(:disabled){background:var(--ember);border-color:var(--ember);color:var(--bone)}.ui-btn--quiet{background:transparent;border-color:transparent;color:var(--bone-dim)}.ui-btn--quiet:hover:not(:disabled){background:var(--leather);border-color:transparent;color:var(--bone)}.ui-btn--sm{min-height:2rem;padding:0 var(--space-3);font-size:var(--text-sm)}.ui-btn--block{width:100%}.ui-field{text-align:left;display:flex;flex-direction:column;gap:var(--space-2)}.ui-label{font:700 var(--text-sm) / 1.2 var(--font-ui);color:var(--bone)}.ui-hint{font-size:var(--text-xs);line-height:1.35;color:var(--bone-dim)}.ui-input{width:100%;min-height:2.75rem;padding:0 var(--space-3);font:400 var(--text-md) / 1.2 var(--font-ui);color:var(--bone);background:var(--felt-deep);border:1px solid var(--brass-dim);border-radius:var(--radius-control);box-shadow:inset 0 2px 4px var(--shade);transition:border-color var(--dur) var(--ease)}.ui-input::placeholder{color:var(--bone-dim);opacity:.7}.ui-input:hover:not(:disabled){border-color:var(--brass)}.ui-input:focus-visible{outline:var(--focus-outline);outline-offset:1px;border-color:var(--brass-hi)}.ui-input:disabled{opacity:.55;cursor:not-allowed}.ui-check{display:flex;align-items:center;gap:var(--space-3);font-size:var(--text-sm);color:var(--bone);cursor:pointer}.ui-check input{width:1.125rem;height:1.125rem;margin:0;padding:0;accent-color:var(--brass)}.ui-check input:focus-visible{outline:var(--focus-outline);outline-offset:2px}.ui-panel{background:var(--walnut);border:1px solid var(--brass-dim);border-radius:var(--radius-panel);box-shadow:var(--shadow-panel),var(--inset-frame);color:var(--bone)}.ui-badge{display:inline-flex;align-items:center;gap:var(--space-1);padding:.125rem var(--space-2);font:700 var(--text-xs) / 1.4 var(--font-ui);color:var(--bone);background:var(--leather);border:1px solid var(--brass-dim);border-radius:var(--radius-control)}.ui-pill{display:inline-flex;align-items:baseline;gap:var(--space-2);padding:var(--space-1) var(--space-3);background:var(--felt-deep);border:1px solid var(--brass-dim);border-radius:999px;color:var(--bone);font:700 var(--text-md) / 1 var(--font-ui);font-variant-numeric:tabular-nums}.ui-tab{padding:var(--space-2) var(--space-4);font:700 var(--text-md) / 1 var(--font-ui);color:var(--bone-dim);background:transparent;border:1px solid transparent;border-bottom:2px solid transparent;border-radius:var(--radius-control) var(--radius-control) 0 0}.ui-tab:hover{color:var(--bone);background:var(--leather);transform:none;box-shadow:none}.ui-tab[aria-selected=true]{color:var(--bone);border-bottom-color:var(--brass-hi);background:var(--leather)}.ui-tab:focus-visible{outline:var(--focus-outline);outline-offset:2px}.ui-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:var(--space-4);background:var(--scrim)}.ui-modal{position:relative;width:100%;max-width:32rem;max-height:100%;overflow-y:auto;padding:var(--space-6);background:var(--walnut);border:1px solid var(--brass-dim);border-radius:var(--radius-panel);box-shadow:var(--shadow-panel),var(--inset-frame);color:var(--bone)}.ui-hpbar{height:.5rem;background:var(--felt-deep);border:1px solid var(--brass-dim);border-radius:999px;overflow:hidden}.ui-hpbar__fill{height:100%;background:var(--verdigris);transition:width .3s var(--ease)}.ui-hpbar--foe .ui-hpbar__fill{background:var(--ember)}.ui-notice{display:flex;gap:var(--space-3);padding:var(--space-3) var(--space-4);font-size:var(--text-sm);line-height:1.4;color:var(--bone);background:var(--leather);border:1px solid var(--brass-dim);border-left-width:4px;border-radius:var(--radius-control);overflow-wrap:anywhere;white-space:pre-line}.ui-notice svg{flex-shrink:0;margin-top:.125rem}.ui-notice--error{border-color:var(--ember)}.ui-notice--error svg{color:var(--ember-hi)}.ui-notice--success{border-color:var(--verdigris)}.ui-notice--success svg{color:var(--verdigris)}.ui-notice--info svg{color:var(--brass-hi)}.ui-spinner{display:inline-block;width:1rem;height:1rem;border:2px solid var(--brass-dim);border-top-color:currentColor;border-radius:50%;animation:ui-spin .8s linear infinite}@keyframes ui-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){.ui-spinner{animation:none}.ui-btn,.ui-input,.ui-hpbar__fill{transition:none}}:root{--image-base-url: "http://localhost:3001"}html{font-size:16px}@media (max-width: 1920px){html{font-size:16px}}@media (max-width: 1600px){html{font-size:15px}}@media (max-width: 1366px){html{font-size:14px}}@media (max-width: 1024px){html{font-size:13px}}@media (max-width: 768px){html{font-size:12px}}@media (max-width: 480px){html{font-size:11px}}body{margin:0;font-family:var(--font-ui);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--felt-surface);color:var(--bone);font-variant-numeric:lining-nums;min-height:100vh}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}*{box-sizing:border-box}button{cursor:pointer;border:none;border-radius:4px;padding:8px 16px;font-size:14px;transition:all .2s ease}button:hover{transform:translateY(-1px);box-shadow:0 4px 8px #0003}button:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none}input{border:1px solid #ccc;border-radius:4px;padding:8px 12px;font-size:14px}input:focus{outline:none;border-color:var(--brass-hi);box-shadow:0 0 0 2px #007bff40}