:root{
  --paper:#eef0f4; --sheet:#ffffff; --ink:#17202d; --muted:#5b6575; --rule:#d3d8e1;
  --ba:#ef7c00; --c-dons:#b8325a; --c-fact:#d35400; --c-appro:#1d7448; --c-ged:#23408f; --c-sub:#7a5aa6; --c-vehi:#0e7490;
  --f-ui:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --paper:#11151c; --sheet:#1a2029; --ink:#e6e9ef; --muted:#9aa3b3; --rule:#2d3542;
  --c-dons:#ee7f9e; --c-fact:#f0883e; --c-appro:#62c693; --c-ged:#93abf2; --c-sub:#c3a6ea; --c-vehi:#4fc1d9; color-scheme:dark}}
:root[data-theme="dark"]{--paper:#11151c; --sheet:#1a2029; --ink:#e6e9ef; --muted:#9aa3b3; --rule:#2d3542;
  --c-dons:#ee7f9e; --c-fact:#f0883e; --c-appro:#62c693; --c-ged:#93abf2; --c-sub:#c3a6ea; --c-vehi:#4fc1d9; color-scheme:dark}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--paper);color:var(--ink);font-family:var(--f-ui);line-height:1.5;min-height:100vh}
.wrap{max-width:1040px;margin:0 auto;padding:7vh max(16px,env(safe-area-inset-right,0px)) 64px max(16px,env(safe-area-inset-left,0px))}
.tete{margin-bottom:28px;padding-bottom:18px;border-bottom:1px solid var(--rule)}
body{border-top:6px solid var(--ba)}
.logo{display:block;width:min(340px,80vw);height:auto;margin:0 0 22px}
:focus-visible{outline:2px solid var(--ba);outline-offset:3px}
.eyebrow{font:600 12px var(--f-ui);letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
h1{font-size:30px;margin:4px 0 6px;letter-spacing:-.01em;text-wrap:balance}
.sous{margin:0;color:var(--muted)}
.tuiles{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(290px,1fr))}
.tuile{--c:var(--accent,#23408f);position:relative;display:grid;grid-template-columns:64px 1fr;grid-template-rows:auto 1fr;column-gap:16px;row-gap:4px;align-items:start;
  min-height:150px;padding:22px 22px 20px;background:var(--sheet);border:1px solid var(--rule);border-radius:14px;text-decoration:none;color:var(--ink);
  border-top:5px solid var(--c);transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease}
a.tuile:hover,a.tuile:focus-visible{transform:translateY(-2px);box-shadow:0 10px 24px rgba(16,24,40,.10);border-color:var(--c);outline:none}
a.tuile:active{transform:translateY(0)}
.ico{grid-row:1/3;width:64px;height:64px;border-radius:14px;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 12%,transparent)}
.ico svg{width:34px;height:34px;fill:none;stroke:var(--c);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.t-dons .ico svg{fill:color-mix(in srgb,var(--c) 18%,transparent)}
.nom{font-size:21px;font-weight:700;letter-spacing:-.01em;margin-top:4px}
.desc{font-size:14px;color:var(--muted)}
.t-dons{--c:var(--c-dons)} .t-fact{--c:var(--c-fact)} .t-appro{--c:var(--c-appro)} .t-ged{--c:var(--c-ged)} .t-sub{--c:var(--c-sub)} .t-vehi{--c:var(--c-vehi)}
.bientot{opacity:.62;cursor:default}
.badge{position:absolute;top:14px;right:14px;font:600 11.5px var(--f-ui);padding:3px 9px;border-radius:99px;background:color-mix(in srgb,var(--c) 14%,transparent);color:var(--c)}
.version{position:fixed;right:8px;bottom:4px;font-size:10px;color:var(--muted);opacity:.75}
@media (max-width:520px){h1{font-size:25px}.tuile{grid-template-columns:52px 1fr;min-height:0;padding:18px}.ico{width:52px;height:52px}.ico svg{width:28px;height:28px}.nom{font-size:19px}}
.bientot{padding-top:38px}
@media (max-width:520px){.version{position:static;text-align:right;padding:0 16px 10px}}