/* ========================= PLCSPS – Global CSS (mobile-safe) ========================= */ /* 1) Базовые ресеты/устойчивость верстки */ *, *::before, *::after { box-sizing: border-box; } html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; } :root, html, body { height: 100%; width: 100%; max-width: 100%; overflow-x: hidden; } /* Медиа никогда не шире контейнера */ img, picture, video, canvas, svg, iframe, embed, object { display: block; max-width: 100%; height: auto; } /* Ссылки читаемее */ a { text-decoration-skip-ink: auto; } /* 2) Безопасные переносы для любых языков (важно: у тебя уже есть) */ h1, h2, h3, h4, h5, h6, p, li, blockquote, dd, figcaption { overflow-wrap: anywhere; /* переносить даже очень длинные слова */ word-break: normal; hyphens: auto; /* автоматические дефисы по словарям языка */ } /* 3) Утилиты (можно навешивать классами в JSX) */ .wrap { /* для обычного текста/абзацев */ overflow-wrap: anywhere; word-break: normal; hyphens: auto; } .balance { /* для заголовков: балансировка строк */ text-wrap: balance; } @supports not (text-wrap: balance) { .balance { overflow-wrap: anywhere; hyphens: auto; } } /* Обрезать всё, что вылезает по X (декоративы/градиенты/абсолюты) */ .ox-clip { overflow-x: clip; } /* лучше, чем hidden: не ломает тени */ /* 4) Формы: аккуратные размеры и фокус */ input, textarea, select, button { font: inherit; color: inherit; } input::placeholder, textarea::placeholder { opacity: .7; } /* iOS: избегаем «подскока» зума на фокусе, если будешь ставить кастомные размеры */ @supports (-webkit-touch-callout: none) { input, textarea, select { font-size: 16px; } } /* 5) Хонепот-поле (скрыто от людей, видно ботам) */ .hp-field { position: absolute !important; left: -100vw !important; top: 0 !important; width: 1px !important; height: 1px !important; opacity: 0 !important; pointer-events: none !important; } /* 6) Анимации по уважению к системным настройкам */ @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } } /* 7) Мелочи качества жизни */ .container, .mx-auto { max-width: 100%; } /* перестраховка против редких 100vw-артефактов */