:root{color-scheme:dark;--gold:#ffedcb;--ink:#091925;--line:#cfa85c}*{box-sizing:border-box}body{margin:0;background:var(--ink);color:var(--gold);font-family:Georgia,serif}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible{outline:3px solid #fff;outline-offset:4px}main{min-height:100svh;display:grid;align-items:center;overflow:hidden}section{width:100%}[hidden]{display:none!important}.scene{position:relative;width:100%;aspect-ratio:3/1;isolation:isolate}.scene img,.scene video{display:block;width:100%;height:100%;object-fit:cover}.hotspot,.image-nav button{position:absolute;border:0;background:transparent;border-radius:12px}.hotspot:hover,.image-nav button:hover{box-shadow:0 0 25px #ffdca638,inset 0 0 0 1px #ffe6b35e}.enter{top:24%;left:40.8%;width:18.4%;height:9%}.direct{top:34%;left:43%;width:14%;height:7%}.image-nav button{top:2%;height:8%}.stories{left:14.5%;top:46%;width:9%;height:9%}.discoveries{left:41%;top:40%;width:9%;height:10%}.coloring{left:59.5%;top:69%;width:9%;height:9%}.maxi{left:83%;top:47%;width:10%;height:10%}.controls{display:flex;justify-content:center;gap:24px;padding:20px}.controls button,.back{border:0;background:none;color:#d9c8a7;font-size:14px;text-decoration:underline;text-underline-offset:5px}.back{display:block;margin:20px auto}.mobile-entry,.mobile-nav,.mobile-places{display:none}.scene{transition:transform .8s cubic-bezier(.22,.61,.36,1),opacity .8s}.leaving .scene{transform:scale(1.3);opacity:0}.arriving .scene{animation:arrive .85s both}@keyframes arrive{from{opacity:0;transform:scale(1.1)}to{opacity:1;transform:scale(1)}}dialog{width:min(720px,92vw);max-height:86svh;border:1px solid #bda16b;border-radius:20px;background:linear-gradient(135deg,#102939,#091824);color:var(--gold);padding:30px;box-shadow:0 30px 100px #0008}dialog::backdrop{background:#020a11c9;backdrop-filter:blur(8px)}.dialog-head{display:flex;justify-content:space-between;align-items:center}.dialog-head p{font:12px system-ui;letter-spacing:.2em}.dialog-head button{background:transparent;border:0;font-size:32px}h2{font-size:36px;font-weight:normal;margin:16px 0 24px}dialog p{font-family:system-ui;line-height:1.6}.book-list{display:grid;gap:12px}.book{border:1px solid #ffffff20;border-radius:12px;padding:16px}.book h3{margin:0;font-size:21px;font-weight:normal}.book p{margin:6px 0 0;color:#d2dce0;font-size:14px}.prototype-note{border-top:1px solid #ffffff20;margin-top:24px;padding-top:16px;color:#bdc8cf;font-size:13px}.gold{border:0;border-radius:30px;background:var(--gold);color:var(--ink);padding:14px 22px}.text{background:none;border:0;text-decoration:underline;margin:16px}.mobile-places button,.mobile-nav button{border:1px solid #bda16b66;background:#102a38;border-radius:12px;padding:12px}
/* La vidéo 5:2 partage la hauteur du visuel 3:1. Ses côtés sont complétés
   par le visuel validé ; la dernière image vidéo reste affichée à la fin. */
.entry-scene #opening{position:absolute;top:0;left:8.333333%;width:83.333334%;height:100%;object-fit:contain;mask-image:linear-gradient(to right,transparent,#000 2%,#000 98%,transparent)}
.entry-signature{position:absolute;inset:0;pointer-events:none;background:url('assets/entree-ouverte.png') center/100% 100% no-repeat;mask-image:linear-gradient(to right,transparent 79%,#000 83%),linear-gradient(to bottom,transparent 89%,#000 93%);mask-composite:intersect}
@media(max-width:700px){main{display:block;padding-top:20px}.scene{aspect-ratio:3/1}.mobile-entry{display:flex;align-items:center;flex-direction:column;padding:24px 18px;text-align:center}.mobile-entry h1{font-size:30px;font-weight:normal;margin:0 0 22px}.enter,.direct{display:none}.controls{padding:0 10px 20px}.mobile-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;padding:0 14px 20px;font-size:14px}.image-nav{display:none}.mobile-places{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:24px 18px;font-size:18px}dialog{padding:22px}h2{font-size:30px}.place{min-height:24px}}@media(prefers-reduced-motion:reduce){.scene{transition:none}.arriving .scene{animation:none}}

/* Conserve les médias validés et rend les contrôles disponibles à toute largeur. */
body[data-view="world"] main{align-items:start;padding-top:24px}.mobile-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;padding:0 14px 20px;font-size:15px}.mobile-nav button{min-height:44px}.image-nav{display:none}
body[data-view="world"] .mobile-places{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;padding:20px 18px}.mobile-places button{min-height:44px}
@media(max-width:700px){body[data-view="world"] .mobile-places{display:grid;grid-template-columns:1fr 1fr}body[data-view="world"] main{padding-top:20px}}