/* PC Builder : mise en page en deux colonnes (composants à gauche, bilan collant à droite),
   préréglages en cartes, sélecteur en boîte de dialogue. Le reste vient de /assets/dado.css. */
.pc-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:14px 24px}
.pc-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:18px;align-items:start;margin-top:22px}
@media (max-width:980px){.pc-layout{grid-template-columns:minmax(0,1fr)}}

/* préréglages */
.presets{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px;margin-top:18px}
.preset{text-align:left;display:flex;flex-direction:column;gap:5px;padding:14px 15px;border-radius:16px;background:var(--glass);border:1px solid var(--edge);color:var(--paper);cursor:pointer;
  font-family:var(--f-display);transition:transform .25s ease,border-color .25s ease,background .25s ease}
.preset:hover{transform:translateY(-3px);border-color:rgba(245,165,36,.5);background:var(--glass-hi)}
.preset b{font-size:16px;letter-spacing:-.01em}
.preset span{font-size:12.5px;color:var(--mute);line-height:1.35}
.preset small{margin-top:auto;padding-top:6px;font:500 12px var(--f-mono);color:var(--amber)}

/* composants */
.slots{display:grid;gap:10px}
.slot{display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:14px;align-items:start;padding:14px 16px;border-radius:16px;background:var(--glass);border:1px solid var(--edge);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);transition:border-color .25s ease}
.slot.bad{border-color:rgba(255,138,122,.55);box-shadow:inset 3px 0 0 var(--bad)}
.slot.warn{border-color:rgba(245,196,81,.45);box-shadow:inset 3px 0 0 var(--warn)}
.slot-ic{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:rgba(245,165,36,.1);border:1px solid rgba(245,165,36,.25)}
.slot-ic svg{width:26px;height:26px;fill:none;stroke:var(--amber);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.slot-cat{font:500 11px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
.slot-cat .opt{letter-spacing:0;text-transform:none;opacity:.7}
.slot-name{margin-top:6px;font-size:17px;font-weight:700;letter-spacing:-.01em;line-height:1.2}
.slot-meta{margin-top:4px;font:400 12.5px/1.4 var(--f-mono);color:var(--mute)}
.slot-probs{margin:8px 0 0;padding:0;list-style:none;display:grid;gap:3px;font-size:13px}
.slot-probs .bad{color:var(--bad)}
.slot-probs .warn{color:var(--warn)}
.slot-side{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.slot-price{display:flex;align-items:center;gap:6px;font:500 12px var(--f-mono);color:var(--mute)}
.slot-price input{width:92px;text-align:right;font:600 16px var(--f-display);color:var(--paper);background:var(--well);border:1px solid var(--edge);border-radius:9px;padding:6px 8px;font-variant-numeric:tabular-nums}
.slot-price input::placeholder{color:var(--paper);opacity:.85}
.slot-price input:focus{outline:none;border-color:var(--amber)}
.slot-actions{display:flex;gap:6px}
.btn.gal{color:var(--amber);border-color:rgba(245,165,36,.35)}
@media (max-width:560px){
  .slot{grid-template-columns:44px minmax(0,1fr)}
  .slot-ic{width:44px;height:44px}
  .slot-side{grid-column:1/-1;flex-direction:row;justify-content:space-between;align-items:center}
}

/* bilan */
.sum{position:sticky;top:86px;display:grid;gap:14px}
@media (max-width:980px){.sum{position:static}}
.total-card{padding:18px 20px;border-radius:18px;background:linear-gradient(145deg,rgba(245,165,36,.18),rgba(12,30,27,.7));border:1px solid rgba(245,165,36,.4)}
.total-card .lbl{color:var(--amber)}
.total{margin-top:6px;font-weight:800;font-stretch:80%;font-size:46px;line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.total-core{margin-top:4px;font:400 12.5px var(--f-mono);color:var(--mute)}
.sum-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}
.sum-actions .btn{justify-content:center}
.links-box{margin:10px 0 0;padding:0;list-style:none;display:grid;gap:6px;font:500 12.5px var(--f-mono)}
.links-box li{display:flex;gap:10px;align-items:center}
.links-box li span{flex:1;color:var(--mute)}
.links-box a{color:var(--amber);text-decoration:none}
.sum-body{padding:16px 18px;border-radius:18px;background:var(--glass);border:1px solid var(--edge);display:grid;gap:16px}
.sum-block .lbl{margin-bottom:8px}
.okline{margin:0;color:var(--ok);font-weight:600}
.badline{margin:3px 0;color:var(--bad);font-size:14px}
.warnline{margin:3px 0;color:var(--warn);font-size:14px}
.gauge{height:10px;border-radius:5px;background:rgba(243,239,230,.1);overflow:hidden}
.gauge i{display:block;height:100%;border-radius:5px;background:var(--ok);transition:width .5s cubic-bezier(.2,.8,.2,1)}
.gauge i.warn{background:var(--warn)}
.gauge i.bad{background:var(--bad)}
.fps{display:grid;grid-template-columns:48px minmax(0,1fr) 64px;gap:8px;align-items:center;margin:6px 0;font-size:14px}
.fps .res{font:500 12px var(--f-mono);color:var(--mute)}
.fps .bar{height:8px;border-radius:4px;background:rgba(243,239,230,.1);overflow:hidden}
.fps .bar i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--jade),var(--amber));transition:width .5s cubic-bezier(.2,.8,.2,1)}
.fps b{font-variant-numeric:tabular-nums;text-align:right}
.fps small{grid-column:2;font:400 11px var(--f-mono);color:var(--mute);margin-top:-4px}
.status{min-height:18px;font:500 12.5px var(--f-mono);color:var(--ok)}

/* sélecteur */
dialog.picker{width:min(720px,calc(100vw - 24px));max-height:calc(100vh - 40px);padding:0;border:1px solid var(--edge);border-radius:20px;background:rgba(10,24,22,.96);color:var(--paper);
  box-shadow:0 40px 100px rgba(0,0,0,.6)}
dialog.picker::backdrop{background:rgba(3,10,9,.65);backdrop-filter:blur(6px)}
.picker-head{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:14px 16px;border-bottom:1px solid var(--edge);position:sticky;top:0;background:rgba(10,24,22,.96);z-index:1}
.picker-head h2{margin:0;font-size:20px;letter-spacing:-.02em;flex:1 1 auto}
.picker-head .in{width:auto;flex:1 1 180px;padding:8px 11px;font-size:14px}
.picker-head select.in{flex:0 1 auto}
.picker-list{list-style:none;margin:0;padding:8px;display:grid;gap:4px;overflow:auto;max-height:calc(100vh - 140px)}
.picker-list li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:stretch;border-radius:12px}
.picker-list li.current{outline:1px solid rgba(245,165,36,.55);background:rgba(245,165,36,.08)}
.picker-list li.incompatible .pick{opacity:.55}
.picker-list .pick{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 14px;text-align:left;padding:10px 12px;border:0;border-radius:12px;background:transparent;color:var(--paper);cursor:pointer;font-family:var(--f-display)}
.picker-list .pick:hover{background:rgba(243,239,230,.07)}
.p-name{font-weight:600;font-size:15px}
.p-meta{grid-column:1;font:400 12px/1.4 var(--f-mono);color:var(--mute)}
.p-meta em{font-style:normal;color:var(--paper)}
.p-probs{grid-column:1;display:flex;flex-wrap:wrap;gap:4px 10px;font-size:12px;margin-top:3px}
.p-probs .bad{color:var(--bad)}
.p-probs .warn{color:var(--warn)}
.p-price{grid-column:2;grid-row:1/span 3;align-self:center;font:600 15px var(--f-mono);color:var(--amber);white-space:nowrap}
.p-gal{display:grid;place-items:center;width:40px;color:var(--mute);text-decoration:none;border-left:1px solid var(--edge);border-radius:0 12px 12px 0}
.p-gal:hover{color:var(--amber);background:rgba(243,239,230,.06)}
.disclaimer{margin-top:18px;font:400 12px/1.5 var(--f-mono);color:var(--dim)}
