.play-completed-pagination { display:flex; justify-content:center; align-items:center; align-self:center; width:max-content; gap:2px; margin:10px auto; padding:3px; border:1px solid #e2d4df; border-radius:999px; background:#fffbfe; box-shadow:0 1px 2px #49223e0a; color:#786478; font:600 12px/1.2 "Barlow Semi Condensed",sans-serif; }
.play-completed-pagination[hidden] { display:none; }
.play-completed-pagination button { display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; padding:0; border:0; border-radius:50%; background:transparent; color:inherit; box-shadow:none; font:400 20px/1 sans-serif; cursor:pointer; }
.play-completed-pagination button:hover:not(:disabled) { color:#4b1644; background:#f7eaf2; }
.play-completed-pagination button:disabled { opacity:.3; cursor:default; }
.play-history-page { display:inline-flex; align-items:center; justify-content:center; min-width:24px; height:24px; padding:0 4px; box-sizing:border-box; border-radius:999px; background:#f8e8f1; color:#744363; text-align:center; font-variant-numeric:tabular-nums; }
.play-completed-pagination button:focus-visible,.play-history-page:focus-visible,.play-table-join:focus-visible { outline:2px solid #07133f; outline-offset:2px; }
.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-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;
}

/* A profile-style color strip spans the pace image and price beside it. */
.play-shell .play-rail .play-card .play-card-requirements {
  display:flex; align-items:center; justify-content:center;
  gap:8px; min-height:38px; margin:3px 0 7px;
}
.play-shell .play-card .play-card-entry-meta {
  flex:0 0 auto; display:grid; justify-items:center; align-content:center;
  gap:3px; min-width:0; height:38px;
}
.play-shell .play-card .has-speed-sticker .play-card-entry-meta {
  grid-template-rows:18px auto; align-content:space-between;
}
.play-shell .play-card .play-speed-sticker {
  align-self:center; display:block; width:38px; max-width:100%; height:auto;
  padding:0; border:0; border-radius:0;
  background:none; box-shadow:none; pointer-events:none;
}
.play-shell .play-card .play-speed-sticker img {
  display:block; width:100%; height:auto; aspect-ratio:auto;
  object-fit:contain; opacity:1; filter:none; transform:none;
}
.play-shell .play-rail .play-card .play-level-badge {
  width:24px; height:38px; padding:0; border:0; border-radius:4px;
  background:transparent; box-shadow:none;
}
.play-shell .play-rail .play-card .play-level-badge .shop-color-swatch {
  box-sizing:border-box; width:24px; height:38px; min-height:38px;
  border:1.5px solid #ffffffe0; border-radius:4px;
  background:
    linear-gradient(145deg,#ffffff57,#ffffff00 34%),
    linear-gradient(315deg,#07133f29,#07133f00 54%),
    var(--level-color);
  box-shadow:inset 0 0 0 1px #07133f1f,0 2px 3px #07133f1f;
}
.play-shell .play-rail .play-card .play-card-entry-meta .play-card-cost {
  min-height:0; padding:0; gap:3px; font-size:13px; line-height:1.1; white-space:nowrap;
}

/* Game-colored enrollment, with a first message sent into the new player's chat. */
.play-enroll-modal .play-enroll-dialog {
  --enroll-ink: #101943;
  width: min(100%, 470px); max-height: calc(100dvh - 32px); padding: 25px;
  gap: 16px; border: 2px solid color-mix(in srgb, var(--play-accent) 72%, #101943);
  border-top: 8px solid var(--play-accent); border-radius: 14px;
  background: color-mix(in srgb, var(--play-accent) 16%, #fff);
  box-shadow: 7px 8px 0 color-mix(in srgb, var(--play-accent) 40%, #10194340);
  color: var(--enroll-ink);
}
.play-enroll-modal .play-enroll-close {
  position: absolute; top: 12px; right: 12px; width: 34px; height: 34px; padding: 0;
  display: grid; place-items: center; border: 1px solid #10194333; border-radius: 50%;
  background: #ffffffad; color: var(--enroll-ink); box-shadow: none; font: 25px/1 sans-serif;
}
.play-enroll-modal .play-enroll-confirm-head { padding-right: 30px; gap: 5px; }
.play-enroll-modal .play-enroll-confirm-head > span { color: color-mix(in srgb, var(--play-accent) 45%, #101943); font-size: 11px; letter-spacing: .16em; }
.play-enroll-modal .play-enroll-confirm-head h2 { color: var(--enroll-ink); font-size: clamp(25px, 5vw, 33px); line-height: 1.12; }
.play-enroll-modal .play-enroll-member-panel { gap: 14px; }
.play-enroll-modal .play-enroll-confirm-copy { margin: 0; color: var(--enroll-ink); font-size: 16px; }
.play-enroll-modal .play-enroll-player-chip {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: 7px; padding: 0; border: 0;
  border-radius: 0; box-shadow: none; background: none;
}
.play-enroll-modal .play-enroll-player-chip span { font-size: 10px; color: #101943a6; }
.play-enroll-modal .play-enroll-player-chip strong { font-size: 15px; color: var(--enroll-ink); overflow-wrap: anywhere; }
.play-enroll-modal .play-enroll-summary {
  display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 14px 18px;
  border: 1px solid color-mix(in srgb, var(--play-accent) 45%, #10194320);
  border-radius: 9px; background: #ffffffa8; box-shadow: none;
}
.play-enroll-level-detail { display: flex; align-items: center; gap: 9px; min-width: 0; }
.play-enroll-level-detail > div { display: grid; gap: 5px; }
.play-enroll-modal .play-enroll-summary small { font-size: 11px; color: #101943a6; }
.play-enroll-modal .play-enroll-summary strong { font-size: 14px; color: var(--enroll-ink); }
.play-enroll-color-strip {
  display: block; flex: 0 0 24px; width: 24px; height: 41px; border: 1.5px solid #ffffffe0; border-radius: 4px;
  background: linear-gradient(145deg,#ffffff57,#ffffff00 34%),linear-gradient(315deg,#07133f29,#07133f00 54%),var(--level-color);
  box-shadow: inset 0 0 0 1px #07133f1f,0 2px 3px #07133f1f;
}
.play-enroll-pace-price { display: grid; justify-items: center; gap: 4px; flex: 0 0 auto; }
.play-enroll-pace-price > img { display: block; width: 62px; height: auto; max-height: 28px; object-fit: contain; }
.play-enroll-modal .play-enroll-price { display: flex; align-items: center; gap: 5px; white-space: nowrap; }
.play-enroll-price img { width: 12px; height: 19px; object-fit: contain; }
.play-enroll-price b { font-size: 16px; }
.play-enroll-message { display: grid; gap: 8px; min-width: 0; }
.play-enroll-message > strong { font-size: 14px; }
.play-enroll-message textarea {
  display: block; box-sizing: border-box; width: 100%; min-width: 0; height: 92px; min-height: 92px; max-height: 92px; resize: none;
  border: 1px solid color-mix(in srgb, var(--play-accent) 60%, #10194340); border-radius: 8px;
  padding: 11px 12px; background: #fffffff0; color: #101943; font-family: inherit; font-size: 14px; line-height: 1.5;
}
.play-enroll-message textarea:focus { outline: 2px solid color-mix(in srgb, var(--play-accent) 70%, #101943); outline-offset: 2px; }
.play-enroll-message textarea::placeholder { color: #10194380; }
.play-enroll-message-caption { display: flex; justify-content: space-between; gap: 10px; color: #101943a6; }
.play-enroll-message-caption small { font-size: 10px; line-height: 1.4; }
.play-enroll-message-caption small:last-child { flex-shrink: 0; font-variant-numeric: tabular-nums; }
.play-enroll-modal .play-enroll-confirm-status { margin: 0; font-size: 12px; }
.play-enroll-modal .play-enroll-confirm-status:empty { display: none; }
.play-enroll-modal .play-enroll-confirm-actions { display: flex; justify-content: center; margin: 0; }
.play-enroll-modal .play-enroll-confirm-actions .play-enroll-primary {
  display: flex; align-items: center; justify-content: center; flex: 0 0 100px;
  box-sizing: border-box; width: 100px; height: 100px; min-height: 100px; padding: 12px;
  border: 2px solid color-mix(in srgb, var(--play-accent) 65%, #101943); border-radius: 50%;
  background: var(--play-accent); color: var(--enroll-button-ink, #101943); box-shadow: 0 4px 0 color-mix(in srgb, var(--play-accent) 65%, #101943);
  font-family: "TAY Dumpling", "Barlow Semi Condensed", sans-serif; font-size: 24px; line-height: 1.1; font-weight: 400; letter-spacing: .01em; text-align: center; white-space: normal; text-shadow: none;
}
.play-enroll-modal .play-enroll-confirm-actions .play-enroll-primary:disabled {
  background: #d4d6db; border-color: #b6b9c2; box-shadow: 0 4px 0 #b6b9c2; color: #747987;
  opacity: 1; filter: none; cursor: not-allowed; text-shadow: none;
}
.play-enroll-modal .play-enroll-primary .play-enroll-progress-label {
  font-size: 15px; line-height: 1.1; letter-spacing: 0; white-space: nowrap;
}
.play-enroll-modal .play-enroll-confirm-actions .play-enroll-primary:not(:disabled):hover { filter: brightness(1.06); }
.play-enroll-modal .play-enroll-confirm-actions .play-enroll-primary:focus-visible,
.play-enroll-modal .play-enroll-close:focus-visible { outline: 3px solid #101943; outline-offset: 4px; }
.play-enroll-modal .play-sh-player-count { margin-top: 0; }
.play-enroll-modal [hidden] { display: none !important; }
@media (max-width: 420px) {
  .play-enroll-modal { padding: 12px; }
  .play-enroll-modal .play-enroll-dialog { padding: 20px 16px; max-height: calc(100dvh - 24px); }
  .play-enroll-modal .play-enroll-summary { padding: 12px; gap: 10px; }
  .play-enroll-modal .play-enroll-summary strong { font-size: 12px; }
}

.play-enroll-modal .play-enroll-price b,
.play-enroll-modal .play-enroll-message > strong { color: var(--enroll-ink); }
.play-enroll-modal .play-guess-who-mode { display: grid; gap: 9px; margin: 0; padding: 12px; border: 1px solid #10194326; border-radius: 8px; }
.play-enroll-modal .play-guess-who-mode legend { padding: 0 4px; font-size: 14px; font-weight: 700; }
.play-enroll-modal .play-guess-who-mode label { display: flex; align-items: flex-start; gap: 9px; padding: 8px; border-radius: 5px; background: #ffffff70; }
.play-enroll-modal .play-guess-who-mode input { flex: 0 0 14px; width: 14px; margin: 3px 0 0; accent-color: var(--play-accent); }
.play-enroll-modal .play-guess-who-mode label span { display: grid; gap: 4px; }
.play-enroll-modal .play-guess-who-mode strong { color: var(--enroll-ink); font-size: 13px; }
.play-enroll-modal .play-guess-who-mode small { color: #101943b3; font-size: 11px; line-height: 1.4; }
.play-enroll-modal .play-sh-lobby-copy { margin: 0; color: #101943b3; font-size: 12px; line-height: 1.5; }

/* Magnate opening: live requirements take the place of the first-message field. */
.play-enroll-modal.is-magnate-enrollment .play-enroll-confirm-copy,
.play-enroll-modal.is-magnate-enrollment .play-enroll-player-chip { display: none; }
.play-enroll-modal.is-magnate-enrollment .play-enroll-summary { padding: 19px 18px; }
.play-enroll-modal.is-magnate-enrollment .play-enroll-price b { font-size: 24px; font-variant-numeric: tabular-nums; }
.play-magnate-opening { display: grid; gap: 14px; }
.play-magnate-live { display: flex; align-items: center; gap: 7px; }
.play-magnate-live i { width: 7px; height: 7px; border-radius: 50%; background: #47704b; box-shadow: 0 0 0 3px #47704b18; }
.play-magnate-live strong { font-size: 13px; color: #334c34; }
.play-magnate-live small { margin-left: auto; font-size: 12px; color: #715348; }

.play-magnate-player-details { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.play-magnate-player-details > div { display: grid; align-content: start; gap: 10px; padding: 13px 15px; border: 1px solid #b8896b32; border-radius: 9px; background: #ffffff80; }
.play-magnate-player-details > div > small { font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #85634e; }
.play-magnate-player-balance > strong { display: flex; align-items: center; gap: 7px; min-height: 30px; }
.play-magnate-player-balance img { width: 14px; height: 23px; object-fit: contain; }
.play-magnate-player-balance b { color: #101943; font-size: 22px; line-height: 1; font-variant-numeric: tabular-nums; }
.play-magnate-player-level > div { display: flex; align-items: center; gap: 8px; }
.play-magnate-player-level i { flex: 0 0 18px; width: 18px; height: 30px; border: 1px solid #ffffffde; border-radius: 3px; background: linear-gradient(145deg,#ffffff57,#ffffff00 34%),linear-gradient(315deg,#07133f29,#07133f00 54%),var(--level-color); box-shadow: inset 0 0 0 1px #07133f1f,0 2px 3px #07133f1f; }
.play-magnate-player-level span { display: grid; gap: 2px; min-width: 0; }
.play-magnate-player-level span strong { color: #101943; font-size: 14px; line-height: 1.2; }
.play-magnate-player-level span small { color: #85634e; font-size: 11px; }
@media (max-width: 380px) {
 .play-magnate-player-details { gap: 8px; }
 .play-magnate-player-details > div { padding: 11px 10px; }
 .play-magnate-player-balance b { font-size: 19px; }
 .play-magnate-player-level span strong { font-size: 12px; }
}

/* Magnate's glass bubble gently pulses when enrollment is available. */
.play-enroll-modal.is-magnate-enrollment .play-enroll-confirm-actions { padding: 10px 0 12px; }
.play-enroll-modal.is-magnate-enrollment .play-enroll-confirm-actions .play-enroll-primary {
  position: relative;
  border: 1px solid #ffffffd9;
  background:
    radial-gradient(ellipse at 28% 20%, #ffffffad 0%, #ffffff00 48%),
    radial-gradient(ellipse at 75% 83%, #dda98163 0%, #dda98100 65%),
    linear-gradient(145deg, #fff9f066, #f2be9f73);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  box-shadow: inset 1px 2px 3px #fff, inset -5px -7px 13px #b97e5340, inset 3px 3px 12px #ffffff80, 0 8px 13px #73503d24;
  color: #714129; font-size: 18px; letter-spacing: .045em; text-shadow: 0 1px 0 #ffffffc7;
  transition: box-shadow .2s ease, color .2s ease;
}
.play-enroll-modal.is-magnate-enrollment .play-enroll-primary::before {
  content: ""; position: absolute; width: 51px; height: 22px; left: 13px; top: 11px;
  border-radius: 50%; transform: rotate(-27deg);
  background: linear-gradient(180deg, #fffffff2, #ffffff12);
  pointer-events: none;
}
.play-enroll-modal.is-magnate-enrollment .play-enroll-primary::after {
  content: ""; position: absolute; width: 21px; height: 7px; right: 15px; bottom: 14px;
  border-radius: 50%; transform: rotate(-28deg); background: #ffffff91;
  filter: blur(1px); pointer-events: none;
}
.play-enroll-modal.is-magnate-enrollment .play-enroll-confirm-actions .play-enroll-primary:not(:disabled) {
  animation: magnate-bubble-pulse 3.6s ease-in-out infinite;
}
.play-enroll-modal.is-magnate-enrollment .play-enroll-confirm-actions .play-enroll-primary:disabled {
  border-color: #ffffffb3;
  background: radial-gradient(ellipse at 28% 20%, #ffffffa6, #ffffff00 50%), linear-gradient(145deg, #e7e9ee80, #cbd0d980);
  color: #8a909c; text-shadow: 0 1px 0 #ffffffc7;
  box-shadow: inset 1px 2px 3px #ffffffd9, inset -5px -7px 13px #8a94a333, inset 3px 3px 12px #ffffff66, 0 6px 10px #50596914;
}
.play-enroll-modal.is-magnate-enrollment .play-enroll-confirm-actions .play-enroll-primary:not(:disabled):hover {
  animation-play-state: paused; filter: brightness(1.025);
}
.play-enroll-modal.is-magnate-enrollment .play-enroll-confirm-actions .play-enroll-primary:not(:disabled):active {
  animation: none; transform: translateY(1px) scale(.96);
  box-shadow: inset 1px 2px 3px #ffffffd9, inset -3px -4px 10px #b97e5340, 0 3px 6px #73503d24;
}
@keyframes magnate-bubble-pulse {
  0%, 100% { transform: scale(.97); }
  50% { transform: scale(1.03); }
}
@media (prefers-reduced-motion: reduce) {
  .play-enroll-modal.is-magnate-enrollment .play-enroll-confirm-actions .play-enroll-primary:not(:disabled) { animation: none; }
  .play-enroll-modal.is-magnate-enrollment .play-enroll-confirm-actions .play-enroll-primary { transition: none; }
}
.play-lobby-categories { display:flex; flex-wrap:wrap; gap:6px; width:100%; max-width:1184px; box-sizing:border-box; margin:0 auto 16px; padding:0 0 10px; border-bottom:2px solid #d8b7c7; }
.play-lobby-category { display:flex; align-items:center; justify-content:center; gap:8px; min-width:0; min-height:46px; padding:8px 15px; border:1px solid transparent; background:transparent; color:#4c5064; font:400 15px/1.3 "Easy Pixel",sans-serif; cursor:pointer; }
.play-lobby-category img { width:30px; height:30px; object-fit:contain; }
.play-lobby-category.is-active { background:#ffc9e2; border-color:#a96d8b; color:#4b1644; box-shadow:2px 2px 0 #d8b7c7; }
.play-lobby-count {
  display:inline-grid; place-items:center; flex:0 0 auto;
  min-width:22px; height:22px; padding:0 5px; box-sizing:border-box;
  border:1px solid #d7c9d5; border-radius:4px;
  background:#faf4f9; color:#70536b;
  box-shadow:inset 0 1px 0 #fff;
  font:400 12px/1 "Easy Pixel",sans-serif; font-variant-numeric:tabular-nums;
}
.play-lobby-category.is-active .play-lobby-count { border-color:#c493af; background:#fff3f9; color:#743559; }
.play-lobby-category:focus-visible,.play-browser-refresh:focus-visible { outline:2px solid #07133f; outline-offset:3px; }
.play-browser-heading { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:12px; width:100%; margin-bottom:4px; }
.play-browser-heading .play-stage-subheading { margin:0; }
.play-browser-heading .play-completed-pagination { grid-column:2; grid-row:1; margin:0; }
.play-browser-heading .play-browser-refresh { grid-column:3; grid-row:1; justify-self:end; }
.play-browser-refresh { border:1px solid #b7bac6; background:#fff; color:#4b1644; padding:8px 10px; font:400 12px/1.2 "Easy Pixel",sans-serif; cursor:pointer; }
.play-browser-status { color:#8a2446; font-size:15px; }
@media(max-width:540px) {
  .play-lobby-categories { gap:4px; }
  .play-lobby-category { padding:7px 9px; font-size:12px; gap:5px; }
  .play-lobby-category img { width:24px; height:24px; }
}
@media(max-width:600px) {
  .play-lobby-categories { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* Compact game strips with artwork flush to both edges. */
.play-shell .play-active-table-wrap { border:0; background:transparent; box-shadow:none; }
.play-shell .play-active-table { display:block; border-collapse:separate; border-spacing:0; }
.play-shell .play-active-table thead { display:none; }
.play-shell .play-active-table tbody { display:grid; gap:4px; }
.play-shell .play-active-table tbody .play-active-row {
  display:grid; --play-row-size:48px; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  grid-template-areas:"identity players status";
  grid-template-rows:auto; align-items:center; column-gap:10px; row-gap:0;
  min-height:var(--play-row-size); padding:0 4px 0 0; box-sizing:border-box;
  border:0; border-left:4px solid var(--play-accent,#f05c9d); border-radius:5px 0 0 5px;
  outline:1px solid color-mix(in srgb,var(--play-accent,#f05c9d) 28%,#e6e2e8);
  box-shadow:none; transform:none;
}
.play-shell .play-active-table tbody .play-active-row:is(:hover,:focus-within) {
  border-color:color-mix(in srgb,var(--play-accent,#f05c9d) 50%,#dfe0e7);
  border-left-color:var(--play-accent,#f05c9d); box-shadow:none; transform:none;
}
.play-shell .play-active-table tbody .play-active-row > :is(th,td) { display:block; padding:0; min-width:0; box-shadow:none; }
.play-shell .play-active-table tbody .play-active-row > th { grid-area:identity; }
.play-shell .play-active-table tbody .play-active-row > td:nth-child(2) { display:block; grid-area:players; text-align:center; }
.play-shell .play-active-table tbody .play-active-row > td:nth-child(3) { display:none; }
.play-shell .play-active-table tbody .play-active-row > td:nth-child(4) { grid-area:status; text-align:right; align-self:center; padding-right:5px; }
.play-shell .play-active-row .play-active-game-labels > a { display:block; min-height:0; }
.play-shell .play-active-row .play-active-game-lockup { grid-template-columns:var(--play-row-size) minmax(0,1fr); gap:10px; min-height:var(--play-row-size); }
.play-shell .play-active-row .play-active-game-art { display:block; width:var(--play-row-size); height:var(--play-row-size); overflow:hidden; }
.play-shell .play-active-row .play-active-game-labels { gap:3px; padding:2px 0; }
.play-shell .play-active-row .play-active-game-name { font-size:17px; line-height:1.15; font-weight:700; }
.play-shell .play-active-row .play-active-game-meta { gap:5px; line-height:1.2; flex-wrap:nowrap; overflow:visible; }
.play-shell .play-active-row .play-active-game-id { font-size:11px; font-weight:500; color:#777487; font-variant-numeric:tabular-nums; }
.play-shell .play-active-row .play-active-game-day { font-size:11px; font-weight:500; color:#57576c; }
.play-shell .play-active-row .play-active-game-dot { color:#a8a2af; }
.play-shell .play-active-row .play-active-seats { display:inline-flex; flex-direction:row; align-items:center; gap:5px; min-width:0; width:auto; }
.play-shell .play-active-row .play-active-seat-count { font-size:11px; line-height:1.2; font-weight:500; color:#626074; font-variant-numeric:tabular-nums; }
.play-shell .play-active-row .play-active-seat-bar { width:64px; height:3px; flex:0 0 auto; }
.play-shell .play-active-row .play-active-status-cell,
.play-shell .play-active-row.is-filling .play-active-status-cell { display:flex; flex-direction:row; align-items:center; justify-content:flex-end; flex-wrap:nowrap; gap:14px; }
.play-shell .play-active-row .play-active-status { flex:0 0 auto; display:inline-flex; align-items:center; gap:5px; padding:3px 7px; border:1px solid color-mix(in srgb,var(--play-accent,#f05c9d) 16%,transparent); border-radius:4px; background:#ffffff70; color:color-mix(in srgb,var(--play-accent,#f05c9d) 35%,#454257); font-size:11px; line-height:1.2; font-weight:600; }
.play-shell .play-active-row .play-active-status::before { width:4px; height:4px; box-shadow:none; flex:0 0 auto; }
.play-shell .play-active-row.is-completed .play-active-status::before { content:"✓"; width:auto; height:auto; border-radius:0; background:none; color:inherit; font:600 10px/1 sans-serif; }
.play-shell .play-active-row .play-active-time { font-size:11px; line-height:1.2; font-weight:400; color:#777487; }
.play-shell .play-active-table .play-active-divider { display:block; background:none; margin-top:4px; }
.play-shell .play-active-table .play-active-divider:first-child { margin-top:0; }
.play-shell .play-active-table .play-active-divider td { display:block; padding:4px 0; border:0; }
.play-shell .play-active-table .play-active-divider span { color:#746579; font-size:12px; }
.play-shell .play-active-row .play-table-join {
  min-width:48px; min-height:26px; padding:4px 17px 4px 8px;
  font-size:12px; line-height:1.2; box-shadow:1px 1px 0 color-mix(in srgb,var(--play-accent,#f05c9d) 35%,#d9dce4);
}
.play-shell .play-active-row .play-table-join::after { right:5px; font-size:16px; }
.play-shell .play-active-row .play-active-admin-close { min-width:22px; width:22px; height:24px; min-height:24px; }
.play-shell .play-active-row .play-active-game-details { display:flex; align-items:center; flex-wrap:wrap; column-gap:10px; row-gap:3px; }
.play-shell .play-active-row .play-active-game-activity { display:inline-flex; align-items:center; gap:6px; }
.play-shell .play-active-row .play-active-game-activity::before { display:none; }
.play-shell .play-active-row .play-active-time { white-space:nowrap; }
@media(max-width:600px) {
  .play-shell .play-active-table tbody .play-active-row { --play-row-size:64px; grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"identity status"; column-gap:6px; padding:0 7px 0 0; }
  .play-shell .play-active-table tbody .play-active-row > td:nth-child(2) { position:absolute; left:calc(var(--play-row-size) + 8px); bottom:6px; width:auto; }
  .play-shell .play-active-row .play-active-game-lockup { gap:8px; align-items:start; }
  .play-shell .play-active-row .play-active-game-labels { padding:6px 0 0; gap:3px; }
  .play-shell .play-active-row .play-active-game-name { font-size:15px; line-height:1.1; }
  .play-shell .play-active-row .play-active-game-details { flex-direction:column; align-items:flex-start; gap:3px; }
  .play-shell .play-active-row .play-active-game-meta { gap:3px; }
  .play-shell .play-active-row :is(.play-active-game-id,.play-active-game-day,.play-active-seat-count,.play-active-time) { font-size:10px; }
  .play-shell .play-active-row .play-active-game-activity { gap:4px; }
  .play-shell .play-active-row .play-active-game-activity::before { display:none; }
  .play-shell .play-active-row .play-active-seat-bar { width:24px; }
  .play-shell .play-active-row .play-active-status-cell { gap:4px; }
  .play-shell .play-active-row .play-active-status { font-size:10px; padding:3px 5px; }
  .play-shell .play-active-row .play-active-status-cell,
  .play-shell .play-active-row.is-filling .play-active-status-cell { flex-direction:column; align-items:flex-end; gap:4px; }
}

.play-shell .play-active-row .play-active-seat-count,
.play-shell .play-active-row .play-active-seats:is(:hover,:focus-visible) .play-active-seat-count { text-decoration:none; }

/* Staff controls sit in a reserved gutter, outside the colored game strip. */
.play-shell .play-active-table-wrap.has-admin-controls { padding-left:45px; }
.play-shell .has-admin-controls .play-active-row .play-active-game-name { font-size:15px; }
.play-shell .play-active-table tbody .play-active-row > .play-active-admin-actions {
  position:absolute; left:-47px; top:0; bottom:0; width:39px;
  display:flex; align-items:center; justify-content:center; padding:0; background:transparent;
}
.play-shell .play-active-row .play-admin-action {
  display:inline-flex; align-items:center; justify-content:center; width:39px; min-height:25px;
  padding:3px; border:1px solid #d6b4bf; border-radius:3px;
  background:#fff7fa; color:#8b4058; box-shadow:none;
  font:600 10px/1.2 "Barlow Semi Condensed",sans-serif; cursor:pointer;
}
.play-shell .play-active-row .play-admin-action.is-crash { border-color:#c8adba; background:#f5edf2; color:#71364f; }
.play-shell .play-active-row .play-admin-action:hover:not(:disabled) { background:#f2d5e0; border-color:#a86d82; }
.play-shell .play-active-row .play-admin-action:focus-visible { outline:2px solid #81223d; outline-offset:2px; }
.play-shell .play-active-row .play-admin-action:disabled { opacity:.5; cursor:wait; }
.play-shell .play-active-row .play-active-game-activity { visibility:visible; }
@media(max-width:600px) {
  .play-shell .has-admin-controls .play-active-row .play-active-game-name { font-size:14px; }
  .play-shell .has-admin-controls .play-active-row .play-active-game-meta { gap:2px; }
}