.filter-top[data-v-e8e8d717]{display:flex;flex-direction:column;gap:24px;margin-bottom:24px}.header-row[data-v-e8e8d717]{align-items:flex-start;display:flex;justify-content:space-between}.title-area h1[data-v-e8e8d717]{color:var(--text-primary);font-size:28px;font-weight:800;margin-bottom:4px}.subtitle[data-v-e8e8d717]{color:var(--text-secondary);font-size:14px}.view-toggles[data-v-e8e8d717]{background:#fff;border:1px solid var(--border-color);border-radius:8px;display:flex;padding:4px}.toggle-btn[data-v-e8e8d717]{align-items:center;border-radius:6px;color:var(--text-secondary);display:flex;font-size:14px;font-weight:600;gap:6px;padding:6px 12px;transition:all .2s}.toggle-btn.active[data-v-e8e8d717]{background:#f3f0ff;color:var(--primary)}.filter-toggle-btn[data-v-e8e8d717]{align-items:center;background:var(--primary);border-radius:8px;color:#fff;display:flex;font-size:14px;font-weight:600;gap:6px;padding:8px 16px}.visible-mobile[data-v-e8e8d717]{display:none!important}.hidden-mobile[data-v-e8e8d717]{display:flex!important}.filters-row[data-v-e8e8d717]{align-items:center;background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;padding:16px 20px}.pill-group-wrapper[data-v-e8e8d717]{align-items:flex-start;display:flex;gap:12px;width:100%}.pill-group[data-v-e8e8d717]{align-items:center;display:flex;flex:1;flex-wrap:wrap;gap:8px;min-width:0}.group-label[data-v-e8e8d717]{color:var(--text-primary);width:60px}.group-label[data-v-e8e8d717],.pill-btn[data-v-e8e8d717]{font-size:13px;font-weight:600}.pill-btn[data-v-e8e8d717]{align-items:center;background:var(--bg-main);border:1px solid var(--border-color);border-radius:20px;color:var(--text-secondary);display:flex;gap:4px;padding:6px 16px;transition:all .2s}.pill-btn[data-v-e8e8d717]:hover{background:var(--border-color)}.pill-btn.active[data-v-e8e8d717]{background:var(--primary);border-color:var(--primary);color:#fff}.expand-btn[data-v-e8e8d717]{align-items:center;background:#fff;border:1px solid var(--border-color);border-radius:50%;box-shadow:var(--shadow-sm);color:var(--text-primary);cursor:pointer;display:flex;flex-shrink:0;height:32px;justify-content:center;margin-top:2px;transition:all .2s;width:32px}.expand-btn[data-v-e8e8d717]:hover{border-color:var(--primary);color:var(--primary)}.expand-btn .rotated[data-v-e8e8d717]{transform:rotate(180deg)}.expand-btn .rotated[data-v-e8e8d717],.expand-btn svg[data-v-e8e8d717]{transition:transform .3s ease}.text-orange[data-v-e8e8d717]{color:#ff6b45}.text-green[data-v-e8e8d717]{color:#00d084}.text-pink[data-v-e8e8d717]{color:#ff4572}.sort-dropdown[data-v-e8e8d717]{align-items:center;display:flex;gap:8px}.sort-label[data-v-e8e8d717]{color:var(--text-secondary);font-size:13px;font-weight:600}.select-sort[data-v-e8e8d717]{background:#fff;border:1px solid var(--border-color);border-radius:8px;color:var(--text-primary);cursor:pointer;font-size:14px;font-weight:600;outline:none;padding:8px 12px}@media(max-width:1024px){.filters-row[data-v-e8e8d717]{align-items:flex-start;flex-direction:column}.sort-dropdown[data-v-e8e8d717]{justify-content:flex-end;width:100%}}@media(max-width:768px){.visible-mobile[data-v-e8e8d717]{display:flex!important}.hidden-mobile[data-v-e8e8d717]{display:none!important}.header-row[data-v-e8e8d717]{align-items:center}.filters-row[data-v-e8e8d717]{padding:12px 16px}.pill-group[data-v-e8e8d717]{max-height:34px;overflow:hidden;transition:max-height .3s cubic-bezier(.4,0,.2,1)}.pill-group-wrapper.expanded .pill-group[data-v-e8e8d717]{max-height:500px}}.state-panel[data-v-11fc82b9]{align-items:center;background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:10px;justify-content:center;min-height:320px;padding:40px 24px;text-align:center}.state-panel h3[data-v-11fc82b9]{color:var(--text-primary);font-size:18px;font-weight:800}.state-panel p[data-v-11fc82b9]{color:var(--text-secondary);font-size:14px;line-height:1.6;max-width:360px}.state-icon[data-v-11fc82b9]{color:var(--primary)}.state-icon.error[data-v-11fc82b9]{color:#ff4572}.spin[data-v-11fc82b9]{animation:spin-11fc82b9 1s linear infinite}.state-action[data-v-11fc82b9]{align-items:center;background:var(--primary);border-radius:var(--radius-sm);color:#fff;display:inline-flex;font-size:14px;font-weight:700;gap:8px;margin-top:8px;padding:9px 16px}.state-action[data-v-11fc82b9]:hover{background:var(--primary-hover)}.grid-container[data-v-11fc82b9]{display:grid;gap:24px;grid-template-columns:repeat(4,1fr)}.grid-container[data-v-11fc82b9] .game-card{max-width:100%!important;width:100%!important}.list-container[data-v-11fc82b9]{display:flex;flex-direction:column;gap:16px}.list-item[data-v-11fc82b9]{align-items:center;background:var(--bg-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);cursor:pointer;display:flex;gap:20px;padding:16px;transition:transform .2s,box-shadow .2s}.list-item[data-v-11fc82b9]:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.list-image[data-v-11fc82b9]{border-radius:var(--radius-md);height:80px;-o-object-fit:cover;object-fit:cover;width:120px}.list-info[data-v-11fc82b9]{display:flex;flex:1;flex-direction:column;gap:8px;min-width:0}.list-title[data-v-11fc82b9]{color:var(--text-primary);font-size:18px;font-weight:700}.list-meta[data-v-11fc82b9]{display:flex;gap:8px;min-width:0;overflow:hidden}.tag[data-v-11fc82b9]{background:var(--primary);border-radius:4px;color:#fff;flex:0 0 auto;font-size:10px;font-weight:700;max-width:100%;overflow:hidden;padding:4px 8px;text-overflow:ellipsis;white-space:nowrap}.list-genres[data-v-11fc82b9]{display:flex;gap:6px;min-width:0;overflow:hidden}.genre[data-v-11fc82b9]{background:var(--bg-main);border-radius:4px;color:var(--text-secondary);flex:0 0 auto;font-size:12px;max-width:100%;overflow:hidden;padding:4px 8px;text-overflow:ellipsis;white-space:nowrap}.list-action[data-v-11fc82b9]{align-items:flex-end;display:flex;flex-direction:column;gap:12px}.list-rating[data-v-11fc82b9]{align-items:center;color:#ffa000;display:flex;font-size:14px;font-weight:700;gap:4px}.btn-play[data-v-11fc82b9]{background:var(--primary);border-radius:20px;color:#fff;font-size:14px;font-weight:600;padding:8px 24px;transition:background .2s}.btn-play[data-v-11fc82b9]:hover{background:var(--primary-hover)}@keyframes spin-11fc82b9{to{transform:rotate(1turn)}}@media(max-width:1200px){.grid-container[data-v-11fc82b9]{grid-template-columns:repeat(3,1fr)}}@media(max-width:900px){.grid-container[data-v-11fc82b9]{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){.grid-container[data-v-11fc82b9]{gap:16px;grid-template-columns:repeat(2,1fr)}.list-item[data-v-11fc82b9]{gap:12px;padding:12px}.list-image[data-v-11fc82b9]{height:60px;width:80px}.list-title[data-v-11fc82b9]{font-size:15px}.btn-play[data-v-11fc82b9]{font-size:12px;padding:6px 16px}}.pagination-wrapper[data-v-f918402f]{gap:8px;margin-top:32px;position:relative}.nav-btn[data-v-f918402f],.page-btn[data-v-f918402f],.pagination-wrapper[data-v-f918402f]{align-items:center;display:flex;justify-content:center}.nav-btn[data-v-f918402f],.page-btn[data-v-f918402f]{background:#fff;border:1px solid var(--border-color);border-radius:50%;color:var(--text-secondary);cursor:pointer;font-size:14px;font-weight:600;height:32px;min-width:32px;transition:all .2s}.nav-btn[data-v-f918402f]:hover:not(:disabled),.page-btn[data-v-f918402f]:hover:not(:disabled):not(.active){background:var(--bg-main);border-color:var(--primary);color:var(--primary)}.nav-btn[data-v-f918402f]:disabled,.page-btn[data-v-f918402f]:disabled{cursor:not-allowed;opacity:.5}.pages[data-v-f918402f]{align-items:center;display:flex;gap:8px}.page-btn.active[data-v-f918402f]{background:var(--primary);border-color:var(--primary);color:#fff}.page-btn.ellipsis[data-v-f918402f]{background:transparent;border-color:transparent}.per-page[data-v-f918402f]{position:absolute;right:0}.select-per-page[data-v-f918402f]{background:#fff;border:1px solid var(--border-color);border-radius:8px;color:var(--text-secondary);font-size:13px;font-weight:600;outline:none;padding:6px 12px}@media(max-width:768px){.pages[data-v-f918402f]{gap:4px}.page-btn[data-v-f918402f]{height:30px;min-width:30px}}