:root{
  --vert:#1b4332; --vert-clair:#2d6a4f; --creme:#f6f4ec; --carte:#ffffff;
  --texte:#1c1c1c; --discret:#6b7266; --accent:#d8f3dc; --rouge:#b3261e;
  --orange:#b26a00; --ok:#1e7d46; --bord:#e3e1d8;
}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  background:var(--creme);color:var(--texte);padding-bottom:76px}
body.plein-ecran{display:flex;align-items:center;justify-content:center;
  min-height:100vh;padding:16px}
.entete{display:flex;justify-content:space-between;align-items:center;
  background:var(--vert);color:#fff;padding:12px 16px;
  padding-top:max(12px,env(safe-area-inset-top))}
.marque{font-weight:700;font-size:1.05rem}
.lien-sortie{color:var(--accent);font-size:.85rem;text-decoration:none}
main{max-width:720px;margin:0 auto;padding:12px 16px}
.carte{background:var(--carte);border:1px solid var(--bord);border-radius:14px;
  padding:14px 16px;margin:12px 0;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.carte h2{margin:0 0 10px;font-size:1rem;color:var(--vert)}
h1{color:var(--vert);font-size:1.25rem;margin-top:0}
.titre-section{font-size:1rem;color:var(--vert);margin:18px 4px 4px}
label{display:block;font-size:.9rem;margin:10px 0 4px;color:var(--discret)}
input,textarea,select{width:100%;padding:11px 12px;border:1px solid var(--bord);
  border-radius:10px;font:inherit;background:#fff}
textarea{resize:vertical}
button{background:var(--vert);color:#fff;border:0;border-radius:10px;
  padding:11px 18px;font:inherit;font-weight:600;cursor:pointer;margin-top:8px}
button:active{transform:scale(.98)}
button.secondaire{background:var(--accent);color:var(--vert)}
.rangee{display:flex;gap:8px;align-items:center;margin-top:8px}
.rangee>*{margin-top:0}
.rangee input,.rangee select{flex:1}
.erreur{color:var(--rouge);font-weight:600}
.discret{color:var(--discret);font-size:.85rem}
.etiquette{display:inline-block;background:var(--accent);color:var(--vert);
  border-radius:99px;padding:2px 10px;font-size:.75rem;font-weight:600;margin-right:6px}
.badge{position:absolute;top:2px;right:14px;background:var(--rouge);color:#fff;
  border-radius:99px;font-size:.65rem;padding:1px 6px;font-style:normal}
.bandeau-pause{background:var(--orange);color:#fff;text-align:center;
  padding:8px;font-weight:700;font-size:.9rem}
.nav-bas{position:fixed;bottom:0;left:0;right:0;display:flex;background:#fff;
  border-top:1px solid var(--bord);padding-bottom:env(safe-area-inset-bottom)}
.nav-bas a{position:relative;flex:1;text-align:center;padding:8px 0 6px;
  text-decoration:none;color:var(--discret);font-size:1.15rem}
.nav-bas a span{display:block;font-size:.65rem}
.jauge{height:14px;background:var(--bord);border-radius:99px;overflow:hidden}
.jauge-remplie{height:100%;background:var(--ok);border-radius:99px;transition:width .3s}
.jauge-remplie.alerte{background:var(--rouge)}
.compteurs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.compteur{text-align:center;background:var(--creme);border-radius:10px;padding:10px 4px;
  text-decoration:none;color:var(--texte)}
.compteur b{display:block;font-size:1.3rem;color:var(--vert)}
.compteur span{font-size:.68rem;color:var(--discret)}
.liste-journal{list-style:none;margin:0;padding:0}
.liste-journal li{padding:7px 0;border-bottom:1px solid var(--bord);font-size:.9rem}
.liste-journal li:last-child{border-bottom:0}
.tache-titre{font-weight:600;margin-bottom:4px}
.tache-meta{margin:6px 0}
.tache.statut-attente_marie{border-left:4px solid var(--orange)}
.tache.statut-termine{opacity:.6}
.filtres{display:flex;gap:8px}
.carte-connexion{width:100%;max-width:380px}
.carte-connexion button{width:100%}
.qr{display:flex;justify-content:center;margin:10px 0}
.qr svg{width:220px;height:220px;background:#fff;padding:8px;border-radius:10px}
.decisions textarea{margin-top:8px}
.bouton-valider{background:var(--ok);flex:1}
.bouton-corriger{background:var(--orange);flex:1}
.bouton-refuser{background:var(--rouge);flex:1}
.apercu{border:1px solid var(--bord);border-radius:10px;padding:10px;margin-top:8px;
  overflow:auto;max-height:300px}
.carte-pause{text-align:center}
.bouton-pause{background:var(--orange);width:100%}
.bouton-reprise{background:var(--ok);width:100%}
.glisse-droite{transform:translateX(60px);transition:transform .2s;background:#eafbef}
.glisse-gauche{transform:translateX(-60px);transition:transform .2s;background:#fff7e8}