/* =========================================================
   PCB — Espace administrateur
   ========================================================= */
:root{
  --display:"Inter Tight","Inter",system-ui,sans-serif;
  --serif:"Instrument Serif",Georgia,serif;
  --body:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --accent:#f4b41a;--accent-2:#ff8a1f;--accent-ink:#111;
  --green:#22c55e;--red:#ef4444;--blue:#3b82f6;--violet:#a78bfa;--amber:#f59e0b;--gray:#94a3b8;
  --radius:16px;--radius-sm:10px;--radius-lg:22px;
  --ease:cubic-bezier(.22,1,.36,1);
  --side:264px;
}
[data-theme="dark"]{
  --bg:#0a0b0d;--bg-2:#0f1114;--surface:#14171b;--surface-2:#1a1e24;--hover:rgba(255,255,255,.04);
  --line:rgba(255,255,255,.08);--line-2:rgba(255,255,255,.14);
  --ink:#f4f2ee;--ink-2:#c9ccd1;--muted:#8c939c;
  --shadow:0 24px 60px -30px rgba(0,0,0,.8);
  --accent-soft:rgba(244,180,26,.12);
  color-scheme:dark;
}
[data-theme="light"]{
  --bg:#f5f3ee;--bg-2:#efece5;--surface:#ffffff;--surface-2:#fbfaf7;--hover:rgba(0,0,0,.035);
  --line:rgba(17,20,23,.08);--line-2:rgba(17,20,23,.14);
  --ink:#121417;--ink-2:#3a3f46;--muted:#6b7280;
  --shadow:0 20px 50px -30px rgba(17,20,23,.35);
  --accent-soft:rgba(244,180,26,.16);
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:14.5px;line-height:1.55;-webkit-font-smoothing:antialiased;transition:background .3s,color .3s}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0}
img,svg{display:block;max-width:100%}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:8px}
::selection{background:var(--accent);color:#000}
.ic{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ---------- Boot ---------- */
.boot{min-height:100vh;display:grid;place-content:center;justify-items:center;gap:18px}
.boot img{width:64px;border-radius:14px;background:#fff;padding:4px}
.boot span{width:120px;height:2px;background:var(--line);position:relative;overflow:hidden;border-radius:2px}
.boot span::after{content:"";position:absolute;inset:0;width:40%;background:var(--accent);animation:bootbar 1s var(--ease) infinite}
@keyframes bootbar{from{transform:translateX(-100%)}to{transform:translateX(260%)}}

/* ---------- Buttons & inputs ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:42px;padding:0 18px;border-radius:999px;background:var(--accent);color:var(--accent-ink);font-weight:600;font-size:14px;white-space:nowrap;transition:transform .3s var(--ease),filter .3s,background .3s,box-shadow .3s;box-shadow:0 8px 20px -10px rgba(244,180,26,.6)}
.btn:hover{filter:brightness(1.06);transform:translateY(-1px)}
.btn:active{transform:translateY(0) scale(.98)}
.btn[disabled]{opacity:.6;pointer-events:none}
.btn--ghost{background:var(--surface);color:var(--ink);border:1px solid var(--line-2);box-shadow:none}
.btn--ghost:hover{background:var(--hover);filter:none}
.btn--danger{background:rgba(239,68,68,.12);color:var(--red);border:1px solid rgba(239,68,68,.3);box-shadow:none}
.btn--danger:hover{background:var(--red);color:#fff;filter:none}
.btn--wa{background:#25d366;color:#fff;box-shadow:0 8px 20px -10px rgba(37,211,102,.6)}
.btn--sm{height:34px;padding:0 13px;font-size:13px}
.btn--icon{width:42px;padding:0}
.btn--sm.btn--icon{width:34px}
.btn.is-loading{pointer-events:none;opacity:.8}
.btn.is-loading .ic{animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

.input,.select,.textarea{width:100%;height:42px;padding:0 14px;border-radius:12px;border:1px solid var(--line-2);background:var(--surface);transition:border-color .25s,box-shadow .25s;outline:none}
.textarea{height:auto;min-height:110px;padding:12px 14px;resize:vertical;line-height:1.5}
.select{appearance:none;-webkit-appearance:none;padding-right:36px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238c939c' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center;cursor:pointer}
.input:focus,.select:focus,.textarea:focus{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.label{display:block;font-size:12px;font-weight:600;letter-spacing:.04em;color:var(--muted);margin:0 0 6px}
.field{margin-bottom:14px}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 14px}
.search{position:relative;flex:1;min-width:180px}
.search .ic{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--muted);width:16px;height:16px}
.search .input{padding-left:38px}
.check{width:18px;height:18px;accent-color:var(--accent);cursor:pointer}

/* ---------- Login ---------- */
.login{min-height:100vh;display:grid;grid-template-columns:1.1fr 1fr}
.login__art{position:relative;overflow:hidden;background:#000}
.login__art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.75;transform:scale(1.08);animation:kenburns 18s ease-out forwards}
@keyframes kenburns{to{transform:scale(1)}}
.login__art::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(6,7,8,.85),rgba(6,7,8,.35) 60%,rgba(6,7,8,.6))}
.login__brand{position:absolute;z-index:2;left:clamp(28px,4vw,60px);right:clamp(28px,4vw,60px);bottom:clamp(28px,5vw,64px);color:#f4f2ee}
.login__brand h1{font-family:var(--display);font-size:clamp(38px,4vw,64px);line-height:.95;letter-spacing:-.04em;margin:18px 0 12px;font-weight:600}
.login__brand h1 em{font-family:var(--serif);font-weight:400;color:#e9d7aa}
.login__brand p{color:#c9ccd1;max-width:420px;margin:0}
.login__panel{display:grid;place-items:center;padding:32px 20px;background:radial-gradient(ellipse at 70% 0%,rgba(244,180,26,.08),transparent 60%)}
.login__card{width:100%;max-width:400px;animation:rise .8s var(--ease) both}
.login__card h2{font-family:var(--display);font-size:30px;letter-spacing:-.03em;margin:22px 0 6px}
.login__card>p{color:var(--muted);margin:0 0 28px}
.login__logo{display:flex;align-items:center;gap:12px}
.login__logo img,.brand img{width:44px;height:44px;border-radius:12px;background:#fff;padding:3px;object-fit:contain}
.login__logo b,.brand b{display:block;font-family:var(--display);font-size:14px;line-height:1.2}
.login__logo small,.brand small{color:var(--muted);font-size:12px}
.pw{position:relative}
.pw button{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:32px;height:32px;display:grid;place-items:center;color:var(--muted);border-radius:8px}
.alert{padding:11px 14px;border-radius:12px;font-size:13.5px;margin-bottom:14px;background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.3);color:var(--red)}
.login__foot{margin-top:28px;font-size:12.5px;color:var(--muted);display:flex;align-items:center;gap:8px}
@keyframes rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}

/* ---------- Shell ---------- */
.shell{display:grid;grid-template-columns:var(--side) minmax(0,1fr);min-height:100vh}
.side{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:6px;padding:20px 14px;border-right:1px solid var(--line);background:var(--bg-2);z-index:40}
.brand{display:flex;align-items:center;gap:11px;padding:4px 8px 20px;border-bottom:1px solid var(--line);margin-bottom:12px}
.nav{display:grid;gap:3px}
.nav__label{font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);padding:14px 12px 6px}
.nav a{position:relative;display:flex;align-items:center;gap:12px;height:42px;padding:0 12px;border-radius:12px;color:var(--ink-2);font-weight:500;transition:background .25s,color .25s}
.nav a:hover{background:var(--hover);color:var(--ink)}
.nav a.is-active{background:var(--accent-soft);color:var(--ink)}
.nav a.is-active::before{content:"";position:absolute;left:-14px;top:10px;bottom:10px;width:3px;border-radius:0 3px 3px 0;background:var(--accent)}
.nav a.is-active .ic{color:var(--accent)}
.nav .badge{margin-left:auto}
.badge{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 7px;border-radius:999px;background:var(--accent);color:#111;font-size:11.5px;font-weight:700}
.side__foot{margin-top:auto;display:grid;gap:8px}
.me{display:flex;align-items:center;gap:10px;padding:10px;border-radius:14px;border:1px solid var(--line);background:var(--surface)}
.avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#111;font-weight:700;font-size:13px;flex:none}
.me div{min-width:0;flex:1}
.me b{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.me small{display:block;color:var(--muted);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.main{min-width:0;display:flex;flex-direction:column}
.top{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:12px;height:68px;padding:0 clamp(16px,2.6vw,34px);border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--bg) 80%,transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.top__title{font-family:var(--display);font-size:18px;font-weight:600;letter-spacing:-.02em;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top__spacer{flex:1}
/* FR | EN switch (client space) */
.langsw{gap:7px;padding:0 12px;font-size:12px;font-weight:700;letter-spacing:.06em;flex:none}
.langsw span{opacity:.45;transition:opacity .2s,color .2s}
.langsw span.on{opacity:1;color:var(--accent)}
.langsw i{width:1px;height:12px;background:currentColor;opacity:.3}
.login__tools{display:flex;gap:8px;align-items:center}
.burger{display:none}
.page{padding:clamp(18px,2.6vw,34px);animation:pagein .5s var(--ease) both;max-width:1500px;width:100%}
@keyframes pagein{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:24px}
.page-head h2{font-family:var(--display);font-size:clamp(24px,2.4vw,32px);letter-spacing:-.03em;margin:0;font-weight:600}
.page-head h2 em{font-family:var(--serif);font-weight:400;color:var(--accent)}
.page-head p{margin:4px 0 0;color:var(--muted)}
.actions{display:flex;flex-wrap:wrap;gap:8px}
.backlink{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-size:13px;margin-bottom:10px}
.backlink:hover{color:var(--accent)}
.bottomnav{display:none}
.scrim{display:none}

/* ---------- Cards ---------- */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:clamp(16px,1.8vw,24px);box-shadow:var(--shadow)}
.card__head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:16px}
.card__head h3{font-family:var(--display);font-size:16px;margin:0;font-weight:600;letter-spacing:-.01em}
.card__head small{color:var(--muted)}
.kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:16px}
@media (min-width:1500px){.kpis{grid-template-columns:repeat(6,minmax(0,1fr))}}
.kpi{position:relative;overflow:hidden;padding:18px 18px 16px;border-radius:var(--radius-lg);background:var(--surface);border:1px solid var(--line);animation:rise .6s var(--ease) both}
.kpi:nth-child(2){animation-delay:.05s}.kpi:nth-child(3){animation-delay:.1s}.kpi:nth-child(4){animation-delay:.15s}.kpi:nth-child(5){animation-delay:.2s}.kpi:nth-child(6){animation-delay:.25s}
.kpi__top{display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:12.5px;font-weight:500}
.kpi__ico{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent)}
.kpi__ico .ic{width:17px;height:17px}
.kpi__val{font-family:var(--display);font-size:clamp(26px,2.2vw,32px);font-weight:600;letter-spacing:-.03em;margin:12px 0 2px;font-variant-numeric:tabular-nums;white-space:nowrap}
.kpi__sub{font-size:12px;color:var(--muted)}
.up{color:var(--green)}.down{color:var(--red)}
.kpi svg.spark{position:absolute;right:0;bottom:0;width:55%;height:46px;opacity:.6}
.dash{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:16px;margin-bottom:16px}
.chart{width:100%;height:auto;overflow:visible}
.chart .bar{fill:var(--accent);transition:opacity .2s}
.chart .bar:hover{opacity:.75}
.chart .bar--rev{fill:color-mix(in srgb,var(--ink) 18%,transparent)}
.chart text{fill:var(--muted);font-size:11px;font-family:var(--body)}
.chart .grid{stroke:var(--line);stroke-width:1}
.chart .barin{transform-box:fill-box;transform-origin:bottom;animation:grow .9s var(--ease) both}
@keyframes grow{from{transform:scaleY(0)}}
.legend{display:flex;flex-wrap:wrap;gap:14px;font-size:12px;color:var(--muted)}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.donut{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.donut svg{width:150px;height:150px;flex:none}
.donut circle.seg{fill:none;stroke-width:16;transform:rotate(-90deg);transform-origin:center;transition:stroke-width .3s}
.donut circle.seg:hover{stroke-width:20}
.donut__center{font-family:var(--display);font-weight:600}
.donut ul{list-style:none;padding:0;margin:0;display:grid;gap:8px;flex:1;min-width:150px}
.donut li{display:flex;align-items:center;gap:8px;font-size:13px}
.donut li b{margin-left:auto;font-variant-numeric:tabular-nums}
.hbars{display:grid;gap:12px}
.hbar__top{display:flex;justify-content:space-between;font-size:13px;margin-bottom:6px;gap:10px}
.hbar__top span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hbar__track{height:8px;border-radius:8px;background:var(--hover);overflow:hidden}
.hbar__fill{height:100%;border-radius:8px;background:linear-gradient(90deg,var(--accent),var(--accent-2));transform-origin:left;animation:growx 1s var(--ease) both}
@keyframes growx{from{transform:scaleX(0)}}

/* ---------- Pills ---------- */
.pill{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap;background:color-mix(in srgb,var(--c) 14%,transparent);color:var(--c);border:1px solid color-mix(in srgb,var(--c) 30%,transparent)}
.pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.prio{font-size:12px;font-weight:600;display:inline-flex;align-items:center;gap:5px;color:var(--muted)}
.prio--high{color:var(--red)}
.prio--low{color:var(--gray)}

/* ---------- Toolbar & tabs ---------- */
.toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:14px}
.toolbar .select,.toolbar .input[type=date]{width:auto;min-width:150px}
.tabs{display:flex;gap:4px;padding:4px;border-radius:14px;background:var(--surface);border:1px solid var(--line);overflow-x:auto;scrollbar-width:none;margin-bottom:14px}
.tabs::-webkit-scrollbar{display:none}
.tabs button{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;border-radius:10px;font-size:13.5px;font-weight:500;color:var(--muted);white-space:nowrap;transition:background .25s,color .25s}
.tabs button:hover{color:var(--ink)}
.tabs button.is-active{background:var(--accent-soft);color:var(--ink)}
.tabs button span{font-size:11.5px;padding:1px 7px;border-radius:999px;background:var(--hover);font-variant-numeric:tabular-nums}
.tabs button.is-active span{background:var(--accent);color:#111}
.bulk{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 14px;border-radius:14px;background:var(--accent-soft);border:1px solid rgba(244,180,26,.3);margin-bottom:12px;animation:rise .35s var(--ease)}
.bulk b{font-size:13.5px}

/* ---------- Table ---------- */
.table-wrap{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow)}
.table{width:100%;border-collapse:collapse}
.table th{text-align:left;font-size:11.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:13px 14px;border-bottom:1px solid var(--line);background:var(--surface-2);white-space:nowrap}
.table td{padding:13px 14px;border-bottom:1px solid var(--line);vertical-align:middle}
.table tbody tr{transition:background .2s;animation:rowin .45s var(--ease) both}
.table tbody tr:hover{background:var(--hover)}
.table tbody tr.is-link{cursor:pointer}
.table tbody tr:last-child td{border-bottom:0}
@keyframes rowin{from{opacity:0;transform:translateY(6px)}}
.cell-main{font-weight:600}
.cell-sub{display:block;font-size:12.5px;color:var(--muted);max-width:280px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mono{font-family:var(--display);font-weight:600;letter-spacing:.01em;font-variant-numeric:tabular-nums}
.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.dim{color:var(--muted)}
.empty{padding:60px 20px;text-align:center;color:var(--muted)}
.empty .ic{width:42px;height:42px;margin:0 auto 12px;stroke-width:1.2;color:var(--line-2)}
.empty b{display:block;color:var(--ink);font-size:16px;margin-bottom:4px}
.pager{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:14px 4px 0;color:var(--muted);font-size:13px}
.pager .actions{gap:6px}
.skel{height:14px;border-radius:6px;background:linear-gradient(90deg,var(--hover),color-mix(in srgb,var(--ink) 8%,transparent),var(--hover));background-size:200% 100%;animation:shimmer 1.2s infinite}
@keyframes shimmer{to{background-position:-200% 0}}

/* ---------- Detail ---------- */
.detail{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:16px;align-items:start}
.stack{display:grid;gap:16px}
.kv{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 20px}
.kv dt{font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600;margin-bottom:3px}
.kv dd{margin:0;font-weight:500;overflow-wrap:anywhere}
.message{white-space:pre-wrap;line-height:1.65;padding:16px 18px;border-radius:14px;background:var(--surface-2);border:1px solid var(--line)}
.contact-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.timeline{list-style:none;padding:0;margin:0;display:grid;gap:0}
.timeline li{position:relative;padding:0 0 16px 22px;font-size:13px}
.timeline li::before{content:"";position:absolute;left:4px;top:7px;width:8px;height:8px;border-radius:50%;background:var(--accent)}
.timeline li::after{content:"";position:absolute;left:7.5px;top:18px;bottom:0;width:1px;background:var(--line)}
.timeline li:last-child::after{display:none}
.timeline small{display:block;color:var(--muted);font-size:11.5px}
.note{padding:12px 14px;border-radius:12px;background:var(--surface-2);border:1px solid var(--line);margin-bottom:10px;animation:rise .4s var(--ease)}
.note p{margin:0 0 6px;white-space:pre-wrap}
.note footer{display:flex;justify-content:space-between;align-items:center;font-size:11.5px;color:var(--muted)}
.statusbar{display:flex;flex-wrap:wrap;gap:6px}
.statusbar button{height:34px;padding:0 12px;border-radius:999px;border:1px solid var(--line-2);font-size:12.5px;font-weight:600;color:var(--muted);transition:all .25s}
.statusbar button:hover{color:var(--ink);border-color:var(--c)}
.statusbar button.is-active{background:color-mix(in srgb,var(--c) 16%,transparent);color:var(--c);border-color:color-mix(in srgb,var(--c) 45%,transparent)}

/* ---------- Quote editor ---------- */
.items{width:100%;border-collapse:separate;border-spacing:0 8px}
.items th{text-align:left;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600;padding:0 6px}
.items td{padding:0 4px;vertical-align:top}
.items .input{height:40px}
.items td.total{padding-top:10px;text-align:right;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.items tr{animation:rowin .35s var(--ease)}
.totals{display:grid;gap:10px;max-width:360px;margin-left:auto}
.totals div{display:flex;justify-content:space-between;align-items:center;gap:12px}
.totals .input{width:110px;height:36px;text-align:right}
.totals .grand{padding-top:12px;border-top:1px solid var(--line);font-family:var(--display);font-size:22px;font-weight:600;letter-spacing:-.02em}
.totals .grand span:last-child{color:var(--accent)}
.editor{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:16px;align-items:start}
.sticky{position:sticky;top:84px}

/* ---------- Quote document (screen + print) ---------- */
.doc-wrap{display:flex;justify-content:center}
.doc{width:210mm;max-width:100%;min-height:297mm;background:#fff;color:#16181c;border-radius:6px;box-shadow:0 30px 80px -30px rgba(0,0,0,.6);padding:16mm 15mm;font-size:12.5px;line-height:1.5;position:relative;overflow:hidden}
.doc::before{content:"";position:absolute;left:0;top:0;right:0;height:5px;background:linear-gradient(90deg,#e2393f,#f4b41a,#2f6fe0)}
.doc__head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;padding-bottom:16px;border-bottom:2px solid #16181c}
.doc__brand{display:flex;gap:12px;align-items:center}
.doc__brand img{width:58px;height:58px;object-fit:contain}
.doc__brand b{display:block;font-family:var(--display);font-size:16px;letter-spacing:-.01em}
.doc__brand em{font-family:var(--serif);color:#a87800;font-size:14px}
.doc__co{text-align:right;font-size:11px;color:#4b5058;max-width:260px}
.doc__title{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin:22px 0 18px}
.doc__title h1{font-family:var(--display);font-size:34px;letter-spacing:-.03em;margin:0;line-height:1}
.doc__title h1 span{display:block;font-size:13px;letter-spacing:.08em;color:#a87800;margin-top:6px;font-weight:600}
.doc__meta{display:grid;grid-template-columns:auto auto;gap:3px 14px;font-size:11.5px;text-align:right}
.doc__meta dt{color:#6b7078}
.doc__meta dd{margin:0;font-weight:600}
.doc__parties{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:18px}
.doc__box{padding:12px 14px;border-radius:8px;background:#f6f4ef;border:1px solid #ebe6da}
.doc__box h4{margin:0 0 6px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#a87800}
.doc__box p{margin:0}
.doc table{width:100%;border-collapse:collapse;margin-bottom:16px}
.doc th{background:#16181c;color:#fff;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;padding:9px 10px;text-align:left;font-weight:600}
.doc th.num,.doc td.num{text-align:right}
.doc td{padding:9px 10px;border-bottom:1px solid #ebe6da;vertical-align:top}
.doc tbody tr:nth-child(even) td{background:#fbfaf7}
.doc__totals{margin-left:auto;width:280px;display:grid;gap:6px}
.doc__totals div{display:flex;justify-content:space-between}
.doc__totals .grand{margin-top:6px;padding:10px 12px;border-radius:8px;background:#16181c;color:#fff;font-family:var(--display);font-size:16px;font-weight:600}
.doc__totals .grand span:last-child{color:#f4b41a}
.doc__notes{margin-top:22px;display:grid;grid-template-columns:1fr 1fr;gap:16px;font-size:11px;color:#4b5058}
.doc__notes h4{margin:0 0 4px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#16181c}
.doc__notes p{margin:0;white-space:pre-wrap}
.doc__sign{margin-top:28px;display:grid;grid-template-columns:1fr 1fr;gap:30px}
.doc__sign div{border-top:1px solid #b9b3a5;padding-top:6px;font-size:11px;color:#6b7078;min-height:70px}
.doc__foot{position:absolute;left:15mm;right:15mm;bottom:10mm;display:flex;justify-content:space-between;gap:10px;font-size:9.5px;color:#8a8f96;border-top:1px solid #ebe6da;padding-top:6px}
.doc__stamp{position:absolute;right:18mm;top:70mm;transform:rotate(-14deg);padding:8px 16px;border:3px solid;border-radius:8px;font-family:var(--display);font-weight:700;font-size:20px;letter-spacing:.1em;opacity:.22;text-transform:uppercase}

/* ---------- Modal & toasts ---------- */
.modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:20px;background:rgba(5,6,8,.6);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);animation:fade .25s both}
.modal__box{width:100%;max-width:460px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow);animation:pop .4s var(--ease) both}
.modal__box h3{font-family:var(--display);margin:0 0 8px;font-size:20px}
.modal__box p{margin:0 0 20px;color:var(--muted)}
.modal__box .actions{justify-content:flex-end}
@keyframes fade{from{opacity:0}}
@keyframes pop{from{opacity:0;transform:scale(.94) translateY(10px)}}
.toasts{position:fixed;right:18px;bottom:18px;z-index:200;display:grid;gap:10px;max-width:calc(100vw - 36px)}
.toast{display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:14px;background:var(--surface);border:1px solid var(--line-2);box-shadow:var(--shadow);font-size:13.5px;animation:toastin .5s var(--ease) both}
.toast .ic{color:var(--green)}
.toast--error .ic{color:var(--red)}
.toast.is-out{animation:toastout .35s ease forwards}
@keyframes toastin{from{opacity:0;transform:translateY(16px) scale(.96)}}
@keyframes toastout{to{opacity:0;transform:translateX(30px)}}

/* ---------- Shared app components (client + admin) ---------- */
.theme-anim,.theme-anim *{transition:background-color .45s ease,color .45s ease,border-color .45s ease!important}
.is-invalid{border-color:var(--red)!important;box-shadow:0 0 0 4px rgba(239,68,68,.12)!important}
.login__panel{position:relative}
.login__top{position:absolute;top:max(16px,env(safe-area-inset-top));right:16px;left:16px;display:flex;justify-content:space-between;gap:8px;z-index:3}
.login__card--wide{max-width:540px}
.login__switch{margin-top:22px;text-align:center;color:var(--muted);font-size:14px}
.login__switch a,.link{color:var(--accent);font-weight:600}
.seg{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:14px}
.seg label{position:relative;display:flex;align-items:center;gap:12px;padding:14px;border-radius:14px;border:1px solid var(--line-2);background:var(--surface);cursor:pointer;transition:border-color .25s,background .25s}
.seg input{position:absolute;opacity:0;pointer-events:none}
.seg label:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.seg label:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}
.seg .ic{color:var(--accent);width:22px;height:22px}
.seg b{display:block;font-size:14px}
.seg small{display:block;color:var(--muted);font-size:12px;line-height:1.35}
.thread{display:grid;gap:14px;max-height:540px;overflow-y:auto;padding:4px 4px 8px;overscroll-behavior:contain}
.msg{max-width:82%;justify-self:start;animation:rise .4s var(--ease) both}
.msg--me{justify-self:end}
.msg__bubble{display:flex;gap:10px;padding:12px 15px;border-radius:16px 16px 16px 4px;background:var(--surface-2);border:1px solid var(--line);line-height:1.55;overflow-wrap:anywhere}
.msg--me .msg__bubble{border-radius:16px 16px 4px 16px;background:var(--accent-soft);border-color:rgba(244,180,26,.3)}
.msg__bubble .ic{color:var(--accent);margin-top:2px}
.msg--quote .msg__bubble,.msg--decision .msg__bubble{border-style:dashed;border-color:rgba(244,180,26,.5)}
.msg__meta{font-size:11.5px;color:var(--muted);margin-top:5px;padding:0 4px}
.msg--me .msg__meta{text-align:right}
.msg a{color:var(--accent);text-decoration:underline}
.thread__empty{padding:28px;text-align:center;color:var(--muted)}
.thread__empty .ic{width:34px;height:34px;margin:0 auto 8px;stroke-width:1.3}
.composer{display:flex;gap:10px;align-items:flex-end;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.composer .textarea{min-height:48px;height:48px;max-height:180px;resize:none}
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:6px 0 4px}
.step{position:relative;text-align:center;font-size:12px;color:var(--muted);padding:36px 4px 0;line-height:1.3}
.step::before{content:"";position:absolute;top:13px;left:-50%;right:50%;height:2px;background:var(--line-2)}
.step:first-child::before{display:none}
.step i{position:absolute;top:0;left:50%;transform:translateX(-50%);width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);border:2px solid var(--line-2);font-style:normal;font-weight:700;font-size:12px;z-index:1}
.step.is-done{color:var(--ink)}
.step.is-done i{background:var(--accent);border-color:var(--accent);color:#111}
.step.is-done::before,.step.is-current::before{background:var(--accent)}
.step.is-current{color:var(--ink);font-weight:600}
.step.is-current i{border-color:var(--accent);box-shadow:0 0 0 6px var(--accent-soft)}
.step.is-bad i{background:var(--gray);border-color:var(--gray);color:#fff}
.banner{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:14px 18px;border-radius:16px;background:var(--accent-soft);border:1px solid rgba(244,180,26,.35);margin-bottom:18px;animation:rise .5s var(--ease)}
.banner>.ic{color:var(--accent);width:22px;height:22px}
.banner p{margin:0;flex:1;min-width:200px}
.banner--danger{background:rgba(239,68,68,.08);border-color:rgba(239,68,68,.3)}
.banner--danger>.ic{color:var(--red)}
.rlist{display:grid;gap:12px}
.ritem{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px;align-items:center;padding:16px 18px;border-radius:var(--radius-lg);background:var(--surface);border:1px solid var(--line);transition:border-color .3s,transform .4s var(--ease);animation:rise .5s var(--ease) both}
.ritem:hover{border-color:rgba(244,180,26,.4);transform:translateY(-2px)}
.ritem__ico{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent)}
.ritem h4{margin:0 0 3px;font-family:var(--display);font-size:16px;font-weight:600;letter-spacing:-.01em;overflow-wrap:anywhere}
.ritem p{margin:0;color:var(--muted);font-size:13px}
.ritem__side{display:grid;justify-items:end;gap:6px}
.dot-new{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--accent);white-space:nowrap}
.dot-new::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent);animation:pulsedot 1.8s infinite}
@keyframes pulsedot{0%{box-shadow:0 0 0 0 rgba(244,180,26,.6)}70%{box-shadow:0 0 0 8px rgba(244,180,26,0)}100%{box-shadow:0 0 0 0 rgba(244,180,26,0)}}
.hero-card{position:relative;overflow:hidden;border-radius:var(--radius-lg);padding:clamp(22px,3vw,38px);background:linear-gradient(135deg,#14110a,#2a1f07 55%,#3d2c08);color:#f4f2ee;margin-bottom:16px;animation:rise .6s var(--ease) both}
.hero-card::after{content:"";position:absolute;right:-70px;top:-70px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(244,180,26,.35),transparent 70%);pointer-events:none}
.hero-card h2{font-family:var(--display);font-size:clamp(24px,2.6vw,36px);letter-spacing:-.03em;margin:0 0 8px;font-weight:600;position:relative;z-index:1}
.hero-card h2 em{font-family:var(--serif);font-weight:400;color:#f4b41a}
.hero-card p{margin:0 0 20px;color:#d5d2cb;max-width:580px;position:relative;z-index:1}
.hero-card .actions{position:relative;z-index:1}
.hero-card .btn--ghost{background:rgba(255,255,255,.08);color:#f4f2ee;border-color:rgba(255,255,255,.2)}
.checkline{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--muted);margin:4px 0 16px}
.checkline input{margin-top:3px}
.decision{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;padding:16px 18px;border-radius:16px;border:1px solid rgba(244,180,26,.4);background:var(--accent-soft);margin-bottom:18px;animation:rise .5s var(--ease)}
.decision p{margin:0}
.req-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:16px}
.fact{padding:12px 14px;border-radius:14px;background:var(--surface-2);border:1px solid var(--line)}
.fact small{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;font-weight:600;margin-bottom:4px}
.fact small .ic{width:14px;height:14px}
.fact b{font-weight:600;overflow-wrap:anywhere}
.tmp-pass{font-family:var(--display);font-size:22px;font-weight:700;letter-spacing:.06em;text-align:center;padding:14px;border-radius:14px;background:var(--accent-soft);border:1px dashed var(--accent);margin:0 0 18px;user-select:all}
@media (max-width:640px){
  .ritem{grid-template-columns:auto minmax(0,1fr)}
  .ritem__side{grid-column:1/-1;justify-items:start;grid-auto-flow:column;justify-content:start;align-items:center}
  .seg{grid-template-columns:1fr}
  .msg{max-width:94%}
  .step{font-size:10.5px}
  .composer{flex-direction:column;align-items:stretch}
}
/* ---------- Quote editor: quick-add chips ---------- */
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;padding-top:14px;border-top:1px dashed var(--line-2)}
.chips__label{display:flex;align-items:center;gap:6px;width:100%;font-size:12.5px;color:var(--muted);font-weight:500}
.chips__label .ic{width:15px;height:15px;color:var(--accent)}
.chip-btn{display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:6px 12px;border-radius:999px;border:1px dashed var(--line-2);background:var(--surface);font-size:13px;color:var(--ink-2);text-align:left;transition:border-color .25s,background .25s,color .25s,transform .3s var(--ease)}
.chip-btn .ic{width:14px;height:14px;color:var(--accent)}
.chip-btn small{color:var(--muted)}
.chip-btn:hover{border-style:solid;border-color:var(--accent);background:var(--accent-soft);color:var(--ink);transform:translateY(-1px)}
.items .select{height:40px;padding-right:30px;background-position:right 10px center}

/* ---------- Entrance animation (client & admin spaces) ---------- */
.app-preloader{position:fixed;inset:0;z-index:500;display:grid;place-items:center;color:#f4f2ee;pointer-events:none}
.boot-seen .app-preloader{display:none}
.app-preloader__panel{position:absolute;left:0;right:0;height:50.5%;background:#060708;transition:transform 1s cubic-bezier(.77,0,.18,1)}
.app-preloader__panel--1{top:0}
.app-preloader__panel--2{bottom:0}
.app-preloader__inner{position:relative;z-index:1;display:grid;justify-items:center;gap:14px;padding:0 24px;text-align:center;transition:opacity .45s ease,transform .5s var(--ease)}
.app-preloader__logo{width:84px;height:84px;object-fit:contain;border-radius:20px;background:#fff;padding:6px;animation:bootlogo 1s var(--ease) both}
@keyframes bootlogo{from{opacity:0;transform:scale(.6) rotate(-12deg)}}
.app-preloader__space{margin:0;font-size:12px;font-weight:700;letter-spacing:.32em;text-transform:uppercase;color:#f4b41a;animation:rise .8s .15s var(--ease) both}
.app-preloader__count{font-family:var(--display);font-size:clamp(72px,14vw,140px);font-weight:600;line-height:1;letter-spacing:-.05em;font-variant-numeric:tabular-nums}
.app-preloader__count sup{font-size:.35em;color:#f4b41a;vertical-align:super}
.app-preloader__bar{width:min(240px,60vw);height:2px;background:rgba(255,255,255,.1);overflow:hidden;border-radius:2px}
.app-preloader__bar span{display:block;height:100%;width:0;background:linear-gradient(90deg,#e2393f,#f4b41a,#2f6fe0)}
.app-preloader__tag{margin:0;font-family:var(--serif);font-style:italic;font-size:18px;color:#8c939c}
.app-preloader.is-done .app-preloader__inner{opacity:0;transform:translateY(-26px)}
.app-preloader.is-done .app-preloader__panel--1{transform:translateY(-101%)}
.app-preloader.is-done .app-preloader__panel--2{transform:translateY(101%)}
@media (prefers-reduced-motion:reduce){.app-preloader{display:none}}
@media print{.app-preloader{display:none}}
/* ---------- Print-only header ---------- */
.print-head{display:none}

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width:1180px){
  .dash,.detail,.editor{grid-template-columns:minmax(0,1fr)}
  .sticky{position:static}
}
@media (max-width:900px){
  .shell{grid-template-columns:minmax(0,1fr)}
  .side{position:fixed;left:0;top:0;bottom:0;width:min(300px,84vw);transform:translateX(-102%);transition:transform .45s var(--ease);box-shadow:var(--shadow)}
  .is-drawer .side{transform:none}
  .scrim{display:block;position:fixed;inset:0;z-index:35;background:rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:opacity .3s}
  .is-drawer .scrim{opacity:1;pointer-events:auto}
  .burger{display:inline-flex}
  .top{height:60px}
  .main{padding-bottom:calc(74px + env(safe-area-inset-bottom))}
  .bottomnav{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;left:0;right:0;bottom:0;z-index:30;padding:6px 8px calc(6px + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--bg-2) 92%,transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-top:1px solid var(--line)}
  .bottomnav a{display:grid;justify-items:center;gap:3px;padding:6px 0;border-radius:12px;font-size:11px;color:var(--muted);position:relative}
  .bottomnav a.is-active{color:var(--accent)}
  .bottomnav .badge{position:absolute;top:0;left:calc(50% + 6px);min-width:18px;height:18px;font-size:10px;padding:0 5px}
  .top .hide-sm{display:none}
  /* tables become cards */
  .table thead{display:none}
  .table,.table tbody,.table tr,.table td{display:block;width:100%}
  .table tbody tr{position:relative;padding:14px 16px;border-bottom:1px solid var(--line)}
  .table td{padding:2px 0;border:0}
  .table td[data-label]::before{content:attr(data-label);display:inline-block;min-width:92px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
  .table td.td-check{position:absolute;right:14px;top:14px;width:auto}
  .table td.num{text-align:left}
  .cell-sub{max-width:none;white-space:normal}
  .doc{padding:8mm 6mm;min-height:0;font-size:11.5px}
  .doc__parties,.doc__notes,.doc__sign{grid-template-columns:1fr}
  .doc__head{flex-direction:column}
  .doc__co{text-align:left}
  .doc__title{flex-direction:column;align-items:flex-start}
  .doc__meta{text-align:left}
  .doc__foot{position:static;margin-top:20px;flex-direction:column}
  .doc__totals{width:100%}
  .items thead{display:none}
  .items,.items tbody,.items tr{display:block}
  .items tr{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:8px;padding:12px;border-radius:14px;background:var(--surface-2);border:1px solid var(--line);margin-bottom:10px}
  .items td{padding:0}
  .items td:first-child{grid-column:1/-1}
  .items td.total{grid-column:1/-2;text-align:left;padding-top:0}
}
@media (max-width:640px){
  .login{grid-template-columns:1fr}
  .login__art{display:none}
  .grid2,.grid3,.kv{grid-template-columns:minmax(0,1fr)}
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .kpi{padding:14px}
  .kpi svg.spark{display:none}
  .toolbar>*{flex:1 1 100%}
  .toolbar .select,.toolbar .input[type=date]{width:100%}
  .page-head .actions{width:100%}
  .page-head .actions .btn{flex:1}
  .totals{max-width:none}
  .items tr{grid-template-columns:1fr 1fr}
  .items td.total{grid-column:1/-1}
}

/* =========================================================
   Print
   ========================================================= */
@media print{
  @page{size:A4;margin:12mm}
  :root,[data-theme="dark"],[data-theme="light"]{--bg:#fff;--bg-2:#fff;--surface:#fff;--surface-2:#fafafa;--ink:#111;--ink-2:#333;--muted:#666;--line:#ddd;--line-2:#ccc;--hover:transparent;--shadow:none}
  body{background:#fff;color:#111;font-size:11.5px}
  .side,.top,.bottomnav,.scrim,.toasts,.no-print,.composer,.banner,.decision,.login__top,.toolbar,.tabs,.bulk,.pager,.actions,.td-check,.backlink{display:none!important}
  .shell{display:block}
  .page{padding:0;animation:none;max-width:none}
  .print-head{display:flex!important;justify-content:space-between;align-items:center;border-bottom:2px solid #111;padding-bottom:8px;margin-bottom:14px}
  .print-head img{width:40px;height:40px;object-fit:contain}
  .print-head b{font-size:15px}
  .table-wrap,.card{box-shadow:none;border-color:#ddd}
  .table thead{display:table-header-group}
  .table,.table tbody{display:table;width:100%}
  .table tr{display:table-row;page-break-inside:avoid}
  .table td,.table th{display:table-cell;padding:6px 8px}
  .table td[data-label]::before{display:none}
  .table tbody tr{animation:none}
  .cell-sub{white-space:normal;max-width:none}
  .pill{border:1px solid #999;background:none;color:#111}
  /* quote document */
  .doc-wrap{display:block}
  .doc{width:auto;min-height:0;box-shadow:none;border-radius:0;padding:0;font-size:11.5px}
  .doc::before{top:-12mm}
  .doc__foot{position:fixed;left:0;right:0;bottom:0}
  .doc *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .page-head{display:none}
  .page-head.print-keep{display:block}
  .detail,.dash,.editor{display:block}
  .detail .card{margin-bottom:12px;page-break-inside:avoid}
}