:root{
  --fond1:#f4efff;--fond2:#fdf3ea;--carte:rgba(255,255,255,.74);--bord:rgba(255,255,255,.7);
  --texte:#1c1b2e;--doux:#6f6c85;--teinte:#6b5bd6;--teinte2:#b86bd6;--champ:rgba(118,112,160,.13);
  --ok:#30b06a;--non:#e5484d;--ombre:0 10px 30px rgba(73,56,140,.10);--barre:rgba(255,255,255,.78);--etoile:rgba(212,160,40,.55)
}
@media(prefers-color-scheme:dark){:root{
  --fond1:#0f1030;--fond2:#1d1446;--carte:rgba(38,34,84,.62);--bord:rgba(255,255,255,.10);
  --texte:#f3f1ff;--doux:#a9a6c8;--teinte:#a99bff;--teinte2:#e0a3ff;--champ:rgba(255,255,255,.10);
  --ombre:0 10px 30px rgba(0,0,0,.35);--barre:rgba(26,22,62,.80);--etoile:rgba(255,236,170,.85)
}}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;color:var(--texte);
  font:17px/1.45 -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,system-ui,sans-serif;
  background:
    radial-gradient(1.6px 1.6px at 12% 9%,var(--etoile) 50%,transparent 51%),
    radial-gradient(1.2px 1.2px at 28% 22%,var(--etoile) 50%,transparent 51%),
    radial-gradient(1.8px 1.8px at 47% 6%,var(--etoile) 50%,transparent 51%),
    radial-gradient(1.2px 1.2px at 63% 17%,var(--etoile) 50%,transparent 51%),
    radial-gradient(1.6px 1.6px at 81% 11%,var(--etoile) 50%,transparent 51%),
    radial-gradient(1.2px 1.2px at 92% 27%,var(--etoile) 50%,transparent 51%),
    radial-gradient(1.4px 1.4px at 7% 34%,var(--etoile) 50%,transparent 51%),
    radial-gradient(60vmax 40vmax at 100% -10%,rgba(184,107,214,.20),transparent 60%),
    radial-gradient(50vmax 40vmax at -10% 10%,rgba(107,91,214,.18),transparent 60%),
    linear-gradient(170deg,var(--fond1),var(--fond2));
  background-attachment:fixed}
main{max-width:680px;margin:0 auto;padding:0 16px calc(104px + env(safe-area-inset-bottom))}
header{max-width:680px;margin:0 auto;padding:calc(18px + env(safe-area-inset-top)) 20px 6px;display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
header .sur{font-size:13px;font-weight:600;letter-spacing:.02em;color:var(--teinte);display:flex;align-items:center;gap:6px}
header h1{margin:2px 0 0;font:700 32px/1.1 -apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",system-ui,sans-serif;letter-spacing:-.02em;
  background:linear-gradient(100deg,var(--teinte),var(--teinte2));-webkit-background-clip:text;background-clip:text;color:transparent}
header form{margin:0}header button{margin:0;padding:8px 14px;font-size:15px}
.carte{background:var(--carte);border:1px solid var(--bord);border-radius:22px;padding:18px;margin:14px 0;box-shadow:var(--ombre);
  -webkit-backdrop-filter:blur(22px) saturate(170%);backdrop-filter:blur(22px) saturate(170%)}
h2{margin:0 0 10px;font-size:21px;font-weight:700;letter-spacing:-.01em}
label{display:block;margin:14px 0 6px;font-size:13px;font-weight:600;color:var(--doux);text-transform:uppercase;letter-spacing:.04em}
input,select,textarea{width:100%;padding:13px 14px;border:1.5px solid transparent;border-radius:13px;font:inherit;font-size:17px;color:var(--texte);
  background:var(--champ);outline:0;-webkit-appearance:none;appearance:none;transition:border-color .15s,background .15s}
input:focus,select:focus,textarea:focus{border-color:var(--teinte);background:transparent}
input[type=file]{padding:10px;font-size:15px}
select{background-image:linear-gradient(45deg,transparent 50%,var(--doux) 50%),linear-gradient(135deg,var(--doux) 50%,transparent 50%);
  background-position:calc(100% - 20px) 55%,calc(100% - 14px) 55%;background-size:6px 6px;background-repeat:no-repeat;padding-right:36px}
textarea{min-height:240px;line-height:1.4;font-size:15px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.petit{color:var(--doux);font-size:14px;margin:6px 0 0}
button{margin-top:16px;padding:14px 20px;border:0;border-radius:999px;color:#fff;font-family:inherit;font-size:17px;font-weight:600;line-height:1.1;cursor:pointer;
  background:linear-gradient(100deg,var(--teinte),var(--teinte2));box-shadow:0 6px 16px rgba(107,91,214,.28);transition:transform .08s,opacity .15s}
button:active{transform:scale(.97);opacity:.85}
button.gris{background:var(--champ);color:var(--teinte);box-shadow:none}
button.rouge{background:rgba(229,72,77,.14);color:var(--non);box-shadow:none}
form.carte>button:first-of-type,form>button:only-of-type{width:100%}
form.court{display:inline}form.court button{margin:0;padding:8px 14px;font-size:15px;width:auto}
.deux{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.info{padding:13px 16px;border-radius:16px;margin:14px 0;font-weight:500;background:rgba(107,91,214,.13);color:var(--texte);
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
.info.alerte{background:rgba(229,72,77,.14)}
.etat{display:flex;gap:12px;align-items:center;font-size:20px;font-weight:700;margin-bottom:8px}
.pastille{width:14px;height:14px;border-radius:50%;background:var(--non);box-shadow:0 0 0 5px rgba(229,72,77,.16)}
.pastille.ok{background:var(--ok);box-shadow:0 0 0 5px rgba(48,176,106,.18),0 0 14px rgba(48,176,106,.6)}
table{width:100%;border-collapse:collapse}
td,th{text-align:left;padding:12px 0;border-bottom:1px solid var(--champ);vertical-align:middle;font-size:16px}
tr:last-child td,tr:last-child th{border-bottom:0}
th{font-weight:500;color:var(--doux);padding-right:12px}td:last-child{text-align:right}th+td{font-weight:600}
code{background:var(--champ);padding:3px 8px;border-radius:8px;word-break:break-all;font-size:14px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
details summary{cursor:pointer;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:10px}
details summary::-webkit-details-marker{display:none}
details summary::after{content:"›";color:var(--doux);font-size:22px;line-height:1;transition:transform .2s}
details[open] summary::after{transform:rotate(90deg)}
pre{white-space:pre-wrap;font-size:13.5px;line-height:1.45;color:var(--doux)}
a{color:var(--teinte)}
.ligne{display:flex;gap:8px;align-items:center;justify-content:space-between}
nav{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(10px + env(safe-area-inset-bottom));z-index:5;
  width:min(calc(100% - 20px),520px);display:flex;justify-content:space-around;padding:8px 6px;border-radius:26px;
  background:var(--barre);border:1px solid var(--bord);box-shadow:0 12px 34px rgba(40,30,90,.22);
  -webkit-backdrop-filter:blur(26px) saturate(180%);backdrop-filter:blur(26px) saturate(180%)}
nav a{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 2px;border-radius:18px;
  color:var(--doux);text-decoration:none;font-size:11px;font-weight:600}
nav a svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
nav a.ici{color:var(--teinte);background:var(--champ)}
.entree{max-width:420px;margin:8vh auto 0}
@media(max-width:560px){.deux{grid-template-columns:1fr;gap:0}header h1{font-size:28px}main{padding-left:12px;padding-right:12px}.carte{padding:16px;border-radius:20px}}