/* ============================================================
   TWEAKS panel (vanilla, host-protocol driven)
   ============================================================ */
.tweaks{
  position:fixed;top:50%;right:20px;transform:translateY(-50%);z-index:9500;
  width:300px;max-height:88vh;overflow-y:auto;display:none;
  background:rgba(16,16,18,.94);backdrop-filter:blur(16px) saturate(1.2);
  border:1px solid var(--line-2);border-radius:10px;
  box-shadow:0 40px 80px -30px rgba(0,0,0,.9);
  font-family:var(--f-body);
}
.tweaks.show{display:block}
.tweaks__head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(16,16,18,.96);backdrop-filter:blur(8px);z-index:2}
.tweaks__head b{font-family:var(--f-display);text-transform:uppercase;letter-spacing:.1em;font-size:16px;font-weight:600;display:flex;align-items:center;gap:9px}
.tweaks__head b::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--carmim);box-shadow:0 0 8px var(--carmim)}
.tweaks__x{width:30px;height:30px;border-radius:6px;border:1px solid var(--line-2);background:none;color:var(--paper-2);font-size:17px;line-height:1}
.tweaks__x:hover{color:var(--paper);border-color:var(--paper)}
.tweaks__body{padding:18px}
.tw-group{margin-bottom:22px}
.tw-group:last-child{margin-bottom:4px}
.tw-group > label{display:block;font-family:var(--f-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:11px}
.tw-seg{display:grid;gap:6px}
.tw-seg.cols-3{grid-template-columns:1fr 1fr 1fr}
.tw-opt{
  background:rgba(0,0,0,.3);border:1px solid var(--line);border-radius:6px;color:var(--paper-2);
  font-family:var(--f-display);text-transform:uppercase;font-size:13px;letter-spacing:.03em;font-weight:500;
  padding:11px 12px;text-align:left;transition:all .2s;width:100%;
}
.tw-seg.cols-3 .tw-opt{text-align:center;padding:11px 4px;font-size:12px}
.tw-opt:hover{color:var(--paper);border-color:var(--line-2)}
.tw-opt.active{color:#fff;border-color:var(--carmim);background:linear-gradient(180deg,rgba(181,18,27,.32),rgba(181,18,27,.1))}
.tw-swatches{display:flex;gap:10px}
.tw-sw{flex:1;height:42px;border-radius:6px;border:2px solid transparent;cursor:pointer;position:relative;transition:transform .2s}
.tw-sw:hover{transform:translateY(-2px)}
.tw-sw.active{border-color:var(--paper)}
.tw-sw.active::after{content:"✓";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:15px;text-shadow:0 1px 3px rgba(0,0,0,.8)}
.tweaks__note{font-family:var(--f-mono);font-size:10.5px;line-height:1.5;color:var(--muted-2);letter-spacing:.04em;padding:14px 18px;border-top:1px solid var(--line)}
@media (max-width:560px){.tweaks{right:10px;left:10px;width:auto}}