/* ── v368: модалка прийняття правил спільноти ── Rules-gate без цих дверей був би просто стіною. Токени звірені з tokens.css. */ .kp-rules-gate { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: var(--n-s-4); } .kp-rules-gate__overlay { position: absolute; inset: 0; background: rgb(0 0 0 / 55%); } .kp-rules-gate__card { position: relative; max-width: 560px; width: 100%; max-height: 80vh; overflow-y: auto; padding: var(--n-s-5); border: 1px solid var(--n-border); border-radius: var(--n-r-lg); background: var(--n-bg); color: var(--n-text); } .kp-rules-gate__title { margin: 0 0 var(--n-s-2); font-size: 1.25rem; } .kp-rules-gate__lead { margin: 0 0 var(--n-s-4); opacity: 0.8; font-size: 0.9rem; } .kp-rules-gate__rule { display: flex; gap: var(--n-s-3); padding: var(--n-s-3) 0; border-top: 1px solid var(--n-border); } .kp-rules-gate__num { flex: none; width: 1.6rem; height: 1.6rem; display: grid; place-items: center; border-radius: var(--n-r-pill); background: var(--n-border); font-size: 0.8rem; } .kp-rules-gate__rule p { margin: 0.25rem 0 0; font-size: 0.9rem; opacity: 0.85; } .kp-rules-gate__actions { display: flex; justify-content: flex-end; gap: var(--n-s-2); margin-top: var(--n-s-4); } /* ── v1.1.5.408 (READY-P0-05) ──────────────────────────────────────────────────────────────── * Блокування скролу під модалкою. Без цього сторінка позаду прокручується разом із модалкою — * і aria-modal="true" стає просто написом. */ body.kp-rules-gate-lock { overflow: hidden; } /* Повідомлення «правила не прочитались» (v393). Воно існувало РІК без жодного стилю: створювалось, * додавалось у кінець і губилось унизу сторінки — тобто фікс «мовчазного глухого кута» * сам був мовчазним. Поведінка без вигляду — не фіча. */ .kp-rules-notice { position: fixed; left: 50%; bottom: var(--n-s-5); transform: translateX(-50%); z-index: 10000; max-width: min(90vw, 420px); padding: var(--n-s-3) var(--n-s-4); border: 1px solid var(--n-border); border-radius: var(--n-r-lg); background: var(--n-bg); color: var(--n-text); box-shadow: 0 8px 24px rgb(0 0 0 / 25%); font-size: 0.9rem; text-align: center; }