.shop-page { background: #111113; }
.shop-page .menu__link--active { color: #bbb2ff; }
.shop-main { min-height: calc(100vh - 101px); padding: 38px 20px 70px; background: radial-gradient(circle at 90% 0, rgba(69,52,130,.09), transparent 35%), #111113; }
.shop-container { width: min(1272px, 100%); margin: 0 auto; }
.breadcrumbs { display: flex; gap: 12px; color: #9b97b0; font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.breadcrumbs a:hover { color: #a697ff; }.breadcrumbs strong { color: #eeeaf0; }.breadcrumbs span { color: #5d596b; }
.shop-title-row { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 10px 0 26px; border-bottom: 1px solid #29282e; }
.shop-title-row h1 { margin: 0; color: #b0acbd; font-family: "Arial Black", Impact, sans-serif; font-size: clamp(28px,3vw,38px); letter-spacing: -.04em; }.shop-title-row h1 span { color: #8170ff; }
.league-tabs { display: flex; gap: 8px; }.league-tabs button { min-height: 31px; padding: 0 18px; background: #17171a; border: 1px solid #2d2c32; border-radius: 999px; color: #9995ab; font-size: 10px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; cursor: pointer; }.league-tabs button.active { background: linear-gradient(135deg,#8e7cff,#654fe5); border-color: #8270f3; color: #fff; }
.shop-layout { display: grid; grid-template-columns: 256px 1fr; gap: 36px; padding-top: 24px; }.search-label,.shop-sidebar > h2 { display:block; margin: 0 0 11px; color:#a9a1d5; font-size:10px; font-weight:800; letter-spacing:.25em; text-transform:uppercase; }.shop-search { position:relative; margin-bottom:25px; }.shop-search input { width:100%; height:39px; padding:0 38px 0 13px; background:#202023; border:1px solid #3b3941; border-radius:7px; color:#e9e6ed; outline:none; }.shop-search input:focus { border-color:#6a5cb0; }.shop-search svg { position:absolute; top:11px; right:12px; width:17px; fill:none; stroke:#9996a0; stroke-width:1.5; }
.sidebar-game { padding: 13px 0; border-bottom:1px solid #443967; color:#e7e3e8; font-size:15px; }.category-menu { display:flex; flex-direction:column; padding:8px 0 24px; border-bottom:1px solid #29282d; }.category-menu a { display:flex; align-items:center; gap:12px; min-height:40px; color:#918e99; font-family:"Arial Black",Impact,sans-serif; font-size:16px; }.category-menu a.active { color:#c9c4e1; }.category-menu a span { display:grid; place-items:center; width:25px; height:25px; background:#202022; border-radius:7px; color:#afa3ff; font-family:Arial; font-size:12px; }.category-menu small { margin-left:auto; font-family:Arial; font-size:10px; }.category-menu em { margin-left:auto; color:#7e719e; font-family:Arial; font-size:8px; font-style:normal; text-transform:uppercase; }.category-menu .category-sub { min-height:31px; margin-left:12px; padding:5px 6px 5px 13px; border-left:1px solid #2f2c36; color:#8e8997; font-family:Arial; font-size:11px; line-height:1.2; }.category-menu .category-sub.active{border-left-color:#9382ff;background:linear-gradient(90deg,rgba(117,96,228,.12),transparent);color:#cfc7ff}.category-menu .category-sub em{margin-left:auto}.all-categories { display:block; margin:19px 0 30px; color:#a99fe2; font-size:10px; letter-spacing:.16em; text-align:center; text-transform:uppercase; }.rate-note { padding:13px; background:#1b1b1d; border:1px solid #2e2d32; border-radius:10px; color:#5f5c6b; font-size:9px; line-height:1.6; }
.sorting { display:flex; align-items:center; flex-wrap:wrap; gap:8px; padding-bottom:12px; }.sorting span,.results-bar > span { color:#69637f; font-size:10px; text-transform:uppercase; }.sorting button,.results-bar button { min-height:28px; padding:0 13px; background:#17171a; border:1px solid #2d2c31; border-radius:999px; color:#9691a7; font-size:10px; cursor:pointer; }.sorting button.active { border-color:#5946a4; color:#eee9ff; }.results-bar { display:flex; align-items:center; gap:8px; min-height:48px; margin-bottom:16px; border-bottom:1px solid #29282d; }.results-bar strong { margin-right:4px; color:#a9a5b4; font-size:12px; }.results-bar strong b { color:#fff; font-size:14px; }.results-bar button { width:34px; padding:0; border-radius:8px; }.results-bar button.active { border-color:#604eb1; color:#fff; }
.shop-products-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }.shop-product { overflow:hidden; background:#1b1b1c; border:1px solid #303034; border-radius:15px; transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease; }.shop-product:hover,.shop-product.featured { border-color:#554887; box-shadow:0 15px 30px rgba(0,0,0,.22); }.shop-product:hover { transform:translateY(-5px); }.shop-product__visual { position:relative; display:block; height:223px; background-image:url('assets/poe1-currency-atlas.png'); background-repeat:no-repeat; background-size:200% 200%; transition:filter .3s ease; }.shop-product:hover .shop-product__visual { filter:brightness(1.12) saturate(1.08); }.shop-product__visual--1{background-position:0 0}.shop-product__visual--2{background-position:100% 0}.shop-product__visual--3{background-position:0 100%}.shop-product__visual--4{background-position:100% 100%}.shop-product__visual small { position:absolute; z-index:2; right:0; bottom:9px; left:0; color:#504d59; font-size:7px; text-align:center; text-transform:uppercase; }.hit-badge { position:absolute; z-index:1; top:11px; left:10px; padding:4px 8px; background:rgba(68,62,84,.88); border:1px solid #716391; border-radius:999px; color:#d5cee6; font-size:8px; font-weight:800; text-transform:uppercase; }
.shop-product__body { min-height:190px; padding:16px; border-top:1px solid #2c2b30; }.shop-product h2 { min-height:45px; margin:0 0 7px; color:#f1ede7; font-family:"Arial Black",Impact,sans-serif; font-size:17px; line-height:1.22; letter-spacing:-.035em; }.shop-product p { height:35px; margin:0 0 12px; overflow:hidden; color:#9b96ad; font-size:10px; line-height:1.55; }.league-tags { display:flex; gap:5px; margin-bottom:12px; }.league-tags b,.league-tags span { padding:4px 7px; background:#1b1b1e; border:1px solid #34323b; border-radius:7px; color:#777282; font-size:7px; text-transform:uppercase; }.league-tags b { background:#806df7; border-color:#8e7dff; color:#fff; }.shop-product__bottom { display:flex; align-items:center; justify-content:space-between; }.shop-product__bottom strong { color:#e4deff; font-family:Consolas,monospace; font-size:16px; }.shop-product__bottom button { min-height:26px; padding:0 12px; background:transparent; border:1px solid #51457e; border-radius:7px; color:#eeeaff; font-size:8px; font-weight:800; text-transform:uppercase; cursor:pointer; }.shop-product__bottom button:hover { background:#6e5be4; }
.shop-product__visual--5,.shop-product__visual--6,.shop-product__visual--7,.shop-product__visual--8,.shop-product__visual--9,.shop-product__visual--10,.shop-product__visual--11,.shop-product__visual--12{background-image:url('assets/poe1-currency-atlas-2.png');background-size:400% 200%}
.shop-product__visual--5{background-position:0 0}.shop-product__visual--6{background-position:33.333% 0}.shop-product__visual--7{background-position:66.666% 0}.shop-product__visual--8{background-position:100% 0}.shop-product__visual--9{background-position:0 100%}.shop-product__visual--10{background-position:33.333% 100%}.shop-product__visual--11{background-position:66.666% 100%}.shop-product__visual--12{background-position:100% 100%}
.shop-product__visual--13,.shop-product__visual--14,.shop-product__visual--15,.shop-product__visual--16,.shop-product__visual--17,.shop-product__visual--18,.shop-product__visual--19,.shop-product__visual--20{background-image:url('assets/poe1-currency-atlas-3.png');background-size:400% 200%}
.shop-product__visual--13{background-position:0 0}.shop-product__visual--14{background-position:33.333% 0}.shop-product__visual--15{background-position:66.666% 0}.shop-product__visual--16{background-position:100% 0}.shop-product__visual--17{background-position:0 100%}.shop-product__visual--18{background-position:33.333% 100%}.shop-product__visual--19{background-position:66.666% 100%}.shop-product__visual--20{background-position:100% 100%}
.shop-product__visual--21,.shop-product__visual--22,.shop-product__visual--23,.shop-product__visual--24,.shop-product__visual--25{background-image:url('assets/poe1-currency-atlas-4.png');background-size:300% 200%}
.shop-product__visual--21{background-position:0 0}.shop-product__visual--22{background-position:50% 0}.shop-product__visual--23{background-position:100% 0}.shop-product__visual--24{background-position:0 100%}.shop-product__visual--25{background-position:50% 100%}
.pagination{display:flex;align-items:center;justify-content:center;gap:5px;margin-top:28px}.pagination button,.pagination span{display:grid;place-items:center;width:34px;height:34px;background:#19191c;border:1px solid #2d2c32;border-radius:7px;color:#858091;font-size:12px}.pagination button{cursor:pointer}.pagination button:hover,.pagination button.active{background:linear-gradient(135deg,#8b79ff,#6551df);border-color:#8e7cff;color:#fff}.pagination button:disabled{opacity:.35;cursor:default}.pagination span{border:0;background:transparent}
.shop-product__visual[style*="--product-hue"]{filter:hue-rotate(var(--product-hue))}.shop-product:hover .shop-product__visual[style*="--product-hue"]{filter:hue-rotate(var(--product-hue)) brightness(1.12) saturate(1.08)}
.accessories-page .shop-product__visual,.shop-product__visual.real-product-image{position:relative;display:block;overflow:hidden;background-image:none;background:radial-gradient(circle at 50% 44%,rgba(162,139,70,.32),transparent 57%),#1b1a18}.accessories-page .shop-product__visual img,.real-product-image img{position:absolute;z-index:1;top:50%;left:50%;width:72%;height:72%;max-width:72%;max-height:72%;object-fit:contain;transform:translate(-50%,-50%);transform-origin:center;filter:drop-shadow(0 10px 22px rgba(0,0,0,.55));transition:transform .3s ease}.accessories-page .shop-product:hover .shop-product__visual img,.shop-product:hover .real-product-image img{transform:translate(-50%,-50%) scale(1.06)}
@media(max-width:1150px){.shop-title-row{align-items:flex-start;flex-direction:column}.shop-layout{grid-template-columns:220px 1fr}.shop-products-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.shop-main{padding-inline:12px}.shop-layout{grid-template-columns:1fr}.shop-sidebar{display:none}.league-tabs{overflow-x:auto;width:100%;padding-bottom:5px}.league-tabs button{flex:0 0 auto}.shop-products-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:500px){.breadcrumbs{font-size:8px}.shop-title-row h1{font-size:27px}.sorting button:nth-last-child(-n+3){display:none}.shop-products-grid{grid-template-columns:1fr}.shop-product__visual{height:280px}.shop-product__body{min-height:175px}}