/* =========================================================
   Générateur de soumissions : styles.css, v199
   Remplace app.css + design.css (v67 → v198).
   Ordre : jetons → base → mise en page → composants → écrans → impression.
   Aucun !important sauf dans la section 6 (impression).
   ========================================================= */


/* =========================================================
   1. TOKENS
   ========================================================= */

/* 1.1 Brand inputs (SoumissionExpert charte v1). Override these per company; everything else follows.
   --brand-text is text written IN the brand color; --on-brand is text ON a brand background. */
:root{
  --brand:       #2F6B5A;
  --brand-hover: #24574A;
  --brand-text:  #2F6B5A;
  --on-brand:    #ffffff;
  --brand-tint:  #DDEBE5;
  --font-brand:  "Schibsted Grotesk", Inter, system-ui, sans-serif;  /* headings, logotype */
  --font-ui:     Inter, system-ui, sans-serif;                       /* everything else */
  --logo:        none;            /* url("…") replaces the sidebar mark when set */
}

/* 1.2 Derived brand colors */
:root{
  --brand-ring:  color-mix(in srgb, var(--brand) 28%, transparent);
  --brand-line:  color-mix(in srgb, var(--brand) 45%, var(--line));
}

/* 1.3 Neutrals */
:root{
  --ground:      #F5F6F4;
  --surface:     #FFFFFF;
  --soft:        #EEF0EC;
  --ink:         #111827;
  --muted:       #4B5563;
  --line:        #E3E6E1;
  --line-strong: #8A929C;
  --chip:        #111827;
  --chip-text:   #ffffff;
  --icon:        #64748b;
  --overlay:     rgba(10,14,20,.5);

  --sidebar:      #111827;
  --sidebar-text: #CBD5E1;
  --sb-muted: #6B7280;
  --sb-hover: #1a2230;
  --sb-on:    #1F2937;
  --sb-line:  #1F2937;
}

/* 1.4 Status colors (text / soft background) */
:root{
  --ok:     #166534;  --ok-soft:     #DCF3E6;
  --warn:   #92400E;  --warn-soft:   #FDEEDD;
  --danger: #B91C1C;  --danger-soft: #FDE2E2;
  --info:   #1D4ED8;  --info-soft:   #E0ECFF;
}

/* 1.5 Scales */
:root{
  --fs-xs: 12px;  --fs-sm: 13px;  --fs-md: 14px;
  --fs-lg: 16px;  --fs-xl: 20px;  --fs-2xl: 26px;
  --lh: 1.45;

  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px;
  --sp-4: 16px; --sp-5: 24px; --sp-6: 32px;

  --r-btn: 7px;  --r-input: 10px;  --r-card: 14px;  --r-pill: 999px;

  --shadow-sm:    0 1px 2px rgba(16,24,40,.06);
  --shadow-pop:   0 8px 24px rgba(16,24,40,.16);
  --shadow-modal: 0 24px 64px rgba(16,24,40,.32);

  --sb-w: 236px;
  --content-max: 1180px;
  --mp-stage: #9aa4ad;
}

/* 1.6 Legacy aliases. Old names still read by inline styles in the JS
   (var(--mut), var(--card), var(--acc)…). Do not use in new CSS. */
:root{
  --bg:   var(--ground);
  --card: var(--surface);
  --mut:  var(--muted);
  --acc:  var(--brand);
  --hi:   var(--brand);
  --bd:   var(--line);
}

/* 1.7 Dark mode: tokens only (same list twice: system setting, then manual choice) */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --brand: #2F6B5A; --brand-hover: #3A7C69; --brand-text: #7FC3A8; --on-brand: #ffffff; --brand-tint: #1E3A32;
    --ground: #12171D; --surface: #1B222B; --soft: #222B36;
    --ink: #E8EDF2; --muted: #98A5B3; --line: #303A46; --line-strong: #6B7684;
    --chip: #e5e7eb; --chip-text: #111827; --icon: #94a3b8; --overlay: rgba(0,0,0,.6);
    --sb-hover: #1a2230; --sb-on: #1F2937; --sb-line: #1F2937;
    --ok: #4ade80; --ok-soft: #12301f; --warn: #fbbf24; --warn-soft: #33260f;
    --danger: #f87171; --danger-soft: #3a1a1a; --info: #60a5fa; --info-soft: #172a45;
    --shadow-sm: 0 1px 2px rgba(0,0,0,.4); --shadow-pop: 0 8px 24px rgba(0,0,0,.45); --shadow-modal: 0 24px 64px rgba(0,0,0,.6);
    --mp-stage: #2b323a;
  }
}
:root[data-theme="dark"]{
  --brand: #2F6B5A; --brand-hover: #3A7C69; --brand-text: #7FC3A8; --on-brand: #ffffff; --brand-tint: #1E3A32;
  --ground: #12171D; --surface: #1B222B; --soft: #222B36;
  --ink: #E8EDF2; --muted: #98A5B3; --line: #303A46; --line-strong: #6B7684;
  --chip: #e5e7eb; --chip-text: #111827; --icon: #94a3b8; --overlay: rgba(0,0,0,.6);
  --sb-hover: #1a2230; --sb-on: #1F2937; --sb-line: #1F2937;
  --ok: #4ade80; --ok-soft: #12301f; --warn: #fbbf24; --warn-soft: #33260f;
  --danger: #f87171; --danger-soft: #3a1a1a; --info: #60a5fa; --info-soft: #172a45;
  --shadow-sm: 0 1px 2px rgba(0,0,0,.4); --shadow-pop: 0 8px 24px rgba(0,0,0,.45); --shadow-modal: 0 24px 64px rgba(0,0,0,.6);
  --mp-stage: #2b323a;
}


/* =========================================================
   2. BASE
   ========================================================= */
*{box-sizing:border-box}
html{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;background:var(--ground);color:var(--ink);font:var(--fs-md)/var(--lh) var(--font-ui)}
h1,h2{margin:0}
h3{font-family:var(--font-ui)}
h1{font-family:var(--font-brand);font-size:var(--fs-2xl);font-weight:700;letter-spacing:-.01em}
h2{font-family:var(--font-brand);font-size:var(--fs-xl);font-weight:700;letter-spacing:-.01em}
h3{font-size:var(--fs-lg);font-weight:600}
.big{font-size:var(--fs-xl);font-weight:600;font-variant-numeric:tabular-nums}
button{font-family:inherit}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.hide{display:none}

/* =========================================================
   3. LAYOUT
   ========================================================= */

/* 3.1 Sidebar */
#sb{position:fixed;left:0;top:0;bottom:0;width:var(--sb-w);background:var(--sidebar);color:var(--sidebar-text);display:flex;flex-direction:column;padding:16px 12px;z-index:45;overflow-y:auto}
#sb .sbbrand{display:flex;align-items:center;gap:14px;padding:4px 8px 24px}
#sb .sbmark{flex:none;width:34px;height:34px;display:block;background:var(--logo) center/contain no-repeat}
#sb .sbmark svg{width:34px;height:34px;display:block}
.sewm{font-family:var(--font-brand);letter-spacing:-.02em;line-height:1;white-space:nowrap;color:#fff}
.sewm span{font-weight:500}
.sewm b{font-weight:800}
#sb .sbbrand .sewm{display:block;font-size:18px;margin-bottom:4px}
#sb .sbbrand small{display:block;color:#9ca3af;font-size:var(--fs-xs);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px}
#sb h4{margin:16px 8px 4px;font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--sb-muted)}
#sb button{display:flex;align-items:center;gap:var(--sp-3);width:100%;border:0;background:none;color:var(--sidebar-text);font:500 var(--fs-md)/1 var(--font-ui);padding:10px;border-radius:var(--r-btn);cursor:pointer;text-align:left}
#sb button svg{flex:none;width:17px;height:17px;opacity:.85}
#sb button:hover{background:var(--sb-hover);color:#fff}
#sb button.on{background:var(--sb-on);color:#fff;font-weight:600}
#sb button:focus-visible{outline:2px solid var(--brand);outline-offset:1px}
#sb .sbfoot{margin-top:auto;padding-top:var(--sp-3);border-top:1px solid var(--sb-line)}
#sbx{display:none}

/* 3.2 Mobile top bar (shown under 900px) */
#mtop{display:none}

/* 3.3 Main area */
main{max-width:min(1800px,100%);margin:0 auto;padding:var(--sp-4) var(--sp-5)}
body.sbon main{max-width:none;margin:0 0 0 var(--sb-w);padding:var(--sp-5) var(--sp-6) var(--sp-6);min-height:100vh}
body.sbon main>div:not(#hm):not(#qtabs){max-width:var(--content-max)}
#pgh{font:700 var(--fs-2xl)/1.15 var(--font-brand);letter-spacing:-.01em;margin:0 0 var(--sp-5)}
body[data-view="hm"] #pgw,body[data-view="pn"] #pgw,body[data-view="mp"]:not(:has(#mp .mphero)) #pgw{display:none}

/* 3.4 Quote action bar (.top, quote views only) and quote tabs */
.top{display:none;align-items:center;gap:var(--sp-3);flex-wrap:wrap;margin:calc(-1 * var(--sp-5)) calc(-1 * var(--sp-6)) 0;padding:var(--sp-2) var(--sp-6);background:var(--surface);border-bottom:1px solid var(--line)}
body.qv .top{display:flex}
body.pv .top{display:none}
.top h1{display:none}
.top .tbar{flex:1;display:flex;flex-wrap:wrap;gap:var(--sp-2);align-items:center}
.top .tbar [data-a="print"]{margin-left:auto}
/* one green button per screen: the top-bar Imprimer is green only on the Générateur */
body.sbon:not([data-view="ia"]) .top .btn.pri{background:var(--surface);border-color:var(--line-strong);color:var(--ink);font-weight:500}
.top #sv{color:var(--muted);font-size:var(--fs-sm)}
/* buttons kept in the HTML but hidden since v164 */
.top [data-a="savenow"],.top [data-a="drive"],.top #sv,.top #bmv,.top [data-a="logo"],.top [data-a="nologo"],.top [data-a="new"]{display:none}

#qtabs{display:none;align-items:center;gap:6px;flex-wrap:wrap;margin:var(--sp-4) 0 var(--sp-4)}
body.qv #qtabs{display:flex}
#qtabs .qtn{font-weight:700;font-size:var(--fs-lg);margin-right:var(--sp-3);color:var(--ink)}
#qtabs button{border:1px solid var(--line-strong);background:var(--surface);color:var(--ink);font:500 var(--fs-md) var(--font-ui);padding:var(--sp-2) 14px;border-radius:var(--r-pill);cursor:pointer}
#qtabs button.on{background:var(--chip);border-color:var(--chip);color:var(--chip-text)}

/* 3.5 Old tab row: kept in the HTML for its buttons' data-a, never shown */
.seg.tools[data-mvrow="tabs"]{display:none}

@media (max-width:899px){
  #sb{z-index:70;transform:translateX(-100%);visibility:hidden;transition:transform .2s ease,visibility .2s}
  body.sbopen #sb{transform:none;visibility:visible;box-shadow:0 0 40px rgba(0,0,0,.35)}
  body.sbopen #sbx{display:block;position:fixed;inset:0;background:var(--overlay);z-index:65}
  #mtop{display:flex;align-items:center;gap:10px;position:sticky;top:0;z-index:50;background:var(--sidebar);color:#fff;padding:10px var(--sp-4);margin:calc(-1 * var(--sp-4)) calc(-1 * var(--sp-4)) var(--sp-4)}
  #mtop button{border:0;background:none;color:#fff;padding:6px;cursor:pointer;display:grid;place-items:center}
  #mtop svg{width:22px;height:22px}
  #mtop .mtbrand{display:flex;align-items:center;gap:10px}
  #mtop .mtbrand svg{width:24px;height:24px;display:block}
  #mtop .sewm{font-size:15px}
  body.sbon main{margin:0;padding:var(--sp-4)}
  .top{margin:0 calc(-1 * var(--sp-4));padding:var(--sp-2) var(--sp-4)}
  body.sbon.qv #mtop{margin-bottom:0}
}
@media (max-width:600px){
  .top{gap:var(--sp-1)}
  .top .btn{padding:5px 9px;font-size:var(--fs-sm)}
  .grid{grid-template-columns:1fr}
  .card{padding:var(--sp-3)}
  .kpis{grid-template-columns:1fr 1fr}
  .kpi b{font-size:var(--fs-lg)}
  .bsf input{width:100%}
  .bsf label{flex:1 1 140px}
}


/* =========================================================
   4. COMPONENTS
   ========================================================= */

/* 4.1 Button */
.btn{font:500 var(--fs-md)/1.25 var(--font-ui);border:1px solid var(--line-strong);background:var(--surface);color:var(--ink);padding:var(--sp-2) var(--sp-3);cursor:pointer;border-radius:var(--r-btn);transition:background .12s,border-color .12s}
.btn:hover:not(:disabled){background:var(--soft)}
.btn:disabled{opacity:.45;cursor:default}
.btn.sm{padding:var(--sp-1) var(--sp-2);font-size:var(--fs-sm)}
.btn.pri{background:var(--brand);border-color:var(--brand);color:var(--on-brand);font-weight:600}
.btn.pri:hover:not(:disabled){background:var(--brand-hover);border-color:var(--brand-hover)}
.btn.on{background:var(--chip);border-color:var(--chip);color:var(--chip-text)}
.btn.on:hover:not(:disabled){background:var(--chip)}
.btn.danger{background:var(--danger);border-color:var(--danger);color:var(--surface)}
.btn.danger:hover:not(:disabled){background:var(--danger);filter:brightness(1.08)}
.lnk{background:none;border:0;color:var(--brand-text);text-decoration:underline;text-underline-offset:3px;padding:0;font:inherit;cursor:pointer}

/* 4.2 Input */
label{display:block;font-size:var(--fs-sm);color:var(--muted);font-weight:500}
input,select,textarea{width:100%;font:inherit;color:var(--ink)}
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]),select,textarea{background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r-input);padding:var(--sp-2) 10px;transition:border-color .12s,box-shadow .12s}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-ring)}
input[type=checkbox],input[type=radio],input[type=range]{accent-color:var(--brand)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:var(--sp-3)}
.sh{display:flex;gap:var(--sp-2);flex-wrap:wrap;align-items:end;margin-bottom:var(--sp-2)}
.sh>div{flex:1 1 180px}
.add{display:flex;gap:var(--sp-2);flex-wrap:wrap;margin-top:var(--sp-2)}
.add input{flex:1 1 220px}
.ssb{display:flex;gap:var(--sp-2);margin-bottom:var(--sp-1)}
.ssb input{flex:1}
/* combobox */
.cb{flex:1 1 220px}
.cb small{display:block;font-size:var(--fs-sm);color:var(--muted)}
.cbb{position:absolute;right:2px;top:2px;border:0;background:none;color:var(--muted);cursor:pointer;font-size:var(--fs-lg);padding:var(--sp-1) var(--sp-2)}
.cbl{position:absolute;left:0;right:0;top:100%;z-index:20;max-height:280px;overflow:auto;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-input);box-shadow:var(--shadow-pop)}
.cbl button{display:flex;align-items:center;gap:var(--sp-2);width:100%;text-align:left;border:0;background:none;color:var(--ink);padding:var(--sp-2) 10px;cursor:pointer;font:inherit}
.cbl button:hover{background:var(--soft)}

/* 4.3 Card */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);padding:var(--sp-4);margin-bottom:var(--sp-4)}
details.card>summary{cursor:pointer;padding:2px 0}
.ch{display:flex;align-items:center;gap:var(--sp-2);padding:0 0 var(--sp-3);margin:0 0 var(--sp-3);border-bottom:1px solid var(--line);color:var(--ink);font:600 var(--fs-lg)/1.3 var(--font-ui)}
.ch[data-a]{cursor:pointer}
/* user-chosen section color: shown as a dot (JS sets --sc) */
.ch[style*="--sc"]::before{content:"";flex:none;width:10px;height:10px;border-radius:50%;background:var(--sc)}
.ch input[type=color]{width:28px;height:24px;padding:0;border:1px solid var(--line);border-radius:4px;background:none;cursor:pointer}
.card.col>:not(.ch){display:none}
.card.col>.ch{margin-bottom:0;border-bottom:0;padding-bottom:0}
.tag{font:600 var(--fs-xs) var(--font-ui);padding:2px var(--sp-2);border-radius:var(--r-pill);background:var(--soft);color:var(--muted)}
.nb{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--soft);color:var(--ink);font-size:var(--fs-md)}
.hint{margin:0 0 var(--sp-2);color:var(--muted)}
.empty{color:var(--muted);padding:10px 4px}
.mini{margin:var(--sp-2) 0}
.mini summary{cursor:pointer;color:var(--brand-text)}

/* 4.4 Table */
.sc{overflow-x:auto}
table{border-collapse:collapse;width:100%;min-width:760px}
th{font-size:var(--fs-xs);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);text-align:left;padding:var(--sp-2) var(--sp-1);border-bottom:1px solid var(--line)}
td{padding:3px var(--sp-1);vertical-align:middle;border-bottom:1px solid var(--line)}
tr:last-child td{border-bottom:0}
tr:hover td{background:var(--soft)}
td.r,.r{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.dl{white-space:nowrap;width:1%}
.rn{display:inline-block;min-width:22px;color:var(--muted);font-weight:600}
.sc td.dl{position:sticky;left:0;background:var(--surface);z-index:1}
.sc td:last-child:has(>button){position:sticky;right:0;background:var(--surface);z-index:1}
.dr td{background:transparent}
.dr textarea{font-size:var(--fs-sm)}
/* row and section drag */
.tgrip{cursor:grab;font-size:var(--fs-lg);line-height:1;padding:4px 3px;margin-right:2px;touch-action:none;user-select:none;-webkit-user-select:none;color:var(--muted);border-radius:4px;letter-spacing:-3px;display:inline-block}
.tgrip:hover{background:var(--soft);color:var(--ink)}
.sgrip{order:-1;cursor:grab;font-size:22px;line-height:1;padding:2px 6px;margin:-4px 0;touch-action:none;user-select:none;-webkit-user-select:none;color:var(--muted);border-radius:4px}
.sgrip:hover{background:var(--soft)}
tr.trow-drag{opacity:.45}
tr.trow-before>td{box-shadow:inset 0 3px 0 0 var(--brand)}
tr.trow-after>td{box-shadow:inset 0 -3px 0 0 var(--brand)}
body.tgd,body.tgd *{cursor:grabbing;user-select:none}
.sec-drag{opacity:.45}
.sec-before{box-shadow:0 -4px 0 0 var(--brand)}
.sec-after{box-shadow:0 4px 0 0 var(--brand)}
body.sgd,body.sgd *{cursor:grabbing;user-select:none}

/* 4.5 Tabs and segmented */
.seg button{font:inherit;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:6px 14px;cursor:pointer;border-radius:var(--r-pill)}
.seg button.on{background:var(--chip);border-color:var(--chip);color:var(--chip-text)}

/* 4.6 Chip, badge, dot */
.chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:var(--sp-1) 0}
.chips b{min-width:92px}
.dot{width:12px;height:12px;border-radius:50%;flex:none}

/* 4.7 KPI tiles */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:var(--sp-3);margin-bottom:var(--sp-4)}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);padding:var(--sp-3) var(--sp-4)}
.kpi small{display:block;color:var(--muted);font-size:var(--fs-sm)}
.kpi b{font:600 var(--fs-xl)/1.3 var(--font-ui);font-variant-numeric:tabular-nums}

/* 4.8 Callouts and status */
.callout{background:var(--soft);border-left:3px solid var(--line-strong);border-radius:var(--r-btn);padding:var(--sp-2) var(--sp-3);margin:var(--sp-2) 0}
.callout.warn{background:var(--warn-soft);border-left-color:var(--warn)}
.callout.ok{background:var(--brand-tint);border-left-color:var(--brand)}
.callout.info{border-left-color:var(--ink)}
.iast{padding:10px var(--sp-3);border-radius:var(--r-input);margin:var(--sp-2) 0;display:flex;gap:10px;align-items:center;font-size:var(--fs-md)}
.iast.run{background:var(--soft);color:var(--ink)}
.iast.ok{background:var(--brand-tint);color:var(--ok)}
.iast.err{background:var(--danger-soft);color:var(--danger)}
.iast .spin{border-color:var(--line);border-top-color:var(--brand)}

/* 4.9 Toast and spinner */
#iatoast,#stoast{position:fixed;left:50%;transform:translateX(-50%);bottom:18px;z-index:60;background:var(--sidebar);color:#fff;padding:10px 18px;border-radius:var(--r-pill);box-shadow:var(--shadow-pop);font-size:var(--fs-md);display:none;max-width:92vw}
#stoast{bottom:70px}
#iatoast.show,#stoast.show{display:flex;gap:10px;align-items:center}
#iatoast.ok,#stoast.ok{background:var(--brand);color:var(--on-brand)}
#iatoast.err,#stoast.err{background:var(--danger);color:var(--surface)}
.spin{width:16px;height:16px;border:3px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;display:inline-block;animation:sp .8s linear infinite;flex:0 0 auto}
@keyframes sp{to{transform:rotate(360deg)}}

/* 4.10 Modal and popover: shared look used by Quoter Plan (5.10) and PDF Note (5.11) */

/* 4.11 Chat */
.chat{border:1px solid var(--line);border-radius:var(--r-input);margin-top:var(--sp-3);overflow:hidden}
.chm{max-height:320px;overflow:auto;padding:10px;display:flex;flex-direction:column;gap:var(--sp-2)}
.msg{padding:var(--sp-2) var(--sp-3);border-radius:var(--sp-3);max-width:90%;white-space:pre-wrap}
.msg.u{align-self:flex-end;background:var(--sidebar);color:#fff}
.msg.c{align-self:flex-start;background:var(--soft);color:inherit}
.msg small{display:block;margin-top:6px;opacity:.9;white-space:normal}
.chi{display:flex;gap:var(--sp-2);padding:var(--sp-2);border-top:1px solid var(--line);align-items:flex-end}
.chi textarea{flex:1;min-height:44px}

/* 4.12 Reorder mode */
[data-mvrow].mvon>[data-mvk]{outline:2px dashed var(--brand);outline-offset:2px;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none}
[data-mvrow].mvon>[data-mvk]::before{content:"⠿ ";opacity:.7}
[data-mvrow]>.mvg{opacity:.6;cursor:grabbing;position:relative;z-index:5;box-shadow:var(--shadow-pop)}


/* 4.13 Utilities (replace inline styles moved out of the JS; last in components so they win) */
.muted{color:var(--muted)}
.block{display:block}
.tx-warn{color:var(--warn)}
.tx-danger{color:var(--danger)}
.tx-brand{color:var(--brand-text)}
.fs-xs{font-size:var(--fs-xs)}
.fs-sm{font-size:var(--fs-sm)}
.fw-6{font-weight:600}
.fw-7{font-weight:700}
.no-ul{text-decoration:none}
.h-xl{font-size:var(--fs-xl);margin-bottom:var(--sp-2)}
.hl{background:var(--brand-tint);color:var(--ink);padding:0 var(--sp-2);border-radius:4px}
.card-hl{border:2px solid var(--brand)}
.sei{display:inline-block;width:1.05em;height:1.05em;vertical-align:-.17em;flex:none;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sei.f{fill:currentColor}
.spin.dk{border-color:var(--line);border-top-color:var(--brand)}


/* =========================================================
   5. SCREENS
   ========================================================= */

/* 5.1 Tableau de bord */

/* 5.2 Soumissions list: company models */
.mdl{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--sp-3)}
.mdc{border:1px solid var(--line);border-radius:var(--r-card);padding:var(--sp-3);display:flex;flex-direction:column;gap:var(--sp-1);background:var(--surface)}
.mdc img{max-width:150px;max-height:80px;object-fit:contain;align-self:flex-start;background:#fff}
.mdc .mdn{height:60px;display:grid;place-items:center;border:2px dashed var(--line);color:var(--muted);border-radius:var(--r-input);font-size:var(--fs-sm)}
.mdc small{color:var(--muted)}
.sr{display:flex;gap:var(--sp-2);align-items:center;padding:var(--sp-2) 0;border-top:1px solid var(--line)}
.sr>div{flex:1;min-width:0}
.sr small{display:block;color:var(--muted)}

/* 5.3 Générateur */
.pbar{display:flex;flex-wrap:wrap;gap:var(--sp-1);align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);padding:6px;margin-bottom:var(--sp-3)}
.pbar .btn{border:0;background:transparent;color:var(--muted);padding:7px var(--sp-3)}
.pbar .btn:hover:not(:disabled){background:var(--soft);color:var(--ink)}
/* .pri here is the "panel open" toggle state (JS), shown as a selected chip */
.pbar .btn.pri{background:var(--chip);color:var(--chip-text);font-weight:500}
.pbar .btn.pri:hover:not(:disabled){background:var(--chip)}
.pbar .hint{margin:0 0 0 6px;flex:1 1 200px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pn.hid{display:none}
.sub{border-top:1px solid var(--line-strong);margin-top:var(--sp-2);padding-top:var(--sp-2);display:flex;justify-content:space-between;font-weight:600}
.sum{max-width:380px;margin-left:auto}
.sum div{display:flex;justify-content:space-between;padding:3px 0}
.sum .tot{border-top:1px solid var(--line-strong);margin-top:var(--sp-1);padding-top:var(--sp-2)}
.bar{position:sticky;bottom:0;background:var(--sidebar);color:#fff;padding:10px var(--sp-4);border-radius:var(--r-card);display:flex;justify-content:space-between;align-items:center;box-shadow:var(--shadow-pop)}

/* 5.4 Générateur IA: plan drop zone */
.pldz{border:2px dashed var(--brand);border-radius:var(--r-input);padding:var(--sp-3);margin:6px 0;text-align:center;background:var(--brand-tint);transition:.15s}
.pldz.ov{border-style:solid}
.pldz input{max-width:420px;margin-top:6px}

/* 5.5 Budget */
.bst{width:100%}
.bst td,.bst th{padding:9px 10px}
.bsr td{border-top:1px solid var(--line)}
.bsx{border:0;background:none;cursor:pointer;font-size:var(--fs-md);padding:2px 6px;color:var(--muted)}
.bsb{width:90px}
.bsb i{display:block;height:6px;border-radius:3px;background:var(--brand);width:0}
.bsh td{background:var(--soft);font-weight:700;padding:7px 10px;font-size:var(--fs-sm)}
.bsk td{border-top:1px solid var(--line);font-weight:600}
.bst2 td{font-size:var(--fs-lg);font-weight:700;border-top:1px solid var(--line-strong)}
.bsf{display:flex;flex-wrap:wrap;gap:var(--sp-3);align-items:end;padding:6px 4px 10px 30px}
.bsf label{display:flex;flex-direction:column;font-size:var(--fs-xs);color:var(--muted);gap:3px}
.bsf input{width:130px}

/* 5.6 Réglages */
.rgg{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;margin-bottom:var(--sp-2)}
.rgi{display:flex;flex-direction:column;gap:var(--sp-1)}
.rgi small{color:var(--muted)}
.cgl{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:6px;margin:6px 0}
.cgk{display:flex;gap:var(--sp-2);align-items:center;padding:6px var(--sp-2);border:1px solid var(--line);border-radius:var(--r-btn);cursor:pointer;color:var(--ink)}
.cgk input{width:auto}
.cgk small{margin-left:auto;color:var(--muted);text-align:right}

/* 5.7 Note vocale (was injected by note-vocale.js as #nvcss) */
#nvrec{font-size:var(--fs-lg);padding:var(--sp-3) var(--sp-5);min-width:190px;font-weight:600}
#nvrec.on{background:var(--danger);border-color:var(--danger);color:var(--surface)}
#nvdot{width:12px;height:12px;border-radius:50%;background:var(--danger);animation:nvp 1s infinite;margin-right:var(--sp-1)}
@keyframes nvp{50%{opacity:.25}}
#nvtime{font:700 var(--fs-2xl) var(--font-ui);font-variant-numeric:tabular-nums}
#nvint{color:var(--muted);font-style:italic;min-height:1.4em;margin:var(--sp-1) 0}
.nvrow{display:flex;gap:var(--sp-3);align-items:center;flex-wrap:wrap}
#nv textarea{line-height:1.5}

/* 5.8 Photos (was an inline <style> in index.html) */
#pho .phbar{display:flex;gap:var(--sp-2);flex-wrap:wrap;align-items:center}
#pho .phbar select{flex:1 1 260px;width:auto}
#pho .phday{margin:var(--sp-4) 0 6px;font:600 var(--fs-lg) var(--font-ui);display:flex;gap:var(--sp-2);align-items:baseline}
#pho .phday small{font:400 var(--fs-sm) var(--font-ui);color:var(--muted)}
#pho .phgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:var(--sp-2)}
#pho .phit{position:relative;aspect-ratio:1;border:1px solid var(--line);border-radius:var(--r-input);overflow:hidden;background:var(--ground);padding:0;cursor:pointer;display:block;width:100%}
#pho .phit img{width:100%;height:100%;object-fit:cover;display:block}
#pho .phit span{position:absolute;left:0;right:0;bottom:0;padding:3px 6px;font-size:11px;line-height:1.3;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.7));text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#pho .phit i{position:absolute;inset:0;display:grid;place-items:center;color:var(--muted);font-style:normal;font-size:var(--fs-xs)}
#phobox{position:fixed;inset:0;z-index:60;background:rgba(10,12,16,.92);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom))}
#phobox img{max-width:100%;max-height:calc(100% - 90px);object-fit:contain;border-radius:4px}
#phobox .phcap{color:#fff;margin:var(--sp-2) 0;text-align:center;font-size:var(--fs-md)}
#phobox .phnav{display:flex;gap:var(--sp-2);flex-wrap:wrap;justify-content:center}
#phobox .btn{background:#fff;color:#111;border-color:#fff}

/* 5.9 Création de plans (was an inline <style> in index.html) */
#ap .apbar{display:flex;gap:var(--sp-2);align-items:center;flex-wrap:wrap;margin-bottom:6px}
#ap .apbar b{font:700 var(--fs-xl)/1.1 var(--font-brand)}
#ap .apbar small{color:var(--muted);flex:1 1 200px}
#ap iframe{display:block;width:100%;height:calc(100dvh - 150px);min-height:520px;border:1px solid var(--line);border-radius:var(--r-card);background:var(--surface)}
#ap.apfull{position:fixed;inset:0;z-index:55;background:var(--ground);padding:6px max(10px,env(safe-area-inset-right,0px)) calc(6px + env(safe-area-inset-bottom,0px)) max(10px,env(safe-area-inset-left,0px))}
#ap.apfull iframe{height:calc(100dvh - 58px)}

/* 5.10 Quoter Plan */
#mp .mperr{color:var(--danger)}
#mp .hint{color:var(--muted)}
/* home */
#mp .mphero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:var(--sp-5);align-items:stretch;padding:var(--sp-5);margin-bottom:var(--sp-4);border:1px solid var(--line);border-radius:var(--r-card);background:var(--soft)}
#mp .mphero>div:first-child{background:var(--surface);padding:var(--sp-4);border-radius:var(--r-input);border:1px solid var(--line)}
#mp .mph{font:700 var(--fs-2xl)/1.1 var(--font-brand);letter-spacing:-.01em;margin:0 0 var(--sp-2)}
#mp .mphero p{margin:0;color:var(--muted);max-width:46ch}
#mp .mpact{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--sp-4)}
#mp .mpbig{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:var(--sp-1);padding:var(--sp-4) var(--sp-5);min-height:150px;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:var(--r-card);cursor:pointer;text-align:left;font:inherit;transition:border-color .12s,background .12s}
#mp .mpbig:hover{border-color:var(--line-strong)}
#mp .mpbig:first-child{background:var(--brand);border-color:var(--brand);color:var(--on-brand)}
#mp .mpbig:first-child:hover{background:var(--brand-hover)}
#mp .mpbig:first-child small{color:var(--on-brand);opacity:.85}
#mp .mpbi{margin-bottom:auto;color:var(--icon);display:block}
#mp .mpbig:first-child .mpbi{color:var(--on-brand)}
#mp .mpbig b{font:600 var(--fs-lg)/1.2 var(--font-ui)}
#mp .mpbig small{color:var(--muted);font-size:var(--fs-sm)}
#mp .mpl{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:6px 14px;align-items:center;padding:var(--sp-3) var(--sp-2);border-top:1px solid var(--line);cursor:pointer;border-radius:var(--r-btn)}
#mp .mpl:first-of-type{border-top:0}
#mp .mpl:hover,#mp .mpl:focus-visible{background:var(--soft)}
#mp .mpl-i{display:flex;flex-direction:column;min-width:0}
#mp .mpl-i b{font-size:var(--fs-lg)}
#mp .mpl-i small{color:var(--muted)}
#mp .mpl-d{color:var(--muted);font-size:var(--fs-sm);white-space:nowrap;font-variant-numeric:tabular-nums}
#mp .mpl-b{display:flex;gap:6px;flex-wrap:wrap}
/* project bar and ribbon */
#mp .mpbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
#mp .mpbar.mptop{gap:var(--sp-2);margin-bottom:6px}
#mp .mpname{font:700 var(--fs-xl)/1.2 var(--font-brand)}
#mp .mpbar.mptop .mpname{line-height:1.1;margin-right:6px}
#mp .mpsp{flex:1}
#mp .mprib{display:flex;flex-wrap:wrap;border:1px solid var(--line);background:var(--surface);border-radius:var(--r-input);margin-bottom:6px;position:relative}
#mp .mprg{display:flex;flex-direction:column;border-right:1px solid var(--line);padding:5px var(--sp-2)}
#mp .mprg:last-of-type{border-right:0}
#mp .mprb{display:flex;gap:2px;flex:1;align-items:stretch}
#mp .mprl{display:none}
/* tools: slate at rest, green when active */
#mp .mptl{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-1);min-width:52px;padding:3px var(--sp-1);border:1px solid transparent;border-radius:var(--r-input);background:transparent;color:var(--ink);font:500 11.5px/1.15 var(--font-ui);cursor:pointer;text-align:center}
#mp .mptl svg{width:34px;height:34px;padding:6px;box-sizing:border-box;border-radius:var(--r-input);background:var(--soft);color:var(--icon);transition:background .12s,color .12s}
#mp .mptl:hover:not(:disabled) svg{background:var(--line);color:var(--ink)}
#mp .mptl.on{border-color:var(--brand-line)}
#mp .mptl.on svg{background:var(--brand);color:var(--on-brand)}
#mp .mptl:disabled{opacity:.38;cursor:default}
#mp .mptl.warn svg{box-shadow:0 0 0 2px var(--danger)}
#mp .mptl[data-t="cut"] svg{outline:2px dashed currentColor;outline-offset:-3px}
#mp .mpar{font-size:15px;line-height:24px;color:var(--icon)}
#mp .mpnv{min-width:34px}
#mp .mppgl{min-width:50px;cursor:default}
#mp .mppgl input{width:58px;text-align:center;padding:3px var(--sp-1)}
#mp .mpfs{min-width:62px}
#mp .mpfs svg{color:var(--ink)}
#mp .mpgrp svg{vertical-align:middle;color:var(--icon);margin-right:2px}
/* undo / redo arrows: slate like the other tools */
#mp .mparr{width:40px;height:36px;border-radius:var(--r-input);border:0;cursor:pointer;display:inline-grid;place-items:center;background:var(--soft);color:var(--icon);transition:background .1s}
#mp .mparr svg{stroke-width:2.4}
#mp .mparr:hover:not(:disabled){background:var(--line);color:var(--ink)}
#mp .mparr:disabled{opacity:.45;cursor:default}
#mp .mppop{flex-basis:100%;display:flex;gap:var(--sp-5);padding:var(--sp-2) 14px;border-top:1px solid var(--line);align-items:center;flex-wrap:wrap}
#mp .mppop label{display:flex;gap:10px;align-items:center;color:var(--ink)}
#mp .mppop input[type=range]{width:160px}
#mp .mpopr{display:flex;gap:var(--sp-2);flex-wrap:wrap;align-items:center;margin-bottom:var(--sp-2)}
#mp .mpseg{display:inline-flex;border:1px solid var(--line);border-radius:var(--r-btn);overflow:hidden}
#mp .mpseg button{border:0;background:var(--surface);color:var(--ink);font:inherit;padding:5px var(--sp-3);cursor:pointer}
#mp .mpseg button.on{background:var(--chip);color:var(--chip-text)}
#mp .mpsw{border:1px solid var(--line);background:var(--surface);color:var(--ink);font:inherit;padding:5px var(--sp-3);border-radius:var(--r-btn);cursor:pointer}
#mp .mpsw.on{border-color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand)}
#mp .mpchip{display:inline-flex;gap:7px;align-items:center;padding:var(--sp-1) var(--sp-3);border:1px solid var(--line);border-radius:var(--r-pill);background:var(--surface)}
#mp .mpchip i{width:12px;height:12px;border-radius:3px;display:inline-block}
#mp .mpchip.mpcutchip{background:var(--danger);color:var(--surface);border-color:var(--danger);font-weight:700}
#mp .mpchip.mpcutchip i{box-shadow:0 0 0 2px #fff}
#mp .mpcal{background:var(--soft);border-left:3px solid var(--brand);padding:var(--sp-2) var(--sp-3);border-radius:var(--r-btn);display:flex;gap:var(--sp-2);align-items:center;flex-wrap:wrap;margin-bottom:var(--sp-2)}
#mp .mpwarn{background:var(--warn-soft);color:var(--warn);border-left:3px solid var(--warn);padding:var(--sp-2) var(--sp-3);border-radius:var(--r-btn);font-size:var(--fs-sm);margin-bottom:var(--sp-2);display:flex;gap:10px;align-items:center;flex-wrap:wrap}
/* plan */
#mp .mpmain{display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:var(--sp-3);align-items:start}
#mp .mpmain.noside{grid-template-columns:minmax(0,1fr)}
#mp .mpmain.noside .mpside{display:none}
#mp .mpstage{background:var(--mp-stage);overflow:auto;height:calc(100dvh - 400px);min-height:440px;border:1px solid var(--line);border-radius:var(--r-input) var(--r-input) 0 0;position:relative;overscroll-behavior:contain;user-select:none;-webkit-user-select:none}
#mp .mpstage.grab{cursor:grabbing}
#mp .mppage{position:relative;margin:var(--sp-3) auto;background:#fff;box-shadow:0 2px 12px rgba(0,0,0,.35)}
#mp .mppage canvas{display:block}
#mp .mppage svg{position:absolute;left:0;top:0;touch-action:none}
#mp .mpcol{min-width:0;position:relative}
#mp .mplive{background:var(--surface);color:var(--ink);padding:7px var(--sp-3) 7px 116px;border:1px solid var(--line);border-top:0;border-radius:0 0 var(--r-input) var(--r-input);font-size:var(--fs-sm);min-height:32px}
#mp .mpdz{margin:var(--sp-5);padding:36px 20px;border:2px dashed var(--brand-line);border-radius:var(--r-card);text-align:center;background:var(--surface);color:var(--ink)}
#mp .mpdz.ov{background:var(--brand-tint);border-style:solid}
#mp .mpdi{color:var(--icon);margin-bottom:6px}
#mp .mpx{padding:2px 5px;margin-left:var(--sp-2);color:var(--danger);border-color:transparent;background:transparent;vertical-align:middle;font-size:var(--fs-lg)}
#mp .mpx:hover{background:var(--danger-soft);border-color:var(--danger)}
#mppick{position:absolute;left:14px;top:14px;z-index:8}
#mppick:empty{display:none}
/* SVG overlay */
#mpsvg.draw{cursor:crosshair}
#mpsvg.erase{cursor:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='26' height='26'><circle cx='13' cy='13' r='10' fill='white' fill-opacity='.5' stroke='black' stroke-width='2'/></svg>") 13 13,cell}
#mpsvg.pan{cursor:grab}
#mpsvg.ptr{cursor:default}
#mpsvg .sh{pointer-events:none}
#mpsvg.ptr .sh{pointer-events:all;cursor:pointer}
#mpsvg .sh.sel{filter:drop-shadow(0 0 3px var(--brand))}
#mpsvg .mV{fill:#fff;stroke:var(--brand);stroke-width:2;cursor:move;pointer-events:all}
#mpsvg .mpleg{pointer-events:none}
#mpsvg.ptr .mpleg{pointer-events:all;cursor:move}
#mpsvg .mD{fill:#fff;stroke:#d9480f;stroke-width:1.5}
#mpsvg .mCal{stroke:#7048e8;stroke-width:2;stroke-dasharray:6 4;fill:none}
#mpsvg .mH{fill:none;stroke:var(--brand);stroke-width:1.5;pointer-events:none}
#mpsvg .mH.s{stroke:var(--brand-hover);stroke-width:3}
#mpsvg .mT{font:600 12px var(--font-ui);fill:#111;stroke:#fff;stroke-width:3px;paint-order:stroke;pointer-events:none}
#mpprev{pointer-events:none}
#mp .mGd{stroke:#7048e8;stroke-opacity:.22;stroke-width:1.2;stroke-dasharray:6 6;pointer-events:none;vector-effect:non-scaling-stroke}
#mp .mGd.on{stroke:#2f9e44;stroke-opacity:.85;stroke-width:2;stroke-dasharray:none}
#mp .mTs{font-size:11.5px;font-weight:700;paint-order:stroke;stroke:#fff;stroke-width:3.5px;stroke-linejoin:round;pointer-events:none}
/* groups panel */
#mp .mpside{min-width:0}
#mp .mpcard{padding:var(--sp-3);margin-bottom:var(--sp-3)}
#mp .mpcard .ch{justify-content:space-between}
#mp .mpcard .ch small{font:600 var(--fs-xs) var(--font-ui);color:var(--muted)}
#mp .mplay{font-weight:600;color:var(--muted);padding:var(--sp-1) 2px 6px;cursor:pointer;user-select:none}
#mp .mpr{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;gap:var(--sp-1) var(--sp-2);align-items:center;padding:7px var(--sp-1);border-top:1px solid var(--line);cursor:pointer;border-radius:var(--r-btn)}
#mp .mpr:hover{background:var(--soft)}
#mp .mpr.sel{background:var(--brand-tint)}
#mp .mpr.off{opacity:.55}
#mp .mpr input[type=checkbox]{width:auto}
#mp .mpri{display:grid;place-items:center}
#mp .mpr-i{display:flex;flex-direction:column;min-width:0}
#mp .mpr-i b{overflow:hidden;text-overflow:ellipsis}
#mp .mpr-i small{color:var(--muted)}
#mp .mpr-v{display:flex;align-items:center;gap:2px;font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums}
#mp .mpr-v .mpx{padding:3px 6px;border-radius:6px;font-weight:700}
#mp .mpr-g{grid-column:1/-1;display:flex;flex-wrap:nowrap;gap:3px;justify-content:flex-start;margin-top:6px}
#mp .mpr-g .mpib{display:inline-flex;align-items:center;gap:3px;padding:var(--sp-1) 6px var(--sp-1) var(--sp-1);border:0;border-radius:var(--r-btn);font-size:11px;white-space:nowrap;cursor:pointer;color:var(--ink);background:var(--soft)}
#mp .mpr-g .mpib svg{flex:none;width:16px;height:16px;color:var(--icon)}
#mp .mpr-g .mpib:hover{background:var(--line)}
#mp .mpr-g .mpg-snd{background:var(--brand);color:var(--on-brand)}
#mp .mpr-g .mpg-snd svg{color:var(--on-brand)}
#mp .mpr-g .mpg-snd:hover{background:var(--brand-hover)}
#mp .mpib{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:var(--r-btn);padding:3px 7px;cursor:pointer;display:inline-grid;place-items:center}
#mp .mpib:hover{background:var(--soft)}
#mp .mptot{width:100%;min-width:0}
#mp .mptot td{padding:5px var(--sp-1);border-top:1px solid var(--line);border-bottom:0;vertical-align:top}
#mp .mptot tr:first-child td{border-top:0}
/* page grid */
#mp .mpgh{display:flex;gap:var(--sp-3);align-items:center;flex-wrap:wrap;margin-bottom:var(--sp-3)}
#mp .mpgh .hint{flex:1 1 240px}
#mp .mpgg{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:var(--sp-4)}
#mp .mpgc{border:2px solid var(--line);border-radius:var(--r-card);background:var(--surface);padding:var(--sp-2);cursor:pointer;display:flex;flex-direction:column;gap:6px}
#mp .mpgc:hover{border-color:var(--line-strong)}
#mp .mpgc.cur{border-color:var(--brand)}
#mp .mpgc.ex{opacity:.45}
#mp .mpgt{aspect-ratio:4/3;background:#fff;display:grid;place-items:center;overflow:hidden;border:1px solid var(--line)}
#mp .mpgt img{max-width:100%;max-height:100%;display:block}
#mp .mpgl{display:flex;justify-content:space-between;gap:6px;align-items:center;flex-wrap:wrap}
#mp .mpgl small{color:var(--muted)}
#mp .mpgp{grid-column:1/-1;font:600 var(--fs-md) var(--font-ui);color:var(--ink);padding:6px 2px;border-bottom:1px solid var(--line)}
#mp .mppl{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:10px 0;border-top:1px solid var(--line)}
#mp .mpcfh{font-weight:600;margin:10px 0 var(--sp-1);color:var(--muted);font-size:var(--fs-xs);letter-spacing:.3px}
/* modals */
#mp .mpmw{position:fixed;inset:0;z-index:80;background:var(--overlay);display:grid;place-items:center;padding:var(--sp-4);overflow:auto}
#mp .mpmd{background:var(--surface);color:var(--ink);width:100%;border-radius:var(--r-card);box-shadow:var(--shadow-modal);max-height:calc(100dvh - 32px);display:flex;flex-direction:column}
#mp .mpmd h3{margin:0;padding:var(--sp-4) var(--sp-5) 10px;font:700 var(--fs-xl)/1.2 var(--font-brand)}
#mp .mpmb{padding:var(--sp-1) var(--sp-5) var(--sp-3);overflow:auto}
#mp .mpmb textarea{min-height:90px}
#mp .mpmf{display:flex;justify-content:flex-end;gap:var(--sp-2);padding:var(--sp-3) var(--sp-5);border-top:1px solid var(--line);background:var(--soft);border-radius:0 0 var(--r-card) var(--r-card)}
#mp .mpfg{display:flex;flex-direction:column;gap:10px}
#mp .mpf3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
#mp .req:after{content:" *";color:var(--danger)}
#mp .mpck{display:flex;gap:var(--sp-2);align-items:center;color:var(--ink)}
#mp .mpck input{width:auto}
#mp .mpcalbox{display:flex;gap:var(--sp-3);align-items:center;justify-content:space-between;flex-wrap:wrap;margin-top:14px;padding:10px var(--sp-3);background:var(--soft);border-radius:var(--r-btn);color:var(--muted)}
#mp .mppr{display:grid;grid-template-columns:minmax(0,1fr) 170px;gap:18px;align-items:start}
#mp .mpcr{display:flex;gap:var(--sp-2)}
#mp .mpcr input[type=color]{width:44px;padding:2px;height:34px}
#mp .mpprev{border:1px solid var(--line);background:#fff;border-radius:var(--r-btn);padding:10px;display:flex;flex-direction:column;align-items:center;gap:var(--sp-1);color:#111}
/* file menu and group picker */
#mp .mpfile{position:relative;display:inline-block}
#mp .mpfm{position:absolute;left:0;top:calc(100% + 4px);z-index:30;min-width:210px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-input);box-shadow:var(--shadow-pop);padding:var(--sp-1);display:flex;flex-direction:column}
#mp .mpfm[hidden]{display:none}
#mp .mpfm button{display:flex;align-items:center;gap:10px;text-align:left;border:0;background:transparent;color:var(--ink);font:inherit;padding:9px var(--sp-3);border-radius:var(--r-btn);cursor:pointer}
#mp .mpfm button:hover{background:var(--soft)}
#mp .mpfm button svg{flex:none;color:var(--icon)}
.mppicker{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:var(--r-input);box-shadow:var(--shadow-pop);padding:var(--sp-2);min-width:250px;max-width:340px;display:flex;flex-direction:column;gap:var(--sp-1)}
.mppk-h{display:flex;justify-content:space-between;align-items:center;padding:0 var(--sp-1) var(--sp-1)}
.mppk{display:flex;gap:10px;align-items:center;text-align:left;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:var(--r-btn);padding:7px 9px;font:inherit;cursor:pointer}
.mppk:hover{background:var(--soft)}
.mppk.cur{border-color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand)}
.mppk i{width:18px;height:18px;border-radius:50%;flex:none;border:2px solid rgba(255,255,255,.8);box-shadow:0 0 0 1px rgba(0,0,0,.25)}
.mppk span{display:flex;flex-direction:column;min-width:0}
.mppk .mppk-p{width:18px;height:18px;border-radius:50%;background:var(--soft);display:inline-grid;place-items:center;flex:none;font-weight:700}
.mppk small{color:var(--muted)}
.mppk.new{border-style:dashed}
/* marker */
#mp .mpmk{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:6px var(--sp-2);margin:6px 0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-input)}
#mp .mpmk-l{font-weight:600;color:var(--muted);font-size:var(--fs-xs)}
#mp .mpsw2{width:26px;height:26px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.3);cursor:pointer;padding:0}
#mp .mpsw2.on{box-shadow:0 0 0 3px var(--ink)}
#mp .mpst{display:flex;flex-direction:column;align-items:center;gap:0;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:var(--r-btn);padding:3px 6px 2px;cursor:pointer;font:inherit;font-size:11px}
#mp .mpst.on{border-color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand);background:var(--brand-tint)}
#mp .mpmkw{width:120px}
#mp .mpmkv{min-width:28px;font-size:var(--fs-xs)}
#mp .mppitch{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:var(--r-pill);background:var(--danger);color:var(--surface);font-size:11px;font-weight:700;vertical-align:1px;white-space:nowrap}
/* send to quote */
#mp .mpsnd{display:flex;align-items:center;gap:10px;padding:var(--sp-2) 6px;border-bottom:1px solid var(--line);cursor:pointer}
#mp label.mpsnd{flex-direction:row;text-align:left}
#mp .mpsnd i{width:14px;height:14px;border-radius:50%;flex:none}
#mp .mpsnd span{display:block;flex:1;min-width:0;text-align:left}
#mp .mpsnd em{flex:none;font-style:normal;font-weight:700;white-space:nowrap}
#mp .mpsnd input[type=checkbox]{width:18px;height:18px;flex:none;margin:0;padding:0}
/* full screen */
#mp.mpfull{position:fixed;inset:0;z-index:55;background:var(--ground);overflow:auto;overscroll-behavior:contain;padding:var(--sp-2) 14px calc(8px + env(safe-area-inset-bottom,0px))}
#mp.mpfull .mpbar{margin-bottom:6px}
#mp.mpfull .mprib{margin-bottom:6px}
#mp.mpfull .mprg{padding:var(--sp-1) 6px 2px}
#mp.mpfull .mptl:not(.mppgl){min-width:52px;padding:3px 2px}
#mp.mpfull .mptl:not(.mppgl) span{display:block;font-size:11px;line-height:1.1;max-width:90px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#mp.mpfull .mpopr,#mp.mpfull .mpwarn,#mp.mpfull .mpcal{margin-bottom:var(--sp-1)}
/* plan max */
#mp.mpmax{padding:3px var(--sp-1) calc(3px + env(safe-area-inset-bottom,0px))}
#mp.mpmax .mptop,#mp.mpmax #mpopt .mpwarn,#mp.mpmax .mpside{display:none}
#mp.mpmax .mprib{margin-bottom:3px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin}
#mp.mpmax .mprg{padding:2px 3px 1px;flex:0 0 auto}
#mp.mpmax .mptl:not(.mppgl){min-width:44px;padding:2px}
#mp.mpmax .mptl:not(.mppgl) span{font-size:10.5px;max-width:64px}
#mp.mpmax .mptl svg{width:30px;height:30px;padding:5px}
#mp.mpmax .mpnv{min-width:24px}
#mp.mpmax .mpmain,#mp.mpmax .mpmain.noside{grid-template-columns:minmax(0,1fr);gap:0}
#mp.mpmax .mpstage{border-radius:3px 3px 0 0;min-height:0}
#mp.mpmax .mplive{padding:2px 10px;min-height:20px;font-size:var(--fs-xs)}
@media (max-width:1000px){
  #mp .mpmain{grid-template-columns:minmax(0,1fr)}
  #mp .mpstage{height:70dvh}
}
@media (max-width:820px){#mp .mphero{grid-template-columns:minmax(0,1fr);padding:14px}}
@media (max-width:760px){
  #mp .mprib{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch}
  #mp .mprg{flex:0 0 auto}
}
@media (max-width:640px){#mp .mpl{grid-template-columns:minmax(0,1fr)}}
@media (max-width:600px){#mp .mplive{padding-left:var(--sp-3)}}
@media (max-width:560px){
  #mp .mpact,#mp .mpf3,#mp .mppr{grid-template-columns:minmax(0,1fr)}
}

/* 5.11 PDF Note */
#pn{--pa:var(--brand)}  /* alias read by an inline style in pdf-note.js */
#pn:not(.hide){position:fixed;inset:0;z-index:55;display:block;background:var(--ground);color:var(--ink);font:var(--fs-sm)/1.35 var(--font-ui)}
#pn button{font:inherit;color:inherit;cursor:pointer}
#pn .pnw{position:absolute;inset:0;display:flex;flex-direction:column;padding-bottom:env(safe-area-inset-bottom,0px)}
#pn .pni{display:block;flex:none}
/* title bar and document tabs */
#pn .pnt{display:flex;align-items:center;gap:6px;height:46px;padding:0 10px;background:var(--surface);border-bottom:1px solid var(--line);flex:none;padding-top:env(safe-area-inset-top,0px);box-sizing:content-box}
#pn .pnsp{flex:1}
#pn .pnib{display:inline-flex;align-items:center;gap:5px;height:34px;padding:0 10px;border:1px solid var(--line);background:var(--surface);border-radius:var(--r-btn);white-space:nowrap}
#pn .pnib:hover:not(:disabled){background:var(--soft)}
#pn .pnib.sq{width:36px;padding:0;justify-content:center;border-color:transparent;background:transparent;color:var(--icon)}
#pn .pnib:disabled{opacity:.35;cursor:default}
#pn .pnbrand{display:flex;align-items:center;gap:7px;padding:0 var(--sp-2);cursor:pointer;font-size:15px;white-space:nowrap}
#pn .pndt{display:flex;gap:3px;align-items:flex-end;align-self:stretch;overflow-x:auto;scrollbar-width:none;min-width:0;padding-top:var(--sp-2)}
#pn .pndtab{display:flex;align-items:center;gap:6px;max-width:210px;padding:0 6px 0 var(--sp-3);height:100%;border:1px solid var(--line);border-bottom:0;border-radius:var(--r-btn) var(--r-btn) 0 0;background:var(--soft);cursor:pointer;color:var(--muted)}
#pn .pndtab span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#pn .pndtab.on{background:var(--ground);color:var(--ink);font-weight:600}
#pn .pndtab i{display:grid;place-items:center;width:20px;height:20px;border-radius:5px;font-style:normal}
#pn .pndtab i:hover{background:var(--line)}
#pn .pnplus{flex:none;width:30px;height:30px;margin-bottom:var(--sp-1);border:0;background:transparent;border-radius:var(--r-btn);display:grid;place-items:center}
#pn .pnplus:hover{background:var(--soft)}
#pn .pnsv{font-size:var(--fs-xs);color:var(--muted);white-space:nowrap;padding-right:6px}
#pn .pnb1{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 14px;border:0;border-radius:var(--r-btn);background:var(--brand);color:var(--on-brand);font-weight:600;white-space:nowrap}
#pn .pnb1:hover{background:var(--brand-hover)}
#pn .pnb1:disabled{opacity:.4}
#pn .pnb2{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 11px;border:1px solid var(--line);border-radius:var(--r-btn);background:var(--surface)}
#pn .pnb2:hover{background:var(--soft)}
#pn .pnb2.danger{color:var(--danger)}
/* ribbon tabs */
#pn .pnrb{background:var(--surface);border-bottom:1px solid var(--line);flex:none}
#pn .pntabs{display:flex;align-items:center;gap:2px;padding:0 var(--sp-2);overflow-x:auto;scrollbar-width:none}
#pn .pntabs>button:not(.pnhide){border:0;background:transparent;padding:var(--sp-2) 13px 7px;border-bottom:2px solid transparent;color:var(--muted);font-weight:500;white-space:nowrap}
#pn .pntabs>button.on{color:var(--ink);border-bottom-color:var(--brand);font-weight:600}
#pn .pnhide{border:0;background:transparent;color:var(--muted);padding:var(--sp-1) var(--sp-2)}
/* ribbon tools: slate at rest, green when active */
#pn .pngr{display:flex;gap:0;padding:6px var(--sp-2) 7px;overflow-x:auto;scrollbar-width:thin;align-items:stretch}
#pn .pngr.dis .pnbt{opacity:.4}
#pn .pngr.dis .pnbt.nd{opacity:1}
#pn .pngrp{display:flex;gap:2px;padding:0 10px;border-right:1px solid var(--line)}
#pn .pngrp:last-child{border-right:0}
#pn .pnbt{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-1);min-width:62px;padding:6px 6px 5px;border:0;background:transparent;border-radius:var(--r-input);font-size:11px;line-height:1.1;white-space:nowrap}
#pn .pnbt span{font-weight:600}
#pn .pnbt .pni{width:36px;height:36px;padding:7px;box-sizing:border-box;border-radius:var(--r-input);color:var(--icon);background:var(--soft);transition:background .12s,color .12s}
#pn .pnbt:hover:not(:disabled) .pni{background:var(--line);color:var(--ink)}
#pn .pnbt.on{background:var(--brand-tint);color:var(--ink)}
#pn .pnbt.on .pni{background:var(--brand);color:var(--on-brand)}
/* properties bar */
#pn .pnpr{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;padding:6px var(--sp-3);min-height:50px;background:var(--brand-tint);border-bottom:1px solid var(--line);flex:none}
#pn .pnpr.off,#pn .off{display:none}
#pn .pntit{display:flex;align-items:center;gap:7px;color:var(--brand-text)}
#pn .pngp{display:flex;align-items:center;gap:7px}
#pn .pngp.end{margin-left:auto}
#pn .pngp>label{font-size:11px;color:var(--muted);white-space:nowrap}
#pn .pnsw{display:flex;gap:var(--sp-1);align-items:center}
#pn .pnsc1,#pn .pnsx{width:24px;height:24px;border-radius:50%;border:2px solid var(--surface);box-shadow:0 0 0 1px var(--line);padding:0;display:inline-block;position:relative}
#pn .pnsx{background:var(--surface);font-size:var(--fs-sm);line-height:20px;color:var(--muted)}
#pn .pnsc1.on,#pn .pnsx.on{box-shadow:0 0 0 2px var(--brand)}
#pn .pnpick{background:conic-gradient(red,yellow,lime,cyan,blue,magenta,red);overflow:hidden}
#pn .pnpick input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
#pn .pnws{display:flex;gap:3px}
#pn .pnwc{width:30px;height:26px;border:1px solid var(--line);border-radius:var(--r-btn);background:var(--surface);display:grid;place-items:center;padding:0}
#pn .pnwc i{display:block;width:18px;background:var(--ink);border-radius:2px}
#pn .pnwc.on{border-color:var(--brand);background:var(--brand-tint);box-shadow:inset 0 0 0 1px var(--brand)}
#pn .pnseg{display:inline-flex;border:1px solid var(--line);border-radius:var(--r-btn);overflow:hidden}
#pn .pnseg button{border:0;background:var(--surface);padding:var(--sp-1) 9px;min-width:30px;height:28px;border-right:1px solid var(--line)}
#pn .pnseg button:last-child{border-right:0}
#pn .pnseg button.on{background:var(--brand);color:var(--on-brand)}
#pn .pnrg{width:110px;accent-color:var(--brand)}
#pn .pnv1{font-size:var(--fs-xs);min-width:34px}
#pn select,#pn .pnin{height:30px;border:1px solid var(--line-strong);border-radius:var(--r-input);background:var(--surface);color:var(--ink);padding:0 7px;font:inherit;max-width:100%}
#pn .pnin:focus,#pn select:focus{outline:0;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-ring)}
#pn .pnfavs{display:flex;gap:var(--sp-1)}
#pn .pnfav{display:flex;align-items:center;gap:3px;border:1px solid var(--line);border-radius:var(--r-btn);background:var(--surface);padding:3px 6px}
#pn .pnfav span{width:10px;height:10px;border-radius:50%}
/* body: thumbnails, pages, side panel */
#pn .pnbd{flex:1;display:flex;min-height:0}
#pn .pnlt{width:156px;flex:none;background:var(--surface);border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0}
#pn .pnlt.off,#pn .pnrt.off{display:none}
#pn .pnlh{display:flex;justify-content:space-between;padding:var(--sp-2) var(--sp-3);font-size:var(--fs-xs);border-bottom:1px solid var(--line);color:var(--muted)}
#pn .pnlist{flex:1;overflow:auto;padding:10px var(--sp-2);display:flex;flex-direction:column;align-items:center;gap:var(--sp-3)}
#pn .pnth{display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px;border-radius:var(--r-input);cursor:pointer;border:2px solid transparent;position:relative;font-size:11px;color:var(--muted)}
#pn .pnth.cur{border-color:var(--brand)}
#pn .pnth.sel{background:var(--brand-tint);border-color:var(--brand-line)}
#pn .pnth.dropb::before,#pn .pnth.dropa::after{content:"";position:absolute;left:0;right:0;height:4px;background:var(--brand);border-radius:2px}
#pn .pnth.dropb::before{top:-8px}
#pn .pnth.dropa::after{bottom:-8px}
#pn .pntc{position:relative;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.3);overflow:hidden}
#pn .pntc canvas{display:block;width:100%;height:100%}
#pn .pndot{position:absolute;right:4px;top:4px;width:9px;height:9px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 2px #fff}
#pn .pnmain{position:relative;flex:1;min-width:0;display:flex}
#pn .pnsc{flex:1;overflow:auto;position:relative;padding:20px 18px 80px;overscroll-behavior:contain;background:var(--ground);outline:0}
#pn .pnsc[data-tool=hand]{cursor:grab}
#pn .pnsc.pan{cursor:grabbing}
#pn .pnsc[data-tool=sel]{cursor:default}
#pn .pnsc.drawing{cursor:crosshair;touch-action:none}
#pn .pnsc[data-tool=zoomr]{cursor:zoom-in;touch-action:none}
#pn .pnpgs{display:flex;flex-direction:column;align-items:center;gap:var(--sp-4);width:max-content;min-width:100%}
#pn .pnpgs.two{display:grid;grid-template-columns:repeat(2,max-content);justify-content:center;column-gap:10px}
#pn .pnpg{position:relative;flex:none;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.28),0 8px 22px rgba(0,0,0,.16)}
#pn .pnv{position:absolute;inset:0;overflow:hidden}
#pn .pnv canvas{position:absolute;display:block;background:#fff}
#pn .pna{position:absolute;left:0;top:0;display:block;user-select:none;-webkit-user-select:none}
#pn .pna .an{cursor:inherit}
#pn .pnsc[data-tool=sel] .an{cursor:move}
#pn .pnnum{position:absolute;left:100%;top:6px;margin-left:var(--sp-2);font-size:11px;color:var(--muted)}
#pn .pnmode{position:absolute;top:10px;left:50%;transform:translateX(-50%);z-index:4;display:flex;gap:2px;padding:3px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-input);box-shadow:var(--shadow-pop)}
#pn .pnmode button{display:flex;align-items:center;gap:6px;border:0;background:transparent;border-radius:var(--r-btn);padding:6px var(--sp-3);white-space:nowrap}
#pn .pnmode button.on{background:var(--brand-tint);color:var(--brand-text);font-weight:600}
#pn .pnrt{width:312px;flex:none;background:var(--surface);border-left:1px solid var(--line);display:flex;flex-direction:column;min-height:0}
#pn .pnrtab{display:flex;border-bottom:1px solid var(--line)}
#pn .pnrtab button{flex:1;border:0;background:transparent;padding:10px var(--sp-1);border-bottom:2px solid transparent;color:var(--muted)}
#pn .pnrtab button.on{color:var(--ink);border-bottom-color:var(--brand);font-weight:600}
#pn .pnflt{display:grid;gap:6px;padding:var(--sp-2);border-bottom:1px solid var(--line)}
#pn .pnflt select,#pn .pnflt .pnin{width:100%}
#pn .pnsr{display:flex;gap:6px}
#pn .pnsr .pnin{flex:1}
#pn .pnmk{flex:1;overflow:auto;min-height:0}
#pn .pnmr{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) 10px;border-bottom:1px solid var(--line);cursor:pointer}
#pn .pnmr:hover{background:var(--soft)}
#pn .pnmr.on{background:var(--brand-tint);box-shadow:inset 3px 0 0 var(--brand)}
#pn .pnmt{flex:1;min-width:0;font-size:var(--fs-xs)}
#pn .pnmt div{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#pn .pnmt em{font-style:normal;color:var(--brand-text);font-weight:600;margin-left:var(--sp-1)}
#pn .pnmt i{color:var(--muted);font-style:normal}
#pn .pnmr select{width:92px;height:26px;font-size:11px;padding:0 2px}
#pn .pnrfoot{display:flex;gap:6px;flex-wrap:wrap;align-items:center;padding:var(--sp-2);border-top:1px solid var(--line)}
#pn .pnmut{color:var(--muted)}
#pn .pad{padding:14px var(--sp-3)}
#pn .pnscl{padding:2px;font-size:var(--fs-xs)}
#pn .pnlk{border:0;background:transparent;color:var(--brand-text);padding:0 var(--sp-1);text-decoration:underline;cursor:pointer;font-size:var(--fs-xs)}
#pn .pntb{width:100%;min-width:0;border-collapse:collapse;font-size:var(--fs-xs)}
#pn .pntb th{text-align:left;color:var(--muted);font-weight:500;padding:6px 10px;border-bottom:1px solid var(--line)}
#pn .pntb td{padding:7px 10px;border-bottom:1px solid var(--line)}
#pn .pndotc{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;vertical-align:middle}
/* status bar and toast */
#pn .pnsb{display:flex;align-items:center;gap:14px;height:28px;padding:0 var(--sp-3);background:var(--surface);border-top:1px solid var(--line);font-size:var(--fs-xs);color:var(--muted);flex:none}
#pn .pnzm{display:inline-flex;align-items:center;gap:6px}
#pn .pnzm button{border:1px solid var(--line);background:var(--surface);border-radius:6px;width:22px;height:20px;line-height:1;padding:0}
#pn .pnst{position:absolute;left:50%;bottom:44px;transform:translate(-50%,10px);max-width:min(560px,92vw);background:var(--sidebar);color:#fff;padding:9px var(--sp-4);border-radius:var(--r-input);font-size:var(--fs-sm);opacity:0;pointer-events:none;transition:.2s;z-index:30;text-align:center}
#pn .pnst.on{opacity:1;transform:translate(-50%,0)}
/* modals, forms, context menu */
#pn .pnmd{position:absolute;inset:0;z-index:40;background:var(--overlay);display:none;align-items:center;justify-content:center;padding:var(--sp-4)}
#pn .pnmd.on{display:flex}
#pn .pnmc{background:var(--surface);border-radius:var(--r-card);padding:20px 22px;width:100%;max-height:92vh;overflow:auto;box-shadow:var(--shadow-modal)}
#pn .pnmc h3{margin:0 0 10px;font-size:var(--fs-lg);font-weight:600}
#pn .pnbtns{display:flex;justify-content:flex-end;gap:var(--sp-2);margin-top:var(--sp-4);flex-wrap:wrap}
#pn .pnform{display:grid;gap:10px;margin-top:6px}
#pn .pn2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
#pn .pnfl{display:grid;gap:var(--sp-1)}
#pn .pnfl>span{font-size:var(--fs-xs);color:var(--muted)}
#pn .pnfl select,#pn .pnfl .pnin{width:100%;height:34px}
#pn .pncol{width:60px;height:34px;padding:2px;border:1px solid var(--line);border-radius:var(--r-btn);background:var(--surface)}
#pn .pnsec{display:grid;gap:var(--sp-2);padding:10px;border:1px solid var(--line);border-radius:var(--r-input)}
#pn .pnck{display:flex;align-items:center;gap:var(--sp-2);padding:3px 0}
#pn .pnsl{max-height:240px;overflow:auto;margin:10px 0;border:1px solid var(--line);border-radius:var(--r-input);padding:var(--sp-1) 10px}
#pn .pnsl .pnck em{margin-left:auto;font-style:normal;color:var(--muted)}
#pn .pnsgc{width:100%;height:auto;background:#fff;border:1px dashed var(--line);border-radius:var(--r-input);touch-action:none;cursor:crosshair}
#pn .pnmt1{margin-bottom:10px}
#pn .pncf{max-height:50vh;overflow:auto}
#pn .pncfg{margin-bottom:10px}
#pn .pncfi{display:flex;align-items:center;gap:var(--sp-2);width:100%;text-align:left;padding:var(--sp-2) 10px;border:1px solid var(--line);border-radius:var(--r-btn);background:var(--surface);margin-top:var(--sp-1)}
#pn .pncfi:hover{background:var(--soft)}
#pn .pncfi span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#pn .pncfi em{color:var(--muted);font-style:normal;font-size:var(--fs-xs)}
#pn .pnta{position:absolute;z-index:6;border:1.5px dashed var(--brand);outline:0;resize:none;overflow:hidden;margin:0;border-radius:2px;color:#111}
#pn .pnctx{position:fixed;z-index:50;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-input);box-shadow:var(--shadow-pop);padding:var(--sp-1);display:grid;min-width:150px}
#pn .pnctx button{border:0;background:transparent;text-align:left;padding:var(--sp-2) var(--sp-3);border-radius:var(--r-btn)}
#pn .pnctx button:hover{background:var(--soft)}
#pn .pncropbar{position:absolute;top:56px;left:50%;transform:translateX(-50%);z-index:5;display:flex;align-items:center;gap:var(--sp-2);padding:6px 10px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-input);box-shadow:var(--shadow-pop)}
/* max mode */
#pn .pnexit{display:none}
#pn.pnmax .pnt,#pn.pnmax .pnrb,#pn.pnmax .pnpr,#pn.pnmax .pnlt,#pn.pnmax .pnrt,#pn.pnmax .pnsb{display:none}
#pn.pnmax .pnexit{display:grid;place-items:center;position:absolute;top:10px;right:var(--sp-3);z-index:9;width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:var(--surface)}
/* home */
#pn .pnhome{max-width:1080px;margin:0 auto;padding:var(--sp-5) 18px 60px}
#pn .pnhh h1{margin:0 0 6px;font-size:var(--fs-2xl);font-weight:700;letter-spacing:-.01em}
#pn .pnhh p{margin:0 0 var(--sp-5);color:var(--muted);max-width:60ch}
#pn .pntiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:var(--sp-3)}
#pn .pntile{display:flex;flex-direction:column;align-items:flex-start;gap:5px;padding:var(--sp-4);border:1px solid var(--line);border-radius:var(--r-card);background:var(--surface);text-align:left;min-height:118px}
#pn .pntile:hover{border-color:var(--line-strong)}
#pn .pntile .pni{width:48px;height:48px;padding:11px;box-sizing:border-box;border-radius:var(--r-input);color:var(--icon);background:var(--soft)}
#pn .pntile b{font-size:var(--fs-md);font-weight:600;margin-top:6px}
#pn .pntile span{color:var(--muted);font-size:var(--fs-xs)}
#pn .pnhome h2{margin:var(--sp-6) 0 var(--sp-3);font-size:var(--fs-lg);font-weight:600}
#pn .pnrec{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
#pn .pnrc{position:relative}
#pn .pnrec>.pnmut{grid-column:1/-1}
#pn .pnrcb{display:flex;flex-direction:column;gap:5px;width:100%;border:1px solid var(--line);border-radius:var(--r-card);background:var(--surface);padding:10px;text-align:left}
#pn .pnrcb:hover{border-color:var(--line-strong)}
#pn .pnrcb img,#pn .pnrph{width:100%;aspect-ratio:3/4;object-fit:contain;background:#fff;border-radius:6px;display:grid;place-items:center;color:var(--muted);box-shadow:0 1px 3px rgba(0,0,0,.2)}
#pn .pnrcb b{font-size:var(--fs-sm);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#pn .pnrcb span{font-size:11px;color:var(--muted)}
#pn .pnrx{position:absolute;right:6px;top:6px;z-index:2;width:24px;height:24px;border-radius:50%;border:1px solid var(--line);background:var(--surface);display:none;place-items:center;padding:0}
#pn .pnrc:hover .pnrx{display:grid}
@media (hover:none){#pn .pnrx{display:grid}}
@media (max-width:900px){
  #pn .pnbd{position:relative}
  #pn .pnrt{position:absolute;right:0;top:0;bottom:0;z-index:7;box-shadow:-8px 0 24px rgba(0,0,0,.25);width:min(312px,88vw)}
  #pn .pnib span{display:none}
  #pn .pnmode button span{display:none}
}
@media (max-width:640px){
  #pn .pnsb{gap:10px;overflow:hidden;white-space:nowrap;font-size:11px}
  #pn .pnsb>*{white-space:nowrap}
  #pn .pnsv{display:none}
  #pn .pnlt{position:absolute;left:0;top:0;bottom:0;z-index:7;box-shadow:8px 0 24px rgba(0,0,0,.25)}
  #pn .pnb1 span{display:none}
  #pn .pnbrand b{display:none}
  #pn .pnpr{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;min-height:0;gap:6px 14px;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
  #pn .pnpr>*{flex:none}
  #pn .pnpr .pngp,#pn .pnpr .pnsw{flex-wrap:nowrap}
  #pn .pnpr>.pnmut{white-space:normal;flex:1 1 auto;font-size:var(--fs-xs)}
  #pn .pnpr .pngp.end{margin-left:0}
}

/* 5.12 Client document (Aperçu client, .page) and change-order document (.card.doc).
   Look kept exactly as in the published v198 (charte): merged from the older passes, nothing restyled.
   The document has its own fixed paper palette (stays white in dark mode).
   Its accent is --pa (company color from Réglages, set inline by accVars()), falling back to --brand. */
body.pv{background:var(--line)}
.pv .pbar{display:none}
.pvbar{display:flex;flex-wrap:wrap;gap:var(--sp-2);justify-content:center;margin:0 auto var(--sp-3);max-width:860px}
@media screen{.pvbar{max-width:min(1400px,96vw)}}
body:not(.pdfx) #cli .zp,body:not(.pdfx) #cli .zp b{color:#B91C1C;font-weight:700}

.page{
  --pa:var(--brand);
  --ink:#111827;--mut:#4B5563;--line:#E3E6E1;--soft:#EEF0EC;--card:#fff;--hi:var(--pa);
  --surface:#fff;--muted:#4B5563;--line-strong:#8A929C;
  background:#fff;color:#111827;max-width:860px;margin:0 auto 24px;padding:48px 56px;
  box-shadow:0 2px 16px rgba(20,30,45,.18);border-radius:3px;
  font-family:var(--font-ui);font-size:14.5px;line-height:1.5;
  -webkit-print-color-adjust:exact;print-color-adjust:exact
}
@media screen{.page{max-width:min(1400px,96vw)}}
/* app-wide defaults the document relied on before v199 */
.page .big,.doc .big{font-size:26px}
.page table{min-width:760px}
.page th{font-size:12.5px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--mut);padding:4px;background:var(--soft);border-bottom:0}
.page td{padding:3px;border-bottom:0;border-top:1px solid var(--line)}
.page tr:first-child td{border-top:0}
.page tr:hover td{background:transparent}
.page .sum{max-width:380px;margin-left:auto}
.page .sum div{display:flex;justify-content:space-between;padding:3px 0}
.page .sig{display:flex;gap:40px;margin-top:40px}
.page .sig div{flex:1;border-top:1px solid var(--ink);padding-top:4px;font-size:13px;color:var(--mut)}
/* header */
.page .ph1{display:flex;gap:24px;align-items:flex-end;padding-bottom:22px;margin-bottom:26px;border-bottom:1px solid var(--line);position:relative}
.page .ph1::after{content:"";position:absolute;left:0;bottom:-1px;width:96px;height:4px;background:var(--pa)}
.page .lg{flex:0 0 auto}
.page .lg img{max-width:175px;max-height:100px;object-fit:contain;display:block}
.logo-ph{width:140px;height:84px;border:2px dashed var(--line-strong);border-radius:6px;display:grid;place-items:center;color:var(--muted);cursor:pointer}
.page .cn{flex:1;min-width:0}
.page .cn b{display:block;font:700 22px/1.15 var(--font-brand);font-stretch:90%;letter-spacing:-.2px;color:var(--pk,var(--pa))}
.page .cn b .noprint{font:400 14px var(--font-ui);color:var(--muted)}
.page .cn small{display:block;margin-top:2px;color:var(--mut);font-size:13px}
.page .dn{text-align:right}
.page .dn .t{font:700 40px/1 var(--font-brand);font-stretch:80%;letter-spacing:-.5px;color:var(--pk,var(--pa));text-transform:none}
.page .dn div{margin-top:4px;color:var(--mut);font-size:13.5px}
.page .dn b{color:var(--ink);font-weight:700}
/* parties */
.parties{display:grid;grid-template-columns:repeat(3,1fr);gap:0 28px;margin:0 0 26px}
.party{border:0;border-top:1px solid var(--ink);border-radius:0;padding:10px 0 0;font-size:14px;line-height:1.5}
.party h4{margin:0 0 4px;font:600 13px var(--font-ui);letter-spacing:0;text-transform:none;color:var(--mut)}
.page .party h4{color:var(--pk,var(--pa))}
.party b{font-weight:700;font-size:15.5px}
.party.ent{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:0 24px;border-top:1px solid var(--line);margin-top:14px;padding-top:12px;font-size:12.5px;color:var(--mut)}
.party.ent h4{grid-column:1/-1;display:none}
.party.ent b{font-size:13.5px;color:var(--ink)}
.avis{font-size:12.5px;color:var(--mut);border-left:0;background:var(--soft);border-radius:4px;padding:10px 14px;margin:0 0 14px}
.nx{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px}
.page .cbx{background:transparent;border:0;border-left:3px solid var(--pa);border-radius:0;padding:2px 0 2px 14px;margin:0 0 14px}
.page .cbx ul{padding-left:18px;margin:4px 0 0;color:var(--ink)}
.page h2.dc{margin:30px 0 8px;font:700 24px var(--font-brand);font-stretch:88%;color:var(--pk,var(--pa));border-bottom:0;letter-spacing:-.2px}
.page h3{margin:22px 0 4px;font:700 17px var(--font-brand);color:var(--pk,var(--pa))}
.page p{max-width:78ch}
/* price table */
.page .ct{width:100%;min-width:0;border-collapse:collapse;font-size:14px}
.page .ct th{background:transparent;color:var(--mut);font:600 12.5px var(--font-ui);padding:6px 10px;text-align:left;border-bottom:1px solid var(--ink)}
.page .ct th.r{text-align:right}
.page .ct td{padding:8px 10px;vertical-align:top;border-bottom:1px solid var(--line)}
.page .ct tr.sp td{padding:6px;background:transparent;border:0}
.page .ct tr.cs td{font:600 15.5px var(--font-ui);padding:9px 10px;color:var(--ink);background:var(--soft);border-bottom:0;border-top:3px solid var(--pa)}
.page .ct tr.c1 td{padding:9px 10px;border:0;border-top:3px solid var(--pa);background:transparent}
.page .ct tr.c1 td b{font-weight:700;font-size:15.5px}
.page .ct td.r,.page .ct th.r{font-variant-numeric:tabular-nums}
.page .ct tr.cs,.page .ct tr.c1{break-after:avoid;break-inside:avoid}
.page .dr td{background:transparent}
.sn{display:inline;background:transparent;color:var(--pk,var(--pa));min-width:0;height:auto;padding:0;margin-right:10px;font:600 15px var(--font-ui);border-radius:0}
.cdet{margin:4px 0 0;padding-left:18px;font-size:12.5px;color:var(--mut)}
/* totals */
.page .sum{max-width:none;margin:20px 0 0 auto;width:min(100%,360px)}
.page .sum div{padding:5px 0;border-bottom:1px solid var(--line);font-size:14px}
.page .sum .tot{border:0;margin-top:10px;padding:14px 16px;background:var(--pa);color:var(--pt,#fff);border-radius:4px;align-items:baseline}
.page .sum .tot span.big{font:600 17px var(--font-ui);font-variant-numeric:tabular-nums;color:#fff}
.page .sum .tot span.big:last-child{border:0;border-radius:3px;padding:0;font-size:30px;font-stretch:90%;letter-spacing:-.4px;font-variant-numeric:tabular-nums;color:var(--pk,var(--pa))}
.page .sig{gap:48px;margin-top:48px}
.page .sig div{border-top:1px solid var(--ink);color:var(--mut)}
.pf{margin-top:26px;padding-top:10px;border-top:1px solid var(--line);font-size:12px;color:var(--mut);text-align:center}
.sefoot{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:14px;font:400 11px/1.3 var(--font-ui,Inter,system-ui,sans-serif);color:#6B7280}
.sefoot svg{flex:none;width:12px;height:12px}
/* photo banner (v71) */
.hero{position:relative;height:150px;margin:0 0 18px;overflow:hidden;border-radius:2px;background:var(--soft)}
.hero img{position:absolute;inset:0;width:100%;height:100%;transform:scale(1.08);object-fit:cover;filter:blur(2.5px) saturate(.9);opacity:.85}
.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,.1) 55%,rgba(24,35,47,.45))}
.hero .hv{position:absolute;left:22px;right:22px;bottom:14px;z-index:1;color:#fff;display:flex;flex-direction:column;gap:2px;text-shadow:0 1px 6px rgba(0,0,0,.45)}
.hero .hv b{font:700 22px/1.15 var(--font-brand);font-stretch:90%}
.hero .hv span{font-size:14px}
/* light accent (e.g. yellow logo): bands and fills in the accent, text in ink (v75) */
.page.lt .cn b,.page.lt .dn .t,.page.lt h2.dc,.page.lt .party h4,.page.lt h3,.page.lt .sn,.page.lt .sum .tot span.big:last-child{color:var(--ink)}
.page.lt .ph1::after{left:0;right:0;width:auto;height:6px;background:var(--pa)}
.page.lt h2.dc{border-bottom:4px solid var(--pa)}
.page.lt .ct th{background:var(--pa);color:#111827}
.page.lt .sum .tot{background:var(--pa)}
.page.lt .sum .tot,.page.lt .sum .tot span{color:#111827}
/* change-order document (.card.doc) */
.doc h2{font-size:22px;border-bottom:2px solid var(--ink);display:flex;justify-content:space-between;margin:16px 0 6px}
.doc ul{margin:4px 0 0;padding-left:20px;color:var(--muted)}
.doc .sum .tot{border-top:2px solid var(--ink)}
.doc .sig,.sig{display:flex;gap:40px;margin-top:40px}
.doc .sig div,.sig div{flex:1;border-top:1px solid var(--ink);padding-top:4px;font-size:13px;color:var(--muted)}
.cbx{background:var(--soft);border-radius:var(--r-btn);padding:10px 14px;margin:10px 0}
.cbx ul{margin:6px 0 0;padding-left:20px;color:var(--ink)}
@media (max-width:700px){.parties{grid-template-columns:1fr;gap:14px}}
@media (max-width:600px){
  .party.ent{grid-template-columns:1fr}
  .page{padding:22px 16px}
  .page .dn{text-align:left}
  .page .dn .t{font-size:32px}
  .page .ph1{flex-wrap:wrap}
}


/* =========================================================
   6. PRINT (the only place !important is used)
   ========================================================= */
@media print{
  @page{margin:14mm}
  body{background:#fff;color:#000}
  #sb,#sbx,#mtop,#qtabs,#pgw,.tools,.top{display:none!important}
  body.sbon main{margin:0!important;padding:0!important}
  #lst,#ia,#own,#oc,#cal,#fil,#po,#bud,#ech,#hp,#bq,#rg,#hm,#mp,#pn,#ap{display:none!important}
  #cli{display:block!important}
  .card{border:0}
  #iatoast,#stoast,#mvhint,#bmv,.pvbar,.noprint,.logo-ph{display:none!important}
  body.pv{background:#fff}
  .page{box-shadow:none!important;padding:0!important;max-width:none!important;margin:0!important}
  .page .sum .tot{background:var(--pa)!important;color:var(--pt,#fff)!important}
  .ct tr{break-inside:avoid}
  .sefoot{color:#6B7280!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .hero,.hero img,.hero:after{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .page.lt .ct th,.page.lt .sum .tot,.page.lt .ph1::after{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

/* v223 : PDF Note (et plein écran) prend tout l'ecran, pas la largeur max du contenu */
body.sbon main>#pn,body.sbon main>#mp.mpfull,body.sbon main>#ap.apfull{max-width:none!important}

/* v223 : PDF Note en couleurs (remis) : rouge PDF + une couleur par outil */
#pn{--pa:#d92d20;--pnred:#d92d20}
#pn .pnb1{background:#d92d20}
#pn .pnt{border-bottom:3px solid #d92d20}
#pn .pnbt{--ic:#d92d20}
#pn .pnbt .pni{color:var(--ic);background:color-mix(in srgb,var(--ic) 15%,var(--surface,#fff))}
#pn .pnbt:hover:not(:disabled) .pni{color:var(--ic);background:color-mix(in srgb,var(--ic) 24%,var(--surface,#fff));transform:translateY(-2px);box-shadow:0 5px 12px rgba(20,30,45,.22)}
#pn .pnbt.on{background:color-mix(in srgb,var(--ic) 10%,var(--surface,#fff))}
#pn .pnbt.on .pni{background:var(--ic);color:#fff;box-shadow:0 0 0 2px var(--surface,#fff),0 0 0 4px var(--ic)}
#pn .pntabs>button:not(.pnhide)::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--tc,#d92d20);margin-right:7px;vertical-align:1px}
#pn .pntabs>button.on{color:var(--tc,#d92d20);border-bottom-color:var(--tc,#d92d20)}
#pn .pntabs>button[data-t="view"]{--tc:#1c7ed6}#pn .pntabs>button[data-t="pages"]{--tc:#2f9e44}#pn .pntabs>button[data-t="com"]{--tc:#d92d20}#pn .pntabs>button[data-t="ed"]{--tc:#7048e8}
#pn .pntabs>button[data-t="mes"]{--tc:#0b7285}#pn .pntabs>button[data-t="sec"]{--tc:#495057}#pn .pntabs>button[data-t="sig"]{--tc:#d6336c}#pn .pntabs>button[data-t="conv"]{--tc:#e8590c}
#pn #pnundo{color:#2563eb}#pn #pnredo{color:#16a34a}
#pn .pntile{--ic:#d92d20;border-top:3px solid var(--ic)}
#pn .pntile .pni{width:48px;height:48px;padding:11px;box-sizing:border-box;border-radius:13px;color:var(--ic);background:color-mix(in srgb,var(--ic) 15%,var(--surface,#fff))}
#pn .pntile:nth-child(1){--ic:#e8590c}#pn .pntile:nth-child(2){--ic:#d92d20}#pn .pntile:nth-child(3){--ic:#0ca678}#pn .pntile:nth-child(4){--ic:#1c7ed6}#pn .pntile:nth-child(5){--ic:#7048e8}
#pn .pnbt[data-t="hl"]{--ic:#e6a700}
#pn .pnbt[data-t="ul"]{--ic:#1c7ed6}
#pn .pnbt[data-t="st"]{--ic:#e03131}
#pn .pnbt[data-t="mk"]{--ic:#f08c00}
#pn .pnbt[data-t="note"]{--ic:#f59f00}
#pn .pnbt[data-t="tx"]{--ic:#364fc7}
#pn .pnbt[data-t="call"]{--ic:#7048e8}
#pn .pnbt[data-t="pen"]{--ic:#d6336c}
#pn .pnbt[data-t="line"]{--ic:#0b7285}
#pn .pnbt[data-t="arrow"]{--ic:#e03131}
#pn .pnbt[data-t="poly"]{--ic:#1098ad}
#pn .pnbt[data-t="rect"]{--ic:#2f9e44}
#pn .pnbt[data-t="ell"]{--ic:#9c36b5}
#pn .pnbt[data-t="polyg"]{--ic:#5f3dc4}
#pn .pnbt[data-t="cloud"]{--ic:#1c7ed6}
#pn .pnbt[data-t="cloudp"]{--ic:#0c8599}
#pn .pnbt[data-t="stamp"]{--ic:#c92a2a}
#pn .pnbt[data-t="img"]{--ic:#0ca678}
#pn .pnbt[data-t="lnk"]{--ic:#1971c2}
#pn .pnbt[data-t="eraser"]{--ic:#868e96}
#pn .pnbt[data-t="zoomr"]{--ic:#0b7285}
#pn .pnbt[data-t="chk"]{--ic:#2b8a3e}
#pn .pnbt[data-t="meas"]{--ic:#0b7285}
#pn .pnbt[data-t="area"]{--ic:#2b8a3e}
#pn .pnbt[data-t="cnt"]{--ic:#e03131}
#pn .pnbt[data-t="cal"]{--ic:#7048e8}
#pn .pnbt[data-t="red"]{--ic:#495057}
#pn .pnbt[data-t="crop"]{--ic:#e8590c}
#pn .pnbt[data-a="fitw"]{--ic:#1c7ed6}
#pn .pnbt[data-a="fitp"]{--ic:#1c7ed6}
#pn .pnbt[data-a="z100"]{--ic:#0b7285}
#pn .pnbt[data-a="zin"]{--ic:#2f9e44}
#pn .pnbt[data-a="zout"]{--ic:#e8590c}
#pn .pnbt[data-a="mcont"]{--ic:#7048e8}
#pn .pnbt[data-a="mone"]{--ic:#7048e8}
#pn .pnbt[data-a="mtwo"]{--ic:#7048e8}
#pn .pnbt[data-a="rotr"]{--ic:#0ca678}
#pn .pnbt[data-a="rotl"]{--ic:#0ca678}
#pn .pnbt[data-a="capture"]{--ic:#d6336c}
#pn .pnbt[data-a="grid"]{--ic:#4263eb}
#pn .pnbt[data-a="snap"]{--ic:#4263eb}
#pn .pnbt[data-a="find"]{--ic:#f08c00}
#pn .pnbt[data-a="full"]{--ic:#3b5bdb}
#pn .pnbt[data-a="th"]{--ic:#862e9c}
#pn .pnbt[data-a="rp"]{--ic:#862e9c}
#pn .pnbt[data-a="insblank"]{--ic:#2f9e44}
#pn .pnbt[data-a="insimg"]{--ic:#2f9e44}
#pn .pnbt[data-a="inspdf"]{--ic:#2f9e44}
#pn .pnbt[data-a="extract"]{--ic:#1c7ed6}
#pn .pnbt[data-a="delpg"]{--ic:#e03131}
#pn .pnbt[data-a="duppg"]{--ic:#0b7285}
#pn .pnbt[data-a="mvl"]{--ic:#7048e8}
#pn .pnbt[data-a="mvr"]{--ic:#7048e8}
#pn .pnbt[data-a="rev"]{--ic:#7048e8}
#pn .pnbt[data-a="fond"]{--ic:#f08c00}
#pn .pnbt[data-a="uncrop"]{--ic:#e8590c}
#pn .pnbt[data-a="pnum"]{--ic:#4263eb}
#pn .pnbt[data-a="marks"]{--ic:#4263eb}
#pn .pnbt[data-a="scale"]{--ic:#8a6a2f}
#pn .pnbt[data-a="msum"]{--ic:#4263eb}
#pn .pnbt[data-a="send"]{--ic:#2b8a3e}
#pn .pnbt[data-a="mcsv"]{--ic:#2b8a3e}
#pn .pnbt[data-a="redfind"]{--ic:#f08c00}
#pn .pnbt[data-a="redapply"]{--ic:#c92a2a}
#pn .pnbt[data-a="redclear"]{--ic:#868e96}
#pn .pnbt[data-a="meta"]{--ic:#4263eb}
#pn .pnbt[data-a="sig"]{--ic:#7048e8}
#pn .pnbt[data-a="ini"]{--ic:#d6336c}
#pn .pnbt[data-a="sdate"]{--ic:#0b7285}
#pn .pnbt[data-a="sstamp"]{--ic:#c92a2a}
#pn .pnbt[data-a="new"]{--ic:#d92d20}
#pn .pnbt[data-a="img2pdf"]{--ic:#0ca678}
#pn .pnbt[data-a="merge"]{--ic:#7048e8}
#pn .pnbt[data-a="split"]{--ic:#1c7ed6}
#pn .pnbt[data-a="expimg"]{--ic:#d6336c}
#pn .pnbt[data-a="exptxt"]{--ic:#364fc7}
#pn .pnbt[data-a="compress"]{--ic:#e8590c}

/* v231 : tableau de bord en couleurs (chiffres, à faire, colonnes par étape) */
/* v231 : flèche retour */
.sebk{font-size:20px!important;line-height:1!important;padding:6px 14px!important;font-weight:700!important}
#pgh{display:flex;align-items:center;gap:12px}
#pgh:empty{display:none}
.top [data-goback]{display:none!important}
/* v234 : alerte de relance */
#sb .sbbadge{margin-left:auto;background:#e8890c;color:#fff;font-style:normal;font-weight:800;font-size:12px;min-width:22px;height:22px;padding:0 6px;border-radius:11px;display:inline-grid;place-items:center}
/* v235 : tableau de bord harmonisé avec les autres pages (vert de la marque) */

/* =========================================================
   v206 : charte SoumissionExpert (tokens.json). Jetons de statut, polices,
   et retrait des couleurs hors charte du tableau de bord.
   ========================================================= */
:root{
  --st-draft-bg:#F3F4F6;--st-draft:#4B5563;
  --st-sent-bg:#E0ECFF;--st-sent:#1D4ED8;
  --st-rel-bg:#FDEEDD;--st-rel:#92400E;
  --st-sig-bg:#DCF3E6;--st-sig:#166534;
  --st-ref-bg:#FDE2E2;--st-ref:#B91C1C;
}
#sb button.on{background:var(--brand);color:var(--on-brand)}
#sb .sbbadge{background:var(--sidebar-text);color:var(--sidebar);font-weight:600}

/* =========================================================
   v207 : tableau de bord (Main.dc.html, charte tokens.json) et colonnes par étape dans Mes soumissions
   ========================================================= */
:root{--sb-w:272px}
#sb{padding:22px 14px}
#sb .sbbrand{padding:4px 8px 22px;gap:12px}
#sb .sewm{font-size:19px;line-height:22px}
#sb h4{font:600 11px/16px var(--font-ui);letter-spacing:.08em;text-transform:uppercase;color:var(--sidebar-text);opacity:.75;padding:18px 12px 6px;margin:0}
#sb button{min-height:38px;padding:0 12px;gap:12px;border-radius:7px}
#sb button svg{width:18px;height:18px;opacity:1}
#sb button.on{background:var(--brand);color:var(--on-brand);font-weight:600}
#sb button.on:hover{background:var(--brand);color:var(--on-brand)}
@media (min-width:900px){body.sbon[data-view="hm"] main{padding:28px 36px 36px}}
#hm.db{max-width:none;margin:0;color:var(--ink)}
#hm.db .dbc{background:var(--surface);border:1px solid var(--line);border-radius:14px}
#hm.db h3{font:600 17px/24px var(--font-ui);margin:0;color:var(--ink)}
#hm.db .dbtop{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:22px}
#hm.db .dbtt{display:flex;flex-direction:column;gap:4px}
#hm.db .dbtt small{color:var(--brand-text);font:600 11.5px/16px var(--font-ui);letter-spacing:.08em;text-transform:uppercase}
#hm.db .dbtt h1{font:700 26px/32px var(--font-brand);letter-spacing:-.01em;margin:0;color:var(--ink)}
#hm.db .dbtr{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px;flex:0 1 560px;min-width:0}
#hm.db .dbs{position:relative;flex:1 1 260px;min-width:0;margin:0;display:block}
#hm.db .dbs svg{position:absolute;left:14px;top:50%;width:18px;height:18px;transform:translateY(-50%);color:var(--muted);pointer-events:none}
#hm.db .dbs input{width:100%;height:44px;margin:0;padding:0 14px 0 40px;border:1px solid var(--line-strong);border-radius:10px;background:var(--surface);color:var(--ink);font:400 14px/21px var(--font-ui)}
#hm.db .dbs input::placeholder{color:var(--muted)}
#hm.db .dbadd{display:inline-flex;align-items:center;gap:8px;flex:none;height:44px;padding:0 18px;border:0;border-radius:7px;font:600 14px/21px var(--font-ui);white-space:nowrap}
#hm.db .dbkpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:22px;overflow:hidden}
#hm.db .dbkpi{display:flex;flex-direction:column;gap:6px;padding:20px 22px;border-right:1px solid var(--line);min-width:0}
#hm.db .dbkpi:last-child{border-right:0}
#hm.db .dbkpi small{color:var(--muted);font:600 11.5px/16px var(--font-ui);letter-spacing:.08em;text-transform:uppercase}
#hm.db .dbkpi b{color:var(--ink);font:600 28px/34px var(--font-ui);font-variant-numeric:tabular-nums}
#hm.db .dbkpi b.nil{color:var(--muted)}
#hm.db .dbkpi span{color:var(--muted);font:400 13px/19px var(--font-ui)}
#hm.db .dbgrid{display:flex;flex-direction:column;gap:22px}
#hm.db .dbmain{min-width:0;overflow:hidden}
#hm.db .dbrh{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px}
#hm.db .dbmain>.dbrh{padding:22px 22px 16px}
#hm.db .dbrh small{color:var(--muted);font:400 13px/19px var(--font-ui)}
#hm.db .dbgo{border:0;background:none;padding:0;color:var(--brand-text);font:600 13px/19px var(--font-ui);cursor:pointer}
#hm.db .dbgo:hover{color:var(--brand-hover)}
#hm.db .dbbar{display:flex;gap:2px;height:8px;margin:0 22px 14px;border-radius:999px;overflow:hidden;background:var(--st-draft-bg)}
#hm.db .dbbar i{display:block;min-width:4px}
#hm.db .dbbar .s-bro{background:var(--line-strong)}
#hm.db .dbbar .s-env,#hm.db .dbbar .s-rel{background:var(--muted)}
#hm.db .dbbar .s-sig{background:var(--ink)}
#hm.db .dbbar .s-ref{background:var(--line)}
#hm.db .dbstg{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px;padding:0 22px 18px}
#hm.db .dbtile{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:6px;padding:12px;border:1px solid var(--line);border-radius:10px;background:none;color:var(--ink);text-align:left;cursor:pointer;min-width:0;font:400 14px/21px var(--font-ui)}
#hm.db .dbtile:hover{border-color:var(--line-strong)}
#hm.db .dbtile b{font:600 20px/26px var(--font-ui);font-variant-numeric:tabular-nums}
#hm.db .dbtile small{color:var(--muted);font:400 13px/19px var(--font-ui);font-variant-numeric:tabular-nums}
#hm.db .bd{display:inline-block;margin:0;padding:2px 10px;border-radius:999px;font:600 12px/18px var(--font-ui);white-space:nowrap;background:var(--st-draft-bg);color:var(--st-draft)}
#hm.db .bd.env{background:var(--st-sent-bg);color:var(--st-sent)}
#hm.db .bd.rel{background:var(--st-rel-bg);color:var(--st-rel)}
#hm.db .bd.sig{background:var(--st-sig-bg);color:var(--st-sig);margin:0;border:0;min-height:0}
#hm.db .bd.ref{background:var(--st-ref-bg);color:var(--st-ref)}
#hm.db .dbrec{border-top:1px solid var(--line)}
#hm.db .dbrec h3{padding:18px 22px 8px}
#hm.db .dbsc{overflow-x:auto}
#hm.db table{width:100%;min-width:480px;border-collapse:collapse}
#hm.db th{padding:10px 12px;border-top:0;border-bottom:1px solid var(--line);color:var(--muted);font:600 11.5px/16px var(--font-ui);letter-spacing:.08em;text-transform:uppercase;text-align:left;background:none}
#hm.db td{padding:12px;border-top:0;border-bottom:1px solid var(--line);font:400 14px/21px var(--font-ui);vertical-align:middle}
#hm.db th:first-child,#hm.db td:first-child,#hm.db th:last-child,#hm.db td:last-child{padding-left:22px;padding-right:22px}
#hm.db th.r,#hm.db td.r{text-align:right}
#hm.db tbody tr:last-child td{border-bottom:0}
#hm.db tr.rr{cursor:pointer}
#hm.db tr.rr:hover td{background:var(--ground)}
#hm.db td b{display:block;font-weight:600;color:var(--ink)}
#hm.db td small{display:block;color:var(--muted);font:400 13px/19px var(--font-ui)}
#hm.db td.mod{color:var(--muted);font-size:13px;white-space:nowrap}
#hm.db td.tot{font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
#hm.db .dbempty{padding:12px 22px 22px;margin:0;color:var(--muted);font:400 14px/21px var(--font-ui)}
#hm.db .dbtodo{min-width:0;padding:22px;display:flex;flex-direction:column;gap:14px}
#hm.db .dbti{display:flex;align-items:center;gap:12px;padding:14px;background:var(--ground);border-radius:10px}
#hm.db .dbti>div:first-child{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
#hm.db .dbti b{font:600 14px/21px var(--font-ui);color:var(--ink)}
#hm.db .dbti small{color:var(--muted);font:400 13px/19px var(--font-ui)}
#hm.db .dbtb{display:flex;flex:none;flex-wrap:wrap;gap:8px}
#hm.db .dbtb .btn{height:44px;padding:0 14px;border:1px solid var(--line-strong);border-radius:7px;background:var(--surface);color:var(--ink);font:600 14px/21px var(--font-ui)}
#hm.db .dbnote{margin:0;color:var(--muted);font:400 13px/19px var(--font-ui)}
@media (max-width:1100px){#hm.db .dbkpis{grid-template-columns:repeat(2,minmax(0,1fr))}#hm.db .dbkpi:nth-child(2){border-right:0}#hm.db .dbkpi:nth-child(n+3){border-top:1px solid var(--line)}}
@media (max-width:640px){
  #hm.db .dbtr{flex:1 1 100%}
  #hm.db .dbs{flex:1 1 100%}
  #hm.db .dbadd{flex:1 1 100%;justify-content:center}
  #hm.db .dbtodo{padding:16px}
  #hm.db .dbmain>.dbrh{padding:16px 16px 12px}
  #hm.db .dbbar{margin:0 16px 14px}
  #hm.db .dbstg{grid-template-columns:repeat(2,minmax(0,1fr));padding:0 16px 16px}
  #hm.db .dbrec h3{padding:16px 16px 8px}
  #hm.db table{min-width:0}
  #hm.db th:nth-child(3),#hm.db td:nth-child(3){display:none}
  #hm.db th:first-child,#hm.db td:first-child,#hm.db th:last-child,#hm.db td:last-child{padding-left:16px;padding-right:16px}
  #hm.db .dbti{flex-direction:column;align-items:stretch}
  #hm.db .dbtb .btn{flex:1 1 auto}
}
@media (max-width:420px){#hm.db .dbkpis{grid-template-columns:minmax(0,1fr)}#hm.db .dbkpi{border-right:0}#hm.db .dbkpi:nth-child(n+2){border-top:1px solid var(--line)}}
/* Mes soumissions : filtres, liste et statut modifiable */
#lst .lss{display:flex;flex-direction:column;gap:16px;padding:22px;background:var(--surface);border:1px solid var(--line);border-radius:14px}
#lst .lss h2{scroll-margin-top:72px;margin:0;font:700 20px/26px var(--font-brand);letter-spacing:-.01em;color:var(--ink)}
#lst .lsfs{display:flex;flex-wrap:wrap;gap:8px}
#lst .lsf{min-height:40px;padding:0 16px;border:1px solid var(--line-strong);border-radius:999px;background:var(--surface);color:var(--ink);font:500 14px/21px var(--font-ui);cursor:pointer}
#lst .lsf:hover{border-color:var(--ink)}
#lst .lsf.on{border:2px solid var(--brand);background:var(--brand-tint);font-weight:600}
#lst table.lst{width:100%;min-width:880px;border-collapse:collapse}
#lst .lst th{padding:10px 12px;border-bottom:1px solid var(--line);color:var(--muted);font:600 11.5px/16px var(--font-ui);letter-spacing:.08em;text-transform:uppercase;text-align:left}
#lst .lst th.r{text-align:right}
#lst .lst td{padding:12px;border-bottom:1px solid var(--line);font:400 14px/21px var(--font-ui);vertical-align:middle}
#lst .lst tr:last-child td{border-bottom:0}
#lst .lst td.r{font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
#lst .lst td:last-child:has(>button){position:relative}
#lst .lst td.lsa{font-weight:400;white-space:nowrap}
#lst .lsp{position:relative;display:inline-block;border-radius:999px;background:var(--st-draft-bg);color:var(--st-draft)}
#lst .lsp.env{background:var(--st-sent-bg);color:var(--st-sent)}
#lst .lsp.rel{background:var(--st-rel-bg);color:var(--st-rel)}
#lst .lsp.sig{background:var(--st-sig-bg);color:var(--st-sig);display:inline-block;margin:0;gap:0}
#lst .lsp.ref{background:var(--st-ref-bg);color:var(--st-ref)}
#lst .lsp::after{content:"▾";position:absolute;right:9px;top:50%;transform:translateY(-50%);font-size:10px;pointer-events:none}
#lst .lsp select{appearance:none;-webkit-appearance:none;width:auto;height:auto;margin:0;padding:2px 22px 2px 10px;border:0;border-radius:999px;background:none;color:inherit;font:600 12px/18px var(--font-ui);cursor:pointer}
#lst .lsp select:focus-visible{outline:2px solid var(--brand);outline-offset:1px}
#lst .lsp option{background:var(--surface);color:var(--ink)}
#lst .lsq{position:absolute;right:12px;top:50%;z-index:2;display:flex;align-items:center;gap:8px;padding:6px 8px 6px 12px;transform:translateY(-50%);white-space:nowrap;background:var(--surface);border:1px solid var(--line-strong);border-radius:10px;box-shadow:0 2px 10px rgba(17,24,39,.08)}
#lst .lsq b{font:600 13px/19px var(--font-ui);color:var(--ink)}
#lst .lsmore{display:flex;justify-content:center;padding:12px 0 0}
@media (max-width:640px){#lst .lss{padding:16px}}

/* =========================================================
   v210 : Mes soumissions, en-tête et carte « Créer une soumission » (NouvelleSoumission.dc.html, tokens.json)
   ========================================================= */
#pgw{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;max-width:none;margin:0 0 var(--sp-5)}
#pgw #pgh{margin:0}
#lsts{display:none;position:relative;flex:0 1 380px;min-width:0;margin:0}
body[data-view="lst"] #lsts{display:block}
#lsts svg{position:absolute;left:14px;top:50%;width:18px;height:18px;transform:translateY(-50%);color:var(--muted);pointer-events:none}
#lsts .srt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
#lsts input{width:100%;height:44px;margin:0;padding:0 14px 0 40px;border:1px solid var(--line-strong);border-radius:10px;background:var(--surface);color:var(--ink);font:400 14px/21px var(--font-ui)}
#lsts input::placeholder{color:var(--muted)}
#crc{display:flex;flex-direction:column;gap:18px;padding:22px;background:var(--surface);border:1px solid var(--line);border-radius:14px}
#crc .crhd,#crc .crhd2,#crc .crsum{display:flex;flex-direction:column;gap:2px;min-width:0}
#crc h2{margin:0;font:700 20px/26px var(--font-brand);letter-spacing:-.01em;color:var(--ink)}
#crc p{margin:0;font:400 13px/19px var(--font-ui);color:var(--muted)}
#crc .crst{display:flex;flex-direction:column;gap:10px}
#crc .crl{font:600 11.5px/16px var(--font-ui);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
#crc .crms{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
#crc .crm{display:grid;grid-row:span 4;grid-template-rows:subgrid;row-gap:10px;align-content:start;padding:22px;text-align:left;border:2px solid var(--line);border-radius:14px;background:var(--surface);color:var(--ink);font:400 14px/21px var(--font-ui);cursor:pointer}
#crc .crm:hover{border-color:var(--line-strong)}
#crc .crm.on,#crc .crm.on:hover{border-color:var(--brand);background:var(--brand-tint)}
#crc .crmt{display:flex;align-items:center;justify-content:space-between;gap:8px}
#crc .crmi{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;background:var(--ground);color:var(--ink)}
#crc .crm.on .crmi{background:var(--brand);color:var(--on-brand)}
#crc .crmr{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:22px;height:22px;border-radius:999px;border:2px solid var(--line-strong)}
#crc .crm.on .crmr{border:0;background:var(--brand);color:var(--on-brand)}
#crc .crmn{font:700 20px/26px var(--font-brand);letter-spacing:-.01em}
#crc .crmd{color:var(--muted)}
#crc .crm.on .crmd{color:var(--ink)}
#crc .crmf{padding-top:10px;border-top:1px solid var(--line);font:400 13px/19px var(--font-ui);color:var(--muted)}
#crc .crm.on .crmf{border-top-color:var(--line-strong);color:var(--ink)}
#crc .crmf b{font-weight:600;color:var(--ink)}
#crc .crts{display:flex;flex-wrap:wrap;gap:8px}
#crc .crsv{display:inline-flex;align-items:center;gap:2px}
#crc .crt{min-height:40px;padding:0 16px;border:1px solid var(--line-strong);border-radius:999px;background:var(--surface);color:var(--ink);font:500 14px/21px var(--font-ui);cursor:pointer}
#crc .crt:hover:not(:disabled){border-color:var(--ink)}
#crc .crt.on{border:2px solid var(--brand);background:var(--brand-tint);font-weight:600}
#crc .crt:disabled{border-color:var(--line);background:var(--ground);color:var(--line-strong);cursor:not-allowed}
#crc .crx{width:32px;height:32px;padding:0;border:0;border-radius:999px;background:none;color:var(--muted);font:500 18px/1 var(--font-ui);cursor:pointer}
#crc .crx:hover:not(:disabled){color:var(--ink)}
#crc .crx:disabled{color:var(--line-strong);cursor:not-allowed}
#crc .crbt{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding-top:18px;border-top:1px solid var(--line)}
#crc .crsum b{font:600 14px/21px var(--font-ui);color:var(--ink)}
#crc .crgo{display:flex;flex-direction:column;align-items:stretch;gap:12px}
#crc .crco{display:flex;flex-direction:column;gap:2px;margin:0;font:600 11.5px/16px var(--font-ui);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
#crc .crco select{height:44px;margin:0;border:1px solid var(--line-strong);border-radius:10px;background:var(--surface);color:var(--ink);font:400 14px/21px var(--font-ui);letter-spacing:0;text-transform:none}
#crc .crb{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 20px;border-radius:7px;font:600 14px/21px var(--font-ui)}
#crc .crb:disabled{border:1px solid var(--line);background:var(--ground);color:var(--muted);cursor:not-allowed}
#crc .crnote{display:flex;align-items:flex-start;gap:8px}
#crc .crnote svg{flex:0 0 16px;margin-top:2px}
@media (max-width:640px){
  #lsts{flex:1 1 100%}
  #crc{padding:16px}
  #crc .crm{padding:16px}
  #crc .crgo,#crc .crb{flex:1 1 100%;width:100%}
  #crc .crco{flex:1 1 100%}
  #crc .crco select{width:100%}
}

/* v212 : Enregistrer comme gabarit (dans une soumission ouverte) */
#tpld{width:min(440px,calc(100vw - 32px));box-sizing:border-box;padding:22px;border:1px solid var(--line);border-radius:14px;background:var(--surface);color:var(--ink);font:400 14px/21px var(--font-ui)}
#tpld::backdrop{background:var(--overlay)}
#tpld h2{margin:0 0 8px;font:700 20px/26px var(--font-brand);letter-spacing:-.01em;color:var(--ink)}
#tpld p{margin:0 0 16px;font:400 13px/19px var(--font-ui);color:var(--muted)}
#tpld label{display:block;color:var(--muted);font:400 13px/19px var(--font-ui)}
#tpld input{width:100%;box-sizing:border-box;height:44px;margin-top:4px;padding:0 14px;border:1px solid var(--line-strong);border-radius:10px;background:var(--surface);color:var(--ink);font:400 14px/21px var(--font-ui)}
#tpld .tpldb{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}
#rgco .ch{font:600 17px/24px var(--font-ui)}

/* v214 : le logo revient au tableau de bord */
#sb button.sbbrand{flex:none;width:100%;min-height:0;padding:4px 8px 22px;gap:12px;border-radius:7px;background:none;color:var(--sidebar-text);font:inherit;text-align:left;cursor:pointer}
#sb button.sbbrand:hover{background:none;color:var(--sidebar-text)}
#sb button.sbbrand .sbmark svg{width:34px;height:34px}
#sb .sbbt{display:block;min-width:0}

/* v223 : onglet Générateur IA unifié */
.gsh{display:none;width:100%;align-items:center;gap:var(--sp-2);border:0;border-bottom:1px solid var(--line-strong);background:none;color:var(--ink);font:700 var(--fs-xl)/26px var(--font-brand);letter-spacing:-.01em;padding:var(--sp-3) 0;margin:0 0 var(--sp-4);cursor:pointer;text-align:left}
body[data-view="ia"] .gsh{display:flex}
#ownh{margin-top:var(--sp-5)}
.gsh .gn-tg{margin-left:auto}
.gsh[aria-expanded="false"] .gn-tg svg,.gn-h[aria-expanded="false"] .gn-tg svg{transform:rotate(-90deg)}
.gsh[aria-expanded="true"] .gn-tg svg,.gn-h[aria-expanded="true"] .gn-tg svg{transform:rotate(180deg)}
body.gs-ia-col #ia,body.gs-own-col #own{display:none}
#ia{--gn-w:880px}
.gn-c{padding:22px 24px;border-radius:var(--r-card)}
.gn-h{width:100%;border:0;border-bottom:1px solid var(--line);background:none;text-align:left;cursor:pointer;flex-wrap:wrap;gap:var(--sp-3);color:var(--ink);min-height:44px}
.gn-tt{font:700 var(--fs-xl)/26px var(--font-brand);letter-spacing:-.01em}
.gn-sub{font:400 var(--fs-sm)/18px var(--font-ui)}
.gn-mu{color:var(--muted);font-size:var(--fs-sm)}
.gn-n{width:28px;height:28px;border-radius:50%;background:var(--chip);color:var(--chip-text);display:grid;place-items:center;font:600 var(--fs-md) var(--font-ui);flex:none}
.gn-off .gn-n{background:var(--line);color:var(--muted)}.gn-off .gn-tt{color:var(--muted)}
.gn-tg{margin-left:auto;display:inline-flex;align-items:center;gap:var(--sp-1);font:500 var(--fs-sm) var(--font-ui);color:var(--muted)}
.gn-b{display:flex;flex-direction:column;gap:var(--sp-4)}
.gn-b>*{margin-top:0;margin-bottom:0}
.gn-g2{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--sp-4)}
.gn-g2 label,.gn-cg label{display:flex;flex-direction:column;gap:6px;font-size:var(--fs-sm);color:var(--muted)}
.gn-g2 select{height:44px}
.gn-as{display:flex;gap:var(--sp-3);align-items:flex-end}.gn-av{flex:none}
.gn-as small{display:block;font-size:var(--fs-sm);color:var(--muted);margin-bottom:var(--sp-1)}
.gn-bu{background:var(--ground);border-radius:14px 14px 14px 4px;padding:var(--sp-3) var(--sp-4);font-size:15px;line-height:23px;max-width:620px}
.gn-cp{border:1px solid var(--line-strong);border-radius:var(--r-card);overflow:hidden}
.gn-cp textarea{box-sizing:border-box;display:block;width:100%;border:0;border-radius:0;resize:vertical;padding:18px 20px 10px;font:400 15px/24px var(--font-ui);background:transparent;outline:0}
.gn-cb{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;padding:var(--sp-2) var(--sp-3);border-top:1px solid var(--line)}
.gn-sp{flex:1 1 20px}
.gn-ib{width:44px;height:44px;border:0;border-radius:var(--r-btn);background:transparent;color:var(--muted);display:grid;place-items:center;cursor:pointer}
.gn-fl{display:flex;gap:10px;flex-wrap:wrap;align-items:stretch}
#plfn:empty{display:none}
.gn-fi{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:var(--r-input);padding:8px 10px 8px 8px;background:var(--ground);font-size:var(--fs-md);font-weight:500}
.gn-fi i{width:36px;height:36px;border-radius:var(--r-btn);background:var(--surface);border:1px solid var(--line);display:grid;place-items:center;color:var(--muted);font-style:normal;flex:none}
.gn-fi button{border:0;background:none;color:var(--muted);cursor:pointer;padding:6px;display:grid}
.gn-dp{display:flex;flex-direction:column;justify-content:center;gap:2px;border:1.5px dashed var(--line-strong);border-radius:var(--r-input);padding:6px var(--sp-4);min-height:54px;color:var(--ink);font:500 var(--fs-md) var(--font-ui);cursor:pointer}
.gn-dp span{display:flex;align-items:center;gap:6px}.gn-dp small{font:400 var(--fs-xs) var(--font-ui);color:var(--muted)}
#pldz.ov .gn-dp,.pldz.ov .gn-dp{border-style:solid;border-color:var(--brand);background:var(--brand-tint)}
.gn-rw{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap}
.gn-rw .btn{display:inline-flex;align-items:center;gap:6px}
.gn-fd{display:flex;gap:var(--sp-2);align-items:center;font-size:var(--fs-sm);color:var(--muted);flex:1 1 260px}
.gn-an{height:44px;display:inline-flex;align-items:center;gap:var(--sp-2);border-color:var(--ink);font-weight:600}
.gn-cg{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--sp-3)}
.gn-cg small{font-size:var(--fs-xs)}.gn-ms{color:var(--warn)}
.gn-miss{border:1.5px solid var(--warn)!important;background:var(--warn-soft)!important}
.gn-pl{font:600 var(--fs-xs) var(--font-ui);padding:var(--sp-1) 10px;border-radius:var(--r-pill);background:var(--warn-soft);color:var(--warn)}
.gn-tb{border:1px solid var(--line);border-radius:var(--r-input);overflow:hidden}
.gn-tr{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1.4fr) minmax(0,1fr);gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-top:1px solid var(--line);font-size:var(--fs-md)}
.gn-th{border-top:0;background:var(--ground);padding:10px var(--sp-4);font-size:11.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.gn-q{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap;padding:14px var(--sp-4);border-radius:var(--r-input);background:var(--warn-soft);font-size:var(--fs-md)}
.gn-q b{color:var(--warn);font-weight:600}.gn-q span{flex:1 1 200px}
.gn-gn{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap;margin-bottom:var(--sp-4)}
.gn-go{height:48px;padding:0 var(--sp-5);display:inline-flex;align-items:center;gap:10px;font-size:15px;font-weight:600}
.gn-bg{display:flex;flex-wrap:wrap;gap:22px;align-items:flex-start}
.gn-bl{flex:999 1 560px;min-width:0}.gn-br{flex:1 1 320px;min-width:0;position:sticky;top:16px}
@media (max-width:1000px){.gn-br{position:static}}
.gn-b>details.mini>summary{cursor:pointer;font:500 var(--fs-md) var(--font-ui)}
.gn-b>details.mini[open]>summary{margin-bottom:var(--sp-3)}
.gn-br .gn-c{padding:20px}.gn-br .gn-tt{font:600 17px/24px var(--font-ui)}
.gn-tt2{font:700 32px/40px var(--font-brand);letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.gn-kv{display:flex;justify-content:space-between;font-size:var(--fs-md);color:var(--muted);font-variant-numeric:tabular-nums}
.gn-vf{display:flex;align-items:center;gap:10px;font-size:var(--fs-md);margin-bottom:var(--sp-2)}
.gn-ok,.gn-wn{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;flex:none;font-size:var(--fs-xs);font-weight:600}
.gn-ok{background:var(--ok-soft);color:var(--ok)}.gn-wn{background:var(--warn-soft);color:var(--warn)}
.gn-ln{border:0;background:none;color:var(--brand-text);display:inline-flex;align-items:center;gap:6px;font-weight:500;align-self:flex-start}
#ia .chat{border:0;margin:0}
#ia .chm{max-height:520px;padding:0;gap:18px}
#ia .gn-m{display:flex;gap:10px;align-items:flex-start;max-width:82%}
#ia .msg{font-size:15px;line-height:23px;padding:var(--sp-3) var(--sp-4);max-width:78%}
#ia .msg.u{border-radius:14px 14px 4px 14px}
#ia .gn-m .msg{max-width:none;border-radius:14px 14px 14px 4px;background:var(--ground)}
.gn-ud{display:inline-flex;align-items:center;gap:6px;margin-top:var(--sp-2);border:0;background:none;padding:0;color:var(--brand-text);font:500 var(--fs-sm) var(--font-ui);cursor:pointer;text-decoration:underline}
.gn-cps{display:flex;gap:6px;flex-wrap:wrap;margin-top:var(--sp-4)}
.gn-cps button{height:34px;padding:0 var(--sp-3);border-radius:var(--r-pill);border:1px solid var(--line);background:var(--surface);color:var(--ink);font:400 var(--fs-sm) var(--font-ui);cursor:pointer}
#ia .chi{align-items:center;gap:var(--sp-1);border:1px solid var(--line-strong);border-radius:26px;padding:var(--sp-1) var(--sp-1) var(--sp-1) 6px;margin-top:10px}
#ia .chi textarea{border:0;background:transparent;outline:0;resize:none;min-height:44px;padding:11px 4px;font:400 15px/22px var(--font-ui)}
#ia .chi .gn-ib{border-radius:50%}
.gn-snd{width:44px;height:44px;border:0;border-radius:50%;background:var(--brand);color:var(--on-brand);display:grid;place-items:center;cursor:pointer;flex:none}
@media (max-width:600px){.gn-c{padding:var(--sp-4)}.gn-tr{grid-template-columns:1fr 1fr}.gn-tr>:last-child{grid-column:1/-1}}
@media print{.gsh{display:none!important}}
#ia .srt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media (max-width:600px){#own label{max-width:100%;min-width:0;white-space:normal!important;box-sizing:border-box}}
.gn-ut{display:block;margin-top:var(--sp-2);font-size:var(--fs-md);line-height:21px;color:var(--muted)}
.gn-pc{font:400 var(--fs-sm) var(--font-ui);padding:var(--sp-1) 10px;border-radius:var(--r-pill);background:var(--ground);color:var(--muted)}
.gn-pc[hidden]{display:none}
.gn-tb2{display:inline-flex;align-items:center;gap:var(--sp-2);min-height:44px;padding:0 var(--sp-3);border:0;border-radius:var(--r-btn);background:transparent;color:var(--ink);font:500 var(--fs-md) var(--font-ui);cursor:pointer}
.gn-tb2:hover{background:var(--soft)}
.gn-b .mmsg:empty{display:none}
#pdr:empty{display:none}
.gn-hf{cursor:default}