/* PIXEL ID — les couleurs, les polices, les formes : la même langue que les trois pages d'Akwaba V4.
   Jour et nuit sans réglage : la nuit va de 18 h 30 à 6 h, la page le sait par l'heure (coquille.js).
   Les polices sont chez nous (tout à Abidjan) : aucune requête ne part vers un service de polices. */

@font-face{font-family:"Manrope";src:url("/commun/polices/Manrope.woff2") format("woff2");font-weight:200 800;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url("/commun/polices/JetBrainsMono.woff2") format("woff2");font-weight:100 800;font-display:swap}
@font-face{font-family:"Cormorant Garamond";src:url("/commun/polices/CormorantGaramond.woff2") format("woff2");font-weight:300 700;font-display:swap}
@font-face{font-family:"Cormorant Garamond";src:url("/commun/polices/CormorantGaramond-Italic.woff2") format("woff2");font-weight:300 700;font-style:italic;font-display:swap}

:root{
  --fond:#F4F1E8; --carte:#FFFFFF; --bord:#DDD6C4; --creux:#EDE8DB;
  --texte:#14213A; --doux:#4B5568; --faible:#7A8496;
  --or:#B98A2E; --sur-or:#1E1600; --or-doux:rgba(185,138,46,.12);
  --vert:#0F7A4B; --sur-vert:#FFFFFF; --rouge:#B3332F;
  --rayon:14px; --ombre:0 1px 0 rgba(20,33,58,.06);
}
:root.nuit{
  --fond:#070B14; --carte:#0D1424; --bord:#1C2740; --creux:#060A12;
  --texte:#EEF1F7; --doux:#8B97AD; --faible:#5D6880;
  --or:#C89B3C; --sur-or:#1E1600; --or-doux:rgba(200,155,60,.10);
  --vert:#1DBF8E; --sur-vert:#06201A; --rouge:#E0464A;
  --ombre:none;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--fond);color:var(--texte);
  font-family:"Manrope",system-ui,sans-serif;-webkit-font-smoothing:antialiased;
  font-size:16px;line-height:1.5;padding:0 0 40px;
  padding-bottom:calc(40px + env(safe-area-inset-bottom));
}
main{max-width:520px;margin:0 auto;padding:24px 16px}
.cache{display:none !important}
.mono{font-family:"JetBrains Mono",monospace;letter-spacing:.04em}

.surtitre{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--or);font-weight:800;margin:0 0 8px}
h1{font-family:"Cormorant Garamond",serif;font-weight:600;font-size:40px;line-height:1.02;margin:0 0 6px;text-wrap:balance}
h1 em{font-style:italic;color:var(--or)}
.sous{color:var(--doux);font-size:15px;line-height:1.5;margin:0 0 20px}
.quoi{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--doux);font-weight:800}

.carte{background:var(--carte);border:1px solid var(--bord);border-radius:var(--rayon);padding:18px;box-shadow:var(--ombre)}
label{display:block;font-size:13px;color:var(--doux);margin:0 0 8px;font-weight:700}
input,select{
  width:100%;padding:15px 14px;border-radius:12px;border:1px solid var(--bord);
  background:var(--creux);color:var(--texte);font-size:18px;
  font-family:"JetBrains Mono",monospace;letter-spacing:.06em;
}
input.texte,select{font-family:"Manrope",system-ui,sans-serif;letter-spacing:0;font-size:16px}
input:focus,select:focus{outline:3px solid var(--or);outline-offset:1px;border-color:var(--or)}
button{
  width:100%;padding:16px;border:0;border-radius:12px;margin-top:14px;
  background:var(--or);color:var(--sur-or);font-size:16px;font-weight:800;
  font-family:inherit;cursor:pointer;line-height:1.25;
}
button:focus-visible{outline:3px solid var(--texte);outline-offset:2px}
button.sobre{background:transparent;color:var(--doux);border:1px solid var(--bord);font-weight:700}
button.vert{background:var(--vert);color:var(--sur-vert)}
button[disabled]{opacity:.5;cursor:default}
.msg{margin-top:12px;font-size:14px;line-height:1.45;color:var(--doux);min-height:20px}
.msg.erreur{color:var(--rouge)}

.compte{display:flex;align-items:center;gap:10px;background:var(--carte);border:1px solid var(--bord);border-radius:var(--rayon);padding:12px 14px;margin:0 0 16px}
.compte .mono{font-size:15px}
.compte button{width:auto;margin:0 0 0 auto;padding:8px 13px;font-size:12px}

.installer{display:flex;align-items:center;gap:12px;background:var(--or-doux);border:1px solid var(--or);border-radius:var(--rayon);padding:12px 14px;margin:0 0 16px;font-size:14px;line-height:1.4}
.installer button{width:auto;margin:0 0 0 auto;padding:9px 13px;font-size:13px;flex:0 0 auto}

.pied{color:var(--faible);font-size:12px;text-align:center;margin-top:26px;line-height:1.6}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}