*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;font-family:Inter,Arial,sans-serif;color:#123;background:#eef5fc;overflow:hidden}
header{height:76px;position:fixed;top:0;left:0;right:0;z-index:10;background:rgba(255,255,255,.94);display:flex;align-items:center;padding:8px 18px;box-shadow:0 2px 14px rgba(0,30,70,.15)}
.brand{display:flex;align-items:center;gap:12px}.brand img{width:58px;height:58px;object-fit:contain}.brand strong{display:block;color:#003a80;font-size:19px}.brand span{display:block;color:#52708c;font-size:12px;margin-top:3px}
.menu{position:fixed;z-index:8;top:76px;bottom:0;left:0;width:235px;background:#063b72;color:#fff;padding:18px 14px;overflow:auto}.menu h2{font-size:19px;margin:0 0 16px}.menu h3{font-size:12px;text-transform:uppercase;letter-spacing:.7px;color:#bcdcff;margin:16px 6px 6px}.menu a{display:block;color:white;text-decoration:none;padding:8px 10px;border-radius:8px;font-size:14px}.menu a:hover{background:rgba(255,255,255,.14)}
main{position:fixed;top:76px;left:235px;right:0;bottom:0}.scene3d{width:100%;height:100%}#scene3D{position:absolute;inset:0 385px 0 0}.info{position:absolute;right:0;top:0;bottom:0;width:385px;background:rgba(255,255,255,.97);padding:26px 22px;overflow:auto;box-shadow:-4px 0 18px rgba(0,30,70,.12)}.badge{display:inline-block;background:#d8eaff;color:#0050a0;padding:5px 9px;border-radius:20px;font-size:11px;font-weight:700}.info h1{color:#003a80;font-size:25px;margin:12px 0}.info p{line-height:1.55;color:#344b60}.criterion{margin:16px 0;padding:13px;border-left:4px solid #1474c4;background:#edf6ff;border-radius:8px;line-height:1.5}.question{margin-top:20px;line-height:1.5}.info button{display:block;width:100%;margin:8px 0;padding:10px 12px;border:1px solid #b7cce0;border-radius:9px;background:#fff;text-align:left;cursor:pointer;font-size:14px}.info button:hover{background:#edf6ff}.ok{color:#16824a;font-weight:700}.bad{color:#bd2934;font-weight:700}#feedback{margin-top:14px;line-height:1.5}.controls{position:absolute;left:18px;bottom:18px;z-index:5;display:flex;gap:8px;flex-wrap:wrap}.controls button{border:0;border-radius:9px;padding:10px 13px;background:#003a80;color:white;cursor:pointer;box-shadow:0 3px 8px rgba(0,30,70,.22)}.controls button:hover{background:#0050a0}
@media(max-width:900px){.menu{width:190px}.main{left:190px}main{left:190px}.info{width:330px}#scene3D{right:330px}}
@media(max-width:700px){.menu{top:64px;width:100%;height:50px;bottom:auto;display:flex;gap:4px;overflow-x:auto;padding:6px}.menu h2,.menu h3{display:none}.menu a{white-space:nowrap}.brand img{width:45px;height:45px}.brand strong{font-size:15px}.brand span{display:none}header{height:64px}main{top:114px;left:0}.info{top:auto;width:100%;height:45%;bottom:0;padding:13px 16px}.info h1{font-size:20px;margin:5px 0}.info p,.criterion{font-size:13px;margin:8px 0}.question{margin-top:8px}.controls{top:8px;bottom:auto;left:8px}.controls button{padding:7px 9px;font-size:12px}#scene3D{right:0;bottom:45%}}

/* V08 : lisibilité renforcée */
#scene3D canvas{display:block}
.info .criterion{font-size:14px}
.info .question{font-size:15px}

/* V09 : relation de Chasles pas à pas */
.formula{font-size:18px;margin:10px 0;overflow-x:auto}
#steps{margin:14px 0;padding:12px;border:1px solid #b7cce0;border-radius:10px;background:#f7fbff}
#steps .stepnav{display:flex;align-items:center;gap:10px}
#steps button{display:inline-block;width:auto;margin:0;padding:6px 14px;text-align:center}
#steps button:disabled{opacity:.35;cursor:default}
#stepcount{font-weight:700;color:#003a80;flex:1;text-align:center}
#stepcaption{margin-top:10px;line-height:1.5;color:#344b60;font-size:14px}

.menu a.active{background:rgba(255,255,255,.22);font-weight:700}

.home{margin-left:auto;padding:8px 16px;border-radius:999px;background:#003a80;color:#fff;font-weight:700;font-size:14px;text-decoration:none;white-space:nowrap}
.home:hover{background:#0759a5}

/* V16 : canvas toujours à la taille de la zone 3D, petits écrans */
#scene3D{overflow:hidden}
#scene3D canvas{width:100%!important;height:100%!important}
@media(max-width:700px){.home{padding:6px 10px;font-size:12px}.home{margin-left:auto}}
