.play-completed-pagination { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:12px; padding:16px 8px; color:var(--ink,#07133f); font:600 14px/1.4 "Barlow Semi Condensed",sans-serif; }
.play-completed-pagination[hidden] { display:none; }
.play-completed-pagination button,.play-table-join { display:inline-block; border:1px solid #a96d8b; border-radius:0; padding:7px 12px; background:#ffc9e2; color:#4b1644; box-shadow:2px 2px 0 #d8b7c7; font:400 13px/1.2 "Easy Pixel",sans-serif; text-decoration:none; cursor:pointer; }
.play-completed-pagination button:disabled { opacity:.45; cursor:default; box-shadow:none; }
.play-completed-pagination button:focus-visible,.play-table-join:focus-visible { outline:2px solid #07133f; outline-offset:3px; }
.play-active-status-cell { flex-wrap:wrap; gap:6px; }
/* Flat Play directory: shared columns, quiet surfaces, visible enrollment details. */

.play-shell .play-stage { grid-template-columns:minmax(0,1fr) 240px; gap:22px; padding:0; }
.play-shell .play-enroll-view-stage { grid-template-columns:minmax(0,1fr); }
.play-shell .play-active-games { min-width:0; }
.play-shell .play-stage-subheading { font:400 23px/1.2 "Easy Pixel",sans-serif; color:#07133f; margin:0 0 14px; }
.play-shell .play-active-tabs { display:flex; flex-wrap:wrap; gap:6px; padding:0 0 14px; border:0; background:none; }
.play-shell .play-active-tabs button { padding:7px 10px; border:1px solid #b7bac6; border-radius:0; background:#fff; color:#4c5064; font:400 12px/1.2 "Easy Pixel",sans-serif; box-shadow:none; }
.play-shell .play-active-tabs button::after { display:none; }
.play-shell .play-active-tabs button.is-active { background:#ffc9e2; color:#4b1644; border-color:#a96d8b; }
.play-shell .play-active-table-wrap { border:1px solid #b7bac6; border-radius:0; background:#fff; box-shadow:3px 3px 0 #d9dce4; overflow:visible; }
.play-shell .play-active-table { display:table; border-collapse:collapse; table-layout:fixed; font-size:14px; }
.play-shell .play-active-table thead { display:table-header-group; background:#f5f5f7; color:#626577; }
.play-shell .play-active-table tbody { display:table-row-group; }
.play-shell .play-active-table thead th { font:400 12px/1.2 "Easy Pixel",sans-serif; }
.play-shell .play-active-table thead th:first-child { width:45%; }
.play-shell .play-active-table thead th:nth-child(2) { width:18%; }
.play-shell .play-active-table thead th:nth-child(3) { width:15%; }
.play-shell .play-active-table tbody .play-active-row { display:table-row; border:0; border-bottom:1px solid #e0e1e7; border-radius:0; background:#fff; box-shadow:none; transform:none; }
.play-shell .play-active-table tbody .play-active-row:nth-child(odd) { background:#fafafa; }
.play-shell .play-active-table tbody .play-active-row:hover { background:#fff0f7; }
.play-shell .play-active-table th,.play-shell .play-active-table td { padding:12px 10px; vertical-align:middle; white-space:normal; }
.play-shell .play-active-table td:nth-child(3) { display:table-cell; }
.play-shell .play-active-game-art { width:40px; height:40px; border-radius:0; border:1px solid #e0e1e7; background:#fff; box-shadow:none; }
.play-shell .play-active-game-art::after { display:none; }
.play-shell .play-active-game-logo { width:36px; height:36px; filter:none; }
.play-shell .play-active-game-lockup { gap:10px; }
.play-shell .play-active-game-name { font:700 16px/1.2 "Barlow Semi Condensed",sans-serif; color:#07133f; white-space:normal; }
.play-shell .play-active-game-meta { font-size:11px; color:#626577; flex-wrap:wrap; }
.play-shell .play-active-status { border:0; border-radius:0; background:none; padding:0; font:600 12px/1.3 "Barlow Semi Condensed",sans-serif; color:#626577; }
.play-shell .play-active-status-cell { justify-content:flex-start; }
.play-shell .play-active-divider { display:table-row; background:#fff7fb; }
.play-shell .play-active-divider td { display:table-cell; border-block:1px solid #e0d4db; padding:8px 10px; }
.play-shell .play-active-divider span { display:block; text-align:left; font:400 13px/1.2 "Easy Pixel",sans-serif; letter-spacing:0; text-transform:none; color:#4b1644; }
.play-shell .play-active-divider span::before,.play-shell .play-active-divider span::after { display:none; }
.play-shell .play-active-row[hidden],.play-shell .play-active-divider[hidden],.play-shell .play-active-tabs[hidden] { display:none!important; }
.play-shell .play-rail { position:static; gap:18px; }
.play-shell .play-rail-enroll { display:flex; width:100%; height:auto; min-height:48px; justify-content:center; gap:10px; padding:12px; border:1px solid #a96d8b; border-radius:0; background:#ffc9e2; box-shadow:3px 3px 0 #d8b7c7; box-sizing:border-box; }
.play-shell .play-rail-enroll::before { display:none; }
.play-shell .play-rail-enroll-shape { display:none; }
.play-shell .play-rail-enroll-label { max-width:none; color:#4b1644; -webkit-text-stroke:0; transform:none; font:400 17px/1.2 "Easy Pixel",sans-serif; text-transform:none; }
.play-shell .play-rail-card { border:1px solid #b7bac6; border-radius:0; background:#fff; box-shadow:3px 3px 0 #d9dce4; padding:14px; }
.play-shell .play-rail-card-head h2 { font:400 17px/1.2 "Easy Pixel",sans-serif; }
.play-shell .play-bulletin-item { border:0; border-bottom:1px solid #e0e1e7; border-radius:0; background:#fff; box-shadow:none; padding:10px 0; }
.play-shell .play-enroll-groups { display:grid; gap:24px; width:100%; max-width:none; }
.play-shell .play-enroll-group { width:100%; max-width:none; border:1px solid #b7bac6; border-radius:0; background:#fff; box-shadow:3px 3px 0 #d9dce4; }
.play-shell .play-enroll-group-heading { background:#fff0f7; border:0; border-radius:0; padding:12px 16px; }
.play-shell .play-enroll-group-title { color:#07133f; font:400 20px/1.2 "Easy Pixel",sans-serif; }
.play-shell .play-enroll-group-body { padding:16px; }
.play-shell .play-enroll-view .play-card-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:16px; width:100%; max-width:none; }
.play-shell .play-enroll-view .play-card-row { display:contents; }
.play-shell .play-card { display:flex; flex-direction:column; border:1px solid #b7bac6; border-radius:0; background:#fff; box-shadow:2px 2px 0 #e0e1e7; transform:none; overflow:visible; }
.play-shell .play-card-media { height:150px; aspect-ratio:auto; margin:10px; border-radius:0; }
.play-shell .play-card-media img { width:100%; height:100%; object-fit:contain; filter:none; transform:none; }
.play-shell .play-card-title { padding:0 12px; margin:0 0 12px; font:400 18px/1.25 "Easy Pixel",sans-serif; color:#07133f; }
.play-shell .play-card-details { max-height:none; overflow:visible; opacity:1; padding:0 12px 14px; margin-top:auto; }
.play-shell .play-card-requirements { justify-content:space-between; }
.play-shell .play-enroll { width:100%; border:1px solid #a96d8b; border-radius:0; background:#ffc9e2; color:#4b1644; box-shadow:2px 2px 0 #d8b7c7; font:400 14px/1.2 "Easy Pixel",sans-serif; padding:10px; transform:none; }
.play-shell .play-enroll:disabled { background:#f5f5f7; color:#626577; border-color:#b7bac6; box-shadow:none; }
.play-enroll-modal .play-enroll-dialog { background:#fff; border:1px solid #9399ad; border-radius:0; box-shadow:5px 5px 0 #07133f40; }
.play-enroll-modal :is(.shop-purchase-primary,.shop-purchase-secondary,.shop-purchase-close) { border-radius:0; box-shadow:2px 2px 0 #d9dce4; }
@media(max-width:850px) { .play-shell .play-stage { grid-template-columns:minmax(0,1fr); } .play-shell .play-rail { grid-row:1; } .play-shell .play-bulletin-board { display:none; } }
@media(max-width:520px) { .play-shell .play-active-table thead th:nth-child(3),.play-shell .play-active-table td:nth-child(3) { display:none; } .play-shell .play-active-table thead th:first-child { width:48%; } .play-shell .play-active-table thead th:nth-child(2) { width:23%; } .play-shell .play-active-table th,.play-shell .play-active-table td { padding:10px 6px; } .play-shell .play-active-game-art { display:none; } .play-shell .play-enroll-view .play-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } .play-shell .play-card-media { height:110px; } .play-shell .play-card-title { font-size:15px; } }

.play-shell .play-active-empty { border:0; border-radius:0; background:none; box-shadow:none; padding:12px 0; min-height:0; text-align:left; color:#626577; font-size:14px; }
.play-shell .play-active-game-lockup { grid-template-columns:40px minmax(0,1fr); min-height:40px; }
.play-shell .play-enroll-view { width:100%; }
@media(max-width:520px) { .play-shell .play-active-game-lockup { grid-template-columns:minmax(0,1fr); } }

/* Preserve each game's established palette within the flat table layout. */
.play-shell .play-active-table tbody .play-active-row:nth-child(n) {
  background:color-mix(in srgb,var(--play-accent,#f05c9d) 12%,#fff);
}
.play-shell .play-active-table tbody .play-active-row:nth-child(n):hover {
  background:color-mix(in srgb,var(--play-accent,#f05c9d) 20%,#fff);
}
.play-shell .play-active-table tbody .play-active-row > th {
  box-shadow:inset 4px 0 0 var(--play-accent,#f05c9d);
}
.play-shell .play-active-row .play-active-status::before {
  background:var(--play-accent,#f05c9d);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--play-accent,#f05c9d) 18%,transparent);
}
.play-shell .play-active-row .play-table-join,
.play-shell .play-card .play-enroll:not(:disabled) {
  background:color-mix(in srgb,var(--play-accent,#f05c9d) 30%,#fff);
  border-color:color-mix(in srgb,var(--play-accent,#f05c9d) 65%,#626577);
  color:#07133f;
  box-shadow:2px 2px 0 color-mix(in srgb,var(--play-accent,#f05c9d) 35%,#d9dce4);
}
.play-shell .play-card {
  border-top:3px solid var(--play-accent,#f05c9d);
  background:color-mix(in srgb,var(--play-accent,#f05c9d) 6%,#fff);
}

/* Compact sidebar with readable button states and restrained bulletin type. */
.play-shell .play-rail { gap:12px; }
.play-shell .play-rail-enroll { min-height:38px; padding:9px 12px; }
.play-shell .play-rail-enroll .play-rail-enroll-label,
.play-shell .play-rail-enroll:hover .play-rail-enroll-label,
.play-shell .play-rail-enroll:focus-visible .play-rail-enroll-label {
  color:#4b1644; -webkit-text-stroke:0; text-shadow:none; transform:none; font-size:14px;
}
.play-shell .play-rail-card { gap:10px; padding:12px; box-shadow:2px 2px 0 #d9dce4; }
.play-shell .play-rail-card-head { align-items:center; padding-bottom:10px; }
.play-shell .play-rail-card-head h2 { font-size:15px; text-shadow:none; }
.play-shell .play-rail-card-head > span { display:none; }
.play-shell .play-bulletin-tag { font-size:10px; letter-spacing:.05em; }
.play-shell .play-bulletin-item h3 { font-size:15px; font-weight:700; line-height:1.3; }
.play-shell .play-bulletin-item p { font-size:13px; font-weight:500; line-height:1.45; }
.play-shell .play-bulletin-item:last-child { border-bottom:0; }
.play-shell .play-stage-subheading { text-shadow:none; text-align:left; }

/* Compact enrollment cards with uncropped square artwork at every width. */
.play-shell .play-enroll-view .play-card-grid {
  grid-template-columns:repeat(auto-fill,min(100%,180px));
  justify-content:start;
  gap:14px;
}
.play-shell .play-card .play-card-media {
  position:relative;
  display:block;
  height:auto;
  width:calc(100% - 16px);
  aspect-ratio:1 / 1;
  margin:8px;
}
.play-shell .play-card .play-card-media img,
.play-shell .play-card:hover .play-card-media img,
.play-shell .play-card:focus-within .play-card-media img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  transform:none;
}

/* Tooltip content is rendered above all card and category containers. */
.play-shell [data-play-tooltip]::before,
.play-shell [data-play-tooltip]::after { display:none; }
.play-floating-tooltip {
  position:fixed; inset:auto; margin:0; box-sizing:border-box;
  max-width:min(240px,calc(100vw - 16px)); padding:7px 10px;
  border:1px solid #07133f; border-radius:2px; background:#202338;
  color:#fff; font:700 13px/1.35 Arial,sans-serif; text-align:center;
  white-space:normal; overflow-wrap:anywhere; z-index:2147483647;
  box-shadow:2px 2px 0 #07133f30;
}
.play-floating-tooltip[hidden] { display:none; }

/* Edge-to-edge row artwork and game-colored interactive Join controls. */
.play-shell .play-active-game-art {
  border:0; padding:0; background:transparent;
}
.play-shell .play-active-game-art .play-active-game-logo {
  width:100%; height:100%; margin:0; object-fit:cover; object-position:center;
}
.play-shell .play-active-row .play-table-join {
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  box-sizing:border-box; min-width:76px; min-height:34px; padding:8px 23px 8px 12px;
  border:1px solid color-mix(in srgb,var(--play-accent,#f05c9d) 65%,#07133f);
  background:color-mix(in srgb,var(--play-accent,#f05c9d) 22%,#fff);
  color:#07133f; text-shadow:none; text-decoration:none;
  box-shadow:2px 2px 0 color-mix(in srgb,var(--play-accent,#f05c9d) 55%,#626577);
  transition:background-color 120ms ease,transform 120ms ease,box-shadow 120ms ease;
}
.play-shell .play-active-row .play-table-join::after {
  content:"›"; position:absolute; right:9px; top:50%;
  font:400 19px/1 "Easy Pixel",monospace;
  transform:translate(-3px,-50%); opacity:.45;
  transition:transform 120ms ease,opacity 120ms ease;
}
.play-shell .play-active-row .play-table-join:hover,
.play-shell .play-active-row .play-table-join:focus-visible {
  background:color-mix(in srgb,var(--play-accent,#f05c9d) 42%,#fff);
  color:#07133f; text-decoration:none; transform:translate(-1px,-1px);
  box-shadow:3px 3px 0 color-mix(in srgb,var(--play-accent,#f05c9d) 60%,#07133f);
}
.play-shell .play-active-row .play-table-join:hover::after,
.play-shell .play-active-row .play-table-join:focus-visible::after {
  opacity:1; transform:translate(1px,-50%);
}
.play-shell .play-active-row .play-table-join:active {
  transform:translate(2px,2px); box-shadow:none;
}
@media(prefers-reduced-motion:reduce) {
  .play-shell .play-active-row .play-table-join,
  .play-shell .play-active-row .play-table-join::after { transition:none; }
}

/* One readable typeface throughout game rows, including their actions. */
.play-shell .play-active-table tbody .play-active-row,
.play-shell .play-active-table tbody .play-active-row :is(a,span,strong,small,time,button) {
  font-family:"Barlow Semi Condensed",Arial,sans-serif;
  letter-spacing:0;
  text-shadow:none;
}
.play-shell .play-active-row .play-active-game-name { font-size:16px; font-weight:700; }
.play-shell .play-active-row :is(.play-active-game-meta,.play-active-game-id,.play-active-game-day) { font-size:12px; font-weight:500; }
.play-shell .play-active-row :is(.play-active-seat-count,.play-active-time,.play-active-status) { font-size:13px; font-weight:600; }
.play-shell .play-active-row :is(.play-table-join,.play-active-admin-close) { font-size:14px; font-weight:700; line-height:1.2; }
.play-shell .play-active-row .play-table-join::after { font-family:"Barlow Semi Condensed",Arial,sans-serif; }

/* Center Reality Games in two rows of four on desktop. */
.play-shell .play-enroll-view .play-enroll-group.is-reality .play-card-grid {
  grid-template-columns:repeat(4,minmax(0,180px));
  justify-content:center;
  max-width:762px;
  margin-inline:auto;
}
@media(max-width:700px) {
  .play-shell .play-enroll-view .play-enroll-group.is-reality .play-card-grid {
    grid-template-columns:repeat(2,minmax(0,180px));
  }
}
@media(max-width:360px) {
  .play-shell .play-enroll-view .play-enroll-group.is-reality .play-card-grid {
    grid-template-columns:minmax(0,180px);
  }
}

/* A compact game-colored roster anchored to the seats control. */
.play-shell .play-active-roster {
  position:fixed; inset:auto; margin:0; box-sizing:border-box;
  width:260px; max-width:calc(100vw - 16px); padding:0; gap:0;
  border:1px solid color-mix(in srgb,var(--play-accent,#f05c9d) 60%,#626577);
  border-top:3px solid var(--play-accent,#f05c9d); border-radius:0;
  background:#fff; box-shadow:3px 3px 0 #07133f30;
  transform:none; transition:none; text-align:left;
}
.play-shell .play-active-roster::before { display:none; }
.play-shell .play-active-seats.is-roster-open .play-active-roster { transform:none; }
.play-shell .play-active-roster-title {
  display:grid; gap:4px; padding:11px 12px;
  background:color-mix(in srgb,var(--play-accent,#f05c9d) 16%,#fff);
  border-bottom:1px solid #e0e1e7; line-height:1.3;
}
.play-shell .play-active-roster-title strong { font-size:15px; font-weight:700; }
.play-shell .play-active-roster-title span { font-size:12px; font-weight:500; color:#626577; }
.play-shell .play-active-roster-list {
  grid-template-columns:minmax(0,1fr); gap:0; padding:4px 10px;
  max-height:min(240px,calc(100vh - 110px)); overflow-y:auto;
}
.play-shell .play-active-roster-player {
  grid-template-columns:32px minmax(0,1fr); gap:9px;
  padding:7px 0; border-bottom:1px solid #ececf0; font-size:14px; font-weight:600; line-height:1.25;
}
.play-shell .play-active-roster-player:last-child { border-bottom:0; }
.play-shell .play-active-roster-player img { width:32px; height:32px; border-radius:0; border:1px solid #c8cad3; }
.play-shell .play-active-seats:hover .play-active-seat-count,
.play-shell .play-active-seats:focus-visible .play-active-seat-count { text-decoration:underline; text-underline-offset:3px; }

/* Enrollment lives alongside the lobby table. */
.play-shell .play-stage { grid-template-columns:minmax(0,1fr) 280px; }
.play-shell .play-rail .play-enroll-view { width:100%; }
.play-shell .play-rail .play-stage-subheading { display:block; margin:0 0 12px; font-size:20px; }
.play-shell .play-rail .play-enroll-groups { gap:16px; }
.play-shell .play-rail .play-enroll-group-heading { padding:10px; }
.play-shell .play-rail .play-enroll-group-title { font-size:16px; gap:7px; }
.play-shell .play-rail .play-enroll-group-title img { width:24px; height:24px; }
.play-shell .play-rail .play-enroll-group-count { display:none; }
.play-shell .play-rail .play-enroll-group-body { padding:10px; }
.play-shell .play-rail .play-enroll-view .play-enroll-group .play-card-grid {
  grid-template-columns:minmax(0,1fr); gap:10px; margin:0; max-width:none;
}
.play-shell .play-rail .play-card-cover { display:grid; grid-template-columns:64px minmax(0,1fr); align-items:center; gap:10px; padding:10px; }
.play-shell .play-rail .play-card .play-card-media { width:64px; height:64px; margin:0; }
.play-shell .play-rail .play-card-title { margin:0; padding:0; font:700 16px/1.2 "Barlow Semi Condensed",Arial,sans-serif; }
.play-shell .play-rail .play-card-details { padding:0 10px 10px; }
.play-shell .play-rail .play-card-requirements { margin-bottom:8px; }
.play-shell .play-rail .play-enroll-form { display:block; }
.play-shell .play-rail .play-enroll { font:700 13px/1.2 "Barlow Semi Condensed",Arial,sans-serif; min-height:32px; padding:8px; }
.play-shell .play-rail .play-card-media > .play-card-status { display:none; }
@media(max-width:850px) {
  .play-shell .play-stage { grid-template-columns:minmax(0,1fr); }
  .play-shell .play-rail { grid-row:auto; }
}

/* Compact avatar tiles instead of a tall player list. */
.play-shell .play-active-roster { width:300px; }
.play-shell .play-active-roster-list {
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px 6px; padding:12px 8px;
  max-height:min(190px,calc(100vh - 110px));
  align-items:start;
}
.play-shell .play-active-roster-player {
  display:flex; flex-direction:column; align-items:center;
  gap:5px; padding:0; border:0; min-width:0;
  text-align:center; font-size:11px; line-height:1.2;
}
.play-shell .play-active-roster-player img {
  width:38px; height:38px; flex:0 0 38px;
}
.play-shell .play-active-roster-player span {
  width:100%; font-size:11px; font-weight:600; overflow-wrap:anywhere;
}
.play-shell .play-active-roster:has(.play-active-roster-player:only-child) { width:200px; }
.play-shell .play-active-roster-list:has(.play-active-roster-player:only-child) { grid-template-columns:minmax(0,1fr); }

/* Show the entire roster without an internal scrollbar. */
.play-shell .play-active-roster-list {
  max-height:none;
  overflow:visible;
}
.play-shell .play-active-roster:has(.play-active-roster-player:nth-child(13)) {
  width:340px;
}
.play-shell .play-active-roster-list:has(.play-active-roster-player:nth-child(13)) {
  grid-template-columns:repeat(5,minmax(0,1fr));
}

/* Small, readable roster: avatars beside names, no oversized game heading. */
.play-shell .play-active-roster,
.play-shell .play-active-roster:has(.play-active-roster-player:nth-child(13)) { width:360px; }
.play-shell .play-active-roster:has(.play-active-roster-player:only-child) { width:210px; }
.play-shell .play-active-roster-title { display:block; padding:7px 10px; }
.play-shell .play-active-roster-title strong { display:none; }
.play-shell .play-active-roster-title span { font-size:11px; font-weight:600; line-height:1.3; }
.play-shell .play-active-roster-list,
.play-shell .play-active-roster-list:has(.play-active-roster-player:nth-child(13)) {
  grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px 12px; padding:8px 10px;
}
.play-shell .play-active-roster-list:has(.play-active-roster-player:only-child) { grid-template-columns:minmax(0,1fr); }
.play-shell .play-active-roster-player {
  display:grid; grid-template-columns:26px minmax(0,1fr); gap:7px;
  align-items:center; text-align:left; padding:3px 0;
}
.play-shell .play-active-roster-player img { width:26px; height:26px; }
.play-shell .play-active-roster-player span {
  font-size:12px; font-weight:600; line-height:1.3;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; overflow-wrap:normal;
}

/* Logo-first enrollment tiles: two across, with no empty horizontal card area. */
.play-shell .play-stage { grid-template-columns:minmax(0,1fr) 340px; }
.play-shell .play-rail .play-enroll-group-heading { min-height:0; padding:10px; }
.play-shell .play-rail .play-enroll-group-body { padding:10px; }
.play-shell .play-rail .play-enroll-view .play-enroll-group .play-card-grid {
  grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; align-items:stretch;
}
.play-shell .play-rail .play-card { min-width:0; }
.play-shell .play-rail .play-card-cover { display:block; padding:6px; }
.play-shell .play-rail .play-card .play-card-media {
  display:block; width:100%; height:auto; aspect-ratio:1 / 1; margin:0;
}
.play-shell .play-rail .play-card .play-card-media img {
  width:100%; height:100%; object-fit:contain; opacity:1; filter:none; transform:none;
}
.play-shell .play-rail .play-card.is-coming-soon .play-card-media::after { display:none; }
.play-shell .play-rail .play-card-title {
  margin:7px 0 2px; padding:0; font-size:14px; line-height:1.2; text-align:center;
}
.play-shell .play-rail .play-card-details { padding:0 7px 8px; }
.play-shell .play-rail .play-card-requirements { gap:4px; margin-bottom:6px; }
.play-shell .play-rail .play-level-badge { width:23px; height:23px; }
.play-shell .play-rail .play-level-badge .shop-color-swatch { width:20px; min-height:20px; }
.play-shell .play-rail .play-card-cost { min-height:23px; padding:3px 4px; font-size:12px; border:0; border-radius:0; background:none; box-shadow:none; gap:3px; }
.play-shell .play-rail .play-card-cost img { width:12px; height:12px; }
.play-shell .play-rail .play-enroll { min-width:0; min-height:30px; padding:7px 4px; font-size:12px; }
@media(max-width:950px) {
  .play-shell .play-stage { grid-template-columns:minmax(0,1fr); }
  .play-shell .play-rail { grid-row:auto; }
  .play-shell .play-rail .play-enroll-view .play-enroll-group .play-card-grid {
    grid-template-columns:repeat(auto-fill,minmax(135px,160px)); justify-content:center;
  }
}
@media(max-width:380px) {
  .play-shell .play-rail .play-enroll-view .play-enroll-group .play-card-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

/* Let the game table fill its grid column instead of stopping at 620px. */
.play-shell .play-active-games > .play-stage-subheading,
.play-shell .play-active-tabs,
.play-shell .play-active-table-wrap,
.play-shell .play-active-empty {
  width:100%; max-width:none; align-self:stretch; box-sizing:border-box;
}
.play-shell .play-rail { width:100%; min-width:0; justify-self:stretch; }
/* Preserve the original concealed artwork for unavailable games. */
.play-shell .play-rail .play-card.is-coming-soon .play-card-media img {
  opacity:.52;
  filter:blur(3.5px) grayscale(42%) saturate(.56) contrast(.72) brightness(1.04);
}
.play-shell .play-rail .play-card.is-coming-soon .play-card-media::after {
  display:block;
}

.play-shell .play-active-roster-player[href]:hover { color:#a03266; text-decoration:none; }
.play-shell .play-active-roster-player[href]:hover span { text-decoration:underline; text-underline-offset:2px; }
.play-shell .play-active-roster-player[href]:focus-visible { outline:2px solid var(--play-accent,#07133f); outline-offset:2px; }

/* Give the remaining desktop space to enrollment, not the game table. */
.play-shell .play-stage {
  grid-template-columns:minmax(0,620px) minmax(0,1fr);
}
@media(max-width:950px) {
  .play-shell .play-stage { grid-template-columns:minmax(0,1fr); }
}

/* Keep the lobby action directly below its status. */
.play-shell .play-active-row.is-filling .play-active-status-cell {
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
}

/* One consistent left edge for the status column and its actions. */
.play-shell .play-active-table thead th:nth-child(4),
.play-shell .play-active-table tbody .play-active-row > td:nth-child(4) {
  text-align:left;
}
.play-shell .play-active-row .play-active-status-cell {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:8px;
  width:100%;
}
.play-shell .play-active-row.is-filling .play-active-status-cell { align-items:flex-start; }

/* Three enrollment cards across; keep narrow phones readable. */
.play-shell .play-rail .play-enroll-view .play-enroll-group .play-card-grid {
  grid-template-columns:repeat(3,minmax(0,1fr));
}
@media(max-width:480px) {
  .play-shell .play-rail .play-enroll-view .play-enroll-group .play-card-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

/* Staff-only lobby control, aligned with the Join action. */
.play-shell .play-active-row .play-active-admin-close {
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  box-sizing:border-box; width:76px; min-height:32px; padding:7px 9px 7px 22px;
  border:1px solid #bc7888; border-radius:0;
  background:#fff1f3; color:#942c46;
  box-shadow:2px 2px 0 #d9b6bf;
  font:700 13px/1.2 "Barlow Semi Condensed",Arial,sans-serif;
  cursor:pointer; transition:background-color 120ms ease,color 120ms ease,box-shadow 120ms ease,transform 120ms ease;
}
.play-shell .play-active-row .play-active-admin-close::before {
  content:"×"; position:absolute; left:9px; font-size:17px; line-height:1;
}
.play-shell .play-active-row .play-active-admin-close:hover:not(:disabled),
.play-shell .play-active-row .play-active-admin-close:focus-visible {
  background:#a52f4e; border-color:#81223d; color:#fff;
  box-shadow:3px 3px 0 #d9b6bf; transform:translate(-1px,-1px);
}
.play-shell .play-active-row .play-active-admin-close:focus-visible { outline:2px solid #81223d; outline-offset:3px; }
.play-shell .play-active-row .play-active-admin-close:active:not(:disabled) { transform:translate(2px,2px); box-shadow:none; }
.play-shell .play-active-row .play-active-admin-close:disabled { opacity:.55; cursor:wait; transform:none; box-shadow:none; }
@media(prefers-reduced-motion:reduce) {
  .play-shell .play-active-row .play-active-admin-close { transition:none; }
}

/* Smaller logo-led enrollment cards, four across on desktop. */
.play-shell .play-rail .play-enroll-view .play-enroll-group .play-card-grid {
  grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px;
}
/* Retain game names for assistive technology without a visible title row. */
.play-shell .play-rail .play-card-title {
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0;
}
.play-shell .play-rail .play-card-cover { padding:5px; }
.play-shell .play-rail .play-card-details { padding:3px 5px 7px; }
.play-shell .play-rail .play-card-cost { font-size:11px; padding:2px 0; }
.play-shell .play-rail .play-enroll { font-size:11px; padding:6px 3px; white-space:normal; overflow-wrap:normal; }
@media(max-width:480px) {
  .play-shell .play-rail .play-enroll-view .play-enroll-group .play-card-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

/* A tactile, game-colored hover for available enrollment actions. */
.play-shell .play-rail .play-card .play-enroll:not(:disabled) {
  position:relative; overflow:hidden; padding-inline:15px;
  transition:background-color 140ms ease,box-shadow 140ms ease,transform 140ms ease;
}
.play-shell .play-rail .play-card .play-enroll:not(:disabled)::after {
  content:"›"; position:absolute; right:7px; top:50%;
  font:700 17px/1 "Barlow Semi Condensed",Arial,sans-serif;
  opacity:0; transform:translate(-5px,-50%);
  transition:opacity 140ms ease,transform 140ms ease;
}
.play-shell .play-rail .play-card .play-enroll:not(:disabled):hover,
.play-shell .play-rail .play-card .play-enroll:not(:disabled):focus-visible {
  background:color-mix(in srgb,var(--play-accent,#f05c9d) 50%,#fff);
  color:#07133f; border-color:color-mix(in srgb,var(--play-accent,#f05c9d) 65%,#07133f);
  transform:translate(-1px,-2px);
  box-shadow:3px 4px 0 color-mix(in srgb,var(--play-accent,#f05c9d) 65%,#07133f);
  text-shadow:none;
}
.play-shell .play-rail .play-card .play-enroll:not(:disabled):hover::after,
.play-shell .play-rail .play-card .play-enroll:not(:disabled):focus-visible::after {
  opacity:1; transform:translate(0,-50%);
}
.play-shell .play-rail .play-card .play-enroll:not(:disabled):focus-visible {
  outline:2px solid #07133f; outline-offset:3px;
}
.play-shell .play-rail .play-card .play-enroll:not(:disabled):active {
  transform:translate(2px,2px); box-shadow:none;
}
@media(prefers-reduced-motion:reduce) {
  .play-shell .play-rail .play-card .play-enroll:not(:disabled),
  .play-shell .play-rail .play-card .play-enroll:not(:disabled)::after { transition:none; }
}

/* Keep the required level and entry price together below the artwork. */
.play-shell .play-rail .play-card-requirements {
  justify-content:center;
  gap:9px;
  margin:2px 0 8px;
}
.play-shell .play-rail .play-level-badge {
  width:24px; height:24px;
  box-sizing:border-box;
  padding:3px;
  border:1px solid #a4a8b6;
  border-radius:2px;
  background:#fff;
  box-shadow:2px 2px 0 #d9dce4;
}
.play-shell .play-rail .play-level-badge .shop-color-swatch {
  width:16px; height:16px; min-height:16px;
  box-sizing:border-box;
  border:1px solid #07133f26;
  border-radius:0;
  background:var(--level-color);
  box-shadow:none;
}
.play-shell .play-rail .play-level-badge:hover,
.play-shell .play-rail .play-level-badge:focus-visible {
  border-color:#07133f;
  outline:2px solid color-mix(in srgb,var(--level-color) 25%,#d9dce4);
  outline-offset:2px;
}
.play-shell .play-rail .play-card-cost { gap:4px; }

/* Match the standard page banner width and align the content beneath it. */
/* Restore the pre-banner-change content width independently of the hero. */
.play-shell .play-stage { width:100%; max-width:1184px; margin-inline:auto; column-gap:32px; }

/* Profile links must not inherit the game-row link minimum height. */
.play-shell .play-active-table a.play-active-roster-player {
  min-height:0; height:auto; padding:3px 0;
  align-self:start;
}

/* Keep Dead by Dawn's red identity without the neon enrollment hover. */
.play-shell .play-rail .play-card.play-game-dead .play-enroll:not(:disabled) {
  --play-accent:#bd526b;
  filter:none;
  text-shadow:none;
}

/* SH's coral accent applies in both the directory and compact enrollment rail. */
.play-shell .play-game-secret-hitler { --play-accent:#f16246; }
.play-shell .play-card.play-game-secret-hitler .play-enroll:not(:disabled),
.play-shell .play-rail .play-card.play-game-secret-hitler .play-enroll:not(:disabled) {
  background:#f16246;
  border-color:#a43a2b;
  color:#f3e7cc;
  box-shadow:2px 2px 0 #a43a2b;
  filter:none;
  text-shadow:none;
}