:root{font-family:Inter,system-ui,sans-serif;color:var(--ink);font-synthesis:none}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,input{font:inherit}button{cursor:pointer;color:inherit;border:0;background:none}button:disabled{opacity:.45;cursor:wait}button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:3px}main,.viewport{position:fixed;inset:0}.viewport canvas{display:block;width:100%;height:100%;cursor:grab}.viewport canvas:active{cursor:grabbing}.island{position:absolute;inset:50% 20px auto auto;transform:translateY(-50%);display:flex;align-items:center;gap:12px;width:max-content;max-width:calc(100vw - 40px);background:none;border:0;box-shadow:none;overflow:visible}.verre{background:linear-gradient(150deg,#ffffffc9,var(--surface));border:1px solid #ffffffd9;border-radius:20px;box-shadow:0 15px 55px #0000001c,inset 0 1px #fff;backdrop-filter:blur(28px) saturate(1.25);-webkit-backdrop-filter:blur(28px) saturate(1.25)}.dock{display:flex;flex-direction:column;align-items:stretch;padding:8px;gap:3px}.dock button:hover,.dock .active,.icon{width:40px;height:40px;display:grid;place-items:center;flex-shrink:0;border-radius:12px}.palette{display:flex;flex-direction:column;gap:10px;padding:14px;width:320px;max-height:min(74vh,620px);animation:palette-entre .18s ease-out}@keyframes palette-entre{0%{opacity:0;transform:translate(10px) scale(.985)}}.palette header{display:flex;align-items:center;justify-content:space-between;gap:6px}.palette header>.icon{flex-shrink:0}.onglets{display:flex;gap:2px;min-width:0}.onglets button{padding:6px 9px;border-radius:9px;font-size:12px;font-weight:600;color:var(--muted);white-space:nowrap}.onglets button:hover{color:var(--ink)}.onglets button.active{background:var(--pastille);color:var(--accent-texte)}.search{display:flex;gap:7px;align-items:center;background:#ffffff70;border:1px solid #fff9;padding:7px 10px;border-radius:10px}.search input{background:none;border:0;outline:none;width:100%;font-size:12px}.corps{display:flex;flex-direction:column;gap:12px;flex:1;min-height:0;overflow:auto;padding:2px;overscroll-behavior:contain}.section h2{margin:0 0 6px;font-size:9.5px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}.vide{margin:0;font-size:12px;color:var(--muted)}.cards{display:grid;grid-auto-rows:max-content;align-content:start;gap:6px}.motion{grid-template-columns:repeat(4,1fr)}.card{position:relative;padding:0;border:0;border-radius:11px;overflow:hidden;background:#ffffff4d;text-align:left;transition:background .15s}.card:hover{background:#fffd}.card.chosen{background:#30cb7714;box-shadow:inset 0 0 0 1.5px var(--accent)}.card img{width:100%;display:block;object-fit:cover}.motion img{aspect-ratio:1;height:auto;object-fit:contain}.scenes{display:grid;gap:2px;padding:2px}.scene{position:relative;overflow:hidden;display:grid;grid-template-columns:16px 1fr auto;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;text-align:left;transition:background .15s}.scene b{font-size:13px;font-weight:500}.scene.chosen b{font-weight:600}.scene i{font-size:11px;font-style:normal;font-variant-numeric:tabular-nums;opacity:.55}.scene svg{opacity:.6}.scene.chosen svg{opacity:1}.scene.chosen:after{content:"";position:absolute;inset:auto 0 0;height:1.5px;background:currentColor;transform:scaleX(var(--avance, 0));transform-origin:left}.lumieres{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:2px}.lumiere{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 6px 10px;border-radius:11px;background:#ffffff4d;font-size:10px;font-weight:500;line-height:1.2;text-align:center;transition:background .15s}.lumiere:hover{background:#fffd}.lumiere.chosen{background:#30cb7714;color:var(--accent-texte);box-shadow:inset 0 0 0 1.5px var(--accent)}.check{position:absolute;right:5px;top:5px;background:var(--accent);color:#fff;border-radius:50%;padding:2px;width:17px;height:17px}.status,.error{position:absolute;left:50%;top:80px;transform:translate(-50%);font-size:12px;padding:12px 18px;background:#fffc;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:18px;display:flex;align-items:center;gap:10px}.error{color:#803d32;max-width:90vw}.error button{display:grid;place-items:center}.spinner{border:2px solid var(--hairline);border-top-color:var(--accent-texte);border-radius:50%;width:14px;height:14px;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:760px){.dock{flex-wrap:wrap;justify-content:center;max-width:440px}.palette{padding:15px}.status,.error{top:100px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}.spinner,.palette{animation:none}}.touch-controls{display:none}@media(pointer:coarse){.touch-controls{display:flex}}@media(max-width:760px){.viewport{bottom:calc(76px + env(safe-area-inset-bottom))}.island{top:auto;right:auto;left:50%;bottom:calc(10px + env(safe-area-inset-bottom));transform:translate(-50%);flex-direction:column;gap:0;max-width:calc(100vw - 20px);width:440px;border-radius:22px;overflow:hidden;background:linear-gradient(135deg,#ffffffc9,var(--surface));border:1px solid #ffffffd9;box-shadow:0 15px 55px #0000001c,inset 0 1px #fff;backdrop-filter:blur(28px) saturate(1.25);-webkit-backdrop-filter:blur(28px) saturate(1.25)}.island>.verre{background:none;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}.dock{flex-direction:row;align-items:center;padding:7px;gap:2px;justify-content:space-between;max-width:none}.palette{width:100%;border-bottom:1px solid #ffffffb0;max-height:min(58dvh,480px);padding:14px;overscroll-behavior:contain}.search input{font-size:16px}.card{min-width:0}.touch-controls{display:flex;position:absolute;bottom:calc(100px + env(safe-area-inset-bottom));left:24px;right:24px;justify-content:space-between;align-items:center;pointer-events:none}.joystick,.run{pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none;background:var(--verre);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border:1px solid var(--hairline);box-shadow:0 6px 24px #00000018}.joystick{width:106px;height:106px;border-radius:50%;display:grid;place-items:center;position:relative}.stick{width:42px;height:42px;border-radius:50%;background:var(--accent);border:1px solid var(--hairline);pointer-events:none}.joystick small{position:absolute;bottom:8px;font-size:9px;pointer-events:none}.run{width:66px;height:66px;border-radius:50%;font-size:11px}.run.active{background:var(--accent);color:var(--on-accent)}}@media(max-height:500px)and (max-width:760px){.palette{max-height:65dvh}.touch-controls{bottom:82px}.joystick{width:86px;height:86px}}@media(pointer:coarse)and (min-width:761px){.touch-controls{display:flex;position:absolute;bottom:calc(100px + env(safe-area-inset-bottom));left:24px;right:24px;justify-content:space-between;align-items:center;pointer-events:none}.joystick,.run{pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none;background:var(--verre);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border:1px solid var(--hairline);box-shadow:0 6px 24px #00000018}.joystick{width:106px;height:106px;border-radius:50%;display:grid;place-items:center;position:relative}.stick{width:42px;height:42px;border-radius:50%;background:var(--accent);border:1px solid var(--hairline);pointer-events:none}.joystick small{position:absolute;bottom:8px;font-size:9px;pointer-events:none}.run{width:66px;height:66px;border-radius:50%;font-size:11px}.run.active{background:var(--accent);color:var(--on-accent)}}.game-actions{display:flex;gap:10px;pointer-events:auto}.hud{position:absolute;z-index:15;left:50%;bottom:calc(22px + env(safe-area-inset-bottom));transform:translate(-50%);display:flex;align-items:center;gap:14px;padding:7px 11px;font-size:11px;color:var(--muted);pointer-events:none;white-space:nowrap}.hud b{display:flex;align-items:center;gap:4px;font-weight:500}.hud kbd{display:grid;place-items:center;min-width:18px;height:18px;padding:0 5px;font:inherit;font-size:10px;color:var(--ink);background:var(--pastille);border:1px solid var(--hairline);border-radius:5px}@media(pointer:coarse){.hud{display:none}}.approche{position:absolute;z-index:16;left:50%;bottom:calc(64px + env(safe-area-inset-bottom));transform:translate(-50%);display:flex;align-items:center;gap:10px;padding:9px 14px;border-radius:999px;font-size:12px;color:var(--ink);white-space:nowrap;animation:approche-entree .22s ease-out}.approche b{font-weight:600}.approche span{display:flex;align-items:center;gap:5px;color:var(--muted)}.approche kbd{display:grid;place-items:center;min-width:18px;height:18px;padding:0 5px;font:inherit;font-size:10px;color:var(--ink);background:var(--pastille);border:1px solid var(--hairline);border-radius:5px}@keyframes approche-entree{0%{opacity:0;transform:translate(-50%,6px)}}.fiche-fond{position:fixed;z-index:40;inset:0;display:grid;place-items:center;padding:20px;background:#0000002e;animation:fiche-fondu .18s ease-out}.fiche{width:min(430px,100%);padding:20px;cursor:default;animation:fiche-entree .24s cubic-bezier(.2,.8,.3,1)}.fiche header{display:flex;align-items:flex-start;gap:12px}.fiche header img{width:40px;height:40px;object-fit:contain;background:#f7f5f0;border:1px solid var(--hairline);border-radius:10px;padding:4px}.fiche header div{flex:1;min-width:0}.fiche h2{font-size:16px;font-weight:600;line-height:1.25}.fiche header p{font-size:12px;color:var(--muted)}.fiche .dates{margin-top:14px;font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}.fiche .resume{margin-top:6px;font-size:13px;line-height:1.55;color:var(--ink)}.fiche .media{margin-top:14px;border-radius:14px;overflow:hidden;background:#16171b;line-height:0}.fiche .media video,.fiche .media img{display:block;width:100%;max-height:min(52vh,460px);object-fit:contain}.fiche .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px;list-style:none}.fiche .tags li{padding:4px 10px;font-size:11px;color:var(--muted);background:var(--pastille);border:1px solid var(--hairline);border-radius:999px}.fiche .liens{display:flex;flex-direction:column;margin-top:16px;border-top:1px solid var(--hairline)}.fiche .liens a{display:flex;align-items:center;gap:8px;margin:0;padding:10px 2px;font-size:12.5px;color:var(--ink);background:none;border-bottom:1px solid var(--hairline);border-radius:0}.fiche .liens a span{color:var(--muted);min-width:74px}.fiche .liens a strong{flex:1;font-weight:500}.fiche .liens a svg{color:var(--muted);flex:none}.fiche .liens .sources{justify-content:center;padding-top:12px;font-size:11.5px;color:var(--muted);border-bottom:0}.fiche a{display:inline-flex;align-items:center;gap:5px;margin-top:16px;padding:8px 13px;font-size:12px;font-weight:500;color:var(--accent-texte);background:var(--accent);border-radius:999px}@keyframes fiche-fondu{0%{opacity:0}}@keyframes fiche-entree{0%{opacity:0;transform:translateY(10px) scale(.97)}}@media(prefers-reduced-motion:reduce){.approche,.fiche-fond,.fiche{animation:none}}:root{--canvas:#08090a;--surface:#0f1011;--raised:#17181b;--ink:#f7f8f8;--muted:#a2a7af;--accent:#30cb77;--accent-texte:#30cb77;--on-accent:#04160c;--hairline:#ffffff18;--verre:#0f1011ed;--pastille:#ffffff05;font-family:Inter,system-ui,sans-serif;color:var(--ink);color-scheme:dark;background:var(--canvas)}body.studio-clair{--canvas:#e8e8de;--surface:#f6f6f0;--raised:#e3e5d7;--ink:#1c2621;--muted:#5b665e;--accent-texte:#157641;--on-accent:#04160c;--hairline:#1c262124;--verre:#f7f8f2ee;--pastille:#0000000a;color-scheme:light}body,body.page-defilante{background:var(--canvas);color:var(--ink)}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}::selection{background:#30cb7740}.verre{background:var(--verre);border:1px solid var(--hairline);border-radius:12px;box-shadow:0 12px 32px #0003;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}.dock button:hover,.dock .active,.lumiere:hover,.card:hover,.scene:hover{background:var(--raised)}.dock .active,.lumiere.chosen,.scene.chosen{color:var(--accent-texte)}.check{background:var(--accent);color:var(--on-accent)}.card,.lumiere{background:var(--pastille);border-color:var(--hairline);border-radius:8px}.card.chosen,.lumiere.chosen{background:#30cb7714;border-color:var(--accent)}.scene.chosen{background:#30cb7714}.search{background:var(--raised);border-color:var(--hairline)}.search input{color:var(--ink)}.search input::placeholder,.section h2,.vide{color:var(--muted)}.status,.error{background:var(--surface);color:var(--ink);border:1px solid var(--hairline)}.spinner{border-color:var(--hairline);border-top-color:var(--accent-texte)}.fond-toggle{position:fixed;z-index:30;top:20px;right:24px;display:grid;place-items:center;width:38px;height:38px;border-radius:10px;color:var(--muted)}.fond-toggle:hover{background:var(--pastille);color:var(--ink)}.pixl-lockup{display:inline-flex;align-items:center;gap:6px}.pixl-lockup-mark{height:24px;width:auto}.pixl-lockup-word{height:20px;width:auto}.chargement{position:fixed;inset:0;z-index:60;display:grid;place-items:center;background:var(--canvas);color:var(--ink);transition:opacity .8s cubic-bezier(.4,0,.2,1),visibility 0s linear .8s}.chargement.sortie{opacity:0;visibility:hidden;pointer-events:none}.chargement.sortie .pixl-lockup{transform:scale(1.06)}.chargement .pixl-lockup{gap:clamp(10px,2.4vmin,22px);transition:transform .8s cubic-bezier(.4,0,.2,1)}.chargement .pixl-lockup-mark{height:clamp(72px,15vmin,150px)}.chargement .pixl-lockup-word{height:clamp(60px,12.5vmin,125px)}.hors-ecran{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}@media(max-width:760px){.fond-toggle{top:calc(12px + env(safe-area-inset-top));right:16px}.island{z-index:20}.island.verre{background:var(--surface)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.chargement .pixl-lockup{transform:none!important}}@media(prefers-reduced-transparency:reduce){.verre{background:var(--surface);backdrop-filter:none;-webkit-backdrop-filter:none}}@media(max-width:760px){.island{background:var(--verre);border:1px solid var(--hairline);box-shadow:0 12px 32px #0003}.palette{border-bottom-color:var(--hairline)}}
