@font-face{font-family:"Geist";src:url(/assets/fonts/geist.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Geist Mono";src:url(/assets/fonts/geist-mono.woff2) format("woff2");font-weight:100 900;font-display:swap}
:root{--bg:#fafafa;--card:#fff;--ink:#18181b;--ink2:#3f3f46;--muted:#6b6b74;--line:#e4e4e7;--line2:#f4f4f5;--accent:#a85a24;--accent-h:#9a5222;--accent-soft:#f7ece3;--ok:#3f6212;--ok-soft:#ecf5dc;--warn:#92400e;--warn-soft:#fbeedc;--bad:#9f1239;--bad-soft:#fbe4ea;--info:#1e3a8a;--info-soft:#e3e9f8;--side:#fff;--side2:#f4f4f5;--side-ink:#52525b;--side-on:#18181b;--go:#15803d;--go-soft:#e9f6ec;--go-line:#bfe3c8;--stop:#b91c1c;--stop-soft:#fdecec;--stop-line:#f2c4c4;--radius:12px;--r-sm:8px;--r-lg:14px;--ctl:36px;--pad:20px;--gap:16px;--ease:cubic-bezier(.16,1,.3,1);--shadow:0 1px 2px rgba(24,24,27,.04),0 8px 24px -12px rgba(24,24,27,.10)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.5 "Geist",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;font-feature-settings:"ss01","cv11"}
a{color:var(--ink);text-decoration:none;text-underline-offset:3px}a:hover{text-decoration:underline}
h1{font-size:26px;font-weight:600;margin:0;letter-spacing:-.03em;line-height:1.15}
h2{font-size:17px;font-weight:600;margin:0 0 14px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;row-gap:4px;color:var(--ink);letter-spacing:-.015em;min-height:var(--ctl)}
h2>.muted,h2>.small,h2 .count{font-weight:450}
h2>.right,h2>.btn,h2>form{margin-left:auto}
h3{font-size:12px;margin:20px 0 8px;text-transform:uppercase;letter-spacing:.09em;color:var(--muted);font-weight:600}
.right{margin-left:auto}.muted{color:var(--muted)}.small{font-size:12px}.nowrap{white-space:nowrap}.strong{font-weight:600}.pos{color:var(--ok)}.neg{color:var(--bad)}.mt{margin-top:10px}.inline{display:inline}
.num,.mono,.tile b,.kpi b,.calc td{font-family:"Geist Mono","Geist",ui-monospace,SFMono-Regular,Menlo,monospace;font-variant-numeric:tabular-nums;font-feature-settings:normal}
code{font-family:"Geist Mono",ui-monospace,Menlo,monospace;font-size:12px;background:var(--line2);padding:1px 5px;border-radius:4px}

/* --- shell --- */
.shell{display:flex;min-height:100vh}
.side{width:232px;flex:none;background:var(--side);color:var(--side-ink);display:flex;flex-direction:column;position:sticky;top:0;height:100vh;padding:18px 12px 12px;border-right:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;color:var(--ink);font-size:15px;padding:2px 8px 20px;letter-spacing:-.015em}.brand b{font-weight:600;color:var(--ink)}.brand:hover{text-decoration:none}
.logo{width:28px;height:28px;border-radius:8px;background:var(--accent);display:grid;place-items:center;color:#fff;flex:none}
.logo svg{width:20px;height:20px;display:block}
.side nav{display:flex;flex-direction:column;gap:1px}
.side nav a{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;color:var(--side-ink);font-weight:500;font-size:14px;transition:background .25s var(--ease),color .25s var(--ease),transform .25s var(--ease)}
.side nav a svg{width:17px;height:17px;opacity:.75;transition:opacity .25s}
.side nav a:hover{background:var(--side2);color:var(--ink);text-decoration:none}.side nav a:active{transform:scale(.98)}
.side nav a.on{background:var(--accent-soft);color:#8a4a1e;font-weight:600}.side nav a.on svg{color:var(--accent);opacity:1}
.side-foot{margin-top:auto;display:flex;align-items:center;gap:10px;padding:12px 6px 0;border-top:1px solid var(--line)}
.avatar{width:30px;height:30px;border-radius:8px;background:var(--accent-soft);color:var(--accent-h);display:grid;place-items:center;font-weight:600}
.who{display:flex;flex-direction:column;line-height:1.25;font-size:13px}.who b{color:var(--ink);font-weight:600}.who span{color:var(--muted);font-size:12px}
.iconbtn{margin-left:auto;background:none;border:0;color:var(--muted);cursor:pointer;padding:6px;border-radius:6px;transition:all .25s var(--ease)}.iconbtn:hover{background:var(--side2);color:var(--ink)}.iconbtn svg{width:17px;height:17px}
.mainwrap{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 32px 14px;background:var(--bg);position:sticky;top:0;z-index:5}
main{padding:6px 32px 48px;max-width:1440px;width:100%}
@media(max-width:900px){
  .shell{flex-direction:column}
  .side{width:100%;height:auto;position:sticky;top:0;z-index:20;flex-direction:column;padding:8px 12px 0;gap:6px}
  .side .brand{padding:4px 2px;font-size:14px;order:1}
  .side-foot{order:1;border:0;padding:0;margin:0 0 0 auto;position:absolute;right:12px;top:8px}
  .side .who{display:none}.side .avatar{width:28px;height:28px;font-size:12px}
  .side nav{order:2;flex-direction:row;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:4px;margin:0 -12px;padding:0 12px 8px}
  .side nav::-webkit-scrollbar{display:none}
  .side nav a{flex:none;padding:7px 12px;font-size:13px;border-radius:999px;background:var(--side2);white-space:nowrap}
  .side nav a.on{background:var(--accent-soft);color:#8a4a1e}
  main,.topbar{padding:14px}
  .topbar{position:static}
}

/* --- sections --- */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:var(--pad);margin-bottom:var(--gap);animation:rise .6s var(--ease) both;box-shadow:0 1px 2px rgba(24,24,27,.03)}
/* Section « nue » : pas de boîte, un filet et de l'espace. Le blanc est réservé à ce qui doit se détacher. */
.sec{margin:0 0 30px;animation:rise .6s var(--ease) both}
.sec>h2{padding-bottom:10px;border-bottom:1px solid var(--line);margin-bottom:14px}
.sec+.sec{margin-top:34px}
.card>*:last-child{margin-bottom:0}
.card:nth-of-type(2){animation-delay:60ms}.card:nth-of-type(3){animation-delay:120ms}.card:nth-of-type(4){animation-delay:180ms}
.grid2{display:grid;grid-template-columns:1.6fr 1fr;gap:20px;align-items:start}.grid2.wide-left{grid-template-columns:2fr 1fr}.grid2.wide-right{grid-template-columns:1fr 1.7fr}.grid2.even{grid-template-columns:1fr 1fr}
.grid2>*,.board>*,.rail-list>*{min-width:0}
@media(max-width:1100px){.grid2,.grid2.wide-left,.grid2.wide-right,.grid2.even{grid-template-columns:1fr}}
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* metrics strip : pas de boîtes, des filets */
.tiles{display:grid;grid-template-columns:repeat(4,1fr);margin:6px 0 26px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.tile{padding:18px 22px 18px 0;display:flex;flex-direction:column;gap:3px;color:var(--ink);border-left:1px solid var(--line);padding-left:22px;animation:rise .6s var(--ease) both}
.tile:first-child{border-left:0;padding-left:0}.tile:nth-child(2){animation-delay:60ms}.tile:nth-child(3){animation-delay:120ms}.tile:nth-child(4){animation-delay:180ms}
.tile:hover{text-decoration:none}.tile:hover b{color:var(--accent)}
.tile span{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:600}.tile b{font-size:30px;font-weight:500;letter-spacing:-.03em;line-height:1.1;transition:color .25s}.tile small{color:var(--muted)}
@media(max-width:1000px){.tiles{grid-template-columns:repeat(2,1fr)}.tile:nth-child(3){border-left:0;padding-left:0}}

.empty{display:flex;flex-direction:column;gap:6px;align-items:flex-start;color:var(--muted);background:none;border:1px dashed var(--line);border-radius:var(--r-sm);padding:22px 20px;margin:0;line-height:1.55}
.empty b{color:var(--ink);font-weight:600}
.empty .btn{margin-top:6px}

.onboard{border-color:#ead7c6;background:linear-gradient(160deg,#fff,var(--accent-soft))}
.steps{margin:0;padding-left:0;list-style:none;display:grid;gap:12px;counter-reset:s}
.steps li{display:grid;grid-template-columns:28px 1fr;gap:4px 12px;counter-increment:s}.steps li::before{content:counter(s);grid-row:1/3;width:26px;height:26px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-family:"Geist Mono",monospace;font-size:12px}
.steps li b{font-weight:600}.steps li span{color:var(--ink2);grid-column:2}.steps li.done{opacity:.55}.steps li.done::before{background:var(--ok)}

/* --- tables --- */
.scroll-x{overflow-x:auto;-webkit-overflow-scrolling:touch}
.scroll-x>.tbl{min-width:640px}
.tbl{width:100%;border-collapse:collapse}.tbl th,.tbl td{padding:12px 12px;border-bottom:1px solid var(--line2);text-align:left;vertical-align:top}
.tbl th:first-child,.tbl td:first-child{padding-left:0}.tbl th:last-child,.tbl td:last-child{padding-right:0}.tbl thead th{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:600;border-bottom:1px solid var(--line)}
.tbl tbody tr{transition:background .2s var(--ease)}.tbl tbody tr:hover{background:var(--line2)}
.sec .tbl tbody tr:hover{background:#fff;box-shadow:0 1px 2px rgba(24,24,27,.05)}.tbl .num{text-align:right;white-space:nowrap}
.tbl tr.risk-high td:first-child{box-shadow:inset 2px 0 0 var(--bad)}.tbl tr.risk-warn td:first-child{box-shadow:inset 2px 0 0 #d97706}
.tbl.small td,.tbl.small th{padding:6px 8px;font-size:13px}
.tbl a{color:var(--ink);font-weight:500}
.tbl .reco-cell{font-size:16px;font-weight:600;color:var(--accent);letter-spacing:-.02em}
.tbl .vcell a{font-weight:600;letter-spacing:-.01em}.tbl a:hover{color:var(--accent)}
.sig{display:inline-block;max-width:100%;overflow-wrap:anywhere;font-size:12px;padding:2px 8px;border-radius:999px;background:var(--line2);color:var(--ink2);margin:1px 3px 1px 0;white-space:nowrap;font-weight:500}
.sig-high{background:var(--bad-soft);color:var(--bad)}.sig-warn{background:var(--warn-soft);color:var(--warn)}.sig-info{background:var(--info-soft);color:var(--info)}
.signals{margin:0 0 18px;display:flex;flex-wrap:wrap;gap:4px}
.status{font-size:12px;padding:2px 9px;border-radius:999px;background:var(--line2);font-weight:600;color:var(--ink2)}.st-encheri{background:var(--info-soft);color:var(--info)}.st-achete{background:var(--ok-soft);color:var(--ok)}.st-ecarte{background:var(--line2);color:var(--muted)}.st-perdu{background:var(--bad-soft);color:var(--bad)}
.flash{padding:11px 14px;border-radius:var(--r-sm);margin-bottom:14px;background:var(--line2);border:1px solid var(--line);animation:rise .5s var(--ease) both}.flash-ok{background:var(--ok-soft);color:var(--ok);border-color:#d5e6b9}.flash-err{background:var(--bad-soft);color:var(--bad);border-color:#f3c6d2}.flash-info{background:var(--info-soft);color:var(--info);border-color:#c7d2ef}
.code{font-family:"Geist Mono",monospace;font-size:17px;letter-spacing:2px;font-weight:600;background:#fff;padding:2px 8px;border-radius:6px}

/* --- forms / buttons --- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:var(--ctl);background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);padding:0 14px;white-space:nowrap;color:var(--ink);cursor:pointer;font:inherit;font-weight:500;font-size:13px;line-height:1.2;transition:all .25s var(--ease);box-shadow:0 1px 1px rgba(24,24,27,.04)}
.btn:hover{background:var(--line2);border-color:#d4d4d8;text-decoration:none}.btn:active{transform:translateY(1px) scale(.985)}
.stbtn:active,.seg a:active,.tile:active,.deadline:active{transform:translateY(1px)}
.vcard{will-change:transform}
.btn.primary{background:var(--ink);border-color:var(--ink);color:#fff}.btn.primary:hover{background:#000;background:#27272a}.btn.small{height:30px;padding:0 10px;font-size:12px}.btn.danger{color:var(--bad);border-color:#f3c6d2}.btn.danger:hover{background:var(--bad-soft)}.btn.full{grid-column:1/-1;justify-content:center}
input:not([type=checkbox]):not([type=radio]),select,textarea{font:inherit;height:var(--ctl);padding:0 11px;border:1px solid var(--line);border-radius:var(--r-sm);background:#fff;width:100%;color:var(--ink);transition:border-color .2s,box-shadow .2s}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
input.short{width:70px;display:inline-block}
input[type=checkbox],input[type=radio]{width:16px;height:16px;min-height:0;margin:0;padding:0;accent-color:var(--accent);flex:none;vertical-align:middle;cursor:pointer}
.tbl td input[type=checkbox],.tbl th input[type=checkbox]{width:17px;height:17px}
.filters,.toolbar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px;align-items:center}.toolbar .right{margin-left:auto}.filters input,.filters select{width:auto}.filters input[name=q]{min-width:240px}
label.chk{display:flex;align-items:center;gap:6px;font-weight:500;color:var(--ink2)}label.chk input{width:auto}
.grid-form{display:grid;grid-template-columns:1fr 1fr;gap:12px 14px}.grid-form label{display:flex;flex-direction:column;gap:5px;font-size:12px;color:var(--ink2);font-weight:500}.grid-form label.full{grid-column:1/-1}.grid-form .btn{align-self:end}
textarea{width:100%;height:auto;padding:9px 11px;line-height:1.5}
select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2371717a' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 9px center;background-size:15px;padding-right:30px}

/* --- vehicle page --- */
.vhead{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px}.vhead form select{width:auto}
.kpis{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;gap:0;margin-bottom:16px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.kpis-3{grid-template-columns:1.5fr 1fr 1fr}@media(max-width:1100px){.kpis,.kpis-3{grid-template-columns:repeat(2,1fr)}}
.kpi{padding:16px 20px 16px 0;border-left:1px solid var(--line);padding-left:20px;animation:rise .6s var(--ease) both}.kpi:first-child{border-left:0;padding-left:0}.kpi:nth-child(2){animation-delay:60ms}.kpi:nth-child(3){animation-delay:120ms}.kpi:nth-child(4){animation-delay:180ms}.kpi:nth-child(5){animation-delay:240ms}
.kpi span{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:600}.kpi b{display:block;font-size:22px;font-weight:500;margin-top:3px;letter-spacing:-.03em;line-height:1.15}.kpi.big b{font-size:40px;color:var(--accent);letter-spacing:-.04em}.kpi small{color:var(--muted);display:block;margin-top:2px}
.kpi.vat-0 b{color:var(--warn)}.kpi.text b{font-family:"Geist",sans-serif;font-size:18px;font-weight:600;font-variant-numeric:normal}
.calc th{font-weight:400;width:55%;color:var(--ink2)}.calc td input{max-width:160px;display:inline-block;text-align:right}.calc td small{display:block;text-align:right;font-family:"Geist",sans-serif}
.calc tr.total th,.calc tr.total td{font-weight:600;background:var(--line2)}.calc tr.big td{font-size:19px;color:var(--accent)}
.actions{margin-top:12px}
.props{display:grid;grid-template-columns:190px 1fr;gap:6px 12px;margin:0}.props dt{color:var(--muted)}.props dd{margin:0}
.raw{white-space:pre-wrap;background:var(--line2);padding:12px 14px;border-radius:var(--r-sm)}
.doc{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--line2)}.doc svg{width:18px;height:18px;color:var(--muted);flex:none}
.pending{display:inline-block;height:12px;width:120px;border-radius:6px;background:linear-gradient(90deg,var(--line2) 25%,#eaeaec 50%,var(--line2) 75%);background-size:200% 100%;animation:shimmer 1.6s linear infinite;vertical-align:middle}
@keyframes shimmer{from{background-position:200% 0}to{background-position:-200% 0}}
.bars{display:flex;align-items:flex-end;gap:6px;height:140px;margin:6px 0 16px;padding-bottom:22px;position:relative}
.bar{flex:1;display:flex;flex-direction:column;justify-content:flex-end;height:100%;position:relative;min-width:0}.bar i{display:block;background:var(--ink);border-radius:3px 3px 0 0;min-height:2px;transition:background .25s;transform-origin:bottom;animation:grow .8s var(--ease) both}.bar:hover i{background:var(--accent)}.bar span{position:absolute;bottom:-20px;left:0;right:0;text-align:center;font-size:12px;color:var(--muted);font-family:"Geist Mono",monospace}.bar b{position:absolute;top:-16px;left:0;right:0;text-align:center;font-size:12px;font-family:"Geist Mono",monospace;font-weight:500}
@keyframes grow{from{transform:scaleY(0)}to{transform:none}}

/* --- auth (split screen) --- */
body.auth{display:grid;grid-template-columns:1.1fr 1fr;min-height:100dvh;background:var(--bg)}
.auth-side{background:#18181b;color:#e4e4e7;padding:48px;display:flex;flex-direction:column;justify-content:space-between}
.auth-side .brand,.auth-side .brand b{padding:0;color:#fff}.auth-side h2{font-size:34px;font-weight:500;letter-spacing:-.03em;line-height:1.1;color:#fff;max-width:14ch;display:block;margin:0 0 14px}
.auth-side p{color:#a1a1aa;max-width:46ch;line-height:1.6;margin:0}.auth-side .foot{color:#52525b;font-size:12px}
.auth-main{display:flex;align-items:center;justify-content:center;padding:32px}
.auth-card{width:min(380px,100%);padding:0;border:0;background:none;animation:rise .6s var(--ease) both}.auth-card h1{font-size:24px;font-weight:600;letter-spacing:-.03em;margin-bottom:6px}.auth-card .lead{color:var(--muted);margin:0 0 18px}
.auth-card label{display:block;margin:12px 0;color:var(--ink2);font-size:13px;font-weight:500}.auth-card label input{margin-top:5px}.auth-card .btn{width:100%;margin-top:12px;justify-content:center;padding:10px}
@media(max-width:900px){body.auth{grid-template-columns:1fr}.auth-side{padding:28px}.auth-side h2{font-size:26px}}

/* --- rail des clôtures (signature) --- */
.rail{margin:4px 0 26px;animation:rise .6s var(--ease) both}
.rail-head{display:flex;align-items:baseline;gap:12px;margin-bottom:10px}.rail-head h2{margin:0}
.rail-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:12px}
.deadline{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;gap:2px 16px;align-items:center;background:#fff;border:1px solid var(--line);border-left:3px solid var(--ink);border-radius:var(--radius);padding:14px 16px;transition:border-color .3s,transform .3s var(--ease)}
.deadline:hover{transform:translateY(-1px)}
.deadline.u-soon{border-left-color:#d97706}.deadline.u-now{border-left-color:var(--bad)}.deadline.u-past{border-left-color:var(--muted);opacity:.75}
.dl-time{grid-row:1/3;display:flex;flex-direction:column;align-items:flex-end;min-width:76px;padding-right:16px;border-right:1px solid var(--line2)}
.dl-count{font-family:"Geist Mono",monospace;font-size:26px;font-weight:500;letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}
.u-soon .dl-count{color:#b45309}.u-now .dl-count{color:var(--bad);animation:tick 1s steps(2,end) infinite}
.dl-unit{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.dl-body{display:flex;flex-direction:column;gap:2px;min-width:0}.dl-body a{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dl-act{grid-column:2;display:flex;gap:6px;margin-top:4px;flex-wrap:wrap;min-width:0}
.dl-act .btn{max-width:100%}
@keyframes tick{50%{opacity:.55}}
.btns{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.results .outcome{white-space:nowrap}.results .outcome label{display:inline-flex;align-items:center;gap:4px;margin-right:10px;font-size:13px}.results .outcome input{width:auto}
.results td input[type=text]{max-width:130px;display:inline-block;text-align:right}
.results tr.tracked{background:var(--info-soft)}

/* --- photos --- */
.gallery{display:grid;grid-template-columns:2fr repeat(4,1fr);grid-auto-rows:92px;gap:6px;margin-bottom:16px;position:relative}
.gallery a{display:block;overflow:hidden;border-radius:var(--r-sm);background:var(--line2)}.gallery a.main{grid-row:1/3;grid-column:1}.gallery img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease)}.gallery a:hover img{transform:scale(1.03)}
.gallery .more{position:absolute;right:8px;bottom:8px;background:rgba(24,24,27,.8);color:#fff;font-size:12px;padding:2px 8px;border-radius:999px}
@media(max-width:900px){.gallery{grid-template-columns:repeat(3,1fr);grid-auto-rows:80px}.gallery a.main{grid-row:1/3;grid-column:1/3}}
.vcell{display:flex;gap:10px;align-items:flex-start;min-width:0}.vthumb{width:64px;height:44px;object-fit:cover;border-radius:6px;flex:none;background:var(--line2);cursor:zoom-in;transition:transform .15s var(--ease),box-shadow .15s var(--ease)}.vthumb:hover{transform:scale(1.07);box-shadow:0 3px 12px rgba(0,0,0,.2)}
/* Vignette d'annonce : centrée dans sa ligne (le titre en fait deux ou trois), agrandie au survol. */
.tbl .thumb{width:64px;padding-right:0;vertical-align:middle;text-align:center}
.tbl .thumb img{width:60px;height:44px;object-fit:cover;border-radius:6px;display:block;margin:0 auto;cursor:zoom-in;transition:transform .15s var(--ease),box-shadow .15s var(--ease)}
.tbl .thumb img:hover{transform:scale(1.07);box-shadow:0 3px 12px rgba(0,0,0,.2)}
.imgzoom{position:fixed;z-index:60;pointer-events:none;padding:6px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 18px 40px -12px rgba(0,0,0,.35)}
.imgzoom img{display:block;width:340px;height:255px;object-fit:cover;border-radius:8px;background:var(--line2)}
.market td{vertical-align:middle}

/* --- fiche : la promesse d'abord --- */
.hero{display:grid;grid-template-columns:1.4fr 1fr;gap:0;border:1px solid var(--line);border-radius:var(--radius);background:#fff;margin-bottom:14px;overflow:hidden;animation:rise .6s var(--ease) both}
.hero-main{padding:22px 26px;background:linear-gradient(160deg,#fff,var(--accent-soft))}
.hero .lbl{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:600}
.hero .huge{display:block;font-family:"Geist Mono",monospace;font-size:52px;font-weight:500;letter-spacing:-.05em;line-height:1.05;color:var(--accent);margin:4px 0 8px;font-variant-numeric:tabular-nums}
.explain{margin:0;color:var(--ink2);line-height:1.5;max-width:60ch}
.hero-side{display:grid;grid-template-columns:1fr 1fr;border-left:1px solid var(--line)}
.kv{padding:14px 16px;border-bottom:1px solid var(--line2);border-right:1px solid var(--line2)}.kv span{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:600}.kv b{display:block;font-family:"Geist Mono",monospace;font-size:19px;font-weight:500;letter-spacing:-.03em;margin-top:3px;font-variant-numeric:tabular-nums}.kv b.txt{font-family:"Geist",sans-serif;font-weight:600;font-size:16px}.kv small{color:var(--muted);display:block}
@media(max-width:1100px){.hero{grid-template-columns:1fr}.hero-side{border-left:0;border-top:1px solid var(--line)}.hero .huge{font-size:40px}}
.more-card summary{cursor:pointer;font-weight:600;font-size:13px}
.mt0{margin-top:0}
.auth-main.solo{grid-column:1/-1}

/* --- statuts en gros boutons --- */
.statusbar{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:0 0 14px}.stbtn{height:var(--ctl);padding:0 14px;border:1px solid var(--line);background:#fff;border-radius:var(--r-sm);font:inherit;font-weight:600;cursor:pointer;transition:all .2s var(--ease)}.stbtn:hover{background:var(--line2)}
.stbtn.on{background:var(--ink);color:#fff;border-color:var(--ink)}.stbtn.st-encheri.on{background:#1e3a8a;border-color:#1e3a8a}.stbtn.st-a_suivre.on{background:#b45309;border-color:#b45309}.stbtn.st-achete.on{background:#3f6212;border-color:#3f6212}.stbtn.st-perdu.on{background:#9f1239;border-color:#9f1239}.stbtn.st-ecarte.on{background:#71717a;border-color:#71717a}
.st-a_suivre{background:var(--warn-soft);color:var(--warn)}.st-en_stock{background:var(--info-soft);color:var(--info)}.st-vendu{background:var(--ok-soft);color:var(--ok)}
.ttc{margin:0 0 8px;color:var(--ink2)}.ttc b{font-family:"Geist Mono",monospace}

/* --- vue par étape --- */
.seg{display:inline-flex;border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden;height:var(--ctl);background:#fff}.seg a{display:flex;align-items:center}.seg a{padding:6px 12px;font-size:13px;font-weight:600;color:var(--ink2)}.seg a.on{background:var(--ink);color:#fff}.seg a:hover{text-decoration:none}
.board{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;align-items:start}@media(max-width:1500px){.board{grid-template-columns:repeat(3,1fr)}}@media(max-width:1100px){.board{grid-template-columns:repeat(2,1fr)}}@media(max-width:700px){.board{grid-template-columns:1fr}}
.board-aide{margin:0 0 10px}
/* Vente close, enchère posée : une question, deux réponses, rien d'autre. */
.statuer-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.statuer-list li{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card)}
.statuer-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.statuer-body a{font-weight:600;overflow-wrap:anywhere}
.statuer-list form{display:flex;gap:6px;flex:none}
@media(max-width:700px){.statuer-list li{flex-wrap:wrap}.statuer-list form{width:100%}}
/* glisser-déposer : la fiche suit le curseur, la colonne visée s'éclaire */
.vcard[draggable=true]{cursor:grab}.vcard.dragging{opacity:.45;cursor:grabbing}
.board .col.over{background:var(--accent-soft);outline:2px dashed var(--accent);outline-offset:2px}
.board .col{container-type:inline-size}
.col{background:var(--line2);border-radius:var(--radius);padding:12px;min-height:120px}
.col header b{letter-spacing:-.01em}.col header{display:flex;align-items:baseline;gap:8px;padding:2px 4px 10px;flex-wrap:wrap}.col header b{font-size:13px}.col header .count{font-family:"Geist Mono",monospace;font-size:12px;color:var(--muted)}.col header small{flex-basis:100%;color:var(--muted);font-size:12px}
.col-encheri{background:#e8edf9}.col-a_suivre{background:#f6ecdf}
.vcard{background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden;margin-bottom:10px;display:grid;grid-template-columns:76px 1fr;transition:transform .25s var(--ease),box-shadow .25s}.vcard:hover{transform:translateY(-1px);box-shadow:var(--shadow)}
.vcard.risk-high{border-left:3px solid var(--bad)}.vcard.risk-warn{border-left:3px solid #d97706}
.vcard-photo{display:block;background:var(--line2);min-height:76px}.vcard-photo img{width:100%;height:100%;object-fit:cover;display:block}
.vcard-nophoto{grid-template-columns:1fr}
.vcard-body{padding:10px 12px;min-width:0}.vcard-title{display:block;font-weight:600;font-size:13px;line-height:1.35;letter-spacing:-.01em;margin-bottom:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vcard-meta{color:var(--muted);font-size:12px}.vcard-meta .warn{color:var(--warn)}
.vcard-foot{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:8px;padding-top:8px;border-top:1px solid var(--line2)}.vcard-move{margin-left:auto}.vcard-move select{width:auto;padding:2px 6px;font-size:12px;border-radius:6px}
.due{font-size:12px;font-weight:600;padding:2px 7px;border-radius:999px;background:var(--line2);color:var(--ink2)}.due.soon{background:var(--warn-soft);color:var(--warn)}.due.now{background:var(--bad-soft);color:var(--bad)}.due.past{color:var(--muted)}
/* --- calendrier --- */
.cal-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}.cal-head h2{margin:0;font-size:16px;text-transform:capitalize}
.cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}.cal-dow{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);padding:4px 6px;font-weight:600}
.cal-day{min-height:92px;border:1px solid var(--line2);border-radius:var(--r-sm);padding:6px;background:#fff}.cal-day.out{opacity:.45}.cal-day.today{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.cal-day .n{font-family:"Geist Mono",monospace;font-size:12px;color:var(--muted);display:block;margin-bottom:4px}
.cal-sale{display:block;font-size:12px;line-height:1.3;padding:3px 6px;border-radius:5px;background:var(--line2);color:var(--ink);margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cal-sale b{font-family:"Geist Mono",monospace;font-weight:500}.cal-sale.tracked{background:var(--info-soft);color:var(--info)}.cal-sale.past{opacity:.5}.cal-sale em{font-style:normal;background:var(--ink);color:#fff;border-radius:999px;padding:0 5px;font-size:12px;margin-left:3px}
.cal-sale:hover{text-decoration:none;background:var(--accent-soft)}
@media(max-width:800px){.cal-day{min-height:60px}.cal-sale{font-size:12px}}
/* --- annonces similaires --- */
.cmp-facts{display:grid;grid-template-columns:repeat(6,auto) 1fr;gap:6px 22px;align-items:end;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:10px 0;margin-bottom:10px}.cmp-facts div b{display:block;font-family:"Geist Mono",monospace;font-size:20px;font-weight:500;letter-spacing:-.02em}.cmp-facts div.main b{color:var(--accent);font-size:24px}.cmp-facts div span{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:600}.cmp-facts .act{text-align:right}
@media(max-width:900px){.cmp-facts{grid-template-columns:repeat(3,1fr)}.cmp-facts .act{grid-column:1/-1;text-align:left}}
.cmp-filters{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;margin-bottom:10px;font-size:13px}.cmp-filters label{display:inline-flex;align-items:center;gap:4px;color:var(--ink2)}.cmp-filters input.short{width:82px}.cmp-filters input.w6{width:92px}.cmp-note{margin:0 0 10px}
.cmp-lot{margin:0 0 6px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
/* Tableau des annonces similaires : c'est un tableau de comparaison, il doit se lire, pas se déchiffrer. */
.tbl.cmp td,.tbl.cmp th{padding:9px 10px;font-size:13px}
.tbl.cmp thead th{font-size:12px;letter-spacing:.04em;color:var(--ink2)}
.tbl.cmp td.strong{font-size:15px;font-weight:600;color:var(--ink)}
.tbl.cmp tbody td{color:var(--ink2)}
.tbl.cmp tbody a{color:var(--ink);font-weight:500}
.tbl.cmp .muted{font-size:12px;line-height:1.5;margin-top:2px}

.chip{display:inline-block;padding:2px 9px;border-radius:999px;background:var(--accent-soft);color:var(--accent);font-weight:600;font-size:12px}.cmp-filters select{width:auto}
tr[hidden]{display:none}
/* un display: explicite l'emporte sur l'attribut hidden : sans cette règle, un bloc masqué en JS reste affiché */
[hidden]{display:none!important}
.count{font-family:"Geist Mono",monospace;font-size:12px;color:var(--muted);background:var(--line2);padding:1px 8px;border-radius:999px}

/* --- barre du haut : recherche --- */
.topsearch{margin-left:auto}.topsearch input{width:260px;padding:7px 12px;border-radius:999px;background:var(--line2);border-color:transparent}.topsearch input:focus{background:#fff}
.topactions{display:flex;gap:8px;align-items:center}
.side-help{display:flex;align-items:center;gap:10px;padding:8px 10px;color:var(--muted);font-size:13px;border-radius:8px;margin-top:auto}.side-help svg{width:17px;height:17px}.side-help:hover{background:var(--side2);color:var(--ink);text-decoration:none}
.side-help + .side-foot{margin-top:0}
/* --- accessibilité : focus clavier visible --- */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* --- mobile : tableaux défilants, grilles empilées --- */
/* --- petits écrans --- */
@media(max-width:820px){
  :root{--ctl:40px;--pad:16px;--gap:14px}
  h1{font-size:21px}
  .topsearch{display:none}
  .hero .huge{font-size:34px}
  .vhead{flex-direction:column;gap:10px}
  .rail-list{grid-template-columns:1fr}
  .cmp-filters{font-size:12px}
  .statusbar{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
  .statusbar .stbtn{padding:0 6px;font-size:13px;width:100%}
  /* barres d'outils : chaque contrôle prend la largeur, les boutons restent alignés */
  .filters,.toolbar{gap:8px}
  .filters input,.filters select,.toolbar input,.toolbar select{flex:1 1 100%;width:100%}
  .filters input[name=q]{min-width:0}
  .filters .btn,.toolbar .btn{flex:1 1 auto}
  .toolbar .right{margin-left:0}
  .grid-form{grid-template-columns:1fr}
  .props{grid-template-columns:1fr;gap:0}
  .props dt{margin-top:8px;font-size:12px;text-transform:uppercase;letter-spacing:.05em}
  /* tableaux : une carte par ligne, libellé à gauche, valeur à droite */
  .tbl.stack{display:block}
  .scroll-x>.tbl.stack{min-width:0}   /* replié en cartes, le tableau n'a plus besoin d'une largeur plancher */
  .tbl.stack thead{display:none}
  .tbl.stack tbody,.tbl.stack tr,.tbl.stack td{display:block;width:100%}
  .tbl.stack tr{border:1px solid var(--line);border-radius:var(--r-sm);background:#fff;padding:12px 14px;margin-bottom:10px}
  .tbl.stack tr:hover{background:#fff}
  .tbl.stack td{border:0;padding:4px 0;display:flex;align-items:baseline;justify-content:space-between;gap:16px;text-align:right}
  .tbl.stack td::before{content:attr(data-l);flex:none;text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:600}
  .tbl.stack td:empty,.tbl.stack td[data-l=""]:empty{display:none}
  .tbl.stack td.lead{display:block;text-align:left;padding:0 0 8px;border-bottom:1px solid var(--line2);margin-bottom:6px}
  .tbl.stack td.lead::before{display:none}
  .tbl.stack td.num{text-align:right;white-space:normal}
  .tbl.stack tr.risk-high td:first-child,.tbl.stack tr.risk-warn td:first-child{box-shadow:none}
  .tbl.stack tr.risk-high{border-left:3px solid var(--bad)}.tbl.stack tr.risk-warn{border-left:3px solid #d97706}
  .tbl.stack .vcell{align-items:center}
  .tbl.stack td.act{justify-content:flex-start;flex-wrap:wrap;gap:6px;padding-top:10px}
  /* pastilles de signaux : en cellule repliée, elles doivent s'aligner sous leur intitulé, pas se comprimer lettre par lettre */
  .tbl.stack td.sigs{display:block;text-align:left}
  /* annonces similaires repliées : la photo ouvre la fiche, le titre suit, les chiffres se lisent en liste */
  .tbl.cmp.stack td.thumb{display:block;text-align:left;padding:0 0 8px}
  .tbl.cmp.stack td.thumb img{width:104px;height:76px;margin:0}
  .tbl.cmp.stack td.thumb::before{display:none}
  .tbl.cmp.stack td.thumb:empty{display:none}
  .tbl.stack td.sigs::before{display:block;max-width:none;margin-bottom:4px}
  .tbl.stack td.act::before{flex-basis:100%;margin-bottom:2px}
  .tbl.stack td>*{min-width:0;overflow-wrap:anywhere}
  .tbl.stack td::before{max-width:45%;overflow-wrap:anywhere}
  .sig{white-space:normal}
  .tbl .nowrap,.tbl.stack .nowrap{white-space:normal}
.tbl.plain td.num.nowrap{white-space:normal}
  .scroll-x{margin:0 calc(var(--pad) * -1);padding:0 var(--pad)}
  .cmp-facts{grid-template-columns:repeat(2,1fr);gap:10px 16px}
  /* calendrier : lisible, défilement horizontal plutôt que des cases écrasées */
  .cal-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 calc(var(--pad) * -1);padding:0 var(--pad) 4px}
  .cal-scroll .cal-grid{min-width:600px}
  .cal-day{min-height:64px;padding:4px;border-radius:6px}
  .cal-head{flex-wrap:wrap}.cal-head h2{font-size:15px}.cal-head .muted{flex-basis:100%;margin:0}
  .urlform{flex-wrap:wrap}.urlform input{flex:1 1 100%}.urlform .btn{flex:1 1 auto}
  .quota i{width:80px}
}
@media(max-width:560px){
  .tiles{grid-template-columns:repeat(2,1fr)}.tile{padding:14px 12px 14px 0}.tile:nth-child(odd){border-left:0;padding-left:0}.tile:nth-child(even){padding-left:14px}.tile b{font-size:24px}
  .kpis,.kpis-3{grid-template-columns:repeat(2,1fr)}.kpi{padding:12px 10px 12px 0}.kpi:nth-child(odd){border-left:0;padding-left:0}.kpi:nth-child(even){padding-left:14px}.kpi.big b{font-size:30px}
  .hero-side{grid-template-columns:1fr}
  .statusbar{grid-template-columns:repeat(2,1fr)}
}
.quota{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}.quota i{display:inline-block;width:120px;height:6px;border-radius:3px;background:var(--line2);overflow:hidden;vertical-align:middle}.quota i b{display:block;height:100%;background:var(--accent)}
.urlform{display:flex;gap:8px}.urlform input{flex:1}
.vcard-photo.noimg,.gallery a.noimg{background:var(--line2)}
.grid-form .unit{color:var(--muted);font-weight:400}

/* --- petits écrans : ajustements dépendant de l'ordre du fichier --- */
@media(max-width:900px){
  .side-help{display:none}
  .side-foot{order:0;position:static;margin-left:auto}
  .side .brand{order:0;margin-right:auto}
  .side>.brand,.side>.side-foot{align-self:center}
  .side{flex-direction:row;flex-wrap:wrap;align-items:center;padding:8px 12px 0}
  .side nav{flex-basis:100%}
}
@media(max-width:820px){
  .rail-head{flex-direction:column;align-items:flex-start;gap:2px}
  h2>.muted,h2>small,h2>span.small{flex-basis:100%;margin:0}
  .col header small{margin-top:2px}
  .deadline{grid-template-columns:1fr;gap:8px}
  .dl-time{grid-row:auto;flex-direction:row;align-items:baseline;gap:6px;border-right:0;border-bottom:1px solid var(--line2);padding:0 0 6px;min-width:0}
  .dl-act{grid-column:1}
  .cmp-facts .act{grid-column:1/-1;text-align:left}
  .doc{padding:10px 0}
  .bars{overflow-x:auto;gap:4px}.bar{min-width:26px}
  /* listes simples (libellé + action) : chaque ligne devient un bloc */
  .tbl.plain,.tbl.plain tbody,.tbl.plain tr,.tbl.plain td{display:block;width:100%}
  .tbl.plain tr{border-bottom:1px solid var(--line2);padding:10px 0}
  .tbl.plain td{padding:2px 0;border:0;white-space:normal}
  .tbl.plain td:last-child:not(:first-child){margin-top:6px}
  .tbl.plain .btn{width:auto}
  /* libellés explicites : sur petit écran ils passent à la ligne plutôt que de déborder */
  .tbl.plain .btn,.tbl.stack .btn{white-space:normal;height:auto;min-height:var(--ctl);padding:7px 12px;line-height:1.25;text-align:center}
  .tbl.plain td form,.tbl.stack td form{max-width:100%}
}

/* --- écrans intermédiaires (tablette, fenêtre étroite) : le tableau garde sa forme et défile --- */
@media(min-width:821px){
  /* cinq colonnes suffisent : le tableau tient dans la page, plus de défilement latéral */
  .tbl.stack td,.tbl.stack th{white-space:normal}
  .tbl.stack td.num,.tbl.stack th.num{white-space:nowrap}
  .tbl.stack .vthumb{width:56px;height:40px}
  /* largeurs fixes : le tableau ne peut plus dépasser la page, quel que soit le contenu */
  .tbl.v5{table-layout:fixed;width:100%}
  .tbl.v5 th:nth-child(2),.tbl.v5 td:nth-child(2){width:15%}
  .tbl.v5 th:nth-child(3),.tbl.v5 td:nth-child(3){width:16%}
  .tbl.v5 th:nth-child(4),.tbl.v5 td:nth-child(4){width:21%}
  .tbl.v5 th:nth-child(5),.tbl.v5 td:nth-child(5){width:9%}
  .tbl.v5 .verdict{white-space:normal;line-height:1.3}
  .tbl.v5 td{overflow-wrap:anywhere}
  .tbl.v5 .sig{display:block;max-width:100%;white-space:normal;overflow-wrap:anywhere}
  .tbl.v5 .status,.tbl.v5 .verdict{white-space:normal}
  .vcell>div{min-width:0;flex:1}
  .vcell a,.vrow-nums{overflow-wrap:anywhere;min-width:0}
  .tbl.stack td.num.nowrap{white-space:normal}
  /* préparation de vente : neuf colonnes, donc des largeurs imposées, sinon le titre se réduit à une lettre par ligne.
     Scopé à v9 : les tableaux à cinq colonnes du tableau de bord gardent les leurs. */
  .tbl.v9{table-layout:fixed;width:100%}
  .tbl.v9 th:nth-child(1),.tbl.v9 td:nth-child(1){width:34px}
  .tbl.v9 th:nth-child(2),.tbl.v9 td:nth-child(2){width:9%}
  .tbl.v9 th:nth-child(3),.tbl.v9 td:nth-child(3){width:23%}
  .tbl.v9 th:nth-child(4),.tbl.v9 td:nth-child(4){width:10%}
  .tbl.v9 th:nth-child(5),.tbl.v9 td:nth-child(5){width:9%}
  .tbl.v9 th:nth-child(6),.tbl.v9 td:nth-child(6){width:11%}
  .tbl.v9 th:nth-child(7),.tbl.v9 td:nth-child(7){width:11%}
  .tbl.v9 th:nth-child(9),.tbl.v9 td:nth-child(9){width:9%}
  .tbl.v9 td{overflow-wrap:normal;word-break:normal}
  .tbl.v9 td.nowrap{white-space:nowrap}
  .tbl.v9 th.num{white-space:normal}   /* « Marge à la mise à prix » doit passer à la ligne, pas déborder sur la colonne voisine */
  .tbl.v9 .sig{display:block;max-width:100%;white-space:normal;overflow-wrap:anywhere}
  /* Administration : sept colonnes de largeurs très inégales, les mots se coupaient au milieu */
  .tbl.admin{table-layout:fixed;width:100%}
  .tbl.admin th:nth-child(1),.tbl.admin td:nth-child(1){width:30%}
  .tbl.admin th:nth-child(2),.tbl.admin td:nth-child(2){width:16%}
  .tbl.admin th:nth-child(3),.tbl.admin td:nth-child(3){width:22%}
  .tbl.admin td,.tbl.admin th{overflow-wrap:normal;word-break:normal;white-space:normal}
  .tbl.admin .btn{white-space:nowrap}
  .tbl.admin .quota-cell form{display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:flex-end}
  .tbl.admin .w-quota{width:64px;display:inline-block}
  .tbl.admin td.act{display:flex;flex-direction:column;gap:6px;align-items:stretch}
}
.dl-body,.deadline{min-width:0}
.dl-body a{display:block;max-width:100%}

/* --- visionneuse photo --- */
.viewer{margin:0 0 16px}
.viewer{display:grid;grid-template-columns:1fr 92px;gap:8px;align-items:start}
.viewer-stage{position:relative;background:var(--line2);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;aspect-ratio:16/9;max-height:260px}
.viewer-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.viewer-stage img[hidden]{display:none!important}
.viewer-nav{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.92);color:var(--ink);display:grid;place-items:center;cursor:pointer;padding:0;box-shadow:var(--shadow);transition:background .2s var(--ease),transform .2s var(--ease)}
.viewer-nav:hover{background:#fff;transform:translateY(-50%) scale(1.06)}
.viewer-nav svg{width:19px;height:19px}
.viewer-nav.prev{left:10px}.viewer-nav.next{right:10px}
.viewer-count{position:absolute;left:10px;bottom:10px;background:rgba(24,24,27,.78);color:#fff;font-size:12px;padding:3px 10px;border-radius:999px;font-family:"Geist Mono",monospace}
.viewer-open{position:absolute;right:10px;bottom:10px;background:rgba(24,24,27,.78);color:#fff;font-size:12px;padding:3px 10px;border-radius:999px}
.viewer-open:hover{background:var(--ink);text-decoration:none}
.viewer-thumbs{display:flex;flex-direction:column;gap:6px;overflow-y:auto;max-height:260px;padding:0;scrollbar-width:thin}
.viewer-thumbs button{flex:none;width:92px;height:60px;padding:0;border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden;background:var(--line2);cursor:pointer;opacity:.62;transition:opacity .2s,border-color .2s}
.viewer-thumbs button:hover{opacity:.9}
.viewer-thumbs button.on{opacity:1;border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.viewer-thumbs img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:820px){.viewer{grid-template-columns:1fr}.viewer-stage{aspect-ratio:16/10;max-height:none}.viewer-nav{width:34px;height:34px}.viewer-thumbs{flex-direction:row;overflow-x:auto;overflow-y:hidden;max-height:none;padding:8px 0 2px}.viewer-thumbs button{width:72px;height:52px}}

/* --- attente : barre de progression, boutons occupés, squelettes --- */
#progress{position:fixed;top:0;left:0;height:2px;width:0;background:var(--accent);z-index:100;transition:width .3s var(--ease),opacity .3s;box-shadow:0 0 8px var(--accent)}
#progress.done{opacity:0}
.spin{width:14px;height:14px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .7s linear infinite;flex:none}
@keyframes spin{to{transform:rotate(1turn)}}
.btn[aria-busy="true"]{opacity:.85;cursor:progress}
.btn[disabled]{opacity:.55;cursor:not-allowed}
.busy-note{display:flex;align-items:center;gap:10px;margin:12px 0 0;padding:12px 14px;border-radius:var(--r-sm);background:var(--accent-soft);color:var(--accent);font-weight:500}
.busy-note .spin{border-width:2px;width:15px;height:15px}
.busy-note small{display:block;color:var(--ink2);font-weight:400}
.skel{background:linear-gradient(90deg,var(--line2) 25%,#eaeaec 50%,var(--line2) 75%);background-size:200% 100%;animation:shimmer 1.6s linear infinite;border-radius:6px;height:14px;margin:6px 0}
.skel.w40{width:40%}.skel.w70{width:70%}.skel.w90{width:90%}

/* --- Entrée en cascade : les lignes et les cartes arrivent l'une après l'autre, pas d'un bloc --- */
@media(prefers-reduced-motion:no-preference){
  .sec .tbl tbody tr,.card .tbl tbody tr{animation:rise .5s var(--ease) both}
  .sec .tbl tbody tr:nth-child(1),.card .tbl tbody tr:nth-child(1){animation-delay:20ms}
  .sec .tbl tbody tr:nth-child(2),.card .tbl tbody tr:nth-child(2){animation-delay:50ms}
  .sec .tbl tbody tr:nth-child(3),.card .tbl tbody tr:nth-child(3){animation-delay:80ms}
  .sec .tbl tbody tr:nth-child(4),.card .tbl tbody tr:nth-child(4){animation-delay:110ms}
  .sec .tbl tbody tr:nth-child(5),.card .tbl tbody tr:nth-child(5){animation-delay:140ms}
  .sec .tbl tbody tr:nth-child(6),.card .tbl tbody tr:nth-child(6){animation-delay:165ms}
  .sec .tbl tbody tr:nth-child(n+7),.card .tbl tbody tr:nth-child(n+7){animation-delay:185ms}
  .vcard{animation:rise .5s var(--ease) both}
  .col .vcard:nth-child(2){animation-delay:40ms}.col .vcard:nth-child(3){animation-delay:80ms}.col .vcard:nth-child(n+4){animation-delay:110ms}
}
/* --- Retour tactile et survol : ce qui est cliquable réagit --- */
.deadline,.tile,.vcard,.viewer-thumbs button{transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s var(--ease)}
.tbl a:hover{color:var(--accent)}
.sec .tbl tbody tr{border-radius:var(--r-sm)}
.count{font-weight:500}

/* --- Avertissement de réglage : le calcul tourne sur des valeurs non confirmées --- */
.notice{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:14px 18px;margin:0 0 18px;border-radius:var(--r-sm);background:var(--warn-soft);color:var(--warn);border:1px solid #f0dcc0;animation:rise .5s var(--ease) both}
.notice b{color:#7c3a06}
.notice>div{flex:1;min-width:260px;line-height:1.5}
.notice .btn,.notice .btn.primary{background:#7c3a06;border-color:#7c3a06;color:#fff}
.notice .btn:hover{background:#5f2c04}

/* --- Mise en route : une question par bloc, pas un formulaire fleuve --- */
.startform fieldset{border:0;border-top:1px solid var(--line);margin:0;padding:20px 0 4px}
.startform fieldset:first-of-type{border-top:0;padding-top:8px}
.startform legend{font-weight:600;font-size:15px;letter-spacing:-.015em;padding:0}
.startform label{display:flex;flex-direction:column;gap:5px;font-size:13px;color:var(--ink2);font-weight:500;margin:12px 0 0;max-width:420px}
.startform label.chk{flex-direction:row;align-items:center;gap:8px;font-size:13px}
.startform label.chk input{width:auto}
.startform .btns{margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}
.startform p.small{margin:4px 0 0;max-width:62ch}

/* --- Le verdict : la couleur ne sert qu'à dire quoi faire --- */
.kv .verdict,.verdict{display:inline-flex;align-items:center;gap:7px;padding:4px 11px 4px 9px;border-radius:999px;font-size:13px;text-transform:none;letter-spacing:0;font-weight:600;white-space:nowrap;border:1px solid transparent;font-variant-numeric:tabular-nums}
.verdict i{width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.verdict b{font-weight:700}.verdict .v-why{font-weight:500;opacity:.85}
.v-go,.kv .v-go,.vcard .v-go{background:var(--go-soft);color:var(--go);border-color:var(--go-line)}
.v-stop,.kv .v-stop,.vcard .v-stop{background:var(--stop-soft);color:var(--stop);border-color:var(--stop-line)}
.v-wait,.kv .v-wait,.vcard .v-wait{background:var(--warn-soft);color:var(--warn);border-color:#f0dcc0}
.v-none,.kv .v-none,.vcard .v-none{background:var(--line2);color:var(--muted);border-color:var(--line)}
.verdict.big{font-size:15px;padding:7px 16px 7px 13px}.verdict.big i{width:9px;height:9px}
/* le prix recommandé est votre chiffre, pas un jugement : il reste neutre */
.tbl .reco-cell{color:var(--ink)}
.hero .huge{color:var(--ink)}

/* --- Comparables : le résumé d'abord, les réglages seulement si on les demande --- */
.lot-sale,.newsale{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap;margin:0 0 14px}
.lot-sale label,.newsale label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--ink2)}
.newsale{padding:12px 14px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);margin-bottom:16px}
.cmp-bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:0 0 10px}
.cmp-bar .cmp-resume{flex:1 1 220px;margin:0}.cmp-acts{display:flex;gap:8px;flex-wrap:wrap}
/* gabarit lu sur l'annonce : vert s'il colle au lot, orange s'il diffère, gris s'il n'est pas donné */
.gab{font-weight:600}.gab-ok{color:var(--ok)}.gab-no{color:#b45309}.gab-na{color:var(--muted);font-weight:400}

.cmp-resume{margin:0;flex:1;min-width:220px;color:var(--ink2);font-size:13px;line-height:1.5}
.cmp-resume b{font-weight:600;color:var(--ink)}
.cmp-resume .relax{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:999px;background:var(--info-soft);color:var(--info);font-size:12px}
.cmp-filters{padding:14px 16px;background:var(--line2);border-radius:var(--r-sm);margin-bottom:12px}

/* --- Fiche véhicule : photo, identité et décision dans un seul bandeau --- */
.lot{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:24px;align-items:start;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px;margin-bottom:var(--gap);animation:rise .6s var(--ease) both}
.lot-photo .viewer{grid-template-columns:1fr;margin:0}
.lot-photo .viewer-stage{aspect-ratio:4/3;max-height:none}
.lot-photo .viewer-thumbs{flex-direction:row;overflow-x:auto;overflow-y:hidden;max-height:none;padding:8px 0 0}
.lot-photo .viewer-thumbs button{width:64px;height:46px}
.lot-main{min-width:0;display:flex;flex-direction:column;gap:14px}
.lot-meta{margin:0;color:var(--muted);font-size:13px}
.lot-src{margin:0;color:var(--muted);font-size:12px;line-height:1.5}
.lot-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:14px 0 8px}
.lot-actions select{width:auto;max-width:240px}
.lot-actions form{display:flex;gap:6px;align-items:center}
.lot-actions .right{margin-left:auto}
.pick{display:inline-flex;align-items:center;gap:6px;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:600}
.pick select{text-transform:none;letter-spacing:0;font-weight:500;color:var(--ink)}
.doc .muted{margin-left:2px}
.lot .statusbar{margin:0}
.lot .signals{margin:0}
@media(max-width:1100px){.lot{grid-template-columns:1fr;gap:18px}}
@media(max-width:820px){.lot{padding:16px}}

/* --- Ligne véhicule : les chiffres secondaires sous le titre, plus de défilement latéral --- */
.vrow-nums{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:5px;font-size:12px;color:var(--muted)}
.vrow-nums b{font-family:"Geist Mono",monospace;font-weight:600;color:var(--ink2);font-variant-numeric:tabular-nums}
.vrow-nums .warn{color:var(--warn)}

/* --- Tri des colonnes : un clic sur l'en-tête, une flèche qui dit dans quel sens --- */
.tbl th.sortable{cursor:pointer;user-select:none;position:relative;padding-right:18px;transition:color .2s}
.tbl th.sortable:hover{color:var(--ink)}
.tbl th.sortable::after{content:'';position:absolute;right:6px;top:50%;width:7px;height:7px;margin-top:-3px;opacity:.3;
  background:currentColor;-webkit-mask:no-repeat center/7px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath d='M4 0 7 3H1zM4 8 1 5h6z'/%3E%3C/svg%3E");
  mask:no-repeat center/7px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath d='M4 0 7 3H1zM4 8 1 5h6z'/%3E%3C/svg%3E")}
.tbl th.sortable[aria-sort=ascending]::after{opacity:1;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath d='M4 1 7 5H1z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath d='M4 1 7 5H1z'/%3E%3C/svg%3E")}
.tbl th.sortable[aria-sort=descending]::after{opacity:1;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath d='M4 7 1 3h6z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath d='M4 7 1 3h6z'/%3E%3C/svg%3E")}
.tbl th.sortable[aria-sort=ascending],.tbl th.sortable[aria-sort=descending]{color:var(--accent)}

/* --- Réglages : des groupes lisibles, jamais de débordement --- */
.grid-form h3{grid-column:1/-1;margin:6px 0 -2px;padding-top:12px;border-top:1px solid var(--line);font-size:12px}
.grid-form h3.mt0{margin-top:0;padding-top:0;border-top:0}
.grid-form label,.grid-form input,.grid-form select,.grid-form textarea{min-width:0;max-width:100%}
.card,.sec{overflow-wrap:anywhere}
.tbl.plain td{overflow-wrap:anywhere}
@media(max-width:1200px){.grid2.even{grid-template-columns:1fr}}

/* --- Mise en route : ce qui reste à faire, coché tout seul --- */
.setup{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px 20px;margin-bottom:var(--gap);animation:rise .6s var(--ease) both}
.setup-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:12px}
.setup-head h2{margin:0;min-height:0}
.setup-gauge{flex:1;min-width:120px;height:5px;border-radius:3px;background:var(--line2);overflow:hidden}
.setup-gauge i{display:block;height:100%;background:var(--go);border-radius:3px;transition:width .6s var(--ease)}
.setup-list{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.setup-list li{display:grid;grid-template-columns:22px minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--line2)}
.setup-list li:first-child{border-top:0}
.setup-list li>div{display:flex;flex-direction:column;gap:1px;min-width:0}
.setup-list b{font-weight:600;font-size:14px}
.setup-list span{color:var(--muted);font-size:13px;line-height:1.45}
.setup-mark{width:18px;height:18px;border-radius:50%;border:1.5px solid var(--line);display:block;flex:none}
.setup-list li.done .setup-mark{border-color:var(--go);background:var(--go);
  -webkit-mask:none;position:relative}
.setup-list li.done .setup-mark::after{content:'';position:absolute;left:5px;top:2px;width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.setup-list li.done b{color:var(--muted);font-weight:500}
.setup-list li.done>div>span{display:none}
@media(max-width:820px){.setup-list li{grid-template-columns:22px minmax(0,1fr);gap:10px}.setup-list li .btn{grid-column:2}}
.steps li .setup-dl{grid-column:2;margin-top:8px}
.steps li .setup-dl .btn{width:auto}

/* --- Le prix : un seul objet, la décision d'abord et l'écart déjà soustrait -------------------
   Rendu par app/views/_price.php, partagé par la fiche (.cp-lg) et la carte du tableau (.cp-sm).
   Les mots des quatre états viennent de verdict_parts() (helpers.php) et sont recopiés à
   l'identique dans app.js (apply) pour le recalcul immédiat : toute retouche se fait aux trois
   endroits, jamais à un seul. */
.cp{--cp-ink:var(--muted);--cp-soft:var(--line2);--cp-line:var(--line)}
.cp-go{--cp-ink:var(--go);--cp-soft:var(--go-soft);--cp-line:var(--go-line)}
.cp-stop{--cp-ink:var(--stop);--cp-soft:var(--stop-soft);--cp-line:var(--stop-line)}
.cp-wait{--cp-ink:var(--warn);--cp-soft:var(--warn-soft);--cp-line:#f0dcc0}
.cp-none{--cp-ink:var(--muted);--cp-soft:var(--line2);--cp-line:var(--line)}

/* Fiche : un bandeau teinté pleine largeur. Le verbe est le premier mot lu, le nombre qui décide
   est le plus gros caractère de la page, et il suit le verdict : en « Passer », le hero est
   l'écart en rouge, pas un plafond qu'on n'utilisera jamais. */
.cp-lg{background:var(--cp-soft);border:1px solid var(--cp-line);border-left:3px solid var(--cp-ink);border-radius:var(--r-sm);padding:13px 18px 15px}
.cp-act{display:flex;align-items:center;gap:8px;margin:0;color:var(--cp-ink);font-size:17px;font-weight:700;letter-spacing:-.01em;line-height:1.2}
.cp-act i{width:9px;height:9px;border-radius:50%;background:currentColor;flex:none}
.cp-hero{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 10px;margin:4px 0 0}
.cp-fig{white-space:nowrap}
.cp-num{font-family:"Geist Mono",monospace;font-variant-numeric:tabular-nums;font-size:38px;font-weight:500;letter-spacing:-.03em;line-height:1.1;color:var(--ink)}
.cp-stop .cp-num{color:var(--stop)}
.cp-unit{font-size:14px;font-weight:600;color:var(--ink2);margin-left:5px}
.cp-unit:empty{margin:0}
.cp-na{font-family:"Geist",sans-serif;font-weight:600;letter-spacing:-.01em;color:var(--muted)}
.cp-lg .cp-na{font-size:22px}
.cp-of{font-size:12px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:600}
.cp-say{margin:6px 0 0;color:var(--ink2);font-size:15px;line-height:1.5;max-width:58ch}
.cp-say b{font-family:"Geist Mono",monospace;font-variant-numeric:tabular-nums;font-weight:600;color:var(--ink);white-space:nowrap}
/* l'écart : le seul objet blanc sur le fond teinté, donc le seul point d'ancrage de l'œil */
.cp-gap{background:#fff;color:var(--cp-ink);border:1px solid var(--cp-line);border-radius:999px;padding:1px 9px;font-weight:600;white-space:nowrap;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.cp-gap b{color:inherit}
.cp-alt{margin:8px 0 0;color:var(--muted);font-size:12.5px;line-height:1.5}
.cp-alt b{font-family:"Geist Mono",monospace;font-variant-numeric:tabular-nums;font-weight:600;color:var(--ink2);white-space:nowrap}
/* d'où sort le plafond : visible au premier coup d'œil, sans repli et sans bouton de plus */
.cp-why{margin:7px 0 0;color:var(--ink2);font-size:13px;line-height:1.55;max-width:74ch}
@media(max-width:1100px){.cp-num{font-size:34px}}
@media(max-width:820px){.cp-lg{padding:12px 14px 14px}.cp-num{font-size:30px}.cp-say{font-size:14px}}

/* Carte du tableau : la pastille garde le verbe et la couleur, c'est ce qu'on repère en balayant
   une colonne de soixante lots. Les deux nombres gardent une position fixe (libellé à gauche,
   montant à droite) ; si la colonne se serre au point que la ligne ne tient plus, le montant
   passe dessous au lieu d'être coupé, et le libellé n'est jamais tronqué en « PL… ». */
.cp-sm{margin:7px 0 0}
.cp-sm .verdict{max-width:100%;flex-wrap:wrap;white-space:normal;font-size:12px;padding:3px 9px 3px 8px;line-height:1.35}
.cp-sm .verdict b,.cp-sm .verdict .v-why{min-width:0}
.cp-row{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 8px;margin:4px 0 0;font-size:11.5px;color:var(--muted);line-height:1.35}
.cp-k{flex:none}
.cp-v{margin-left:auto;font-family:"Geist Mono",monospace;font-variant-numeric:tabular-nums;font-size:14px;font-weight:600;color:var(--ink)}
.cp-v2{font-size:13px;font-weight:500;color:var(--ink2)}
.cp-u{font-size:10px;font-weight:600;color:var(--muted)}
.cp-sm .cp-na{font-size:12px;font-weight:500}

/* Colonne étroite : sous 230 px la photo passe au-dessus du texte, sinon il ne reste qu'une
   centaine de pixels au corps de la carte. Ce bloc existait déjà plus haut dans la feuille,
   mais avant .vcard : à spécificité égale il perdait la cascade et n'a jamais rien fait.
   Il est ici, après .vcard, donc il s'applique enfin. */
@container (max-width:230px){
  .vcard{grid-template-columns:1fr}
  .vcard-photo{min-height:0;aspect-ratio:16/10}
  .vcard-title{white-space:normal}
}

.lot-decide{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:14px 0 8px}
.lot-decide .statusbar{margin:0}
.lot-decide .menu{margin-left:auto}
.stbtn .upto{font-weight:500;opacity:.8;font-family:"Geist Mono",monospace;font-variant-numeric:tabular-nums}
.stbtn.reco{border-color:var(--go-line);background:var(--go-soft);color:var(--go)}
.stbtn.st-ecarte.reco{border-color:var(--stop-line);background:var(--stop-soft);color:var(--stop)}
.menu{position:relative}
.menu>summary{list-style:none;display:inline-flex;align-items:center;justify-content:center;width:var(--ctl);height:var(--ctl);border:1px solid var(--line);border-radius:var(--r-sm);background:#fff;color:var(--muted);cursor:pointer;letter-spacing:.08em}
.menu>summary::-webkit-details-marker{display:none}
.menu>summary:hover{background:var(--line2);color:var(--ink)}
.menu-pop{position:absolute;right:0;top:calc(var(--ctl) + 6px);z-index:20;min-width:min(250px,86vw);max-width:86vw;display:flex;flex-direction:column;gap:12px;background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);padding:12px;box-shadow:var(--shadow)}
.menu-pop .btn.full{width:100%}
.menu-pop select{max-width:100%}
.tune>summary{cursor:pointer;font-size:17px;letter-spacing:-.015em;display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-height:var(--ctl)}
.tune>summary::-webkit-details-marker{display:none}
.viewer-open{opacity:0;transition:opacity .2s var(--ease)}
.viewer-stage:hover .viewer-open,.viewer-open:focus-visible{opacity:1}
/* --- D'où sort ce plafond : la soustraction du moteur, et le formulaire en même temps -----------
   Rendu par app/views/_breakdown.php et _probe.php, dans la carte du calcul de la fiche. Une ligne
   par poste, son montant à droite, un total qui tombe exactement sur le plafond affiché en 38 px
   dans le bloc prix. Aucun style inline, la CSP reste satisfaite.
   Une colonne de compte se lit sur 40 à 50 caractères : au-delà, le libellé et son montant sont trop
   loin l'un de l'autre. La carte peut occuper toute la largeur (sous 1 100 px la grille passe à une
   colonne), le calcul, lui, garde sa largeur de lecture. */
.cbf{margin:0;max-width:520px}
.cb{width:100%;border-collapse:collapse}
.cb-cap{caption-side:top;text-align:left;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);padding:0 0 10px}
.cb-hint{display:block;margin-top:3px;font-size:11.5px;font-weight:400;text-transform:none;letter-spacing:0;color:var(--muted)}
.cb td,.cb th{padding:4px 0;text-align:left;font-weight:400;vertical-align:baseline}
.cb .cb-i{width:23px;padding-right:8px;vertical-align:top}
.cb-ic{width:15px;height:15px;display:block;margin-top:3px;color:var(--muted)}
.cb th{color:var(--ink2);font-size:13.5px;line-height:1.4}
.cb-u{margin-left:4px;font-size:10px;font-weight:600;letter-spacing:.04em;color:var(--muted)}
/* Le sous-titre dit d'où vient le montant : tranche du barème, forfait ou chiffrage, provenance de
   la revente. fee_label vient de l'extérieur : un intitulé sans espace doit se replier, pas pousser
   la table hors du cadre. */
.cb-sub{display:block;color:var(--muted);font-size:11.5px;line-height:1.4;overflow-wrap:anywhere}
/* L'opérateur a sa propre colonne : les signes s'alignent, les montants aussi, comme sur un relevé. */
.cb .cb-op{width:14px;padding-right:5px;text-align:center;color:var(--muted);font-family:"Geist Mono",monospace;font-size:13px}
.cb .cb-n{text-align:right;white-space:nowrap;font-family:"Geist Mono",monospace;font-variant-numeric:tabular-nums;font-size:13.5px;font-weight:500;color:var(--ink2)}
/* Le montant calculé prend exactement la boîte du montant saisissable (mêmes marges intérieures,
   même bordure transparente) : les chiffres des dix lignes tombent alors sur le même axe, qu'ils
   soient dans un champ ou non. C'est toute la valeur d'une colonne de compte. */
.cb-n .cb-v{display:inline-block;padding:0 4px;border:1px solid transparent}
/* Les deux bornes du calcul, ce qui entre et ce qui reste, sont les seuls montants en noir. */
.cb-in .cb-n,.cb-in .cb-ed input[type=text]{color:var(--ink);font-weight:600}
.cb-in .cb-ic,.cb-tot .cb-ic{color:var(--ink2)}
.cb-tot td,.cb-tot th{border-top:1px solid var(--line);padding-top:10px}
.cb-tot th{color:var(--ink);font-size:14px;font-weight:600}
.cb-tot .cb-op{color:var(--ink2);font-weight:600}
.cb-tot .cb-n{color:var(--ink);font-size:16px;font-weight:600}
/* « à estimer », « aucun prix ne tient » : ce n'est pas un nombre, ça ne doit pas en avoir l'air. */
.cb-n.cb-imp{font-family:"Geist",sans-serif;font-size:14px;font-weight:600;color:var(--muted);font-variant-numeric:normal}
.cb-n.cb-imp .cb-cur{display:none}
/* Édition directe : un montant modifiable doit se lire comme un nombre, pas comme un champ. Au repos
   le seul indice est le trait pointillé sous le chiffre, au survol la boîte apparaît, au focus
   l'anneau accent du produit. Un champ vide affiche en gris la valeur du moteur (placeholder) :
   gris = réglage par défaut, encre = votre montant, le marqueur « modifié » est donc gratuit.
   Le sélecteur porte [type=text] pour peser autant que la règle générale des input. */
.cb-ed{white-space:nowrap}
.cb-ed input[type=text]{width:7.5ch;height:26px;padding:0 4px;text-align:right;border:1px solid transparent;border-bottom:1px dashed #cfcfd4;border-radius:var(--r-sm);background:transparent;font:inherit;font-family:"Geist Mono","Geist",ui-monospace,monospace;font-variant-numeric:tabular-nums;font-size:13.5px;font-weight:500;color:var(--ink);transition:border-color .18s var(--ease),background .18s var(--ease),box-shadow .18s var(--ease)}
.cb-ed input[type=text]::placeholder{color:var(--muted);opacity:1;font-weight:400}
.cb-ed input[type=text]:hover{border-color:var(--line);background:#fff}
.cb-ed input[type=text]:focus{outline:none;border-color:var(--accent);background:#fff;box-shadow:0 0 0 3px var(--accent-soft)}
.cb-ed input[type=text].bad,.cb-ed input[type=text].bad:focus{border-color:var(--stop);background:var(--stop-soft);box-shadow:none}
.cb-cur{margin-left:3px;color:var(--muted);font-size:12px}

/* La bande de la sonde : une question, deux réponses. Son fond gris dit qu'elle ne fabrique pas le
   plafond, elle le commente. Le prix qu'on y teste n'entre jamais dans le calcul du plafond. */
.cbp{margin:14px 0 0;padding:11px 13px;background:var(--line2);border-radius:var(--r-sm)}
.cbp-q{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0;color:var(--ink2);font-weight:500}
.cbp-q .cb-ic{width:17px;height:17px;color:var(--muted);flex:none}
.cbp-q .cb-ed input[type=text]{width:8ch;height:var(--ctl);background:#fff;border-color:var(--line);border-bottom-style:solid}
.cbp-chip{height:26px;padding:0 10px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink2);font:inherit;font-size:12px;font-weight:500;cursor:pointer;transition:all .2s var(--ease)}
.cbp-chip:hover{border-color:#d4d4d8;background:var(--line2);color:var(--ink)}
.cbp-chip.on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-h)}
.cbp-a{list-style:none;margin:9px 0 0;padding:0;display:grid;gap:6px;color:var(--muted);font-size:13px;line-height:1.7}
.cbp-a b{font-family:"Geist Mono",monospace;font-variant-numeric:tabular-nums;font-weight:600;color:var(--ink);white-space:nowrap}
.cbp-a .cb-ed input[type=text]{width:6.5ch;height:26px;background:#fff;border-color:var(--line);border-bottom-style:solid}
.cbp-cmp{display:block;color:var(--muted);font-size:12px;line-height:1.4}
.cbp-a b.cbp-no{color:var(--stop)}
.cbp-cmp.cbp-ok{color:var(--go)}
.cbp-cmp.cbp-no{color:var(--stop)}

/* L'état de l'enregistrement : une ligne, quatre valeurs, pas de bandeau qui saute. */
.cb-save{display:flex;align-items:center;gap:7px;margin:12px 0 0;min-height:18px;font-size:12.5px;color:var(--muted)}
.cb-save::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--line);flex:none}
.cb-save[data-state=busy]::before{background:var(--muted);animation:tick 1s steps(2,end) infinite}
.cb-save[data-state=dirty]{color:var(--warn)}.cb-save[data-state=dirty]::before{background:var(--warn)}
.cb-save[data-state=saved]{color:var(--go)}.cb-save[data-state=saved]::before{background:var(--go)}
.cb-save[data-state=bad]{color:var(--stop)}.cb-save[data-state=bad]::before{background:var(--stop)}
.cb-act{display:flex;gap:8px;flex-wrap:wrap;margin-top:9px}
/* Doigt plutôt que souris : les cibles reprennent la hauteur de contrôle du produit. */
@media(max-width:820px){.cb-ed input[type=text]{height:var(--ctl);width:8.5ch}.cb th,.cb .cb-n{font-size:13px}}
/* Le rang de décision ne change que l'étape du lot dans l'outil : la légende le dit une fois pour
   les quatre boutons, et avant le clic. La base 100 % la renvoie sous le rang. */
.lot-decide .lot-note{flex:1 0 100%;margin:0;font-size:12px;line-height:1.5;color:var(--muted)}
