/* ===================== */ /* ГЛОБАЛЬНО */ /* ===================== */ * { box-sizing: border-box; } /* ===================== */ /* СЕТКА МАГАЗИНА */ /* ===================== */ .store-layout { max-width: 1200px; margin: 2.5rem auto; display: grid; grid-template-columns: 280px 1fr; gap: 2rem; } @media (max-width: 1024px) { .store-layout { grid-template-columns: 1fr; } } /* ===================== */ /* БОНУСНЫЙ ВИДЖЕТ */ /* ===================== */ .bonus-widget { width: 100%; background: linear-gradient(180deg, #0e0b1f, #120f2a); border-radius: 16px; padding: 14px; font-family: Inter, Arial, sans-serif; color: #fff; box-shadow: 0 15px 40px rgba(0,0,0,.6); border: 1px solid #6d28d9; animation: bonusFadeIn .7s ease-out; transition: box-shadow .3s ease; } .bonus-widget:hover { box-shadow: 0 15px 40px rgba(0,0,0,.6), 0 0 25px rgba(124,58,237,.6); } @keyframes bonusFadeIn { from { opacity: 0; transform: translateY(25px) scale(.97); } to { opacity: 1; transform: translateY(0) scale(1); } } .bonus-header { background: linear-gradient(135deg, #7c3aed, #a855f7); text-align: center; padding: 10px; border-radius: 12px; font-weight: 600; font-size: 14px; margin-bottom: 12px; box-shadow: 0 0 10px rgba(168,85,247,.6); } /* ===================== */ /* СТРОКИ БОНУСОВ */ /* ===================== */ .bonus-row { display: flex; gap: 8px; margin-bottom: 8px; transition: transform .25s ease, box-shadow .25s ease; } .bonus-row:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(124,58,237,.45); } .bonus-amount { flex: 1; background: rgba(255,255,255,0.12); border-radius: 10px; padding: 8px 0; text-align: center; font-size: 13px; font-weight: 500; transition: background .25s ease; } .bonus-row:hover .bonus-amount { background: rgba(255,255,255,0.18); } .bonus-value { flex: 1; background: linear-gradient(135deg, #7c3aed, #a855f7); border-radius: 10px; padding: 8px 0; text-align: center; font-size: 13px; font-weight: 600; transition: filter .25s ease; } .bonus-row:hover .bonus-value { filter: brightness(1.15); } /* ===================== */ /* КАТАЛОГ */ /* ===================== */ .products-grid { margin: 0; } /* ===================== */ /* КНОПКИ GAMESTORES */ /* ===================== */ .gs-button, .gamestores button, .widget button, .products-grid button, .buy-btn, .btn-buy, .btn { border-radius: 14px !important; padding: 10px 16px !important; font-weight: 600; background: linear-gradient(135deg, #7c3aed, #a855f7) !important; color: #fff !important; border: none !important; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, filter .2s ease; box-shadow: 0 6px 18px rgba(124,58,237,.5); } .gs-button:hover, .gamestores button:hover, .widget button:hover, .products-grid button:hover, .buy-btn:hover, .btn-buy:hover, .btn:hover { transform: translateY(-2px); filter: brightness(1.1); box-shadow: 0 10px 26px rgba(124,58,237,.7); } .gs-button:active, .gamestores button:active, .widget button:active, .products-grid button:active, .buy-btn:active, .btn-buy:active, .btn:active { transform: scale(.96); } /* =============================== */ /* CLEAN GAMING BUTTONS */ /* =============================== */ a, nav a, .menu a, .header a, button, .products-grid button, .buy-btn, .btn-buy, [class*="btn"], [class*="button"] { border-radius: 12px !important; padding: 7px 14px !important; font-weight: 600 !important; font-size: 13px !important; background: linear-gradient(135deg, #7c3aed, #a855f7) !important; color: #fff !important; border: 1px solid rgba(168,85,247,.9) !important; box-shadow: 0 0 6px rgba(168,85,247,.55), 0 6px 14px rgba(0,0,0,.7) !important; transition: all .15s ease !important; } /* Hover */ a:hover, nav a:hover, .menu a:hover, .header a:hover, button:hover, .products-grid button:hover, .buy-btn:hover, .btn-buy:hover, [class*="btn"]:hover, [class*="button"]:hover { transform: translateY(-1px); filter: brightness(1.1); box-shadow: 0 0 10px rgba(168,85,247,.85), 0 10px 22px rgba(0,0,0,.85); } /* Click */ a:active, nav a:active, .menu a:active, .header a:active, button:active, .products-grid button:active, .buy-btn:active, .btn-buy:active, [class*="btn"]:active { transform: scale(.96); box-shadow: inset 0 3px 8px rgba(0,0,0,.7), 0 0 6px rgba(124,58,237,.6); } /* PRODUCT CARDS */ .products-grid > div, .product-card, .product-item { background: linear-gradient(180deg, #0e0b1f, #140f30); border-radius: 16px; border: 1px solid rgba(124,58,237,.5); transition: transform .35s ease, box-shadow .35s ease, filter .35s ease; } .products-grid > div:hover, .product-card:hover, .product-item:hover { transform: translateY(-6px) scale(1.015); box-shadow: 0 18px 40px rgba(124,58,237,.55), 0 0 20px rgba(168,85,247,.7); filter: brightness(1.1); } /* BONUS NEON EFFECT */ .bonus-row:hover { box-shadow: 0 0 14px rgba(168,85,247,.9), 0 10px 30px rgba(124,58,237,.6); } .gs-progress-wrap { position: relative; } .gs-progress-bar { border-radius: 10px; box-shadow: 0 0 12px rgba(250,204,21,.9), inset 0 0 6px rgba(255,255,255,.35); } /* PAGE TRANSITION */ body { animation: pageFade .35s ease; } @keyframes pageFade { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } } /* ============================= */ /* GAMESTORES MONITORING PURPLE */ /* ============================= */ .Widgets-module__widgetWrapper { background: linear-gradient(180deg,#0e0b1f,#130f2b); border-radius: 18px; padding: 14px; border-left: 3px solid #7c3aed; box-shadow: 0 15px 40px rgba(0,0,0,.6), 0 0 20px rgba(124,58,237,.45); } /* Заголовок */ .MonitoringWidget-module__header { color: #fff; font-weight: 600; font-size: 16px; margin-bottom: 12px; } /* Сервер */ .MonitoringServer-module__wrapper { background: rgba(255,255,255,.04); border-radius: 14px; padding: 12px; transition: transform .25s ease, box-shadow .25s ease; } .MonitoringServer-module__wrapper:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(124,58,237,.4); } /* Название */ .MonitoringServer-module__name { color: #fff; font-size: 15px; font-weight: 600; } /* Статы */ .MonitoringServer-module__playersInfo { color: #a855f7; font-size: 12px; font-weight: 600; } /* ============================= */ /* ONLINE BAR */ /* ============================= */ .MonitoringServer-module__progressBarWrapper { margin-top: 8px; height: 12px; background: rgba(255,255,255,.1); border-radius: 12px; overflow: hidden; } /* Анимация заполнения */ .MonitoringServer-module__progressBarAnim, .MonitoringServer-module__progressBar { height: 100%; border-radius: 12px; background: linear-gradient( 90deg, #facc15, #f59e0b, #facc15 ); background-size: 200%; animation: neonMove 1.2s linear infinite; box-shadow: 0 0 10px rgba(250,204,21,.9), inset 0 0 6px rgba(255,255,255,.4); } @keyframes neonMove { from { background-position: 0%; } to { background-position: 200%; } } /* Онлайн цифры */ .MonitoringServer-module__info span { color: #fff; font-weight: 700; } /* ============================= */ /* КНОПКИ */ /* ============================= */ .MonitoringServer-module__btn, .MonitoringServer-module__link, .MonitoringWidget-module__updateBtn { background: linear-gradient(135deg,#7c3aed,#a855f7); border-radius: 12px; border: none; color: #fff; box-shadow: 0 0 12px rgba(168,85,247,.7), 0 6px 16px rgba(0,0,0,.6); transition: transform .15s ease, box-shadow .15s ease; } /* hover */ .MonitoringServer-module__btn:hover, .MonitoringServer-module__link:hover, .MonitoringWidget-module__updateBtn:hover { box-shadow: 0 0 18px rgba(168,85,247,1), 0 8px 22px rgba(0,0,0,.7); } /* click */ .MonitoringServer-module__btn:active, .MonitoringServer-module__link:active, .MonitoringWidget-module__updateBtn:active { transform: scale(.95); } /* ============================= */ /* REMOVE DEFAULT DARK BACKGROUNDS */ /* ============================= */ .boxHeader, .boxBody, .MonitoringWidget-module__body, .MonitoringWidget-module__header { background: transparent !important; box-shadow: none !important; border: none !important; } /* внутренний серый блок сервера */ .MonitoringServer-module__wrapper { background: rgba(255,255,255,.03) !important; } /* если ещё остались серые зоны */ .Widgets-module__widgetWrapper * { background-color: transparent; } /* кроме нужных элементов */ .MonitoringServer-module__wrapper, .MonitoringServer-module__progressBarWrapper, .MonitoringServer-module__progressBar, .MonitoringServer-module__progressBarAnim, .MonitoringWidget-module__updateBtn { background-color: unset; } /* ============================= */ /* SOCIAL WIDGET PURPLE (NITRO) */ /* ============================= */ .social-widget { width: 100%; background: linear-gradient(180deg, #0e0b1f, #130f2b); border-radius: 18px; padding: 14px; font-family: Inter, Arial, sans-serif; border-left: 3px solid #7c3aed; box-shadow: 0 15px 40px rgba(0,0,0,.6), 0 0 20px rgba(124,58,237,.45); animation: widgetPulse 4s ease-in-out infinite; } /* ================= */ /* Заголовок */ /* ================= */ .social-title { text-align: center; font-size: 14px; font-weight: 600; margin-bottom: 12px; color: #fff; } /* ================= */ /* Кнопки */ /* ================= */ .social-btn { display: flex; align-items: center; justify-content: center; gap: 12px; background: linear-gradient(180deg, #2c2f3e, #1f2230); color: #fff; text-decoration: none; border-radius: 14px; padding: 13px; margin-bottom: 10px; font-size: 14px; font-weight: 600; box-shadow: 0 6px 16px rgba(0,0,0,.6), 0 0 10px rgba(124,58,237,.35); transition: transform .15s ease, box-shadow .15s ease, filter .15s ease; } .social-btn:last-child { margin-bottom: 0; } .social-btn:hover { transform: translateY(-2px); filter: brightness(1.12); box-shadow: 0 0 22px rgba(168,85,247,.9), 0 10px 28px rgba(0,0,0,.85); } .social-btn:active { transform: scale(.96); } /* ================= */ /* ИКОНКИ */ /* ================= */ .social-btn .icon { width: 32px; height: 32px; border-radius: 50%; background-color: #fff; -webkit-mask-repeat: no-repeat; -webkit-mask-position: center; -webkit-mask-size: 20px; mask-repeat: no-repeat; mask-position: center; mask-size: 20px; box-shadow: inset 0 0 6px rgba(255,255,255,.25), 0 0 12px rgba(255,255,255,.2); } /* ================= */ /* ОБЩАЯ ПУЛЬСАЦИЯ */ /* ================= */ @keyframes colorPulse { 0% { filter: brightness(1) saturate(1); } 50% { filter: brightness(1.25) saturate(1.4); } 100% { filter: brightness(1) saturate(1); } } /* ================= */ /* WIDGET PULSE */ /* ================= */ @keyframes widgetPulse { 0% { box-shadow: 0 15px 40px rgba(0,0,0,.6), 0 0 18px rgba(124,58,237,.35); } 50% { box-shadow: 0 15px 40px rgba(0,0,0,.6), 0 0 30px rgba(168,85,247,.7); } 100% { box-shadow: 0 15px 40px rgba(0,0,0,.6), 0 0 18px rgba(124,58,237,.35); } } /* ================= */ /* VK */ /* ================= */ .social-btn.vk .icon { background: linear-gradient(135deg, #0077ff, #4da3ff); box-shadow: 0 0 14px rgba(0,119,255,.9), 0 0 26px rgba(77,163,255,.7); animation: vkBounce 3s ease-in-out infinite, colorPulse 4s ease-in-out infinite; -webkit-mask-image: url("data:image/svg+xml;utf8,\ \ \ "); } @keyframes vkBounce { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-4px); } } /* ================= */ /* DISCORD */ /* ================= */ .social-btn.discord .icon { background: linear-gradient(135deg, #5865f2, #7b84ff); box-shadow: 0 0 14px rgba(88,101,242,.9), 0 0 26px rgba(123,132,255,.7); animation: discordWave 3.5s ease-in-out infinite, colorPulse 5s ease-in-out infinite; -webkit-mask-image: url("data:image/svg+xml;utf8,\ \ \ "); } @keyframes discordWave { 0% { transform: rotate(0deg); } 25% { transform: rotate(6deg); } 50% { transform: rotate(0deg); } 75% { transform: rotate(-6deg); } 100% { transform: rotate(0deg); } } /* ================= */ /* TELEGRAM */ /* ================= */ .social-btn.telegram .icon { background: linear-gradient(135deg, #2aabee, #38c4ff); box-shadow: 0 0 14px rgba(42,171,238,.9), 0 0 26px rgba(56,196,255,.7); animation: telegramFly 4s ease-in-out infinite, colorPulse 6s ease-in-out infinite; -webkit-mask-image: url("data:image/svg+xml;utf8,\ \ \ "); } @keyframes telegramFly { 0% { transform: translate(0,0) rotate(0deg); } 50% { transform: translate(4px,-4px) rotate(6deg); } 100% { transform: translate(0,0) rotate(0deg); } } /* ============================= */ /* GAMESTORE TRANSPARENT MODE */ /* ============================= */ /* Виджет — стекло */ .social-widget { background: rgba(15, 12, 40, .25); backdrop-filter: blur(14px) saturate(1.2); -webkit-backdrop-filter: blur(14px) saturate(1.2); border-left: 2px solid rgba(124,58,237,.8); box-shadow: 0 0 40px rgba(124,58,237,.35), inset 0 0 40px rgba(124,58,237,.12); } /* ================= */ /* ПРОЗРАЧНЫЕ КНОПКИ */ /* ================= */ .social-btn { background: transparent !important; border: 1px solid rgba(255,255,255,.08); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); box-shadow: inset 0 0 0 rgba(0,0,0,0), 0 0 0 rgba(0,0,0,0); color: #fff; } /* Hover — без заливки */ .social-btn:hover { background: transparent; filter: brightness(1.15); } /* ================= */ /* НЕОНОВАЯ ОБВОДКА */ /* ================= */ .social-btn::before { inset: 0; border-radius: 14px; filter: blur(10px); } /* ================= */ /* ТЕКСТ */ /* ================= */ .social-btn span, .social-btn .label { text-shadow: 0 0 6px rgba(255,255,255,.35), 0 0 12px rgba(124,58,237,.45); } /* ================= */ /* ПРОЗРАЧНЫЕ ИКОНКИ */ /* ================= */ .social-btn .icon { background: transparent !important; backdrop-filter: none; box-shadow: 0 0 14px currentColor, 0 0 28px currentColor; } /* Цвет иконки берём из кнопки */ .social-btn.vk { color: #4da3ff; } .social-btn.discord { color: #7b84ff; } .social-btn.telegram{ color: #38c4ff; } /* ================= */ /* HOVER GLOW */ /* ================= */ .social-btn:hover .icon { animation: none; box-shadow: 0 0 20px currentColor, 0 0 40px currentColor; } /* ================= */ /* ACTIVE */ /* ================= */ .social-btn:active { transform: scale(.97); filter: brightness(1.25); } /* ============================= */ /* TRANSPARENT SOCIAL ICONS */ /* ============================= */ .social-btn .icon { background: currentColor !important; box-shadow: 0 0 12px currentColor, 0 0 26px currentColor; filter: drop-shadow(0 0 6px currentColor); } /* Убираем все заливки вокруг */ .social-btn .icon::before, .social-btn .icon::after { display: none; } /* ============================= */ /* FORCE TRANSPARENT GAMESTORE */ /* ============================= */ /* ВСЕ КНОПКИ */ .social-btn, .social-btn * { background-color: transparent !important; background-image: none !important; } /* ИКОНКИ */ .social-btn .icon { background: currentColor !important; box-shadow: 0 0 12px currentColor, 0 0 26px currentColor; } /* ============================= */ /* ВСЕ КАРТОЧКИ ТОВАРОВ */ /* ============================= */ [class*="product"], [class*="item"], [class*="card"], [class*="shop"], [class*="store"] { background: transparent !important; background-image: none !important; box-shadow: none !important; } /* ВЛОЖЕННЫЕ БЛОКИ ВНУТРИ КАРТОЧЕК */ [class*="product"] *, [class*="item"] *, [class*="card"] *, [class*="shop"] *, [class*="store"] * { background: transparent !important; } /* ГРАНИЦА + НЕОН */ [class*="product"], [class*="item"], [class*="card"], [class*="shop"], [class*="store"] { border: 1px solid rgba(255,255,255,.08); border-radius: 16px; } /* ============================= */ /* PRODUCT MODULE — TRANSPARENT */ /* ============================= */ [class^="Product-module__"] { background: transparent !important; background-image: none !important; box-shadow: none !important; } /* ================= */ /* PRODUCT IMAGE */ /* ================= */ .Product-module__img { background: transparent !important; box-shadow: none !important; border-radius: 14px; filter: drop-shadow(0 6px 14px rgba(0,0,0,.6)) drop-shadow(0 0 18px rgba(124,58,237,.45)); transition: transform .25s ease, filter .25s ease; } /* Наведение на карточку */ [class^="Product-module__"]:hover .Product-module__img { transform: translateY(-4px) scale(1.02); filter: drop-shadow(0 10px 20px rgba(0,0,0,.8)) drop-shadow(0 0 30px rgba(168,85,247,.6)); } [class^="Product-module__"] * { color: #fff; background: transparent !important; text-shadow: 0 0 6px rgba(255,255,255,.35), 0 0 12px rgba(124,58,237,.45); } /* ============================= */ /* CONTOUR GLOW ONLY */ /* ============================= */ [class^="Product-module__"] { position: relative; background: transparent !important; } /* Неоновый контур */ [class^="Product-module__"]::before { content: ""; position: absolute; inset: 0; border-radius: 18px; pointer-events: none; border: 1px solid rgba(255,255,255,.08); box-shadow: none; opacity: 0; transition: opacity .25s ease, box-shadow .25s ease; } /* Hover — только контур */ [class^="Product-module__"]:hover::before { opacity: 1; } /* ВИДЕО ФОН — ОТ УГЛА ДО УГЛА */ #bg-video { position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; min-width: 100vw; min-height: 100vh; object-fit: cover; z-index: -5; pointer-events: none; filter: brightness(0.3) contrast(1.1); } /* ============================= */ /* LANG SWITCHER (RU) FIX */ /* ============================= */ button.LangSwitcher-module__btn { padding: 2px 6px !important; min-width: auto !important; min-height: auto !important; height: auto !important; font-size: 11px !important; line-height: 1 !important; border-radius: 6px !important; box-shadow: none !important; background: transparent !important; border: 1px solid rgba(255,255,255,.25) !important; } /* Текст RU */ button.LangSwitcher-module__btn .LangSwitcher-module__currentLang { padding: 0 !important; margin: 0 !important; font-size: 11px !important; font-weight: 600 !important; line-height: 1 !important; } /* hover — аккуратно */ button.LangSwitcher-module__btn:hover { filter: brightness(1.1); box-shadow: 0 0 6px rgba(168,85,247,.6) !important; } /* active */ button.LangSwitcher-module__btn:active { transform: scale(.95); } /* ===== ОБЩАЯ ШАПКА / GAMETORES HEADER ===== */ header, .header, .header-wrapper, .top-bar, .navbar, .gamestores-header { background: transparent !important; box-shadow: none !important; border: none !important; } /* ===== ЕСЛИ НУЖЕН ЛЁГКИЙ GLASS ЭФФЕКТ (МОЖНО УДАЛИТЬ) ===== */ header, .header-wrapper, .top-bar { backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); } /* ===== КНОПКИ В ШАПКЕ ===== */ header a, header button, .navbar a, .navbar button { background: linear-gradient(135deg, #7a3cff, #9b5cff); color: #fff !important; border-radius: 14px; padding: 8px 16px; font-weight: 600; border: none; transition: all 0.25s ease; } /* ===== HOVER ЭФФЕКТ КНОПОК ===== */ header a:hover, header button:hover { transform: translateY(-1px); box-shadow: 0 6px 20px rgba(155, 92, 255, 0.45); } /* ===== КНОПКА ВОЙТИ ===== */ .header-login, .login-btn { background: linear-gradient(135deg, #8c52ff, #b084ff) !important; } /* ===== ПЕРЕКЛЮЧАТЕЛЬ ЯЗЫКА ===== */ .lang-switch, .language { background: rgba(255, 255, 255, 0.08) !important; border-radius: 12px; padding: 6px 10px; color: #fff; } /* ===== УБИРАЕМ ЛИШНИЕ ЛИНИИ ===== */ header::before, header::after { display: none !important; } /* ===== ПОИСК (Search-module__input) ===== */ .Search-module__input { background: rgba(30, 20, 55, 0.55) !important; /* полупрозрачный фон */ border: 2px solid #9b5cff !important; /* фиолетовый контур */ border-radius: 14px !important; color: #ffffff !important; padding: 12px 16px !important; outline: none !important; box-shadow: none !important; } /* placeholder */ .Search-module__input::placeholder { color: rgba(255, 255, 255, 0.55) !important; } /* focus + glow */ .Search-module__input:focus { background: rgba(40, 25, 75, 0.7) !important; border-color: #b084ff !important; box-shadow: 0 0 18px rgba(176, 132, 255, 0.55) !important; } /* ============================= */ /* TWITCH WIDGET */ /* ============================= */ .twitch-widget { width: 100%; background: linear-gradient(180deg,#0e0b1f,#130f2b); border-radius: 18px; padding: 18px; text-align: center; font-family: Inter, Arial, sans-serif; border-left: 3px solid #7c3aed; box-shadow: 0 15px 40px rgba(0,0,0,.6), 0 0 22px rgba(124,58,237,.55); transition: transform .25s ease, box-shadow .25s ease; } .twitch-widget:hover { transform: translateY(-3px); box-shadow: 0 18px 50px rgba(0,0,0,.7), 0 0 30px rgba(168,85,247,.9); } /* ================= */ /* HEADER */ /* ================= */ .twitch-title { font-size: 16px; font-weight: 700; color: #fff; margin-bottom: 16px; text-shadow: 0 0 8px rgba(168,85,247,.6); } /* ================= */ /* BUTTON */ /* ================= */ .twitch-btn { display: inline-block; padding: 10px 20px; border-radius: 14px; background: linear-gradient(135deg,#7c3aed,#a855f7); color: #fff; text-decoration: none; font-weight: 600; font-size: 14px; box-shadow: 0 0 12px rgba(168,85,247,.7), 0 6px 18px rgba(0,0,0,.6); transition: transform .15s ease, box-shadow .15s ease, filter .15s ease; } .twitch-btn:hover { transform: translateY(-2px); filter: brightness(1.1); box-shadow: 0 0 18px rgba(168,85,247,1), 0 10px 26px rgba(0,0,0,.75); } .twitch-btn:active { transform: scale(.96); } /* ================= */ /* FOOTER */ /* ================= */ .twitch-footer { margin-top: 14px; font-size: 12px; color: #c4b5fd; text-shadow: 0 0 6px rgba(124,58,237,.5); }