:root { color-scheme: light dark; --fond: #f6f6f4; --texte: #1d1d1b; --carte: #ffffff; --bord: #d8d8d2; --accent: #2f5d50; }
@media (prefers-color-scheme: dark) { :root { --fond: #161816; --texte: #ecece6; --carte: #20231f; --bord: #3a3d38; --accent: #8cc4b0; } }
body { margin: 0; background: var(--fond); color: var(--texte); font: 16px/1.5 system-ui, sans-serif; }
main { max-width: 40rem; margin: 0 auto; padding: 1rem; }
section { background: var(--carte); border: 1px solid var(--bord); border-radius: 8px; padding: 1rem; margin: 1rem 0; }
ul { list-style: none; padding: 0; margin: 0; }
li { border-top: 1px solid var(--bord); padding: .75rem 0; }
li:first-child { border-top: none; }
.empreinte { font-family: ui-monospace, monospace; font-size: 1.15rem; letter-spacing: .05em; }
.aide { opacity: .75; font-size: .9rem; }
button { font: inherit; padding: .5rem 1rem; margin: .25rem .5rem 0 0; border-radius: 6px; border: 1px solid var(--accent); background: var(--accent); color: var(--carte); cursor: pointer; }
a.bouton { padding: .5rem 1rem; border-radius: 6px; background: var(--accent); color: var(--carte); text-decoration: none; }
button.secondaire { background: transparent; color: var(--accent); }
label { display: block; margin: .5rem 0; }
input { display: block; width: 100%; box-sizing: border-box; font: inherit; padding: .5rem; margin-top: .25rem; border: 1px solid var(--bord); border-radius: 6px; background: var(--fond); color: var(--texte); }
.erreurs { color: #b3261e; }
.avertissement { font-weight: 600; color: #7a4100; background: #fff3e0; border: 1px solid #e6a23c; border-radius: 6px; padding: .5rem; }
@media (prefers-color-scheme: dark) { .avertissement { color: #ffd8a8; background: #3a2a10; border-color: #b7791f; } }
@media (prefers-color-scheme: dark) { .erreurs { color: #f2b8b5; } }