/* ── Configurateur de table à rallonges ─────────────────────────────── */
.conf{background:var(--surface);border:1px solid var(--bordure);border-top:2px solid var(--rouge)}
.conf-head{padding:clamp(1.2rem,3vw,2rem) clamp(1.1rem,3vw,2rem) 0}
.conf-read{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--bordure);
  margin:clamp(1.1rem,3vw,1.6rem) 0 0}
.conf-read div{background:var(--surface);padding:1rem .7rem 1.1rem;text-align:center}
.conf-read b{display:block;font-family:var(--font-head);font-weight:800;line-height:.94;
  font-size:clamp(1.9rem,7vw,2.9rem);letter-spacing:-.01em}
.conf-read b.hi{color:var(--rouge)}
.conf-read span{display:block;font-family:var(--font-mono);font-size:.64rem;letter-spacing:.09em;
  text-transform:uppercase;color:var(--gris);margin-top:.4rem}
@keyframes cpulse{from{transform:scale(1.13)}to{transform:scale(1)}}
.conf-read b.pulse{animation:cpulse .3s cubic-bezier(.2,.8,.2,1)}

/* Scène */
.conf-scene{position:relative;padding:1.4rem clamp(.8rem,2.5vw,1.6rem) .9rem;overflow:hidden}
.conf-ruler{position:relative;height:20px;margin-bottom:.5rem;
  border-bottom:1px solid var(--surface3)}
.conf-ruler i{position:absolute;bottom:0;width:1px;height:7px;background:var(--acier);font-style:normal}
.conf-ruler i.half{height:4px;background:var(--surface3)}
.conf-ruler i.end{height:11px;background:var(--rouge)}
.conf-ruler i.end::after{color:var(--blanc);font-weight:700}
.conf-ruler i::after{content:attr(data-m);position:absolute;bottom:8px;left:0;transform:translateX(-50%);
  font-family:var(--font-mono);font-size:.6rem;color:var(--gris);white-space:nowrap}
.conf-stage{position:relative;height:clamp(150px,30vw,208px);
  background:
    linear-gradient(90deg,rgba(233,234,232,.028) 0 1px,transparent 1px) 0 0/28px 100%,
    var(--noir);
  border:1px solid var(--bordure);overflow:hidden;touch-action:pan-y}
.conf-rig{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  transition:width .42s cubic-bezier(.3,.7,.2,1)}
.conf-plate{position:relative;height:clamp(52px,10vw,74px);border-radius:7px;
  background:repeating-linear-gradient(0deg,rgba(78,48,20,.09) 0 1px,transparent 1px 7px),
             linear-gradient(180deg,#d5aa6e 0%,#c1914f 52%,#a97740 100%);
  box-shadow:0 18px 38px rgba(0,0,0,.55),inset 0 2px 0 rgba(255,255,255,.24),inset 0 -8px 0 rgba(0,0,0,.19);
  overflow:hidden}
.conf-plate::after{content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,rgba(255,255,255,.15),transparent 44%)}
.conf-seam{position:absolute;top:11%;bottom:11%;width:2px;background:rgba(70,42,18,.44);
  box-shadow:1px 0 0 rgba(255,255,255,.10);transform:translateX(-50%);
  transition:left .42s cubic-bezier(.3,.7,.2,1),opacity .25s}
.conf-chair{position:absolute;top:0;left:0;width:clamp(11px,1.7vw,17px);height:clamp(11px,1.7vw,17px);
  background:var(--surface3);border-radius:4px;opacity:0;
  transform:translate(-50%,var(--ty)) scale(.4);
  transition:opacity .3s,transform .3s cubic-bezier(.2,.8,.2,1),left .42s cubic-bezier(.3,.7,.2,1)}
.conf-chair.on{opacity:1;transform:translate(-50%,var(--ty)) scale(1)}
.conf-chair::after{content:"";position:absolute;left:16%;right:16%;height:3px;border-radius:2px;background:var(--acier)}
.conf-chair.top{--ty:calc(-100% - 8px)}
.conf-chair.top::after{top:1px}
.conf-chair.bot{--ty:calc(clamp(52px,10vw,74px) + 8px)}
.conf-chair.bot::after{bottom:1px}
/* Commandes */
.conf-ctl{padding:0 clamp(1.1rem,3vw,2rem) clamp(1.3rem,3vw,2rem);display:flex;flex-direction:column;gap:1.25rem}
.conf-line{display:flex;align-items:center;gap:.75rem}
.conf-step{width:52px;height:52px;flex-shrink:0;background:var(--surface2);border:1px solid var(--bordure);
  color:var(--blanc);font-size:1.5rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:.2s}
.conf-step:hover:not(:disabled){background:var(--rouge);border-color:var(--rouge)}
.conf-step:disabled{opacity:.3;cursor:default}
input[type=range].conf-slider{-webkit-appearance:none;appearance:none;flex:1;min-width:0;height:5px;
  border-radius:5px;background:var(--surface3);outline:none;cursor:pointer;margin:0}
input[type=range].conf-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:30px;height:30px;
  border-radius:50%;background:var(--rouge);border:3px solid var(--blanc);box-shadow:0 2px 10px rgba(0,0,0,.5)}
input[type=range].conf-slider::-moz-range-thumb{width:30px;height:30px;border-radius:50%;background:var(--rouge);
  border:3px solid var(--blanc);box-shadow:0 2px 10px rgba(0,0,0,.5)}
.conf-lbl{font-family:var(--font-mono);font-size:.68rem;font-weight:700;letter-spacing:.09em;
  text-transform:uppercase;color:var(--gris);margin-bottom:.6rem;display:flex;justify-content:space-between;gap:1rem}
.conf-lbl u{text-decoration:none;color:var(--blanc)}
.conf-opts{display:flex;gap:.5rem;flex-wrap:wrap}
.conf-opts button{font-family:var(--font-mono);font-size:.8rem;background:var(--surface2);
  border:1px solid var(--bordure);color:var(--gris-clair);padding:.6rem .85rem;min-height:44px;cursor:pointer;transition:.2s}
.conf-opts button:hover{color:var(--blanc);border-color:var(--acier)}
.conf-opts button[aria-pressed="true"]{background:var(--rouge);border-color:var(--rouge);color:#fff}
.conf-presets{display:flex;gap:.5rem;flex-wrap:wrap}
.conf-presets button{font-family:var(--font-head);font-size:.98rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.04em;background:transparent;border:1px solid var(--bordure);color:var(--gris-clair);
  padding:.6rem 1rem;min-height:44px;cursor:pointer;transition:.2s}
.conf-presets button:hover{color:var(--blanc);border-color:var(--rouge)}

/* Coulisse : où vont les allonges */
.conf-inside{border-top:1px solid var(--bordure);padding:clamp(1.1rem,3vw,1.6rem) clamp(1.1rem,3vw,2rem);
  display:grid;grid-template-columns:auto 1fr;gap:1.2rem;align-items:center}
.conf-box{width:132px;height:76px;flex-shrink:0;position:relative;border:2px solid var(--acier);border-radius:4px;
  background:linear-gradient(180deg,#c1914f,#a97740);display:flex;flex-direction:column;justify-content:center;
  gap:3px;padding:6px 8px;overflow:hidden}
.conf-box i{display:block;height:4px;border-radius:2px;background:rgba(46,28,10,.42);
  box-shadow:0 1px 0 rgba(255,255,255,.16)}
.conf-inside p{font-size:.9rem;line-height:1.62;color:var(--gris-clair)}
.conf-inside p b{color:var(--blanc)}
.conf-foot{border-top:1px solid var(--bordure);padding:clamp(1.1rem,3vw,1.6rem) clamp(1.1rem,3vw,2rem);
  display:flex;gap:.8rem;flex-wrap:wrap;align-items:center;justify-content:space-between}
.conf-foot small{font-family:var(--font-mono);font-size:.7rem;color:var(--gris);line-height:1.6}
@media (max-width:520px){
  .conf-read b{font-size:1.75rem}
  .conf-inside{grid-template-columns:1fr}
  .conf-box{width:100%;max-width:190px}
  .conf-foot .btn{width:100%}
}
