/* SPDX-FileCopyrightText: 2026 Sébastien Vidotto (Heteractis) */
/* SPDX-License-Identifier: AGPL-3.0-or-later */
:root { --fond: #f1e6cb; --texte: #33261a; --doux: #6a4f33; --lien: #0b4bc4; --filet: #b9a57c; color-scheme: light dark; }
@media (prefers-color-scheme: dark) { :root { --fond: #121316; --texte: #e8e6e1; --doux: #b3b0a8; --lien: #8db4ff; --filet: #3b3e45; } }
* { box-sizing: border-box; }
body { margin: 0; background: var(--fond); color: var(--texte); font: 17px/1.55 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; }
main { max-width: 720px; margin: 0 auto; padding: 20px 16px 40px; }
a { color: var(--lien); }
.fil { font-size: .9rem; margin: 0 0 6px; color: var(--doux); }
h1 { font-size: 1.7rem; margin: 0 0 6px; line-height: 1.2; }
.chapeau { margin: 0 0 16px; color: var(--doux); }
.assistant-hote { margin: 0 0 14px; min-height: 180px; }
.rappel { font-size: .92rem; color: var(--doux); }
.tech { border-top: 1px solid var(--filet); padding-top: 10px; margin-top: 18px; }
.tech summary { cursor: pointer; color: var(--lien); }
.tech h2 { font-size: 1.05rem; margin: 16px 0 6px; }
.tech select { max-width: 100%; min-height: 36px; }
.pied { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 24px; font-size: .92rem; }

/* Écran de veille en HTML : rien du code de l'assistant n'est chargé avant le clic. */
.veille { background: #fbf8f1; color: #1f1a14; border: 1px solid #cfc4ae; border-radius: 14px; padding: 18px; max-width: 640px; margin: 0 auto; font: 16px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; }
.veille h2 { font-size: 1.3rem; line-height: 1.25; margin: 0 0 10px; }
.veille p { margin: 0 0 10px; }
.vert { min-height: 48px; padding: 10px 22px; border-radius: 10px; border: 0; background: #1e7a34; color: #fff; font: 650 1.05rem system-ui, sans-serif; cursor: pointer; }
.vert:hover { background: #155c26; }
.vert:focus-visible { outline: 3px solid #0b4bc4; outline-offset: 2px; }
.vert[aria-busy="true"] { opacity: .8; cursor: progress; }
@media (prefers-color-scheme: dark) { .veille { background: #17181b; color: #ecebe7; border-color: #3b3e45; } .vert:focus-visible { outline-color: #8db4ff; } }
