#authScreen{position:fixed; inset:0; z-index:1000; background:var(--bg); display:flex; align-items:center; justify-content:center; padding:24px;}
  #authScreen.hidden{display:none;}
  .auth-card{width:100%; max-width:380px; background:var(--surface-raised); border:1px solid var(--line); border-radius:16px; padding:28px 22px;}
  .auth-card h2{font-family:'Fraunces',serif; font-size:24px; margin:0 0 6px; text-align:center;}
  .auth-sub{font-size:13.5px; color:var(--ink-soft); text-align:center; margin:0 0 22px;}
  .auth-card label{display:block; font-size:13px; color:var(--ink-soft); margin:12px 0 6px;}
  .auth-card input{width:100%; padding:12px 14px; border-radius:10px; border:1px solid var(--line); font-size:15px; font-family:inherit;}
  .auth-card input:focus{outline:none; border-color:var(--accent);}
  .auth-actions{margin-top:20px; display:flex; flex-direction:column; gap:10px;}
  .auth-error{color:#b33; font-size:13px; margin-top:10px; text-align:center; display:none;}
  .auth-switch{text-align:center; margin-top:16px; font-size:13.5px; color:var(--ink-soft);}
  .auth-switch a{color:var(--accent-deep); font-weight:600; cursor:pointer; text-decoration:none;}


  :root{
    --bg:#EDEAE2; --surface:#F7F5EF; --surface-raised:#FFFFFF;
    --ink:#24261F; --ink-soft:#5F6054; --ink-faint:#6E6F62;
    --accent:#46605A; --accent-deep:#34473F; --accent-warm:#C17F3F;
    --line:#DAD5C6; --radius:14px;
  }
  *{box-sizing:border-box; -webkit-tap-highlight-color:transparent;}
  html,body{margin:0;padding:0; max-width:100%; overflow-x:hidden;}
  body{background:var(--bg); color:var(--ink); font-family:'Inter',sans-serif; min-height:100vh; display:flex; justify-content:center;}
  #app{width:100%; max-width:480px; min-height:100vh; background:var(--bg); position:relative; display:flex; flex-direction:column; overflow-x:hidden; box-sizing:border-box;}
  /* Installé comme appli : toujours plein écran téléphone, pas de « bande » */
  @media (display-mode: standalone), (display-mode: fullscreen), (display-mode: minimal-ui){
    body{display:block;}
    #app{max-width:100%; width:100%;}
  }
  /* Écran tactile (téléphone) : même si le navigateur force « version PC », rester lisible */
  @media (pointer: coarse){
    body{display:block;}
    #app{max-width:100%; width:100%;}
  }

  header{padding:18px 16px 12px; background:var(--bg); position:sticky; top:0; z-index:10; max-width:100%; box-sizing:border-box;}
  .top-row{display:flex; justify-content:space-between; align-items:flex-start; gap:10px; min-width:0;}
  .top-row > div:first-child{min-width:0; flex:1; overflow:hidden;}
  .head-actions{display:flex; gap:6px; flex-shrink:0; align-items:center;}
  .brand-row{display:flex; align-items:center; gap:8px; flex-wrap:wrap; min-width:0;}
  h1{font-family:'Fraunces',serif; font-size:clamp(18px, 5.5vw, 22px); font-weight:600; margin:0; letter-spacing:-0.01em; overflow-wrap:anywhere;}
  .made-in-france{font-size:11px; color:var(--accent-deep); background:#E4E9DF; padding:3px 7px; border-radius:6px; white-space:nowrap; flex-shrink:0;}
  .tagline{color:var(--ink-soft); font-size:12.5px; margin:6px 0 12px; line-height:1.4; overflow-wrap:anywhere; word-break:break-word;}
  .icon-btn{width:36px; height:36px; border-radius:10px; border:1px solid var(--line); background:var(--surface-raised); display:flex; align-items:center; justify-content:center; cursor:pointer; flex-shrink:0;}
  .icon-btn svg{width:16px; height:16px; stroke:var(--ink-soft);}
  .user-bar{display:flex; align-items:center; justify-content:flex-end; gap:8px; font-size:11.5px; color:var(--ink-soft); margin:0 0 10px; flex-wrap:wrap; max-width:100%;}
  .user-bar span{max-width:55%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .user-bar button{border:1px solid var(--line); background:var(--surface-raised); border-radius:8px; padding:5px 10px; font-size:12px; cursor:pointer; flex-shrink:0;}

  .lang-row{display:flex; gap:6px; margin-bottom:12px; flex-wrap:wrap;}
  .lang-pill{padding:5px 10px; border-radius:999px; border:1px solid var(--line); background:var(--surface); font-size:11.5px; color:var(--ink-soft); cursor:pointer;}
  .lang-pill.active{background:var(--accent-deep); border-color:var(--accent-deep); color:#fff;}

  .spaces-row{display:flex; gap:8px; margin-bottom:12px; overflow-x:auto; scrollbar-width:none; padding-bottom:2px;}
  .spaces-row::-webkit-scrollbar{display:none;}
  .space-chip{flex:0 0 auto; display:flex; align-items:center; gap:6px; padding:8px 13px; border-radius:999px; border:1px solid var(--line); background:var(--surface); font-size:13px; color:var(--ink-soft); cursor:pointer; white-space:nowrap;}
  .space-chip.active{background:var(--accent-deep); border-color:var(--accent-deep); color:#fff;}
  .space-chip .shared-dot{width:6px; height:6px; border-radius:50%; background:var(--accent-warm); flex-shrink:0;}
  .space-add-chip{flex:0 0 auto; padding:8px 13px; border-radius:999px; border:1px dashed var(--line); background:transparent; font-size:13px; color:var(--ink-soft); cursor:pointer; white-space:nowrap;}

  .stats-row{display:flex; gap:8px; margin-bottom:14px; flex-wrap:wrap;}
  .stat-pill{background:var(--surface); border:1px solid var(--line); border-radius:999px; padding:6px 12px; font-size:13px; color:var(--ink-soft);}
  .stat-pill strong{color:var(--ink); font-weight:600;}
  .sync-pill{font-size:11.5px; color:var(--accent-deep); display:flex; align-items:center; gap:4px;}
  .sync-dot{width:6px; height:6px; border-radius:50%; background:var(--accent); flex-shrink:0;}

  .search-wrap{position:relative;}
  #search{width:100%; padding:13px 16px 13px 42px; border-radius:var(--radius); border:1px solid var(--line); background:var(--surface-raised); font-family:'Inter',sans-serif; font-size:15px; color:var(--ink); outline:none;}
  #search:focus{border-color:var(--accent);}
  #search::placeholder{color:var(--ink-faint);}
  .search-icon{position:absolute; left:15px; top:50%; transform:translateY(-50%); width:17px; height:17px; stroke:var(--ink-faint);}

  .ai-search-row{margin-top:10px; display:none;}
  .ai-search-btn{width:100%; padding:11px; border-radius:10px; border:1px dashed var(--accent); background:transparent; color:var(--accent-deep); font-size:13.5px; font-family:'Inter',sans-serif; font-weight:600; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:7px;}
  .ai-search-btn svg{width:14px; height:14px; stroke:var(--accent-deep);}

  .filters{display:flex; gap:8px; padding:14px 20px 4px; overflow-x:auto; scrollbar-width:none;}
  .filters::-webkit-scrollbar{display:none;}
  .chip{flex:0 0 auto; padding:7px 13px; border-radius:999px; border:1px solid var(--line); background:var(--surface); font-size:13px; color:var(--ink-soft); cursor:pointer; white-space:nowrap;}
  .chip.active{background:var(--accent); border-color:var(--accent); color:#fff;}
  /* Autocomplete sous le champ (une seule place — pas de chips ni datalist navigateur) */
  .ac-wrap{position:relative; width:100%;}
  .ac-list{position:absolute; left:0; right:0; top:calc(100% + 4px); z-index:40; max-height:200px; overflow-y:auto; -webkit-overflow-scrolling:touch; background:var(--surface-raised); border:1px solid var(--line); border-radius:12px; box-shadow:0 8px 24px rgba(36,38,31,0.12);}
  .ac-list[hidden]{display:none !important;}
  .ac-list button{display:block; width:100%; text-align:left; padding:12px 14px; border:none; border-bottom:1px solid var(--line); background:transparent; font-size:14.5px; color:var(--ink); font-family:inherit; cursor:pointer; -webkit-tap-highlight-color:transparent;}
  .ac-list button:last-child{border-bottom:none;}
  .ac-list button:active, .ac-list button.hl{background:var(--bg);}
  input[type=text]#fZone, input[type=text]#fCategory{text-overflow:ellipsis;}

  main{flex:1; padding:8px 20px 120px;}
  .item-card{background:var(--surface-raised); border:1px solid var(--line); border-radius:var(--radius); padding:15px 16px; margin-top:12px; display:flex; gap:13px; align-items:flex-start; cursor:pointer;}
  .item-card:active{border-color:var(--accent);}
  .item-icon{width:38px; height:38px; border-radius:10px; background:var(--bg); display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:18px; overflow:hidden;}
  .item-icon img{width:100%; height:100%; object-fit:cover;}
  .item-body{flex:1; min-width:0;}
  .item-name{font-weight:600; font-size:15px; margin-bottom:4px;}
  .item-path{font-size:13px; color:var(--ink-soft); display:flex; align-items:center; gap:4px; flex-wrap:wrap;}
  .item-detail{font-size:12.5px; color:var(--ink-faint); margin-top:3px;}
  .item-category-tag{font-size:11px; color:var(--accent-deep); background:#E4E9DF; padding:2px 8px; border-radius:6px; display:inline-block; margin-top:6px;}

  .empty-state{text-align:center; padding:60px 20px; color:var(--ink-soft);}
  .empty-state .big{font-family:'Fraunces',serif; font-size:19px; color:var(--ink); margin-bottom:6px;}
  .loading-state{text-align:center; padding:80px 20px; color:var(--ink-soft); font-size:14px;}

  .fab{position:fixed; bottom:24px; right:20px; width:58px; height:58px; border-radius:50%; background:var(--accent); border:none; display:flex; align-items:center; justify-content:center; box-shadow:0 6px 18px rgba(36,50,45,0.28); cursor:pointer; z-index:20;}
  .fab svg{width:24px; height:24px; stroke:#fff;}

  .overlay{position:fixed; inset:0; background:rgba(36,38,31,0.4); z-index:30; opacity:0; pointer-events:none; transition:opacity .2s ease;}
  .overlay.open{opacity:1; pointer-events:auto;}
  .panel{position:fixed; left:50%; bottom:0; transform:translate(-50%, 100%); width:100%; max-width:480px; background:var(--surface-raised); border-radius:22px 22px 0 0; z-index:31; padding:22px 20px 28px; transition:transform .28s cubic-bezier(.32,.72,0,1); max-height:90vh; overflow-y:auto; box-sizing:border-box;}
  @media (display-mode: standalone), (display-mode: fullscreen), (display-mode: minimal-ui), (pointer: coarse){
    .panel{max-width:100%;}
  }
  .panel.open{transform:translate(-50%, 0);}
  .panel-handle{width:36px; height:4px; background:var(--line); border-radius:2px; margin:0 auto 12px;}
  .panel-top{display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 14px;}
  .panel-top h2{font-family:'Fraunces',serif; font-size:21px; font-weight:600; margin:0; flex:1;}
  .panel-close{width:44px; height:44px; min-width:44px; min-height:44px; border-radius:12px; border:1px solid var(--line); background:var(--surface-raised); font-size:26px; line-height:1; color:var(--ink); cursor:pointer; flex-shrink:0; z-index:5; position:relative; display:inline-flex; align-items:center; justify-content:center; -webkit-tap-highlight-color:transparent;}
  .panel h2{font-family:'Fraunces',serif; font-size:21px; font-weight:600; margin:0 0 14px;}
  .btn-secondary{flex:1; padding:13px; border-radius:12px; border:1px solid var(--line); background:var(--surface); color:var(--ink); font-size:15px; font-weight:600; cursor:pointer;}

  label{display:block; font-size:12.5px; color:var(--ink-soft); margin:14px 0 6px;}
  .input-row{display:flex; gap:8px; align-items:center;}
  input[type=text]{width:100%; padding:12px 14px; border-radius:10px; border:1px solid var(--line); background:var(--bg); font-family:'Inter',sans-serif; font-size:15px; color:var(--ink); outline:none;}
  input[type=text]:focus{border-color:var(--accent);}
  .mic-btn{width:42px; height:42px; border-radius:10px; border:1px solid var(--line); background:var(--surface); flex-shrink:0; display:flex; align-items:center; justify-content:center; cursor:pointer; position:relative;}
  .mic-btn.listening{background:#B0503B; border-color:#B0503B;}
  .mic-btn svg{width:16px; height:16px; stroke:var(--ink-soft);}
  .mic-btn.listening svg{stroke:#fff;}
  .mic-alt{position:absolute; top:-6px; right:-6px; font-size:10px; background:var(--surface-raised); border:1px solid var(--line); border-radius:6px; padding:1px 3px; cursor:pointer;}
  .mic-alt.active{background:var(--accent-warm); border-color:var(--accent-warm);}

  .ai-hint{display:flex; align-items:center; gap:7px; margin-top:14px; padding:9px 12px; background:#E4E9DF; border-radius:10px; font-size:12.5px; color:var(--accent-deep); min-height:34px;}
  .ai-hint svg{width:14px; height:14px; stroke:var(--accent-deep); flex-shrink:0;}

  .photo-row{margin-top:14px; display:flex; align-items:center; gap:12px;}
  .photo-thumb{width:64px; height:64px; border-radius:12px; object-fit:cover; border:1px solid var(--line); display:none;}
  .photo-btn{padding:10px 14px; border-radius:10px; border:1px dashed var(--line); background:var(--surface); font-size:13px; color:var(--ink-soft); cursor:pointer; display:flex; align-items:center; gap:7px;}
  .photo-btn svg{width:15px; height:15px; stroke:var(--ink-soft);}
  .photo-remove{font-size:12px; color:#B0503B; cursor:pointer; display:none;}

  .history-box{margin-top:16px; padding:11px 13px; background:var(--bg); border-radius:10px; font-size:12.5px; color:var(--ink-soft);}
  .history-box .h-title{font-weight:600; color:var(--ink); margin-bottom:5px; font-size:12px;}
  .history-line{padding:2px 0;}

  .icon-pick-row{display:flex; gap:8px; flex-wrap:wrap; margin-top:4px;}
  .icon-pick{width:40px; height:40px; border-radius:10px; border:1px solid var(--line); background:var(--surface); font-size:18px; display:flex; align-items:center; justify-content:center; cursor:pointer;}
  .icon-pick.active{border-color:var(--accent); background:#E4E9DF;}

  .visibility-toggle{display:flex; gap:8px; margin-top:6px;}
  .vis-btn{flex:1; padding:11px; border-radius:10px; border:1px solid var(--line); background:var(--surface); font-size:12.5px; color:var(--ink-soft); text-align:center; cursor:pointer;}
  .vis-btn.active{background:var(--accent-deep); border-color:var(--accent-deep); color:#fff;}

  .panel-actions{display:flex; gap:10px; margin-top:22px;}
  .btn{flex:1; padding:13px; border-radius:10px; border:none; font-family:'Inter',sans-serif; font-weight:600; font-size:14.5px; cursor:pointer;}
  .btn-primary{background:var(--accent); color:#fff;}
  .btn-danger{background:transparent; color:#B0503B; border:1px solid #E3D2CA; flex:0 0 auto; padding:13px 16px;}

  .toast{position:fixed; bottom:24px; left:50%; transform:translateX(-50%) translateY(10px); background:var(--ink); color:#fff; padding:11px 18px; border-radius:10px; font-size:13.5px; z-index:50; opacity:0; pointer-events:none; transition:all .25s ease; max-width:88%; text-align:center;}
  .toast.show{opacity:1; transform:translateX(-50%) translateY(0);}

  /* ===== Mobile / PWA ===== */
  html{-webkit-text-size-adjust:100%; scroll-behavior:smooth;}
  body{min-height:100vh; min-height:100dvh;}
  #app{min-height:100vh; min-height:100dvh;}
  header{padding-top:calc(18px + env(safe-area-inset-top, 0px));}
  main{padding-bottom:calc(120px + env(safe-area-inset-bottom, 0px));}
  .fab{bottom:calc(24px + env(safe-area-inset-bottom, 0px)); right:max(20px, calc(50vw - 240px + 20px));}
  .toast{bottom:calc(24px + env(safe-area-inset-bottom, 0px));}
  .panel{padding-bottom:calc(28px + env(safe-area-inset-bottom, 0px)); max-height:90vh; max-height:90dvh;}
  input[type=text], .auth-card input{font-size:16px;}
  button{font-family:inherit;}
  button.icon-btn{padding:0;}
  .icon-btn svg{fill:none; stroke-linecap:round; stroke-linejoin:round;}
  .head-actions{display:flex; gap:8px; flex-shrink:0;}
  .sync-pill.err{color:#B0503B;}
  .sync-pill.err .sync-dot{background:#B0503B;}
  :focus-visible{outline:2px solid var(--accent); outline-offset:2px;}
  .empty-state button{margin-top:16px; padding:11px 18px; border-radius:10px; border:1px solid var(--line); background:var(--surface-raised); font-weight:600; cursor:pointer;}

  /* ===== Auth (fenêtre) ===== */
  #authScreen{background:rgba(36,38,31,.55); overflow-y:auto; align-items:flex-start; padding:max(24px, env(safe-area-inset-top, 0px)) 20px 24px;}
  .auth-card{position:relative; margin:auto;}
  .auth-close{position:absolute; top:8px; right:10px; width:40px; height:40px; border:none; background:none; font-size:26px; line-height:1; color:var(--ink-soft); cursor:pointer;}
  .auth-error.ok{color:var(--accent-deep);}
  .auth-forgot{text-align:right; margin-top:8px;}
  .link-btn{border:none; background:none; padding:4px 0; color:var(--accent-deep); font-weight:600; font-size:13.5px; cursor:pointer;}
  .auth-guest{width:100%; padding:12px; background:var(--surface); border:1px solid var(--line); color:var(--ink); border-radius:10px; font-size:14px; cursor:pointer;}
  .start-grid{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:6px;}
  .start-btn{display:flex; align-items:center; gap:10px; padding:14px 12px; border-radius:12px; border:1px solid var(--line); background:var(--surface); font-size:14.5px; font-weight:600; color:var(--ink); text-align:left; cursor:pointer;}
  .start-btn span:first-child{font-size:22px;}
  .start-btn:active{border-color:var(--accent);}

  /* ===== Page d'accueil ===== */
  #landing{width:100%; color:var(--ink);}
  .lp-wrap{width:min(1080px, calc(100% - 40px)); margin:0 auto; padding-bottom:calc(32px + env(safe-area-inset-bottom, 0px)); box-sizing:border-box; overflow-x:clip; max-width:100%;}
  .lp-nav{display:flex; flex-direction:column; align-items:stretch; gap:10px; padding:calc(14px + env(safe-area-inset-top, 0px)) 0 14px;}
  .lp-nav-top{display:flex; align-items:center; justify-content:space-between; gap:12px;}
  .lp-logo{display:flex; align-items:center; gap:10px; font-family:'Fraunces',serif; font-weight:600; font-size:20px; color:var(--ink); text-decoration:none; letter-spacing:-.01em; min-width:0;}
  .lp-logo span{white-space:nowrap;}
  .lp-logo img{border-radius:9px; flex-shrink:0; width:34px; height:34px;}
  .lp-nav-langs{display:flex; flex-wrap:wrap; gap:6px;}
  .lp-nav-langs .lang-pill{padding:5px 10px; font-size:12px;}
  .lp-btn{display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:12px 22px; border-radius:12px; border:1px solid transparent; font-weight:600; font-size:15px; cursor:pointer; text-decoration:none;}
  .lp-btn-sm{min-height:40px; padding:8px 16px; font-size:14px; flex-shrink:0;}
  .lp-btn-main{background:var(--accent-deep); color:#fff;}
  .lp-btn-main:active{background:var(--accent);}
  .lp-btn-ghost{background:transparent; border-color:var(--ink-faint); color:var(--ink);}
  .lp-btn-light{background:#F7F5EF; color:var(--accent-deep);}

  .lp-hero{display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:center; padding:28px 0 72px;}
  .lp-hero > *{min-width:0; max-width:100%;}
  /* FR/EN/DE/ES/IT — plus de coupe au bord de l’écran */
  .lp-h1{font-family:'Fraunces',serif; font-weight:600; font-size:clamp(1.85rem, 6vw, 3.4rem); line-height:1.15; letter-spacing:-.02em; margin:0 0 20px; max-width:100%; white-space:normal; overflow-wrap:break-word; word-break:normal; hyphens:manual; text-wrap:balance;}
  .lp-lead{font-size:1.05rem; line-height:1.65; color:var(--ink-soft); max-width:100%; margin:0; overflow-wrap:break-word; word-break:normal;}
  .lp-cta{display:flex; flex-wrap:wrap; gap:12px; margin-top:28px;}
  .lp-cta-center{justify-content:center;}
  .lp-small{margin:16px 0 0; font-size:13.5px; line-height:1.55; color:var(--ink-soft); max-width:100%; overflow-wrap:break-word; word-break:normal;}

  .lp-demo{background:var(--surface-raised); border:1px solid var(--line); border-radius:22px; padding:22px;}
  .lp-demo-label{font-size:13px; color:var(--ink-soft); margin-bottom:10px;}
  .lp-chips{display:flex; flex-wrap:wrap; gap:8px;}
  .lp-chip{padding:9px 13px; border-radius:999px; border:1px solid var(--line); background:var(--surface); font-size:13.5px; color:var(--ink-soft); cursor:pointer;}
  .lp-chip.on{background:var(--accent-deep); border-color:var(--accent-deep); color:#fff;}
  .lp-result{margin-top:20px; padding-top:20px; border-top:1px dashed var(--line); min-height:150px;}
  .lp-item{display:flex; align-items:center; gap:10px; font-weight:600; margin-bottom:12px;}
  .lp-item .ic{width:38px; height:38px; border-radius:10px; background:var(--bg); display:flex; align-items:center; justify-content:center; font-size:18px;}
  .lp-path{font-family:'Fraunces',serif; font-weight:600; font-size:clamp(1.2rem, 3.8vw, 1.75rem); line-height:1.3; letter-spacing:-.01em; color:var(--accent-deep); overflow-wrap:break-word; word-break:normal; max-width:100%;}
  .lp-sep{color:var(--accent-warm); margin:0 .3em; font-weight:500; white-space:nowrap;}
  .lp-meta{display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-top:14px; font-size:12.5px; color:var(--ink-faint);}
  .lp-tag{font-size:11px; color:var(--accent-deep); background:#E4E9DF; padding:2px 8px; border-radius:6px;}

  .lp-section{padding:56px 0; border-top:1px solid var(--line);}
  .lp-h2{font-family:'Fraunces',serif; font-weight:600; font-size:clamp(1.45rem, 4.2vw, 2.1rem); line-height:1.2; letter-spacing:-.01em; margin:0 0 28px; max-width:100%; overflow-wrap:normal; word-break:normal; text-wrap:balance;}
  .lp-rows{display:block;}
  .lp-row{display:grid; grid-template-columns:200px 1fr 1fr; gap:24px; padding:20px 0; border-top:1px solid var(--line); align-items:baseline;}
  .lp-row:first-child{border-top:none; padding-top:0;}
  .lp-row h3{font-family:'Fraunces',serif; font-size:1.2rem; margin:0;}
  .lp-row p{margin:0; color:var(--ink-soft); line-height:1.55;}
  .lp-ex{font-size:14px; color:var(--ink-soft);}
  .lp-ex b{display:block; margin-top:2px; color:var(--accent-deep);}

  .lp-feats{display:grid; grid-template-columns:repeat(3, 1fr); gap:32px 40px;}
  .lp-feats h3, .lp-steps h3{margin:0 0 6px; font-size:1.02rem;}
  .lp-feats p, .lp-steps p{margin:0; color:var(--ink-soft); line-height:1.55; font-size:.95rem;}
  .lp-steps{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3, 1fr); gap:32px 40px; counter-reset:step;}
  .lp-steps li{counter-increment:step; padding-top:18px; border-top:2px solid var(--accent-warm); position:relative;}
  .lp-steps li::before{content:counter(step); position:absolute; top:-15px; left:0; width:28px; height:28px; border-radius:50%; background:var(--bg); color:var(--accent-warm); font-family:'Fraunces',serif; font-weight:600; font-size:1.05rem; display:flex; align-items:center; justify-content:center;}

  .lp-install{display:grid; grid-template-columns:1.1fr .9fr; gap:40px; align-items:center; background:var(--accent-deep); color:#F7F5EF; border-radius:24px; padding:40px;}
  .lp-install .lp-h2{color:#F7F5EF; margin-bottom:12px;}
  .lp-install p{margin:0 0 16px; line-height:1.55; color:#DCE3DC;}
  .lp-install-steps p{margin:0 0 14px; font-size:.95rem;}
  .lp-install-steps b{color:#fff;}

  .lp-faq{margin:0 0 8px;}
  .lp-faq details{border-top:1px solid var(--line); padding:14px 0;}
  .lp-faq details:last-child{border-bottom:1px solid var(--line);}
  .lp-faq summary{font-family:'Inter',sans-serif; font-size:15px; font-weight:600; color:var(--ink); cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:flex-start; gap:12px; line-height:1.35;}
  .lp-faq summary::-webkit-details-marker{display:none;}
  .lp-faq summary::after{content:'+'; color:var(--accent-warm); font-size:1.25rem; line-height:1; flex-shrink:0;}
  .lp-faq details[open] summary::after{content:'–';}
  .lp-faq p{margin:10px 0 0; color:var(--ink-soft); font-family:'Inter',sans-serif; font-size:14.5px; line-height:1.6; max-width:44em;}
  .lp-foot{display:flex; flex-wrap:wrap; gap:12px 16px; justify-content:center; align-items:center; padding:28px 8px 40px; font-size:13px; color:var(--ink-soft); text-align:center;}

  .lp-final{text-align:center; padding:64px 0 40px;}
  .lp-final .lp-h2{margin-left:auto; margin-right:auto;}
  .lp-foot{text-align:center; padding-top:24px; border-top:1px solid var(--line); font-size:13px; color:var(--ink-faint);}

  @media (max-width: 860px){
    .lp-hero{grid-template-columns:1fr; gap:36px; padding-bottom:48px;}
    .lp-row{grid-template-columns:1fr; gap:6px;}
    .lp-feats, .lp-steps{grid-template-columns:1fr;}
    .lp-install{grid-template-columns:1fr; padding:28px 22px;}
    .lp-section{padding:44px 0;}
  }
  @media (max-width: 520px){
    .lp-cta .lp-btn{width:100%;}
    .lp-demo{padding:18px;}
  }
  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    .panel, .overlay, .toast{transition:none;}
  }

  /* panneaux fermés : hors écran ET hors accessibilité */
  .panel{visibility:hidden; transition:transform .28s cubic-bezier(.32,.72,0,1), visibility 0s linear .28s;}
  .panel.open{visibility:visible; transition:transform .28s cubic-bezier(.32,.72,0,1), visibility 0s;}
.member-row{display:flex; align-items:center; gap:8px; padding:9px 0; border-top:1px solid var(--line); font-size:13.5px;}
.member-row:first-child{border-top:none;}
.member-name{flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.member-role{font-size:11px; color:var(--ink-soft); background:var(--bg); padding:3px 8px; border-radius:6px; flex-shrink:0;}
.member-remove{flex-shrink:0; border:none; background:none; color:#B0503B; font-size:12.5px; cursor:pointer; padding:4px 2px;}
.icon-pick.readonly, .vis-btn.readonly{opacity:.55; pointer-events:none;}
#fSpaceName:disabled{background:var(--bg); color:var(--ink-soft);}
input:disabled, button:disabled{opacity:.6; cursor:not-allowed;}
.mic-btn, .icon-pick{padding:0;}
.lang-pill, .space-chip, .space-add-chip, .chip, .vis-btn, .mic-btn, .icon-pick{font-family:inherit;}

/* ===== v20 : boutons du bas toujours visibles (FR/DE longs, barre système) ===== */
.panel:has(> .panel-actions){padding-bottom:0;}
.panel{overscroll-behavior:contain; -webkit-overflow-scrolling:touch;}
.panel-actions{position:sticky; bottom:0; z-index:6; flex-wrap:wrap; margin:18px -20px 0; padding:12px 20px calc(14px + env(safe-area-inset-bottom, 0px)); background:var(--surface-raised); border-top:1px solid var(--line);}
.panel-actions .btn, .panel-actions .btn-secondary{min-width:0; min-height:48px; white-space:normal; overflow-wrap:anywhere; line-height:1.2;}
.panel-actions .btn-primary{flex:2 1 150px;}
.panel-actions .btn-secondary{flex:1 1 90px;}
.panel-actions .btn-danger{flex:1 1 130px;}
/* corbeille / historique */
.tr-row{display:flex; align-items:center; gap:10px; padding:11px 0; border-top:1px solid var(--line);}
.tr-row:first-child{border-top:none;}
.tr-main{flex:1; min-width:0; font-size:14px;}
.tr-main small{display:block; color:var(--ink-faint); font-size:12px; margin-top:2px; overflow-wrap:anywhere;}
.tr-acts{display:flex; flex-direction:column; gap:4px; align-items:flex-end; flex-shrink:0;}
.tr-acts .btn{flex:0 0 auto; padding:8px 12px; font-size:13px; min-height:0;}
.tr-acts .link-btn{color:#B0503B; font-size:12px;}
.log-row{padding:10px 0; border-top:1px solid var(--line); font-size:13.5px;}
.log-row:first-child{border-top:none;}
.log-row small{display:block; color:var(--ink-faint); font-size:12px; margin-top:2px; overflow-wrap:anywhere;}


  /* ---- Rappels ---- */
  .rem-bell{position:relative;}
  .rem-count{position:absolute; top:-5px; right:-5px; min-width:17px; height:17px; padding:0 4px; border-radius:9px; background:var(--accent-warm); color:#fff; font-size:10.5px; font-weight:700; display:flex; align-items:center; justify-content:center; line-height:1;}
  .rem-count[hidden]{display:none;}
  .rem-box{margin-top:16px; padding:12px 13px 10px; background:var(--bg); border-radius:12px;}
  .rem-head{font-size:13px; font-weight:600; color:var(--ink); margin-bottom:9px;}
  .rem-chips{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:9px;}
  .rem-chip{padding:7px 11px; border-radius:999px; border:1px solid var(--line); background:var(--surface-raised); font-size:12.5px; color:var(--ink-soft); cursor:pointer; font-family:inherit;}
  .rem-chip:active{border-color:var(--accent);}
  .rem-row{display:flex; gap:8px;}
  .rem-in{flex:1 1 0; min-width:0; padding:11px 10px; border-radius:10px; border:1px solid var(--line); background:var(--surface-raised); font-family:'Inter',sans-serif; font-size:16px; color:var(--ink); outline:none;}
  .rem-in:focus{border-color:var(--accent);}
  .rem-actions{display:flex; gap:14px; margin-top:8px; flex-wrap:wrap;}
  .rem-link{background:none; border:none; padding:6px 0; font-family:inherit; font-size:12.5px; font-weight:600; color:var(--accent-deep); cursor:pointer;}
  .rem-link.danger{color:#B0503B;}
  .rem-box.ro{opacity:.55; pointer-events:none;}
  .qr-open{width:100%; margin-top:10px; padding:11px; border-radius:10px; border:1px dashed var(--accent); background:transparent; color:var(--accent-deep); font-size:13.5px; font-weight:600; font-family:inherit; cursor:pointer;}
  .rem-tag{display:inline-block; margin-left:6px; padding:2px 7px; border-radius:6px; background:#F3E6D4; color:#8A5A22; font-size:11.5px;}
  .rem-tag.due{background:#F4D9D1; color:#9A3A25; font-weight:600;}
  .rem-banner{margin:0 16px 4px; display:flex; flex-direction:column; gap:8px;}
  .rem-banner[hidden]{display:none;}
  .rem-due{background:#FBF1E3; border:1px solid #E8CFA8; border-radius:12px; padding:11px 12px;}
  .rem-due-name{font-size:14px; font-weight:600; color:var(--ink); overflow-wrap:anywhere;}
  .rem-due-path{font-size:12px; color:var(--ink-soft); margin-top:2px; overflow-wrap:anywhere;}
  .rem-due-btns{display:flex; gap:8px; margin-top:9px; flex-wrap:wrap;}
  .rem-due-btns button{padding:8px 12px; border-radius:9px; border:1px solid var(--line); background:var(--surface-raised); font-size:12.5px; font-weight:600; color:var(--ink); cursor:pointer; font-family:inherit;}
  .rem-due-btns button.main{background:var(--accent); border-color:var(--accent); color:#fff;}
  .rem-row-item{display:flex; align-items:center; gap:10px; padding:12px 0; border-bottom:1px solid var(--line);}
  .rem-row-main{flex:1; min-width:0; background:none; border:none; padding:0; text-align:left; font-family:inherit; cursor:pointer;}
  .rem-row-main b{display:block; font-size:14.5px; color:var(--ink); overflow-wrap:anywhere;}
  .rem-row-main span{display:block; font-size:12.5px; color:var(--ink-soft); margin-top:2px;}
  .rem-row-main span.due{color:#9A3A25; font-weight:600;}
  .rem-row-del{width:36px; height:36px; border-radius:10px; border:1px solid var(--line); background:var(--surface-raised); color:var(--ink-soft); font-size:20px; line-height:1; cursor:pointer; flex-shrink:0;}
  .rem-note{font-size:12.5px; color:var(--ink-faint); line-height:1.45; margin:14px 0 0;}
  .rem-empty{padding:22px 0; text-align:center; color:var(--ink-soft); font-size:14px;}
  /* ---- QR + scanner ---- */
  .qr-stage{display:flex; justify-content:center; margin:14px 0 4px;}
  .qr-stage canvas{width:100%; max-width:300px; height:auto; border:1px solid var(--line); border-radius:12px; background:#fff;}
  .scan-stage{position:relative; margin:6px 0 4px; border-radius:16px; overflow:hidden; background:#111; aspect-ratio:1/1; max-height:56vh;}
  .scan-stage video{width:100%; height:100%; object-fit:cover; display:block;}
  .scan-frame{position:absolute; inset:18%; border:3px solid rgba(255,255,255,.9); border-radius:18px; box-shadow:0 0 0 999px rgba(0,0,0,.35); pointer-events:none;}
  .scan-msg{text-align:center; font-size:13.5px; color:var(--ink-soft); margin:10px 0 0; min-height:20px;}

/* ---- Verrouillage ---- */
.lock-screen{position:fixed; inset:0; z-index:90000; background:var(--bg); display:flex; align-items:center; justify-content:center; padding:24px;}
.lock-screen[hidden]{display:none;}
.lock-card{width:100%; max-width:360px; background:var(--surface-raised); border:1px solid var(--line); border-radius:16px; padding:28px 22px; text-align:center;}
.lock-ic{font-size:40px; margin-bottom:6px;}
.lock-card h2{font-family:'Fraunces',serif; font-size:22px; margin:0 0 6px;}
.lock-card p{font-size:13.5px; color:var(--ink-soft); margin:0 0 16px;}
.lock-card input{width:100%; padding:12px 14px; border-radius:10px; border:1px solid var(--line); font-size:16px; font-family:inherit; margin-bottom:8px;}
.lock-card .btn{width:100%; margin-top:6px;}
.lock-card .link-btn{display:block; margin:12px auto 0;}
#menuLockBox{margin-bottom:8px; padding:12px; background:var(--bg); border-radius:12px;}
#menuLockBox label{margin-top:0;}
#menuLockBox select{width:100%; margin-bottom:8px;}
