.highscores-container{width:var(--width-full);max-width:var(--container-xl);margin:0 auto;padding:var(--space-md) var(--space-xs);min-height:100vh;display:flex;flex-direction:column;contain:layout style paint}@media (min-width: 20em){.highscores-container{padding:var(--space-lg) var(--space-sm)}}@media (min-width: 48em){.highscores-container{padding:var(--space-xl) var(--space-md)}}@media (min-width: 64em){.highscores-container{padding:var(--space-2xl) var(--space-lg)}}@media (min-width: 80em){.highscores-container{padding:var(--space-3xl) var(--space-xl)}}@media (prefers-reduced-motion: reduce){.highscores-container{scroll-behavior:auto}}.highscores-hero{position:relative;margin-bottom:var(--space-xl);overflow:hidden;border-radius:var(--radius-lg);background:linear-gradient(135deg,var(--color-primary-900) 0%,var(--color-primary-700) 50%,var(--color-secondary-800) 100%);padding:var(--space-lg) var(--space-sm);box-shadow:var(--shadow-xl);border:var(--border-width-thin) solid var(--border-primary);contain:layout style paint}@media (min-width: 48em){.highscores-hero{margin-bottom:var(--space-2xl);padding:var(--space-xl) var(--space-lg);border-radius:var(--radius-xl)}}@media (min-width: 64em){.highscores-hero{margin-bottom:var(--space-3xl);padding:var(--space-2xl) var(--space-xl);border-radius:var(--radius-2xl)}}@media (min-width: 80em){.highscores-hero{padding:var(--space-3xl) var(--space-2xl)}}.highscores-hero__decoration{position:absolute;inset:0;opacity:.1;pointer-events:none;contain:layout style paint}.highscores-hero__decoration-item{position:absolute;border-radius:var(--radius-full);background:var(--color-white);transition:transform var(--transition-base);contain:layout style paint}.highscores-hero__decoration-item--top-right{top:calc(-1 * var(--space-xl));right:calc(-1 * var(--space-xl));width:var(--space-3xl);height:var(--space-3xl)}@media (min-width: 64em){.highscores-hero__decoration-item--top-right{width:calc(var(--space-3xl) * 2);height:calc(var(--space-3xl) * 2)}}.highscores-hero__decoration-item--bottom-left{bottom:calc(-1 * var(--space-2xl));left:calc(-1 * var(--space-2xl));width:calc(var(--space-3xl) * 2);height:calc(var(--space-3xl) * 2)}@media (min-width: 64em){.highscores-hero__decoration-item--bottom-left{width:calc(var(--space-3xl) * 3);height:calc(var(--space-3xl) * 3)}}.highscores-hero__decoration-item--center-right{top:50%;right:calc(-1 * var(--space-md));width:var(--space-2xl);height:var(--space-2xl);transform:translateY(-50%)}@media (min-width: 48em){.highscores-hero__decoration-item--center-right{width:var(--space-3xl);height:var(--space-3xl)}}.highscores-hero__content{position:relative;z-index:1;text-align:center;color:var(--color-white);contain:layout style}.highscores-hero__title{margin-bottom:var(--space-md);color:var(--color-white);text-shadow:var(--shadow-lg);font-size:var(--text-2xl)}@media (min-width: 48em){.highscores-hero__title{margin-bottom:var(--space-lg);font-size:var(--text-3xl)}}@media (min-width: 64em){.highscores-hero__title{font-size:var(--text-4xl)}}@media (min-width: 80em){.highscores-hero__title{font-size:var(--text-5xl)}}.highscores-hero__divider{width:var(--space-xl);height:var(--border-width-thick);background:var(--color-secondary-400);margin:var(--space-md) auto;border-radius:var(--radius-full);contain:layout style paint}@media (min-width: 64em){.highscores-hero__divider{width:var(--space-2xl);margin:var(--space-lg) auto}}@media (min-width: 80em){.highscores-hero__divider{width:var(--space-3xl)}}.highscores-hero__description{color:var(--color-neutral-100);font-size:var(--text-base);line-height:var(--leading-relaxed);max-width:var(--form-container-max-width);margin:0 auto;contain:layout style}@media (min-width: 48em){.highscores-hero__description{font-size:var(--text-lg)}}@media (min-width: 64em){.highscores-hero__description{font-size:var(--text-xl)}}@media (min-width: 80em){.highscores-hero__description{font-size:var(--text-2xl);max-width:calc(var(--form-container-max-width) * 1.2)}}.highscores__loading{display:flex;align-items:center;justify-content:center;min-height:calc(var(--container-sm) * .4);padding:var(--space-xl);margin:var(--space-xl) auto;contain:layout style paint}.highscores__loading-content{text-align:center;display:flex;flex-direction:column;align-items:center;gap:var(--space-md)}.highscores__loading-icon{width:var(--icon-size-lg);height:var(--icon-size-lg);color:var(--interactive-primary);animation:loading-spin var(--animation-pulse-duration) linear infinite}@media (min-width: 48em){.highscores__loading-icon{width:var(--icon-size-xl);height:var(--icon-size-xl)}}.highscores__error{background-color:var(--bg-error-aaa);border:var(--border-width-thin) solid var(--border-error);border-radius:var(--radius-md);padding:var(--space-lg);margin:var(--space-xl) auto;max-width:var(--container-sm);text-align:center;contain:layout style paint}@media (min-width: 48em){.highscores__error{padding:var(--space-xl);max-width:var(--container-md)}}@keyframes loading-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.highscores__content{margin-top:var(--space-2xl);line-height:var(--leading-enhanced);contain:layout style}.highscores__filters{margin-bottom:var(--space-3xl);contain:layout style paint}.highscores__filters-container{max-width:var(--container-lg);margin:0 auto}.highscores__filter-grid{display:grid;grid-template-columns:1fr;gap:var(--space-lg);margin-top:var(--space-2xl);max-width:800px;margin-left:auto;margin-right:auto}@media (min-width: 48em){.highscores__filter-grid{grid-template-columns:repeat(2,1fr);gap:var(--space-2xl)}}.highscores__filter-group{background:var(--card-bg);border:var(--border-width-thin) solid var(--card-border);border-radius:var(--radius-xl);padding:var(--space-2xl);box-shadow:var(--card-shadow);transition:all var(--transition-base);position:relative;overflow:hidden;contain:layout style paint}.highscores__filter-group:hover{transform:translateY(calc(-1 * var(--space-sm)));box-shadow:var(--card-shadow-hover);border-color:var(--interactive-primary);background:linear-gradient(135deg,var(--card-bg) 0%,color-mix(in srgb,var(--card-bg) 95%,var(--interactive-primary) 5%) 100%)}.highscores__filter-group:before{content:"";position:absolute;top:0;left:0;right:0;height:var(--border-width-enhanced);background:linear-gradient(90deg,var(--interactive-primary) 0%,var(--interactive-secondary) 50%,var(--interactive-primary) 100%);opacity:.7}@media (min-width: 48em){.highscores__filter-group{padding:var(--space-3xl)}}.highscores__filter-header{display:flex;align-items:center;gap:var(--space-md);margin-bottom:var(--space-xl)}@media (min-width: 48em){.highscores__filter-header{margin-bottom:var(--space-2xl)}}.highscores__filter-icon{width:var(--icon-size-lg);height:var(--icon-size-lg);color:var(--interactive-primary);flex-shrink:0}@media (min-width: 48em){.highscores__filter-icon{width:var(--icon-size-xl);height:var(--icon-size-xl)}}.highscores__filter-label{font-size:var(--text-lg);font-weight:var(--font-semibold);color:var(--text-primary);line-height:var(--leading-tight)}@media (min-width: 48em){.highscores__filter-label{font-size:var(--text-xl)}}.highscores__select-wrapper{position:relative;display:flex;align-items:center}.highscores__filter-select{width:var(--width-full);padding:var(--space-lg) var(--space-xl);background:var(--form-bg);border:var(--border-width-thin) solid var(--form-border);border-radius:var(--radius-lg);color:var(--form-text);font-size:var(--text-base);font-weight:var(--font-medium);line-height:var(--leading-normal);min-height:var(--touch-target-enhanced);transition:all var(--transition-base);cursor:pointer;appearance:none;padding-right:calc(var(--space-xl) + var(--icon-size-lg) + var(--space-md));contain:layout style paint}.highscores__filter-select:focus-visible{outline:var(--focus-ring);outline-offset:var(--focus-ring-offset)}.highscores__filter-select:hover{border-color:var(--interactive-primary);background-color:color-mix(in srgb,var(--form-bg) 95%,var(--interactive-primary) 5%)}.highscores__filter-select:focus{border-color:var(--interactive-primary);box-shadow:var(--focus-ring);background-color:var(--form-bg)}@media (min-width: 48em){.highscores__filter-select{padding:var(--space-xl) var(--space-2xl);font-size:var(--text-lg);padding-right:calc(var(--space-2xl) + var(--icon-size-xl) + var(--space-lg))}}.highscores__select-arrow{position:absolute;right:var(--space-lg);width:var(--icon-size-md);height:var(--icon-size-md);color:var(--text-secondary);pointer-events:none;transition:color var(--transition-base)}@media (min-width: 48em){.highscores__select-arrow{right:var(--space-xl);width:var(--icon-size-lg);height:var(--icon-size-lg)}}.highscores__filter-select:hover+.highscores__select-arrow{color:var(--interactive-primary)}.highscores__list{margin-top:var(--space-3xl);scroll-margin-top:var(--space-2xl)}.highscores__list-title{margin-bottom:var(--space-2xl);text-align:center}.highscores__empty{text-align:center;padding:var(--space-2xl) var(--space-lg);border-radius:var(--radius-md);background-color:var(--bg-tertiary);border:var(--border-width-thin) solid var(--border-secondary);margin:var(--space-xl) auto;max-width:var(--container-sm)}@media (min-width: 48em){.highscores__empty{padding:var(--space-3xl) var(--space-2xl);max-width:var(--container-md)}}.highscores__cards-grid{display:grid;gap:var(--space-lg);margin:var(--space-2xl) auto;max-width:1400px;padding:0 var(--space-md);grid-template-columns:1fr;contain:layout style paint}@media (min-width: 48em){.highscores__cards-grid{grid-template-columns:repeat(2,1fr);gap:var(--space-xl)}}@media (min-width: 64em){.highscores__cards-grid{grid-template-columns:repeat(3,1fr);gap:var(--space-2xl)}}.highscores__card{position:relative;background:var(--card-bg);border:var(--border-width-thin) solid var(--card-border);border-radius:var(--radius-xl);box-shadow:var(--card-shadow);padding:var(--space-xl);transition:all var(--transition-base);min-height:200px;contain:layout style paint}.highscores__card:hover{transform:translateY(calc(-1 * var(--space-xs)));box-shadow:var(--card-shadow-hover);border-color:var(--interactive-primary)}.highscores__card-badge{position:absolute;top:var(--space-lg);right:var(--space-lg);z-index:2}.highscores__rank-badge{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:var(--radius-full);font-size:var(--text-xl);font-weight:var(--font-black);background:var(--interactive-primary);color:var(--color-white);box-shadow:var(--shadow-md);contain:layout style paint}.highscores__rank-badge--medal.highscores__rank-badge--gold,.highscores__rank-badge--medal.highscores__rank-badge--silver,.highscores__rank-badge--medal.highscores__rank-badge--bronze{box-shadow:none!important}.highscores__card:nth-child(2) .highscores__rank-badge--medal{background:linear-gradient(135deg,var(--achievement-silver) 0%,color-mix(in srgb,var(--achievement-silver) 80%,var(--color-white) 20%) 100%);border-color:var(--achievement-silver);box-shadow:0 0 var(--space-md) oklch(from var(--achievement-silver) l c h/.4),inset 0 var(--border-width-thin) 0 oklch(from var(--color-white) l c h/.3)}.highscores__card:nth-child(3) .highscores__rank-badge--medal{background:linear-gradient(135deg,var(--achievement-bronze) 0%,color-mix(in srgb,var(--achievement-bronze) 80%,var(--color-white) 20%) 100%);border-color:var(--achievement-bronze);box-shadow:0 0 var(--space-md) oklch(from var(--achievement-bronze) l c h/.4),inset 0 var(--border-width-thin) 0 oklch(from var(--color-white) l c h/.3)}.highscores__card-content{display:flex;flex-direction:column;height:100%}.highscores__card-main{display:flex;flex-direction:column;gap:var(--space-md);margin-bottom:var(--space-lg);padding-bottom:var(--space-md)}.highscores__card-username{font-size:var(--text-lg);font-weight:var(--font-bold);color:var(--text-primary);line-height:var(--leading-tight);margin:0}@media (min-width: 48em){.highscores__card-username{font-size:var(--text-xl)}}@media (min-width: 64em){.highscores__card-username{font-size:var(--text-2xl)}}.highscores__card-score{display:flex;align-items:baseline;gap:var(--space-xs);flex-wrap:wrap}@media (min-width: 48em){.highscores__card-score{gap:var(--space-sm)}}.highscores__score-value{font-size:var(--text-xl);font-weight:var(--font-black);background:linear-gradient(135deg,var(--interactive-primary) 0%,var(--interactive-secondary) 100%);background-clip:text;-webkit-background-clip:text;color:transparent;line-height:var(--leading-tight)}@media (min-width: 48em){.highscores__score-value{font-size:var(--text-2xl)}}.highscores__score-label{font-size:var(--text-sm);color:var(--text-secondary);font-weight:var(--font-semibold);text-transform:uppercase;letter-spacing:var(--text-spacing-letter-2x)}@media (min-width: 48em){.highscores__score-label{font-size:var(--text-base)}}.highscores__card-details{display:flex;flex-direction:column;gap:var(--space-md);margin-top:var(--space-lg);padding-top:var(--space-lg);border-top:var(--border-width-thin) solid var(--border-secondary)}.highscores__detail-item{display:flex;align-items:center;gap:var(--space-sm)}.highscores__detail-icon{width:var(--icon-size-md);height:var(--icon-size-md);color:var(--interactive-primary);flex-shrink:0}@media (min-width: 48em){.highscores__detail-icon{width:var(--icon-size-lg);height:var(--icon-size-lg)}}.highscores__detail-label{font-size:var(--text-xs);font-weight:var(--font-bold);color:var(--text-secondary);text-transform:uppercase;letter-spacing:var(--text-spacing-letter-2x);opacity:.8}@media (min-width: 48em){.highscores__detail-label{font-size:var(--text-sm)}}.highscores__detail-value{font-size:var(--text-sm);color:var(--text-primary);font-weight:var(--font-semibold);line-height:var(--leading-tight);word-break:break-word}@media (min-width: 48em){.highscores__detail-value{font-size:var(--text-base)}}.highscores__mode{color:var(--interactive-secondary);font-weight:var(--font-bold);text-transform:capitalize;background:linear-gradient(135deg,var(--interactive-secondary) 0%,var(--interactive-primary) 100%);background-clip:text;-webkit-background-clip:text;color:transparent}@media (min-width: 48em){.highscores__mode{font-size:var(--text-xl)}}@supports not (background-clip: text){.highscores__mode{color:var(--interactive-secondary)}}.highscores__category{color:var(--text-primary);font-weight:var(--font-semibold)}@media (min-width: 48em){.highscores__category{font-size:var(--text-xl)}}.highscores__date{color:var(--text-tertiary);font-size:var(--text-base);font-variant-numeric:tabular-nums;font-weight:var(--font-medium)}@media (min-width: 48em){.highscores__date{font-size:var(--text-lg)}}@media (prefers-reduced-motion: reduce){.highscores-hero__decoration-item{animation:none;transition:none}.highscores__loading-icon{animation:none}.highscores__card{transition:var(--transition-instant)}.highscores__card:hover{transform:none}.highscores__rank-badge{transition:var(--transition-instant)}.highscores__rank-badge:hover{transform:none}}@media (prefers-contrast: high){.highscores-hero{border-width:var(--border-width-thick);border-color:var(--color-white)}.highscores__card{border-width:var(--border-width-thick);border-color:var(--text-primary)}.highscores__rank-badge--medal{background:var(--text-primary)!important;color:var(--bg-primary)!important;border-color:var(--text-primary)!important}}@media print{.highscores__filters{display:none}.highscores-container{padding:var(--space-md);max-width:var(--width-full)}.highscores-hero{background:var(--print-bg);box-shadow:none;border:var(--border-width-thin) solid var(--print-border)}.highscores__cards-grid{grid-template-columns:1fr 1fr;gap:var(--space-md)}.highscores__card{border:var(--border-width-thin) solid var(--print-border);background:var(--print-bg);color:var(--print-text);page-break-inside:avoid;box-shadow:none;font-size:var(--text-sm)}.highscores__card-content{padding:var(--space-sm)}.highscores__card-username{font-size:var(--text-base)}.highscores__card-detail-label,.highscores__card-detail-value{font-size:var(--text-xs)}.highscores__score-value{font-size:var(--text-lg)}.highscores__rank-badge--medal{background:var(--print-text)!important;color:var(--print-bg)!important}}