:root{--bg:#FBF8F2;--surf:#FFFFFF;--surf2:#F3EEE3;--ink:#14213D;--mut:#565F70;--line:#E4DCCB;--brand:#1D7A6E;--brand-ink:#FFFFFF;--acc:#F2A541;--ok:#1D7A6E;--warn:#B45309;
--hero1:#14213D;--hero2:#22366B;--r:16px;--tab:64px;--shadow:0 1px 2px rgba(20,33,61,.06),0 8px 24px rgba(20,33,61,.07);color-scheme:light}
:root[data-theme=dark]{--bg:#0C1428;--surf:#141F3A;--surf2:#1A2748;--ink:#F4EFE4;--mut:#A6B0C4;--line:#263454;--brand:#3EC9B6;--brand-ink:#08101F;--acc:#F7B94A;--ok:#3EC9B6;--warn:#F5B454;
--hero1:#0F1B3A;--hero2:#1B2E5C;--shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.28);color-scheme:dark}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html{scroll-behavior:smooth;scroll-padding-bottom:calc(var(--tab) + env(safe-area-inset-bottom) + 28px)}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-font-smoothing:antialiased;min-height:100dvh}
h1,h2,h3{font-family:"Iowan Old Style","Palatino Linotype",Georgia,serif;letter-spacing:-.01em;line-height:1.18;margin:0}
a{color:inherit}button{font:inherit;color:inherit}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:3px solid var(--acc);outline-offset:2px;border-radius:8px}
#app{padding-bottom:calc(var(--tab) + env(safe-area-inset-bottom) + 12px)}
main{max-width:980px;margin:0 auto;padding:0 16px}
.view{animation:in .28s ease both}@keyframes in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* onglets permanents */
nav.tabs{position:fixed;z-index:50;left:0;right:0;bottom:0;display:flex;background:color-mix(in srgb,var(--surf) 92%,transparent);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-top:1px solid var(--line);padding:6px 6px calc(6px + env(safe-area-inset-bottom))}
nav.tabs a{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 2px;text-decoration:none;color:var(--mut);font-size:11.5px;font-weight:600;border-radius:12px;min-height:48px}
nav.tabs a svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
nav.tabs a[aria-current=page]{color:var(--brand)}nav.tabs a[aria-current=page] svg{stroke-width:2.3}
@media (min-width:900px){#app{padding-bottom:0;padding-left:92px}nav.tabs{top:0;right:auto;width:92px;flex-direction:column;justify-content:flex-start;gap:6px;padding:20px 8px;border-top:0;border-right:1px solid var(--line)}}
nav.tabs .logo img{width:44px;height:44px;border-radius:11px;display:block}nav.tabs .logo{display:none;margin:0 auto 14px}
@media (min-width:900px){nav.tabs .logo{display:block}}
/* hero */
.hero{background:linear-gradient(160deg,var(--hero1),var(--hero2));color:#F4EFE4;margin:0 -16px;padding:34px 20px 40px;border-radius:0 0 28px 28px;position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;right:-60px;top:-60px;width:240px;height:240px;background:radial-gradient(circle,rgba(62,224,200,.28),transparent 68%)}
.hero .kick{font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:#7FE8D6;font-weight:700;margin:0 0 10px}
.hero h1{font-size:clamp(30px,7vw,46px);max-width:16ch}.hero p.lead{font-size:clamp(16px,2.6vw,19px);color:#D9DEEA;max-width:46ch;margin:14px 0 22px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--brand);color:var(--brand-ink);border:0;border-radius:14px;padding:12px 18px;font-weight:700;font-size:15px;text-decoration:none;cursor:pointer;min-height:46px;transition:transform .12s,filter .12s}
.btn:hover{filter:brightness(1.06)}.btn:active{transform:scale(.98)}.btn.sec{background:transparent;color:inherit;border:1.5px solid currentColor;opacity:.92}.btn.amb{background:var(--acc);color:#14213D}
.btn[disabled]{opacity:.55;cursor:default}.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
section.blk{margin:30px 0}section.blk>h2{font-size:22px;margin-bottom:12px}.sub{color:var(--mut);margin:.2em 0 0}
.card{background:var(--surf);border:1px solid var(--line);border-radius:var(--r);padding:16px;box-shadow:var(--shadow)}
.grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.course{display:flex;flex-direction:column;gap:8px;position:relative}
.course .th{font-size:11.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--brand)}
.course h3{font-size:19px}.course .meta{font-size:13px;color:var(--mut)}.course .act{margin-top:auto;display:flex;gap:8px;align-items:center;padding-top:6px}
.fav{width:44px;height:44px;border-radius:12px;border:1.5px solid var(--line);background:transparent;cursor:pointer;display:grid;place-items:center}
.fav svg{width:22px;height:22px;stroke:var(--mut);fill:none;stroke-width:2}.fav[aria-pressed=true] svg{fill:var(--acc);stroke:var(--acc)}
.bar{height:6px;background:var(--surf2);border-radius:99px;overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--brand),var(--acc));border-radius:99px}
.badge{display:inline-block;font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:99px;background:var(--surf2);color:var(--mut)}.badge.ok{background:color-mix(in srgb,var(--ok) 16%,transparent);color:var(--ok)}
.pts{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.pt{display:flex;gap:12px}.pt b{display:block}.pt .ic{flex:0 0 40px;height:40px;border-radius:12px;background:var(--surf2);display:grid;place-items:center}
.pt .ic svg{width:22px;height:22px;stroke:var(--brand);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.story{border-left:4px solid var(--acc);padding:2px 0 2px 16px;max-width:60ch}.story p{margin:.5em 0}
/* bibliothèque */
.search{width:100%;padding:13px 16px;border-radius:14px;border:1.5px solid var(--line);background:var(--surf);color:var(--ink);font-size:16px}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.chip{padding:8px 14px;border-radius:99px;border:1.5px solid var(--line);background:transparent;cursor:pointer;font-weight:600;font-size:14px;min-height:40px}
.chip[aria-pressed=true]{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
.empty{text-align:center;padding:36px 18px;color:var(--mut)}.empty svg{width:44px;height:44px;stroke:var(--mut);fill:none;stroke-width:1.6;margin-bottom:8px}
/* cours */
.player{position:fixed;inset:0 0 calc(var(--tab) + env(safe-area-inset-bottom)) 0;z-index:40;background:var(--bg);display:flex;flex-direction:column}
@media (min-width:900px){.player{inset:0 0 0 92px}}
.phead{display:flex;align-items:center;gap:8px;padding:8px 10px;border-bottom:1px solid var(--line);background:var(--surf)}
.phead .t{flex:1;min-width:0;font-weight:700;font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ib{width:44px;height:44px;border-radius:12px;border:0;background:transparent;cursor:pointer;display:grid;place-items:center}.ib svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pbody{position:relative;flex:1;background:#000}.pbody iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:#0b1430}
.pload,.perr{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:24px;background:var(--bg);color:var(--ink)}
.spin{width:34px;height:34px;border:3px solid var(--line);border-top-color:var(--brand);border-radius:50%;animation:sp .9s linear infinite;margin:0 auto 12px}@keyframes sp{to{transform:rotate(360deg)}}
/* moi */
.form{display:grid;gap:14px}.field label{display:block;font-weight:700;margin-bottom:6px;font-size:14px}.field input[type=text],.field select{width:100%;padding:12px 14px;border-radius:12px;border:1.5px solid var(--line);background:var(--surf);color:var(--ink);font-size:16px}
.seg{display:flex;gap:6px;flex-wrap:wrap}.stat{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px}.stat .n{font:700 30px "Iowan Old Style",Georgia,serif}.stat small{color:var(--mut)}
.toast{position:fixed;left:50%;bottom:calc(var(--tab) + env(safe-area-inset-bottom) + 16px);transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:11px 16px;border-radius:12px;font-size:14px;z-index:80;box-shadow:var(--shadow);max-width:90vw}
.cta{background:linear-gradient(135deg,var(--hero1),var(--hero2));color:#F4EFE4;border-radius:var(--r);padding:20px}.cta p{color:#D9DEEA;margin:.4em 0 12px}
footer.ft{border-top:1px solid var(--line);margin:34px 0 0;padding:20px 0;color:var(--mut);font-size:13px;display:flex;gap:14px;flex-wrap:wrap}
.legal h1{font-size:30px;margin:26px 0 10px}.legal h2{font-size:19px;margin:22px 0 6px}.legal p,.legal li{max-width:70ch}