/* 컨트롤 패널 */
.ps-controls {
  position:absolute;
  bottom:12px;
  left:50%;                          /* 가운데 정렬 기준 */
  transform:translateX(-50%);        /* 가운데 정렬 보정 */
  display:flex;
  flex-direction:column;
  border-radius:12px;
  background:rgba(0,0,0,.35);
  backdrop-filter: blur(6px);
  color:#fff;
  font:14px/1.4 system-ui, -apple-system, Roboto;
  pointer-events:auto;
  transition:all 0.3s ease;
  width:90%;                         /* 모바일 기본 폭 */
  max-width: 480px;                  /* 너무 넓어지지 않도록 제한 */
}
.ps-controls .row{ display:flex; gap:8px; flex-wrap:wrap; }
.ps-controls input, .ps-controls button{
  flex:1 1 auto; padding:6px; border-radius:8px; border:1px solid rgba(255,255,255,.2);
  background:rgba(255,255,255,.08); color:#fff;
}
.ps-controls button{ cursor:pointer; }
.ps-controls-bar {
  display:flex; justify-content:space-between; align-items:center;
  padding:4px 6px; background:rgba(0,0,0,.5); border-radius:12px 12px 0 0;
  cursor:default; height: 28px;
}
/*.ps-controls-bar:active { cursor:grabbing; }*/
.ps-bar-btn {  
  flex:0 0 auto !important; 
  display:flex; 
  align-items:center; 
  justify-content:center;
  width:20px; 
  height:20px;
  background:none; 
  border:none; 
  color:#fff; 
  font-size:14px;
  padding:0; 
  cursor:pointer; 
  border-radius:4px;
}
.ps-bar-btn:hover { background:rgba(255,255,255,0.15); }
.ps-bar-title { flex:1; text-align:center; font-weight:600; font-size:13px;}
.ps-controls-body {
  padding:8px; display:flex; flex-direction:column; gap:6px;
  overflow:hidden;transition: max-height 0.3s ease;
}
.ps-controls.collapsed .ps-controls-body { max-height:0; padding:0; margin:0; overflow:hidden;}
.ps-controls.collapsed .ps-controls-bar { border-radius:12px; }
.ps-adjust-col { display:flex; flex-direction:column; align-items:center; flex:1; min-width:50px; gap:4px; }
.ps-adjust-label { font-weight:600; font-size:12px;}
.ps-adjust-btn { width:32px; height:28px; line-height:1; padding:0; border-radius:6px;}
.ps-adjust-btn.minus { background:rgba(255,0,0,.3); }
.ps-adjust-btn.plus  { background:rgba(0,255,0,.3); }

/* 태블릿 이상 (600px ~) */
@media (min-width: 600px) {
  .ps-controls {
    width: 540px;
    left:50%;
    bottom:12px;
    transform:translateX(-50%);
  }
}

/* PC (920px ~) */
@media (min-width: 920px) {
  .ps-controls {
    right:12px;
    left:auto;
    bottom:12px;
    transform:none;
    width:420px;
  }
}