.tracksGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:clamp(12px,2vw,20px)}@media (max-width: 767px){.rail{display:none}.topbar{display:flex}.tracksGrid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}}@media (min-width: 768px) and (max-width: 1023px){.tracksGrid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px}}@media (min-width: 1024px){.tracksGrid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}}.clientDashboardLayout{min-height:100vh;background:var(--bg-page)}.clientDashboardContent{padding:24px;margin-left:0;transition:margin-left .3s ease}@media (min-width: 1024px){.clientDashboardContent{margin-left:0}}.welcomeHeader{background:var(--bg-card);border-radius:var(--radius);padding:32px;margin-bottom:32px;text-align:center;box-shadow:var(--shadow);border:3px solid var(--accent)}.heroTitle{margin:0;font-weight:800;font-size:clamp(22px,3vw,32px);color:var(--fg-ink);font-family:Fredoka One,cursive}.railBrand{display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px 12px}.brandWordmark{font-weight:800;font-size:clamp(18px,2.2vw,22px);letter-spacing:.2px;color:#fff}@media (max-width: 767px){.railBrand{flex-direction:row;align-items:center;gap:8px;padding:8px 0;min-height:40px;justify-content:flex-start}.brandWordmark{font-size:18px;font-weight:800;color:#fff;white-space:nowrap}.coinPill{padding:6px 10px;font-size:12px}.coinLabel{font-size:11px}.coinValue{font-size:12px}}.coinPill{display:inline-flex;align-items:center;gap:8px;background:#ffb70326;border:1px solid rgba(255,183,3,.35);padding:8px 12px;border-radius:999px;color:#fff;font-weight:700}.coinDot{width:10px;height:10px;border-radius:50%;background:#ffb703}.coinLabel{opacity:.9;font-size:12px}.coinValue{font-variant-numeric:tabular-nums}.trackCard{display:block;gap:16px;align-items:center;background:var(--bg-card);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px 18px;width:100%;text-align:left;border:1px solid #e2e8f0;transition:all .3s ease}.trackCard:hover{transform:translateY(-4px);box-shadow:0 12px 28px #0000001f}.trackIcon{font-size:28px;line-height:1;color:var(--brand);flex-shrink:0}.trackMain{flex:1;min-width:0}.trackTitle{font-size:18px;font-weight:700;color:var(--fg-ink);margin:0 0 2px;line-height:1.3}.trackGoal{color:var(--fg-muted);font-size:13px;margin-bottom:12px}.trackBar{height:10px;background:linear-gradient(90deg,var(--brand),#8aa9ff);border-radius:999px;position:relative;overflow:hidden;margin-top:10px}.trackPct{font-size:12px;color:var(--fg-muted);margin-top:6px;text-align:right}.progressSection{margin-top:16px}.progressLabel{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.progressText{font-weight:700;font-size:16px;color:var(--fg-ink)}.progressEmoji{font-size:20px;animation:bounce 1s infinite}.starRating{display:flex;justify-content:center;gap:4px;margin-top:12px}@media (max-width: 480px){.welcomeHeader{padding:24px 16px}.welcomeTitle{font-size:2rem}.welcomeSubtitle{font-size:1.1rem}.trackCard{padding:12px 14px}.trackTitle{font-size:15px}}@media (prefers-reduced-motion: reduce){.trackCard:hover{transform:none}.progressEmoji{animation:none}}.trackCard:focus-visible{outline:2px solid var(--brand);outline-offset:2px}.loadingContainer{display:flex;justify-content:center;align-items:center;min-height:200px}.errorContainer{background:#fee2e2;border:1px solid #fecaca;border-radius:var(--radius);padding:16px;color:#991b1b;text-align:center}.emptyState{background:var(--bg-card);border-radius:var(--radius);padding:32px;text-align:center;color:var(--fg-muted);border:2px dashed #d1d5db}.closetContent{background:var(--bg-card);border-radius:var(--radius);padding:32px;box-shadow:var(--shadow)}.closetGrid{display:grid;grid-template-columns:420px 1fr;gap:32px;align-items:start}@media (max-width: 1023px){.closetGrid{grid-template-columns:1fr;gap:24px}}.avatarColumn{display:flex;flex-direction:column;align-items:center;gap:16px}.avatarColumn h2{margin:0;font-size:24px;font-weight:600;color:var(--fg-ink)}.clearButtons{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.clearButton{padding:8px 12px;border-radius:6px;border:1px solid #ddd;background:#fafafa;color:var(--fg-muted);font-size:14px;cursor:pointer;transition:all .2s ease}.clearButton:hover{background:#f0f0f0;border-color:#ccc}.categoriesColumn{display:flex;flex-direction:column;gap:24px;max-height:70vh;overflow-y:auto}.categorySection{background:#fafafa;border-radius:12px;padding:20px;border:1px solid #e5e7eb}.categoryTitle{margin:0 0 16px;font-size:18px;font-weight:600;color:var(--fg-ink);text-transform:uppercase;letter-spacing:.5px}.itemsGrid{display:grid;grid-template-columns:repeat(auto-fill,96px);gap:12px}.itemTile{width:96px;height:96px;border:1px solid #e5e7eb;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;background:#fff;transition:all .2s ease}.itemTile:hover{border-color:var(--brand);box-shadow:0 2px 8px #6c63ff1a}.itemTile.selected{outline:3px solid var(--brand);border-color:var(--brand)}.itemImage{max-width:80%;max-height:80%;object-fit:contain}.noneOption{color:var(--fg-muted);font-size:14px;font-weight:500}.noneOption:hover{background:#f0f0f0}:root{--fg-ink: #0B1020;--fg-muted: #4b5563;--bg-page: #FFF7EB;--bg-card: #FFFFFF;--bg-rail: #2C2F72;--brand: #6C63FF;--accent: #FFB703;--good: #45C4B0;--radius: 20px;--shadow: 0 8px 22px rgba(0,0,0,.08)}.trackDetailsLayout{min-height:100vh;background:var(--bg-page)}.trackDetailsContent{padding:24px;margin-left:0;transition:margin-left .3s ease}@media (min-width: 1024px){.trackDetailsContent{margin-left:0}}.trackHeader{background:var(--bg-card);border-radius:var(--radius);padding:32px;margin-bottom:32px;text-align:center;box-shadow:var(--shadow);border:3px solid var(--brand)}.trackTitle{font-size:2.5rem;font-weight:700;color:var(--fg-ink);margin-bottom:16px;font-family:Fredoka One,cursive}.trackSubtitle{font-size:1.25rem;color:var(--fg-muted);font-weight:500;margin-bottom:24px}.levelSection{margin-bottom:32px}.levelHeader{background:var(--bg-card);border-radius:var(--radius);padding:20px 24px;margin-bottom:16px;box-shadow:var(--shadow);border-left:6px solid var(--accent)}.levelTitle{font-size:1.5rem;font-weight:700;color:var(--fg-ink);margin:0;display:flex;align-items:center;gap:12px}.levelNumber{background:var(--accent);color:#fff;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.1rem}.levelSubtitle{color:var(--fg-muted);font-size:1rem;margin-top:8px;font-weight:500}.activityList{background:var(--bg-card);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}.activityItem{display:flex;align-items:center;padding:16px 20px;border-bottom:1px solid #e2e8f0;transition:background-color .2s ease}.activityItem:last-child{border-bottom:none}.activityItem:hover{background:#f8fafc}.activityMain{flex:1;min-width:0}.activityName{font-size:1.1rem;font-weight:600;color:var(--fg-ink);margin:0 0 4px}.activityDescription{color:var(--fg-muted);font-size:.9rem;margin:0}.activityMeta{display:flex;align-items:center;gap:16px}.activityStars{display:flex;gap:2px}.star{font-size:16px;color:var(--accent)}.starEmpty{color:#d1d5db}.activityAction{color:var(--brand);font-size:20px;cursor:pointer;transition:transform .2s ease}.activityAction:hover{transform:translate(2px)}.activityItem.locked{opacity:.6;background:#f8fafc}.activityItem.locked .activityName{color:var(--fg-muted)}.activityItem.locked .activityAction{color:var(--fg-muted);cursor:not-allowed}.activityItem.completed{background:#f0fdf4;border-left:4px solid var(--good)}.activityItem.completed .activityName{color:var(--good)}@media (max-width: 767px){.trackDetailsContent{padding:16px}.trackHeader{padding:24px 16px}.trackTitle{font-size:2rem}.trackSubtitle{font-size:1.1rem}.levelHeader{padding:16px 20px}.levelTitle{font-size:1.3rem}.activityItem{padding:14px 16px}.activityName{font-size:1rem}.progressBar{width:150px}}@media (min-width: 768px) and (max-width: 1023px){.trackDetailsContent{padding:20px}.levelHeader{padding:18px 22px}}.backButton{display:inline-flex;align-items:center;gap:8px;color:var(--brand);font-weight:600;text-decoration:none;margin-bottom:24px;padding:8px 16px;border-radius:8px;transition:background-color .2s ease}.backButton:hover{background:#6c63ff1a;text-decoration:none}.backIcon{font-size:18px}.loadingContainer{display:flex;justify-content:center;align-items:center;min-height:300px}.loadingSpinner{color:var(--brand)}.loadingText{color:var(--fg-muted);font-size:1.1rem;margin-top:16px}.errorContainer{background:#fee2e2;border:1px solid #fecaca;border-radius:var(--radius);padding:16px;color:#991b1b;text-align:center;margin:24px 0}.emptyState{background:var(--bg-card);border-radius:var(--radius);padding:32px;text-align:center;color:var(--fg-muted);border:2px dashed #d1d5db;margin:24px 0}.emptyStateIcon{font-size:48px;margin-bottom:16px;opacity:.5}.emptyStateText{font-size:1.1rem;font-weight:500}@media (prefers-reduced-motion: reduce){.progressFill{transition:none}.activityAction:hover{transform:none}}.activityItem:focus-visible{outline:2px solid var(--brand);outline-offset:2px}.backButton:focus-visible{outline:2px solid var(--brand);outline-offset:2px}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.levelSection{animation:fadeIn .3s ease-out}.levelSection:nth-child(2){animation-delay:.1s}.levelSection:nth-child(3){animation-delay:.2s}.levelSection:nth-child(4){animation-delay:.3s}.levelSection:nth-child(5){animation-delay:.4s}@keyframes rewardIn{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes starPop{0%{transform:scale(.3);opacity:0}to{transform:scale(1);opacity:1}}@keyframes gabby-bounce-y{0%,to{transform:translateY(-4px)}50%{transform:translateY(8px)}}.gabby-bounce-y{animation:gabby-bounce-y 2.4s ease-in-out infinite}@media (prefers-reduced-motion: reduce){.gabby-bounce-y{animation:none!important}}@keyframes floatUp{0%{transform:translateY(8px);opacity:0}to{transform:translateY(-14px);opacity:1}}.fg-pairs__tile{inline-size:100%;aspect-ratio:1 / 1;box-sizing:border-box;border:2px solid transparent;background:#fff;overflow:hidden;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease}.fg-pairs__tile:focus-visible{outline:none;box-shadow:0 0 0 3px #3b82f699}.fg-pairs__tile--revealed{border-color:#00000014}.fg-pairs__tile--matched{pointer-events:none;border-color:#22c55e;animation:fg-match-pop .22s ease-out,fg-match-glow .9s ease-in-out 2;box-shadow:0 0 0 6px #22c55e2e,0 6px 18px #0000001f;background:#f6fffa}.fg-pairs__footer{min-height:48px}@keyframes fg-match-pop{0%{transform:scale(1)}60%{transform:scale(1.06)}to{transform:scale(1)}}@keyframes fg-match-glow{0%,to{box-shadow:0 0 #22c55e00}50%{box-shadow:0 0 0 10px #22c55e4d}}:root{--panel-bg:#fff;--panel-br:#eceff3;--panel-shadow: 0 1px 0 rgba(16,24,40,.02), 0 1px 2px rgba(16,24,40,.08);--gap: clamp(12px, 1.6vw, 20px);--tile: clamp(92px, 12vw, 136px);--accent:#3b82f6;--ok:#34d399;--warn:#f59e0b;--danger:#fb7185;--app-header-offset: 72px}.closetLayout{display:grid;grid-template-columns:360px 1fr;gap:var(--gap);align-items:start}.avatarCol{position:sticky;top:var(--app-header-offset);align-self:start;z-index:1}.listCol{min-width:0;overflow-y:auto;max-height:calc(100vh - var(--app-header-offset) - 24px);padding-right:8px}.section{background:var(--panel-bg);border:1px solid var(--panel-br);border-radius:16px;box-shadow:var(--panel-shadow);padding:clamp(12px,1.6vw,20px);margin-bottom:var(--gap)}.sectionTitle{font-size:12px;font-weight:700;letter-spacing:.06em;color:#62708a;margin-bottom:clamp(8px,1.2vw,12px)}.itemsGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--tile),1fr));gap:var(--gap)}.itemTileV2{position:relative;background:#fafbff;border:1px solid #e8ecf3;border-radius:14px;box-shadow:0 1px #10182805;padding:clamp(8px,1.2vw,12px);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.itemTileV2:hover{transform:translateY(-2px);box-shadow:0 3px 10px #1018280f}.itemTileV2.selected{outline:2px solid var(--accent);outline-offset:2px}.thumb{width:100%;aspect-ratio:1 / 1;border-radius:12px;background:#fff;border:1px solid #edf1f6;display:grid;place-items:center;margin-bottom:clamp(8px,1vw,10px);overflow:hidden}.thumb img{width:100%;height:100%;object-fit:contain}.itemTileV2{scroll-snap-align:start}.actionBtn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:8px 14px;border-radius:999px;font-weight:700;font-size:14px;line-height:1;white-space:nowrap;border:none;cursor:pointer;width:100%;margin-top:10px;transition:transform .08s ease,filter .12s ease,opacity .12s ease}.actionBtn:active{transform:scale(.98)}.actionBtn.buy{background:var(--danger);color:#fff}.actionBtn.equip{background:var(--ok);color:#0b2817}.actionBtn.unequip{background:var(--warn);color:#3b2b0a}.actionBtn:disabled,.actionBtn.disabled{opacity:.6;cursor:not-allowed;transform:none!important}.actionBtn:disabled:hover,.actionBtn.disabled:hover{transform:none!important;box-shadow:none!important}.lockBadge{position:absolute;top:8px;right:8px;width:26px;height:26px;background:#fff;border:1px solid #e5e7eb;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 4px #0206170f;font-size:14px}@media (max-width: 1200px){.closetLayout{grid-template-columns:360px 1fr}}@media (max-width: 1024px){.closetLayout{grid-template-columns:1fr}.avatarCol{position:static}.listCol{overflow-y:visible;max-height:none;padding-right:0}}@media (max-width: 640px){:root{--tile: clamp(88px, 28vw, 120px)}.section{padding:12px;border-radius:12px}.actionBtn{font-size:13px;padding:8px 12px}}@keyframes reveal{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion: reduce){.itemTileV2,.actionBtn{transition:none!important}.section{animation:none}}._scrollContainer_jgrv3_1{max-height:calc(100vh - 220px);overflow-y:auto;overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--chakra-colors-gray-200, rgba(0,0,0,.08));border-radius:12px;background:var(--chakra-colors-white, #fff)}._scrollContainer_jgrv3_1 table thead th{position:sticky;top:0;background:var(--chakra-colors-white, #fff);z-index:1}._scrollContainer_jgrv3_1 table{width:100%;border-collapse:collapse;table-layout:fixed}._scrollContainer_jgrv3_1 table th,._scrollContainer_jgrv3_1 table td{padding:10px 12px;vertical-align:top;word-break:break-word}@media (max-width: 1024px){._scrollContainer_jgrv3_1 table th,._scrollContainer_jgrv3_1 table td{white-space:normal}}
