/* Life Legacy — definitive mobile production layer v5
   Mobile-only. Desktop layout and product logic are untouched. */
@media (max-width:820px){
  :root{--ll-topbar-h:56px;--ll-sectionnav-h:52px;--ll-mobile-head:108px;--ll-gutter:12px}

  html,body{
    width:100%!important;max-width:100%!important;overflow-x:hidden!important;
    scroll-behavior:auto!important;-webkit-text-size-adjust:100%!important;text-size-adjust:100%!important;
  }
  html{scroll-padding-top:calc(var(--ll-mobile-head) + 12px)!important}
  body{min-height:100dvh!important;overscroll-behavior-x:none!important}
  body,.app,.app>main{transform:none!important;perspective:none!important;filter:none!important;contain:none!important}
  .app{display:block!important;width:100%!important;max-width:100%!important;min-height:100dvh!important;overflow:visible!important}
  .app>main,main{
    width:100%!important;max-width:100%!important;min-width:0!important;margin:0!important;
    padding-top:var(--ll-mobile-head)!important;overflow-x:clip!important;
  }

  /* App controls stay fixed. */
  html body .pro-topbar{
    position:fixed!important;top:0!important;left:0!important;right:0!important;z-index:2147482000!important;
    width:100%!important;max-width:100%!important;height:var(--ll-topbar-h)!important;min-height:var(--ll-topbar-h)!important;
    margin:0!important;padding:7px max(10px,env(safe-area-inset-right)) 7px max(10px,env(safe-area-inset-left))!important;
    background:rgba(248,248,249,.985)!important;border-bottom:1px solid rgba(0,0,0,.08)!important;
    box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
    transform:none!important;will-change:auto!important;
  }
  html[data-lce-theme="dark"] body .pro-topbar{background:rgba(16,16,17,.985)!important;border-bottom-color:rgba(255,255,255,.10)!important}
  html body .pro-topbar-left{flex:1 1 auto!important;min-width:0!important;max-width:calc(100% - 84px)!important}
  html body .pro-topbar-right{flex:0 0 auto!important;gap:7px!important}
  html body .pro-searchbtn{width:100%!important;min-width:0!important;max-width:none!important;height:40px!important;overflow:hidden!important}
  html body .pro-searchbtn span{overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
  html body .pro-top-action{width:40px!important;min-width:40px!important;height:40px!important}
  html body .pro-profile{width:36px!important;min-width:36px!important;height:36px!important}

  /* The section menu is always visible while scrolling. */
  html body .app>.sidebar,
  html body.lce-v10-browse .app>.sidebar,
  html body.lce-v10-detail .app>.sidebar{
    position:fixed!important;top:var(--ll-topbar-h)!important;left:0!important;right:0!important;z-index:2147481900!important;
    display:block!important;width:100%!important;max-width:100%!important;height:var(--ll-sectionnav-h)!important;min-height:var(--ll-sectionnav-h)!important;
    margin:0!important;padding:5px max(7px,env(safe-area-inset-right)) 5px max(7px,env(safe-area-inset-left))!important;
    border:0!important;border-bottom:1px solid rgba(0,0,0,.08)!important;border-radius:0!important;
    background:rgba(248,248,249,.99)!important;box-shadow:0 2px 12px rgba(0,0,0,.035)!important;
    overflow:hidden!important;transform:none!important;will-change:auto!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  }
  html[data-lce-theme="dark"] body .app>.sidebar{background:rgba(16,16,17,.99)!important;border-bottom-color:rgba(255,255,255,.10)!important}
  html body .app>.sidebar .brand,html body .app>.sidebar .sidebar-foot{display:none!important}
  html body .app>.sidebar #nav{
    display:flex!important;align-items:center!important;flex-wrap:nowrap!important;gap:5px!important;
    width:100%!important;max-width:100%!important;height:42px!important;margin:0!important;padding:0 2px!important;
    overflow-x:auto!important;overflow-y:hidden!important;scroll-behavior:auto!important;scroll-snap-type:none!important;
    overscroll-behavior-inline:contain!important;scrollbar-width:none!important;-webkit-overflow-scrolling:touch!important;touch-action:pan-x!important;
  }
  html body .app>.sidebar #nav::-webkit-scrollbar{display:none!important}
  html body .app>.sidebar #nav button{
    flex:0 0 auto!important;display:flex!important;align-items:center!important;gap:7px!important;
    width:auto!important;min-width:0!important;max-width:none!important;height:38px!important;min-height:38px!important;
    margin:0!important;padding:8px 11px!important;border-radius:11px!important;white-space:nowrap!important;
    font-size:12px!important;line-height:1!important;transform:none!important;transition:none!important;scroll-snap-align:none!important;
  }
  html body .app>.sidebar #nav button.active,html body .app>.sidebar #nav button.lce-v10-current{font-weight:800!important}
  html body .app>.sidebar #nav .pro-navicon{width:15px!important;height:15px!important;flex:0 0 15px!important}
  html body .app>.sidebar #nav svg{width:15px!important;height:15px!important}

  /* Never show old page layers underneath the current mobile mode. */
  html body.lce-v10-browse main>.page{display:none!important}
  html body.lce-v10-browse #lce-v10-journey{display:block!important}
  html body.lce-v10-detail #lce-v10-journey{display:none!important}
  html body.lce-v10-detail main>.page{display:none!important}
  html body.lce-v10-detail main>.page.active{
    display:block!important;width:100%!important;max-width:100%!important;min-width:0!important;
    margin:0!important;padding:10px max(var(--ll-gutter),env(safe-area-inset-right)) calc(72px + env(safe-area-inset-bottom)) max(var(--ll-gutter),env(safe-area-inset-left))!important;
    overflow-x:hidden!important;
  }
  html body.lce-v10-detail main>.page.active>.lce-v9-hero{display:none!important}

  /* Browse journey is phone-sized and stable. */
  html body #lce-v10-journey{
    width:100%!important;max-width:100%!important;min-width:0!important;
    margin:0!important;padding:8px var(--ll-gutter) calc(72px + env(safe-area-inset-bottom))!important;overflow-x:hidden!important;
  }
  html body #lce-v10-journey .lce-v10-stop{width:100%!important;max-width:100%!important;min-width:0!important;margin:0 0 14px!important;overflow:hidden!important}
  html body #lce-v10-journey .lce-v9-hero,
  html body #lce-v10-journey .lce-v10-hero{
    width:100%!important;max-width:100%!important;min-width:0!important;min-height:0!important;
    margin:0!important;padding:20px 14px 18px!important;border-radius:24px!important;overflow:hidden!important;transform:none!important;transition:none!important;
  }
  html body #lce-v10-journey .lce-v9-title{font-size:clamp(38px,11vw,52px)!important;line-height:.97!important;letter-spacing:-.052em!important;margin-bottom:12px!important}
  html body #lce-v10-journey .lce-v9-desc{max-width:100%!important;font-size:15px!important;line-height:1.4!important}
  html body #lce-v10-journey .lce-v9-actions{display:grid!important;grid-template-columns:1fr!important;width:100%!important;gap:8px!important;margin-top:15px!important}
  html body #lce-v10-journey .lce-v9-actions button{width:100%!important;min-height:46px!important;font-size:13px!important}
  html body #lce-v10-journey .lce-v10-stop:not([data-page="home"]) .lce-v9-scene{height:228px!important;min-height:228px!important;max-height:228px!important;margin-top:13px!important;overflow:hidden!important}

  /* Home map: every node stays visible. */
  html body #lce-v10-journey .lce-v10-stop[data-page="home"] .lce-v9-scene{height:390px!important;min-height:390px!important;max-height:390px!important;margin-top:10px!important;overflow:hidden!important}
  html body #lce-v10-journey .lce-v10-stop[data-page="home"] .lce-v110-glass-map{width:100%!important;height:378px!important;min-height:378px!important;max-height:378px!important;overflow:hidden!important}
  html body .lce-v110-glass-map .lce-v105-core{width:116px!important;height:116px!important;padding:12px!important}
  html body .lce-v110-glass-map .lce-v105-core strong{font-size:15px!important;line-height:1!important}
  html body .lce-v110-glass-map .lce-v105-core span{font-size:7px!important;line-height:1.2!important}
  html body .lce-v110-glass-map .lce-v105-node{width:118px!important;height:104px!important;min-height:0!important;padding:7px!important;border-radius:16px!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;transition:none!important}
  html body .lce-v110-glass-map .lce-v105-node.n1{left:0!important;top:1%!important}html body .lce-v110-glass-map .lce-v105-node.n2{right:0!important;top:1%!important}
  html body .lce-v110-glass-map .lce-v105-node.n3{left:0!important;bottom:2%!important}html body .lce-v110-glass-map .lce-v105-node.n4{right:0!important;bottom:2%!important}
  html body .lce-v109-node-head>b{font-size:9px!important}.lce-v109-node-head>span{font-size:5px!important}
  html body .lce-v110-memory-stage,html body .lce-v110-people-stage,html body .lce-v110-capsule-stage,html body .lce-v110-legacy-stage{height:65px!important;margin-top:2px!important}
  html body .lce-v110-capsule-object{transform:translate(-50%,-50%) rotate(-2deg) scale(.44)!important}
  html body .lce-v110-legacy-object{transform:translate(-50%,-50%) rotate(-1.6deg) scale(.45)!important}

  /* Return button remains under the fixed section menu. */
  html body.lce-v10-detail #lce-v10-detailbar{
    display:flex!important;align-items:center!important;position:sticky!important;top:calc(var(--ll-mobile-head) + 2px)!important;z-index:900!important;
    width:100%!important;max-width:100%!important;min-height:48px!important;margin:0 0 10px!important;padding:5px 0!important;
    background:rgba(248,248,249,.985)!important;border-bottom:1px solid rgba(0,0,0,.06)!important;
  }
  html[data-lce-theme="dark"] body.lce-v10-detail #lce-v10-detailbar{background:rgba(16,16,17,.985)!important;border-bottom-color:rgba(255,255,255,.08)!important}
  html body.lce-v10-detail .lce-v10-back{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;min-height:42px!important;padding:8px 13px!important;border-radius:12px!important;white-space:nowrap!important}

  /* Absolute rule for all section interiors: nothing can exceed the phone viewport. */
  html body.lce-v10-detail main>.page.active *,
  html body.lce-v10-detail main>.page.active *::before,
  html body.lce-v10-detail main>.page.active *::after{box-sizing:border-box!important;min-width:0!important}
  html body.lce-v10-detail main>.page.active>*{width:100%!important;max-width:100%!important}
  html body.lce-v10-detail main>.page.active img,
  html body.lce-v10-detail main>.page.active picture,
  html body.lce-v10-detail main>.page.active video,
  html body.lce-v10-detail main>.page.active canvas,
  html body.lce-v10-detail main>.page.active iframe,
  html body.lce-v10-detail main>.page.active audio,
  html body.lce-v10-detail main>.page.active svg{max-width:100%!important}
  html body.lce-v10-detail main>.page.active img,html body.lce-v10-detail main>.page.active video{height:auto!important}
  html body.lce-v10-detail main>.page.active iframe,html body.lce-v10-detail main>.page.active audio{width:100%!important}
  html body.lce-v10-detail main>.page.active h1,
  html body.lce-v10-detail main>.page.active h2,
  html body.lce-v10-detail main>.page.active h3,
  html body.lce-v10-detail main>.page.active p,
  html body.lce-v10-detail main>.page.active span,
  html body.lce-v10-detail main>.page.active strong{overflow-wrap:anywhere!important;word-break:normal!important}

  /* Original functional section header. */
  html body.lce-v10-detail main>.page.active>.hero{
    display:grid!important;grid-template-columns:1fr!important;gap:10px!important;width:100%!important;max-width:100%!important;min-height:0!important;
    margin:0 0 14px!important;padding:8px 0 14px!important;overflow:hidden!important;border:0!important;box-shadow:none!important;background:transparent!important;
  }
  html body.lce-v10-detail main>.page.active>.hero h1{margin:4px 0 8px!important;font-size:clamp(28px,8.5vw,36px)!important;line-height:1.03!important;letter-spacing:-.042em!important}
  html body.lce-v10-detail main>.page.active>.hero p{margin:0!important;font-size:14px!important;line-height:1.48!important}
  html body.lce-v10-detail main>.page.active>.hero .actions{display:grid!important;grid-template-columns:1fr!important;width:100%!important;gap:7px!important}
  html body.lce-v10-detail main>.page.active>.hero button{width:100%!important;max-width:100%!important;min-height:44px!important;white-space:normal!important}

  /* Common grids/flex rows become true phone layouts. */
  html body.lce-v10-detail .grid,
  html body.lce-v10-detail .split,
  html body.lce-v10-detail .home-cards,
  html body.lce-v10-detail .quick,
  html body.lce-v10-detail .map-layout,
  html body.lce-v10-detail .lce-rel-grid,
  html body.lce-v10-detail .lce-rel-form,
  html body.lce-v10-detail .sp2-shell,
  html body.lce-v10-detail .sp2-grid,
  html body.lce-v10-detail .sp2-profile-grid,
  html body.lce-v10-detail .moi-grid,
  html body.lce-v10-detail .moi-project-grid,
  html body.lce-v10-detail .moi-goal-grid,
  html body.lce-v10-detail .legacy-grid-v2,
  html body.lce-v10-detail .journal-prompt-grid-v3,
  html body.lce-v10-detail #journal .split,
  html body.lce-v10-detail #caps .split,
  html body.lce-v10-detail #ai .ai-p1-layout,
  html body.lce-v10-detail #tv .rt4-entry{
    display:grid!important;grid-template-columns:minmax(0,1fr)!important;width:100%!important;max-width:100%!important;gap:10px!important;
  }
  html body.lce-v10-detail .stats{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important;max-width:100%!important;gap:8px!important}
  html body.lce-v10-detail .card,
  html body.lce-v10-detail .panel,
  html body.lce-v10-detail .stat,
  html body.lce-v10-detail .event,
  html body.lce-v10-detail .place,
  html body.lce-v10-detail .lce-rel-person,
  html body.lce-v10-detail [data-memory],
  html body.lce-v10-detail [data-person],
  html body.lce-v10-detail .caps-card-v2,
  html body.lce-v10-detail .legacy-card-v2,
  html body.lce-v10-detail .journal-card-v2{
    width:100%!important;max-width:100%!important;min-width:0!important;margin-left:0!important;margin-right:0!important;overflow:hidden!important;transform:none!important;
  }
  html body.lce-v10-detail [class*="-row"],html body.lce-v10-detail [class*="-actions"],html body.lce-v10-detail .toolbar,html body.lce-v10-detail .lce-toolbar{max-width:100%!important;flex-wrap:wrap!important}

  /* Forms: single column and no iOS auto-zoom. */
  html body.lce-v10-detail form,html body.lce-v10-detail .lce-form,html body.lce-v10-detail .lce-realform,html body.lce-v10-detail .people-complete-form,html body.lce-v10-detail .legacy-form{width:100%!important;max-width:100%!important}
  html body.lce-v10-detail input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  html body.lce-v10-detail textarea,html body.lce-v10-detail select{width:100%!important;max-width:100%!important;min-width:0!important;font-size:16px!important}
  html body.lce-v10-detail .lce-form .two,html body.lce-v10-detail .hc-grid,html body.lce-v10-detail .h3-grid{grid-template-columns:1fr!important}

  /* Souvenirs / timeline / living memory. */
  html body.lce-v10-detail #mem .timeline>.year{grid-template-columns:1fr!important;gap:10px!important}
  html body.lce-v10-detail #mem .timeline>.year>.yearlabel{position:static!important}
  html body.lce-v10-detail #mem .lce-day-group{grid-template-columns:1fr!important;gap:8px!important}
  html body.lce-v10-detail #mem .lce-day-cards{grid-template-columns:1fr!important}
  html body.lce-v10-detail #mem .mem-timeline-media-v3,html body.lce-v10-detail #mem .lce-media-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important}
  html body.lce-v10-detail #mem [class*="living-"]{max-width:100%!important;min-width:0!important}

  /* Proches. */
  html body.lce-v10-detail #people .lce-rel-grid{grid-template-columns:1fr!important}
  html body .lce-rel-modalback{padding:8px!important;overflow-y:auto!important}
  html body .lce-rel-modal{width:100%!important;max-width:100%!important;max-height:calc(100dvh - 16px)!important;padding:16px!important;border-radius:20px!important;overflow-x:hidden!important}
  html body .lce-rel-form{grid-template-columns:1fr!important}
  html body .lce-rel-form label.full{grid-column:auto!important}

  /* Capsules. */
  html body.lce-v10-detail #caps .caps-grid-v2,html body.lce-v10-detail #caps .caps-grid,html body.lce-v10-detail #caps .grid{grid-template-columns:1fr!important;width:100%!important}
  html body.lce-v10-detail #caps .caps-card-v2{grid-template-columns:1fr!important}
  html body.lce-v10-detail #caps .caps-visual-v2{width:100%!important;min-height:180px!important;height:180px!important;background-size:min(76%,290px) auto,100% 100%!important}

  /* Héritage. */
  html body.lce-v10-detail #legacy [class*="grid"],html body.lce-v10-detail #legacy [class*="shell"]{max-width:100%!important;min-width:0!important}
  html body.lce-v10-detail #legacy .legacy-grid-v2{grid-template-columns:1fr!important}

  /* Journal. */
  html body.lce-v10-detail #journal [class*="grid"],html body.lce-v10-detail #journal .split{grid-template-columns:1fr!important;width:100%!important}
  html body.lce-v10-detail #journal textarea{min-height:160px!important}

  /* Mon univers. */
  html body.lce-v10-detail #moi [class*="grid"]{grid-template-columns:1fr!important;width:100%!important}
  html body.lce-v10-detail #moi .moi-tabs,html body.lce-v10-detail #settings .sp2-nav{
    position:static!important;display:flex!important;flex-wrap:nowrap!important;width:100%!important;max-width:100%!important;overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:none!important;-webkit-overflow-scrolling:touch!important;
  }
  html body.lce-v10-detail #moi .moi-tabs::-webkit-scrollbar,html body.lce-v10-detail #settings .sp2-nav::-webkit-scrollbar{display:none!important}
  html body.lce-v10-detail #moi .moi-tabs button,html body.lce-v10-detail #settings .sp2-nav button{flex:0 0 auto!important;white-space:nowrap!important}

  /* Salon. Keep room + YouTube, no film catalogue. */
  html body.lce-v10-detail #tv #salon-free-culture-v1,html body.lce-v10-detail #tv .fc1{display:none!important}
  html body.lce-v10-detail #tv,html body.lce-v10-detail #tv #rt-workspace,html body.lce-v10-detail #tv .rt-shell,html body.lce-v10-detail #tv .rt-panel{width:100%!important;max-width:100%!important;min-width:0!important}
  html body.lce-v10-detail #tv .rt4-screen,html body.lce-v10-detail #tv iframe,html body.lce-v10-detail #tv video{width:100%!important;max-width:100%!important;height:auto!important;aspect-ratio:16/9!important}

  /* IA. */
  html body.lce-v10-detail #ai .ai-p1-layout{grid-template-columns:1fr!important}
  html body.lce-v10-detail #ai .ai-p1-main,html body.lce-v10-detail #ai .ai-p1-chat{width:100%!important;max-width:100%!important;min-width:0!important}
  html body.lce-v10-detail #ai .ai-p1-chat{max-height:55dvh!important;overflow-y:auto!important;overflow-x:hidden!important}

  /* Settings. */
  html body.lce-v10-detail #settings .sp2-shell{grid-template-columns:1fr!important}
  html body.lce-v10-detail #settings .sp2-grid{grid-template-columns:1fr!important}
  html body.lce-v10-detail #settings .sp2-summary{grid-template-columns:repeat(2,minmax(0,1fr))!important}

  /* Tables and wide embeds remain usable instead of overflowing. */
  html body.lce-v10-detail table{display:block!important;width:100%!important;max-width:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important}
  html body.lce-v10-detail pre,html body.lce-v10-detail code{max-width:100%!important;overflow-wrap:anywhere!important;white-space:pre-wrap!important}

  /* All product modals fit the dynamic iOS viewport. */
  html body .lce-modalback,html body .people-complete-back,html body .sp1-modalback,html body .ai-v4-back,html body .ai-v6-back,html body .ll-account-modalback,html body .hc-back,html body .h3-back{
    width:100vw!important;max-width:100vw!important;min-height:100dvh!important;overflow-x:hidden!important;overflow-y:auto!important;
    padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))!important;
  }
  html body .lce-modal,html body .people-complete-modal,html body .sp1-modal,html body .ai-v4-modal,html body .ai-v6-modal,html body .ll-account-modal,html body .hc-modal,html body .h3-modal{
    width:100%!important;max-width:100%!important;min-width:0!important;max-height:calc(100dvh - 16px)!important;overflow-x:hidden!important;overflow-y:auto!important;
  }

  /* Remove mobile-only visual work that causes Safari jank. */
  html body.lce-v10-detail [class*="glass"],html body.lce-v10-detail [class*="blur"],html body #lce-v10-journey [class*="glass"]{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  @media (hover:none) and (pointer:coarse){
    html body *{scroll-behavior:auto!important}
    html body.lce-v10-detail .card:hover,html body.lce-v10-detail .panel:hover,html body.lce-v10-detail [data-memory]:hover,html body.lce-v10-detail [data-person]:hover{transform:none!important}
    html body #lce-v10-journey *{transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}
  }
}

@media (max-width:390px){
  :root{--ll-gutter:10px}
  html body #lce-v10-journey .lce-v9-title{font-size:clamp(35px,10.8vw,45px)!important}
  html body .app>.sidebar #nav button{padding-inline:9px!important;font-size:11px!important}
  html body #lce-v10-journey .lce-v10-stop[data-page="home"] .lce-v9-scene{height:374px!important;min-height:374px!important;max-height:374px!important}
  html body #lce-v10-journey .lce-v10-stop[data-page="home"] .lce-v110-glass-map{height:362px!important;min-height:362px!important;max-height:362px!important}
  html body .lce-v110-glass-map .lce-v105-node{width:112px!important;height:100px!important}
  html body .lce-v110-glass-map .lce-v105-core{width:108px!important;height:108px!important}
  html body.lce-v10-detail .stats,html body.lce-v10-detail #settings .sp2-summary{grid-template-columns:1fr!important}
}