.sxs-tier-list{width:100%;max-width:100%;margin:0 auto;padding:1rem}.sxs-layout{display:grid;grid-template-columns:700px 1fr;gap:1.5rem;align-items:start;width:100%}.sxs-layout.collapsed{grid-template-columns:auto 1fr}.sxs-left{position:sticky;top:calc(60px + 1rem);align-self:start}.sxs-panel{max-height:calc(100vh - 120px);overflow-y:auto;overflow-x:hidden}.sxs-panel::-webkit-scrollbar{width:8px}.sxs-panel::-webkit-scrollbar-track{background:#0f1419}.sxs-panel::-webkit-scrollbar-thumb{background:#2a3038;border-radius:4px}.sxs-layout.collapsed .sxs-panel{display:none}.sxs-right{min-width:0}.sxs-toggle-btn{width:100%;margin-bottom:1rem;padding:.75rem 1rem;background-color:transparent;border:2px solid #22282f;color:#fff;font-size:1.1rem;font-weight:500;cursor:pointer;display:flex;align-items:center;justify-content:flex-start;gap:.6rem;transition:background-color .25s linear}.sxs-toggle-btn:hover{background-color:#22282f}.sxs-toggle-btn i{font-size:1.3rem}.sxs-layout.collapsed .sxs-toggle-btn{width:auto;flex-direction:column;gap:.75rem;padding:.85rem .6rem}.sxs-layout.collapsed .sxs-toggle-btn span{writing-mode:vertical-rl;letter-spacing:.05em}.sxs-tier-list .toggle-kbd{display:inline-flex;align-items:center;justify-content:center;font-family:inherit;font-size:.85rem;font-weight:700;line-height:1;background:#ffffff14;border:1px solid rgba(255,255,255,.25);padding:.3em .55em;color:#fff}.tier-controls-bar{display:flex;justify-content:center;gap:.5rem;flex-wrap:wrap;margin-bottom:1.5rem}.sxs-tier-list .tier-btn{background-color:#202442;color:#fff;border:none;padding:.5rem 1rem;cursor:pointer;font-size:.9rem;transition:background-color .2s}.sxs-tier-list .tier-btn:hover{background-color:#14181d}.sxs-tier-list .tier-container{margin-bottom:1rem}.sxs-tier-list .tier-row{display:flex;margin-bottom:.75rem;min-height:115px}.sxs-tier-list .tier-label{min-width:150px;width:150px;display:flex;flex-direction:column;justify-content:center;align-items:center;font-weight:800;font-size:1.8rem;color:#000;position:relative;padding:.5rem;font-family:inherit}.sxs-tier-list .tier-name-input{background:none;border:none;color:#000;font-weight:800;font-size:1.8rem;text-align:center;width:100%;margin:auto 0;transition:font-size .2s,height .2s;overflow:hidden;resize:none;padding:0;min-height:auto;display:block;font-family:inherit}.sxs-tier-list .tier-name-input:focus{outline:2px solid rgba(255,255,255,.5)}.sxs-tier-list .tier-actions{position:absolute;top:.25rem;left:.25rem;right:.25rem;display:flex;justify-content:space-between;opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s}.sxs-tier-list .tier-label:hover .tier-actions{opacity:1;visibility:visible}.sxs-tier-list .tier-move-actions{position:absolute;bottom:.25rem;left:0;right:0;display:flex;justify-content:center;gap:.25rem;opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s}.sxs-tier-list .tier-label:hover .tier-move-actions{opacity:1;visibility:visible}.sxs-tier-list .tier-action-btn{background:#0000004d;border:none;color:#fff;cursor:pointer;padding:.25rem;font-size:.8rem;transition:background .2s}.sxs-tier-list .tier-action-btn:hover{background:#0009}.sxs-tier-list .tier-items{flex:1;display:flex;flex-wrap:wrap;align-content:flex-start;gap:.4rem;padding:.5rem;min-height:115px;background-color:#0f1419;border:2px dashed #22282f;margin-left:.5rem;transition:background .2s,border-color .2s;position:relative}.sxs-tier-list .tier-items.drag-over{background:#4caf5014;border-color:#4caf50}.sxs-tier-list .tier-add-hint{color:#444;font-style:italic;width:100%;height:100%;text-align:center;align-self:center;font-size:.85rem;display:flex;align-items:center;justify-content:center;gap:.4rem;pointer-events:none}.sxs-tier-list .tier-items:has(.sxs-tier-item) .tier-add-hint{display:none}.sxs-tier-item{display:flex;flex-direction:column;align-items:center;width:100px;cursor:grab;transition:transform .15s,opacity .15s;padding:.2rem}.sxs-tier-item:hover{transform:scale(1.07)}.sxs-tier-item.dragging{opacity:.35;cursor:grabbing}.tier-item-icon{width:80px;height:80px;object-fit:contain;border:3px solid transparent;border-radius:50%;transition:border-color .2s}.sxs-tier-item:hover .tier-item-icon{border-color:#ebed63}.tier-item-name{font-size:.75rem;text-align:center;color:#ddd;margin-top:.2rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.sxs-tab-navigation{display:flex;justify-content:center;margin-top:1rem;margin-bottom:0;border-bottom:2px solid #22282f}.sxs-tab-btn{background:transparent;color:#888;border:none;padding:1rem 2rem;cursor:pointer;font-size:1rem;font-weight:500;transition:all .3s ease;border-bottom:3px solid transparent;margin-bottom:-2px}.sxs-tab-btn:hover{color:#fff;background:#2024424d}.sxs-tab-btn.active{color:#fff;border-bottom-color:#ebed63;background:#20244280}.sxs-panel .sxs-tab-navigation{margin-top:0}.sxs-panel .sxs-tab-btn{flex:1}.sxs-pool-section{background:#14181d;border:1px solid #22282f;border-top:none;padding:1rem}.pool-filters-bar{display:flex;flex-wrap:wrap;gap:.5rem;align-items:flex-start;margin-bottom:1rem}.pool-search-input{background:#14181d;border:1px solid #22282f;color:#fff;padding:0 1rem;font-size:.95rem;height:50px;flex:1;min-width:180px}.pool-search-input:focus{outline:none;border-color:#ebed63}#sxs-skill-pool-filters{display:flex;flex-wrap:wrap;gap:.5rem;flex:2;min-width:0}.sxs-pool-dropdown{position:relative;flex:1;min-width:160px}.sxs-dropdown-button{height:50px;width:100%;padding:.75rem 1rem;background-color:#14181d;border:1px solid #22282f;color:#fff;font-size:.95rem;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:.5rem}.sxs-dropdown-button:hover{border-color:#3a3f6a}.sxs-dropdown-button:focus{outline:none;border-color:#ebed63}.sxs-dropdown-selected{display:flex;align-items:center;gap:.5rem;flex:1;text-align:left}.sxs-dropdown-menu{position:absolute;top:100%;left:0;width:100%;background:#14181d;border:1px solid #22282f;border-top:none;max-height:280px;overflow-y:auto;z-index:1000;display:none}.sxs-dropdown-menu.active{display:block}.sxs-dropdown-item{padding:.75rem 1rem;cursor:pointer;display:flex;align-items:center;gap:.5rem;color:#fff}.sxs-dropdown-item:hover{background-color:#202442}.sxs-dropdown-search-wrapper{padding:6px;border-bottom:1px solid #22282f}.sxs-dropdown-search-input{width:100%;box-sizing:border-box;padding:5px 8px;background:#0f1419;border:1px solid #22282f;color:#fff;font-size:.85rem;outline:none}.sxs-dropdown-search-input:focus{border-color:#ebed63}.sxs-dropdown-icon{width:24px;height:24px;object-fit:contain}.sxs-dropdown-selected .sxs-dropdown-icon{width:20px;height:20px}.sxs-type-badge{display:inline-block;padding:.15rem .5rem;font-size:.8rem;font-weight:600;border-radius:2px}.sxs-type-badge.technique{background:#ebed6326;color:#ebed63;border:1px solid #ebed63}.sxs-type-badge.charm{background:#64b5f626;color:#64b5f6;border:1px solid #64b5f6}.pool-grid{display:flex;flex-wrap:wrap;gap:.5rem;min-height:80px;padding:.25rem;border:2px dashed #22282f;background:#0f1419;transition:background .2s,border-color .2s}.pool-grid.drag-over{background:#f4433612;border-color:#f44336}.pool-item{display:flex;flex-direction:column;align-items:center;width:100px;cursor:grab;transition:transform .15s,opacity .15s;padding:.2rem}.pool-item:hover{transform:scale(1.07)}.pool-item.dragging{opacity:.35;cursor:grabbing}.pool-item-icon{width:80px;height:80px;object-fit:contain;border:3px solid transparent;border-radius:50%;transition:border-color .2s}.pool-item:hover .pool-item-icon{border-color:#ebed63}.pool-item-name{font-size:.75rem;text-align:center;color:#aaa;margin-top:.2rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.sxs-color-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#000c;display:flex;justify-content:center;align-items:center;z-index:1000}.sxs-color-modal-content{background:#14181d;border:1px solid #22282f;padding:1.5rem;max-width:400px;width:90%}.sxs-color-modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;border-bottom:1px solid #22282f;padding-bottom:1rem}.sxs-color-modal-header h4{color:#fff;margin:0;font-weight:300}.sxs-close-modal{background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer;width:30px;height:30px;display:flex;align-items:center;justify-content:center}.sxs-close-modal:hover{background:#ffffff1a}.sxs-color-picker-container{margin-bottom:1.5rem}#sxs-color-picker{width:100%;height:50px;border:none;cursor:pointer;margin-bottom:1rem}.sxs-color-presets{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem}.sxs-color-preset{width:40px;height:40px;cursor:pointer;border:2px solid transparent;transition:border-color .2s}.sxs-color-preset:hover{border-color:#fff}.sxs-color-modal-actions{display:flex;gap:.5rem;justify-content:flex-end}@media (max-width: 1024px){.sxs-layout,.sxs-layout.collapsed{grid-template-columns:1fr}.sxs-left{position:static}.sxs-panel{max-height:none;overflow:visible}.sxs-layout.collapsed .sxs-panel{display:block}.sxs-toggle-btn{display:none}}@media (max-width: 768px){.sxs-tab-btn{padding:.75rem 1rem;font-size:.9rem}.sxs-tier-list .tier-row{flex-direction:column}.sxs-tier-list .tier-label{width:100%;min-height:60px;flex-direction:row;justify-content:space-between}.sxs-tier-list .tier-items{margin-left:0;margin-top:.25rem}.pool-filters-bar,#sxs-skill-pool-filters{flex-direction:column}}
