/** ------------------------------------------------------------------
 *  base.css — reset, tokens de diseño y tipografía
 *  ------------------------------------------------------------------ */

:root {
    /* Superficies */
    --fondo: #0d1117;
    --fondo-2: #131a24;
    --fondo-3: #1a2331;
    --superficie: #161e2a;
    --borde: #26303f;
    --borde-suave: #1f2836;

    /* Texto */
    --texto: #e6edf3;
    --texto-2: #a9b6c6;
    --texto-3: #6f7f92;

    /* Acentos */
    --primario: #ffc107;
    --primario-oscuro: #c99700;
    --secundario: #2aa5e0;
    --exito: #3fbf7f;
    --exito-suave: rgb(63 191 127 / 14%);
    --peligro: #f2616b;
    --aviso: #e0a33a;

    /* Métricas */
    --radio: 10px;
    --radio-sm: 6px;
    --ancho-lateral: 310px;
    --alto-barra: 62px;
    --sombra: 0 10px 30px rgb(0 0 0 / 35%);
    --fuente: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", sans-serif;
    --fuente-mono: "Cascadia Mono", "Fira Code", "JetBrains Mono", Consolas, "Courier New", monospace;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    background-color: var(--fondo);
    color: var(--texto);
    font-family: var(--fuente);
    font-size: 16px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 {
    line-height: 1.25;
    margin: 0 0 .6rem 0;
    font-weight: 700;
}

h1 { font-size: 1.9rem; }
h2 { font-size: 1.35rem; }
h3 { font-size: 1.05rem; }

p { margin: 0 0 1rem 0; }
p:last-child { margin-bottom: 0; }

a {
    color: var(--secundario);
    text-decoration: none;
}
a:hover { text-decoration: underline; }

ul, ol { margin: 0 0 1rem 0; padding-left: 1.2rem; }
li { margin-bottom: .35rem; }
li:last-child { margin-bottom: 0; }

code {
    font-family: var(--fuente-mono);
    font-size: .88em;
    background-color: var(--fondo-3);
    border: 1px solid var(--borde-suave);
    border-radius: 4px;
    padding: .08em .38em;
    color: #ffd97d;
}

button { font-family: inherit; }

::selection {
    background-color: rgb(255 193 7 / 30%);
}

/* Barras de scroll */
::-webkit-scrollbar { width: 11px; height: 11px; }
::-webkit-scrollbar-track { background: var(--fondo); }
::-webkit-scrollbar-thumb {
    background: #2b3646;
    border-radius: 8px;
    border: 3px solid var(--fondo);
}
::-webkit-scrollbar-thumb:hover { background: #3b4a5e; }

.visualmente-oculto {
    position: absolute;
    width: 1px; height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}