:root{--fond:#FFFCF0;--carte:#F2F0E5;--texte:#100F0F;--doux:#6F6E69;--trait:#DAD8CE;--rouge:#AF3029;--orange:#BC5215;--vert:#66800B;--bleu:#205EA6;--btn:#205EA6;--btn-t:#fff}
@media (prefers-color-scheme:dark){:root{--fond:#100F0F;--carte:#1C1B1A;--texte:#CECDC3;--doux:#878580;--trait:#343331;--rouge:#D14D41;--orange:#DA702C;--vert:#879A39;--bleu:#4385BE;--btn:#4385BE;--btn-t:#100F0F}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fond);color:var(--texte);font:16px/1.45 -apple-system,"Segoe UI",Roboto,sans-serif;padding-bottom:calc(64px + env(safe-area-inset-bottom))}
main{max-width:780px;margin:0 auto;padding:16px 16px 24px}
h1{font-size:1.4rem;margin:.2rem 0 .2rem}
h2{font-size:1.05rem;margin:1.5rem 0 .5rem;border-bottom:1px solid var(--trait);padding-bottom:.25rem}
.sous{color:var(--doux);font-size:.85rem}
.carte{background:var(--carte);border-radius:10px;padding:.8rem .95rem;margin:.5rem 0}
.grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.6rem}
.chiffre{font-size:1.9rem;font-weight:700;line-height:1.1}
.ok{color:var(--vert);font-weight:600}.ko{color:var(--orange);font-weight:600}.mal{color:var(--rouge);font-weight:600}
.alerte{background:var(--rouge);color:#fff;padding:.7rem .9rem;border-radius:10px;font-weight:600;margin:.6rem 0}
ul{list-style:none;padding:0;margin:0}li{padding:.45rem 0;border-bottom:1px solid var(--trait)}li:last-child{border-bottom:0}
.p{color:var(--doux);font-size:.78rem;word-break:break-all}
button,.bouton{font:inherit;background:var(--btn);color:var(--btn-t);border:0;border-radius:10px;padding:.7rem 1rem;min-height:44px;cursor:pointer}
button.second{background:var(--carte);color:var(--texte);border:1px solid var(--trait)}
button:disabled{opacity:.5}
input[type=text],select{font:inherit;width:100%;min-height:44px;padding:.6rem;border-radius:10px;border:1px solid var(--trait);background:var(--fond);color:var(--texte)}
details{background:var(--carte);border-radius:10px;padding:.55rem .85rem;margin:.45rem 0}
summary{cursor:pointer;font-weight:600;min-height:32px;display:flex;align-items:center;gap:.4rem}
.n{color:var(--doux);font-weight:400}
label.case{display:flex;gap:.7rem;align-items:flex-start;padding:.55rem 0;min-height:44px;border-bottom:1px solid var(--trait)}
label.case input{width:26px;height:26px;flex:none;margin-top:.1rem}
label.case.fait span{text-decoration:line-through;color:var(--doux)}
.badge{display:inline-block;font-size:.72rem;padding:.05rem .45rem;border-radius:99px;background:var(--trait);color:var(--texte);margin-left:.3rem}
#nav{position:fixed;left:0;right:0;bottom:0;display:flex;background:var(--carte);border-top:1px solid var(--trait);padding-bottom:env(safe-area-inset-bottom);z-index:5}
#nav[hidden]{display:none}
#nav button{flex:1;background:transparent;color:var(--doux);border-radius:0;padding:.5rem .1rem;font-size:.78rem;min-height:56px}
#nav button.actif{color:var(--btn);font-weight:700}
#toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(76px + env(safe-area-inset-bottom));background:var(--texte);color:var(--fond);padding:.6rem 1rem;border-radius:10px;z-index:9;max-width:90%}
#toast[hidden]{display:none}
.centre{min-height:70vh;display:flex;flex-direction:column;justify-content:center;gap:1rem;text-align:center}
.centre button{font-size:1.1rem;padding:1rem}