:root{
  --bg:#0070b8; --bg2:#eaf3fa; --card:#ffffff; --ink:#0d2b45; --muted:#5b6b82;
  --blue-d:#004f84; --accent:#a0c838; --ok:#1e9e5a; --ko:#d64545; --line:#d9e1ec;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}
input,textarea{user-select:text;-webkit-user-select:text}
/* 1rem = 2.2% de la plus petite dimension : identique en portrait et en paysage */
html{font-size:2.2vmin}
html,body{margin:0;height:100%;overflow:hidden;font-family:"Segoe UI",system-ui,Arial,sans-serif;color:var(--ink);
  background:linear-gradient(180deg,#ffffff 0%,var(--bg2) 100%);touch-action:manipulation}
#app{height:100%;display:flex;flex-direction:column;padding:2rem 3rem}
header{display:flex;align-items:center;justify-content:space-between;min-height:5rem;border-bottom:.3rem solid var(--accent);padding-bottom:1rem}
header img{height:4.6rem;display:block}
header .tag{color:var(--bg);font-weight:700;font-size:1.3rem}
#net{display:inline-block;margin-left:.8rem;padding:.2rem .8rem;border-radius:2rem;font-size:.9rem;background:#fff3cd;color:#7a5a00}#net:empty{display:none}
main{flex:1;min-height:0;display:flex;align-items:center;justify-content:center}
.card{background:var(--card);border-radius:2rem;padding:3rem;width:100%;max-height:100%;overflow:auto;
  box-shadow:0 1rem 4rem rgba(0,79,132,.18);border:.15rem solid #d6e6f3}
.card.narrow{max-width:62rem}
.card.wide{max-width:110rem}
h1{font-size:3.6rem;margin:0 0 1rem;line-height:1.1}
h2{font-size:2.4rem;margin:0 0 1rem;line-height:1.2}
p.lead{font-size:1.7rem;color:var(--muted);margin:0 0 2rem}
.center{text-align:center}
.btn{display:block;width:100%;border:0;border-radius:1.2rem;padding:1.4rem 2rem;font-size:1.7rem;font-weight:700;
  background:var(--bg);color:#fff;cursor:pointer;min-height:4.5rem;transition:transform .08s}
.btn:active{transform:scale(.98)}
.btn.accent{background:var(--accent);color:#17310a}
.btn.ghost{background:#eef2f8;color:var(--ink)}
.btn[disabled]{opacity:.4}
.levels{display:grid;gap:1.4rem;margin-top:1rem}
@media (orientation:landscape){.levels{grid-template-columns:repeat(3,1fr)}}
.level{padding:2.4rem 1.5rem;border-radius:1.6rem;color:#fff;font-size:2.2rem;font-weight:800;border:0;cursor:pointer;min-height:9rem}
.level small{display:block;font-size:1.1rem;font-weight:500;opacity:.85;margin-top:.4rem}
.level.l1{background:#a0c838;color:#17310a}.level.l2{background:#0070b8}.level.l3{background:#004f84}
.progress{display:flex;gap:.6rem;margin-bottom:1.6rem}
.progress i{flex:1;height:.8rem;border-radius:1rem;background:var(--line)}
.progress i.on{background:var(--accent)}
.qnum{font-size:1.3rem;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.question{font-size:2.5rem;font-weight:800;margin:.6rem 0 2rem;line-height:1.25}
.choices{display:grid;gap:1.1rem}
.choice{display:flex;align-items:center;gap:1.4rem;text-align:left;border:.2rem solid var(--line);background:#fff;
  border-radius:1.2rem;padding:1.3rem 1.6rem;font-size:1.8rem;cursor:pointer;min-height:5rem;color:var(--ink)}
.choice b{flex:none;width:3.2rem;height:3.2rem;border-radius:50%;background:var(--bg);color:#fff;display:grid;place-items:center;font-size:1.5rem}
.choice.sel{border-color:var(--bg);background:#e6f2fb}
.choice.good{border-color:var(--ok);background:#e8f7ee}.choice.good b{background:var(--ok)}
.choice.bad{border-color:var(--ko);background:#fdecec}.choice.bad b{background:var(--ko)}
/* Formulaire : 2 colonnes en paysage, 1 colonne en portrait */
.form{display:grid;gap:1.2rem 2.4rem}
@media (orientation:landscape){.form{grid-template-columns:1fr 1fr}.form .full{grid-column:1/-1}}
label.f{display:block;font-size:1.2rem;font-weight:700;color:var(--muted);margin-bottom:.4rem}
input[type=text],input[type=email],input[type=tel],select,textarea{width:100%;font-size:1.6rem;padding:1rem 1.2rem;
  border:.15rem solid var(--line);border-radius:1rem;font-family:inherit;min-height:4rem;background:#fff;color:var(--ink)}
input.err{border-color:var(--ko)}
.checks{display:grid;gap:.7rem 1.5rem}
@media (orientation:landscape){.checks{grid-template-columns:1fr 1fr}}
.chk{display:flex;align-items:center;gap:1rem;font-size:1.5rem;padding:.9rem 1.1rem;border:.15rem solid var(--line);border-radius:1rem;cursor:pointer;min-height:3.8rem}
.chk input{width:1.8rem;height:1.8rem;flex:none;accent-color:var(--bg)}
.chk.on{border-color:var(--bg);background:#e6f2fb}
.note{font-size:1.15rem;color:var(--muted);line-height:1.45}
.info{background:#eef4ff;border-radius:1rem;padding:.9rem 1.2rem;font-size:1.15rem;color:#27456f;margin-top:.5rem}
.score{font-size:7rem;font-weight:900;line-height:1}
.badge{display:inline-block;padding:.5rem 1.4rem;border-radius:3rem;background:var(--bg);color:#fff;font-weight:700;font-size:1.3rem;margin-bottom:1rem}
.gold{background:linear-gradient(135deg,#ffe38a,#f5a623);color:#3a2600;border-radius:1.6rem;padding:2rem;margin:1.5rem 0}
.win{background:#e8f7ee;color:#0d5a31;border-radius:1.6rem;padding:2rem;margin:1.5rem 0}
.thx{background:#eef2f8;border-radius:1.6rem;padding:2rem;margin:1.5rem 0}
.gold,.win,.thx{font-size:2rem;font-weight:800;line-height:1.3}
.ref{font-size:1.2rem;color:var(--muted)}
.row2{display:grid;gap:1rem;margin-top:1.5rem}
@media (orientation:landscape){.row2{grid-template-columns:1fr 1fr}}
.corr{border-bottom:.1rem solid var(--line);padding:1.2rem 0}
.corr .expl{font-size:1.25rem;color:var(--muted);margin-top:.6rem}
footer{color:#fff;opacity:.55;font-size:1rem;text-align:center;min-height:1.6rem}
/* Admin */
#adm{position:fixed;inset:0;background:rgba(5,12,25,.92);display:none;align-items:center;justify-content:center;z-index:9}
#adm .card{max-width:60rem}
table.st{width:100%;border-collapse:collapse;font-size:1.4rem;margin:1rem 0}
table.st td{padding:.5rem .3rem;border-bottom:.1rem solid var(--line)}
table.st td:last-child{text-align:right;font-weight:700}
.tap{position:absolute;top:0;left:0;width:9rem;height:6rem;z-index:5}
