*{box-sizing:border-box}
html,body{margin:0}
body{font-family:Nunito,system-ui,-apple-system,Segoe UI,sans-serif;color:#1b1b3a;-webkit-font-smoothing:antialiased}
a{color:inherit}

/* ---------- Page de liens ---------- */
body.links{min-height:100vh;background:#f4efe8 center/cover no-repeat fixed}
.links-wrap{max-width:420px;margin:0 auto;padding:32px 20px 48px;display:flex;flex-direction:column;align-items:center;gap:14px}
.logo{width:112px;height:112px;border-radius:50%;object-fit:cover;background:#fff;box-shadow:0 4px 18px rgba(0,0,0,.18)}
.pill{background:#fff;border-radius:999px;padding:12px 26px;font-weight:800;box-shadow:0 2px 10px rgba(0,0,0,.12)}
.btn{display:block;width:100%;text-align:center;text-decoration:none;background:var(--accent);color:#fff;font-weight:800;font-size:17px;padding:16px 18px;border-radius:12px;border:0;cursor:pointer;box-shadow:0 3px 12px rgba(0,0,0,.18);transition:transform .12s}
.btn:active{transform:scale(.98)}
.btn:disabled{opacity:.6}
.btn-wheel{background:#fff;color:var(--accent)}
.socials{display:flex;gap:26px;margin-top:10px}
.socials a{width:44px;height:44px;display:grid;place-items:center;color:#fff;filter:drop-shadow(0 1px 3px rgba(0,0,0,.5))}
.socials svg{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ---------- Roue ---------- */
body.wheel-page{min-height:100vh;background:#161a2e;color:#fff}
.back{position:absolute;top:14px;left:16px;text-decoration:none;opacity:.8;font-weight:700}
.wheel-wrap{max-width:440px;margin:0 auto;padding:48px 16px 40px;display:flex;flex-direction:column;align-items:center;gap:18px}
.wheel-wrap h1{font-size:26px;margin:0;text-align:center}
.wheel-box{position:relative;width:min(92vw,380px);aspect-ratio:1}
.wheel-box canvas{width:100%;height:100%;display:block}
.pointer{position:absolute;top:-6px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:16px solid transparent;border-right:16px solid transparent;border-top:30px solid #fff;z-index:2;filter:drop-shadow(0 2px 3px rgba(0,0,0,.5))}
.card{width:100%;background:#fff;color:#1b1b3a;border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:12px;box-shadow:0 6px 24px rgba(0,0,0,.3)}
.card[hidden]{display:none}
.card p{margin:0}
.card input[type=tel]{font:inherit;font-size:18px;padding:14px;border:2px solid #d8d6e6;border-radius:10px;width:100%}
.card input[type=tel]:focus{outline:none;border-color:var(--accent)}
.check{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.35}
.check input{margin-top:2px;width:18px;height:18px;flex:none;accent-color:var(--accent)}
.error{color:#c62828;font-weight:700}
.steps{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:8px;font-weight:700}
button.link{background:none;border:0;color:#666;text-decoration:underline;font:inherit;cursor:pointer}
.result{text-align:center}
.result .big{font-size:20px;font-weight:800}
.result .prize{font-size:24px;font-weight:800;color:var(--accent)}
.result .code{font-size:34px;letter-spacing:6px;font-weight:800;border:3px dashed var(--accent);border-radius:12px;padding:10px}
.small{font-size:13px;opacity:.7}
.rules{line-height:1.5;font-size:15px}
