:root{
  --bg:#F2F3F7; --surface:#FFFFFF; --ink:#12131A; --ink-2:#2B2D38; --muted:#5A5E6B; --line:#E0E2E9; --line-2:#ECEDF2;
  --lime:#C8F135; --lime-ink:#12131A; --lime-soft:#EEFBC4; --dark:#12131A; --on-dark:#FFFFFF; --on-dark-muted:#B7BAC6;
  --ok-bg:#E2F6E9; --ok:#17603A; --warn-bg:#FFF2D6; --warn:#6E4700; --err-bg:#FDE6E4; --err:#9B1C14;
  --display:'Unbounded', 'Arial Rounded MT Bold', system-ui, sans-serif;
  --body:'Manrope', 'Helvetica Neue', system-ui, sans-serif;
  color-scheme: light;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0D0E13; --surface:#171922; --ink:#F1F2F6; --ink-2:#D6D8E0; --muted:#A2A6B4; --line:#2A2D3A; --line-2:#20232E;
    --lime-soft:#2A3410; --dark:#000000; --ok-bg:#12301F; --ok:#8FE0AE; --warn-bg:#3A2B08; --warn:#F6CF7A; --err-bg:#3A1513; --err:#FF9C94;
    color-scheme: dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0D0E13; --surface:#171922; --ink:#F1F2F6; --ink-2:#D6D8E0; --muted:#A2A6B4; --line:#2A2D3A; --line-2:#20232E;
  --lime-soft:#2A3410; --dark:#000000; --ok-bg:#12301F; --ok:#8FE0AE; --warn-bg:#3A2B08; --warn:#F6CF7A; --err-bg:#3A1513; --err:#FF9C94;
  color-scheme: dark;
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.5;-webkit-tap-highlight-color:transparent}
img{max-width:100%}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--lime);outline-offset:2px}
[hidden]{display:none !important}
h1,h2,h3{font-family:var(--display);letter-spacing:-.02em;line-height:1.1;margin:0}

/* Brand */
.brand{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-family:var(--display);font-weight:800;font-size:22px;letter-spacing:-.03em}
.brand-mark{width:34px;height:34px;border-radius:10px;background:var(--lime);color:var(--lime-ink);display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:900}
.plus{color:var(--lime);-webkit-text-stroke:0}

/* Buttons */
.btn{min-height:48px;padding:0 20px;border-radius:14px;border:none;background:var(--lime);color:var(--lime-ink);font-weight:800;font-size:16px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none}
.btn:hover{filter:brightness(1.04)}
.btn:disabled{opacity:.55;cursor:default}
.btn.dark{background:var(--ink);color:var(--bg)}
.btn.ghost{background:transparent;border:1.5px solid var(--line);color:var(--ink)}
.btn.danger{background:transparent;border:1.5px solid var(--err);color:var(--err)}
.btn.sm{min-height:40px;padding:0 14px;font-size:14px;border-radius:11px}
.btn.block{width:100%}
.link{border:none;background:none;color:var(--ink);font-weight:700;text-decoration:underline;cursor:pointer;padding:6px 2px;min-height:44px}

/* Forms */
.form{display:flex;flex-direction:column;gap:14px}
.form label,.lbl{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:700}
.inp,.form input:not([type=checkbox]):not([type=file]),.form select,.form textarea{min-height:48px;border:1.5px solid var(--line);border-radius:12px;padding:10px 14px;background:var(--surface);color:var(--ink);font-size:16px;width:100%}
.form textarea{min-height:84px;resize:vertical}
.form input[type=file]{font-size:14px}
.hint{font-size:13px;font-weight:500;color:var(--muted)}
.row2{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px}
.msg{border-radius:12px;padding:12px 14px;font-size:15px;margin:0}
.msg.err{background:var(--err-bg);color:var(--err)}
.msg.ok{background:var(--ok-bg);color:var(--ok)}
.msg.warn{background:var(--warn-bg);color:var(--warn)}

/* App shell */
.app{max-width:560px;margin:0 auto;min-height:100vh;padding:0 16px calc(96px + env(safe-area-inset-bottom,0px))}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 0}
.card{background:var(--surface);border:1px solid var(--line-2);border-radius:20px;padding:18px}
.stack{display:flex;flex-direction:column;gap:14px}
.title{font-size:26px;margin:6px 0 4px}
.sub{color:var(--muted);margin:0}
.tabbar{position:fixed;left:0;right:0;bottom:0;background:var(--surface);border-top:1px solid var(--line);padding:6px 8px calc(6px + env(safe-area-inset-bottom,0px));display:flex;justify-content:center;z-index:10}
.tabbar .in{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;max-width:560px;width:100%;gap:4px}
.tabbar button{min-height:56px;border:none;background:none;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:12px;font-weight:700;color:var(--muted);cursor:pointer}
.tabbar button[aria-selected="true"]{color:var(--ink);background:var(--lime-soft)}
.tabbar svg{width:22px;height:22px}

/* Chips & search */
.chips{display:flex;gap:8px;overflow-x:auto;padding:2px 0 6px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex:0 0 auto;min-height:38px;padding:0 14px;border-radius:999px;border:1.5px solid var(--line);background:var(--surface);font-size:14px;font-weight:700;cursor:pointer;white-space:nowrap}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.search{display:flex;gap:8px}
.search .inp{flex:1}

/* Offer cards */
.offers{display:flex;flex-direction:column;gap:12px}
.offer{display:flex;gap:14px;align-items:center;background:var(--surface);border:1px solid var(--line-2);border-radius:18px;padding:14px;cursor:pointer;text-align:left;width:100%}
.offer:hover{border-color:var(--line)}
.deal{flex:0 0 auto;width:72px;height:72px;border-radius:16px;background:var(--lime);color:var(--lime-ink);display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:800;font-size:18px;text-align:center;line-height:1.05;padding:4px;overflow:hidden;word-break:break-word}
.offer h3{font-size:16px;margin-bottom:2px}
.offer .meta{font-size:14px;color:var(--muted)}
.offer .shop{font-size:14px;font-weight:700}

/* Sheet */
.sheet{position:fixed;inset:0;background:rgba(10,11,16,.55);display:flex;align-items:flex-end;justify-content:center;z-index:30}
.sheet .panel{background:var(--surface);width:100%;max-width:560px;border-radius:24px 24px 0 0;padding:20px 18px calc(20px + env(safe-area-inset-bottom,0px));max-height:92vh;overflow:auto}
.sheet .grab{width:44px;height:5px;border-radius:9px;background:var(--line);margin:0 auto 14px}
.qrbox{background:#fff;border-radius:20px;padding:16px;display:flex;justify-content:center}
.qrbox img,.qrbox svg{width:220px;height:220px;image-rendering:pixelated}
.code{font-family:var(--display);font-size:36px;font-weight:800;letter-spacing:.18em;text-align:center}
.timer{text-align:center;color:var(--muted);font-weight:700}
.big-ok{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;padding:20px 0}
.big-ok .circle{width:96px;height:96px;border-radius:50%;background:var(--lime);display:flex;align-items:center;justify-content:center}

/* Status pills */
.pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:800;padding:4px 10px;border-radius:999px;background:var(--line-2);color:var(--ink)}
.pill.verifie,.pill.approuve{background:var(--ok-bg);color:var(--ok)}
.pill.en_attente{background:var(--warn-bg);color:var(--warn)}
.pill.refuse,.pill.suspendu{background:var(--err-bg);color:var(--err)}

/* Student card */
.idcard{background:var(--dark);color:var(--on-dark);border-radius:22px;padding:20px;position:relative;overflow:hidden}
.idcard::after{content:"";position:absolute;right:-40px;top:-40px;width:160px;height:160px;border-radius:50%;background:var(--lime);opacity:.9}
.idcard .lab{font-size:12px;color:var(--on-dark-muted);font-weight:700;text-transform:none}
.idcard .nm{font-family:var(--display);font-size:22px;font-weight:800;margin:4px 0 10px;position:relative;z-index:1;max-width:75%}
.idcard .row{display:flex;gap:24px;flex-wrap:wrap;position:relative;z-index:1}

/* Lists */
.list{display:flex;flex-direction:column;gap:10px}
.item{background:var(--surface);border:1px solid var(--line-2);border-radius:16px;padding:14px;display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;justify-content:space-between}
.item h3{font-size:16px}
.item .meta{font-size:14px;color:var(--muted)}
.actions{display:flex;flex-wrap:wrap;gap:8px}
.empty{text-align:center;padding:36px 16px;color:var(--muted);background:var(--surface);border:1.5px dashed var(--line);border-radius:18px}
.empty h3{color:var(--ink);font-size:17px;margin-bottom:6px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}
.kpi{background:var(--surface);border:1px solid var(--line-2);border-radius:16px;padding:14px}
.kpi b{display:block;font-family:var(--display);font-size:26px}
.kpi span{font-size:13px;color:var(--muted);font-weight:600}
.bar{display:grid;grid-template-columns:minmax(0,1fr) 120px 36px;gap:10px;align-items:center;font-size:14px}
.bar .t{height:10px;background:var(--line-2);border-radius:9px;overflow:hidden}
.bar .t i{display:block;height:100%;background:var(--lime);border-radius:9px}
.bar span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#reader{border-radius:18px;overflow:hidden;background:#000;min-height:260px}
#reader video{border-radius:18px}
.loading{padding:40px;text-align:center;color:var(--muted)}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(90px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--bg);padding:12px 18px;border-radius:14px;font-weight:700;z-index:50;max-width:calc(100% - 32px)}
dialog{border:none;border-radius:20px;padding:0;max-width:520px;width:calc(100% - 24px);background:var(--surface);color:var(--ink)}
dialog::backdrop{background:rgba(10,11,16,.55)}
.dlg{padding:20px;display:flex;flex-direction:column;gap:14px}
.dlg-head{display:flex;justify-content:space-between;align-items:center;gap:12px}
.x{width:44px;height:44px;border-radius:12px;border:1.5px solid var(--line);background:var(--surface);cursor:pointer;font-size:20px}

/* Landing */
.land-hero{background:var(--dark);color:var(--on-dark)}
.wrap{max-width:1120px;margin:0 auto;padding-left:22px;padding-right:22px}
.land-nav{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-top:18px;padding-bottom:18px;flex-wrap:wrap}
.land-nav nav{display:flex;gap:10px;flex-wrap:wrap}
.hero-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:40px;align-items:center;padding-top:36px;padding-bottom:72px}
.hero-grid h1{font-size:clamp(38px,6.4vw,72px);font-weight:800;line-height:.98}
.hero-grid h1 em{font-style:normal;color:var(--lime)}
.hero-grid p{font-size:19px;color:var(--on-dark-muted);max-width:46ch;margin:18px 0 26px}
.cta{display:flex;gap:12px;flex-wrap:wrap}
.phone{background:#1E2030;border-radius:36px;padding:14px;max-width:320px;margin:0 auto;box-shadow:0 30px 80px rgba(0,0,0,.45)}
.phone .scr{background:var(--bg);color:var(--ink);border-radius:26px;padding:16px;display:flex;flex-direction:column;gap:10px}
.section{padding-top:64px;padding-bottom:64px}
.section h2{font-size:clamp(28px,4vw,42px);font-weight:800;margin-bottom:12px}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;list-style:none;margin:28px 0 0;padding:0}
.steps li{background:var(--surface);border:1px solid var(--line-2);border-radius:22px;padding:22px}
.steps b{display:inline-flex;width:40px;height:40px;border-radius:12px;background:var(--lime);color:var(--lime-ink);align-items:center;justify-content:center;font-family:var(--display);font-size:18px;margin-bottom:12px}
.steps h3{font-size:18px;margin-bottom:6px}
.steps p{margin:0;color:var(--muted)}
.pro-band{background:var(--lime);color:var(--lime-ink)}
.pro-band .sub{color:#2B3410}
footer.foot{background:var(--dark);color:var(--on-dark-muted);font-size:14px}
footer.foot .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-top:28px;padding-bottom:28px}
.offer .ot{display:block;font-family:var(--display);font-weight:800;font-size:16px;line-height:1.15;margin-bottom:2px}