.database-controls-container{background:var(--ss-bg-secondary);border-radius:12px;border:1px solid var(--ss-border);padding:1.5rem;margin-bottom:2rem}.controls-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:1px solid var(--ss-border-subtle)}.controls-title{margin:0;font-size:1.3rem;color:var(--ss-text-primary);font-weight:600}.database-controls-container .global-clear-container{margin:0;padding:0}.global-clear-btn{display:flex;align-items:center;gap:.5rem;background:linear-gradient(135deg,var(--ss-danger),var(--ss-danger-hover));color:#fff;border:none;padding:.5rem 1rem;border-radius:6px;font-size:.875rem;font-weight:500;cursor:pointer;white-space:nowrap}.clear-icon{font-size:1rem;font-weight:700}.controls-content{display:flex;flex-direction:column;gap:1.5rem}.database-controls-container .character-filter-bar,.database-controls-container .ss-sort-component{background:transparent;border:none;padding:0;margin:0;border-radius:0}.stats-overview{background:var(--ss-bg-secondary);border-radius:12px;padding:1.5rem;border:1px solid var(--ss-border);margin-bottom:1.5rem}.stats-overview h2{margin:0 0 1rem;font-size:1.3rem;color:var(--ss-text-primary);text-align:center}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem}.stat-card{background:var(--ss-bg-primary);padding:1rem;border-radius:8px;text-align:center;border:1px solid var(--ss-border)}.stat-number{font-size:2rem;font-weight:700;color:var(--ss-primary);margin-bottom:.25rem}.stats-overview .stat-label{font-size:.9rem;color:var(--ss-text-secondary);font-weight:500}.database-header{text-align:center;margin-bottom:1.5rem}.database-header h2{margin:0 0 .5rem;font-size:1.5rem;color:var(--ss-text-primary)}.database-description{color:var(--ss-text-secondary);font-size:1rem;margin:0}.character-table-container{background:var(--ss-bg-secondary);border-radius:12px;overflow:hidden;margin-top:1rem}.character-table{width:100%;border-collapse:collapse;font-size:.875rem}.character-table th{background:var(--ss-bg-primary);padding:.75rem .5rem;text-align:left;font-weight:600;color:var(--ss-text-primary);border-bottom:2px solid var(--ss-border);position:sticky;top:0;z-index:10}.character-table td{padding:.75rem .5rem;border-bottom:1px solid var(--ss-border);color:var(--ss-text-secondary);vertical-align:middle}.character-table tbody tr:last-child td{border-bottom:none}.character-name{font-family:Space Grotesk,-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,sans-serif;font-weight:600;font-size:1.1rem;color:var(--ss-text-primary);letter-spacing:-.01em}.character-image-container{width:75px;height:75px;border-radius:8px;border:1px solid var(--ss-primary);overflow:hidden;display:flex;align-items:center;justify-content:center}.character-image-container img{width:100%;height:100%;object-fit:cover;border-radius:8px}.character-image-desktop{width:75px;height:75px;border-radius:8px;border:1px solid var(--ss-primary);overflow:hidden;display:flex;align-items:center;justify-content:center}.character-image-mobile{width:80px;height:80px;border-radius:8px;border:1px solid var(--ss-primary);overflow:hidden;display:flex;align-items:center;justify-content:center}.character-image-detail{flex-shrink:0;width:300px;height:300px;border-radius:12px;overflow:hidden;border:3px solid var(--ss-primary);display:flex;align-items:center;justify-content:center}.character-image-detail img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}.potential-image-detail{flex-shrink:0;width:300px;height:300px;border-radius:12px;overflow:hidden;border:3px solid var(--ss-primary);display:flex;align-items:center;justify-content:center}.potential-image-detail img{width:100%;height:100%;object-fit:cover;display:block}.element-icon-container{width:32px;height:32px;border-radius:6px;overflow:hidden;display:flex;align-items:center;justify-content:center;flex-shrink:0}.element-icon-desktop{width:40px;height:40px;border-radius:6px;border:1px solid var(--ss-border);overflow:hidden;display:flex;align-items:center;justify-content:center}.element-icon-mobile{width:32px;height:32px;border-radius:50%;background:var(--ss-bg-secondary);border:2px solid var(--ss-bg-secondary);display:flex;align-items:center;justify-content:center;z-index:2;position:absolute;bottom:-5px;right:-5px}.element-icon-detail{width:24px;height:24px;border-radius:4px;overflow:hidden;display:flex;align-items:center;justify-content:center;flex-shrink:0}.character-filter-bar{background:var(--ss-bg-secondary);border-radius:12px;padding:1.5rem;border:1px solid var(--ss-border);margin-bottom:2rem}.filter-section{margin-bottom:1.5rem}.filter-section:last-child{margin-bottom:0}.filter-title{margin:0 0 1rem;font-size:1.1rem;color:var(--ss-text-primary)}.filter-controls{display:flex;gap:.5rem;flex-wrap:wrap}.filter-select{background:var(--ss-bg-primary);color:var(--ss-text-primary);border:1px solid var(--ss-border);padding:.5rem;border-radius:6px;font-size:.9rem}.search-input{background:var(--ss-bg-primary);color:var(--ss-text-primary);border:1px solid var(--ss-border);padding:.5rem;border-radius:6px;font-size:.9rem;width:100%;max-width:300px}.ss-sort-component{margin-bottom:1rem}.sort-section{background:var(--ss-bg-secondary);border-radius:12px;padding:1rem;border:1px solid var(--ss-border);margin-bottom:.75rem}.sort-section:last-child{margin-bottom:0}.sort-title{font-size:1rem;font-weight:600;margin:0 0 .75rem;color:var(--ss-text-primary)}.sort-controls{display:flex;gap:.5rem;flex-wrap:wrap}.sort-btn,.reset-btn{background:var(--ss-bg-primary);color:var(--ss-text-primary);border:1px solid var(--ss-border);padding:.5rem 1rem;border-radius:6px;cursor:pointer;font-size:.9rem;font-weight:500}.sort-btn.active{background:var(--ss-primary);color:var(--ss-text-primary);border-color:var(--ss-primary)}.reset-btn{background:var(--ss-error);color:var(--ss-text-primary);border:none}.sort-arrow{font-size:.8rem;font-weight:700;margin-left:.25rem;opacity:.8}.sort-btn.active .sort-arrow{opacity:1}.character-cards-container{display:none;grid-template-columns:1fr;gap:1.25rem;margin-top:1rem}.character-card{background:var(--ss-bg-secondary);border-radius:16px;padding:1.25rem;border:1px solid var(--ss-border);position:relative;overflow:hidden}.mobile-card-header{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}.mobile-card-title-group{flex:1;display:flex;flex-direction:column;gap:.5rem}.mobile-card-title-group .character-name{font-size:1.25rem;font-weight:700;color:var(--ss-text-primary);margin:0;line-height:1.2}.character-rarity{display:flex;align-items:center}.character-rarity .rarity-badge{font-size:.875rem;padding:.25rem .75rem;border-radius:12px;font-weight:600}.mobile-card-section{margin-bottom:1rem}.mobile-card-section:last-child{margin-bottom:0}.section-title{font-size:.75rem;font-weight:600;color:var(--ss-text-secondary);text-transform:uppercase;letter-spacing:.1em;margin-bottom:.75rem;opacity:.8}.mobile-card-divider{height:1px;background:linear-gradient(90deg,transparent,var(--ss-border-subtle),transparent);margin:1rem 0}.mobile-card-primary-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem}.mobile-card-primary-stats .stat-item{display:flex;flex-direction:column;align-items:center;text-align:center;padding:.75rem .5rem;background:var(--ss-bg-primary);border-radius:8px;border:1px solid var(--ss-white-opacity-05)}.mobile-card-primary-stats .stat-value{font-size:1.125rem;font-weight:700;color:var(--ss-primary);margin-bottom:.25rem}.mobile-card-primary-stats .stat-label{font-size:.75rem;color:var(--ss-text-secondary);font-weight:600;text-transform:uppercase;letter-spacing:.05em}.mobile-card-metadata{padding:.5rem 0}.metadata-badges{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.metadata-badges .element-badge{display:inline-flex;align-items:center;gap:.375rem;font-size:.875rem;padding:.375rem .75rem;border-radius:20px;font-weight:500;border:1px solid var(--ss-border)}.metadata-badges .element-badge img{width:16px;height:16px;object-fit:contain}.metadata-badges .role-badge,.metadata-badges .faction-badge{font-size:.8rem;padding:.375rem .75rem;border-radius:20px;font-weight:500;background:var(--ss-bg-primary);border:1px solid var(--ss-border)}.metadata-badges .trekker-style-text{font-size:.8rem;padding:.375rem .75rem;border-radius:20px;font-weight:500;background:var(--ss-bg-primary);border:1px solid var(--ss-border);text-transform:capitalize}.character-table td .trekker-style-text{font-size:.8rem;font-weight:600;color:var(--ss-text-secondary);text-transform:capitalize}.mobile-card-advanced-stats{padding-top:.75rem;border-top:1px solid var(--ss-border-subtle)}.mobile-card-secondary-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}.mobile-card-secondary-stats .stat-item{display:flex;flex-direction:column;align-items:center;text-align:center;padding:.5rem;background:var(--ss-white-opacity-02);border-radius:6px}.mobile-card-secondary-stats .stat-value{font-size:1rem;font-weight:600;color:var(--ss-text-primary);margin-bottom:.25rem}.mobile-card-secondary-stats .stat-label{font-size:.7rem;color:var(--ss-text-secondary);font-weight:500;text-transform:uppercase;letter-spacing:.05em}.clickable-row,.clickable-card{cursor:pointer}.character-content{width:100%;max-width:1200px;margin:0 auto;padding:2rem 1rem}.character-header{display:flex;gap:2rem;align-items:flex-start;margin-bottom:3rem;padding:2rem;background:var(--ss-bg-secondary);border-radius:16px;border:1px solid var(--ss-border)}.character-basic-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:1.5rem}.character-details{flex:1;min-width:0}.character-meta{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}.element-badge-container{display:inline-flex;align-items:center;gap:.5rem}.character-icon-container{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:4px;background:var(--ss-white-opacity-05);border:1px solid var(--ss-border-subtle);overflow:hidden}.character-icon{width:100%;height:100%;object-fit:contain;object-position:center}.character-icon-container .character-icon{width:100%;height:100%;object-fit:contain;object-position:center;border-radius:2px}.character-icon-container .icon-fallback{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:var(--ss-border-subtle);color:var(--ss-text-secondary);font-size:12px;font-weight:700}@media (max-width: 1200px){.character-table-container{overflow-x:auto}.character-table{min-width:1200px}}@media (max-width: 1024px){.character-table{display:none}.character-cards-container{display:grid}.stats-grid{grid-template-columns:repeat(2,1fr);gap:.75rem}.stat-card{padding:.75rem}.stat-number{font-size:1.5rem}}@media (max-width: 768px){.controls-header{flex-direction:column;gap:1rem;align-items:stretch}.controls-title{text-align:center}.global-clear-btn{justify-content:center;padding:.75rem;font-size:1rem}.controls-content{gap:1rem}.character-content{padding:1rem}.character-header{flex-direction:column;gap:1.5rem;padding:1.5rem;margin-bottom:2rem}.character-basic-info{gap:1rem}.character-meta{justify-content:center;gap:.5rem}.element-badge-container{gap:.25rem}.character-image-container{width:70px;height:70px}.character-card{padding:1rem;margin-bottom:1rem}.mobile-card-header{gap:.75rem;margin-bottom:.75rem}.mobile-card-title-group .character-name{font-size:1.125rem}.character-rarity .rarity-badge{font-size:.75rem;padding:.2rem .5rem}.mobile-card-section{margin-bottom:.75rem}.section-title{font-size:.7rem;margin-bottom:.5rem}.mobile-card-primary-stats{grid-template-columns:repeat(3,1fr);gap:.5rem}.mobile-card-primary-stats .stat-item{padding:.5rem .25rem}.mobile-card-primary-stats .stat-value{font-size:1rem}.mobile-card-primary-stats .stat-label{font-size:.7rem}.metadata-badges{gap:.375rem}.metadata-badges .element-badge,.metadata-badges .role-badge,.metadata-badges .faction-badge,.metadata-badges .style-badge{font-size:.75rem;padding:.25rem .5rem}.mobile-card-secondary-stats{grid-template-columns:repeat(2,1fr);gap:.5rem}.mobile-card-secondary-stats .stat-item{padding:.375rem}.mobile-card-secondary-stats .stat-value{font-size:.875rem}.mobile-card-secondary-stats .stat-label{font-size:.65rem}.character-filter-bar{padding:1rem;margin-bottom:1rem}.filter-section{margin-bottom:1rem}.filter-title{font-size:1rem;margin-bottom:.75rem}.filter-controls{flex-direction:column;gap:.75rem}.sort-controls{flex-direction:column;gap:.75rem;justify-content:center}.search-input{max-width:100%;padding:.75rem;font-size:1rem;min-height:44px}.filter-select{padding:.75rem;font-size:1rem;min-height:44px}.sort-btn,.reset-btn{padding:.75rem 1rem;font-size:.9rem;min-height:44px;display:flex;align-items:center;justify-content:center}.sort-btn{font-size:.85rem;padding:.4rem .8rem}.stats-grid{grid-template-columns:1fr}.database-header h2{font-size:1.3rem}.database-description{font-size:.9rem}.potential-image-detail{width:120px;height:120px}}@media (max-width: 480px){.character-content{padding:.75rem}.character-header{padding:1rem;gap:1rem;margin-bottom:1.5rem}.character-basic-info{gap:.75rem}.character-meta{gap:.25rem}.character-image-container{width:65px;height:65px}.character-card{padding:.875rem}.mobile-card-header{gap:.5rem;margin-bottom:.75rem}.mobile-card-title-group .character-name{font-size:1rem}.character-rarity .rarity-badge{font-size:.7rem;padding:.2rem .5rem}.mobile-card-section{margin-bottom:.625rem}.section-title{font-size:.65rem;margin-bottom:.5rem}.mobile-card-primary-stats{grid-template-columns:repeat(3,1fr);gap:.375rem}.mobile-card-primary-stats .stat-item{padding:.5rem .25rem}.mobile-card-primary-stats .stat-value{font-size:.875rem}.mobile-card-primary-stats .stat-label{font-size:.65rem}.metadata-badges{gap:.25rem}.metadata-badges .element-badge,.metadata-badges .role-badge,.metadata-badges .faction-badge,.metadata-badges .style-badge{font-size:.7rem;padding:.25rem .5rem}.mobile-card-secondary-stats{grid-template-columns:repeat(2,1fr);gap:.375rem}.mobile-card-secondary-stats .stat-item{padding:.375rem}.mobile-card-secondary-stats .stat-value{font-size:.8rem}.mobile-card-secondary-stats .stat-label{font-size:.6rem}.character-filter-bar{padding:.75rem}.filter-title{font-size:.9rem;text-align:center}.filter-section{margin-bottom:.75rem}.search-input,.filter-select,.sort-btn,.reset-btn{padding:.6rem .75rem;font-size:.9rem}.sort-controls{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.sort-btn{font-size:.8rem;padding:.5rem .25rem}.reset-btn{grid-column:1 / -1}.potential-image-detail{width:100px;height:100px}}@media (hover: none){.clickable-row:active{background:var(--ss-white-opacity-08)}.clickable-card:active{background:var(--ss-border-subtle)}}