body { font-family: 'Segoe UI', system-ui, sans-serif; }
        .hero { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; }
        table { font-size: 1.1rem; }
        .rule-box { background-color: #f8f9fa; border-left: 5px solid #667eea; }

/* Mode clair */
.rule-box {
    background-color: #f8f9fa;
    color: #212529;
    border: 1px solid #dee2e6;
}

/* Mode sombre */
[data-bs-theme="dark"] .rule-box {
    background-color: #212529;
    color: #f8f9fa;
    border-color: #495057;
}

/* Les cartes à l'intérieur de rule-box */
[data-bs-theme="dark"] .rule-box .card {
    background-color: #343a40;
    color: #f8f9fa;
    border-color: #495057;
}

/* Les titres et paragraphes */
[data-bs-theme="dark"] .rule-box h5,
[data-bs-theme="dark"] .rule-box p {
    color: #f8f9fa;
}