/* DMG Voice V3.6.1 - compact rack + unified action bar */

/* Rack: compact, adjacent stones, still draggable on desktop */
.okeyLounge .opRack{padding-bottom:10px!important}
.okeyLounge .opRackTiles{display:block!important;height:auto!important;overflow:visible!important}
.okeyLounge .opRackRow{display:flex!important;align-items:flex-end!important;gap:1px!important;min-height:59px!important;width:100%!important}
.okeyLounge .opRackSlot{flex:0 0 auto!important;position:relative!important;display:flex!important;align-items:center!important;justify-content:center!important;overflow:visible!important;transition:.15s ease!important}
.okeyLounge .opRackSlot.filled{width:41px!important;height:58px!important;border:1px solid rgba(255,222,173,.18)!important;border-radius:5px!important;background:rgba(94,48,13,.12)!important}
.okeyLounge .opRackSlot.empty{width:10px!important;height:58px!important;border:1px dashed rgba(255,222,173,.18)!important;border-radius:5px!important;background:rgba(255,255,255,.03)!important}
.okeyLounge .opRackSlot.empty + .opRackSlot.empty{margin-left:-2px!important}
.okeyLounge .opRackSlot.dragOver{background:rgba(67,222,164,.18)!important;border-color:#43dea4!important;box-shadow:inset 0 0 0 2px rgba(67,222,164,.24)!important}
.okeyLounge .opRackSlot.selected{border-color:#7f68ff!important;box-shadow:0 0 0 1px rgba(127,104,255,.22)!important}
.okeyLounge .opRackSlot .opTileFace{width:39px!important;height:56px!important;max-width:none!important;margin:0!important}
.okeyLounge .opRackSlot .opTileFace b{font-size:18px!important}

/* Unified buttons in marked red area */
.opTableActionBar{position:absolute;z-index:40;left:50%;bottom:162px;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 12px;border-radius:16px;background:linear-gradient(180deg,rgba(9,16,24,.94),rgba(13,22,31,.86));border:1px solid rgba(255,255,255,.12);box-shadow:0 18px 36px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.06);backdrop-filter:blur(8px)}
.opTableActionBar .opAction{position:static!important;transform:none!important;min-width:132px;height:44px;padding:0 16px!important;border-radius:12px!important;font-size:12px!important;font-weight:900!important;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;letter-spacing:.1px;box-shadow:0 10px 20px rgba(0,0,0,.28)!important}
.opTableActionBar .opAction.tea{background:linear-gradient(135deg,#805321,#b7752b)!important;color:#ffe1b1!important}
.opTableActionBar .opAction:disabled{opacity:.42!important;filter:grayscale(.42)!important}

/* Keep only history below */
.okeyLounge .opBottomBar.historyOnly{grid-template-columns:1fr!important}
.okeyLounge .opBottomBar.historyOnly .opHistoryBtn{justify-self:end!important}
.okeyLounge .opBottomBar .opActions{display:none!important}

/* Small visual alignment so action bar sits above player card */
.okeyLounge .opPlayer.bottom{bottom:116px!important}

@media (max-width:1280px){
  .opTableActionBar{gap:6px;padding:8px 10px;bottom:154px}
  .opTableActionBar .opAction{min-width:116px;height:40px;font-size:11px!important;padding:0 12px!important}
}
@media (max-width:980px){
  .okeyLounge .opRackSlot.filled{width:31px!important;height:46px!important}
  .okeyLounge .opRackSlot.empty{width:8px!important;height:46px!important}
  .okeyLounge .opRackSlot .opTileFace{width:30px!important;height:45px!important}
  .okeyLounge .opRackSlot .opTileFace b{font-size:13px!important}
  .opTableActionBar{left:50%;bottom:118px;transform:translateX(-50%);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:min(94%,720px);gap:5px;padding:7px 8px}
  .opTableActionBar .opAction{min-width:0;width:100%;height:34px;font-size:9px!important;padding:0 8px!important}
  .okeyLounge .opPlayer.bottom{bottom:92px!important}
  .okeyLounge .opBottomBar.historyOnly{bottom:4px!important}
}
@media (max-width:560px){
  .opTableActionBar{grid-template-columns:repeat(2,minmax(0,1fr));bottom:112px;width:min(96%,520px)}
  .opTableActionBar .opAction{height:32px;font-size:8px!important;border-radius:10px!important}
  .okeyLounge .opRackRow{min-height:47px!important}
  .okeyLounge .opRackSlot.empty{width:6px!important}
  .okeyLounge .opRackSlot.filled{width:28px!important}
  .okeyLounge .opRackSlot .opTileFace{width:27px!important;height:43px!important}
}