* { -webkit-tap-highlight-color: transparent; }
body { background:#0A0E1A; color:#F1F5F9; font-family:'Inter',system-ui,-apple-system,sans-serif; min-height:100vh; }
.grad-text { background:linear-gradient(90deg,#2E7CF6,#8B5CF6); -webkit-background-clip:text; background-clip:text; color:transparent; }
.grad-btn { background:linear-gradient(90deg,#2E7CF6,#8B5CF6); color:#fff; font-weight:700; border-radius:14px; padding:14px 24px; transition:.2s; border:none; cursor:pointer; display:inline-block; text-align:center; }
.grad-btn:hover { opacity:.9; transform:translateY(-1px); }
.grad-btn:disabled { opacity:.5; cursor:not-allowed; }
.ghost-btn { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); color:#F1F5F9; border-radius:14px; padding:13px 22px; font-weight:600; cursor:pointer; }
.ghost-btn:hover { background:rgba(255,255,255,.1); }
.card { background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.09); border-radius:20px; padding:24px; backdrop-filter:blur(10px); }
.input { width:100%; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12); border-radius:12px; padding:13px 16px; color:#F1F5F9; outline:none; font-size:15px; }
.input:focus { border-color:#2E7CF6; box-shadow:0 0 0 3px rgba(46,124,246,.2); }
select.input option { background:#111827; }
.chip { display:inline-flex; align-items:center; gap:6px; background:rgba(139,92,246,.15); border:1px solid rgba(139,92,246,.4); color:#c4b5fd; border-radius:999px; padding:6px 14px; font-size:13px; font-weight:600; }
.chip-blue { background:rgba(46,124,246,.15); border-color:rgba(46,124,246,.4); color:#93c5fd; }
.toast { position:fixed; bottom:24px; left:50%; transform:translateX(-50%); background:#1e293b; border:1px solid rgba(255,255,255,.15); padding:13px 22px; border-radius:14px; z-index:100; font-weight:600; box-shadow:0 10px 40px rgba(0,0,0,.5); }
.step-dot { width:10px; height:10px; border-radius:50%; background:rgba(255,255,255,.15); }
.step-dot.on { background:linear-gradient(90deg,#2E7CF6,#8B5CF6); }
details.faq { background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.09); border-radius:14px; padding:14px 18px; }
details.faq summary { cursor:pointer; font-weight:600; list-style:none; }
details.faq summary::-webkit-details-marker { display:none; }
details.faq[open] summary { color:#93c5fd; margin-bottom:8px; }
.switch { position:relative; width:44px; height:24px; background:rgba(255,255,255,.15); border-radius:999px; cursor:pointer; transition:.2s; flex-shrink:0; }
.switch.on { background:linear-gradient(90deg,#2E7CF6,#8B5CF6); }
.switch::after { content:''; position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%; background:#fff; transition:.2s; }
.switch.on::after { left:23px; }
.hidden { display:none !important; }

/* ═══ Écran de génération cinématique ═══ */
#gen-ov{position:fixed;inset:0;z-index:400;background:radial-gradient(circle at 50% 40%,#111a30,#05070f 75%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;animation:genIn .4s ease}
@keyframes genIn{from{opacity:0}to{opacity:1}}
#gen-ov .gen-ring{width:130px;height:130px;border-radius:50%;position:relative;display:flex;align-items:center;justify-content:center}
#gen-ov .gen-ring::before{content:'';position:absolute;inset:0;border-radius:50%;background:conic-gradient(#2E7CF6,#8B5CF6,#22C55E,#2E7CF6);animation:genSpin 1.4s linear infinite;-webkit-mask:radial-gradient(circle,transparent 58%,#000 60%);mask:radial-gradient(circle,transparent 58%,#000 60%)}
@keyframes genSpin{to{transform:rotate(360deg)}}
#gen-ov .gen-core{width:84px;height:84px;border-radius:24px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;animation:genPulse 1.2s ease-in-out infinite}
@keyframes genPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
#gen-ov .gen-txt{color:#cbd5e1;font-weight:700;font-size:15px;animation:genTxt .5s ease}
@keyframes genTxt{from{opacity:0;transform:translateY(8px)}to{opacity:1}}
#gen-ov .gen-bar{width:220px;height:5px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden}
#gen-ov .gen-bar>div{height:100%;width:0;background:linear-gradient(90deg,#2E7CF6,#8B5CF6);border-radius:99px;transition:width .5s ease}
.gen-part{position:absolute;width:6px;height:6px;border-radius:50%;animation:genFly linear forwards}
@keyframes genFly{to{transform:translate(var(--gx),var(--gy)) scale(0);opacity:0}}
