:root {
    --bg: #f6f7f9;
    --panel: #ffffff;
    --text: #111827;
    --muted: #6b7280;
    --border: #e5e7eb;
    --shadow: 0 2px 12px rgba(17,24,39,.06);
    --radius: 12px;
    --error-background: rgba(239,68,68,.08);
    --error-border: 1px solid rgba(239,68,68,.35);
    --error-text: #b91c1c;
    /* Superficies */
    --panel-soft: #f9fafb;
    --panel-hover: #f3f4f6;
    /* Texto */
    --text-soft: #374151;
    --text-inverse: #ffffff;
    /* Accentos */
    --primary: #2e7dff;
    --success: #34c759;
    --warning: #ffc107;
    --danger: #ff3b30;
    /* Overlays */
    --overlay: rgba(17,24,39,.55);
    /* Estados translúcidos */
    --tint-1: rgba(17,24,39,.04);
    --tint-2: rgba(17,24,39,.06);
    --tint-3: rgba(17,24,39,.10);
}

* {

    box-sizing: border-box;

}

html, body {

    height: 100%;

}

body {

    margin: 0;

    font-family: "Segoe UI", system-ui, -apple-system, Arial, sans-serif;

    background: var(--bg);

    color: var(--text);

}

.hidden {

    display: none !important;

}

.muted {

    color: var(--muted);

    font-weight: 600;

}