/* =====================================================================
   web/app/app.css — styles communs de l'application (mêmes variables que
   valider.html : clair/sombre automatique, mobile d'abord)
   ===================================================================== */
:root { color-scheme: light dark; --bg:#f5f6f8; --card:#fff; --txt:#1c1f24; --muted:#5f6670; --line:#e3e6ea;
        --ok:#1f8a4c; --warn:#b8741b; --err:#b42323; --btn:#1a73e8; --btn2:#eef1f4; --btn2txt:#1c1f24; }
@media (prefers-color-scheme: dark) { :root { --bg:#111417; --card:#1b1f24; --txt:#eceff3; --muted:#9aa3ad; --line:#2b3138; --btn2:#2b3138; --btn2txt:#eceff3; } }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--txt); font:16px/1.5 -apple-system, "Segoe UI", Roboto, sans-serif;
       padding: env(safe-area-inset-top,0) 0 env(safe-area-inset-bottom,0); }
a { color: var(--btn); }
.wrap { max-width:720px; margin:0 auto; padding:0 12px 40px; }
.card { margin:16px 0; padding:20px; background:var(--card); border-radius:14px; border:1px solid var(--line); }
h1 { font-size:1.35rem; margin:0 0 12px; }
h2 { font-size:1.1rem; margin:0 0 10px; }
p { margin:8px 0; } .muted { color:var(--muted); font-size:.93rem; }
.tag { display:inline-block; padding:2px 10px; border-radius:999px; font-size:.85rem; font-weight:600; }
.ok { background:#e6f4ec; color:var(--ok); } .warn { background:#fdf1e1; color:var(--warn); } .err { background:#fbe7e7; color:var(--err); }
.neutre { background:var(--btn2); color:var(--btn2txt); }
.stars { color:#f4b400; letter-spacing:2px; }
blockquote { margin:10px 0; padding:10px 14px; border-left:4px solid var(--line); background:var(--bg); border-radius:8px; }
.draft { padding:12px; border:1px solid var(--line); border-radius:10px; white-space:pre-wrap; line-height:1.55; background:var(--bg); }
label { display:block; font-weight:600; margin:14px 0 4px; }
label .aide { display:block; font-weight:400; color:var(--muted); font-size:.9rem; }
input[type=text], input[type=email], input[type=tel], input[type=url], select, textarea {
  width:100%; padding:11px 12px; font:inherit; border:1px solid var(--line); border-radius:10px; background:var(--bg); color:var(--txt); }
textarea { min-height:160px; resize:vertical; }
.choix { display:flex; gap:10px; align-items:flex-start; padding:10px 12px; border:1px solid var(--line); border-radius:10px; margin:8px 0; cursor:pointer; font-weight:400; }
.choix input { margin-top:5px; }
.choix strong { display:block; }
button, .btn { display:block; margin-top:12px; width:100%; padding:13px; border:0; border-radius:10px; background:var(--btn); color:#fff;
               font:600 1rem inherit; cursor:pointer; text-align:center; text-decoration:none; }
button.secondary, .btn.secondary { background:var(--btn2); color:var(--btn2txt); }
button.danger { background:transparent; color:var(--err); border:1px solid var(--err); }
button.link { background:none; color:var(--muted); text-decoration:underline; padding:0; width:auto; display:inline; font-weight:400; margin:0; }
button:disabled { opacity:.6; cursor:wait; }
.ligne { display:flex; gap:10px; flex-wrap:wrap; } .ligne > * { flex:1 1 140px; margin-top:0; }
.entete { display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; padding:14px 0; }
.entete .titre { font-weight:700; font-size:1.15rem; }
.entete nav a { margin-left:14px; }
.bandeau { margin:12px 0; padding:12px 14px; border-radius:10px; border:1px solid var(--line); }
.bandeau.ok { border-color:var(--ok); } .bandeau.warn { border-color:var(--warn); } .bandeau.err { border-color:var(--err); }
.avis { padding:14px 0; border-top:1px solid var(--line); }
.avis:first-child { border-top:0; }
.avis .meta { display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap; align-items:center; }
.actions { display:flex; gap:8px; flex-wrap:wrap; } .actions button { flex:1 1 150px; }
.hidden { display:none; }
.count { text-align:right; } .count.over { color:var(--err); font-weight:600; }
.switch { display:flex; align-items:center; gap:10px; margin:8px 0; }
.fiche { padding:10px 0; border-top:1px solid var(--line); } .fiche:first-child { border-top:0; }
code { background:var(--bg); padding:2px 6px; border-radius:6px; word-break:break-all; }
@media print {
  body { background:#fff; color:#000; }
  .no-print { display:none !important; }
  .wrap { max-width:none; padding:0; }
  .card { border:0; margin:0; }
}

/* Pied de page : liens légaux (mission 5) */
.pied { text-align:center; color:var(--muted); font-size:.85rem; padding:8px 12px 28px; }
.pied a { color:var(--muted); }