/* The standard desktop locker keeps its existing keyboard/controller hints.
   Touch + ?touch=1 share one layout; source artwork remains an opaque paper card. */
/* These nodes are shortcut annotations, never the actual action/back buttons. */
body.pr-touch-capable .iw-prompts, body.pr-touch-capable .iw-hint, body.pr-touch-capable .iw-tabs__hint { display: none !important; }
/* Touch selection has its own checked card/button state. A floating keyboard
   cursor can otherwise linger at the old viewport coordinates after rotation. */
body.pr-touch-capable .iw-cursor { display: none; }
.pr-locker-preview-stage { display: contents; }
.pr-locker-kit { display: none; }
.pr-locker-kit[hidden] { display: none !important; }
.pr-locker-touch { --locker-left: max(env(safe-area-inset-left,0px),var(--safe-area-inset-left,0px)); --locker-right: max(env(safe-area-inset-right,0px),var(--safe-area-inset-right,0px)); --locker-top: max(env(safe-area-inset-top,0px),var(--safe-area-inset-top,0px)); --locker-bottom: max(env(safe-area-inset-bottom,0px),var(--safe-area-inset-bottom,0px)); background: #f7f4ea; }
.pr-locker-touch:has(.pr-roster-art.is-3d) { background: transparent; }
.pr-locker-touch .iw-scrim-left, .pr-locker-touch > .iw-prompts, .pr-locker-touch .iw-backbtn .iw-hint { display: none; }
.pr-locker-touch .iw-head { left: calc(12px + var(--locker-left)); top: calc(10px + var(--locker-top)); right: auto; gap: 9px; max-width: 36%; }
.pr-locker-touch .iw-head__title { font-size: 23px; }
.pr-locker-touch .iw-head__sub { display: none; }
.pr-locker-touch .iw-backbtn { min-width: 44px; min-height: 44px; padding: 6px; }
.pr-locker-touch .iw-backbtn__arrow { width: 30px; height: 30px; }
.pr-locker-touch .iw-locker__body { left: calc(12px + var(--locker-left)); top: calc(68px + var(--locker-top)); bottom: calc(12px + var(--locker-bottom)); width: calc(37% - 18px - var(--locker-left)); margin: 0; padding: 4px; box-sizing: border-box; display: grid; grid-template-rows: minmax(0,1fr) auto auto; gap: 6px; overflow: visible; }
.pr-locker-touch .pr-hero-detail, .pr-locker-touch .pr-hero-scope { display: none; }
.pr-locker-touch .pr-hero-grid { min-width: 0; min-height: 0; display: grid; grid-template-columns: repeat(4,minmax(44px,1fr)); grid-template-rows: repeat(2,minmax(92px,1fr)); gap: 6px; padding: 4px; overflow: auto; overscroll-behavior: contain; }
.pr-locker-touch .pr-hero-card { min-height: 92px; height: 100%; }
.pr-locker-touch .pr-hero-card__portrait { height: calc(100% - 34px); bottom: 34px; }
.pr-locker-touch .pr-hero-card__caption { min-height: 34px; padding: 3px; flex-direction: column; justify-content: center; align-items: center; gap: 0; }
.pr-locker-touch .pr-hero-card__caption b { font-size: 12px; }
.pr-locker-touch .pr-hero-card__element { font-size: 10px; }
.pr-locker-touch .pr-hero-card__badge { top: 3px; left: 3px; width: 23px; height: 23px; padding: 3px; }
.pr-locker-touch .pr-hero-card__check { top: 3px; right: 3px; width: 18px; height: 18px; }
.pr-locker-touch .pr-hero-status { font-size: 11px; line-height: 1.3; overflow-wrap: anywhere; }
.pr-locker-touch .pr-hero-foot { position: static; display: flex; gap: 6px; padding: 0; margin: 0; }
.pr-locker-touch .pr-hero-foot .iw-btn { min-width: 0; min-height: 44px; height: 44px; flex: 1; font-size: 13px; padding: 4px 6px; }
.pr-locker-touch .pr-hero-preview { left: 38%; right: calc(12px + var(--locker-right)); top: calc(10px + var(--locker-top)); width: auto; }
.pr-locker-touch .iw-name { display: flex; align-items: center; gap: 8px; transform: none; }
.pr-locker-touch .iw-name__label { color: #17263b; font-size: 11px; margin: 0; }
.pr-locker-touch .iw-name__field { flex: 1; min-width: 0; }
.pr-locker-touch .iw-name__input { min-height: 44px; height: 44px; font-size: 14px; }
.pr-locker-touch .pr-locker-preview-stage { position: absolute; left: 38%; right: calc(12px + var(--locker-right)); top: calc(68px + var(--locker-top)); bottom: calc(12px + var(--locker-bottom)); display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.08fr); gap: 8px; min-height: 0; }
.pr-locker-touch .pr-roster-art { position: relative; inset: auto; width: auto; height: 100%; min-height: 0; display: grid; grid-template-rows: minmax(0,1fr) auto; border: 1px solid #17263b24; border-radius: 8px; background: #e4dedb; }
.pr-locker-touch .pr-roster-standing { width: 100%; height: 100%; min-height: 0; max-width: none; max-height: none; padding: 0; align-self: stretch; object-fit: contain; }
.pr-locker-touch .pr-roster-toolbar { display: block; margin: 0; padding: 4px; }
.pr-locker-touch .pr-roster-caption { display: none; }
.pr-locker-touch .pr-preview-toggle { width: 100%; min-height: 44px; padding: 5px; font-size: 12px; }
.pr-locker-touch .pr-roster-art.is-3d { background: transparent; border-color: transparent; pointer-events: auto; touch-action: none; }
.pr-locker-touch .pr-roster-art.is-3d .pr-roster-toolbar { touch-action: manipulation; }
.pr-locker-touch .pr-locker-kit { display: block; min-width: 0; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 8px; border: 1px solid #17263b20; border-radius: 8px; color: #17263b; background: #fbf9f1f5; font-size: 11px; line-height: 1.35; }
.pr-locker-kit__identity { display: flex; flex-wrap: wrap; align-items: center; column-gap: 6px; }
.pr-locker-kit__identity h2 { margin: 0; font-size: 20px; line-height: 1.15; }
.pr-locker-kit__identity > span:not(.pr-element-badge) { font-size: 11px; }
.pr-locker-kit__identity .pr-element-badge { width: 23px; height: 23px; padding: 3px; margin-left: auto; }
.pr-locker-kit > p { margin: 4px 0 8px; font-size: 11px; }
.pr-locker-kit__abilities { display: grid; gap: 8px; padding: 0; margin: 0; list-style: none; }
.pr-locker-kit__ability { display: grid; grid-template-columns: 20px minmax(0,1fr); gap: 6px; border-top: 1px solid #17263b18; padding-top: 7px; overflow-wrap: anywhere; }
.pr-locker-kit__ability i { width: 20px; height: 20px; margin-top: 2px; color: #357c82; }
.pr-locker-kit__ability svg { width: 100%; height: 100%; }
.pr-locker-kit__ability b, .pr-locker-kit__ability small, .pr-locker-kit__slot { display: block; }
.pr-locker-kit__ability b { font-size: 13px; line-height: 1.25; margin: 2px 0; }
.pr-locker-kit__ability small { font-size: 11px; line-height: 1.35; }
.pr-locker-kit__purpose { margin: 4px 0; font-size: 11px; line-height: 1.4; }
.pr-locker-kit__slot { font-size: 10px; color: #4b6574; }
.pr-locker-kit__condition { margin-top: 3px; }
.pr-locker-kit__condition[hidden] { display: none; }

@media (orientation: portrait) {
  .pr-locker-touch { display: grid; grid-template-columns: minmax(0,1fr); grid-template-rows: auto auto auto minmax(340px,1fr); gap: 10px; align-content: start; padding: calc(10px + var(--locker-top)) calc(12px + var(--locker-right)) calc(72px + var(--locker-bottom)) calc(12px + var(--locker-left)); box-sizing: border-box; overflow-y: auto; overscroll-behavior: contain; }
  .pr-locker-touch .iw-head { position: relative; inset: auto; max-width: none; min-height: 44px; }
  .pr-locker-touch .iw-locker__body { position: relative; inset: auto; width: auto; padding: 3px; display: grid; grid-template-rows: 192px auto; gap: 6px; }
  .pr-locker-touch .pr-hero-grid { grid-template-rows: repeat(2,minmax(88px,1fr)); }
  .pr-locker-touch .pr-hero-card { min-height: 88px; }
  .pr-locker-touch .pr-hero-preview { position: relative; inset: auto; width: auto; }
  .pr-locker-touch .pr-locker-preview-stage { position: relative; inset: auto; width: auto; min-height: 340px; grid-template-columns: minmax(0,1fr) minmax(0,1.05fr); }
  .pr-locker-touch .pr-hero-foot { position: fixed; bottom: calc(8px + var(--locker-bottom)); left: calc(12px + var(--locker-left)); right: calc(12px + var(--locker-right)); z-index: 5; padding: 6px; border: 1px solid #17263b20; border-radius: 8px; background: #f7f4eaf7; }
  .pr-locker-touch .pr-hero-foot .iw-btn { height: 44px; }
}
@media (orientation: landscape) and (max-width: 700px) {
  .pr-locker-touch .iw-locker__body { width: calc(35% - 18px - var(--locker-left)); }
  .pr-locker-touch .pr-hero-grid { grid-template-columns: repeat(2,minmax(44px,1fr)); grid-template-rows: repeat(4,92px); }
  .pr-locker-touch .pr-hero-preview, .pr-locker-touch .pr-locker-preview-stage { left: 36%; }
  .pr-locker-touch .pr-locker-kit { padding: 6px; }
  .pr-locker-touch .pr-hero-foot .iw-btn { justify-content: center; gap: 0; }
  .pr-locker-touch .pr-hero-foot .iw-btn__icon { display: none; }
}
