/* ===== БАЗОВЫЕ СТИЛИ ===== */
:root {
    /* Основные шрифты */
    --font-mono: 'JetBrains Mono', 'Fira Code', 'Courier New', monospace;
    --font-display: 'Orbitron', 'Share Tech Mono', 'Segoe UI', sans-serif;
    --font-tech: 'Share Tech Mono', 'Courier New', monospace;

    /* Размеры */
    --font-size-xs: 11px;
    --font-size-sm: 13px;
    --font-size-base: 15px;
    --font-size-lg: 17px;
    --font-size-xl: 20px;
    --font-size-2xl: 24px;
    --font-size-3xl: 30px;

    /* Веса */
    --font-weight-normal: 400;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: var(--font-mono);
    background: #0a0f0a; /* Чуть светлее для лучшего контраста */
    color: #00ff88;
    padding: 12px;
    font-size: var(--font-size-base);
    line-height: 1.7;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ===== ЗАГОЛОВКИ ===== */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-display);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-weight: var(--font-weight-bold);
    margin: 0;
    color: #00ff88;
}

h1 {
    font-size: var(--font-size-2xl);
    text-shadow: 0 0 30px rgba(0, 255, 136, 0.2);
}

h2 {
    font-size: var(--font-size-xl);
}

h3 {
    font-size: var(--font-size-lg);
}

/* ===== МОНОШИРИННЫЙ ТЕКСТ ===== */
code, pre, .mono {
    font-family: var(--font-mono);
    font-weight: var(--font-weight-normal);
}

/* ===== ТЕХНИЧЕСКИЙ ТЕКСТ ===== */
.status-text,
.value-text,
.signal-text,
.tech-text {
    font-family: var(--font-tech);
    letter-spacing: 0.03em;
}

/* ===== УЛУЧШЕНИЯ ЧИТАЕМОСТИ ===== */
.text-muted {
    opacity: 0.6;
    color: #88ffbb;
}

.text-bold {
    font-weight: var(--font-weight-bold);
}

.text-semibold {
    font-weight: var(--font-weight-semibold);
}

/* ===== ССЫЛКИ ===== */
a {
    color: #00ff88;
    text-decoration: none;
    transition: all 0.3s ease;
    font-weight: var(--font-weight-semibold);
}

a:hover {
    color: #66ffbb;
    text-shadow: 0 0 25px rgba(0, 255, 136, 0.2);
}
/* ===== УЛУЧШЕННЫЙ СКРОЛЛ НА МОБИЛЬНЫХ ===== */
* {
    -webkit-tap-highlight-color: transparent;
}

/* Плавный скролл */
html {
    scroll-behavior: smooth;
}

/* Улучшенный скролл на мобильных */
.panel,
.logs-content,
.logs-sidebar,
#history,
#dataTableContainer {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
}

/* Убираем скролл-бары на мобильных где не нужно */
@media (max-width: 768px) {
    .panel::-webkit-scrollbar,
    .logs-content::-webkit-scrollbar,
    .logs-sidebar::-webkit-scrollbar {
        width: 3px;
    }
}