/* ═══════════════════════════════════════════════ ads.css — стили рекламных слотов ПазлМейкер Подключается в всех страниц ═══════════════════════════════════════════════ */ /* Контейнер слота */ .ad-slot { display: none; /* скрыт по умолчанию, ads.js покажет если ADS_ENABLED */ width: 100%; max-width: 100%; overflow: hidden; align-items: center; justify-content: center; min-height: 90px; margin: 16px 0; border-radius: 12px; } /* Тестовый плейсхолдер */ .ad-placeholder { width: 100%; max-width: 100%; box-sizing: border-box; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 18px 24px; background: repeating-linear-gradient( 45deg, rgba(99,102,241,.04), rgba(99,102,241,.04) 10px, transparent 10px, transparent 20px ); border: 1.5px dashed rgba(99,102,241,.3); border-radius: 12px; min-height: 90px; cursor: default; user-select: none; } .ad-placeholder .ad-icon { color: rgba(129,140,248,.5); flex-shrink: 0; } .ad-placeholder-text { font-size: 12px; font-weight: 600; color: rgba(129,140,248,.5); letter-spacing: .3px; white-space: normal; word-break: break-word; text-align: center; } [data-theme="light"] .ad-placeholder { background: repeating-linear-gradient( 45deg, rgba(79,70,229,.04), rgba(79,70,229,.04) 10px, transparent 10px, transparent 20px ); border-color: rgba(79,70,229,.25); } [data-theme="light"] .ad-placeholder .ad-icon, [data-theme="light"] .ad-placeholder-text { color: rgba(79,70,229,.45); } /* Маленький горизонтальный слот (300×100 и меньше) */ .ad-slot.ad-sm { min-height: 60px; } .ad-slot.ad-sm .ad-placeholder { min-height: 60px; padding: 12px 16px; } /* Квадратный/прямоугольный блок (300×250) */ .ad-slot.ad-rect { max-width: 336px; min-height: 280px; margin: 16px auto; } .ad-slot.ad-rect .ad-placeholder { flex-direction: column; gap: 8px; min-height: 280px; }