@font-face { font-family:Bricolage; src:url(assets/bricolage-bold.woff) format('woff'); font-weight:700; font-display:swap; }
.labo-experience{ color-scheme:light; --paper:#f6f5f2; --ink:#242320; --muted:#6e6a63; --line:#dedbd4; --red:#e8382f; }
.labo-experience *{ box-sizing:border-box; }
.labo-experience{ margin:0; width:100%; height:100%; overflow:hidden; overscroll-behavior:none; background:var(--paper); }
.labo-experience{ color:var(--ink); font:15px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.labo-experience a{ color:inherit; text-decoration:none; }
.labo-experience button{ font:inherit; color:inherit; cursor:pointer; }
.labo-experience button:disabled{ opacity:.5; cursor:default; }
.labo-experience button,.labo-experience a{ -webkit-tap-highlight-color:transparent; }
.labo-experience button:focus-visible,.labo-experience a:focus-visible,.labo-experience canvas:focus-visible{ outline:2px solid var(--red); outline-offset:5px; }
.labo-experience [hidden]{ display:none!important; }
.labo-experience h1,.labo-experience h2,.labo-experience h3,.labo-experience p{ margin:0; }
.labo-experience h1,.labo-experience h2,.labo-experience h3{ line-height:1.08; }
.labo-experience .sr,.labo-experience .skip:not(:focus){ position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.labo-experience .skip:focus{ position:fixed; z-index:6; top:10px; left:10px; padding:12px; background:white; }
.labo-experience #entree{ position:fixed; inset:0; width:100%; height:100%; height:100dvh; overflow:hidden; }
.labo-experience .heart-stage{ position:absolute; inset:0; overflow:hidden; z-index:0; isolation:isolate; background:#f2ede7; }
.labo-experience .heart-poster,.labo-experience #heart{ position:absolute; inset:0; width:100%; height:100%; display:block; }
.labo-experience .heart-poster{ object-fit:contain; pointer-events:none; z-index:1; }
.labo-experience #heart{ opacity:0; touch-action:none; outline-offset:-4px; transition:opacity 420ms cubic-bezier(.2,.7,.2,1); }
.labo-experience .heart-stage.ready #heart{ opacity:1; }
.labo-experience .heart-stage.ready .heart-poster{ opacity:0; }
.labo-experience .heart-stage.loading .heart-poster{ opacity:0; }
.labo-experience .heart-loader{ position:absolute; inset:0; display:grid; place-items:center; pointer-events:none; z-index:3; }
.labo-experience .heart-loader__pixels{ display:flex; gap:4px; }
.labo-experience .heart-loader__pixels i{ width:6px; height:6px; background:var(--red); opacity:.2; }
.labo-experience .heart-stage.loading .heart-loader__pixels i{ animation:pixel-loading 1200ms steps(2,end) infinite; animation-delay:calc(var(--pixel) * 85ms - 1200ms); }
@keyframes pixel-loading {
  0%,20%,80%,100% { opacity:.2; }
  45%,55% { opacity:1; }
}
.labo-experience .scene-header{ position:absolute; top:max(28px,env(safe-area-inset-top)); left:max(34px,env(safe-area-inset-left)); right:max(34px,env(safe-area-inset-right)); display:flex; align-items:center; justify-content:space-between; pointer-events:none; z-index:3; }
.labo-experience .scene-header a{ pointer-events:auto; }
.labo-experience .scene-header,.labo-experience .intro-copy,.labo-experience .heart-controls{ transform:translateZ(0); }
.labo-experience .brand img{ display:block; width:128px; height:auto; }
.labo-experience .header-links{ display:flex; gap:20px; align-items:center; }
.labo-experience .collection-open{ display:inline-flex; gap:11px; align-items:center; font-size:12px; padding:11px 16px; border:1px solid #d6d2cb; border-radius:5px; background:#f6f5f2d9; }
.labo-experience .collection-open:hover{ background:#fff; }
.labo-experience .collection-open>span{ font-size:10px; color:var(--muted); margin-left:4px; }
.labo-experience .collection-open svg{ width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1; }
.labo-experience .agency-link{ font-size:23px; padding:4px; }
.labo-experience .intro-copy{ position:absolute; left:max(36px,env(safe-area-inset-left)); bottom:max(31px,env(safe-area-inset-bottom)); max-width:325px; z-index:2; pointer-events:none; }
.labo-experience h1{ font-family:Bricolage,sans-serif; font-size:38px; letter-spacing:-.045em; }
.labo-experience h1 em{ display:block; margin-top:7px; font:italic 28px/1.1 Georgia,serif; letter-spacing:-.035em; }
.labo-experience .intro-copy>p{ margin-top:17px; color:var(--muted); font-size:12px; line-height:1.7; }
.labo-experience .intro-copy>.heart-hint{ font-size:10px; color:#8b847a; margin-top:13px; }
.labo-experience .heart-controls{ position:absolute; bottom:max(30px,env(safe-area-inset-bottom)); right:max(32px,env(safe-area-inset-right)); display:flex; gap:8px; z-index:3; }
.labo-experience .heart-controls button{ border:1px solid #d9d5cf; border-radius:50%; background:#ffffff90; display:grid; place-items:center; width:42px; height:42px; padding:0; }
.labo-experience .heart-controls button:hover{ background:#fff; }
.labo-experience .heart-controls svg{ width:17px; height:17px; stroke:currentColor; fill:none; stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round; }
.labo-experience #heart-motion[aria-pressed=true] .pause-icon,.labo-experience #heart-motion[aria-pressed=false] .play-icon{ display:none; }
.labo-experience .callout{ position:absolute; inset:0; pointer-events:none; z-index:2; opacity:0; visibility:hidden; transition:opacity .16s; }
.labo-experience .callout.visible{ opacity:1; visibility:visible; }
.labo-experience .leader-svg{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.labo-experience #leader{ fill:none; stroke:#111; stroke-width:1.2; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:1; stroke-dashoffset:0; }
.labo-experience #anchor-dot{ fill:#111; stroke:#111; stroke-width:1; }
.labo-experience .hover-label{ position:absolute; top:0; left:0; display:flex; flex-direction:column; width:max-content; max-width:250px; padding:0 0 8px; border-bottom:1px solid #111; text-shadow:0 1px 12px var(--paper); }
.labo-experience .hover-label>span:first-child{ color:#81766c; font-size:10px; line-height:1.5; }
.labo-experience .hover-label strong{ font-size:19px; font-weight:500; letter-spacing:-.025em; line-height:1.25; margin-top:4px; }
.labo-experience .hover-instruction{ font-size:10px; color:#8d8176; margin-top:6px; }
.labo-experience .hover-instruction span{ margin-left:12px; }
.labo-experience .button{ display:inline-flex; align-items:center; justify-content:center; gap:20px; padding:14px 20px; border:1px solid transparent; border-radius:4px; font-size:13px; font-weight:600; line-height:1.4; }
.labo-experience .button.dark{ background:var(--ink); color:white; }
.labo-experience .button.dark:hover{ background:#403d36; }
.labo-experience h2{ font-family:Bricolage,sans-serif; font-size:40px; letter-spacing:-.04em; }
.labo-experience dialog{ width:min(1100px,calc(100% - 56px)); max-height:calc(100dvh - 56px); border:1px solid var(--line); padding:0; border-radius:10px; background:var(--paper); color:var(--ink); overflow:auto; overscroll-behavior:contain; }
.labo-experience dialog::backdrop{ background:#25231f9c; backdrop-filter:blur(5px); }
.labo-experience dialog[open]{ animation:dialog-rise 420ms cubic-bezier(.16,1,.3,1) both; }
.labo-experience dialog[open]::backdrop{ animation:backdrop-enter 240ms ease-out both; }
.labo-experience dialog[open].closing{ animation:dialog-descend 300ms cubic-bezier(.4,0,1,1) both; pointer-events:none; }
.labo-experience dialog[open].closing::backdrop{ animation:backdrop-exit 300ms ease-in both; }
@keyframes dialog-rise {
  from { transform:translateY(calc(50dvh + 50% + 32px)); }
  to { transform:translateY(0); }
}
@keyframes dialog-descend {
  from { transform:var(--dialog-close-from,translateY(0)); }
  to { transform:translateY(calc(50dvh + 50% + 32px)); }
}
@keyframes backdrop-enter { from { opacity:0; } to { opacity:1; } }
@keyframes backdrop-exit { from { opacity:var(--backdrop-close-from,1); } to { opacity:0; } }
.labo-experience .dialog-bar{ display:flex; justify-content:space-between; align-items:center; padding:16px 26px; border-bottom:1px solid var(--line); font-size:12px; position:sticky; top:0; background:var(--paper); z-index:2; }
.labo-experience .dialog-bar button,.labo-experience .dialog-bar>a{ border:0; background:none; padding:5px 0 5px 16px; font-size:12px; }
.labo-experience .dialog-bar button span,.labo-experience .dialog-bar>a span{ font-size:21px; vertical-align:-2px; margin-left:14px; }
.labo-experience .collection-dialog{ height:min(86dvh,900px); overflow:hidden; }
.labo-experience .collection-dialog[open],.labo-experience .collection-dialog:target{ display:flex; flex-direction:column; }
.labo-experience .collection-dialog:target:not([open]){ position:fixed; inset:0; z-index:5; margin:auto; box-shadow:0 0 0 100vmax #25231fcc; }
.labo-experience .collection-content{ overflow:auto; padding:34px; min-height:0; overscroll-behavior:contain; }
.labo-experience .collection-heading{ display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:25px; }
.labo-experience .collection-heading p{ font-size:12px; color:var(--muted); }
.labo-experience .filters{ display:flex; gap:8px; margin-bottom:26px; flex-wrap:wrap; }
.labo-experience .filters button{ border:1px solid var(--line); background:none; border-radius:5px; padding:9px 14px; font-size:12px; white-space:nowrap; }
.labo-experience .filters button span{ font-size:10px; opacity:.6; margin-left:8px; }
.labo-experience .filters button[aria-pressed=true]{ background:var(--ink); border-color:var(--ink); color:white; }
.labo-experience .cards{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:31px 21px; }
.labo-experience .card{ display:block; min-width:0; }
.labo-experience .card-image{ display:block; position:relative; aspect-ratio:16/10; border-radius:6px; background:#eae5dd; overflow:hidden; }
.labo-experience .card-image img{ width:100%; height:100%; display:block; object-fit:cover; transition:transform .3s; }
.labo-experience .card[data-category=games] .card-image{ background:#191a18; }
.labo-experience .card[data-category=games] .card-image img,.labo-experience .card[data-category=films] .card-image img{ object-fit:contain; padding:12px; }
.labo-experience .card:hover img{ transform:scale(1.03); }
.labo-experience .card-arrow{ position:absolute; bottom:10px; right:10px; width:28px; height:28px; display:grid; place-items:center; background:#f6f5f2e8; border-radius:50%; font-size:17px; }
.labo-experience .card-meta{ display:block; font-size:10px; color:var(--muted); margin-top:12px; }
.labo-experience .card h3{ font-size:19px; font-weight:600; letter-spacing:-.025em; margin-top:6px; }
.labo-experience .card p{ color:var(--muted); font-size:12px; margin-top:6px; line-height:1.5; }
.labo-experience #curiosity{ width:min(900px,calc(100% - 56px)); }
.labo-experience #curiosity .dialog-bar{ justify-content:flex-end; border:0; padding:12px 22px; }
.labo-experience .detail-layout{ display:grid; grid-template-columns:1.1fr 1fr; align-items:center; gap:36px; padding:0 30px 30px; }
.labo-experience .detail-preview{ background:#eae5dd; border-radius:6px; overflow:hidden; aspect-ratio:1.1; }
.labo-experience .detail-preview img{ width:100%; height:100%; object-fit:cover; display:block; }
.labo-experience .detail-preview.game{ background:#191a18; }
.labo-experience .detail-preview.game img,.labo-experience .detail-preview.film img{ object-fit:contain; padding:16px; }
.labo-experience .detail-meta{ font-size:11px; color:var(--muted); }
.labo-experience .detail-copy h2{ font-size:36px; margin:10px 0 16px; }
.labo-experience .detail-description{ font-size:14px; color:var(--muted); line-height:1.75; }
.labo-experience .detail-credit{ margin-top:12px; font-size:11px; color:var(--muted); line-height:1.5; }
.labo-experience .detail-actions{ margin-top:26px; }
.labo-experience .launch-note{ font-size:11px; color:var(--muted); margin-top:11px; }
.labo-experience .player{ padding:14px; background:#111311; min-height:200px; }
.labo-experience .player iframe{ display:block; width:100%; height:min(73dvh,760px); border:0; border-radius:5px; background:#111311; }
.labo-experience .player video{ display:block; width:auto; height:min(73dvh,760px); max-width:100%; margin-inline:auto; object-fit:contain; background:#111311; }
.labo-experience .player .loading-note{ color:#d2cdc4; text-align:center; font-size:12px; padding:10px; }
.labo-experience .player .loading-note a{ text-decoration:underline; }
.labo-experience dialog.playing .detail-layout{ display:none; }
.labo-experience dialog.playing{ width:min(1100px,calc(100% - 40px)); }
@media(max-width:850px) {
  .labo-experience .cards{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .labo-experience .detail-layout{ gap:26px; padding:28px; }
  .labo-experience .detail-copy h2{ font-size:34px; }
  .labo-experience .collection-heading{ align-items:flex-start; flex-direction:column; gap:12px; }
}
@media(max-width:650px) {
  .labo-experience .heart-poster{ transform:translateY(-12vh) scale(1.29); }
  .labo-experience .scene-header{ top:max(20px,env(safe-area-inset-top)); left:20px; right:19px; }
  .labo-experience .brand img{ width:106px; }
  .labo-experience .header-links{ gap:9px; }
  .labo-experience .collection-open{ padding:9px 10px; font-size:11px; gap:7px; }
  .labo-experience .collection-open svg{ width:14px; height:14px; }
  .labo-experience .collection-open>span{ display:none; }
  .labo-experience .agency-link{ font-size:21px; }
  .labo-experience .intro-copy{ left:23px; bottom:max(25px,env(safe-area-inset-bottom)); max-width:265px; }
  .labo-experience h1{ font-size:31px; }
  .labo-experience h1 em{ font-size:24px; margin-top:6px; }
  .labo-experience .intro-copy>p{ font-size:11px; margin-top:13px; }
  .labo-experience .intro-copy>.heart-hint{ max-width:230px; font-size:9px; margin-top:10px; }
  .labo-experience .heart-controls{ right:18px; bottom:max(24px,env(safe-area-inset-bottom)); flex-direction:column; gap:7px; }
  .labo-experience .heart-controls button{ width:38px; height:38px; }
  .labo-experience .hover-label{ max-width:176px; }
  .labo-experience .hover-label strong{ font-size:17px; }
  .labo-experience .hover-label>span:first-child{ font-size:9px; }
  .labo-experience .hover-instruction{ font-size:9px; }
  .labo-experience dialog{ width:calc(100% - 24px); max-height:calc(100dvh - 28px); }
  .labo-experience .dialog-bar{ padding:12px 17px; }
  .labo-experience .collection-dialog{ height:calc(100dvh - 28px); }
  .labo-experience .collection-content{ padding:23px 17px; }
  .labo-experience .collection-heading{ margin-bottom:22px; }
  .labo-experience h2{ font-size:32px; }
  .labo-experience .filters{ gap:6px; margin-bottom:23px; }
  .labo-experience .filters button{ padding:8px 10px; font-size:11px; }
  .labo-experience .cards{ gap:25px 13px; }
  .labo-experience .card-image{ aspect-ratio:1.1; }
  .labo-experience .card[data-category=games] .card-image img,.labo-experience .card[data-category=films] .card-image img{ padding:8px; }
  .labo-experience .card h3{ font-size:17px; }
  .labo-experience .card-meta{ font-size:9px; margin-top:10px; }
  .labo-experience .card p{ font-size:11px; }
  .labo-experience .card-arrow{ bottom:8px; right:8px; width:25px; height:25px; font-size:15px; }
  .labo-experience #curiosity{ width:calc(100% - 28px); }
  .labo-experience #curiosity .dialog-bar{ padding:10px 20px; }
  .labo-experience .detail-layout{ grid-template-columns:1fr; padding:0 22px 26px; gap:24px; }
  .labo-experience .detail-preview{ aspect-ratio:1.35; max-height:32dvh; }
  .labo-experience .detail-preview.game img,.labo-experience .detail-preview.film img{ padding:10px; }
  .labo-experience .detail-copy h2{ font-size:30px; margin:8px 0 12px; }
  .labo-experience .detail-description{ font-size:13px; }
  .labo-experience .detail-actions{ margin-top:21px; }
  .labo-experience dialog.playing{ width:calc(100% - 16px); }
  .labo-experience .player{ padding:7px; }
  .labo-experience .player iframe{ height:74dvh; }
  .labo-experience .player .loading-note{ padding:7px 4px; font-size:10px; }
}
@media(max-height:520px) {
  .labo-experience .scene-header{ top:15px; }
  .labo-experience .brand img{ width:103px; }
  .labo-experience .intro-copy{ bottom:20px; max-width:270px; }
  .labo-experience h1{ font-size:27px; }
  .labo-experience h1 em{ font-size:22px; }
  .labo-experience .intro-copy>p:not(.heart-hint){ display:none; }
  .labo-experience .intro-copy>.heart-hint{ margin-top:10px; }
  .labo-experience .heart-controls{ bottom:20px; flex-direction:row; }
}
@media(prefers-reduced-motion:reduce) {
  .labo-experience #heart,.labo-experience .heart-poster,.labo-experience .callout,.labo-experience .card-image img{ transition:none; }
  .labo-experience .heart-stage.loading .heart-loader__pixels i{ animation:none; opacity:.65; }
  .labo-experience dialog[open],.labo-experience dialog[open]::backdrop,.labo-experience dialog[open].closing,.labo-experience dialog[open].closing::backdrop{ animation:none; }
}

/* Adaptation locale du paquet Labo au chrome partagé de Bonabona.
   Le build l'ajoute aux styles préfixés du studio, uniquement dans /labo/. */
body.labo-page{
  width:100%;height:100%;overflow:hidden;overscroll-behavior:none;
}
body.labo-page{background:#f2ede7}
.labo-experience{height:100dvh;font-weight:400}
/* Rétablir les valeurs que le reset et les cartes de la vitrine modifieraient. */
.labo-experience dialog{margin:auto}
.labo-experience .card,.labo-experience .card:hover{
  border:0;background:transparent;padding:0;gap:0;transform:none;box-shadow:none;transition:none;
}
.labo-experience .skip{letter-spacing:normal;text-transform:none}
.labo-experience .skip:focus{z-index:102}