.kids-ranking{gap:16px;max-width:760px;margin:0 auto;padding:8px 0 32px;display:grid}.kids-ranking-head{grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;display:grid}.kids-ranking-head h1{font:800 clamp(1.5rem, 4vw, 2.1rem) var(--k-display);color:var(--k-ink);margin:0}.kids-ranking-head p{color:var(--k-ink-2);margin:2px 0 0}.kids-ranking-badge{background:color-mix(in oklch, var(--k-sun) 55%, var(--k-card));width:56px;height:56px;color:var(--k-sun-deep);box-shadow:var(--k-clay);border-radius:18px;place-items:center;display:grid}.kids-ranking-help{background:var(--k-paper-2);color:var(--k-ink);border-radius:18px;margin:0;padding:14px 16px;line-height:1.5}.kids-ranking-filters{gap:10px;display:grid;position:relative}.kids-ranking-ages,.kids-ranking-periods{flex-wrap:wrap;gap:8px;display:flex}.kids-ranking-ages button,.kids-ranking-periods button{background:var(--k-paper-2);min-height:44px;color:var(--k-ink);font:700 .95rem var(--k-display);box-shadow:0 3px 0 var(--k-rule);cursor:pointer;border:0;border-radius:999px;align-items:center;gap:8px;padding:0 14px 0 8px;display:inline-flex}.kids-ranking-periods button{padding-inline:12px 14px}.kids-ranking-ages img{object-fit:cover;background:var(--k-card);border-radius:50%;width:28px;height:28px}.kids-ranking-ages small{color:inherit;opacity:.8;font-weight:600}.kids-ranking-ages button:hover,.kids-ranking-periods button:hover{background:color-mix(in oklch, var(--k-primary) 12%, var(--k-card))}.kids-ranking-ages button[aria-checked=true],.kids-ranking-periods button[aria-checked=true]{background:var(--k-primary);color:var(--k-on-primary);box-shadow:0 3px 0 var(--k-primary-deep)}.kids-ranking-ages button:focus-visible,.kids-ranking-periods button:focus-visible{outline:3px solid var(--k-focus,var(--k-primary));outline-offset:2px}.kids-ranking-ages button:active,.kids-ranking-periods button:active{transform:translateY(2px)}.kids-ranking-coach{background:color-mix(in oklch, var(--k-sky) 30%, var(--k-card));color:var(--k-ink);box-shadow:var(--k-clay);border-radius:18px;flex-wrap:wrap;align-items:center;gap:10px;padding:12px 14px;display:flex}.kids-ranking-coach p{flex:220px;margin:0}.kids-ranking-me{color:var(--k-ink);flex-wrap:wrap;align-items:center;gap:12px;display:flex}.kids-ranking-me p{flex:200px;margin:0;line-height:1.45}.kids-ranking-me .kids-icon{color:var(--k-sun-deep);flex:none}.kids-ranking-me[data-trend=up] .kids-icon{color:var(--k-good)}.kids-ranking-me[data-trend=down] .kids-icon{color:var(--k-bad)}.kids-ranking-list{gap:8px;margin:0;padding:0;list-style:none;display:grid}.kids-ranking-list li{background:var(--k-card);box-shadow:var(--k-clay);color:var(--k-ink);border-radius:20px;grid-template-columns:48px 44px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px 14px;display:grid}.kids-ranking-list li[data-me]{outline:3px solid var(--k-primary);outline-offset:-3px;background:color-mix(in oklch, var(--k-primary) 10%, var(--k-card))}.kids-ranking-list .kids-profile-avatar{width:44px;height:44px}.kids-ranking-list .kids-profile-avatar img{width:100%;height:100%}.kids-ranking-rank{font:800 1.15rem var(--k-display);color:var(--k-ink-2);justify-content:center;align-items:center;gap:2px;display:inline-flex}.kids-ranking-list li[data-top="1"] .kids-ranking-rank{color:var(--k-sun-deep)}.kids-ranking-list li[data-top="2"] .kids-ranking-rank{color:var(--k-sky-deep)}.kids-ranking-list li[data-top="3"] .kids-ranking-rank{color:var(--k-pink-deep)}.kids-ranking-name{min-width:0;display:grid}.kids-ranking-name strong{text-overflow:ellipsis;white-space:nowrap;font:700 1rem var(--k-display);overflow:hidden}.kids-ranking-name small{color:var(--k-primary-deep);font-weight:700}.kids-ranking-points{font-variant-numeric:tabular-nums;white-space:nowrap;align-items:center;gap:4px;display:inline-flex}.kids-ranking-points .kids-icon{color:var(--k-sun-deep)}.kids-ranking-points strong{font:800 1.1rem var(--k-display)}.kids-ranking-points small{color:var(--k-ink-2)}.kids-ranking-foot{text-align:center;color:var(--k-ink-2);margin:0;font-size:.9rem}.kids-ranking-off{color:var(--k-ink)}.kids-ranking-loading{gap:10px;display:grid}.kids-ranking-loading p{text-align:center;color:var(--k-ink-2);margin:0}.kids-ranking-skeleton{gap:8px;display:grid}.kids-ranking-skeleton span{background:var(--k-paper-2);border-radius:20px;height:64px;animation:1.2s ease-in-out infinite alternate kids-ranking-pulse}@keyframes kids-ranking-pulse{to{opacity:.55}}@media (prefers-reduced-motion:reduce){.kids-ranking-skeleton span{animation:none}}.kids-experience[data-reduced-motion] .kids-ranking-skeleton span{animation:none}.kids-ranking-optin{background:var(--k-paper-2);border:0;border-radius:18px;gap:8px;margin:0;padding:12px 14px;display:grid}.kids-ranking-optin legend{color:var(--k-ink);float:left;align-items:center;gap:6px;width:100%;padding:0;font-weight:700;display:inline-flex}.kids-ranking-optin legend+*{clear:both}.kids-rank-notice{background:color-mix(in oklch, var(--k-sun) 40%, var(--k-card));color:var(--k-ink);box-shadow:var(--k-clay);border-radius:20px;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:10px;margin:0 0 12px;padding:10px 12px 10px 14px;display:grid}.kids-rank-notice p{margin:0;font-weight:700}.kids-rank-notice>.kids-icon{color:var(--k-sun-deep)}@media (max-width:520px){.kids-ranking-head{grid-template-columns:auto minmax(0,1fr) auto}.kids-ranking-badge{border-radius:14px;width:46px;height:46px}.kids-ranking-list li{grid-template-columns:34px 40px minmax(0,1fr) auto;gap:8px;padding:8px 10px}.kids-ranking-list .kids-profile-avatar{width:40px;height:40px}.kids-ranking-points small{display:none}.kids-rank-notice{grid-template-columns:auto minmax(0,1fr) auto}.kids-rank-notice .kids-btn{grid-column:2/3;justify-self:start}.kids-rank-notice .kids-tool{grid-area:1/3}}
