﻿ @keyframes cq-spin{to{transform:rotate(360deg)}}.cq-filter-panel-overlay{position:fixed;inset:0;z-index:9999;background:0 0;display:flex;justify-content:flex-end;transition:background .3s ease}.cq-filter-panel-overlay.active{background:rgba(0,0,0,.8)}.cq-filter-panel{width:100%;height:100%;background:var(--base-color);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .3s ease;overflow:hidden}.cq-filter-panel-overlay.active .cq-filter-panel{transform:translateX(0)}.cq-panel-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid var(--divider-color);flex-shrink:0}.cq-panel-header h3{margin:0;font-family:var(--ff-inter)}.cq-panel-search{padding:16px 20px;flex-shrink:0}.cq-panel-body{flex:1;overflow-y:auto;padding:20px;scrollbar-width:thin}.cq-panel-body .filter-dialog-content{display:grid;gap:32px}.cq-panel-footer{display:flex;gap:10px;justify-content:flex-end;padding:16px 20px;border-top:1px solid var(--divider-color);flex-shrink:0}body.SwWide .cq-filter-panel{width:400px;max-width:100%;border-left:1px solid var(--card-border);box-shadow:-4px 0 24px rgba(0,0,0,.3)}body.SwLandscape .cq-filter-panel{width:420px;max-width:100%;border-left:1px solid var(--card-border);box-shadow:-4px 0 24px rgba(0,0,0,.3)}.filter-sort-controls{margin-bottom:10px;padding:0 8px;display:flex;justify-content:space-between;align-items:center}.qc-button-group{display:flex;gap:8px;overflow:hidden}.custom-action-btn.btn-circle{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:var(--card-bg);border:1px solid var(--border-color);color:var(--text-color);cursor:pointer;transition:var(--transitionTr)}.custom-action-btn.btn-circle:hover{background:var(--card-hover-bg);box-shadow:var(--card-hover-shadow);border-color:var(--accent-color)}.custom-action-btn.ca-btn-text{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;background:var(--base-color);border:1px solid transparent;border-radius:12px;color:var(--text-color);cursor:pointer;transition:background-color .3s ease}.custom-action-btn.ca-btn-text:hover{background-color:color-mix(in srgb,var(--base-color) 70%,transparent)}.custom-action-btn.ca-btn-text.active{color:var(--text-color);border-color:var(--gold-gradient);font-weight:600;& .ca-icon{background-color:var(--gold-gradient)}}.custom-action-btn.ca-btn-text.active:hover{opacity:1}.custom-action-btn:disabled{opacity:.4;cursor:not-allowed;pointer-events:none}.qc-actions-dropdown{display:none;position:relative;flex-shrink:1;min-width:0}.qc-actions-dropdown-btn{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;background:0 0;color:var(--text-color-basic);cursor:pointer;max-width:100%}.qc-actions-dropdown-text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}.qc-chevron-down{width:12px;height:12px;mask-image:url(../hypnos/icons/chevron-down.svg);mask-size:contain;mask-repeat:no-repeat;background:var(--text-color-basic);transition:transform .3s ease;flex-shrink:0}.qc-actions-dropdown.active .qc-chevron-down{transform:rotate(180deg)}.qc-actions-dropdown-menu{display:none;position:absolute;top:calc(100% + 4px);left:0;min-width:calc(100% + 50px);z-index:100;background:var(--base-color);border-radius:12px;box-shadow:0 8px 24px var(--dropdown-shadow);overflow:hidden}.qc-actions-dropdown.active .qc-actions-dropdown-menu{display:block}.qc-actions-dropdown-item{display:flex;align-items:center;gap:8px;width:100%;padding:12px 15px;background:0 0;border:none;color:var(--text-color-basic);cursor:pointer;text-align:left;min-height:44px;transition:background-color .2s ease}.qc-actions-dropdown-item:hover{background:color-mix(in srgb,var(--base-color) 70%,transparent)}.qc-actions-dropdown-item.active{font-weight:600;border-radius:0;color:var(--base-color);background:var(--color-alert);& .ca-icon{background-color:var(--base-color)}}.qc-actions-dropdown-item:disabled{opacity:.4;cursor:not-allowed;pointer-events:none}.filter-btn{display:inline-flex;align-items:center;gap:10px;margin-left:auto;background:0 0;padding:8px 12px;font-weight:600;font-size:clamp(.75rem,2vw,.85rem);color:var(--text-color-basic);text-transform:uppercase;letter-spacing:.5px;cursor:pointer;transition:background .3s ease,box-shadow .3s ease}.filter-btn:hover{background:var(--base-color);box-shadow:var(--card-hover-shadow)}.ca-icon{width:16px;height:16px;mask-size:contain;mask-repeat:no-repeat;background-color:var(--text-color-basic)}.ca-icon.bars{mask-image:url(../hypnos/icons/bars.svg)}.ca-icon.pin{mask-image:url(../hypnos/icons/location-dot.svg)}.ca-icon.shop{mask-image:url(../hypnos/icons/shop.svg)}.location-icon{width:16px;height:16px;mask-image:url(../hypnos/icons/location-crosshairs.svg);mask-size:contain;mask-repeat:no-repeat;background:linear-gradient(135deg,#ff6b6b 0%,#ee5a6f 100%)}.sliders-icon{width:16px;height:16px;mask-image:url(../hypnos/icons/sliders-simple.svg);mask-size:contain;mask-repeat:no-repeat;background:var(--text-color)}.dialog-body .filter-dialog-content{display:grid;gap:32px}.filter-dialog-content .filter-title{margin:4px 0 12px;font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--menu-section-heading)}.filter-header{display:flex;justify-content:space-between;align-items:baseline}.filter-toggle-header{display:block;width:12px;height:12px;mask-image:url(../hypnos/icons/chevron-up.svg);mask-size:contain;background:var(--menu-section-heading);transition:transform .3s ease}.filter-toggle-header.active{transform:rotate(180deg)}.filter-section.disabled{opacity:.4;pointer-events:none}.filter-options{display:flex;flex-direction:column;gap:12px}.checkbox-wrapper,.radio-wrapper{display:flex;align-items:center;gap:12px}.sort-option-wrapper{justify-content:flex-start}.sort-option-wrapper .radio-label{flex:1}.sort-dir-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:none;background:var(--qc-sort-btn-color);border-radius:6px;cursor:pointer;margin-left:auto;transition:background .2s ease}.sort-dir-btn:hover{background:color-mix(in srgb,var(--qc-sort-btn-color) 10%,transparent)}.sort-icon{width:14px;height:14px;mask-image:url(../hypnos/icons/bars-sort.svg);mask-size:contain;mask-repeat:no-repeat;background:var(--text-color);transition:transform .2s ease}.sort-icon.sort-asc{transform:scaleY(-1)}.sort-icon.sort-desc{transform:scaleY(1)}.filter-checkbox,.filter-radio{appearance:none;width:20px;height:20px;border:2px solid var(--text-color-basic-light);cursor:pointer;position:relative;transition:all .2s ease;flex-shrink:0;padding:unset}.filter-checkbox{border-radius:4px}.filter-radio{border-radius:50%}.filter-checkbox:active,.filter-radio:active{border-color:var(--radio-button-color)}.filter-checkbox:checked,.filter-radio:checked{border-color:var(--radio-button-color)}.filter-checkbox:checked{background:var(--radio-button-color)}.filter-radio:checked::after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:10px;height:10px;border-radius:50%;background:var(--radio-button-color)}.checkbox-label,.radio-label{cursor:pointer;user-select:none;flex:1;font-size:16px;font-weight:500;color:var(--text-color-basic)}.search-input-wrapper{position:relative;width:100%}.search-filter-input{padding:10px 40px 10px 15px;border-radius:20px;background:var(--base-color);border:1px solid var(--divider-color);color:var(--text-color-basic-light);font-size:.9rem}.search-clear-btn{position:absolute;right:10px;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;width:24px;height:24px;border:none;background:0 0;border-radius:50%;color:var(--text-color);cursor:pointer;transition:background .2s ease}.xmark-icon{width:12px;height:12px;mask-image:url(../hypnos/icons/xmark.svg);mask-size:contain;mask-repeat:no-repeat;background:var(--text-color)}.dialog-button-item{padding:12px 15px;cursor:pointer;transition:all .2s ease;color:var(--text-color);font-size:.9rem;border-radius:8px;background:rgba(255,255,255,3%);border:1px solid transparent;user-select:none;min-height:44px;display:flex;align-items:center}.dialog-button-item:active{background:rgba(78,125,247,.15);transform:scale(.98)}.dialog-button-item.active{background:var(--accent-color);color:#fff;border-color:var(--accent-color)}.dialog-button-item:focus{outline:2px solid var(--accent-color);outline-offset:2px}.dialog-button-item:focus:not(:focus-visible){outline:none}.collection-headers{display:flex;gap:60px;border-radius:29px 29px 0 0;padding:24px;margin-bottom:4px;opacity:.7;box-shadow:0 4px 4px rgba(0,0,0,.25);background:linear-gradient(90deg,#74A8A7 -27.82%,#5D7A75 100%),linear-gradient(90deg,#74A8A7 0%,#283533 100%);> span{font-size:12px;font-style:normal;font-weight:600;line-height:14px;letter-spacing:1.68px;text-transform:uppercase;color:var(--base-color)}> span:last-child{margin-left:auto}}.filter-sort-controls.loading{opacity:.6;pointer-events:none}.filter-sort-controls.loading .filter-btn,.filter-sort-controls.loading .view-btn,.filter-sort-controls.loading .qc-button-group .custom-action-btn,.filter-sort-controls.loading .qc-actions-dropdown-btn,.filter-sort-controls.loading .qc-actions-dropdown-item{cursor:progress}.cq-refresh-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:.7;z-index:10;pointer-events:none}.cq-refresh-overlay::before{content:"";display:block;width:var(--cq-li-size,24px);height:var(--cq-li-size,24px);mask-image:url(../hypnos/icons/arrows-rotate.svg);mask-repeat:no-repeat;mask-position:center;background-color:var(--text-color);animation:cq-spin 1.25s linear infinite}.cq-loading-indicator{display:flex;flex-direction:column;align-items:center;gap:12px;padding:16px 0;grid-column:1/-1}.cq-loading-indicator::before{content:"";display:block;width:var(--cq-li-size);height:var(--cq-li-size);mask-image:url(../hypnos/icons/arrows-rotate.svg);mask-repeat:no-repeat;mask-position:center;background-color:var(--text-color);animation:cq-spin 1.25s linear infinite}.cq-loading-indicator-text{color:var(--secondary-text);font-size:clamp(.75rem,2vw,.95rem)}.infinite-scroll-sentinel{visibility:hidden;width:100%;height:1px}.query-message{text-align:center;padding:32px 16px;grid-column:1/-1}.query-message h3{color:var(--base-color-light);margin-bottom:12px}.query-message p{color:var(--secondary-text)}[data-cq=grid]{display:grid;gap:16px;grid-template-columns:1fr;position:relative;min-height:120px}[data-cq=grid]:has(.badge-card){grid-template-columns:1fr;gap:0}[data-cq=grid]:has(.leaderboard-card){gap:4px}@media(min-width:1025px){[data-cq=grid]:has(.game-card,.brand-card,.developer-card,.class-card){grid-template-columns:repeat(3,1fr)}[data-cq=grid]:has(.badge-card){grid-template-columns:repeat(3,1fr);gap:6px}[data-cq=grid]:has(.leaderboard-card){gap:6px}.query-message{padding:48px 32px}}@media(min-width:601px) and (max-width:1024px){[data-cq=grid]:has(.game-card,.brand-card,.developer-card,.class-card){grid-template-columns:repeat(2,1fr)}[data-cq=grid]:has(.badge-card){grid-template-columns:repeat(2,1fr);gap:6px}}@media(max-width:600px){[data-cq=grid]:has(.game-card,.brand-card,.developer-card,.class-card){grid-template-columns:repeat(2,1fr);gap:0}}@media(max-width:454px){.qc-button-group{display:none}.qc-actions-dropdown{display:block}}body.SwWide{.custom-action-btn.ca-btn-text{padding:8px 16px}.query-message{padding:40px 32px;border-radius:15px;background:var(--new-card-bg);border:1px solid var(--text-color-primary)}.query-message h3{margin-bottom:16px}}