/* Le Rapporteur — design institutionnel sobre (inspiré du Système de Design de l'État).
   Bleu France #000091, Rouge Marianne #e1000f, typographie système, pas de blur/glow. */
:root{
  --blue-france:#000091;
  --blue-france-hover:#1212ff;
  --blue-france-975:#f5f5fe;
  --red-marianne:#e1000f;
  --text:#161616;
  --text-mention:#666666;
  --bg:#ffffff;
  --bg-alt:#f6f6f6;
  --border:#e3e3e8;
  --border-strong:#929299;
  --success:#18753c;
  --success-bg:#e8f5ec;
  --error:#ce0500;
  --error-bg:#fff0ef;
  --radius:8px;
  --sans:-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--sans);color:var(--text);background:var(--bg-alt);line-height:1.5}
a{color:var(--blue-france)}
a:hover{color:var(--blue-france-hover)}

/* en-tête partagé */
.site{display:flex;align-items:center;gap:20px;max-width:960px;margin:0 auto;padding:14px 24px}
.site .brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--text)}
.site .logo{width:40px;height:40px;display:block;border-radius:8px}
.site .wordmark{font-weight:700;font-size:1.1rem;letter-spacing:-.01em}
.site nav{margin-left:auto;display:flex;gap:4px;flex-wrap:wrap}
.site nav a{text-decoration:none;color:var(--text);font-size:.9rem;font-weight:500;padding:8px 14px;border-radius:6px}
.site nav a:hover{background:var(--blue-france-975)}
.site nav a[aria-current="page"]{color:var(--blue-france);box-shadow:inset 0 -2px 0 var(--blue-france)}
.tricolore{height:2px;background:linear-gradient(90deg,#000091 0 33.3%,#fff 33.3% 66.6%,#e1000f 66.6% 100%)}

/* mise en page */
main{max-width:820px;margin:0 auto;padding:40px 24px 40px}
.kicker{font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--blue-france);margin-bottom:10px}
h1{font-size:1.9rem;line-height:1.2;margin:.1rem 0 .5rem;letter-spacing:-.02em}
.lead{color:var(--text-mention);max-width:620px;font-size:1.02rem;margin:0}
h2{font-size:1.25rem;margin:38px 0 14px}

/* carte */
.card{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);padding:22px 24px;box-shadow:0 1px 2px rgba(0,0,0,.04)}

/* formulaire */
.ask{display:flex;gap:10px;margin:22px 0 12px}
.ask input,.lookup input{flex:1;padding:13px 15px;font-size:1rem;font-family:inherit;color:var(--text);background:var(--bg);border:1px solid var(--border-strong);border-radius:6px;outline:none}
.ask input:focus,.lookup input:focus{border-color:var(--blue-france);box-shadow:0 0 0 2px rgba(0,0,145,.25)}
.btn{padding:13px 20px;font-size:.95rem;font-weight:600;font-family:inherit;cursor:pointer;color:#fff;background:var(--blue-france);border:1px solid var(--blue-france);border-radius:6px;text-decoration:none;display:inline-block}
.btn:hover{background:var(--blue-france-hover);border-color:var(--blue-france-hover);color:#fff}
.btn.secondary{color:var(--blue-france);background:#fff;border-color:var(--blue-france)}
.btn.secondary:hover{background:var(--blue-france-975);color:var(--blue-france)}

/* puces d'exemples */
.examples{display:flex;flex-wrap:wrap;gap:8px}
.examples button{font-family:inherit;font-size:.85rem;color:var(--blue-france);cursor:pointer;background:#fff;border:1px solid var(--border);border-radius:99px;padding:7px 14px}
.examples button:hover{background:var(--blue-france-975);border-color:var(--blue-france)}

/* résultat */
.result{margin-top:22px;border-left:4px solid var(--border-strong);animation:fade .2s ease-out}
@keyframes fade{from{opacity:0}to{opacity:1}}
.result.ok{border-left-color:var(--blue-france)}
.result.refus{border-left-color:var(--red-marianne);background:var(--error-bg)}
.result .status{font-size:.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-bottom:8px}
.result.ok .status{color:var(--blue-france)}
.result.refus .status{color:var(--red-marianne)}
.result .answer{font-size:1.05rem;line-height:1.6;margin-bottom:14px}
.result .detail{font-size:.9rem;color:var(--text-mention);margin-bottom:12px}
.loading{color:var(--text-mention)}

/* lignes de citation */
.cite{display:flex;align-items:center;gap:10px;font-size:.92rem;padding:10px 12px;border:1px solid var(--border);border-radius:6px;margin-top:8px;background:#fff}
.cite .badge{font-size:.7rem;font-weight:700;padding:3px 8px;border-radius:4px;flex:none;text-transform:uppercase;letter-spacing:.04em}
.cite.exists .badge{color:var(--success);background:var(--success-bg)}
.cite.missing .badge{color:var(--error);background:var(--error-bg)}
.cite a{font-weight:500}
.cite s{color:var(--text-mention)}
.cite .src{margin-left:auto;font-size:.75rem;color:var(--text-mention)}

footer{max-width:820px;margin:0 auto;padding:22px 24px 48px;border-top:1px solid var(--border);color:var(--text-mention);font-size:.82rem}

/* page « Comment ça marche » */
.steps{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.step{border:1px solid var(--border);border-radius:8px;padding:16px 18px;background:#fff}
.step .n{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--blue-france);color:#fff;font-size:.8rem;font-weight:700;margin-bottom:8px}
.step b{display:block;margin-bottom:4px}
.step p{margin:0;font-size:.88rem;color:var(--text-mention);line-height:1.55}
.step.refus{border-left:4px solid var(--red-marianne)}
.step.refus .n{background:var(--red-marianne)}
ul.garanties{margin:0;padding:0;list-style:none}
ul.garanties li{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--border);font-size:.95rem;line-height:1.55}
ul.garanties li:last-child{border-bottom:none}
ul.garanties .pict{flex:none;color:var(--success);font-weight:700}
ul.garanties em{color:var(--text-mention);font-style:normal;font-size:.88rem}
.endpoint{display:flex;align-items:baseline;gap:10px;margin-top:16px}
.endpoint .verb{font-size:.7rem;font-weight:700;letter-spacing:.06em;color:#fff;background:var(--blue-france);border-radius:4px;padding:3px 8px}
.endpoint code{color:var(--blue-france);font-weight:600}
.endpoint span{font-size:.88rem;color:var(--text-mention)}
pre{margin:10px 0 0;padding:16px 18px;border-radius:8px;overflow-x:auto;background:#1b1b35;font-size:.82rem;line-height:1.6;color:#e7e9f5}
pre .c{color:#9aa0c0}
code{font-family:var(--mono)}

/* page « Consulter la loi » */
.lookup{display:flex;gap:10px;margin:20px 0 14px}
.article-list{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:8px}
.doc .doc-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:4px}
.doc .num{font-size:1.15rem;font-weight:700}
.doc .code{color:var(--text-mention)}
.badge-vigueur{font-size:.72rem;font-weight:700;color:var(--success);background:var(--success-bg);border-radius:4px;padding:3px 8px}
.doc .text{white-space:pre-line;font-size:1.05rem;line-height:1.75;margin:16px 0;padding-left:16px;border-left:3px solid var(--blue-france)}
.doc .note{font-size:.82rem;color:var(--text-mention);margin:0 0 14px}
.doc .src{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.source-tag{font-size:.72rem;font-weight:700;padding:3px 8px;border-radius:4px}
.source-tag.live{color:#fff;background:var(--blue-france)}
.source-tag.local{color:var(--text-mention);background:var(--bg-alt);border:1px solid var(--border)}
.empty{color:var(--text-mention);margin:0}

@media(max-width:640px){.steps{grid-template-columns:1fr}.site nav a{padding:8px 10px}}
