/* Current Clash has its own original seabed, stage, and player controls. */
body:has(.party-hub) .top { display: none; }
main:has(.party-hub) { display: block; max-width: none; padding: 0; }
.party-hub, .party-dive, .home-party-mark {
  --party-seabed: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%221200%22 height=%22800%22 viewBox=%220 0 1200 800%22 shape-rendering=%22crispEdges%22%3E%3Cdefs%3E%3ClinearGradient id=%22w%22 x2=%220%22 y2=%221%22%3E%3Cstop stop-color=%22%2350a8d4%22/%3E%3Cstop offset=%22.23%22 stop-color=%22%23368cb8%22/%3E%3Cstop offset=%22.60%22 stop-color=%22%23225d91%22/%3E%3Cstop offset=%221%22 stop-color=%22%23163b68%22/%3E%3C/linearGradient%3E%3ClinearGradient id=%22f%22 x2=%220%22 y2=%221%22%3E%3Cstop stop-color=%22%2331658c%22/%3E%3Cstop offset=%221%22 stop-color=%22%23143454%22/%3E%3C/linearGradient%3E%3Cg id=%22c%22%3E%3Cpath fill=%22%23624667%22 d=%22M0 0h22v-70h-12v-37H-7v-40h-18v14h8v45h16v27h-15v-29h-13v-40h-21v18h10v42h14v36h19v37H0z%22/%3E%3Cpath fill=%22%23927198%22 d=%22M-47-123h10v37h10v20h-8v-20h-12zM-21-144h10v40h17v23h-9v-19h-18zM8-64h8v48H8z%22/%3E%3Cpath fill=%22%238c5884%22 d=%22M17-53h14v-39h15v-21h14v-41h19v16H68v39H53v25H39v39H17z%22/%3E%3Cpath fill=%22%23b785a3%22 d=%22M71-149h8v14h-8zM51-110h8v12h-8zM28-59h9v12h-9z%22/%3E%3C/g%3E%3C/defs%3E%0A%3Cpath fill=%22url%28%23w%29%22 d=%22M0 0h1200v800H0z%22/%3E%0A%3Cpath fill=%22%239cd5e8%22 opacity=%22.095%22 d=%22M44 0h61l428 676h-117zM260 0h51l358 620h-120zM561 0h62l177 604h-141zM859 0h52l-33 598H785zM1070 0h53l-192 608H830z%22/%3E%0A%3Cpath fill=%22%23306597%22 d=%22M0 463h53v-15h45v-15h72v24h54v13h119v-18h66v14h77v-10h96v12h102v-17h73v11h53v13h154v-19h67v-15h60v21h109v340H0z%22/%3E%0A%3Cpath fill=%22%2324537c%22 d=%22M0 509h101v17h111v-13h104v14h141v-16h103v20h110v-14h119v19h118v-27h133v15h160v276H0z%22/%3E%0A%3Cpath fill=%22url%28%23f%29%22 d=%22M0 606h100v-17h154v-18h198v-9h302v11h183v17h140v14h123v196H0z%22/%3E%0A%3Cpath fill=%22none%22 stroke=%22%236c9db7%22 opacity=%22.38%22 stroke-width=%223%22 d=%22M30 640h122v-12h185v-10h198m44 6h220v9h203v12h104m-921 31h188v-9h205m134 0h197v8h111m-954 50h219v-9h185m58 4h247v10h170m-981 47h234v-9h201m55-2h190v11h225%22/%3E%0A%3Cg fill=%22%23b6e4ef%22%3E%3Crect x=%22218%22 y=%22630%22 width=%223%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22523%22 y=%22298%22 width=%222%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%22921%22 y=%22310%22 width=%227%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%22812%22 y=%22403%22 width=%222%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22457%22 y=%22323%22 width=%224%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22738%22 y=%22647%22 width=%223%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%221129%22 y=%22681%22 width=%224%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%2221%22 y=%22667%22 width=%222%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22690%22 y=%2228%22 width=%222%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22418%22 y=%22391%22 width=%227%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%22898%22 y=%22622%22 width=%222%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%22228%22 y=%22592%22 width=%224%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22193%22 y=%22498%22 width=%223%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22926%22 y=%22639%22 width=%223%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22576%22 y=%22512%22 width=%224%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22248%22 y=%2291%22 width=%224%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22242%22 y=%2228%22 width=%223%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%22843%22 y=%22116%22 width=%222%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22983%22 y=%22701%22 width=%223%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%22791%22 y=%22466%22 width=%224%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22941%22 y=%22447%22 width=%227%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%22194%22 y=%22262%22 width=%227%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22483%22 y=%22460%22 width=%227%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%221165%22 y=%22146%22 width=%227%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%22546%22 y=%22585%22 width=%227%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22830%22 y=%22433%22 width=%222%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%221166%22 y=%22376%22 width=%227%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22728%22 y=%22309%22 width=%223%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%221146%22 y=%22480%22 width=%224%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22794%22 y=%22100%22 width=%222%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22639%22 y=%2225%22 width=%222%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%221037%22 y=%22289%22 width=%224%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22233%22 y=%2235%22 width=%223%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%223%22 y=%22235%22 width=%224%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%22541%22 y=%22186%22 width=%223%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22679%22 y=%22298%22 width=%224%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%221149%22 y=%22610%22 width=%223%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%22404%22 y=%22375%22 width=%227%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22501%22 y=%22397%22 width=%224%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%2264%22 y=%22253%22 width=%227%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22695%22 y=%2291%22 width=%224%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22266%22 y=%22205%22 width=%222%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%22288%22 y=%22216%22 width=%224%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22916%22 y=%22128%22 width=%227%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22217%22 y=%22262%22 width=%224%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%22870%22 y=%22428%22 width=%223%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22455%22 y=%2292%22 width=%223%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%22352%22 y=%22150%22 width=%222%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%22454%22 y=%22662%22 width=%224%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%221141%22 y=%22720%22 width=%222%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%22832%22 y=%22479%22 width=%224%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22660%22 y=%2278%22 width=%224%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%221110%22 y=%2299%22 width=%222%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22235%22 y=%2252%22 width=%223%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%220%22 y=%22692%22 width=%224%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22276%22 y=%22388%22 width=%223%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22920%22 y=%22479%22 width=%227%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%221081%22 y=%2220%22 width=%224%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22555%22 y=%22254%22 width=%224%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%221040%22 y=%220%22 width=%223%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%2215%22 y=%22366%22 width=%222%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22814%22 y=%22391%22 width=%227%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22708%22 y=%22741%22 width=%224%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22516%22 y=%22140%22 width=%224%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%22636%22 y=%22221%22 width=%227%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22142%22 y=%22448%22 width=%224%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%22787%22 y=%22615%22 width=%227%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22857%22 y=%22204%22 width=%222%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22974%22 y=%22250%22 width=%227%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%22246%22 y=%22227%22 width=%223%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22522%22 y=%2276%22 width=%223%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22928%22 y=%22677%22 width=%222%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22388%22 y=%22691%22 width=%224%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22941%22 y=%22230%22 width=%222%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%22152%22 y=%22720%22 width=%223%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%22763%22 y=%22471%22 width=%223%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22219%22 y=%22616%22 width=%224%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22446%22 y=%22697%22 width=%224%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%221019%22 y=%22547%22 width=%224%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22359%22 y=%22624%22 width=%227%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22563%22 y=%22486%22 width=%224%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%2297%22 y=%22157%22 width=%222%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%2262%22 y=%22698%22 width=%224%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22747%22 y=%22650%22 width=%224%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22357%22 y=%22134%22 width=%222%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%221038%22 y=%2268%22 width=%223%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%22467%22 y=%22316%22 width=%227%22 height=%222%22 opacity=%220.4%22/%3E%3Crect x=%22974%22 y=%22619%22 width=%224%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22719%22 y=%22252%22 width=%224%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%221068%22 y=%22442%22 width=%222%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%2282%22 y=%22312%22 width=%224%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22615%22 y=%22203%22 width=%223%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%221048%22 y=%22231%22 width=%227%22 height=%222%22 opacity=%220.25%22/%3E%3Crect x=%22904%22 y=%22114%22 width=%227%22 height=%222%22 opacity=%220.14%22/%3E%3Crect x=%22897%22 y=%22618%22 width=%222%22 height=%222%22 opacity=%220.4%22/%3E%3C/g%3E%0A%3Cg opacity=%22.55%22%3E%3Cuse href=%22%23c%22 transform=%22translate%28129 641%29 scale%28.72%29%22/%3E%3Cuse href=%22%23c%22 transform=%22translate%281081 651%29 scale%28-.92 .92%29%22/%3E%3Cuse href=%22%23c%22 transform=%22translate%28179 581%29 scale%28.36%29%22/%3E%3Cuse href=%22%23c%22 transform=%22translate%281012 593%29 scale%28-.43 .43%29%22/%3E%3C/g%3E%0A%3Cuse href=%22%23c%22 transform=%22translate%2845 811%29 scale%281.72%29%22/%3E%3Cuse href=%22%23c%22 transform=%22translate%281165 808%29 scale%28-1.8 1.8%29%22/%3E%0A%3Cg fill=%22%23759eb8%22 opacity=%22.55%22%3E%3Cpath d=%22M20 706h83v8h18v16H5v-12h15zM1037 737h108v7h19v16h-144v-13h17zM180 742h44v5h13v10h-70v-9h13zM968 712h34v6h13v9h-63v-9h16z%22/%3E%3Cpath d=%22M96 788h53v12H78v-8h18zM1053 779h53v21h-72v-12h19z%22/%3E%3C/g%3E%3C/svg%3E");
  --party-puffer-sprite: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22112%22 height=%2280%22 viewBox=%220 0 112 80%22 shape-rendering=%22crispEdges%22%3E%3Cpath fill=%22%238b592d%22 d=%22M36 34h-9v-6h-9v-5H9v-6H4v9h4v8h5v11H8v8H4v8h9v-6h8v-5h8v-4h8z%22/%3E%0A%3Cpath fill=%22%23e0a43e%22 d=%22M30 36h-9v-5h-8v-5H8v6h5v7h5v6h-6v7h8v-5h8v-4h7z%22/%3E%0A%3Cpath fill=%22%23f3c85a%22 d=%22M13 32h8v5h8v4h-9v-3h-7z%22/%3E%0A%3Cpath fill=%22%239a602d%22 d=%22M37 28h4v-7h7v-5h5v-7h5v7h7v-6h5v5h10v5h8v-5h4v8h8v7h5v8h4v17h-5v7h-8v7H85v6h-5v-5H68v6h-6v-7H49v-5h-7v-6h-6v-8h-6V36h7z%22/%3E%0A%3Cpath fill=%22%23df9842%22 d=%22M40 29h6v-8h10v-4h26v4h12v6h7v8h5v17h-5v8h-9v6H52v-6h-9v-7h-6v-7h-4V36h7z%22/%3E%0A%3Cpath fill=%22%23f3bf4b%22 d=%22M47 25h9v-6h26v5h12v6h6v7h5v13h-8v6h-8v6H55v-5h-9v-7h-5v-6h-5v-9h11z%22/%3E%0A%3Cpath fill=%22%23ffdc63%22 d=%22M54 23h30v5h10v6h7v10h-6v7h-9v5H56v-5H46v-7h-5v-8h5v-7h8z%22/%3E%0A%3Cpath fill=%22%23fff0a0%22 d=%22M56 23h26v4h-9v4H50v-3h6zM85 29h8v5h-8zM91 50h9v4h-6v4H65v-4h26z%22/%3E%0A%3Cpath fill=%22%23d58642%22 d=%22M47 37h5v4h-5zM53 48h5v4h-5zM60 35h4v3h-4zM67 49h4v3h-4zM72 29h5v3h-5zM82 46h6v4h-6z%22/%3E%0A%3Cpath fill=%22%23ac6a37%22 d=%22M57 42h12v5h8v6h-9v5h-5v-6h-6z%22/%3E%0A%3Cpath fill=%22%23f6b854%22 d=%22M60 44h8v5h5v3h-8v-3h-5z%22/%3E%0A%3Cpath fill=%22%23854f36%22 d=%22M52 61h12v5h-5v6h-8v-5h-5v-4h6z%22/%3E%0A%3Cpath fill=%22%23eba24a%22 d=%22M52 63h9v3h-4v4h-4v-4h-5v-2h4z%22/%3E%0A%3Cpath fill=%22%23fff8cd%22 d=%22M83 32h10v3h3v9h-4v3h-9v-3h-3v-9h3z%22/%3E%0A%3Cpath fill=%22%23392d36%22 d=%22M88 35h5v3h2v5h-3v2h-4v-3h-2v-5h2zM100 48h8v4h-6v3h-6v-3h4z%22/%3E%0A%3Cpath fill=%22%23fffde8%22 d=%22M88 35h3v3h-3z%22/%3E%0A%3Cpath fill=%22%23f2a65e%22 d=%22M78 49h7v4h-7z%22/%3E%3Cpath fill=%22%23a96736%22 d=%22M45 57h5v4h-5zM80 62h6v3h-6z%22/%3E%3C/svg%3E");
  --party-panel: #101b30ef;
  --party-edge: #4b6f96;
  --party-tools-width: clamp(240px, 22vw, 330px);
  --party-center: calc((100% - var(--party-tools-width) - 18px) / 2);
  isolation: isolate;
  color: #eff7ff;
}
.party-hub {
  position: relative;
  min-height: 100dvh;
  padding: 1rem clamp(.75rem, 2.5vw, 2.5rem) max(1.5rem, env(safe-area-inset-bottom));
}
.party-water {
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 50% 50%, #142b580a 24%, #101c3d46 60%, #080e25c2 100%),
    linear-gradient(180deg, #0a174853, #10193320 55%, #09132855),
    var(--party-seabed) center bottom / cover no-repeat, #14517e;
  image-rendering: pixelated;
}
.party-water::after {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .24;
  background: repeating-linear-gradient(0deg, #0717283b 0 1px, transparent 1px 3px);
}
.party-hub .party-water {
  background: radial-gradient(circle at 22% 38%, #c5e6fa78 0 1px, transparent 1.5px) 0 0 / 129px 111px,
    radial-gradient(circle at 72% 61%, #91c3dd60 0 1px, transparent 1.5px) 0 0 / 197px 131px,
    linear-gradient(#0b2b4799, #071225df 73%, #060e1bef),
    url("/party-arena-v2.png") center / cover no-repeat, #193b56;
}
.party-dive .party-water { position: absolute; }
.party-dive .party-water::after { display: none; }
.party-heading {
  position: relative;
  max-width: 1080px;
  margin: 0 auto .9rem;
  padding-top: clamp(40px, 6.8vh, 58px);
  text-align: center;
}
.party-heading > button { position: absolute; top: 0; left: 0; margin: 0; }
.party-hub-brand {
  margin: 0 0 .6rem;
  color: #eff5fc;
  font: 400 clamp(2.9rem, 6.4vw, 4.25rem)/.93 Pixelify, monospace;
  letter-spacing: .075em;
  text-shadow: -3px 2px #d9618c, 3px -2px #48c6dd;
}
.party-heading .kicker {
  margin: 0;
  color: #93b8d1;
  font-size: clamp(.72rem, 1.55vw, .9rem);
  letter-spacing: .14em;
}
.party-heading h2 {
  margin: 0 0 .65rem;
  color: #76e6f5;
  font: 400 clamp(1.23rem, 2.4vw, 1.68rem)/1.1 Pixelify, monospace;
  letter-spacing: .2em;
  text-transform: uppercase;
}
.party-hub-intro { max-width: 520px; margin: .8rem auto 0; color: #d8e8f5; line-height: 1.35; }
.party-discovery-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, .88fr) minmax(0, 1fr);
  align-items: start;
  gap: .75rem;
  max-width: 1080px;
  margin: auto;
}
.party-hub-column, .party-hub-center, .party-host-group { display: grid; align-content: start; gap: .65rem; min-width: 0; }
.party-hub .party-glass, .party-dive .party-glass {
  margin: 0;
  min-width: 0;
  padding: .75rem;
  border: 1px solid var(--party-edge);
  border-radius: 0;
  background: var(--party-panel);
  box-shadow: 4px 4px #11263c7d;
}
.party-glass h3 { color: #b9e9ff; font-size: 1.28rem; margin-bottom: .4rem; }
.party-glass label, .party-glass small { font-size: .92rem; }
.party-glass label { color: #d4ecff; }
.party-glass .muted, .party-drawer .muted { color: #b3cee1; }
.party-hub-column .party-glass { display: grid; gap: .42rem; }
.party-hub .party-hub-caption { margin: 0; color: #dbe9f6; text-transform: uppercase; font-size: .93rem; letter-spacing: .16em; }
.party-hub .party-identity-heading { display: flex; gap: .5rem; justify-content: space-between; align-items: center; }
.party-hub .party-identity-heading .party-practice-entry { min-height: 34px; margin: 0; padding: .25rem .18rem; text-decoration: underline; }
.party-hub .party-identity > label { margin-top: .25rem; }
.party-hub input, .party-hub select, .party-drawer input, .party-drawer select {
  min-width: 0;
  border-color: #73b5cd;
  border-radius: 0;
  background: #0d2139;
  color: #e6f7ff;
}
.party-avatar-strip { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .18rem; }
.party-avatar-strip .party-avatar {
  display: grid;
  justify-items: center;
  gap: .15rem;
  min-width: 0;
  padding: .2rem .03rem;
  border-color: #4b7797;
  background: #142f4b;
  color: #c7e5f4;
  font-size: .68rem;
  text-shadow: none;
}
.party-avatar[aria-pressed="true"] { border-color: #f6dc86; color: #fff0ac; background: #264760; }
.party-avatar .creature { width: clamp(20px, 3.4vw, 44px); margin: 0; }
.party-hub .party-avatar { grid-template-rows: 30px auto auto; align-content: start; gap: .08rem; min-height: 83px;
  line-height: 1.12; letter-spacing: .015em; overflow-wrap: anywhere; }
.party-hub .party-avatar small { font-size: .63rem; }
.party-hub .party-avatar[aria-pressed="true"] { border-color: #61dff4; color: #e4f7ff; background: #163547; }
.party-hub .party-mascot { height: clamp(125px, 25vh, 207px); }
.party-find { display: grid; gap: .55rem; }
.party-find .entry { margin-top: .2rem; }
.party-host { border-color: #a86eaf; background: #633b73; color: #fff0ff; }
.party-host-options { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: .35rem .65rem; }
.party-host-options .toggle { grid-column: 1 / -1; }
.party-host-options select { width: 100%; }
.party-public-list > button { margin: 0 0 .45rem; }
.party-public-list > h3 { margin-bottom: .4rem; }
.party-public-room {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  padding: .4rem 0;
  border-top: 1px solid #79b2cb44;
}
.party-public-room > div { min-width: 0; overflow-wrap: anywhere; }
.party-public-room small { display: block; color: #b5cee0; }
.party-public-room button { flex: 0 0 auto; min-height: 36px; padding: .2rem .55rem; }
.party-mascot {
  position: relative;
  height: clamp(145px, 28vh, 248px);
  display: grid;
  place-items: center;
}
.party-mascot::after {
  content: "";
  position: absolute;
  bottom: 10%;
  left: 50%;
  translate: -50%;
  width: clamp(54px, 9vmin, 88px);
  height: 15px;
  background: #081b37a6;
  clip-path: polygon(14% 15%, 34% 0, 67% 0, 85% 15%, 100% 35%, 100% 65%, 85% 85%, 64% 100%, 34% 100%, 14% 85%, 0 65%, 0 35%);
  animation: party-shadow 2.2s steps(12) infinite alternate;
}
.party-puffer {
  display: block;
  width: clamp(57px, 9.5vmin, 106px);
  aspect-ratio: 7 / 5;
  pointer-events: none;
}
.party-puffer > i {
  display: block;
  width: 100%;
  height: 100%;
  background: var(--party-puffer-sprite) center / contain no-repeat;
  image-rendering: pixelated;
  animation: party-hover 2.2s steps(14) infinite alternate;
}
.party-mascot .party-puffer { width: clamp(72px, 11.8vmin, 120px); z-index: 1; }
.party-mascot .party-puffer > i { filter: drop-shadow(0 5px 0 #18385155); }
.party-dive {
  --party-tools-width: 0px;
  --party-center: 50%;
  --party-room-panel: #121a2bed;
  --party-room-cyan: #92e6f7;
  --party-room-coral: #ff89ad;
}
.party-dive:not(.party-practice) .party-water {
  background: url("/party-arena-v2.png") center / 100% 100% no-repeat, #193b56;
}
.party-dive:not(.party-practice)::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 70% 0 0;
  background: linear-gradient(transparent, #090e1acf 67%);
  pointer-events: none;
}
.party-ring {
  position: absolute;
  z-index: 1;
  left: var(--party-center);
  top: 24%;
  width: min(800px, calc(100% - 64px));
  height: 53.5%;
  transform: translateX(-50%);
}
.party-ring .party-puffer {
  position: absolute;
  z-index: 3;
  left: var(--puffer-x);
  top: var(--puffer-y);
  width: clamp(62px, 12vmin, 119px);
  transform: translate(-50%, -50%);
}
.party-ring .party-puffer > i {
  position: relative;
  z-index: 1;
  scale: var(--puffer-facing, 1) 1;
  animation: party-arena-bob 2.1s steps(18) infinite alternate;
}
.party-ring .party-puffer::after {
  content: "";
  position: absolute;
  inset: 110% 15% auto;
  height: 17%;
  background: #0a172b80;
  border-radius: 50%;
}
.party-ring .party-puffer.passing {
  animation: party-handoff .84s var(--puffer-elapsed) both;
}
.party-ring .party-puffer.passing > i {
  animation: party-bank .84s ease-in-out var(--puffer-elapsed) both,
    party-arena-bob 2.1s steps(18) infinite alternate;
}
.party-ring .party-puffer.passing::before {
  content: "";
  position: absolute;
  inset: 3% 1%;
  background:
    radial-gradient(circle at 23% 64%, #d7f6fa 0 2px, transparent 3px),
    radial-gradient(circle at 60% 26%, #b8e9f4 0 2px, transparent 3px),
    radial-gradient(circle at 74% 81%, #b8e9f4 0 1px, transparent 2px),
    radial-gradient(circle at 42% 94%, #d7f6fa 0 2px, transparent 3px);
  animation: party-wake .64s steps(10) var(--puffer-elapsed) both;
}
.party-pop-burst {
  position: absolute;
  z-index: 4;
  left: var(--pop-x);
  top: var(--pop-y);
  width: 0;
  height: 0;
  pointer-events: none;
}
.party-pop-burst b {
  position: absolute;
  color: #ffd0e2;
  text-shadow: 2px 2px #142339;
  white-space: nowrap;
  font-size: clamp(1rem, 2.7vw, 1.65rem);
  animation: party-heart-loss .66s ease-out var(--pop-elapsed) both;
}
.party-pop-burst i {
  position: absolute;
  width: 5px;
  height: 5px;
  border: 1px solid #ffd4e5;
  background: #ec84b5;
  animation: party-pop-spark .48s steps(8) var(--pop-elapsed) both;
}
.party-ring .clash-seat {
  --stone: #243751;
  --stone-face: #15213b;
  --stone-ridge: #405575;
  position: absolute;
  z-index: 2;
  left: var(--seat-x);
  top: var(--seat-y);
  transform: translate(-50%, -50%);
  display: grid;
  justify-items: center;
  align-content: center;
  width: clamp(54px, 12vmin, 112px);
  min-height: 0;
  padding: 0 2px;
  border: 0;
  background: transparent;
  text-align: center;
  text-shadow: 1px 2px #102137;
}
.party-ring .clash-seat:nth-child(3n+2) { --stone: #263b4d; --stone-face: #162c38; --stone-ridge: #4a666e; }
.party-ring .clash-seat:nth-child(3n+3) { --stone: #2e3853; --stone-face: #1e233b; --stone-ridge: #525773; }
.party-ring .seat-platform {
  display: block;
  width: 98%;
  height: clamp(22px, 5.5vmin, 47px);
  background:
    linear-gradient(139deg, transparent 42%, #9fbdc82c 43% 46%, transparent 47%) 0 0 / 39% 74%,
    linear-gradient(35deg, transparent 41%, #040a1c50 42% 49%, transparent 50%) 0 0 / 32% 87%,
    linear-gradient(180deg, var(--stone-ridge) 0 12%, var(--stone) 12% 49%, var(--stone-face) 50% 85%, #0c162b 85%);
  clip-path: polygon(12% 22%,20% 10%,36% 0,68% 0,82% 11%,94% 27%,100% 49%,95% 70%,84% 88%,69% 100%,29% 100%,14% 88%,5% 68%,0 50%,4% 34%);
}
.party-ring .clash-seat:nth-child(3n+2) .seat-platform {
  clip-path: polygon(0 38%,8% 20%,25% 5%,63% 0,80% 10%,93% 24%,100% 42%,96% 58%,88% 72%,77% 75%,74% 92%,60% 100%,38% 100%,25% 89%,23% 77%,11% 71%,4% 57%);
}
.party-ring .clash-seat:nth-child(3n+3) .seat-platform {
  clip-path: polygon(1% 47%,8% 28%,16% 14%,33% 5%,55% 0,75% 11%,91% 24%,100% 51%,95% 71%,87% 84%,67% 96%,34% 100%,15% 90%,6% 76%);
}
.party-ring .clash-seat.active .seat-platform {
  --stone: #4d3a58;
  --stone-ridge: #ad759d;
}
.party-ring .clash-seat strong {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: .94rem;
  font-weight: 400;
}
.party-ring .clash-seat small { margin: 0; color: #d7ecfb; font-size: .77rem; line-height: 1.05; }
.party-ring .clash-seat .seat-hearts { color: var(--party-room-coral); letter-spacing: .06em; }
.party-ring .clash-seat .creature {
  width: clamp(28px, 6vmin, 55px);
  margin: 0 0 -5px;
  animation: island-float 3.8s steps(18) infinite;
  animation-delay: calc(var(--island) * -.37s);
}
.party-ring .clash-seat.active strong { color: #ffc0d6; }
.party-ring .clash-seat.winning :is(strong, .seat-hearts) { color: #a6f4d0; }
.party-ring .clash-seat.eliminated { opacity: .57; filter: grayscale(1); }
.party-ring .clash-seat.lost-heart { animation: island-hit .4s ease-out var(--pop-elapsed) both; }
.party-ring .clash-seat.open { opacity: .88; }
.party-ring-dense .clash-seat { width: clamp(44px, 9vmin, 86px); }
.party-ring-dense .clash-seat .creature { width: clamp(21px, 4.5vmin, 36px); }
.party-ring-dense .clash-seat strong { font-size: .73rem; }
.party-ring-dense .clash-seat small { font-size: .68rem; }
/* Large tables keep the central puffer clear and place full names in Room tools. */
.party-ring-packed { container-type: size; }
.party-ring-packed .clash-seat { width: 15%; max-width: 112px; height: min(17cqh, 72px); }
.party-ring-packed .seat-platform { height: clamp(8px, 4.7cqh, 22px); }
.party-ring-packed .clash-seat .creature { width: clamp(12px, 5.4cqh, 25px); margin-bottom: -2px; }
.party-ring-packed .clash-seat strong { font-size: clamp(8px, 3.5cqh, .8rem); line-height: 1; }
.party-ring-packed .clash-seat small { font-size: clamp(8px, 3.1cqh, .68rem); line-height: 1; }
.party-ring-packed .clash-seat small:not(.seat-hearts),
.party-ring-packed .seat-answer { display: none; }
.party-ring[data-seats="16"] .clash-seat { width: 13%; height: auto; }
.party-ring[data-seats="16"] .clash-seat .creature { width: clamp(14px, 5.4cqh, 25px); }
.party-ring[data-seats="16"] .clash-seat strong { font-size: clamp(11px, 3.5cqh, .8rem); }
.party-ring[data-seats="16"] .clash-seat small { font-size: clamp(9px, 3.1cqh, .68rem); }
.seat-answer {
  position: absolute;
  z-index: 4;
  bottom: calc(100% + 2px);
  left: 50%;
  transform: translateX(-50%);
  width: max-content;
  max-width: 130px;
  padding: .18rem .35rem;
  background: var(--party-room-panel);
  border: 1px solid #7692ac90;
  color: #e1f4ff;
  font-size: .78rem;
  overflow-wrap: anywhere;
}
.clash-seat.upper .seat-answer { top: calc(100% + 2px); bottom: auto; }
.party-ring:not(.party-ring-packed) .clash-seat.upper .seat-answer {
  top: 24%;
  bottom: auto;
  left: calc(100% + 5px);
  transform: none;
}
.party-ring:not(.party-ring-packed) .clash-seat.upper.right-half .seat-answer {
  left: auto;
  right: calc(100% + 5px);
}
.seat-answer:empty { display: none; }
.party-room-banner {
  position: absolute;
  z-index: 5;
  left: max(10px, env(safe-area-inset-left));
  top: max(10px, env(safe-area-inset-top));
  display: flex;
  align-items: center;
  gap: .45rem;
  padding: .15rem .45rem .15rem .15rem;
  background: #102b45c7;
  border: 1px solid #81adc366;
}
.party-room-banner button { min-height: 33px; padding: .2rem .45rem; color: #dff4ff; }
.party-room-banner small { color: #c1dce8; }
.party-dive:not(.party-quick-search) .party-room-banner {
  inset: max(8px, env(safe-area-inset-top)) 0 auto;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 0 max(12px, calc((100% - 700px) / 2));
  border: 0;
  background: transparent;
  pointer-events: none;
}
.party-plaque, .party-dive .stage-question {
  background: var(--party-room-panel);
  clip-path: polygon(0 8px, 5px 8px, 5px 3px, 12px 3px, 12px 0, calc(100% - 12px) 0, calc(100% - 12px) 3px, calc(100% - 5px) 3px, calc(100% - 5px) 8px, 100% 8px, 100% calc(100% - 8px), calc(100% - 5px) calc(100% - 8px), calc(100% - 5px) calc(100% - 3px), calc(100% - 12px) calc(100% - 3px), calc(100% - 12px) 100%, 12px 100%, 12px calc(100% - 3px), 5px calc(100% - 3px), 5px calc(100% - 8px), 0 calc(100% - 8px));
}
.party-plaque { min-width: 108px; padding: .42rem .8rem .38rem; justify-self: start; }
.party-plaque small, .party-phase-tag { display: block; color: #c0cbdc; text-transform: uppercase; letter-spacing: .19em; font-size: .73rem; }
.party-plaque strong { display: block; color: var(--party-room-cyan); font-size: 1.7rem; font-weight: 400; line-height: 1; }
.party-room-count { justify-self: end; text-align: end; }
.party-room-count strong { color: var(--party-room-coral); }
.party-room-banner .party-exit {
  position: absolute;
  left: max(9px, env(safe-area-inset-left));
  top: 58px;
  min-height: 36px;
  background: var(--party-room-panel);
  border-color: #6887a4aa;
  pointer-events: auto;
}
.party-toolbar {
  position: absolute;
  z-index: 10;
  right: max(9px, env(safe-area-inset-right));
  top: max(66px, calc(env(safe-area-inset-top) + 58px));
}
.party-toolbar button { min-height: 36px; padding: .22rem .55rem; background: var(--party-room-panel); border: 1px solid #6887a4aa; color: #def2ff; }
.party-drawer {
  position: absolute;
  z-index: 9;
  display: none;
  top: max(106px, calc(env(safe-area-inset-top) + 100px));
  right: max(9px, env(safe-area-inset-right));
  bottom: max(14px, env(safe-area-inset-bottom));
  width: min(330px, calc(100% - 20px));
  overflow: auto;
  overscroll-behavior: contain;
  padding: .65rem;
  color: #e5f5ff;
  background: #102b48ef;
  border: 1px solid #6795b2;
  box-shadow: 4px 4px #0b274776;
}
.party-drawer-open, .party-drawer header button { display: block; }
.party-drawer header { display: flex; justify-content: space-between; align-items: center; margin-bottom: .45rem; }
.party-drawer header strong { color: #f5df94; font-size: 1.2rem; letter-spacing: .09em; }
.party-drawer header button { min-height: 32px; min-width: 32px; padding: .12rem; }
.party-access { padding-bottom: .4rem; border-bottom: 1px solid #597b9a; }
.party-drawer .actions { gap: .25rem; }
.party-drawer .actions button { font-size: .85rem; min-height: 32px; padding: .25rem .4rem; }
.party-roster details { padding: .3rem 0; border-bottom: 1px solid #426887; }
.party-roster summary { cursor: pointer; }
.party-chat-log { margin: .6rem 0; min-height: 42px; max-height: 210px; overflow: auto; }
.party-chat-log p { margin: .15rem 0; padding: .3rem .4rem; background: #1b4163; overflow-wrap: anywhere; font-size: .94rem; }
.party-chat-log strong { color: #82e1fb; margin-right: .3rem; }
#party-chat { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .3rem; }
#party-chat button { padding: .35rem; }
#party-chat-text { min-width: 0; }
.party-history { margin-top: .6rem; padding: .5rem; border: 1px solid #5b7994; text-align: left; }
.party-history > summary { color: #f0d38e; cursor: pointer; }
.party-placements { list-style: none; padding: 0; }
.party-placements li { display: grid; padding: .35rem 0; border-bottom: 1px solid #52738a; gap: .15rem; }
.party-placements li:first-child strong { color: #f5dd97; }
.party-placements span { color: #c5dbe8; font-size: .87rem; }
.party-review-screen { width: min(704px, calc(100% - 20px)); max-height: calc(var(--game-height, 100dvh) - 20px);
  margin: 10px auto; overflow-y: auto; overscroll-behavior: contain; }
.party-review-heading { display: flex; justify-content: space-between; align-items: start; gap: .5rem; }
.party-review-heading h2, .party-review-heading .kicker { margin-block: 0 .35rem; }
.party-review-heading button { margin: 0; }
.party-review-outcome { color: #bdebf7; margin: .7rem 0; }
.party-review-rarity { margin: .7rem 0; }
.party-review-rarity h3, .party-review-rarity p { margin: 0 0 .3rem; }
.party-review-rarity ul { list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(7.25rem, 1fr)); padding: 0; gap: .25rem; }
.party-review-rarity li { display: flex; align-items: center; justify-content: space-between; gap: .25rem; padding: .22rem .32rem;
  border: 1px solid #37566e; color: #dbeafa; font-size: .86rem; }
.party-review-rarity li span { display: flex; align-items: center; gap: .27rem; }
.party-recap-actions { margin-block: .35rem; }
.party-history > [data-act="party-share-result"] { margin-block: .5rem; }
#party-feedback, #party-report, #party-settings { display: grid; gap: .55rem; margin-top: .65rem; }
#party-feedback textarea, #party-report textarea {
  min-height: 70px;
  resize: vertical;
  width: 100%;
  font: 1rem Pixelify, monospace;
  color: #e5f5ff;
  background: #0d2139;
  border: 1px solid #527d8d;
  padding: .5rem;
}
#party-settings .mode-grid { grid-template-columns: 1fr; gap: .4rem; }
#party-settings label:has(input[type="checkbox"]) { display: flex; gap: .5rem; align-items: center; }
#party-settings input[type="checkbox"] { width: auto; }
.party-topics {
  min-inline-size: 0;
  margin: .7rem 0;
  padding: .55rem .65rem;
  border: 1px solid #46677f;
  color: #cfe8f6;
}
.party-topic-options { display: grid; gap: .15rem; margin-block-end: .4rem; }
.party-topic-options label { min-height: 36px; }
#party-settings .party-topic-options input { min-height: 0; accent-color: #75d9ee; }
.party-topic-options small, .party-topics output { color: #a9c5db; }
.party-rotation { display: grid; gap: .25rem; margin: .65rem 0; color: #cfe8f6; }
.party-rotation small { color: #a9c5db; }
.party-public-topics, #party-settings:has([name="public"]:checked) :is(.party-topics, .party-rotation) { display: none; }
#party-settings:has([name="public"]:checked) .party-public-topics { display: block; }
.party-category-rule, .party-category-progress { color: #a8eaff; }
.party-category-progress { display: inline-block; margin-inline-start: .75rem; letter-spacing: .06em; }
.party-dive[data-party-phase="lobby"] .party-ring {
  top: 21%;
  height: 46%;
}
.party-room-controls, .party-countdown {
  position: absolute;
  z-index: 4;
  left: var(--party-center);
  transform: translateX(-50%);
  width: min(520px, calc(100% - var(--party-tools-width) - 30px));
  text-align: center;
}
.party-room-controls {
  bottom: max(.65rem, env(safe-area-inset-bottom));
  max-height: 33%;
  overflow: auto;
}
.party-dive[data-party-phase="result"] {
  display: grid;
  grid-template: max(108px, calc(env(safe-area-inset-top) + 100px)) minmax(0, 1fr) auto / minmax(0, 1fr);
}
.party-dive[data-party-phase="result"] :is(.party-ring, .party-room-controls) {
  position: relative;
  justify-self: center;
  inset: auto;
  transform: none;
  height: auto;
}
.party-dive[data-party-phase="result"] .party-ring { grid-area: 2 / 1; margin: 8px 0; }
.party-dive[data-party-phase="result"] .party-room-controls {
  grid-area: 3 / 1;
  max-height: min(42dvh, 320px);
  margin: 0 0 max(8px, env(safe-area-inset-bottom));
}
@media (max-height: 520px) {
  .party-dive[data-party-phase="result"] .party-ring[data-seats="2"] .clash-seat { top: 50%; left: 20%; }
  .party-dive[data-party-phase="result"] .party-ring[data-seats="2"] .clash-seat:nth-child(2) { left: 80%; }
}
.party-lobby-title {
  position: absolute;
  z-index: 2;
  top: max(80px, 10%);
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
  pointer-events: none;
}
.party-lobby-title p {
  margin: 0;
  color: #eef9ff;
  font: 400 clamp(2.3rem, 7.8vmin, 5rem)/1 Pixelify, monospace;
  text-transform: uppercase;
  text-shadow: -3px 2px #d5628c, 3px -2px #63c5da;
}
.party-lobby-title h2 {
  margin: .35rem 0 0;
  color: var(--party-room-cyan);
  font: 400 clamp(.9rem, 2vmin, 1.32rem)/1.1 Pixelify, monospace;
  text-transform: uppercase;
  letter-spacing: .24em;
}
.party-room-controls.party-lobby-controls {
  bottom: clamp(20px, 10.8%, 96px);
  display: grid;
  gap: .25rem;
  width: min(610px, calc(100% - 24px));
  max-height: none;
  overflow: visible;
}
.party-rule-rail {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 3px;
}
.party-rule-cell {
  display: grid;
  justify-items: center;
  align-content: center;
  min-width: 0;
  min-height: 62px;
  background: var(--party-room-panel);
  border: 1px solid #526c89;
}
.party-rule-cell small { color: #b9c4d4; font-size: .73rem; letter-spacing: .12em; text-transform: uppercase; }
.party-rule-cell > div { display: flex; align-items: center; justify-content: center; width: 100%; }
.party-rule-cell strong { flex: 0 1 auto; color: var(--party-room-cyan); font-size: 1.1rem; font-weight: 400; white-space: nowrap; }
.party-rule-cell button { min-width: 33px; min-height: 32px; padding: .1rem .25rem; color: #d6efff; }
.party-lobby-controls .party-start-match {
  width: 100%;
  min-height: clamp(48px, 8vmin, 70px);
  border: 2px solid #74bdd2;
  background: #18283f;
  box-shadow: inset 0 0 0 3px #25374c;
  color: #def7ff;
  text-transform: uppercase;
}
.party-lobby-controls .party-start-match:not(:disabled):is(:hover, :focus-visible) { background: #27546c; }
.party-lobby-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .18rem .3rem;
  padding: .2rem .35rem;
  background: #101725ed;
}
.party-lobby-footer > small { margin-inline-end: auto; color: #c4d6e6; }
.party-lobby-footer button { min-height: 34px; padding: .18rem .35rem; }
.party-lobby-topic { color: #c0d3e3; }
.party-room-controls > .actions { justify-content: center; }
.party-room-controls > .actions button { flex: 1 1 115px; }
.party-rematch-options { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .15rem .55rem; margin: .25rem 0 .45rem; }
.party-rematch-options small { color: #a9c5db; }
.party-autojoin { min-height: 44px; padding: .4rem .55rem; }
.party-autojoin::before { content: ""; display: inline-block; width: .8em; height: .8em; margin-inline-end: .35rem; border: 1px solid currentColor; }
.party-autojoin[aria-pressed="true"] { color: #a8eaff; }
.party-autojoin[aria-pressed="true"]::before { background: currentColor; box-shadow: inset 0 0 0 2px #101f34; }
.party-room-controls h3 { color: #ffe7a0; }
.party-room-controls > p { margin: .2rem 0 .45rem; }
.party-dive.party-quick-search { --party-tools-width: 0px; --party-center: 50%; }
.party-quick-count, #party-quick-countdown { color: #a8eaff; }
.party-quick-wait button { min-width: min(100%, 160px); }
.party-practice-entry { justify-self: center; margin-bottom: .5rem; }
.party-dive.party-practice {
  --party-tools-width: 0px;
  --party-center: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .5rem;
  padding-block: max(56px, 9vh, calc(env(safe-area-inset-top) + 47px)) max(.5rem, env(safe-area-inset-bottom));
  overflow-y: auto;
}
.full-dive.party-dive.party-practice :is(.stage-question, .answer-dock) {
  position: relative;
  inset: auto;
  transform: none;
  flex: none;
}
.party-practice .stage-question { z-index: 3; }
.party-practice .party-practice-dock { margin-top: auto; }
.party-practice-dock .actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: .3rem;
}
.party-practice-dock .actions button { padding-inline: .45rem; }
.party-practice-guide { color: #bce5f1; margin: .55rem 0 0; font-size: .94rem; }
.party-practice-meter, .party-practice-used { color: #b9d4e6; }
.party-practice-dock .feedback { margin: .2rem 0; min-height: 0; color: #ffe4a2; }
.party-practice-verdict:empty { display: none; }
.party-practice-fuse { color: #ffc8df; font-size: 1.35rem; text-align: center; margin: .35rem 0; }
.party-practice .practice-passing { animation: party-practice-pass 1s ease-in-out both; }
@keyframes party-practice-pass {
  0%, 100% { left: 39%; top: 56%; }
  52% { left: 63%; top: 47%; }
}
@media (max-width: 400px) {
  .party-practice .entry button { padding: .45rem .55rem; }
}
.party-countdown { top: 19%; transform: translate(-50%, -50%); pointer-events: none; }
.party-countdown strong {
  display: block;
  color: #ff9bcd;
  font: 400 clamp(5rem, 16vmin, 9rem)/.8 Pixelify, monospace;
  text-shadow: 4px 4px #683966, 6px 6px #1d3153;
}
.party-dive .stage-question {
  left: var(--party-center);
  top: 9%;
  width: min(530px, calc(100% - var(--party-tools-width) - 50px));
  padding: .66rem .9rem;
  background: #0b223be9;
}
.party-dive .stage-question .kicker { color: #ffc8df; margin-bottom: .35rem; }
.party-dive .stage-question .scope { color: #c3dcea; margin-top: .35rem; }
.party-dive[data-party-phase="play"]:not(.party-practice) .stage-question {
  z-index: 2;
  top: max(76px, 11.4%, calc(env(safe-area-inset-top) + 66px));
  width: min(501px, calc(100% - 24px));
  max-height: min(162px, 22%);
  overflow: auto;
  scrollbar-width: thin;
  scrollbar-color: #637e99 transparent;
  border: 0;
  box-shadow: none;
  background: var(--party-room-panel);
}
.party-dive[data-party-phase="play"]:not(.party-practice) .question {
  font-size: clamp(19px, 3.3vmin, 28px);
  line-height: 1.07;
}
.party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]) .party-ring-packed {
  top: max(232px, 29%);
  height: calc(100% - max(232px, 29%) - 23%);
}
.party-answer-trail { margin-top: .45rem; border-top: 1px solid #78b7d063; }
.party-answer-trail summary { padding: .3rem 0 .1rem; color: #c8edff; cursor: pointer; }
.party-answer-trail-label { font-size: .75rem; }
.party-answer-entry {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: baseline;
  gap: .35rem;
  color: #e7f8ff;
  overflow-wrap: anywhere;
}
.party-answer-entry small { color: #bdd8e9; }
.party-answer-tier { display: inline-flex; align-items: center; gap: .25rem; color: #e1f3ff; white-space: nowrap; }
.party-answer-earned { color: #ffc8df; font-weight: 700; }
.party-answer-trail .answer-list { margin: .25rem 0 0; padding: 0; list-style: none; overscroll-behavior: contain; }
.party-answer-trail li { padding: .23rem 0; border-top: 1px solid #78b7d03d; }
.keyboard-open .party-dive[data-party-phase="play"]:not(.party-practice) .stage-question {
  top: max(45px, env(safe-area-inset-top));
  max-height: max(75px, calc(var(--game-height, 100dvh) - 235px));
  overflow: auto;
}
.party-dive .answer-dock {
  z-index: 5;
  left: var(--party-center);
  bottom: max(.5rem, env(safe-area-inset-bottom));
  width: min(590px, calc(100% - var(--party-tools-width) - 35px));
  gap: .22rem;
  padding: .45rem .6rem;
  background: #0d2943eb;
  border: 1px solid #74b2cd;
}
.party-dive .party-live-dock {
  --party-dock-size: clamp(48px, 7.5vmin, 62px);
  bottom: max(16px, 7%, env(safe-area-inset-bottom));
  width: min(610px, calc(100% - 24px));
  padding: 0;
  border: 0;
  background: transparent;
}
.party-live-dock .dock-line { align-items: start; gap: .5rem; }
.party-dive .party-live-dock .clock-dial {
  width: var(--party-dock-size);
  min-width: 0;
  max-width: none;
  height: var(--party-dock-size);
  place-content: center;
  gap: .14rem;
  border-radius: 50%;
  background: var(--party-room-panel);
  color: var(--party-room-coral);
}
.party-live-dock .clock-dial strong { font-size: 1.02rem; }
.party-live-dock .clock-dial small { color: #c0dded; font-size: .67rem; }
.party-live-dock .entry {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 3px .5rem;
}
.party-live-dock input {
  grid-area: 1 / 1;
  min-width: 0;
  height: var(--party-dock-size);
  padding-inline-end: 41px;
  border-color: #8bb6cf;
}
.party-live-dock input:disabled { opacity: .65; }
.party-live-dock [data-act="party-clear"] {
  grid-area: 1 / 1;
  justify-self: end;
  width: 42px;
  min-height: var(--party-dock-size);
  padding: 0;
  border: 0;
  background: transparent;
  color: #c2e6f6;
  box-shadow: none;
}
.party-live-dock .entry button[type="submit"] {
  grid-area: 1 / 2;
  min-width: clamp(61px, 10vw, 94px);
  height: var(--party-dock-size);
}
.party-live-dock .entry .bar { grid-area: 2 / 1; width: 100%; height: 4px; margin: 0; }
.party-live-dock .party-turn { padding: .16rem .28rem; background: #121a2bb0; }
.party-meter-spacer { min-height: calc(1.12rem + 4px); }
.party-turn { display: flex; justify-content: space-between; align-items: center; gap: .45rem; font-size: .9rem; color: #c4e3f7; }
.party-turn strong { color: #bbebff; font-weight: 400; font-size: 1.15rem; line-height: 1; }
.party-turn.own-turn strong { color: var(--party-room-coral); }
.party-dive .answer-dock .feedback { color: #f5deb5; line-height: 1.08; }
.party-dive .party-idle-notice {
  margin: 0;
  padding: .28rem .48rem;
  border-left: 2px solid #ffc875;
  background: #ffc87514;
  color: #ffe2ad;
  font-size: .85rem;
  line-height: 1.2;
}
.party-dive .clock-dial { border-radius: 0; min-width: 45px; max-width: 64px; text-align: center; font-size: .88rem; line-height: 1; }
.party-dive .answer-dock input { min-height: 42px; }
.party-dive .answer-dock .bar { background: #365775; }
.party-dive .answer-dock .bar b { background: #75e1ef; }
.party-dive .answer-dock .bar[data-urgent="true"] b { background: #fa8bb0; }
.party-dive .heart-meter { color: #d1ebfa; font-size: .81rem; }
.party-meter-label { display: flex; justify-content: space-between; align-items: center; gap: .24rem; line-height: 1.14; }
.party-meter-credit { color: #a7f1cf; font-size: .78rem; white-space: nowrap; }
.heart-progress { height: 4px; background: #355574; overflow: hidden; }
.heart-progress i { display: block; height: 100%; background: #f392bc; transform-origin: left; transform: scaleX(var(--heart-to, 1)); }
.heart-progress .heart-meter-fill { animation: party-meter-fill .55s ease-out var(--heart-elapsed) both; }
.heart-progress .heart-meter-earned { animation: party-meter-award .85s ease-out var(--heart-elapsed) both; }
#party-heart-meter[data-capped] :is(.party-meter-note, .party-meter-credit) { color: #f8dc9c; }
#party-heart-meter[data-capped] .heart-progress i { background: #e7be83; }
#party-heart-meter[data-frozen] :is(.party-meter-note, .party-meter-credit) { color: #a6b5c9; }
#party-heart-meter[data-frozen] .heart-progress i { background: #91a7c0; animation: none; }
.party-ring .clash-seat.gained-heart .seat-hearts { animation: party-heart-award .85s ease-out var(--heart-elapsed) both; }
.party-ring .party-popped { animation: party-pop-actor .66s ease-out var(--pop-elapsed) both; }
.party-room-controls .party-result-title { animation: party-result-arrival .39s ease-out calc(.23s + var(--result-elapsed)) both; }
@keyframes party-meter-fill { from { transform: scaleX(var(--heart-from)); } to { transform: scaleX(var(--heart-to)); } }
@keyframes party-meter-award {
  0% { transform: scaleX(var(--heart-from)); }
  40%, 57% { transform: scaleX(1); background: #b1f7d7; }
  58% { transform: scaleX(0); background: #f392bc; }
  100% { transform: scaleX(var(--heart-to)); }
}
@keyframes party-heart-award {
  22%, 65% { color: #b1f7d7; text-shadow: 0 0 7px #a5ffe1; }
}
@keyframes party-pop-actor { 0%, 56% { opacity: 0; } 100% { opacity: 1; } }
@keyframes party-result-arrival { from { opacity: .25; translate: 0 5px; } to { opacity: 1; translate: 0 0; } }
@keyframes island-float { 0%,100% { translate: 0 0; } 50% { translate: 0 -4px; } }
@keyframes island-hit { 0%,100% { translate: 0 0; } 25% { translate: -5px 0; } 75% { translate: 5px 0; } }
@keyframes party-hover { from { transform: translateY(3px) scale(.97); } to { transform: translateY(-8px) scale(1.05); } }
@keyframes party-arena-bob { from { translate: 0 3px; } to { translate: 0 -7px; } }
@keyframes party-shadow { from { opacity: .75; scale: 1; } to { opacity: .53; scale: .82; } }
@keyframes party-handoff {
  from { left: var(--puffer-from-x); top: var(--puffer-from-y); animation-timing-function: ease-out; }
  42% { left: var(--puffer-via-x); top: var(--puffer-via-y); animation-timing-function: ease-out; }
  to { left: var(--puffer-x); top: var(--puffer-y); }
}
@keyframes party-bank {
  0%, 100% { rotate: 0deg; }
  34%, 58% { rotate: var(--puffer-bank); }
}
@keyframes party-wake {
  from { translate: 0 5px; opacity: .8; }
  to { translate: 0 -26px; opacity: 0; }
}
@keyframes party-pop-spark {
  from { transform: translate(-50%, -50%) rotate(var(--spark-angle)) translateX(3px); opacity: .9; }
  to { transform: translate(-50%, -50%) rotate(var(--spark-angle)) translateX(40px) scale(.4); opacity: 0; }
}
@keyframes party-heart-loss {
  from { transform: translate(-50%, -32%); opacity: 1; }
  65% { opacity: 1; }
  to { transform: translate(-50%, -165%); opacity: 0; }
}
@media (min-width: 1051px) {
  .party-hub { padding-left: max(1rem, calc((100% - 900px) / 2)); padding-right: max(.75rem, calc((100% - 1256px) / 2)); }
}
@media (max-width: 1050px) {
  .party-discovery-grid { grid-template-columns: minmax(0, 1fr); max-width: 430px; }
  .party-hub-center { display: contents; }
  .party-hub .party-mascot { grid-row: 1; height: clamp(104px, 12.8vh, 132px); }
  .party-hub-column { grid-row: 2; }
  .party-host-group { grid-row: 3; }
}
@media (max-width: 560px) {
  .party-heading { margin-bottom: .35rem; padding-top: 30px; }
  .party-heading h2 { margin-bottom: .4rem; }
  .party-heading .kicker { font-size: .66rem; line-height: 1; }
  .party-hub-intro { margin-top: .5rem; font-size: .96rem; }
  .party-hub .party-mascot { height: 92px; }
  .party-avatar .creature { width: 32px; }
  .party-ring { width: calc(100% - 28px); }
  .party-ring-dense .clash-seat { width: 45px; }
  .party-ring .clash-seat small, .seat-answer { font-size: .71rem; }
  .seat-answer { max-width: 91px; }
  .party-room-controls, .party-dive .stage-question, .party-dive .answer-dock { width: calc(100% - 18px); }
  .party-plaque { min-width: 75px; padding-inline: .52rem; }
  .party-plaque strong { font-size: 1.42rem; }
  .party-phase-tag, .party-plaque small { font-size: .65rem; }
  .party-room-banner .party-exit { top: 49px; }
  .party-toolbar { top: max(57px, calc(env(safe-area-inset-top) + 49px)); }
  .party-lobby-title { top: max(85px, 12%); }
  .party-room-controls.party-lobby-controls { bottom: max(12px, env(safe-area-inset-bottom)); }
  .party-lobby-controls .party-rule-cell button { min-width: 24px; }
  .party-lobby-footer { justify-content: center; }
  .party-lobby-footer button { min-height: 36px; }
  .party-dive .stage-question { top: 8%; padding: .55rem .65rem; }
  .party-dive .stage-question .question { font-size: clamp(1.13rem, 5.2vw, 1.6rem); }
  .party-dive .stage-question .scope { line-height: 1.1; }
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]) .party-ring { top: 28%; height: 48%; }
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]) .party-ring-packed { top: 29%; height: 47%; }
  .party-dive .party-live-dock { bottom: max(12px, env(safe-area-inset-bottom)); }
  .party-dive .answer-dock input { min-height: 44px; }
  .party-dive .answer-dock .clock-dial { max-width: 47px; }
  .party-dive .party-live-dock .clock-dial { max-width: none; }
}
@media (max-height: 520px) {
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]) .party-ring {
    top: max(162px, 34%);
    height: max(105px, calc(100% - max(162px, 34%) - 132px));
  }
  .party-dive[data-party-phase="play"]:not(.party-practice) .stage-question { top: 73px; max-height: 104px; }
  .party-room-controls.party-lobby-controls { bottom: max(8px, env(safe-area-inset-bottom)); }
  .party-lobby-title { top: 70px; }
  .party-lobby-title p { font-size: 1.9rem; }
  .party-lobby-title h2 { font-size: .72rem; }
  .party-dive[data-party-phase="lobby"] .party-ring { top: 23%; height: 41%; }
  .party-lobby-controls .party-rule-cell { min-height: 45px; }
  .party-lobby-controls .party-start-match { min-height: 44px; }
  .party-dive .party-live-dock { bottom: max(8px, env(safe-area-inset-bottom)); }
}
@media (max-height: 450px) {
  .party-dive .answer-dock { bottom: 3px; }
}
/* Reserve actual content rows: long categories cannot cover the upper seats,
   and feedback/heart progress can grow without covering the lower seats. */
@media (min-width: 0px) {
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]):not(.party-practice) {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: max(110px, calc(env(safe-area-inset-top) + 102px)) auto minmax(0, 1fr) auto;
  }
  .party-dive[data-party-phase="play"]:not(.party-practice) .stage-question {
    position: relative;
    grid-area: 2 / 1;
    justify-self: center;
    top: auto;
    left: auto;
    transform: none;
    max-height: min(230px, 32dvh);
    margin: 0;
  }
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]):not(.party-practice) .party-ring {
    position: relative;
    grid-area: 3 / 1;
    justify-self: center;
    align-self: stretch;
    top: auto;
    left: auto;
    transform: none;
    height: auto;
    min-height: 0;
    margin: 8px 0;
  }
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]):not(.party-practice) .party-live-dock {
    position: relative;
    grid-area: 4 / 1;
    justify-self: center;
    top: auto;
    left: auto;
    bottom: auto;
    transform: none;
    margin-bottom: max(8px, env(safe-area-inset-bottom));
  }
  .party-dive[data-party-phase="countdown"]:not(.party-practice) .party-countdown {
    position: relative;
    grid-area: 2 / 1;
    justify-self: center;
    top: auto;
    left: auto;
    transform: none;
  }
}
@media (max-width: 560px) {
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]):not(.party-practice) {
    grid-template-rows: max(98px, calc(env(safe-area-inset-top) + 90px)) auto minmax(0, 1fr) auto;
  }
}
@media (min-width: 561px) and (min-height: 521px) {
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]) .party-ring[data-seats="2"] { container-type: size; }
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]) .party-ring[data-seats="2"] .clash-seat { top: 18%; }
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]) .party-ring[data-seats="2"] .clash-seat:nth-child(2) { top: 82%; }
  .party-ring[data-seats="2"] .clash-seat .creature { width: clamp(24px, 10cqh, 55px); }
  .party-ring[data-seats="2"] .clash-seat .seat-platform { height: clamp(12px, 9cqh, 47px); }
  .party-ring[data-seats="2"] .clash-seat strong { font-size: clamp(11px, 4cqh, .94rem); }
  .party-ring[data-seats="2"] .clash-seat small { font-size: clamp(9px, 3.2cqh, .77rem); }
  .party-ring[data-seats="2"] .party-puffer { width: clamp(48px, 22cqh, 119px); }
  .party-ring[data-seats="2"] .clash-seat .seat-answer {
    top: 24%;
    bottom: auto;
    left: calc(100% + 5px);
    transform: none;
  }
}
/* Tall desktop arenas keep the dock within reach and use their width before
   spending another row on a short category. Compact/keyboard rows stay intact. */
@media (min-width: 800px) and (min-height: 800px) {
  .party-dive[data-party-phase="play"]:not(.party-practice) .stage-question {
    width: min(610px, calc(100% - 260px));
  }
  .party-dive[data-party-phase="play"]:not(.party-practice) .stage-question .scope { margin-bottom: 0; }
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]):not(.party-practice) .party-live-dock {
    margin-bottom: max(74px, env(safe-area-inset-bottom));
  }
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]) .party-ring[data-seats="2"] .clash-seat:first-child {
    top: max(68px, 12%);
  }
}
@media (max-height: 520px) {
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]):not(.party-practice) {
    grid-template-rows: max(78px, calc(env(safe-area-inset-top) + 70px)) auto minmax(0, 1fr) auto;
  }
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]) .party-plaque {
    display: flex;
    align-items: center;
    gap: .3rem;
    min-width: 0;
    padding: .3rem .4rem;
  }
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]) .party-plaque strong { font-size: 1rem; }
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]) .party-plaque small { font-size: .55rem; letter-spacing: .04em; }
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]) .party-room-banner .party-exit { top: 30px; }
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]) .party-toolbar { top: max(38px, calc(env(safe-area-inset-top) + 30px)); }
  .party-dive[data-party-phase="play"]:not(.party-practice) .stage-question { max-height: 126px; }
  .party-dive[data-party-phase="play"]:not(.party-practice) .stage-question .question { font-size: 17px; }
  .party-dive[data-party-phase="play"]:not(.party-practice) .stage-question .scope {
    font-size: .7rem;
    line-height: 1.15;
    letter-spacing: .02em;
    margin-bottom: .25rem;
  }
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]) .party-ring[data-seats="2"] .clash-seat {
    top: 36%;
    left: 15%;
  }
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]) .party-ring[data-seats="2"] .clash-seat:nth-child(2) { left: 85%; }
  .party-ring[data-seats="2"] { --compact-puffer-x: 50%; --compact-puffer-from-x: 50%; }
  .party-ring[data-seats="2"][data-active-seat="0"] { --compact-puffer-x: 36%; }
  .party-ring[data-seats="2"][data-active-seat="1"] { --compact-puffer-x: 64%; }
  .party-ring[data-seats="2"][data-previous-seat="0"] { --compact-puffer-from-x: 36%; }
  .party-ring[data-seats="2"][data-previous-seat="1"] { --compact-puffer-from-x: 64%; }
  .party-dive[data-party-phase="play"] .party-ring[data-seats="2"] .party-puffer {
    --puffer-x: var(--compact-puffer-x) !important;
    --puffer-y: 50% !important;
    --puffer-from-x: var(--compact-puffer-from-x) !important;
    --puffer-from-y: 50% !important;
    --puffer-via-x: 50% !important;
    --puffer-via-y: 39% !important;
    --puffer-bank: 0deg !important;
  }
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]) .party-ring[data-seats="2"] .seat-answer {
    left: 50%;
    right: auto;
    top: calc(100% - 2px);
    bottom: auto;
    transform: translateX(-50%);
    max-width: 88px;
  }
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]) .party-ring-small-table .clash-seat {
    left: var(--short-seat-x);
    top: var(--short-seat-y);
    width: 48px;
  }
  .party-ring-small-table .clash-seat .creature { width: 12px; margin-bottom: -3px; }
  .party-ring-small-table .clash-seat .seat-platform { height: 6px; }
  .party-ring-small-table .clash-seat strong { font-size: 10px; line-height: 1; }
  .party-ring-small-table .clash-seat small { font-size: 8px; line-height: 1; }
  /* The dock and expandable answer history retain accepted answers on short tables. */
  .party-ring-small-table .seat-answer { display: none; }
  .party-dive[data-party-phase="play"] .party-ring-small-table .party-puffer {
    width: 32px;
    --puffer-x: var(--short-puffer-x) !important;
    --puffer-from-x: var(--short-puffer-from-x) !important;
    --puffer-via-x: calc((var(--short-puffer-x) + var(--short-puffer-from-x)) / 2) !important;
    --puffer-y: 50% !important;
    --puffer-from-y: 50% !important;
    --puffer-via-y: 50% !important;
    --puffer-bank: 0deg !important;
  }
  .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]):not(.party-practice) .party-ring-packed { margin-block: 12px 3px; }
  .party-ring-packed .clash-seat {
    top: calc(var(--seat-y) * 1.1 - 5%);
    height: auto;
  }
  .party-ring-packed .clash-seat .creature { width: 10px; margin-bottom: -4px; }
  .party-ring-packed .clash-seat .seat-platform { height: 5px; }
  .party-ring-packed .clash-seat strong { font-size: 9px; line-height: 1; }
  .party-ring-packed .clash-seat small { font-size: 8px; line-height: 1; }
  /* Six seats along each long edge leave four readable rows at sixteen players. */
  .party-ring[data-seats="16"] .clash-seat { left: calc(8% + var(--island) * 16.8%); top: 14%; width: 15%; }
  .party-ring[data-seats="16"] .clash-seat:nth-child(n+7):nth-child(-n+8) {
    left: 92%; top: calc(38% + (var(--island) - 6) * 24%);
  }
  .party-ring[data-seats="16"] .clash-seat:nth-child(n+9):nth-child(-n+14) {
    left: calc(92% - (var(--island) - 8) * 16.8%); top: 86%;
  }
  .party-ring[data-seats="16"] .clash-seat:nth-child(n+15):nth-child(-n+16) {
    left: 8%; top: calc(62% - (var(--island) - 14) * 24%);
  }
  .party-ring[data-seats="16"] .clash-seat .creature { width: 8px; }
  .party-ring[data-seats="16"] .clash-seat .seat-platform { height: 4px; }
  .party-ring[data-seats="16"] .clash-seat strong { font-size: 9px; }
  .party-ring[data-seats="16"] .clash-seat small { font-size: 7px; }
}
.keyboard-open .party-dive .party-ring { display: none; }
.keyboard-open .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]):not(.party-practice) { display: block; }
.keyboard-open .party-dive[data-party-phase="play"]:not(.party-practice) .stage-question {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.keyboard-open .party-dive:is([data-party-phase="play"], [data-party-phase="countdown"]):not(.party-practice) .party-live-dock {
  position: absolute;
  left: 50%;
  bottom: 3px;
  transform: translateX(-50%);
  margin-bottom: 0;
}
.keyboard-open .party-dive .stage-question { top: 45px; }
.keyboard-open .party-dive .answer-dock { bottom: 3px; }
.keyboard-open .party-drawer { bottom: 8px; }
.keyboard-open .party-dive[data-party-phase="play"] :is(.party-room-banner, .party-toolbar) { display: none; }
.reduce-motion :is(.party-puffer, .party-puffer > i, .party-mascot::after, .party-ring .clash-seat),
.low-power :is(.party-puffer, .party-puffer > i, .party-mascot::after, .party-ring .clash-seat) { animation: none !important; }
.reduce-motion .party-pop-burst, .low-power .party-pop-burst,
.reduce-motion .party-ring .party-puffer::before, .low-power .party-ring .party-puffer::before { display: none; }
.reduce-motion .party-ring .creature, .low-power .party-ring .creature { animation: none; }
.reduce-motion :is(.heart-progress i, .gained-heart .seat-hearts, .party-result-title),
.low-power :is(.heart-progress i, .gained-heart .seat-hearts, .party-result-title) { animation: none !important; }
@media (prefers-reduced-motion: reduce) {
  .party-puffer, .party-puffer > i, .party-mascot::after, .party-ring .clash-seat, .party-ring .creature { animation: none !important; }
  .party-pop-burst, .party-ring .party-puffer::before { display: none; }
  .heart-progress i, .gained-heart .seat-hearts, .party-result-title { animation: none !important; }
}
.party-ranked .party-rating, .party-room-controls .party-rating { color: #a8eaff; margin: .25rem 0; }
.party-rating strong { color: #ffe4a2; font-size: 1.4em; }
.party-queue-actions, .party-brackets { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .32rem; }
.party-queue-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.party-queue-actions > button { margin: 0; min-width: 0; padding-inline: .15rem; }
.party-bracket-size { color: #afc9dd; text-align: center; }
.party-ranked .party-bracket { padding: .25rem .1rem; min-height: 43px; margin: .15rem 0; }
.party-bracket[aria-pressed="true"] { background: #89def1; color: #14263b; border-color: #b7f4ff; }
.party-ranked-record { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .2rem .75rem; margin: .5rem 0; color: #b7cee0; font-size: .9rem; }
.party-ranked-record strong { color: #ffe4a2; }
.party-ranked-details { margin-top: .8rem; border-top: 1px solid #355872; }
.party-ranked-details > summary { min-height: 44px; padding: .65rem 0; cursor: pointer; color: #a8eaff; }
.party-ranked-details-body { display: grid; gap: .45rem; }
.party-ranked-details h4 { margin: .35rem 0 0; color: #d9ecff; font-size: .9rem; }
.party-ranked-details p { margin: 0; }
.party-rarity, .party-ranked-badges, .party-ranked-history { list-style: none; margin: 0; padding: 0; }
.party-rarity li, .party-ranked-badges li, .party-ranked-history li {
  display: flex;
  justify-content: space-between;
  gap: .25rem .5rem;
  padding: .4rem .45rem;
  border-bottom: 1px solid #2d4e67;
  font-size: .82rem;
}
.party-rarity li { flex-wrap: wrap; }
.party-rarity i {
  width: 100%;
  height: 3px;
  background: linear-gradient(90deg, var(--tier-light, #89def1) var(--rarity-share), #263d55 var(--rarity-share));
}
.party-ranked-badges li { color: #a7bdcf; }
.party-ranked-badges .earned { color: #ffe4a2; }
.party-ranked-history { max-height: 16rem; overflow: auto; }
.party-ranked-history li > :last-child { text-align: right; }
.party-ranked-history small { display: block; color: #a7bdcf; }