/* Optional co-op panels. All selectors are scoped; the night palette follows the existing event theme. */
.pt-coop {
  --coop-bg: #17336d; --coop-card: #244b90; --coop-deep: #112955;
  --coop-ink: #fff; --coop-muted: #cbdbf6; --coop-border: #8dacdf; --coop-accent: #ffd23f;
  color: var(--coop-ink); font: 18px/1.35 var(--font, system-ui);
  background: var(--coop-bg); border: 3px solid var(--edge, #f4f8ff);
  box-shadow: 0 0 0 3px #0b1838, inset 0 0 0 3px var(--coop-border), 0 12px 0 #07142dcc;
  width: min(1040px, 100%); max-height: calc(100dvh - 24px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
  margin: auto; padding: 24px; overflow: auto; overscroll-behavior: contain;
  box-sizing: border-box; user-select: text; scrollbar-gutter: stable;
}
html.ev-hw26 .pt-coop {
  --coop-bg: #20153d; --coop-card: #30244f; --coop-deep: #160f2c;
  --coop-muted: #ddd0f3; --coop-border: #ab8bd4; --coop-accent: #ffce72;
}
.pt-coop * { box-sizing: border-box; }
.pt-coop [hidden] { display: none !important; }
.pt-coop h2, .pt-coop h3, .pt-coop p { margin: 0; }
.pt-coop h2 { font-size: 32px; line-height: 1.1; }
.pt-coop h3 { font-size: 22px; }
.pt-coop-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.pt-coop-sub { color: var(--coop-muted); font-size: 16px; }
.pt-coop-header p { margin-top: 6px; }
.pt-coop-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 18px; }
.pt-coop-panel { min-width: 0; background: var(--coop-card); border: 2px solid var(--coop-border); padding: 18px; }
.pt-coop-line { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 12px; }
.pt-coop-button {
  background: var(--coop-deep); border: 2px solid var(--coop-border); color: var(--coop-ink);
  box-shadow: 0 3px 0 #080e24; font: inherit; font-weight: 700; padding: 8px 14px;
  min-height: 44px; cursor: pointer; white-space: normal;
}
.pt-coop-button:enabled:hover { border-color: var(--coop-accent); color: var(--coop-accent); }
.pt-coop-button:enabled:active { transform: translateY(2px); box-shadow: 0 1px 0 #080e24; }
.pt-coop-button:disabled { opacity: .55; cursor: default; }
.pt-coop :focus-visible { outline: 3px solid var(--coop-accent); outline-offset: 3px; }
.pt-coop-input { display: block; width: 100%; min-width: 0; min-height: 44px; padding: 8px 10px;
  border: 2px solid var(--coop-border); background: var(--coop-deep); color: var(--coop-ink); font: inherit; }
.pt-coop-input::placeholder { color: var(--coop-muted); opacity: 1; letter-spacing: 0; font-size: 16px; }
.pt-coop-join { display: flex; gap: 10px; align-items: end; margin-top: 18px; }
.pt-coop-join label { display: block; flex: 1; min-width: 0; color: var(--coop-muted); }
.pt-coop-join input { margin-top: 6px; text-transform: uppercase; letter-spacing: 1px; }
.pt-coop-code { display: grid; gap: 7px; margin-bottom: 16px; }
.pt-coop-code input { font-size: 24px; font-weight: 700; letter-spacing: 3px; color: var(--coop-accent); }
.pt-coop-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.pt-coop-members, .pt-coop-friends { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.pt-coop-friends { max-height: 260px; overflow-y: auto; }
.pt-coop-member, .pt-coop-friend { display: flex; align-items: center; justify-content: space-between; min-width: 0; gap: 12px;
  padding: 10px; background: var(--coop-deep); border-left: 4px solid #70e6a0; }
.pt-coop-friend { border-left-color: var(--coop-border); }
.pt-coop-friend b, .pt-coop-who { min-width: 0; overflow-wrap: anywhere; }
.pt-coop-who { display: grid; gap: 2px; }
.pt-coop-connection { text-align: right; display: grid; flex-shrink: 0; max-width: 57%; }
.pt-coop-status { font-size: 16px; }
.pt-coop-member[data-status=poor] { border-left-color: #ffd56e; }
.pt-coop-member[data-status=reconnecting] { border-left-color: #ff9aa6; }
.pt-coop-member[data-status=left] { border-left-color: #a7b5d2; color: #c8d3e8; }
.pt-coop-member[data-status=unknown] { border-left-color: var(--coop-border); }
.pt-coop-effects { margin: 18px 0 0; padding: 10px 16px 14px; border: 2px solid var(--coop-border); }
.pt-coop-effects legend { padding: 0 6px; font-weight: 700; }
.pt-coop-choice { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; margin-right: 22px; cursor: pointer; }
.pt-coop-choice input { width: 18px; height: 18px; margin: 0; accent-color: var(--coop-accent); }
.pt-coop-effects small { display: block; margin-top: 2px; }
.pt-coop-note { padding: 12px 0; color: var(--coop-muted); }
.pt-coop-message { min-height: 24px; padding-top: 12px; color: var(--coop-accent); }
.pt-coop-watch { padding: 14px; margin-top: 16px; background: var(--coop-deep); border: 2px solid var(--coop-border); }
.pt-coop-watch .pt-coop-actions { justify-content: space-between; margin-top: 10px; }
.pt-coop-player-card { display: flex; gap: 10px; align-items: center; min-width: 0; }
.pt-coop-portrait { flex: 0 0 40px; width: 40px; height: 40px; image-rendering: pixelated; }
.pt-coop-v1 { display: grid; gap: 14px; margin-top: 18px; }
.pt-coop-table-scroll { overflow: auto; max-width: 100%; }
.pt-coop-v1 table { border-collapse: collapse; width: 100%; font-size: 14px; }
.pt-coop-v1 th, .pt-coop-v1 td { text-align: left; padding: 8px; border: 1px solid var(--coop-border); white-space: nowrap; }
.pt-coop[data-phase=playing] .pt-coop-grid { grid-template-columns: minmax(0, 1fr); }
.pt-coop[data-phase=playing] .pt-coop-grid > :last-child, .pt-coop[data-phase=playing] .pt-coop-code { display: none; }
@media (max-width: 620px) {
  .pt-coop-v1-member { flex-wrap: wrap; }
  .pt-coop-v1-member .pt-coop-player-card { flex: 1 1 100%; }
  .pt-coop-v1-member .pt-coop-who { flex: 1; }
  .pt-coop-v1-member > .pt-coop-button { width: 100%; }
  .pt-coop { padding: 16px; font-size: 17px; }
  .pt-coop-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .pt-coop-header { gap: 8px; margin-bottom: 14px; }
  .pt-coop h2 { font-size: 27px; }
  .pt-coop h3 { font-size: 20px; }
  .pt-coop-panel { padding: 12px; }
  .pt-coop-join { gap: 8px; }
  .pt-coop-button { padding: 8px 10px; }
  .pt-coop-friends { max-height: 164px; }
  .pt-coop-connection { max-width: 58%; }
}
@media (max-height: 500px) and (min-width: 621px) {
  .pt-coop { padding: 16px; }
  .pt-coop-header { margin-bottom: 10px; }
  .pt-coop-panel { padding: 12px; }
  .pt-coop-friends { max-height: 145px; }
}

/* Beta-0 host-collected results provenance (never presented as server-confirmed). */
.pt-coop-hostdata {
  margin-top: 12px; padding: 10px 12px; background: var(--coop-deep);
  border: 2px solid var(--coop-accent); color: var(--coop-accent); font-weight: 700;
}
.pt-coop-hostdata small { color: var(--coop-muted); font-weight: 400; display: block; margin-top: 2px; }

/* Co-op entry point (P5.1/P6): a normal menu item; outside the menu it falls back to a fixed button. */
.pt-coop-entry[hidden] { display: none !important; }
body > .pt-coop-entry {
  position: fixed; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); z-index: 900;
  background: #17336d; border: 2px solid #8dacdf; color: #fff; box-shadow: 0 3px 0 #080e24;
  font: 700 16px/1.2 var(--font, system-ui); padding: 10px 16px; min-height: 44px; cursor: pointer;
}
body > .pt-coop-entry small { display: block; color: #cbdbf6; font-weight: 400; font-size: 13px; }

/* "Update the page" modal (build mismatch, P6). */
.pt-coop-modal {
  --coop-bg: #17336d; --coop-ink: #fff; --coop-muted: #cbdbf6; --coop-accent: #ffd23f;
  position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center;
  background: rgba(8, 14, 36, 0.82); padding: 24px;
}
.pt-coop-modal[hidden] { display: none; }
.pt-coop-modal-box {
  background: var(--coop-bg); border: 3px solid var(--coop-accent); box-shadow: 0 0 0 3px #0b1838;
  color: var(--coop-ink); padding: 24px; max-width: 440px; width: 100%;
}
.pt-coop-modal-box h2 { font-size: 24px; margin-bottom: 10px; }
.pt-coop-modal-box p { margin-bottom: 18px; color: var(--coop-muted); }
.pt-coop-modal-box .pt-coop-button {
  background: #112955; border: 2px solid #8dacdf; color: #fff; box-shadow: 0 3px 0 #080e24;
  font: inherit; font-weight: 700; padding: 8px 14px; min-height: 44px; cursor: pointer;
}