  /* ---------- Polices (IBM Plex, fichiers locaux) ---------- */
  @font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:400;font-display:swap;
    src:url(fonts/ibm-plex-sans-latin-400-normal.woff2) format("woff2");
    unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
  @font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:500;font-display:swap;
    src:url(fonts/ibm-plex-sans-latin-500-normal.woff2) format("woff2");
    unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
  @font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:600;font-display:swap;
    src:url(fonts/ibm-plex-sans-latin-600-normal.woff2) format("woff2");
    unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
  @font-face{font-family:"IBM Plex Sans Arabic";font-style:normal;font-weight:400;font-display:swap;
    src:url(fonts/ibm-plex-sans-arabic-arabic-400-normal.woff2) format("woff2");
    unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
  @font-face{font-family:"IBM Plex Sans Arabic";font-style:normal;font-weight:500;font-display:swap;
    src:url(fonts/ibm-plex-sans-arabic-arabic-500-normal.woff2) format("woff2");
    unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
  @font-face{font-family:"IBM Plex Sans Arabic";font-style:normal;font-weight:600;font-display:swap;
    src:url(fonts/ibm-plex-sans-arabic-arabic-600-normal.woff2) format("woff2");
    unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}

  /* ---------- Couleurs : mode jour ---------- */
  :root{
    --bg:#F3F1EE;
    --card:#FFFFFF;
    --field:#E9E5DF;
    --text:#1F1A17;
    --text-2:#6E665F;
    --line:#E2DED8;
    --primary:#3A2317;
    --on-primary:#FFFFFF;
    --edge:#C8741F;
    --edge-off:#B9B2AA;
    --edge-text:#9A5512;
    --wood:#E9DCCB;
    --note-ink:#8A4E12;
    --ok:#2F6B3A;
    --ok-soft:#EEF6F0;
    --ok-line:#BFD9C8;
    --error:#B3261E;
    --error-soft:#FCEBEA;
    --error-line:#E7CFCD;
    --disabled:#B9B2AA;
    --bar-bg:rgba(243,241,238,.96);
    --overlay:rgba(31,26,23,.55);
    --shadow:rgba(31,26,23,.18);
    --strip-ink:#4A423C;
    --warn-soft:#FBF1E6;
    --on-primary-soft:#E3D6CA;
    --print-ink:#000000;
    --print-paper:#FFFFFF;
    --print-zebra:#EDEDED;
    --print-mute:#444444;
    --r:10px;
    --pad:14px;
  }
  *{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
  html,body{margin:0;padding:0}
  body{
    background:var(--bg);
    color:var(--text);
    font-family:"IBM Plex Sans","IBM Plex Sans Arabic",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
    font-size:16px;line-height:1.35;
    font-variant-numeric:tabular-nums;
    padding-bottom:104px;
    -webkit-text-size-adjust:100%;
  }
  .wrap{max-width:620px;margin:0 auto;padding:0 12px}
  b,strong,th{font-weight:600}

  /* ---------- Masthead ---------- */
  .masthead{color:var(--primary);background:var(--bg);padding:18px 12px 6px}
  .masthead-in{max-width:620px;margin:0 auto;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
  .brand{font-size:29px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;line-height:1}
  .brand span{color:var(--text-2)}
  .brand-sub{margin-top:6px;font-size:13px;font-weight:500;color:var(--text-2)}
  .masthead-side{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
  .tel{font-size:15px;font-weight:500;letter-spacing:.06em;font-variant-numeric:tabular-nums;color:var(--text-2);white-space:nowrap}
  .hd-tools{display:flex;gap:6px}
  .hd-btn{
    font-family:inherit;font-size:13px;font-weight:600;letter-spacing:.04em;
    background:var(--card);color:var(--text-2);border:1px solid var(--line);border-radius:10px;
    min-height:44px;min-width:44px;padding:0 10px;cursor:pointer;
    display:inline-flex;align-items:center;justify-content:center;gap:4px;
  }
  .hd-btn .on{color:var(--primary)}
  .hd-btn svg{display:block}

  /* ---------- Blocks ---------- */
  .block{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:var(--pad);margin-top:12px}
  .block-title{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--text-2);font-weight:600;margin:0 0 10px}

  .grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .field{display:flex;flex-direction:column;gap:5px}
  .field.full{grid-column:1 / -1}
  .field label{font-size:12px;font-weight:600;letter-spacing:.04em;color:var(--text-2)}
  input,select{
    font-family:inherit;font-size:17px;color:var(--text);background:var(--field);
    border:1.5px solid var(--line);border-radius:8px;padding:11px 10px;width:100%;
    min-height:46px;appearance:none;
  }
  input:focus,select:focus,button:focus-visible{outline:3px solid var(--primary);outline-offset:1px;border-color:var(--primary)}
  .locked{background:var(--field);border:1.5px dashed var(--line);border-radius:8px;padding:11px 10px;min-height:46px;
    display:flex;align-items:center;font-size:17px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--text-2)}

  /* ---------- Unit switch ---------- */
  .units{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .unit-btn{
    font-family:inherit;font-size:19px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
    background:var(--card);color:var(--text-2);border:2px solid var(--line);border-radius:8px;
    padding:16px 8px;cursor:pointer;transition:transform .08s ease;
  }
  .unit-btn small{display:block;font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:none;margin-top:3px;opacity:.8}
  .unit-btn[aria-pressed="true"]{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}
  .unit-btn:active{transform:scale(.98)}
  .unit-note{margin:10px 0 0;font-size:12.5px;color:var(--text-2)}

  /* ---------- Rows ---------- */
  .chant-bar{
    display:flex;align-items:center;gap:12px;width:100%;min-height:56px;margin-top:8px;padding:6px 12px;
    font-family:inherit;text-align:left;cursor:pointer;color:var(--text);background:var(--card);
    border:2px solid var(--edge-off);border-radius:12px;
  }
  .chant-bar.has-chant{border-color:var(--edge)}
  .chant-bar .chev{flex:none;display:block;color:var(--text-2);pointer-events:none}
  .cb-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px;pointer-events:none}
  .cb-title{font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .cb-state{font-size:13px;font-weight:600;color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .chant-bar.has-chant .cb-state{color:var(--edge-text)}
  body:not(.chant-on) .chant-bar{display:none}

  .mini{position:relative;display:block;flex:none;width:26px;height:18px;border-radius:2px;background:var(--card);pointer-events:none}
  .mini .e{position:absolute;background:var(--edge-off)}
  .mini .e-LO1{left:0;right:0;top:0;height:2px}
  .mini .e-LO2{left:0;right:0;bottom:0;height:2px}
  .mini .e-LA1{top:0;bottom:0;left:0;width:2px}
  .mini .e-LA2{top:0;bottom:0;right:0;width:2px}
  .mini .e.on{background:var(--edge)}
  .mini .e-LO1.on,.mini .e-LO2.on{height:3px}
  .mini .e-LA1.on,.mini .e-LA2.on{width:3px}
  /* Double / Contour epais : cotes plus epais ; erreur du contour : cadre rouge (sans changer la taille) */
  .row.m-thick .mini .e-LO1.on,.row.m-thick .mini .e-LO2.on{height:5px}
  .row.m-thick .mini .e-LA1.on,.row.m-thick .mini .e-LA2.on{width:5px}
  .row.c-err .row-act .mini{box-shadow:0 0 0 2px var(--error)}
  .mini-lg{width:38px;height:24px;border:1px solid var(--line)}
  .mini-lg .e-LO1.on,.mini-lg .e-LO2.on{height:4px}
  .mini-lg .e-LA1.on,.mini-lg .e-LA2.on{width:4px}

  .cols,.row-main{display:grid;grid-template-columns:22px minmax(0,1fr) minmax(0,1fr) minmax(0,.62fr) 44px;gap:6px;align-items:center}
  .cols{margin-top:2px;padding-bottom:4px;font-size:12px;font-weight:600;color:var(--text-2)}
  .cols span{text-align:center}
  .cols span:first-child{text-align:left}
  body:not(.chant-on) .col-chant{visibility:hidden}
  /* 6px entre deux lignes ; ligne en dessous (boutons, Double, message) : 3px au-dessus et 3px en dessous (marges fusionnees) */
  .rows{display:flex;flex-direction:column;gap:0}
  .row-main{margin-bottom:6px}
  .num{font-size:13px;font-weight:600;color:var(--text-2);font-variant-numeric:tabular-nums}
  .row-main input{
    height:44px;min-height:44px;padding:0 4px;font-size:17px;font-weight:600;text-align:center;
    font-variant-numeric:tabular-nums;border-radius:10px;background:var(--card);border:1.5px solid transparent;
  }
  .row-main input:placeholder-shown{background:var(--field)}
  .row-main input:focus{background:var(--card);border-color:var(--primary);outline:none}
  .row-main input.bad,.row-main input.bad:focus{background:var(--error-soft);border-color:var(--error);color:var(--error)}
  .row-act{
    width:44px;height:44px;padding:0;display:flex;align-items:center;justify-content:center;cursor:pointer;
    font-family:inherit;font-size:20px;line-height:1;color:var(--text);background:var(--card);border:none;border-radius:10px;
  }
  .row-act .act-x{display:none;color:var(--error);pointer-events:none}
  body:not(.chant-on) .row-act .mini{display:none}
  body:not(.chant-on) .row-act .act-x{display:block}
  body:not(.chant-on) .row-act{background:transparent}
  .row-act.is-undo,body:not(.chant-on) .row-act.is-undo{color:var(--ok);background:var(--ok-soft);border:1.5px solid var(--ok-line)}
  body:not(.chant-on) .row.is-trail .row-act:not(.is-undo){visibility:hidden}

  .row-note{
    margin:0 0 3px 28px;height:15px;line-height:15px;font-size:12px;font-weight:600;color:var(--note-ink);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }
  .row-main + .row-note,.row-assist[hidden] + .row-note{margin-top:-3px}
  .row-note::before{content:"\21B3\00A0"}
  .row-note.is-err{color:var(--error)}
  .row-note[hidden],body:not(.chant-on) .row-note{display:none}
  .row-alert{margin:0 0 3px 28px;font-size:12px;font-weight:600;color:var(--error);display:none}
  .row.has-error .row-alert,.row.has-warn .row-alert{display:block}
  .row .row-alert:empty{display:none}
  .swap{
    width:calc(100% - 28px);margin:3px 0 3px 28px;font-family:inherit;font-size:13.5px;font-weight:600;letter-spacing:.02em;
    background:var(--wood);color:var(--primary);border:1.5px solid var(--primary);border-radius:8px;
    padding:11px 8px;min-height:44px;cursor:pointer;display:none;
  }
  .row.shown.can-swap .swap{display:block}
  .swap:active{background:var(--field)}

  /* tip CM + 4 boutons rapides sous la ligne active */
  .row-assist{margin:-3px 0 3px 28px}
  .row-assist[hidden]{display:none}
  .cm-hint{
    display:none;margin:0;height:18px;line-height:18px;font-size:13px;font-weight:600;color:var(--text-2);
    font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }
  body.unit-cm .cm-hint{display:block}
  .quick{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
  body:not(.chant-on) .quick{display:none}
  .q-edge{
    height:44px;padding:0;display:flex;align-items:center;justify-content:center;cursor:pointer;
    background:var(--card);border:1px solid var(--line);border-radius:10px;touch-action:manipulation;
  }
  .q-edge svg{display:block;pointer-events:none}
  .q-edge .q-box{fill:none;stroke:var(--edge-off);stroke-width:1}
  .q-edge .q-side{stroke:var(--edge-off);stroke-width:4;stroke-linecap:round}
  .q-edge[aria-pressed="true"] .q-side{stroke:var(--edge)}

  .chant-legend{display:none;align-items:center;gap:8px;margin:10px 0 0 28px;font-size:13px;color:var(--text-2)}
  body.chant-on .chant-legend{display:flex}

  .clear-wrap{display:flex;justify-content:flex-start;gap:8px;margin-top:12px;padding-left:28px}
  .btn-clear{font-family:inherit;font-size:14px;font-weight:600;letter-spacing:.03em;background:var(--card);color:var(--error);
    border:1.5px solid var(--error-line);border-radius:8px;padding:0 14px;height:40px;min-height:40px;cursor:pointer}
  .btn-clear:active{background:var(--error-soft)}
  .btn-undo{font-family:inherit;font-size:14px;font-weight:600;letter-spacing:.03em;background:var(--card);color:var(--ok);
    border:1.5px solid var(--ok-line);border-radius:8px;padding:0 14px;height:40px;min-height:40px;cursor:pointer}
  .btn-undo:active{background:var(--ok-soft)}
  .btn-undo[disabled]{color:var(--disabled);border-color:var(--line);cursor:not-allowed}

  /* ---------- Feuilles du bas ---------- */
  .sheet-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--overlay);z-index:40}
  .bsheet{
    position:fixed;left:0;right:0;bottom:0;z-index:50;max-height:88vh;overflow:auto;-webkit-overflow-scrolling:touch;
    background:var(--card);border-radius:18px 18px 0 0;box-shadow:0 -8px 30px var(--shadow);
    padding:16px 20px calc(16px + env(safe-area-inset-bottom));
  }
  .sheet-overlay[hidden],.bsheet[hidden]{display:none}
  .bsheet-in{max-width:620px;margin:0 auto}
  .bs-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
  .bs-head-txt{min-width:0}
  .bs-title{margin:0;font-size:17px;font-weight:600}
  .bs-sub{margin:2px 0 0;font-size:13px;color:var(--text-2);overflow-wrap:anywhere}
  .bs-x{width:44px;height:44px;flex:none;display:flex;align-items:center;justify-content:center;padding:0;
    background:var(--field);color:var(--text);border:none;border-radius:12px;cursor:pointer}
  .bs-x svg{pointer-events:none}
  .edgebox{display:flex;align-items:center;gap:16px;margin-top:10px}
  .eb-rect{position:relative;flex:none;width:200px;height:132px}
  .eb-face{position:absolute;top:24px;right:24px;bottom:24px;left:24px;background:var(--wood);border-radius:2px}
  .eb-edge{position:absolute;padding:0;margin:0;background:none;border:none;cursor:pointer}
  .eb-edge::after{content:"";position:absolute;background:var(--edge-off);border-radius:2px}
  .eb-edge[aria-pressed="true"]::after{background:var(--edge)}
  .eb-edge[data-edge="LO1"]{top:0;left:44px;right:44px;height:44px}
  .eb-edge[data-edge="LO1"]::after{left:-24px;right:-24px;top:20px;height:4px}
  .eb-edge[data-edge="LO2"]{bottom:0;left:44px;right:44px;height:44px}
  .eb-edge[data-edge="LO2"]::after{left:-24px;right:-24px;bottom:20px;height:4px}
  .eb-edge[data-edge="LA1"]{left:0;top:44px;bottom:44px;width:44px}
  .eb-edge[data-edge="LA1"]::after{top:-24px;bottom:-24px;left:20px;width:4px}
  .eb-edge[data-edge="LA2"]{right:0;top:44px;bottom:44px;width:44px}
  .eb-edge[data-edge="LA2"]::after{top:-24px;bottom:-24px;right:20px;width:4px}
  .eb-quick{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px}
  .eb-quick button{min-height:44px;font-family:inherit;font-size:15px;font-weight:600;background:var(--card);color:var(--text);
    border:1.5px solid var(--line);border-radius:10px;cursor:pointer}
  .bs-state{margin:12px 0 0;font-size:14px;font-weight:600;color:var(--text)}
  .cs-color-btn{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;min-height:44px;margin-top:8px;
    padding:0 2px;font-family:inherit;font-size:14px;font-weight:600;text-align:left;color:var(--text);
    background:none;border:none;border-top:1px solid var(--line);cursor:pointer}
  .cs-color-btn svg{flex:none;color:var(--text-2);pointer-events:none}
  .cs-color-txt{min-width:0;overflow-wrap:anywhere;pointer-events:none}
  .cs-color{margin-top:4px;height:44px;min-height:44px;font-size:16px}
  /* champ rempli : blanc ; vide : fond des champs vides (16.6) */
  .cs-color,#pieceNote{background:var(--card)}
  .cs-color:placeholder-shown,#pieceNote:placeholder-shown{background:var(--field)}
  .cs-color[hidden]{display:none}

  /* feuille de la piece : 3 modes, meme hauteur dans les 3 modes */
  .mode-bar{display:grid;grid-template-columns:1fr 1fr 1.4fr;margin-top:8px;background:var(--card);
    border:1.5px solid var(--line);border-radius:12px;overflow:hidden}
  .mode-btn{min-height:44px;padding:0 4px;font-family:inherit;font-size:15px;font-weight:600;color:var(--text-2);
    background:var(--card);border:none;border-left:1.5px solid var(--line);cursor:pointer;white-space:nowrap}
  .mode-btn:first-child{border-left:none}
  .mode-btn[aria-pressed="true"]{background:var(--primary);color:var(--on-primary)}
  #pieceSheet .edgebox{margin-top:8px}
  #pieceSheet.m-thick .eb-edge[aria-pressed="true"][data-edge="LO1"]::after{top:18px;height:8px}
  #pieceSheet.m-thick .eb-edge[aria-pressed="true"][data-edge="LO2"]::after{bottom:18px;height:8px}
  #pieceSheet.m-thick .eb-edge[aria-pressed="true"][data-edge="LA1"]::after{left:18px;width:8px}
  #pieceSheet.m-thick .eb-edge[aria-pressed="true"][data-edge="LA2"]::after{right:18px;width:8px}
  /* explication et Ajoute : toujours 2 lignes de haut, jamais coupees */
  .bs-explain{margin:6px 0 0;height:34px;font-size:13px;line-height:17px;color:var(--text-2);overflow-wrap:anywhere}
  .cw-zone{margin-top:6px}
  #pieceSheet:not(.m-contour) .cw-zone{visibility:hidden}
  .cw-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
  .cw-btn{width:100%;height:44px;min-height:44px;padding:0 2px;font-family:inherit;font-size:15px;font-weight:600;white-space:nowrap;
    color:var(--text);background:var(--card);border:1.5px solid var(--line);border-radius:10px;cursor:pointer}
  .cw-btn[aria-pressed="true"]{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}
  .cw-btn[aria-disabled="true"]{opacity:.38;cursor:not-allowed}
  .cw-btn[hidden]{display:none}
  .cw-slot{display:block;min-width:0}
  .cw-field{position:relative;display:block}
  .cw-field[hidden]{display:none}
  .cw-field input{height:44px;min-height:44px;padding:0 22px 0 4px;font-size:16px;font-weight:600;text-align:center;
    border-radius:10px;background:var(--card);border:1.5px solid var(--primary)}
  .cw-field input.bad,.cw-field input.bad:focus{background:var(--error-soft);border-color:var(--error);color:var(--error)}
  .cw-unit{position:absolute;right:5px;top:50%;transform:translateY(-50%);font-size:12px;font-weight:600;color:var(--text-2);pointer-events:none}
  .cw-ajoute{margin:4px 0 0;height:34px;font-size:13px;line-height:17px;font-weight:600;color:var(--text);
    font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
  .cw-ajoute.is-err{color:var(--error)}
  .note-zone{margin-top:6px;height:44px}
  .note-btn{height:44px;min-height:44px;padding:0 2px;font-family:inherit;font-size:15px;font-weight:600;color:var(--primary);
    background:none;border:none;text-decoration:underline;cursor:pointer}
  .note-btn[hidden],#pieceNote[hidden]{display:none}
  #pieceNote{height:44px;min-height:44px;font-size:16px;padding:0 10px}
  .bs-actions{display:flex;align-items:center;gap:12px;margin-top:8px}
  .bs-actions .bs-ok{flex:1;width:auto;margin-top:0;min-height:48px}
  .bs-del{min-height:44px;padding:0 16px;font-family:inherit;font-size:14px;font-weight:600;background:var(--card);color:var(--error);
    border:1.5px solid var(--error-line);border-radius:10px;cursor:pointer}
  .bs-del[hidden]{display:block;visibility:hidden}
  .bs-ok{width:100%;margin-top:14px;min-height:52px;font-family:inherit;font-size:17px;font-weight:600;
    background:var(--primary);color:var(--on-primary);border:none;border-radius:14px;cursor:pointer}

  /* ---------- Send bar ---------- */
  .sendbar{position:fixed;left:0;right:0;bottom:0;background:var(--bar-bg);
    border-top:1px solid var(--line);padding:10px 12px calc(10px + env(safe-area-inset-bottom));backdrop-filter:blur(6px);z-index:20}
  .sendbar-in{max-width:620px;margin:0 auto}
  .bar-row{display:flex;align-items:center;gap:12px}
  .bar-info{flex:1;min-width:0}
  .bar-count{margin:0;font-size:16px;font-weight:600;color:var(--text);font-variant-numeric:tabular-nums}
  .send{
    flex:none;font-family:inherit;font-size:17px;font-weight:600;letter-spacing:.02em;
    background:var(--primary);color:var(--on-primary);border:none;border-radius:14px;padding:0 28px;min-height:52px;cursor:pointer;
  }
  .bar-est{margin:2px 0 0;height:16px;font-size:13px;line-height:16px;font-weight:500;color:var(--text-2);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums}
  .bar-est.off{visibility:hidden}
  body.typing[data-step="3"] .sendbar{display:none}
  .send[disabled]{background:var(--disabled);color:var(--on-primary);cursor:not-allowed}
  .bar-alert{margin:0 0 8px;font-size:13px;font-weight:600;color:var(--error);text-align:center;display:none}
  .bar-alert.show{display:block}

  /* ---------- Page Vérifier (étape 4) ---------- */
  .rv{padding:8px 8px calc(16px + env(safe-area-inset-bottom))}
  .rv-h{margin:0;font-size:22px;font-weight:600;line-height:1.25}
  .rv-sub{margin:4px 0 16px;font-size:13px;color:var(--text-2)}
  .rv-sum{background:var(--card);border-radius:14px;overflow:hidden}
  .rv-pan{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:12px 16px;background:var(--primary);color:var(--on-primary)}
  .rv-pan-k{font-size:13px;color:var(--on-primary-soft)}
  .rv-pan-v{font-size:24px;font-weight:600;white-space:nowrap}
  .rv-tri{display:grid;grid-template-columns:1fr 1fr 1fr}
  .rv-cell{display:flex;flex-direction:column;min-width:0;padding:10px 12px;border-right:1px solid var(--line)}
  .rv-cell:last-child{border-right:none}
  .rv-k{font-size:12px;color:var(--text-2)}
  .rv-v{margin-top:2px;font-size:20px;font-weight:600;white-space:nowrap}
  .rv-v small{margin-left:4px;font-size:13px;font-weight:500}
  .rv-v small[hidden]{display:none}
  .sheet.rv-no-edge .rv-tri{grid-template-columns:1fr}
  .sheet.rv-no-edge .rv-edge{display:none}
  .rv-sec{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:24px 4px 8px;min-height:24px}
  .rv-sec-t{font-size:15px;font-weight:600}
  .rv-sec-n{font-size:13px;color:var(--text-2)}
  .rv-link{font-family:inherit;font-size:14px;font-weight:500;color:var(--primary);text-decoration:underline;background:none;border:none;
    min-height:44px;min-width:44px;margin:-10px -8px;padding:0 8px;cursor:pointer}
  .rv-card{background:var(--card);border-radius:14px;padding:4px 16px}
  .rv-r{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:10px 0;font-size:14px;border-bottom:1px solid var(--line)}
  .rv-r:last-child{border-bottom:none}
  .rv-r[hidden]{display:none}
  .rv-r span{flex:none;color:var(--text-2)}
  .rv-r b{font-weight:500;text-align:right;min-width:0;overflow-wrap:anywhere}
  .rv-list{background:var(--card);border-radius:14px;padding:0 16px}
  .rv-pc{display:grid;grid-template-columns:50px minmax(0,1fr) 44px 26px;align-items:center;gap:8px;padding:10px 0;border-bottom:1px solid var(--line)}
  .rv-pc:last-child{border-bottom:none}
  .sheet.rv-no-edge .rv-pc{grid-template-columns:50px minmax(0,1fr) 44px}
  .rv-no{font-size:12px;color:var(--text-2);white-space:nowrap}
  .rv-m{min-width:0}
  .rv-dim{font-size:16px;font-weight:600;white-space:nowrap}
  .rv-tg{margin-top:1px;font-size:12px;color:var(--text-2);overflow-wrap:anywhere}
  .rv-acc{color:var(--edge-text);font-weight:500}
  .rv-q{font-size:15px;font-weight:500;text-align:right;white-space:nowrap}
  .rv-strip{padding:6px 0}
  .rv-strip .rv-no{padding-left:2px}
  .rv-strip .rv-dim{font-size:14.5px;font-weight:500;color:var(--strip-ink)}
  .rv-strip .rv-q{font-size:14px;color:var(--strip-ink)}
  .rv-pc.m-thick .mini .e-LO1.on,.rv-pc.m-thick .mini .e-LO2.on{height:5px}
  .rv-pc.m-thick .mini .e-LA1.on,.rv-pc.m-thick .mini .e-LA2.on{width:5px}
  .mini.mini-strip .e-LO2{height:1px}
  .rv-btns{display:grid;gap:8px;margin-top:24px}
  .rv-wa{font-family:inherit;font-size:16px;font-weight:600;height:52px;border:none;border-radius:14px;background:var(--ok);color:var(--on-primary);cursor:pointer}
  .rv-two{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .rv-out{font-family:inherit;font-size:14px;font-weight:500;height:44px;padding:0 8px;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--text);cursor:pointer}
  .rv-fname{margin:2px 0 6px;min-height:32px;text-align:center;font-size:12px;line-height:16px;color:var(--text-2);overflow-wrap:anywhere}
  .rv-new{font-family:inherit;font-size:15px;font-weight:600;height:44px;border:1.5px solid var(--primary);border-radius:12px;background:none;color:var(--primary);cursor:pointer}
  .rv-back{font-family:inherit;font-size:14px;color:var(--text-2);text-decoration:underline;min-height:44px;padding:10px;border:none;background:none;cursor:pointer}

  /* ---------- Carte Restaurer (étape 2) ---------- */
  .restore-card{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:8px 0 12px;padding:10px 10px 10px 16px;
    background:var(--card);border:1px solid var(--line);border-radius:14px}
  .restore-card[hidden]{display:none}
  .rc-txt{min-width:0}
  .rc-t{margin:0;font-size:14px;font-weight:500}
  .rc-s{margin:2px 0 0;font-size:12px;color:var(--text-2);overflow-wrap:anywhere}
  .rc-btn{flex:none;font-family:inherit;font-size:14px;font-weight:600;height:44px;padding:0 14px;border:1.5px solid var(--primary);border-radius:10px;
    background:none;color:var(--primary);cursor:pointer}

  /* ---------- Feuille Nouvelle commande ---------- */
  .bs-new{padding-top:20px;overscroll-behavior:contain;animation:bs-up .25s ease-out}
  @keyframes bs-up{from{transform:translateY(100%)}to{transform:translateY(0)}}
  .ns-title{margin:0 0 10px;font-size:18px;font-weight:600}
  .ns-warn{display:flex;gap:8px;align-items:flex-start;margin:0 0 12px;padding:10px 12px;border-radius:10px;background:var(--warn-soft);
    color:var(--edge-text);font-size:14px;font-weight:500;line-height:1.4}
  .ns-warn[hidden]{display:none}
  .ns-txt{margin:0 0 16px;font-size:14px;line-height:1.45;color:var(--text-2)}
  .ns-txt span{display:block}
  .ns-btns{display:grid;grid-template-columns:1fr 1.4fr;gap:8px}
  .ns-no{font-family:inherit;font-size:15px;font-weight:500;height:48px;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--text);cursor:pointer}
  .ns-yes{font-family:inherit;font-size:15px;font-weight:600;height:48px;border:none;border-radius:12px;background:var(--primary);color:var(--on-primary);cursor:pointer}

  .toast{position:fixed;left:50%;transform:translateX(-50%);bottom:110px;background:var(--text);color:var(--on-primary);
    font-size:14px;font-weight:600;padding:12px 18px;border-radius:8px;z-index:60;opacity:0;pointer-events:none;transition:opacity .2s}
  .toast.show{opacity:1}

  /* ---------- Étapes ---------- */
  .step[hidden]{display:none}
  body:not([data-step="1"]) .masthead{display:none}
  body[data-step="4"]{padding-bottom:24px}
  body[data-step="4"] .sendbar{display:none}
  body[data-step="3"] .btn-next,body[data-step="4"] .btn-next{display:none}
  body:not([data-step="1"]) .draft-note{display:none}
  body:not([data-step="3"]) .bar-row,body:not([data-step="3"]) .bar-alert.show{display:none}

  .stepbar{margin:0 -12px;padding:14px 20px 0}
  .stepbar-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
  .step-back{
    width:44px;height:44px;flex:none;display:inline-flex;align-items:center;justify-content:center;padding:0;
    background:var(--card);color:var(--text);border:none;border-radius:12px;cursor:pointer;
  }
  .step-back[hidden]{display:inline-flex;visibility:hidden}
  .step-head{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center}
  .step-title{max-width:100%;text-align:center;font-size:17px;font-weight:600;color:var(--text)}
  .step-sub{max-width:100%;font-size:13px;line-height:16px;color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .step-sub[hidden]{display:none}
  body[data-step="3"] .stepbar{padding-top:4px}
  body[data-step="3"] .step-title{line-height:22px}
  body[data-step="3"] .segs{margin-top:5px}
  body[data-step="3"] .seg{height:3px}
  .unit-err{margin:8px 0 0}
  .step-count{width:44px;flex:none;text-align:right;font-size:13px;font-weight:500;color:var(--text-2);font-variant-numeric:tabular-nums}
  .segs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:12px}
  .seg{height:4px;border-radius:2px;background:var(--line)}
  .seg.on{background:var(--primary)}

  .step-client{margin:0 -12px;padding:0 20px}
  .step-h1{margin:22px 0 18px;font-size:28px;font-weight:600;line-height:1.15;color:var(--text)}
  .step-client .field{gap:8px;margin-bottom:16px}
  .step-client .field label{font-size:15px;font-weight:500;letter-spacing:0;color:var(--text)}
  .step-client input{min-height:52px;height:52px;border-radius:12px;font-size:17px;padding:0 16px;
    background:var(--card);border:1.5px solid transparent}
  .step-client input:placeholder-shown{background:var(--field)}
  .step-client input:focus{background:var(--card);border-color:var(--primary);outline:none}
  .step-client .locked{min-height:52px;border-radius:12px;padding:0 16px}
  .step-client input.bad{background:var(--error-soft);border-color:var(--error);color:var(--error)}
  .field-err{margin:0;font-size:13px;font-weight:600;color:var(--error)}

  /* ---------- Étape 2 : panneau ---------- */
  .step-panel{margin:0 -12px;padding:0 20px}
  .panel-list{display:flex;flex-direction:column;gap:8px;margin-top:18px}
  .panel-card{
    position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;
    min-height:56px;padding:10px 44px 10px 16px;text-align:left;cursor:pointer;
    font-family:inherit;color:var(--text);background:var(--card);
    border:2px solid var(--line);border-radius:12px;
  }
  .panel-card[aria-pressed="true"]{border-color:var(--primary)}
  .panel-card[aria-pressed="true"]::after{
    content:"\2713";position:absolute;right:14px;top:50%;transform:translateY(-50%);
    width:22px;height:22px;border-radius:50%;background:var(--primary);color:var(--on-primary);
    font-size:13px;font-weight:600;line-height:22px;text-align:center;
  }
  /* carte choisie + ses choix = une seule carte blanche */
  .panel-card[aria-pressed="true"]{border-bottom-width:0;border-bottom-left-radius:0;border-bottom-right-radius:0}
  .panel-opts{margin-top:-8px;padding:0 14px 12px;background:var(--card);
    border:2px solid var(--primary);border-top:0;border-radius:0 0 12px 12px}
  .panel-opts[hidden]{display:none}
  .panel-opts .finish-box{margin-top:0}
  .panel-opts .code-box{margin-top:12px}
  .step-panel .panel-opts .code-box input{border-color:var(--line)}
  .step-panel .panel-opts .code-box input:focus{border-color:var(--primary)}
  .panel-opts .panel-sum{margin-top:10px;min-height:44px;padding:2px 0 2px 54px}
  .panel-opts .panel-sum::before{left:0}
  .pc-name{font-size:16px;font-weight:600}
  .pc-sub{font-size:13px;color:var(--text-2)}
  .pc-size{font-size:13px;color:var(--text-2);font-variant-numeric:tabular-nums}
  .step-panel .field-err{margin-top:6px}
  .finish-box,.grain-box{margin-top:12px}
  .opt-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .opt-row[hidden],.panel-sum[hidden],.grain-box[hidden],.code-box[hidden]{display:none}
  .opt-btn{
    min-height:48px;font-family:inherit;font-size:16px;font-weight:600;cursor:pointer;
    background:var(--card);color:var(--text-2);border:2px solid var(--line);border-radius:12px;
  }
  .opt-btn[aria-pressed="true"]{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}
  .step-panel .code-box{gap:8px;margin-top:16px}
  .step-panel .code-box label{font-size:15px;font-weight:500;letter-spacing:0;color:var(--text)}
  .step-panel .code-box input{min-height:52px;height:52px;border-radius:12px;font-size:17px;padding:0 16px;
    background:var(--card);border:1.5px solid transparent}
  .step-panel .code-box input:placeholder-shown{background:var(--field)}
  .step-panel .code-box input:focus{background:var(--card);border-color:var(--primary);outline:none}
  .panel-sum{position:relative;display:flex;flex-direction:column;gap:2px;margin-top:12px;padding:12px 16px 12px 70px;
    min-height:68px;justify-content:center;background:var(--card);border-radius:12px;color:var(--text)}
  .panel-sum::before{content:"";position:absolute;left:16px;top:50%;transform:translateY(-50%);
    width:40px;height:40px;border-radius:8px;background:var(--wood);border:1px solid var(--line)}
  .ps-name{font-size:15px;font-weight:600;overflow-wrap:anywhere}
  .ps-size{font-size:13px;color:var(--text-2);font-variant-numeric:tabular-nums}
  .step-panel .block{margin-top:16px}
  .field-err[hidden]{display:none}
  .ver{margin:8px 0 0;font-size:11px;color:var(--text-2);letter-spacing:.06em}

  .btn-next{
    width:100%;min-height:56px;font-family:inherit;font-size:17px;font-weight:600;letter-spacing:.02em;
    background:var(--primary);color:var(--on-primary);border:none;border-radius:14px;padding:0 16px;cursor:pointer;
  }
  body[data-step="1"] .sendbar,body[data-step="2"] .sendbar{padding-left:20px;padding-right:20px}
  .draft-note{margin:8px 0 0;text-align:center;font-size:13px;color:var(--text-2)}

  @media (prefers-reduced-motion:reduce){*{transition:none!important}}
  

  /* ---------- Feuille A4 (impression / PDF) ---------- */
  #printArea{display:none}
  @page{size:A4;margin:12mm}
  @media print{
    html,body{background:var(--print-paper)!important;margin:0!important;padding:0!important}
    body > *{display:none!important}
    body > #printArea{display:block!important}
    #printArea{font-family:Arial,Helvetica,sans-serif;color:var(--print-ink);font-size:12px}
    #printArea .pr-head{display:flex;justify-content:space-between;align-items:flex-end;padding-bottom:3mm;border-bottom:.7mm solid var(--print-ink)}
    #printArea .pr-brand{font-size:7.2mm;font-weight:700;letter-spacing:1.6mm;line-height:1}
    #printArea .pr-owner{margin-top:1.6mm;font-size:3mm;color:var(--print-mute)}
    #printArea .pr-doc{text-align:right}
    #printArea .pr-tel,#printArea .pr-no{font-size:3.1mm;color:var(--print-mute)}
    #printArea .pr-title{margin:1.2mm 0;font-size:4.2mm;font-weight:700;letter-spacing:.4mm}
    #printArea .pr-card{display:grid;grid-template-columns:1fr 1fr 1fr;margin-top:4mm;border:.3mm solid var(--print-ink)}
    #printArea .pr-cell{padding:2.2mm 3mm;border-right:.25mm solid var(--print-ink);min-width:0}
    #printArea .pr-cell:last-child{border-right:none}
    #printArea .pr-k{font-size:2.4mm;font-weight:700;letter-spacing:.35mm;color:var(--print-mute)}
    #printArea .pr-v{margin-top:1mm;font-size:3.5mm;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    #printArea .pr-v2{margin-top:.6mm;font-size:2.9mm;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    #printArea .pr-sum{display:grid;grid-template-columns:repeat(4,1fr);gap:2.5mm;margin-top:3.5mm}
    #printArea .pr-sum-2{grid-template-columns:1fr 1fr}
    #printArea .pr-box{padding:2.2mm 3mm;border:.3mm solid var(--print-ink)}
    #printArea .pr-dark{background:var(--print-ink);color:var(--print-paper);-webkit-print-color-adjust:exact;print-color-adjust:exact}
    #printArea .pr-dark .pr-k{color:var(--print-paper)}
    #printArea .pr-bv{margin-top:.8mm;font-size:5.4mm;font-weight:700}
    #printArea .pr-x{margin-top:.6mm;font-size:2.3mm;color:var(--print-mute)}
    #printArea table{width:100%;margin-top:4mm;border-collapse:collapse;table-layout:fixed}
    #printArea .pr-c0{width:9%}
    #printArea .pr-c1,#printArea .pr-c2{width:15%}
    #printArea .pr-c3{width:11%}
    #printArea .pr-c4,#printArea .pr-c5{width:9%}
    #printArea .pr-c6{width:32%}
    #printArea .pr-no-edge .pr-c0{width:16%}
    #printArea .pr-no-edge .pr-c1,#printArea .pr-no-edge .pr-c2,#printArea .pr-no-edge .pr-c3{width:28%}
    #printArea th{background:var(--print-ink);color:var(--print-paper);font-size:2.4mm;font-weight:700;letter-spacing:.3mm;text-transform:uppercase;
      padding:1.8mm 1mm;border:.25mm solid var(--print-ink);-webkit-print-color-adjust:exact;print-color-adjust:exact}
    #printArea td{height:7.2mm;padding:0 1.6mm;border:.2mm solid var(--print-ink);text-align:center;font-size:3.3mm}
    #printArea tr.pr-z td{background:var(--print-zebra);-webkit-print-color-adjust:exact;print-color-adjust:exact}
    #printArea td.pr-n{font-size:2.8mm}
    #printArea td.pr-d{font-size:3.6mm;font-weight:700}
    #printArea td.pr-mk{font-size:3.8mm;font-weight:700;letter-spacing:.4mm}
    #printArea td.pr-note{text-align:left;font-size:2.8mm;overflow-wrap:anywhere}
    #printArea .pr-q2{font-size:2.8mm;font-weight:400}
    #printArea tr.pr-strip td{font-style:italic}
    #printArea tr.pr-strip td.pr-n{text-align:left;padding-left:3mm}
    #printArea tr.pr-strip td.pr-d{font-size:3.3mm;font-weight:400}
    #printArea .pr-tag{display:inline-block;margin-right:1mm;padding:.3mm 1.4mm;font-size:2.4mm;font-weight:700;font-style:normal;
      background:var(--print-ink);color:var(--print-paper);-webkit-print-color-adjust:exact;print-color-adjust:exact}
    #printArea .pr-tag-b{background:none;color:var(--print-ink);border:.25mm solid var(--print-ink)}
    #printArea thead{display:table-header-group}
    #printArea tbody{page-break-inside:avoid;break-inside:avoid}
    #printArea tr{page-break-inside:avoid}
  }
