/* The party is a guided review followed by a small, readable game room. */
.party-setup,
.party-player-card {
  width: min(100%, 640px);
  margin: 8px auto 28px;
  border: 1px solid #46363d;
  border-radius: 22px;
  padding: clamp(18px, 5vw, 30px);
  background: radial-gradient(circle at 92% 0, #ff6b5e12, transparent 32%), #1c1a20;
  box-shadow: 0 14px 34px #00000024;
}

.party-setup-header {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  margin-bottom: 18px;
}

.party-setup-header .back-button { width: 44px; min-width: 44px; margin-top: 2px; }
.party-setup-header .eyebrow { margin: 2px 0 7px; }
.party-setup-header h1,
.party-player-card h1 {
  margin: 0 0 9px;
  color: #fbf2ef;
  font-size: clamp(28px, 8vw, 39px);
  line-height: .98;
  letter-spacing: -.055em;
  overflow-wrap: anywhere;
}

.party-setup-header p:last-child,
.party-player-card > p:not(.eyebrow) {
  margin-bottom: 0;
  color: #c9c1c3;
  font-size: 14px;
  line-height: 1.5;
}

.party-local-notice {
  margin: 0 0 18px;
  border: 1px solid #4a4940;
  border-radius: 13px;
  padding: 11px 13px;
  background: #24231f;
  color: #e8d9c3;
  font-size: 12px;
  line-height: 1.5;
}

.party-diagnostic,
.party-filters,
.party-review,
.party-host,
.party-player-game {
  min-width: 0;
  margin: 14px 0 0;
  border: 1px solid #413b42;
  border-radius: 17px;
  padding: clamp(14px, 4vw, 20px);
  background: #211f24;
}

.party-host { display: grid; gap: 10px; }
.party-host-question { display: grid; gap: 10px; min-width: 0; border: 1px solid #50434a; border-radius: 13px; padding: 12px; background: #19171b; }

.party-diagnostic { border-color: #4b4247; background: linear-gradient(145deg, #282329, #211f24 70%); }
.party-review { border-color: #65434a; background: linear-gradient(145deg, #2a2025, #211f24 55%); }
.party-host,
.party-player-game { border-color: #765052; background: radial-gradient(circle at 90% 0, #ff6b5e1c, transparent 40%), #211f24; }

.party-diagnostic h2,
.party-filters h2,
.party-review h2,
.party-host h2 {
  margin: 0 0 9px;
  color: #f8f6f4;
  font-size: clamp(19px, 5vw, 23px);
  line-height: 1.1;
  letter-spacing: -.035em;
  overflow-wrap: anywhere;
}

.party-review > p,
.party-host > p,
.party-period {
  color: #c9c1c3;
  font-size: 13px;
  line-height: 1.45;
}

.party-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px 14px;
  margin: 16px 0 12px;
}

.party-summary dt {
  min-width: 0;
  align-self: center;
  color: #b9b0b3;
  font-size: 12px;
  line-height: 1.3;
}

.party-summary dd {
  min-width: 2ch;
  margin: 0;
  color: #ffb0a5;
  font-size: 17px;
  font-weight: 850;
  line-height: 1;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.party-period { margin: 12px 0 0; }
.party-warnings { display: grid; gap: 7px; margin: 14px 0 0; padding: 0; list-style: none; }
.party-warnings li { border-left: 3px solid #d79a65; padding: 5px 9px; color: #e6c69e; font-size: 12px; line-height: 1.4; }

.party-filters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.party-filters h2,
.party-filters > button,
.party-filters .party-authors { grid-column: 1 / -1; }
.party-filter {
  display: grid;
  min-width: 0;
  gap: 7px;
  color: #d8d0d2;
  font-size: 12px;
  font-weight: 720;
}

.party-filter input:not([type="checkbox"]) {
  width: 100%;
  min-width: 0;
  min-height: 46px;
  border: 1px solid #514a4f;
  border-radius: 11px;
  padding: 9px 11px;
  background: #17161a;
  color: #f8f6f4;
  color-scheme: dark;
}

.party-filter input::placeholder { color: #999094; }
.party-authors { border: 0; padding: 0; }
.party-authors legend { margin-bottom: 8px; color: #d8d0d2; font-size: 12px; font-weight: 720; }
.party-authors label {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  gap: 8px;
  margin: 0 7px 7px 0;
  border: 1px solid #514a4f;
  border-radius: 999px;
  padding: 7px 11px;
  background: #17161a;
  color: #e6dfe0;
  font-size: 12px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.party-setup input[type="checkbox"],
.party-player input[type="checkbox"] { width: 19px; height: 19px; flex: none; accent-color: #ff6b5e; }
.party-setup button,
.party-player button { min-height: 44px; }
.party-filters > button { width: 100%; }

.party-review-list { display: grid; gap: 11px; margin-top: 15px; }
.party-review-item {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 8px 10px;
  min-width: 0;
  border: 1px solid #4a4147;
  border-radius: 14px;
  padding: 13px;
  background: #19171b;
}

.party-review-item > input { grid-column: 1; grid-row: 1; align-self: start; margin: 0; }
.party-approve { grid-column: 2; align-self: center; color: #ffb1a5; font-size: 12px; font-weight: 800; line-height: 1.3; cursor: pointer; }
.party-question-prompt { grid-column: 1 / -1; margin: 5px 0 0; color: #fbf2ef; font-size: 15px; font-weight: 780; line-height: 1.35; overflow-wrap: anywhere; }
.party-question {
  grid-column: 1 / -1;
  min-width: 0;
  margin: 0;
  border-left: 2px solid #b86860;
  border-radius: 0 9px 9px 0;
  padding: 9px 11px;
  background: #211e23;
  color: #e6dddf;
  font-size: 13px;
  line-height: 1.5;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.party-question-choices {
  grid-column: 1 / -1;
  display: grid;
  gap: 6px;
  margin: 0;
  padding-left: 25px;
  color: #cac1c4;
  font-size: 12px;
  line-height: 1.4;
}

.party-signals { display: flex; flex-wrap: wrap; gap: 6px; grid-column: 1 / -1; margin: 0; padding: 0; list-style: none; }
.party-signals > * { max-width: 100%; border: 1px solid #51464d; border-radius: 999px; padding: 5px 9px; background: #242127; color: #d4c5ca; font-size: 10px; font-weight: 740; line-height: 1.35; overflow-wrap: anywhere; }
.party-source-date { grid-column: 1 / -1; margin: 0; color: #a9a0a4; font-size: 11px; line-height: 1.35; }

.party-context { grid-column: 1 / -1; min-width: 0; color: #c9c1c3; font-size: 12px; line-height: 1.45; }
.party-context summary { min-height: 44px; display: flex; align-items: center; color: #ffaaa2; font-weight: 760; text-decoration: underline; text-decoration-color: #ffaaa277; text-underline-offset: 3px; cursor: pointer; }
.party-context p { margin: 7px 0; }
.party-context ol { display: grid; gap: 6px; margin: 8px 0 0; padding-left: 22px; }
.party-context li { overflow-wrap: anywhere; white-space: pre-wrap; }
.party-context strong { color: #f0e8e9; }

.party-actions { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.party-actions .button { min-width: 0; min-height: 44px; padding: 9px 8px; font-size: 12px; line-height: 1.2; }
.party-review .button-ghost { border-color: #82747c; background: #302a31; color: #efe8eb; }
.party-review .button-ghost:not(:disabled):hover { border-color: #b18f99; background: #3a3038; color: #fff8fa; }
.party-launch { width: 100%; margin-top: 14px; }
.party-launch-zone,
.party-launch-bar {
  position: sticky;
  z-index: 10;
  bottom: 0;
  display: grid;
  gap: 7px;
  margin: 13px -2px 0;
  border-top: 1px solid #695058;
  border-radius: 13px 13px 0 0;
  padding: 10px 2px calc(10px + env(safe-area-inset-bottom, 0px));
  background: linear-gradient(180deg, #211f24ed, #211f24 40%);
  box-shadow: 0 -12px 24px #100d13a8;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
.party-launch-zone .party-status,
.party-launch-bar .party-status { margin: 0; color: #f0c1b8; font-weight: 760; }
.party-launch-zone .party-launch-status,
.party-launch-bar .party-launch-status { margin: 0; color: #f0c1b8; font-size: 12px; font-weight: 760; line-height: 1.4; }
.party-launch-zone .party-launch,
.party-launch-bar .party-launch { margin: 0; }
.party-setup { scroll-padding-bottom: calc(116px + env(safe-area-inset-bottom, 0px)); }
.party-review { scroll-margin-block-end: calc(116px + env(safe-area-inset-bottom, 0px)); }
html:has(.party-setup) { scroll-padding-block-end: calc(116px + env(safe-area-inset-bottom, 0px)); }

.party-setup button:focus-visible,
.party-player button:focus-visible,
.party-setup input:focus-visible,
.party-player input:focus-visible,
.party-context summary:focus-visible,
.party-player a:focus-visible {
  outline: 3px solid #ffaaa2;
  outline-offset: 3px;
}

.party-room { margin: 0; color: #bcb3b6; font-size: 12px; line-height: 1.4; }
.party-room-code { display: inline-block; margin: 4px 9px 8px 0; border: 1px solid #765052; border-radius: 10px; padding: 8px 12px; background: #17161a; color: #ffb1a5; font-size: 21px; font-weight: 900; letter-spacing: .13em; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.party-qr { display: block; width: min(100%, 240px); height: auto; margin: 6px 0 2px; border: 1px solid #63565b; border-radius: 13px; background: #fff; }
.party-scoreboard { display: grid; gap: 7px; margin: 9px 0; padding: 0; list-style: none; counter-reset: party-score; }
.party-scoreboard li { display: flex; min-height: 38px; align-items: center; justify-content: space-between; gap: 10px; border: 1px solid #403a40; border-radius: 10px; padding: 7px 10px; background: #19171b; color: #e6dfe0; font-size: 13px; font-weight: 700; overflow-wrap: anywhere; }
.party-answer,
.party-player-reveal { border: 1px solid #527364; border-radius: 12px; padding: 12px; background: #1b3029; color: #b9efcd; font-size: 14px; font-weight: 760; line-height: 1.45; overflow-wrap: anywhere; }
.party-player-reveal:empty { display: none; }
.party-status { min-height: 1.4em; margin: 9px 0 0; color: #b9afb2; font-size: 12px; line-height: 1.45; overflow-wrap: anywhere; }
.party-status.is-error { color: #ffaaa2; }
.party-countdown { margin: 0; border: 1px solid #72534d; border-radius: 11px; padding: 9px 11px; background: #30241f; color: #ffd1a0; font-size: 15px; font-weight: 850; font-variant-numeric: tabular-nums; }

.party-player { width: min(100%, 600px); min-height: 100dvh; display: grid; align-items: center; }
.party-player-card { margin: 0 auto; }
.party-player-card .eyebrow { margin-bottom: 8px; color: #ff8b80; font-size: 10px; font-weight: 850; letter-spacing: .14em; }
.party-language-switch { justify-content: flex-end; gap: 5px; margin: 0 0 15px; }
.party-language-switch button { min-width: 38px; min-height: 44px; border: 1px solid transparent; border-radius: 9px; padding: 5px 7px; background: transparent; color: #a9a0a4; font-size: 11px; font-weight: 850; letter-spacing: .05em; }
.party-language-switch button:hover,
.party-language-switch button.is-active { border-color: #745056; background: #ff6b5e14; color: #ffaaa2; }
.party-language-switch button:focus-visible { outline: 3px solid #ffaaa2; outline-offset: 2px; }
#party-player-game:not([hidden]) { display: grid; gap: 10px; margin-top: 20px; border-top: 1px solid #ffffff18; padding-top: 18px; }
#party-player-game .party-player-prompt { margin-bottom: 4px; }
.party-player-join { display: grid; gap: 10px; margin-top: 18px; }
.party-player-join label { color: #ded6d7; font-size: 13px; font-weight: 760; }
.party-player-join input {
  width: 100%;
  min-height: 50px;
  border: 1px solid #5b4b52;
  border-radius: 12px;
  padding: 10px 13px;
  background: #17161a;
  color: #fff7f3;
  font-size: 19px;
  font-weight: 850;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.party-player-join .button { width: 100%; }
.party-player-number { margin: 0 0 5px; color: #ffb1a5; font-size: 12px; font-weight: 850; letter-spacing: .05em; }
.party-player-round { margin: 0 0 11px; color: #c5b9bd; font-size: 11px; font-weight: 760; text-transform: uppercase; letter-spacing: .12em; }
.party-player-prompt { margin: 0 0 17px; color: #fbf2ef; font-size: clamp(20px, 6vw, 28px); font-weight: 850; line-height: 1.08; letter-spacing: -.045em; overflow-wrap: anywhere; }
.party-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.party-choice { min-height: 54px !important; border-color: #65464c; background: #30252c; color: #fff3ee; font-size: 19px; font-weight: 900; }
.party-choice:not(:disabled):hover { border-color: #ff8b80; background: #442a31; }
.party-choice:disabled { cursor: default; opacity: .58; }

@media (max-width: 430px) {
  .party-setup { margin-top: 0; border-radius: 17px; padding: 17px 14px; }
  .party-player-card { border-radius: 17px; padding: 20px 16px; }
  .party-setup-header { grid-template-columns: 44px minmax(0, 1fr); gap: 9px; }
  .party-setup-header .back-button { width: 44px; height: 44px; }
  .party-summary { gap: 7px 10px; }
  .party-filters { gap: 10px; }
  .party-actions { gap: 6px; }
  .party-actions .button { padding-right: 6px; padding-left: 6px; font-size: 11px; }
}

@media (max-width: 360px) {
  .party-setup-header { grid-template-columns: 44px minmax(0, 1fr); gap: 7px; }
  .party-setup-header .back-button { width: 44px; height: 44px; }
  .party-filters { grid-template-columns: minmax(0, 1fr); }
  .party-filters h2,
  .party-filters > button,
  .party-filters .party-authors { grid-column: 1; }
  .party-review-item { padding: 11px; }
  .party-actions { grid-template-columns: minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  .party-setup *,
  .party-player * { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}