@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,600&family=Hanken+Grotesk:wght@400;500;600;700&display=swap');

  :root{
    --paper:#f1ece0;
    --paper-2:#e7e0cf;
    --card:#fdfbf4;
    --ink:#2c2823;
    --ink-soft:#7a7264;
    --ink-faint:#a89e8c;
    --line:#d8cfbc;
    --line-soft:#e3dac8;
    --rust:#bf5430;
    --rust-dark:#9a4023;
    --shadow: 0 1px 2px rgba(44,40,35,.08), 0 6px 16px rgba(44,40,35,.06);
    --shadow-lift: 0 8px 24px rgba(44,40,35,.18);
    --c-rust:#bf5430; --c-ochre:#be8f33; --c-sage:#6d8a5a;
    --c-blue:#5a7896; --c-mauve:#97658a; --c-slate:#5d6470;
  }

  *{box-sizing:border-box;margin:0;padding:0;}
  html,body{height:100%;}
  body{
    font-family:'Hanken Grotesk',sans-serif;
    background:var(--paper);
    color:var(--ink);
    -webkit-font-smoothing:antialiased;
    overflow:hidden;
  }
  /* paper grain */
  body::before{
    content:"";position:fixed;inset:0;pointer-events:none;z-index:9999;
    opacity:.4;mix-blend-mode:multiply;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.045'/%3E%3C/svg%3E");
  }

  /* ---------- Header ---------- */
  header{
    display:flex;align-items:center;gap:10px;
    padding:10px 14px;
    background:linear-gradient(180deg,var(--paper-2),var(--paper));
    border-bottom:1px solid var(--line);
    flex-wrap:nowrap;
    min-width:max-content;
  }
  .brand{display:flex;align-items:center;gap:12px;flex:0 0 auto;}
  .brand h1{
    font-family:'Fraunces',serif;
    font-weight:600;font-size:22px;letter-spacing:-.4px;
    font-optical-sizing:auto;
  }
  .search{
    position:relative;
    flex:1 1 280px;
    min-width:220px;
  }
  .search input{
    font-family:inherit;font-size:13.5px;color:var(--ink);
    background:var(--card);
    border:1px solid var(--line);border-radius:8px;
    padding:9px 14px 9px 34px;width:100%;outline:none;
    transition:border-color .15s, box-shadow .15s, width .2s;
  }
  .search input:focus{border-color:var(--rust);box-shadow:0 0 0 3px rgba(191,84,48,.12);}
  .search svg{
    position:absolute;left:11px;top:50%;transform:translateY(-50%);
    width:15px;height:15px;stroke:var(--ink-faint);
  }
  .btn{
    font-family:inherit;font-size:13px;font-weight:600;
    border:none;border-radius:8px;cursor:pointer;
    padding:9px 12px;display:flex;align-items:center;gap:7px;
    width:auto;
    flex:0 0 auto;
    white-space:nowrap;
    transition:transform .08s, background .15s, box-shadow .15s;
  }
  .btn:active{transform:translateY(1px);}
  .btn-primary{background:var(--rust);color:#fff;box-shadow:0 2px 6px rgba(191,84,48,.3);}
  .btn-primary:hover{background:var(--rust-dark);}
  .btn-ghost{background:transparent;color:var(--ink-soft);border:1px solid var(--line);}
  .btn-ghost:hover{background:var(--paper-2);color:var(--ink);}
  .menu-link{text-decoration:none;color:var(--ink-soft);flex:0 0 auto;}
  .auth-slot{min-width:42px;display:flex;justify-content:flex-end;}
  .sync-status{
    font-size:12px;color:var(--ink-faint);font-weight:600;
    min-width:82px;text-align:right;white-space:nowrap;
  }
  .sync-status.error{color:var(--rust);}
  .file-input{display:none;}
  .auth-slot .auth-button{padding:8px 12px;border-radius:8px;white-space:nowrap;}
  .auth-slot .auth-container{margin-left:0;}
  .kanban-file-actions{display:flex;gap:8px;align-items:center;}
  .add-list-btn{flex:0 0 auto;}

  /* ---------- Board ---------- */
  .board-wrap{
    height:calc(100vh - 61px);
    overflow-x:auto;
    overflow-y:hidden;
    padding:22px 26px 26px;
  }
  .board{
    display:flex;gap:18px;height:100%;align-items:flex-start;
    min-width:min-content;
  }

  .column{
    width:288px;flex-shrink:0;
    max-height:100%;
    min-height:0;
    background:var(--paper-2);
    border:1px solid var(--line);
    border-radius:13px;
    display:flex;flex-direction:column;
    position:relative;
    box-shadow:0 1px 0 rgba(255,255,255,.5) inset;
    animation:rise .45s cubic-bezier(.2,.7,.3,1) backwards;
    transition:width .12s ease, box-shadow .15s, border-color .15s;
  }
  @keyframes rise{from{opacity:0;transform:translateY(14px);}}
  .column.col-dragging{opacity:.35;}
  .column.col-over{outline:2px dashed var(--rust);outline-offset:3px;}
  .column-placeholder{
    width:42px;
    flex:0 0 42px;
    min-height:120px;
    align-self:stretch;
    border:2px dashed rgba(191,84,48,.45);
    border-radius:13px;
    background:rgba(191,84,48,.08);
  }
  .column.collapsed{
    overflow:hidden;
    background:var(--card);
  }
  .collapsed-tab{
    width:100%;height:100%;
    display:grid;
    grid-template-rows:auto 1fr auto auto;
    justify-items:center;
    gap:10px;
    padding:12px 8px;
    color:var(--ink-soft);
    background:transparent;
    border:0;
    cursor:pointer;
    font-family:inherit;
  }
  .collapsed-tab:hover{background:rgba(255,255,255,.42);color:var(--ink);}
  .collapsed-title{
    min-height:0;
    writing-mode:vertical-rl;
    transform:rotate(180deg);
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-family:'Fraunces',serif;
    font-size:14px;
    font-weight:600;
  }
  .collapsed-count{
    min-width:24px;
    border:1px solid var(--line);
    border-radius:20px;
    padding:2px 6px;
    background:var(--paper-2);
    font-size:11px;
    font-weight:700;
  }

  .col-head{
    display:flex;align-items:center;gap:9px;
    padding:13px 12px 11px 13px;
  }
  .grip{
    cursor:grab;color:var(--ink-faint);font-size:13px;line-height:1;
    letter-spacing:-2px;padding:2px 1px;flex-shrink:0;
    user-select:none;
  }
  .grip:active{cursor:grabbing;}
  .col-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0;background:var(--accent);}
  .col-title{
    font-family:'Fraunces',serif;font-weight:600;font-size:15.5px;
    color:var(--ink);background:transparent;border:none;outline:none;
    flex:1;min-width:0;padding:3px 5px;border-radius:6px;
    font-optical-sizing:auto;
  }
  .col-title:focus{background:var(--card);box-shadow:0 0 0 2px var(--accent);}
  .col-count{
    font-size:11.5px;font-weight:700;color:var(--ink-soft);
    background:var(--card);border:1px solid var(--line);
    border-radius:20px;padding:2px 9px;flex-shrink:0;
  }
  .col-menu{
    background:transparent;border:none;cursor:pointer;
    color:var(--ink-faint);font-size:17px;line-height:1;
    padding:2px 6px;border-radius:6px;flex-shrink:0;
  }
  .col-menu:hover{background:var(--card);color:var(--ink);}
  .col-collapse{
    width:25px;height:25px;
    display:grid;place-items:center;
    flex-shrink:0;
    color:var(--ink-faint);
    background:transparent;
    border:0;
    border-radius:6px;
    cursor:pointer;
    font-size:12px;
  }
  .col-collapse:hover{background:var(--card);color:var(--ink);}
  .column-resize-handle{
    position:absolute;
    top:44px;
    right:-5px;
    bottom:8px;
    width:10px;
    cursor:col-resize;
    border-radius:999px;
    z-index:2;
  }
  .column-resize-handle::after{
    content:"";
    position:absolute;
    top:12px;
    bottom:12px;
    left:4px;
    width:2px;
    border-radius:999px;
    background:transparent;
    transition:background .15s;
  }
  .column-resize-handle:hover::after,
  body.resizing-column .column-resize-handle::after{background:var(--rust);}
  body.resizing-column{cursor:col-resize;user-select:none;}
  .column-height-resize-handle{
    position:absolute;
    left:12px;
    right:12px;
    bottom:-5px;
    height:10px;
    cursor:row-resize;
    border-radius:999px;
    z-index:3;
  }
  .column-height-resize-handle::after{
    content:"";
    position:absolute;
    left:24px;
    right:24px;
    top:4px;
    height:2px;
    border-radius:999px;
    background:transparent;
    transition:background .15s;
  }
  .column-height-resize-handle:hover::after,
  body.resizing-column-height .column-height-resize-handle::after{background:var(--rust);}
  body.resizing-column-height{cursor:row-resize;user-select:none;}

  .card-list{
    padding:2px 9px 4px;
    display:flex;flex-direction:column;gap:8px;
    flex:0 1 auto;min-height:8px;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
    scrollbar-gutter:stable;
  }
  .card-list::-webkit-scrollbar{width:8px;}
  .card-list::-webkit-scrollbar-thumb{background:var(--line);border-radius:8px;}

  .card{
    background:var(--card);
    border:1px solid var(--line-soft);
    border-radius:9px;
    padding:11px 12px 10px;
    cursor:pointer;
    box-shadow:var(--shadow);
    position:relative;
    transition:transform .1s, box-shadow .15s, border-color .15s;
  }
  .card:hover{transform:translateY(-1px);box-shadow:var(--shadow-lift);border-color:var(--line);}
  .card.dragging{opacity:.4;}
  .card.dim{opacity:.32;filter:saturate(.4);}
  .card .label-bar{
    height:5px;width:34px;border-radius:4px;margin-bottom:8px;
  }
  .card .ctitle{
    font-size:14px;line-height:1.42;color:var(--ink);font-weight:500;
    word-wrap:break-word;
  }
  .card .cdesc{
    margin-top:7px;color:var(--ink-soft);
    font-size:12.5px;line-height:1.35;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;
    overflow:hidden;white-space:pre-line;
  }
  .card .cmeta{
    display:flex;align-items:center;gap:5px;margin-top:8px;
    color:var(--ink-faint);font-size:11.5px;font-weight:600;
  }
  .card .cmeta svg{width:13px;height:13px;stroke:var(--ink-faint);}
  .checklist-meta.complete{color:var(--c-sage);}
  .due-meta{
    color:var(--c-blue);
    background:rgba(90,120,150,.1);
    border:1px solid rgba(90,120,150,.18);
    border-radius:7px;
    padding:5px 7px;
    width:max-content;
    max-width:100%;
  }
  .due-meta.overdue{
    color:var(--rust);
    background:rgba(191,84,48,.1);
    border-color:rgba(191,84,48,.24);
  }
  .card-checklists{
    display:grid;
    gap:8px;
    margin-top:9px;
    padding-top:8px;
    border-top:1px solid var(--line-soft);
  }
  .card-checklist{display:grid;gap:5px;}
  .card-checklist-title{
    color:var(--ink-soft);
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.6px;
  }
  .card-checklist-item{
    display:grid;
    grid-template-columns:16px minmax(0,1fr);
    align-items:start;
    gap:7px;
    color:var(--ink-soft);
    font-size:12.5px;
    line-height:1.3;
    cursor:pointer;
  }
  .card-checklist-item input{
    width:14px;
    height:14px;
    margin:1px 0 0;
    accent-color:var(--c-sage);
    cursor:pointer;
  }
  .card-checklist-item span{
    min-width:0;
    overflow-wrap:anywhere;
  }
  .card-checklist-item.done{
    color:var(--ink-faint);
    text-decoration:line-through;
  }

  .placeholder{
    height:38px;border-radius:9px;flex-shrink:0;
    background:rgba(191,84,48,.1);
    border:2px dashed rgba(191,84,48,.45);
  }

  /* composer */
  .composer{padding:7px 9px 11px;}
  .add-card{
    width:100%;text-align:left;
    font-family:inherit;font-size:13px;font-weight:600;
    color:var(--ink-soft);cursor:pointer;
    background:transparent;border:1px dashed var(--line);
    border-radius:9px;padding:9px 11px;
    display:flex;align-items:center;gap:7px;
    transition:background .15s,color .15s,border-color .15s;
  }
  .add-card:hover{background:var(--card);color:var(--ink);border-color:var(--rust);}
  .composer textarea{
    width:100%;font-family:inherit;font-size:14px;line-height:1.42;
    color:var(--ink);background:var(--card);
    border:1px solid var(--rust);border-radius:9px;
    padding:10px 11px;outline:none;resize:none;
    box-shadow:0 0 0 3px rgba(191,84,48,.12);
  }
  .composer-actions{display:flex;gap:8px;margin-top:8px;align-items:center;}

  /* add column */
  .add-column{
    width:288px;flex-shrink:0;
    align-self:flex-start;
  }
  .add-column button{
    width:100%;font-family:inherit;font-size:13.5px;font-weight:600;
    color:var(--ink-soft);cursor:pointer;
    background:rgba(255,255,255,.35);
    border:1px dashed var(--line);border-radius:13px;
    padding:14px;display:flex;align-items:center;gap:8px;justify-content:center;
    transition:background .15s,color .15s,border-color .15s;
  }
  .add-column button:hover{background:var(--paper-2);color:var(--ink);border-color:var(--rust);}
  .add-column .col-form{
    background:var(--paper-2);border:1px solid var(--line);
    border-radius:13px;padding:11px;
  }
  .add-column .col-form input{
    width:100%;font-family:'Fraunces',serif;font-size:15px;font-weight:600;
    color:var(--ink);background:var(--card);
    border:1px solid var(--rust);border-radius:8px;padding:9px 11px;
    outline:none;box-shadow:0 0 0 3px rgba(191,84,48,.12);
  }

  /* dropdown menu */
  .menu{
    position:fixed;z-index:200;
    background:var(--card);border:1px solid var(--line);
    border-radius:10px;box-shadow:var(--shadow-lift);
    padding:5px;min-width:170px;
    animation:pop .12s ease-out;
  }
  @keyframes pop{from{opacity:0;transform:scale(.96);}}
  .menu button{
    width:100%;text-align:left;font-family:inherit;font-size:13px;font-weight:500;
    color:var(--ink);background:transparent;border:none;cursor:pointer;
    padding:8px 10px;border-radius:7px;display:flex;align-items:center;gap:9px;
  }
  .menu button:hover{background:var(--paper-2);}
  .menu button.danger{color:var(--rust);}
  .menu button.danger:hover{background:rgba(191,84,48,.1);}
  .menu .sep{height:1px;background:var(--line-soft);margin:4px 6px;}

  /* ---------- Modal ---------- */
  .overlay{
    position:fixed;inset:0;z-index:300;
    background:rgba(36,32,27,.45);
    backdrop-filter:blur(2px);
    display:flex;align-items:center;justify-content:center;
    padding:24px;animation:fade .15s ease-out;
  }
  @keyframes fade{from{opacity:0;}}
  .modal{
    background:var(--paper);
    border:1px solid var(--line);
    border-radius:15px;
    width:480px;max-width:100%;max-height:88vh;overflow-y:auto;
    box-shadow:0 24px 60px rgba(0,0,0,.3);
    animation:rise .25s cubic-bezier(.2,.7,.3,1);
  }
  .modal-top{height:8px;border-radius:15px 15px 0 0;}
  .modal-body{padding:22px 24px 24px;}
  .modal-label{
    font-size:10.5px;letter-spacing:1.8px;text-transform:uppercase;
    color:var(--ink-faint);font-weight:700;margin:16px 0 7px;
  }
  .modal-body textarea,.modal-body .m-title{
    width:100%;font-family:inherit;color:var(--ink);
    background:var(--card);border:1px solid var(--line);
    border-radius:9px;padding:11px 12px;outline:none;resize:none;
    transition:border-color .15s,box-shadow .15s;
  }
  .modal-body textarea:focus,.modal-body .m-title:focus{
    border-color:var(--rust);box-shadow:0 0 0 3px rgba(191,84,48,.12);
  }
  .modal-body .m-title{
    font-family:'Fraunces',serif;font-size:18px;font-weight:600;line-height:1.35;
  }
  .modal-body textarea{font-size:14px;line-height:1.5;}
  .swatches{display:flex;gap:9px;flex-wrap:wrap;}
  .swatch{
    width:30px;height:30px;border-radius:8px;cursor:pointer;
    border:2px solid transparent;position:relative;
    transition:transform .1s;
  }
  .swatch:hover{transform:scale(1.12);}
  .swatch.sel{border-color:var(--ink);box-shadow:0 0 0 2px var(--paper) inset;}
  .swatch.none{background:var(--card);border:1.5px dashed var(--line);}
  .swatch.none.sel{border:2px solid var(--ink);}
  .checklist-panel{display:grid;gap:12px;}
  .reminder-panel{
    display:grid;
    gap:10px;
    background:rgba(255,255,255,.32);
    border:1px solid var(--line);
    border-radius:10px;
    padding:11px;
  }
  .reminder-toggle{
    display:flex;
    align-items:center;
    gap:8px;
    font-size:13.5px;
    font-weight:700;
    color:var(--ink);
  }
  .reminder-toggle input{width:16px;height:16px;accent-color:var(--rust);}
  .reminder-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;}
  .reminder-grid label,
  .reminder-field{
    display:grid;
    gap:5px;
    color:var(--ink-soft);
    font-size:12px;
    font-weight:700;
  }
  .reminder-grid input,
  .reminder-field input{
    width:100%;
    min-width:0;
    font-family:inherit;
    color:var(--ink);
    background:var(--card);
    border:1px solid var(--line);
    border-radius:8px;
    padding:8px 10px;
    outline:none;
  }
  .reminder-grid input:focus,
  .reminder-field input:focus{
    border-color:var(--rust);
    box-shadow:0 0 0 3px rgba(191,84,48,.12);
  }
  .reminder-note{
    color:var(--ink-faint);
    font-size:12px;
    line-height:1.35;
  }
  .checklist-editor{
    background:rgba(255,255,255,.32);
    border:1px solid var(--line);
    border-radius:10px;
    padding:10px;
    display:grid;
    gap:8px;
  }
  .checklist-head{display:flex;gap:8px;align-items:center;}
  .checklist-title{
    min-width:0;flex:1;
    font-family:'Fraunces',serif;font-size:15px;font-weight:600;
    color:var(--ink);background:var(--card);
    border:1px solid var(--line);
    border-radius:8px;
    padding:8px 10px;
    outline:none;
  }
  .checklist-title:focus,
  .checklist-row input[type="text"]:focus{
    border-color:var(--rust);
    box-shadow:0 0 0 3px rgba(191,84,48,.12);
  }
  .checklist-items{display:grid;gap:7px;}
  .checklist-row{
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    gap:8px;
    align-items:center;
  }
  .checklist-row input[type="checkbox"]{
    width:16px;height:16px;
    accent-color:var(--rust);
  }
  .checklist-row input[type="text"]{
    width:100%;
    min-width:0;
    font-family:inherit;
    color:var(--ink);
    background:var(--card);
    border:1px solid var(--line);
    border-radius:8px;
    padding:8px 10px;
    outline:none;
  }
  .icon-btn{
    width:32px;height:32px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
    border:1px solid var(--line);
    border-radius:8px;
    background:transparent;
    color:var(--ink-soft);
    cursor:pointer;
  }
  .icon-btn:hover{background:var(--paper-2);color:var(--rust);}
  .checklist-add,
  .checklist-add-list{
    justify-content:center;
    width:100%;
  }
  .modal-actions{
    display:flex;gap:10px;margin-top:22px;align-items:center;
  }
  .modal-actions .spacer{flex:1;}

  .empty-hint{
    color:var(--ink-faint);font-size:12.5px;text-align:center;
    padding:14px 8px;font-style:italic;
  }
  .loading{
    display:flex;align-items:center;justify-content:center;
    height:60vh;color:var(--ink-faint);font-size:14px;
  }

  /* ---------- Indicateur de progression des listes de fiche ---------- */
  .card .checklist-meta{
    width:100%;
    font-family:inherit;
    background:transparent;
    border:1px solid transparent;
    border-radius:7px;
    padding:4px 6px;
    cursor:pointer;
    text-align:left;
    transition:background .15s, border-color .15s;
  }
  .card .checklist-meta:hover{background:var(--paper-2);border-color:var(--line-soft);}
  .card .checklist-meta .chevron{margin-left:auto;font-size:9px;transition:transform .15s;}
  .card .checklist-meta.open .chevron{transform:rotate(180deg);}
  .checklist-meta-lists{color:var(--ink-faint);font-weight:600;}

  /* ---------- Corbeille ---------- */
  #trashBtn{position:relative;}
  #trashBtn.has-items{color:var(--rust);border-color:rgba(191,84,48,.4);}
  .trash-count{
    min-width:18px;height:18px;padding:0 5px;
    border-radius:20px;background:var(--rust);color:#fff;
    font-size:11px;font-weight:700;
    display:inline-flex;align-items:center;justify-content:center;
  }
  .trash-count[hidden]{display:none;}
  .trash-modal{width:560px;}
  .trash-title{font-family:'Fraunces',serif;font-size:20px;font-weight:600;}
  .trash-note{color:var(--ink-soft);font-size:12.5px;line-height:1.4;margin-top:6px;}
  .trash-retention{
    width:100%;font-family:inherit;font-size:13.5px;color:var(--ink);
    background:var(--card);border:1px solid var(--line);
    border-radius:9px;padding:9px 11px;outline:none;
  }
  .trash-retention:focus{border-color:var(--rust);box-shadow:0 0 0 3px rgba(191,84,48,.12);}
  .trash-list{display:grid;gap:9px;max-height:44vh;overflow-y:auto;}
  .trash-item{
    display:flex;gap:10px;align-items:center;
    background:var(--card);border:1px solid var(--line-soft);
    border-radius:10px;padding:10px 11px;
  }
  .trash-item-main{flex:1;min-width:0;}
  .trash-item-title{font-size:14px;font-weight:600;color:var(--ink);overflow-wrap:anywhere;}
  .trash-item-meta{margin-top:3px;color:var(--ink-soft);font-size:11.5px;}
  .trash-item-expiry{margin-top:2px;color:var(--ink-faint);font-size:11.5px;font-weight:600;}
  .trash-item-actions{display:flex;flex-direction:column;gap:6px;flex:0 0 auto;}
  .trash-item-actions .btn{font-size:12px;padding:6px 9px;}
  .trash-item-delete{color:var(--rust);border-color:rgba(191,84,48,.35);}

  /* ---------- Vue dédiée d'une fiche (mini-tableau) ---------- */
  .cardview{
    position:fixed;inset:0;z-index:150;
    background:var(--paper);
    display:flex;flex-direction:column;
    animation:fade .15s ease-out;
  }
  .cardview[hidden]{display:none;}
  body.cardview-open{overflow:hidden;}
  .cardview-top{
    display:flex;align-items:center;gap:10px;
    padding:11px 18px;flex:0 0 auto;
    background:linear-gradient(180deg,var(--paper-2),var(--paper));
    border-bottom:1px solid var(--line);
  }
  .cardview-dot{
    width:11px;height:11px;border-radius:50%;flex:0 0 auto;
    background:var(--accent,var(--rust));
  }
  .cardview-title{
    flex:1;min-width:0;
    font-family:'Fraunces',serif;font-size:19px;font-weight:600;
    color:var(--ink);background:transparent;
    border:1px solid transparent;border-radius:8px;
    padding:7px 9px;outline:none;
  }
  .cardview-title:focus{
    background:var(--card);border-color:var(--rust);
    box-shadow:0 0 0 3px rgba(191,84,48,.12);
  }
  .cardview-progress{
    flex:0 0 auto;
    font-size:12px;font-weight:700;color:var(--ink-soft);
    background:var(--card);border:1px solid var(--line);
    border-radius:20px;padding:4px 11px;
  }
  .cardview-progress.complete{color:var(--c-sage);border-color:rgba(109,138,90,.42);}
  .cardview-progress[hidden]{display:none;}
  .cardview-delete{color:var(--rust);border-color:rgba(191,84,48,.35);}
  .cardview-main{flex:1;min-height:0;display:flex;align-items:stretch;}
  .cardview-side{
    width:332px;flex:0 0 332px;
    padding:16px 18px 26px;
    border-right:1px solid var(--line);
    overflow-y:auto;
  }
  .cardview-side .modal-label{margin:15px 0 7px;}
  .cardview-side .modal-label:first-child{margin-top:0;}
  .cardview-side textarea,
  .cardview-column{
    width:100%;font-family:inherit;font-size:14px;color:var(--ink);
    background:var(--card);border:1px solid var(--line);
    border-radius:9px;padding:10px 11px;outline:none;resize:vertical;
  }
  .cardview-side textarea:focus,
  .cardview-column:focus{border-color:var(--rust);box-shadow:0 0 0 3px rgba(191,84,48,.12);}
  .cardview-board-wrap{
    flex:1;min-width:0;
    overflow-x:auto;overflow-y:hidden;
    padding:18px 20px 22px;
  }
  .cardview-board{
    display:flex;gap:16px;height:100%;align-items:flex-start;
    min-width:min-content;
  }

  .clist{
    width:272px;flex:0 0 272px;
    max-height:100%;min-height:0;
    background:var(--paper-2);
    border:1px solid var(--line);border-radius:13px;
    display:flex;flex-direction:column;
    box-shadow:0 1px 0 rgba(255,255,255,.5) inset;
  }
  .clist.clist-dragging{opacity:.35;}
  .clist-placeholder{
    width:42px;flex:0 0 42px;min-height:140px;align-self:stretch;
    border:2px dashed rgba(191,84,48,.45);border-radius:13px;
    background:rgba(191,84,48,.08);
  }
  .clist-head{display:flex;align-items:center;gap:8px;padding:12px 10px 10px 12px;}
  .clist-title{
    flex:1;min-width:0;
    font-family:'Fraunces',serif;font-weight:600;font-size:15px;
    color:var(--ink);background:transparent;border:none;outline:none;
    padding:3px 5px;border-radius:6px;
  }
  .clist-title:focus{background:var(--card);box-shadow:0 0 0 2px var(--accent);}
  .clist-count{
    flex-shrink:0;
    font-size:11.5px;font-weight:700;color:var(--ink-soft);
    background:var(--card);border:1px solid var(--line);
    border-radius:20px;padding:2px 8px;
  }
  .clist-count.complete{color:var(--c-sage);}
  .clist-items{
    display:flex;flex-direction:column;gap:6px;
    padding:2px 9px 4px;min-height:16px;flex:0 1 auto;
    overflow-y:auto;overflow-x:hidden;
    overscroll-behavior:contain;scrollbar-gutter:stable;
  }
  .clist-items::-webkit-scrollbar{width:8px;}
  .clist-items::-webkit-scrollbar-thumb{background:var(--line);border-radius:8px;}
  .citem{
    display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;
    align-items:center;gap:6px;
    background:var(--card);border:1px solid var(--line-soft);
    border-radius:9px;padding:5px 6px;
    box-shadow:var(--shadow);
  }
  .citem.citem-dragging{opacity:.4;}
  .citem-grip{
    cursor:grab;color:var(--ink-faint);font-size:12px;line-height:1;
    letter-spacing:-2px;padding:2px 1px;user-select:none;
  }
  .citem-grip:active{cursor:grabbing;}
  .citem-check{width:15px;height:15px;accent-color:var(--c-sage);cursor:pointer;}
  .citem-text{
    min-width:0;width:100%;font-family:inherit;font-size:13.5px;
    color:var(--ink);background:transparent;
    border:1px solid transparent;border-radius:7px;
    padding:5px 6px;outline:none;
  }
  .citem-text:focus{
    background:var(--paper);border-color:var(--rust);
    box-shadow:0 0 0 3px rgba(191,84,48,.12);
  }
  .citem.done .citem-text{color:var(--ink-faint);text-decoration:line-through;}
  .citem-del{width:26px;height:26px;border-color:transparent;}
  .citem:hover .citem-del{border-color:var(--line);}
  .citem-placeholder{
    height:34px;border-radius:9px;flex-shrink:0;
    background:rgba(191,84,48,.1);
    border:2px dashed rgba(191,84,48,.45);
  }
  .clist-composer{padding:6px 9px 10px;}
  .clist-add{
    width:100%;text-align:left;
    font-family:inherit;font-size:13px;font-weight:600;
    color:var(--ink-soft);cursor:pointer;
    background:transparent;border:1px dashed var(--line);
    border-radius:9px;padding:8px 10px;
    display:flex;align-items:center;gap:7px;
    transition:background .15s,color .15s,border-color .15s;
  }
  .clist-add:hover{background:var(--card);color:var(--ink);border-color:var(--rust);}
  .clist-composer textarea{
    width:100%;font-family:inherit;font-size:13.5px;line-height:1.4;
    color:var(--ink);background:var(--card);
    border:1px solid var(--rust);border-radius:9px;
    padding:9px 10px;outline:none;resize:none;
    box-shadow:0 0 0 3px rgba(191,84,48,.12);
  }
  .add-clist{width:252px;flex:0 0 252px;align-self:flex-start;}
  .add-clist>button{
    width:100%;font-family:inherit;font-size:13.5px;font-weight:600;
    color:var(--ink-soft);cursor:pointer;
    background:rgba(255,255,255,.35);
    border:1px dashed var(--line);border-radius:13px;
    padding:13px;display:flex;align-items:center;gap:8px;justify-content:center;
    transition:background .15s,color .15s,border-color .15s;
  }
  .add-clist>button:hover{background:var(--paper-2);color:var(--ink);border-color:var(--rust);}
  .clist-form{
    background:var(--paper-2);border:1px solid var(--line);
    border-radius:13px;padding:11px;
  }
  .clist-form input{
    width:100%;font-family:'Fraunces',serif;font-size:15px;font-weight:600;
    color:var(--ink);background:var(--card);
    border:1px solid var(--rust);border-radius:8px;padding:9px 11px;
    outline:none;box-shadow:0 0 0 3px rgba(191,84,48,.12);
  }


  /* ---------- Sous-fiches : depot d'une fiche dans une autre ---------- */
  .card.nest-target,
  .card.nest-blocked{
    transform:none;
  }
  .card.nest-target{
    border-color:var(--rust);
    box-shadow:0 0 0 2px rgba(191,84,48,.35), var(--shadow-lift);
  }
  .card.nest-blocked{
    border-color:var(--ink-faint);
    box-shadow:0 0 0 2px rgba(168,158,140,.35);
  }
  .card.nest-target::after,
  .card.nest-blocked::after{
    content:attr(data-nest-hint);
    position:absolute;inset:0;
    display:flex;align-items:center;justify-content:center;
    text-align:center;
    padding:6px 10px;
    border-radius:9px;
    font-size:11.5px;font-weight:700;line-height:1.25;
    pointer-events:none;
  }
  /* Fond opaque : le message doit rester lisible par-dessus le texte de la carte. */
  .card.nest-target::after{
    background:var(--card);
    box-shadow:inset 0 0 0 999px rgba(191,84,48,.14);
    color:var(--rust);
    border:2px dashed rgba(191,84,48,.55);
  }
  .card.nest-blocked::after{
    background:var(--card);
    box-shadow:inset 0 0 0 999px rgba(168,158,140,.2);
    color:var(--ink-soft);
    border:2px dashed rgba(168,158,140,.6);
  }
  .card .children-meta{
    color:var(--c-mauve);
  }
  .card .children-meta i{font-size:11px;}

  /* ---------- Vue fiche : fil d'Ariane et sous-fiches ---------- */
  .cardview-crumbs{
    display:flex;align-items:center;gap:4px;flex:0 1 auto;min-width:0;
    color:var(--ink-faint);font-size:12px;font-weight:600;
    overflow:hidden;
  }
  .cardview-crumbs[hidden]{display:none;}
  .cardview-crumb{
    font-family:inherit;font-size:12px;font-weight:600;
    color:var(--ink-soft);background:transparent;
    border:1px solid var(--line);border-radius:7px;
    padding:4px 8px;cursor:pointer;
    max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  }
  .cardview-crumb:hover{background:var(--card);color:var(--ink);border-color:var(--rust);}
  .cardview-promote{color:var(--c-mauve);border-color:rgba(151,101,138,.4);}
  .cardview-promote[hidden]{display:none;}
  .cardview-children{display:grid;gap:8px;}
  .cardview-children[hidden],
  .cardview-children-label[hidden]{display:none;}
  .cv-child{
    display:flex;align-items:center;gap:8px;
    background:var(--card);
    border:1px solid var(--line);
    border-left:4px solid var(--accent,var(--c-mauve));
    border-radius:9px;
    padding:8px 9px 8px 10px;
  }
  .cv-child-open{
    flex:1;min-width:0;display:grid;gap:2px;text-align:left;
    font-family:inherit;background:transparent;border:0;cursor:pointer;padding:0;
  }
  .cv-child-title{
    font-size:13.5px;font-weight:600;color:var(--ink);
    overflow-wrap:anywhere;
  }
  .cv-child-meta{color:var(--ink-faint);font-size:11.5px;font-weight:600;}
  .cv-child-open:hover .cv-child-title{color:var(--rust);}
  .cv-child-actions{display:flex;gap:5px;flex:0 0 auto;}
  .cv-child-del:hover{color:var(--rust);}

  @media (max-width:900px){
    .cardview-main{flex-direction:column;}
    .cardview-side{
      width:100%;flex:0 0 auto;max-height:46%;
      border-right:none;border-bottom:1px solid var(--line);
    }
    .cardview-title{font-size:16px;}
    .cardview-top{flex-wrap:wrap;}
    .cardview-crumb{max-width:110px;}
    .trash-item{flex-direction:column;align-items:stretch;}
    .trash-item-actions{flex-direction:row;}
  }

  /* ---------- Thème sombre (suit le réglage du menu ProductivityHub) ---------- */
  [data-theme="dark"]{
    --paper:#1b1917;
    --paper-2:#242120;
    --card:#2d2a27;
    --ink:#e9e4da;
    --ink-soft:#b3aa9b;
    --ink-faint:#847c6e;
    --line:#3d3934;
    --line-soft:#34302b;
    --rust:#d4693f;
    --rust-dark:#e07a4f;
    --shadow:0 1px 2px rgba(0,0,0,.35), 0 6px 16px rgba(0,0,0,.28);
    --shadow-lift:0 8px 24px rgba(0,0,0,.55);
  }
  [data-theme="dark"] body::before{opacity:.15;mix-blend-mode:screen;}
  [data-theme="dark"] .column{box-shadow:0 1px 0 rgba(255,255,255,.04) inset;}
  [data-theme="dark"] .collapsed-tab:hover{background:rgba(255,255,255,.06);color:var(--ink);}
  [data-theme="dark"] .add-column button{background:rgba(255,255,255,.05);}
  [data-theme="dark"] .reminder-panel,
  [data-theme="dark"] .checklist-editor{background:rgba(255,255,255,.05);}
  [data-theme="dark"] .overlay{background:rgba(0,0,0,.6);}
  [data-theme="dark"] .swatch.sel{box-shadow:0 0 0 2px var(--paper-2) inset;}
  [data-theme="dark"] .clist{box-shadow:0 1px 0 rgba(255,255,255,.04) inset;}
  [data-theme="dark"] .add-clist>button{background:rgba(255,255,255,.05);}
  [data-theme="dark"] .card .checklist-meta:hover{background:rgba(255,255,255,.06);}
  [data-theme="dark"] .citem-text:focus{background:var(--paper-2);}
  [data-theme="dark"] .cv-child{background:rgba(255,255,255,.05);}
  [data-theme="dark"] .cardview-crumb:hover{background:rgba(255,255,255,.06);}