@font-face{font-family:Baloo;src:url(f/Baloo2.ttf);font-weight:400 800;font-display:swap}
@font-face{font-family:Andika;src:url(f/Andika.ttf);font-display:swap}
:root{--encre:#0f3b70;--ciel:#dff3fb;--rouge:#e5484d;--trait:#b9dcea}
*{box-sizing:border-box;margin:0}body{font-family:Baloo,system-ui,sans-serif;background:var(--ciel);color:var(--encre)}
main{max-width:560px;margin:auto;padding:24px 16px 48px;text-align:center}.kelia{height:164px;width:auto}
.brand{font-weight:800;letter-spacing:.2em;text-transform:uppercase;font-size:13px;margin-top:6px}
h1{font-size:30px;line-height:1.1;margin:6px 0 10px}h2{font-size:21px;margin:24px 0 10px}.intro{font-size:17px}
.big{font-family:Andika;font-size:88px;line-height:1.1}
#all{width:100%;min-height:64px;font:800 23px Baloo,sans-serif;background:var(--rouge);color:#fff;border:0;border-radius:12px;margin:10px 0 16px;cursor:pointer}
.lines{display:grid;gap:8px}.line{min-height:52px;padding:8px 14px;font:20px Andika,sans-serif;color:var(--encre);background:#fff;border:2px solid var(--trait);border-radius:10px;cursor:pointer}
.line.on{border-color:var(--rouge)}nav{display:grid;grid-template-columns:repeat(auto-fill,minmax(52px,1fr));gap:8px}
nav.wide{grid-template-columns:1fr}nav a{display:block;padding:12px 8px;background:#fff;border:2px solid var(--trait);border-radius:10px;color:var(--encre);text-decoration:none;font:20px Andika,sans-serif}
.home{display:inline-block;margin-top:22px;color:var(--encre);font-weight:700}
:focus-visible{outline:3px solid var(--rouge);outline-offset:2px}