@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;700;900&family=JetBrains+Mono:wght@400;700&display=swap');

:root {
    --neon: #CCFF00;
    --black: #000000;
    --white: #FFFFFF;
}

/* СБРОС И БАЗА */
html { 
    font-size: 16px; 
    -webkit-text-size-adjust: 100%; /* Фикс размера шрифта на iOS */
    scroll-behavior: smooth; 
}

body { 
    background-color: var(--white); 
    color: var(--black); 
    font-family: 'Inter', sans-serif; 
    margin: 0; 
    overflow-x: hidden; /* Запрет гориз. прокрутки */
    word-wrap: break-word; /* Нормальный перенос слов */
    padding-top: 55px;
}

/* ТИПОГРАФИКА */
/* На мобилках шрифт меньше, чтобы влезал, на десктопе огромный */
h1 { 
    font-size: clamp(2.5rem, 11vw, 8rem); 
    line-height: 0.95; 
    letter-spacing: -0.03em;
}
h2 { font-size: clamp(2rem, 7vw, 5rem); line-height: 1.1; }
h3 { font-size: clamp(1.5rem, 5vw, 3rem); }

.tight-heading { letter-spacing: -0.04em; }
.font-mono { font-family: 'JetBrains Mono', monospace; }

/* КОНТЕЙНЕРЫ */
.container-custom { 
    width: 100%; 
    max-width: 1400px; 
    margin: 0 auto; 
    padding: 0 20px; /* Безопасные отступы по бокам */
}

/* ФОРМА И МОДАЛКА */
.modal-backdrop { z-index: 9999 !important; }
.modal-content {
    width: 95% !important;
    max-width: 500px;
    max-height: 90vh;
    overflow-y: auto;
}

/* ЖИРНЫЕ ПОЛЯ ВВОДА ДЛЯ МОБИЛОК */
input { 
    font-size: 16px !important; /* Чтобы iOS не приближал экран */
    padding: 18px !important;   /* Высокие поля */
    border-radius: 0 !important; 
    appearance: none;
    background: #fff;
    color: #000;
}

/* ТАБЛИЦА (Горизонтальный скролл) */
.table-wrapper { 
    width: 100%; 
    overflow-x: auto; 
    -webkit-overflow-scrolling: touch; 
    margin-bottom: 20px;
    border: 3px solid #000;
}
table { min-width: 650px; } /* Чтобы таблица не сжималась в кашу */

/* ЭЛЕМЕНТЫ */
.skew-tag { transform: skewX(-10deg); display: inline-block; padding: 0 8px; }
::selection { background: var(--neon); color: var(--black); }