:root{--creme: #fbf6ee;--encre: #1d1a24;--gris: #8b8496;--or: #ffd27f;--serif: "Instrument Serif", Georgia, serif;--sans: "Inter", system-ui, sans-serif}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;overflow:hidden;overscroll-behavior:none}button{touch-action:manipulation}body{background:#151b33;color:#fff;font-family:var(--sans);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}.scene{position:fixed!important;top:0;right:0;bottom:0;left:0;touch-action:none}.etiquette{font:500 .7rem/1.4 var(--sans);letter-spacing:.2em;text-transform:uppercase;opacity:.75}.bouton{padding:.85rem 1.8rem;border-radius:999px;cursor:pointer;border:1px solid rgba(255,255,255,.5);background:transparent;color:#fff;font:500 .95rem var(--sans);transition:transform .2s,background .3s,color .3s}.bouton:active{transform:scale(.97)}.bouton.plein{background:#fff;color:var(--encre);border-color:#fff}.bouton.plein:hover{background:var(--or);border-color:var(--or)}.intro{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.3rem;padding:16px;text-align:center;background:linear-gradient(180deg,#151b3333,#151b33bf);transition:opacity 1.2s ease,visibility 1.2s}.intro.cache{opacity:0;visibility:hidden}.intro h1{font:400 clamp(3rem,10vw,6.5rem)/.95 var(--serif);letter-spacing:-.02em;max-width:12ch}.intro p{font:400 clamp(1.05rem,3.6vw,1.25rem)/1.5 var(--sans);opacity:.85;max-width:34ch}.aide{font-size:.8rem;opacity:.55}.hud{position:fixed;top:0;left:0;right:0;z-index:5;display:flex;justify-content:space-between;align-items:center;padding:calc(18px + env(safe-area-inset-top)) clamp(16px,4vw,40px) 18px;pointer-events:none}.progression{display:flex;gap:8px}.progression span{width:10px;height:10px;border-radius:50%;border:1px solid rgba(255,255,255,.6);transition:background .6s,box-shadow .6s}.progression span.ok{background:var(--or);border-color:var(--or);box-shadow:0 0 12px var(--or)}.indice{position:fixed;left:50%;bottom:calc(28px + env(safe-area-inset-bottom));z-index:5;transform:translate(-50%);padding:.6rem 1.2rem;border-radius:999px;width:max-content;max-width:calc(100vw - 32px);text-align:center;background:#151b3373;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);font:500 .9rem var(--sans);pointer-events:none;animation:entre .8s ease both}@keyframes entre{0%{opacity:0;transform:translate(-50%,10px)}}.voile{position:fixed;top:0;right:0;bottom:0;left:0;z-index:8;display:flex;align-items:flex-end;justify-content:center;padding:16px 16px calc(16px + env(safe-area-inset-bottom));background:linear-gradient(180deg,transparent 30%,rgba(21,27,51,.55));animation:fondu .6s ease both}.carte{width:min(100%,34rem);margin-bottom:4vh;padding:1.8rem 1.8rem 1.6rem;border-radius:22px;max-height:calc(100dvh - 32px);overflow-y:auto;background:var(--creme);color:var(--encre);display:flex;flex-direction:column;gap:.9rem;align-items:flex-start;box-shadow:0 30px 80px -20px #00000080;animation:monte .7s cubic-bezier(.2,.8,.2,1) both}.carte .etiquette{color:var(--gris);opacity:1}.carte h2{font:400 clamp(2.2rem,7vw,3rem)/1 var(--serif);letter-spacing:-.01em}.carte p{font:400 1.05rem/1.6 var(--sans);color:#3d3846}.carte .bouton.plein{background:var(--encre);color:#fff;border-color:var(--encre);margin-top:.4rem}@keyframes monte{0%{opacity:0;transform:translateY(40px)}}@keyframes fondu{0%{opacity:0}}.finale{position:fixed;top:0;right:0;bottom:0;left:0;z-index:8;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:1.1rem;padding:16px 16px calc(9vh + env(safe-area-inset-bottom));text-align:center;background:linear-gradient(180deg,transparent 45%,rgba(21,27,51,.55));animation:fondu 1.4s ease both}.finale .message{font:italic 400 clamp(1.2rem,4vw,1.5rem) var(--serif);opacity:.85}.finale h2{font:400 clamp(2rem,7vw,3.4rem)/1.05 var(--serif);max-width:18ch}.finale h2.grand{font-size:clamp(4rem,15vw,8rem)}.son{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));z-index:9;padding:8px;background:none;border:0;color:#fff;opacity:.7;cursor:pointer;font:500 .7rem var(--sans);letter-spacing:.2em;text-transform:uppercase}@media (max-width: 600px){.hud .etiquette{display:none}.hud{justify-content:center}.carte{margin-bottom:0;padding:1.5rem 1.3rem 1.3rem;border-radius:20px}.carte .bouton{width:100%}.finale .bouton{min-width:60%}.son{top:calc(12px + env(safe-area-inset-top));bottom:auto}}@media (max-height: 480px){.intro{gap:.7rem}.intro h1{font-size:2.6rem}.intro p{font-size:.95rem}.carte{margin-bottom:0;padding:1.1rem 1.3rem;gap:.5rem}.carte h2{font-size:1.8rem}.carte p{font-size:.95rem;line-height:1.45}.finale{padding-bottom:16px;gap:.6rem}.finale h2.grand{font-size:3.5rem}}