/* pets-sidebar.css — v1.39: gaveta lateral dos pets (celular). Usa os mesmos tokens das janelas. */
#pets-sidebar { position: fixed; inset: 0; z-index: 60; pointer-events: none; }
#pets-sidebar .ps-scrim { position: absolute; inset: 0; background: rgba(0,0,0,0); display: none; }
#pets-sidebar.open { pointer-events: auto; }
#pets-sidebar.open .ps-scrim { display: block; background: rgba(0,0,0,.28); }
#pets-sidebar .ps-panel {
  position: absolute; top: max(8px, env(safe-area-inset-top)); bottom: max(8px, env(safe-area-inset-bottom));
  right: max(8px, env(safe-area-inset-right)); width: min(290px, 52vw);
  display: flex; flex-direction: column; border-radius: 14px;
  background: rgba(14,17,24,.97); border: 1px solid rgba(198,161,91,.45); box-shadow: 0 8px 28px rgba(0,0,0,.6);
  transform: translateX(115%); transition: transform .2s ease-out; color: #e8d5a8; font: 600 13px/1.25 var(--font-ui, system-ui, sans-serif);
}
body.ctl-lefty #pets-sidebar .ps-panel { right: auto; left: max(8px, env(safe-area-inset-left)); transform: translateX(-115%); }
#pets-sidebar.open .ps-panel { transform: none; }
#pets-sidebar .ps-head { display: flex; align-items: center; justify-content: space-between; padding: 6px 10px; border-bottom: 1px solid rgba(198,161,91,.28); font: 700 14px var(--font-display, Cinzel, Georgia, serif); }
#pets-sidebar .ps-head button { width: 30px; height: 30px; border-radius: 8px; border: 1px solid rgba(255,255,255,.2); background: transparent; color: #ccc; font-size: 16px; }
#pets-sidebar .ps-body { flex: 1; overflow-y: auto; overscroll-behavior: contain; padding: 6px 10px 10px; display: flex; flex-direction: column; gap: 6px; }
#pets-sidebar h4 { margin: 4px 0 0; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: #a8925f; }
#pets-sidebar .ps-card { display: flex; align-items: center; gap: 8px; padding: 6px; border-radius: 10px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1); }
#pets-sidebar .ps-gold { border-color: #e0b84a; }
#pets-sidebar .ps-ico { font-size: 26px; }
#pets-sidebar .ps-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
#pets-sidebar .ps-info b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#pets-sidebar .ps-tag { font-size: 11px; color: #bbb; } #pets-sidebar .ps-ok { color: #8fe08f; } #pets-sidebar .ps-hurt { color: #ff9a8a; }
#pets-sidebar .ps-bond { display: block; height: 4px; border-radius: 2px; background: rgba(255,255,255,.12); overflow: hidden; }
#pets-sidebar .ps-bond u { display: block; height: 100%; background: #c6a15b; }
#pets-sidebar .ps-card button { min-height: 36px; padding: 0 8px; border-radius: 8px; border: 1px solid rgba(198,161,91,.5); background: rgba(198,161,91,.12); color: #e8d5a8; font: 700 11px inherit; }
#pets-sidebar .ps-skill, #pets-sidebar .ps-manage { min-height: 44px; border-radius: 10px; border: 1px solid rgba(198,161,91,.6); background: rgba(198,161,91,.2); color: #f3e2b5; font: 700 13px inherit; }
#pets-sidebar .ps-manage { background: transparent; border-color: rgba(255,255,255,.2); color: #ccc; }
#pets-sidebar .ps-skill:disabled { opacity: .5; }
#pets-sidebar .ps-empty { padding: 8px; color: #999; font-size: 12px; }
