.rankings-grid{display:grid;grid-template-columns:1fr;gap:.5rem;margin-bottom:1rem}.ranking-card{background:var(--pico-card-background-color);border:1px solid var(--pico-border-color);border-radius:6px;padding:.5rem;display:flex;align-items:center;gap:.5rem;box-shadow:0 1px 3px rgba(0,0,0,.1);transition:all .2s ease}.ranking-card:hover{background:var(--pico-primary-background);border-color:var(--pico-primary);transform:translateY(-2px);box-shadow:0 4px 8px rgba(0,0,0,.15)}.rank-badge{display:flex;align-items:center;justify-content:center;width:32px;height:32px;min-width:32px;border-radius:50%;font-weight:bold;color:var(--pico-primary-inverse);font-size:.875rem;flex-shrink:0}.rank-1{background:var(--color-gold)}.rank-2{background:var(--color-silver)}.rank-3{background:var(--color-bronze)}.rank-other{background:var(--pico-primary)}.ranking-avatar{position:relative;width:48px;height:48px;min-width:48px;flex-shrink:0}.ranking-profile-picture{width:48px;height:48px;border-radius:50%;object-fit:cover;border:2px solid var(--pico-border-color)}.rank-badge-overlay{position:absolute;bottom:-4px;right:-4px;display:flex;align-items:center;justify-content:center;width:20px;height:20px;min-width:20px;border-radius:50%;font-weight:bold;color:var(--pico-primary-inverse);font-size:.7rem;border:2px solid var(--pico-background-color);box-shadow:0 2px 4px rgba(0,0,0,.2)}.rank-badge-overlay.rank-1{background:var(--color-gold)}.rank-badge-overlay.rank-2{background:var(--color-silver)}.rank-badge-overlay.rank-3{background:var(--color-bronze)}.rank-badge-overlay.rank-other{background:var(--pico-primary)}.ranking-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:.25rem}.ranking-username{font-weight:600;font-size:.9375rem;color:var(--pico-color);margin:0}.ranking-meta{display:flex;gap:.75rem;flex-wrap:wrap;font-size:.75rem;color:var(--pico-muted-color)}.ranking-meta-item{display:flex;align-items:center;gap:.25rem}.power-value{font-weight:bold;color:var(--pico-primary);font-size:.9375rem}.category-badge{display:inline-block;padding:.125rem .375rem;border-radius:3px;font-size:.75rem;background:var(--pico-secondary-background);color:var(--pico-secondary-inverse)}.filter-btn{padding:.375rem .75rem;border:1px solid var(--pico-primary);background:var(--pico-background-color);color:var(--pico-primary);border-radius:4px;cursor:pointer;text-decoration:none;transition:all .2s;font-size:.875rem}.filter-btn:hover,.filter-btn.active{background:var(--pico-primary-background);color:var(--pico-primary-inverse)}.filter-btn.loading{position:relative;pointer-events:none;opacity:.7}.filter-btn.loading::after{content:"";position:absolute;width:16px;height:16px;top:50%;left:50%;margin-left:-8px;margin-top:-8px;border:2px solid var(--pico-primary);border-top-color:transparent;border-radius:50%;animation:spin .6s linear infinite}.filter-btn.loading span{opacity:0}.no-rankings{text-align:center;padding:2rem 1rem;color:var(--pico-muted-color)}.note-box{margin-top:1rem;padding:.75rem;background:var(--pico-card-background-color);border-radius:6px;text-align:center;font-size:.8125rem}.note-box p{margin:0;color:var(--pico-muted-color)}.rankings-header{text-align:center;margin-bottom:1rem;padding:.5rem}.rankings-header h1{color:var(--pico-primary);margin-bottom:.25rem;font-size:1.5rem}.rankings-header p{font-size:.875rem;margin:0}.filters{display:flex;gap:.5rem;justify-content:center;margin-bottom:1rem;flex-wrap:wrap;padding:0 .25rem}.filter-select{padding:.5rem;border-radius:4px;border:1px solid var(--pico-border-color);background:var(--pico-background-color);color:var(--pico-color);font-size:.875rem;min-width:150px}.rankings-nav{display:flex;gap:.5rem;justify-content:center;margin-bottom:1.5rem;flex-wrap:wrap}.rankings-nav .nav-link{text-decoration:none}.rankings-nav .filter-btn.loading::after{border-color:var(--pico-primary-inverse);border-top-color:transparent}.calculation-summary{margin-top:2rem;padding:1.5rem;background:var(--pico-card-background-color);border-radius:8px;border:1px solid var(--pico-border-color)}.calculation-summary h2{margin-top:0;margin-bottom:1rem;color:var(--pico-primary);font-size:1.5rem}.calculation-summary>p{margin-bottom:1rem;line-height:1.6}.calculation-summary .formula-box{background:var(--pico-background-color);padding:1.25rem;border-radius:8px;margin:1.5rem 0;border-left:4px solid var(--pico-primary)}.calculation-summary .formula-box h3{margin:0 0 .75rem 0;font-size:1.1rem;color:var(--pico-primary)}.calculation-summary .formula-box p{margin:0;font-family:monospace;font-size:1rem;line-height:1.8}.calculation-summary .formula-box .formula-note{margin:.75rem 0 0 0;font-size:.9rem;color:var(--pico-muted-color)}.calculation-summary .section{margin-top:2rem}.calculation-summary .section h3{font-size:1.1rem;margin-bottom:1rem;color:var(--pico-color);display:flex;align-items:center;gap:.5rem}.calculation-summary .section h3 span{font-size:1.25rem}.calculation-summary .section>p{margin-bottom:1rem;font-size:.9rem;color:var(--pico-muted-color)}.calculation-summary table{width:100%;border-collapse:collapse;font-size:.9rem}.calculation-summary table th{padding:.75rem;text-align:left;border:1px solid var(--pico-border-color);background:var(--pico-primary-background)}.calculation-summary table th:first-child{text-align:left}.calculation-summary table th:nth-child(2){text-align:center}.calculation-summary table td{padding:.75rem;border:1px solid var(--pico-border-color)}.calculation-summary table td:nth-child(2){text-align:center}.calculation-summary table tr:nth-child(even){background:var(--pico-background-color)}.calculation-summary .example-box{margin-top:2rem;padding:1.25rem;background:linear-gradient(135deg,var(--pico-primary-background),var(--pico-card-background-color));border-radius:8px;border:1px solid var(--pico-primary)}.calculation-summary .example-box h3{margin:0 0 1rem 0;color:var(--pico-primary);font-size:1.1rem}.calculation-summary .example-box .examples-grid{display:grid;gap:1rem}.calculation-summary .example-box .example-item{padding:1rem;background:var(--pico-card-background-color);border-radius:6px}@media(min-width:768px){.rankings-grid{grid-template-columns:repeat(2,1fr)}.rankings-header{margin-bottom:1.5rem;padding:1rem}.rankings-header h1{font-size:2rem}.filters{gap:.75rem;margin-bottom:1.5rem}.filter-btn{padding:.5rem 1rem;font-size:.9375rem}.rankings-grid{gap:.75rem}.ranking-card{padding:.75rem}.rank-badge{width:40px;height:40px;min-width:40px;font-size:1rem}.ranking-username{font-size:1rem}.ranking-meta{font-size:.8125rem}.power-value{font-size:1rem}}@media(max-width:600px){.rankings-header{padding:.25rem}.rankings-header h1{font-size:1.25rem}.filters{flex-direction:column;align-items:stretch}}