

.pr-game-picker { display: grid; grid-template-columns: repeat(5,1fr); gap: 14px; margin-bottom: 34px; border: 0; padding: 0; }
.pr-game-choice { display: block; position: relative; cursor: pointer; min-width: 0; }
.pr-game-choice input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.pr-game-choice>span { display: flex; flex-direction: column; align-items: center; text-align: center; min-height: 166px; padding: 17px 10px; border: 2px solid #d9ddd9; border-radius: 18px; background: #fffefa; color: var(--vd-ink); position: relative; transition: transform 140ms, background 140ms; }
.pr-game-choice b { display: grid; place-items: center; height: 53px; width: 58px; font-size: 39px; color: var(--party-ink); font-weight: 700; margin-bottom: 13px; line-height: 1; }
.pr-game-choice strong { font-size: 16px; font-weight: 650; line-height: 1.2; }
.pr-game-choice small { font-size: 12px; color: var(--vd-muted); margin-top: 6px; }
.pr-game-choice i { display: none; position: absolute; right: 10px; top: 8px; font-style: normal; font-weight: 700; }
.pr-game-choice input:checked+span { background: var(--party-accent); color: var(--vd-ink); border-color: color-mix(in srgb,var(--party-accent) 50%,#263b58); box-shadow: 0 8px 24px #263b580c; transform: translateY(-4px); }
.pr-game-choice input:checked+span b, .pr-game-choice input:checked+span small { color: var(--vd-ink); }
.pr-game-choice input:checked+span i { display: block; }
.pr-game-choice input:focus-visible+span { outline: 3px solid #486baf; outline-offset: 3px; }

.pr-wide { width: 100%; }
.pr-footnote { font-size: 12px; color: var(--vd-muted); line-height: 1.7; text-align: center; margin: 15px 0 0; }

.pr-room { --party-accent: #f3b59b; --party-ink: color-mix(in srgb, var(--party-accent) 25%, #263b58); max-width: 1320px; margin: auto; padding: 0 34px 30px; min-height: 100dvh; }
.pr-room-header { display: flex; justify-content: space-between; align-items: center; gap: 20px; min-height: 85px; border-bottom: 1px solid #263b5818; }
.pr-room-tag { display: flex; align-items: center; gap: 10px; font-size: 12px; letter-spacing: 1.7px; color: var(--vd-muted); white-space: nowrap; }
.pr-room-tag strong { color: var(--vd-ink); letter-spacing: 2px; font-size: 16px; background: #eeece3; border: 1px solid #deded5; padding: 9px 13px; border-radius: 8px; }
.pr-game-label { font-size: 15px; font-weight: 800; color: var(--party-ink); text-transform: uppercase; letter-spacing: 1px; }
.pr-connection { margin: 0; min-height: 31px; padding-top: 9px; color: var(--vd-muted); font-size: 12px; }
.pr-connection::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 100%; background: var(--vd-lime); margin-right: 7px; }
.pr-room.is-offline .pr-connection { color: var(--vd-coral); }
.pr-room.is-offline .pr-connection::before { background: var(--vd-coral); }

.pr-qr { background: white; border-radius: 13px; padding: 12px; width: 210px; aspect-ratio: 1; margin: 8px auto 20px; }
.pr-qr svg { display: block; width: 100%; height: auto; }
.pr-code-label { font-size: 12px; font-weight: 650; letter-spacing: 1.7px; }
.pr-room-code { display: block; font-size: 41px; letter-spacing: 6px; line-height: 1.4; font-weight: 700; }

.pr-avatar { display: grid; place-items: center; border: 1px solid #263b5818; background: #e9d49b; color: var(--vd-ink); width: 45px; height: 45px; border-radius: 15px; font-weight: 700; font-size: 19px; flex-shrink: 0; box-shadow: 0 8px 24px #263b580c; transform: none; }
.pr-avatar.pr-team-1, .pr-team-1 .pr-avatar { background: var(--vd-lavender); transform: none; }

.pr-team-picker { display: flex; gap: 5px; }
.pr-team-choice { display: grid; place-items: center; min-height: 44px; padding: 8px 10px; border: 1px solid #d8dedb; border-radius: 8px; font-size: 12px; color: var(--vd-muted); cursor: pointer; text-align: center; }
.pr-team-choice.is-selected { color: var(--vd-ink); background: #ece9df; cursor: default; }
.pr-team-label { color: var(--vd-muted); font-size: 12px; }
.pr-waiting-note { text-align: center; color: var(--vd-muted); border: 1px dashed #d5d5ca; border-radius: 13px; padding: 17px; margin: 24px 0; font-size: 14px; line-height: 1.6; }

.pr-rules summary, .pr-host-options summary { display: flex; justify-content: space-between; align-items: center; min-height: 44px; font-size: 13px; font-weight: 700; cursor: pointer; }
.pr-rules p, .pr-host-options p { font-size: 12px; line-height: 1.7; color: var(--vd-muted); margin: 12px 0; }

.pr-phone-game { max-width: 620px; margin: 7px auto 30px; }
.pr-scoreboard { display: flex; gap: 12px; margin: 10px auto 24px; width: 100%; }
.pr-score { background: #fffefa; border: 2px solid #deded5; border-radius: 14px; padding: 14px 17px; display: flex; align-items: center; gap: 12px; flex: 1; min-width: 0; }
.pr-score-token { color: var(--vd-action); font-size: 28px; line-height: 1; }
.pr-team-1 .pr-score-token { color: var(--vd-lavender); }
.pr-score>span:nth-child(2) { font-size: 14px; font-weight: 800; flex: 1; overflow-wrap: anywhere; }
.pr-score>span>small { display: block; margin-top: 5px; font-size: 12px; letter-spacing: 1px; color: var(--vd-muted); }
.pr-score>strong { font-size: 33px; font-weight: 700; color: var(--vd-action); white-space: nowrap; line-height: 1; font-variant-numeric: tabular-nums; }
.pr-score.pr-team-1>strong { color: var(--vd-lavender); }
.pr-score>strong>small { font-size: 12px; color: var(--vd-muted); }
.pr-score.is-current { border-color: var(--vd-action); }
.pr-score.pr-team-1.is-current { border-color: var(--vd-lavender); }
.pr-stage-card { text-align: center; padding: 22px 8px 28px; }
.pr-stage-card .vd-eyebrow { justify-content: center; margin: 0 0 22px; line-height: 1.6; }
.pr-stage-symbol { display: grid; place-items: center; width: 118px; height: 118px; margin: 5px auto 27px; font-size: 72px; font-weight: 700; background: var(--party-accent); color: var(--vd-ink); border: 1px solid #dddcd1; border-radius: 32px; transform: rotate(-7deg); box-shadow: 0 8px 24px #263b580c; }
.pr-stage-card h1 { font-size: clamp(42px,5vw,64px); line-height: 1.01; letter-spacing: -2px; margin: 0 0 22px; overflow-wrap: anywhere; }
.pr-stage-card>p:not(.vd-eyebrow) { font-size: 15px; line-height: 1.6; color: var(--vd-muted); max-width: 400px; margin-left: auto; margin-right: auto; }
.pr-stage-card>.pr-move { max-width: 380px; margin: 30px auto 0; }
.pr-turn-topline, .pr-sketch-topline { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 18px 0; }
.pr-turn-topline .vd-eyebrow { margin: 0 0 7px; font-size: 12px; }
.pr-turn-topline>div:first-child { min-width: 0; }
.pr-turn-topline strong { font-size: 20px; font-weight: 650; display: block; overflow-wrap: anywhere; }
.pr-turn-topline>div>span { font-size: 12px; color: var(--party-ink); margin-top: 7px; display: block; }
.pr-clock { display: flex; flex-direction: column; align-items: center; justify-content: center; min-width: 80px; flex-shrink: 0; }
.pr-clock>strong { font-size: 61px; font-weight: 750; letter-spacing: -3px; color: var(--party-ink); line-height: 1; font-variant-numeric: tabular-nums; }
.pr-clock>span { margin-top: 5px; font-size: 12px; letter-spacing: 2px; color: var(--vd-muted); }
.pr-timer-track { height: 7px; background: #e7e5dd; border-radius: 8px; overflow: hidden; margin: 0 0 18px; }
.pr-timer-track>span { height: 100%; display: block; background: var(--party-accent); transform-origin: left; transition: transform .2s linear; }
.is-urgent .pr-clock>strong { color: var(--vd-coral); }
.is-urgent .pr-timer-track>span { background: var(--vd-coral); }
.pr-secret-card { background: var(--vd-paper); color: var(--vd-ink); border: 1px solid #dddcd1; box-shadow: 0 8px 24px #263b580c; border-radius: 22px; text-align: center; padding: 32px 23px; min-height: 265px; display: flex; flex-direction: column; justify-content: center; }
.pr-secret-card .vd-eyebrow { color: #726779; justify-content: center; font-size: 12px; letter-spacing: 1.4px; margin: 0 0 23px; }
.pr-secret-card h1 { font-size: clamp(31px,5vw,46px); font-weight: 700; line-height: 1.08; letter-spacing: -1.5px; overflow-wrap: anywhere; margin: 0; }
.pr-secret-card>p:last-child { font-size: 12px; color: #655968; margin-top: 24px; line-height: 1.6; }
.pr-scoring-actions { display: grid; grid-template-columns: 1fr 1.2fr; gap: 12px; margin: 20px 0 0; }
.pr-scoring-actions .vd-button { width: 100%; min-height: 63px; font-size: 19px; }
.pr-finish-form { text-align: center; margin-top: 13px; }
.pr-quiet-button { min-height: 44px; padding: 10px; text-decoration: underline; text-underline-offset: 4px; font-size: 12px; color: var(--vd-muted); cursor: pointer; }
.pr-danger { color: var(--vd-coral); }
.pr-clock-warning { padding: 12px; font-size: 14px; color: var(--vd-coral); text-align: center; }
.pr-forbidden-list { display: flex; flex-direction: column; gap: 8px; margin-top: 24px; }
.pr-forbidden-list>span { font-size: 12px; letter-spacing: 1.8px; color: #786773; font-weight: 800; margin-bottom: 4px; }
.pr-forbidden-list>strong { font-size: 20px; color: #a52d4d; font-weight: 750; text-decoration: line-through; text-decoration-thickness: 2px; text-decoration-color: #e7849655; }
.pr-word-hand { background: var(--vd-paper); color: var(--vd-ink); border: 1px solid #dddcd1; border-radius: 19px; padding: 20px 15px 9px; box-shadow: 0 8px 24px #263b580c; }
.pr-word-hand>.vd-eyebrow { color: #655868; font-size: 12px; justify-content: center; letter-spacing: 1px; margin-bottom: 14px; }
.pr-word-row { display: flex; gap: 10px; align-items: center; min-height: 77px; border-top: 1px solid #17132b20; }
.pr-word-number { font-size: 12px; color: #7f7484; }
.pr-word-row>strong { flex: 1; font-size: 20px; line-height: 1.1; font-weight: 650; overflow-wrap: anywhere; min-width: 0; }
.pr-word-buttons { display: flex; gap: 5px; }
.pr-word-buttons button { min-width: 44px; min-height: 49px; border: 2px solid var(--vd-ink); border-radius: 9px; font-size: 24px; font-weight: 800; cursor: pointer; }
.pr-word-skip { background: transparent; }
.pr-word-correct { background: #a8dca6; }
.pr-word-result { width: 83px; text-align: center; color: #286847; font-size: 27px; font-weight: 700; }
.pr-word-row.is-correct>strong, .pr-word-row.is-skip>strong { opacity: .45; text-decoration: line-through; }
.pr-word-row.is-skip .pr-word-result { color: #8b7886; }
.pr-word-pips { display: flex; gap: 8px; justify-content: center; margin: 24px 0 0; }
.pr-word-pips>span { border: 2px solid #675777; color: var(--vd-muted); border-radius: 11px; display: grid; place-items: center; width: 37px; height: 42px; font-size: 16px; font-weight: 650; }
.pr-word-pips>.is-correct { background: var(--vd-lime); color: var(--vd-ink); border-color: var(--vd-action); }
.pr-word-pips>.is-skip { opacity: .45; }
.pr-turn-total { font-size: 126px!important; color: var(--party-ink); letter-spacing: -8px!important; }
.pr-turn-total>span { display: block; font-size: 16px; font-weight: 600; color: var(--vd-muted); letter-spacing: 0; margin-top: 17px; }
.pr-room-footer { max-width: 620px; margin: 20px auto 0; border-top: 1px solid var(--vd-line); padding-top: 12px; }
.pr-end-link { min-height: 44px; display: flex; align-items: center; justify-content: center; margin-top: 23px; font-size: 13px; }
.pr-room button:disabled { opacity: .4; cursor: wait; transform: none; }
.pr-room button:not(:disabled):active { transform: translateY(2px); }
.pr-drawing { background: #fffaf0; border: 1px solid #dddcd1; border-radius: 18px; overflow: hidden; margin-top: 18px; color: var(--vd-ink); box-shadow: 0 8px 24px #263b580c; }
.pr-drawing-heading { display: flex; justify-content: space-between; align-items: center; padding: 12px 15px; border-bottom: 1px solid #17132b1f; font-size: 12px; letter-spacing: 1px; font-weight: 650; }
.pr-live-badge { color: #296a52; font-size: 12px; display: inline-flex; gap: 5px; align-items: center; }
.pr-live-badge::before { content: ""; width: 5px; height: 5px; border-radius: 100%; background: #296a52; }
.pr-drawing canvas { width: 100%; aspect-ratio: 8/5; display: block; }
.pr-drawing.is-editable canvas { touch-action: none; cursor: crosshair; }
.pr-drawing-tools { display: flex; align-items: center; gap: 9px; padding: 6px 13px; }
.pr-ink { background: var(--ink); border: 4px solid #fffaf0; outline: 1px solid #cfc6c3; border-radius: 100%; width: 39px; height: 39px; cursor: pointer; }
.pr-ink[aria-pressed=true] { outline: 3px solid var(--vd-ink); }
.pr-clear { min-height: 44px; padding: 9px; font-size: 12px; margin-left: auto; font-weight: 750; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.pr-drawing-status { min-height: 28px; padding: 5px 14px 10px; font-size: 12px; color: #78697a; margin: 0; }
.pr-sketch-secret { min-height: 0; padding: 18px; border-radius: 15px; }
.pr-sketch-secret .vd-eyebrow { margin-bottom: 10px; }
.pr-sketch-secret h1 { font-size: 26px; }
.pr-sketch-secret>p:last-child { display: none; }
.pr-card-table { position: relative; display: flex; justify-content: center; align-items: center; gap: 0; min-height: 315px; padding: 10px 35px; }
.pr-playing-card, .pr-card-back { width: 176px; height: 245px; border: 1px solid #dddcd1; border-radius: 20px; box-shadow: 0 8px 24px #263b580c; position: relative; background: var(--vd-paper); color: var(--vd-ink); flex-shrink: 0; transform: rotate(-8deg); z-index: 2; }
.pr-playing-card>span, .pr-playing-card>i { position: absolute; left: 15px; top: 12px; font-weight: 650; font-size: 25px; line-height: .95; font-style: normal; text-align: center; }
.pr-playing-card small { display: block; font-size: 19px; margin-top: 6px; }
.pr-playing-card>i { left: auto; top: auto; right: 15px; bottom: 12px; transform: rotate(180deg); }
.pr-playing-card>strong { display: grid; place-items: center; height: 100%; font-size: 95px; }
.pr-playing-card.is-red { color: #cb4c4d; }
.pr-card-back { background: repeating-linear-gradient(45deg,#8575d6 0 8px,#9b8ae6 8px 16px); transform: rotate(10deg); margin-left: -30px; margin-top: -22px; display: grid; place-items: center; z-index: 1; border: 10px solid var(--vd-paper); outline: 3px solid #080510; }
.pr-card-back>span { background: var(--vd-paper); color: var(--vd-ink); width: 85px; height: 85px; border: 1px solid #dddcd1; border-radius: 100%; display: grid; place-items: center; font-size: 59px; font-weight: 700; }
.pr-card-stats { display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 15px 0; }
.pr-card-stats>span { font-size: 12px; letter-spacing: 1px; color: var(--vd-muted); }
.pr-card-stats>span>strong { font-size: 29px; display: block; color: var(--party-ink); letter-spacing: -1px; }
.pr-card-stats>.pr-lives { font-size: 30px; color: var(--vd-coral); letter-spacing: 3px; }
.pr-lives>i { opacity: .5; font-style: normal; }
.pr-card-result { text-align: center; color: var(--party-ink); font-size: 13px; line-height: 1.6; min-height: 21px; }
.pr-call-title { text-align: center; font-size: 34px; letter-spacing: -1.5px; margin: 25px 0 0; }
.pr-display { max-width: none; padding: 3vh 5vw 3vh; display: flex; flex-direction: column; background: var(--vd-paper); }
.pr-display .pr-room-header { min-height: 65px; }
.pr-display .pr-connection { min-height: 25px; font-size: 12px; }
.pr-display>.pr-scene { flex: 1; display: flex; flex-direction: column; }
.pr-display-lobby { display: grid; grid-template-columns: 1fr 360px; gap: 6vw; align-items: center; flex: 1; padding: 35px 0; }
.pr-display-welcome h1 { font-size: clamp(52px,5.5vw,88px); line-height: .92; letter-spacing: -3px; max-width: 800px; margin: 32px 0 25px; color: var(--party-ink); position: relative; padding-right: 60px; }
.pr-display-welcome>p { font-size: 24px; color: var(--vd-muted); }
.pr-display-guests { display: flex; flex-wrap: wrap; gap: 14px; margin: 36px 0 26px; max-width: 850px; }
.pr-guest-chip { display: grid; grid-template-columns: 45px auto; align-items: center; column-gap: 12px; row-gap: 4px; border: 2px solid #deded5; background: #fffefa; border-radius: 14px; padding: 12px 18px 12px 12px; min-width: 160px; }
.pr-guest-chip .pr-avatar { grid-row: span 2; }
.pr-guest-chip strong { font-size: 20px; overflow-wrap: anywhere; max-width: 250px; }
.pr-guest-chip small { font-size: 12px; letter-spacing: 1.5px; color: var(--vd-muted); }
.pr-display-welcome>.pr-lobby-count { font-size: 16px; }
.pr-lobby-count strong { color: var(--vd-action); }
.pr-lobby-count span { margin-left: 8px; }
.pr-display-invite { background: var(--vd-paper); color: var(--vd-ink); padding: 30px 24px 22px; text-align: center; border-radius: 24px; border: 1px solid #dddcd1; box-shadow: 0 8px 24px #263b580c; }
.pr-display-invite .pr-qr { width: 270px; max-width: 100%; margin: 20px auto 16px; padding: 10px; }
.pr-display-invite .pr-room-code { font-size: 43px; letter-spacing: 5px; }
.pr-display-invite>p { font-size: 13px; margin: 11px 0 23px; font-weight: 700; overflow-wrap: anywhere; }
.pr-display-footer { display: flex; justify-content: space-between; gap: 16px; padding-top: 19px; margin-top: 15px; border-top: 1px solid #263b5818; color: var(--vd-muted); font-size: 12px; font-weight: 650; letter-spacing: 1.7px; line-height: 1.5; }
.pr-display .pr-scoreboard { max-width: 1050px; margin: 22px auto 16px; }
.pr-display .pr-score { padding: 16px 24px; }
.pr-display .pr-score>span:nth-child(2) { font-size: 23px; }
.pr-display .pr-score>strong { font-size: 48px; }
.pr-display .pr-score>strong>small { font-size: 15px; }
.pr-display .pr-score-token { font-size: 38px; }
.pr-display-stage { display: grid; grid-template-columns: 1fr .38fr; gap: 4vw; flex: 1; align-items: center; padding: 23px 0 15px; }
.pr-performance { background: var(--party-accent); color: var(--vd-ink); border: 1px solid #dddcd1; box-shadow: 0 8px 24px #263b580c; border-radius: 32px; min-height: 420px; padding: 35px; position: relative; overflow: hidden; }
.pr-performance .vd-eyebrow { color: var(--vd-ink); opacity: .75; margin-bottom: 32px; font-size: 12px; }
.pr-performance h1 { font-size: clamp(48px,5.1vw,89px); letter-spacing: -3.5px; line-height: 1.01; max-width: 80%; position: relative; z-index: 2; margin: 0 0 22px; overflow-wrap: anywhere; }
.pr-performance>p { font-size: 18px; max-width: 66%; position: relative; z-index: 2; }
.pr-performance-score { display: inline-block; margin-top: 31px; font-size: 32px; font-weight: 700; border: 2px solid var(--vd-ink); border-radius: 10px; padding: 10px 14px; background: var(--vd-paper); transform: rotate(-3deg); }
.pr-performance-score small { font-size: 12px; letter-spacing: 1px; margin-left: 5px; }
.pr-stage-illustration { position: absolute; right: -18px; bottom: -10px; width: 43%; transform: rotate(-7deg); opacity: .9; border-radius: 30px; overflow: hidden; }
.pr-stage-illustration .vd-game-illustration { height: 200px; }
.pr-stage-illustration .vd-art-caption { display: none; }
.pr-display-clock { aspect-ratio: 1; width: 100%; max-width: 315px; margin: auto; border: 3px solid var(--party-accent); border-radius: 100%; box-shadow: 0 8px 24px #263b580c; background: #fffefa; }
.pr-display-clock>strong { font-size: clamp(90px,9vw,172px); letter-spacing: -7px; }
.pr-display-clock>span { font-size: 12px; letter-spacing: 3px; }
.pr-round-stamp { color: var(--vd-ink); background: var(--vd-lime); width: 260px; max-width: 100%; aspect-ratio: 1; clip-path: polygon(50% 0%,61% 13%,77% 4%,81% 23%,98% 25%,91% 43%,100% 56%,83% 66%,86% 85%,67% 87%,55% 100%,43% 88%,25% 95%,21% 77%,3% 72%,11% 54%,0% 39%,17% 29%,16% 10%,36% 14%); display: flex; flex-direction: column; align-items: center; justify-content: center; transform: rotate(9deg); margin: auto; }
.pr-round-stamp strong { font-size: 84px; line-height: 1; letter-spacing: -5px; font-weight: 750; }
.pr-round-stamp span { font-size: 12px; letter-spacing: 1px; font-weight: 700; margin-top: 15px; }
.pr-board-topline { display: flex; justify-content: space-between; gap: 20px; align-items: center; margin: 12px 0 18px; }
.pr-board-topline .vd-eyebrow { margin: 0 0 8px; font-size: 12px; }
.pr-board-topline h1 { font-size: clamp(31px,3vw,53px); line-height: 1.1; letter-spacing: -1.5px; }
.pr-turn-gain { display: flex; align-items: center; gap: 12px; color: var(--vd-action); font-size: 51px; font-weight: 700; white-space: nowrap; }
.pr-turn-gain small { font-size: 12px; color: var(--vd-muted); letter-spacing: 1px; max-width: 35px; white-space: normal; line-height: 1.5; }
.pr-board-layout { display: grid; grid-template-columns: 1fr .32fr; gap: 3vw; flex: 1; align-items: center; }
.pr-race-board { background: var(--vd-paper); color: var(--vd-ink); border: 1px solid #dddcd1; box-shadow: 0 8px 24px #263b580c; border-radius: 26px; position: relative; overflow: hidden; }
.pr-board-heading { position: absolute; top: 19px; left: 28px; right: 27px; display: flex; align-items: center; justify-content: space-between; }
.pr-board-heading>span:first-child { font-size: 12px; font-weight: 650; letter-spacing: 1.5px; }
.pr-board-heading>strong { font-size: 21px; font-weight: 700; letter-spacing: -.6px; }
.pr-board-heading>.pr-finish-flag { font-size: 32px; line-height: 1; }
.pr-board-track { width: 100%; display: block; }
.pr-board-space circle { fill: #fffaf0; stroke: #b5a8c4; stroke-width: 2; }
.pr-board-space text { fill: #665778; font-size: 17px; font-weight: 800; }
.pr-board-space.is-finish circle { fill: var(--vd-ink); stroke: var(--vd-ink); }
.pr-board-space.is-finish text { fill: var(--vd-paper); }
.pr-board-token circle, .pr-board-token rect { fill: var(--vd-lime); stroke: #17132b; stroke-width: 4; }
.pr-board-token.pr-team-1 circle, .pr-board-token.pr-team-1 rect { fill: var(--vd-lavender); }
.pr-board-token .pr-token-halo { fill: none!important; stroke: none; }
.pr-board-token.is-current .pr-token-halo { stroke: #17132b70; stroke-width: 2; stroke-dasharray: 4 5; }
.pr-board-token text { fill: var(--vd-ink); font-weight: 700; font-size: 22px; }
.pr-board-side .pr-word-pips { flex-wrap: wrap; }
.pr-board-side .pr-display-clock { max-width: 280px; }
.pr-board-side .pr-display-clock>strong { font-size: clamp(90px,8vw,140px); }
.pr-sketch-topline { margin: 12px 0; }
.pr-sketch-topline .vd-eyebrow { margin-bottom: 8px; font-size: 12px; }
.pr-sketch-topline h1 { font-size: clamp(32px,3.2vw,55px); line-height: 1.1; letter-spacing: -1.5px; }
.pr-display.pr-game-sketch-club .pr-drawing { flex: 1; display: flex; flex-direction: column; margin-top: 5px; min-height: 0; }

.pr-display.pr-game-sketch-club .pr-drawing-heading { font-size: 12px; padding: 11px 21px; }
.pr-display.pr-game-sketch-club .pr-drawing-status { padding-left: 21px; }
.pr-highlow-stage { display: grid; grid-template-columns: 1fr 1.05fr; align-items: center; gap: 4vw; flex: 1; padding: 25px 0; }
.pr-highlow-copy h1 { font-size: clamp(62px,6vw,110px); letter-spacing: -4px; line-height: .95; color: var(--party-ink); overflow-wrap: anywhere; }
.pr-highlow-copy>p:not(.vd-eyebrow) { font-size: 27px; margin-top: 25px; text-align: left; }
.pr-highlow-copy .pr-card-stats { max-width: 370px; margin: 35px 0 0; }
.pr-highlow-copy .pr-card-stats>span>strong { font-size: 70px; }
.pr-highlow-copy .pr-card-stats>.pr-lives { font-size: 50px; }
.pr-display .pr-card-table { min-height: 530px; }
.pr-display .pr-playing-card, .pr-display .pr-card-back { width: 250px; height: 365px; border-radius: 25px; }
.pr-display .pr-playing-card>strong { font-size: 144px; }
.pr-display .pr-playing-card>span, .pr-display .pr-playing-card>i { font-size: 37px; padding: 5px; }
.pr-display .pr-playing-card small { font-size: 28px; }
.pr-display .pr-card-back { margin-left: -40px; margin-top: -38px; }
.pr-display .pr-card-back>span { width: 120px; height: 120px; font-size: 60px; }
.pr-display .pr-end-card { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.pr-display .pr-end-card h1 { font-size: clamp(60px,7vw,120px); }

.pr-code-input { text-transform: uppercase; font-weight: 650; letter-spacing: 4px; }

@keyframes party-scene-in { from { opacity: .35; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@media(min-width:1600px) {
  .pr-display .pr-room-header { min-height: 83px; }
  .pr-display .vd-brand { font-size: 33px; }
  .pr-display .pr-game-label { font-size: 20px; }
  .pr-display .pr-room-tag { font-size: 12px; }
  .pr-display .pr-room-tag strong { font-size: 22px; }
  .pr-display-lobby { grid-template-columns: 1fr 390px; }
  .pr-display-welcome>p { font-size: 29px; }
  .pr-performance { min-height: 560px; padding: 50px; }
  .pr-performance>p { font-size: 24px; }
  .pr-performance-score { margin-top: 45px; font-size: 43px; }
  .pr-stage-illustration .vd-game-illustration { transform: scale(1.4); }
  .pr-board-heading { top: 27px; }
  .pr-board-heading>strong { font-size: 28px; }
  .pr-board-heading>span:first-child { font-size: 12px; }
  .pr-display .pr-scoreboard { max-width: 1200px; }
  .pr-display .pr-score>strong { font-size: 62px; }
  .pr-display .pr-score>span:nth-child(2) { font-size: 28px; }
  .pr-display .pr-score>span>small { font-size: 12px; }
  .pr-display-footer { font-size: 12px; }
}
@media(max-width:1050px) {
  
  .pr-team-picker { flex-wrap: wrap; }
  .pr-display-lobby { grid-template-columns: 1fr 300px; gap: 4vw; }
  .pr-display-welcome h1 { font-size: 52px; padding-right: 0; }
  .pr-display-invite { padding: 22px 18px; }
  .pr-display-invite .pr-qr { width: 240px; }
  .pr-display-invite .pr-room-code { font-size: 33px; }
  .pr-performance { min-height: 370px; padding: 25px; }
  .pr-performance h1 { font-size: 49px; max-width: 100%; }
  .pr-performance>p { max-width: 75%; font-size: 16px; }
  .pr-display-clock>strong { font-size: 88px; }
  .pr-board-heading>strong { font-size: 17px; }
  .pr-board-heading>span:first-child { font-size: 12px; }
}
@media(max-width:700px) {
  
  
  
  
  .pr-game-picker { grid-template-columns: repeat(6,1fr); gap: 10px; margin-bottom: 24px; }
  .pr-game-choice { grid-column: span 2; }
  .pr-game-choice:nth-of-type(n+4) { grid-column: span 3; }
  .pr-game-choice>span { min-height: 118px; padding: 12px 7px; border-radius: 13px; }
  .pr-game-choice b { font-size: 27px; height: 32px; margin-bottom: 11px; }
  .pr-game-choice strong { font-size: 12px; }
  .pr-game-choice small { font-size: 12px; }
  .pr-game-choice i { font-size: 12px; right: 7px; top: 5px; }
  
  
  
  
  
  
  .pr-room { padding: 0 19px max(22px,env(safe-area-inset-bottom)); }
  .pr-room-header { min-height: 70px; gap: 12px; }
  .pr-room-header .vd-brand { font-size: 22px; }
  .pr-room-header .vd-brand-mark { font-size: 30px; }
  .pr-room-tag { font-size: 12px; letter-spacing: 1px; gap: 6px; }
  .pr-room-tag strong { font-size: 12px; letter-spacing: 1.5px; padding: 8px; }
  .pr-connection { font-size: 12px; min-height: 30px; }
  
  
  
  
  
  
  
  .pr-code-label { font-size: 12px; letter-spacing: 1px; }
  .pr-room-code { font-size: 27px; letter-spacing: 2.4px; line-height: 1.7; }
  
  
  
  
  
  
  .pr-avatar { width: 40px; height: 40px; border-radius: 13px; }
  .pr-team-picker { gap: 4px; }
  .pr-team-choice { font-size: 12px; padding: 7px; }
  .pr-scoreboard { gap: 9px; margin: 7px auto 23px; }
  .pr-score { padding: 12px; gap: 8px; flex-wrap: wrap; }
  .pr-score-token { font-size: 19px; }
  .pr-score>span:nth-child(2) { font-size: 12px; }
  .pr-score>span>small { font-size: 12px; letter-spacing: .6px; }
  .pr-score>strong { font-size: 30px; }
  .pr-score>strong>small { font-size: 12px; }
  .pr-stage-card { padding: 16px 0 24px; }
  .pr-stage-card h1 { font-size: 43px; }
  .pr-stage-card>p:not(.vd-eyebrow) { font-size: 14px; }
  .pr-stage-symbol { width: 100px; height: 100px; border-radius: 28px; font-size: 61px; margin: 15px auto 28px; }
  .pr-stage-card .vd-eyebrow { font-size: 12px; }
  .pr-turn-topline { margin: 17px 0; }
  .pr-turn-topline strong { font-size: 18px; }
  .pr-clock { min-width: 70px; }
  .pr-clock>strong { font-size: 58px; }
  .pr-turn-topline .vd-eyebrow { font-size: 12px; letter-spacing: 1px; }
  .pr-secret-card { min-height: 259px; padding: 29px 21px; }
  .pr-secret-card h1 { font-size: 35px; }
  .pr-forbidden-list>strong { font-size: 19px; }
  .pr-scoring-actions .vd-button { font-size: 18px; }
  .pr-word-row { min-height: 72px; gap: 8px; }
  .pr-word-row>strong { font-size: 18px; }
  .pr-word-buttons { gap: 4px; }
  .pr-word-buttons button { min-width: 42px; min-height: 48px; }
  .pr-word-hand { padding: 18px 12px 7px; }
  .pr-word-hand>.vd-eyebrow { font-size: 12px; }
  .pr-sketch-secret { min-height: 0; padding: 15px; }
  .pr-sketch-secret h1 { font-size: 26px; }
  .pr-drawing-tools { gap: 8px; }
  .pr-ink { width: 35px; height: 35px; }
  .pr-clear { font-size: 12px; padding: 6px; }
  .pr-card-table { min-height: 285px; padding: 10px; }
  .pr-playing-card, .pr-card-back { width: 150px; height: 220px; }
  .pr-playing-card>strong { font-size: 60px; }
  .pr-card-back { margin-left: -22px; }
  
  
  
  .pr-display { padding: 20px; }
  .pr-display .pr-game-label { display: none; }
  .pr-display-lobby { grid-template-columns: 1fr; gap: 22px; padding: 25px 0; }
  .pr-display-welcome h1 { font-size: 57px; letter-spacing: -2.5px; margin: 27px 0 20px; }
  .pr-display-welcome>p { font-size: 18px; }
  .pr-display-guests { margin: 25px 0 20px; gap: 10px; }
  .pr-guest-chip { min-width: 140px; padding: 9px; grid-template-columns: 36px auto; column-gap: 10px; }
  .pr-guest-chip strong { font-size: 14px; }
  .pr-guest-chip .pr-avatar { width: 36px; height: 36px; }
  .pr-display-welcome>.pr-lobby-count { font-size: 12px; }
  .pr-display-invite { width: 300px; max-width: 100%; justify-self: center; }
  .pr-display-stage { grid-template-columns: 1fr; gap: 25px; }
  .pr-performance { min-height: 345px; border-radius: 22px; padding: 23px; }
  .pr-performance h1 { font-size: 44px; letter-spacing: -2px; }
  .pr-performance>p { font-size: 15px; max-width: 90%; }
  .pr-performance .vd-eyebrow { font-size: 12px; margin-bottom: 25px; }
  .pr-stage-illustration { width: 44%; opacity: .5; }
  .pr-performance-score { margin-top: 25px; font-size: 24px; }
  .pr-display-clock { max-width: 190px; }
  .pr-display-clock>strong { font-size: 100px; letter-spacing: -5px; }
  .pr-display-clock>span { font-size: 12px; }
  .pr-round-stamp { width: 190px; }
  .pr-round-stamp strong { font-size: 65px; }
  .pr-display .pr-score { padding: 12px; }
  .pr-display .pr-score>span:nth-child(2) { font-size: 13px; }
  .pr-display .pr-score>strong { font-size: 32px; }
  .pr-display .pr-score>strong>small { font-size: 12px; }
  .pr-display .pr-score-token { font-size: 22px; }
  .pr-display-footer { font-size: 12px; letter-spacing: .8px; }
  .pr-board-topline h1 { font-size: 28px; }
  .pr-board-topline .vd-eyebrow { font-size: 12px; }
  .pr-turn-gain { font-size: 35px; }
  .pr-turn-gain small { display: none; }
  .pr-board-layout { grid-template-columns: 1fr; gap: 22px; }
  .pr-race-board { border-radius: 17px; }
  .pr-board-heading { top: 9px; left: 14px; right: 14px; }
  .pr-board-heading>strong { font-size: 12px; }
  .pr-board-heading>span:first-child { font-size: 12px; letter-spacing: .7px; }
  .pr-board-heading>.pr-finish-flag { font-size: 16px; }
  .pr-board-side { display: flex; align-items: center; justify-content: center; gap: 20px; }
  .pr-board-side .pr-display-clock { width: 130px; margin: 0; }
  .pr-board-side .pr-display-clock>strong { font-size: 71px; }
  .pr-board-side .pr-word-pips { margin: 0; max-width: 140px; }
  .pr-board-side .pr-round-stamp { width: 140px; margin: 0; }
  .pr-board-side .pr-round-stamp strong { font-size: 43px; letter-spacing: -3px; }
  .pr-board-side .pr-round-stamp span { font-size: 12px; margin-top: 9px; }
  .pr-sketch-topline h1 { font-size: 27px; }
  .pr-highlow-stage { grid-template-columns: 1fr; gap: 0; }
  .pr-highlow-copy h1 { font-size: 51px; letter-spacing: -2.5px; }
  .pr-highlow-copy>p:not(.vd-eyebrow) { font-size: 20px; margin-top: 20px; }
  .pr-highlow-copy .vd-eyebrow { font-size: 12px; }
  .pr-highlow-copy .pr-card-stats { margin-top: 20px; }
  .pr-highlow-copy .pr-card-stats>span>strong { font-size: 44px; }
  .pr-highlow-copy .pr-card-stats>.pr-lives { font-size: 38px; }
  .pr-display .pr-card-table { min-height: 350px; }
  .pr-display .pr-playing-card, .pr-display .pr-card-back { width: 165px; height: 250px; }
  .pr-display .pr-playing-card>strong { font-size: 95px; }
  .pr-display .pr-playing-card>span, .pr-display .pr-playing-card>i { font-size: 24px; padding: 0; }
  .pr-display .pr-playing-card small { font-size: 19px; }
  .pr-display .pr-card-back>span { width: 75px; height: 75px; font-size: 51px; }
}
@media(prefers-reduced-motion:reduce) {
  .pr-room * { animation: none!important; transition: none!important; }
  .pr-room button:not(:disabled):active { transform: none; }
}

/* Shared room interaction and short-screen layouts. */
.pr-display.pr-game-sketch-club .pr-drawing canvas { width: auto; max-width: 100%; height: 46vh; max-height: 46vh; margin: auto; flex: none; aspect-ratio: 8/5; object-fit: contain; }
@media(min-width:701px) and (max-height:800px) { .pr-display.pr-game-sketch-club .pr-drawing canvas { height: 37vh; max-height: 37vh; } }
.pr-room h1 em { color: var(--party-ink); }
.pr-performance h1 em { color: var(--vd-ink); }
.pr-room [hidden] { display: none!important; }

.pr-display .pr-board-track { max-height: 50vh; }
@media(min-width:701px) and (max-height:800px) {
  .pr-display { padding-top: 16px; padding-bottom: 16px; }
  .pr-display .pr-room-header { min-height: 52px; }
  .pr-display .pr-connection { min-height: 24px; }
  .pr-display .pr-board-topline { margin: 8px 0 12px; }
  .pr-display .pr-board-topline h1 { font-size: 33px; }
  .pr-display .pr-board-track { max-height: 43vh; }
  .pr-display .pr-scoreboard { margin: 18px auto 9px; }
  .pr-display .pr-score { padding: 12px 20px; }
  .pr-display .pr-score>strong { font-size: 39px; }
  .pr-display .pr-performance { min-height: 355px; }
  .pr-display .pr-performance h1 { font-size: 59px; }
  .pr-display .pr-performance .vd-eyebrow { margin-bottom: 24px; }
  .pr-display .pr-performance-score { margin-top: 22px; }
  .pr-display .pr-card-table { min-height: 425px; }
  .pr-display .pr-playing-card, .pr-display .pr-card-back { width: 220px; height: 320px; }
  .pr-display .pr-display-lobby { padding: 18px 0; }
  .pr-display .pr-display-welcome h1 { font-size: 60px; }
  .pr-display .pr-display-guests { margin: 25px 0; }
  .pr-display .pr-timer-track { margin-bottom: 8px; }
  .pr-display .pr-display-footer { padding-top: 13px; margin-top: 10px; }
}
.pr-game-choice b .vd-line-icon { width: 40px; height: 40px; }

@media(max-width:700px) {
  
  
  
  
  .pr-game-choice>span { min-height: 102px; padding: 10px 7px; }
  .pr-game-choice b { height: 27px; margin-bottom: 9px; }
  .pr-game-choice b .vd-line-icon { width: 27px; height: 27px; }
  
}
.pr-room .vd-brand-mark .vd-line-icon { width: 36px; height: 36px; }
.pr-display-footer .vd-line-icon { width: 12px; height: 12px; display: inline-block; vertical-align: middle; margin-left: 6px; }

@keyframes party-card-reveal { from { transform: rotate(-8deg) rotateY(65deg) scale(.93); opacity: .3; } to { transform: rotate(-8deg) rotateY(0) scale(1); opacity: 1; } }
.pr-stage-symbol .vd-line-icon { width: 63px; height: 63px; }
.pr-word-buttons button { display: grid; place-items: center; }
.pr-word-buttons .vd-line-icon { width: 22px; height: 22px; }
.pr-word-result .vd-line-icon { width: 24px; height: 24px; margin: auto; }
.pr-word-pips .vd-line-icon { width: 18px; height: 18px; }
.pr-ink { width: 44px; height: 44px; }
@media(max-width:700px) { .pr-drawing-tools { gap: 6px; padding-left: 10px; padding-right: 10px; } .pr-clear { padding: 4px; } }

@keyframes party-guest-in { from { opacity: 0; transform: translateY(12px) scale(.94); } to { opacity: 1; transform: translateY(0) scale(1); } }
.pr-word-buttons button { min-width: 44px; }

/* Collapsible game picker keeps the selected game's setup within reach. */

.pr-game-selection { margin-bottom: 24px; background: #fffefa; border: 1px solid var(--vd-line); border-radius: 18px; overflow: hidden; }
.pr-game-selection>summary { display: flex; align-items: center; gap: 14px; padding: 12px 17px; cursor: pointer; list-style: none; }
.pr-game-selection>summary::-webkit-details-marker { display: none; }

.pr-game-selection>summary>span { min-width: 0; overflow-wrap: anywhere; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.pr-game-selection>summary small { color: var(--vd-muted); font-size: 12px; }
.pr-game-selection>summary strong { font-size: 17px; font-weight: 650; }
.pr-game-selection>summary>b { font-size: 12px; font-weight: 550; color: var(--vd-action); }
.pr-game-selection .pr-game-picker { padding: 15px; margin: 0; grid-template-columns: repeat(3,minmax(0,1fr)); }
.pr-game-selection .pr-game-choice { grid-column: auto; }
.pr-game-choice img { width: 100%; height: 76px; object-fit: cover; border-radius: 8px; margin-bottom: 10px; }
.pr-game-choice>span { min-height: 135px; }

@media(max-width:700px) {
 
 
 .pr-game-selection .pr-game-picker { padding: 10px; gap: 7px; }
 .pr-game-choice img { height: 48px; margin-bottom: 7px; }
 .pr-game-choice>span { min-height: 108px; padding: 8px 6px; }
 .pr-game-choice strong { font-size: 12px; }
 .pr-game-choice small { font-size: 12px; }
 .pr-game-selection>summary { padding: 10px 12px; gap: 11px; }
 .pr-game-selection>summary strong { font-size: 15px; }
 
 .pr-game-selection>summary>b { font-size: 12px; }
 
 
}

.pr-game-label { display: flex; align-items: center; gap: 11px; text-transform: none; letter-spacing: -.3px; font-weight: 650; }
.pr-game-label-art { width: 58px; height: 42px; border-radius: 10px; object-fit: cover; }
@media(max-width:700px) { .pr-game-label-art { display: none; } }

/* The setup form and its optional TV help share one quiet, readable column. */

.pr-game-selection { overflow: visible; }
.pr-game-selection > summary { border-radius: inherit; min-height: 72px; }
.pr-game-selection > summary b { white-space: nowrap; }
.pr-game-selection .pr-game-choice input:checked + span { transform: none; box-shadow: none; }

.pr-connection { line-height: 1.5; }
.pr-room.is-offline .pr-connection { color: #a33929; }

@media (max-width: 700px) {
  
  
  
  
  .pr-game-selection .pr-game-picker { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 12px; gap: 10px; }
  .pr-game-choice > span { padding: 10px; min-height: 124px; }
  .pr-game-choice strong { font-size: .8125rem; line-height: 1.3; }
  .pr-game-choice small { font-size: .75rem; }
  .pr-game-choice img { height: 64px; }
  .pr-game-selection > summary small { font-size: .75rem; }
  .pr-game-selection > summary strong { font-size: 1rem; line-height: 1.35; }
  .pr-game-selection > summary b { font-size: .75rem; }
  
  
  .pr-footnote { font-size: .75rem; }
  .pr-connection { font-size: .75rem; }
  .pr-code-label { font-size: .75rem; letter-spacing: .06em; }
  
  
  .pr-team-choice { font-size: .75rem; min-width: 44px; }
  
  .pr-game-selection > summary:focus-visible { outline-offset: 3px; }
}

/* Full twelve-person lobbies must still fit a 720p shared screen. */
@media (min-width: 701px) and (max-height: 800px) {
  .pr-display .pr-display-guests { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; margin: 22px 0; }
  .pr-display .pr-guest-chip { min-width: 0; grid-template-columns: 32px minmax(0, 1fr); gap: 4px 10px; padding: 10px; border-width: 1px; }
  .pr-display .pr-guest-chip strong { font-size: 16px; line-height: 1.35; }
  .pr-display .pr-guest-chip .pr-avatar { width: 32px; height: 32px; font-size: 15px; border-radius: 10px; }
}

/* A player is a browser preference; room seats keep their own identity. */
.pr-character { display: block; width: 100%; height: 100%; }
.pr-avatar.pr-avatar-character { padding: 0; border: 0; background: none; box-shadow: none; border-radius: 28%; overflow: hidden; }
.pr-profile { border: 1px solid var(--vd-line); border-radius: 18px; background: #fffefa; margin: 0; text-align: left; }
.pr-profile [hidden] { display: none !important; }
.pr-profile-summary { display: flex; align-items: center; gap: 13px; padding: 14px; min-height: 82px; list-style: none; cursor: pointer; border-radius: inherit; }
.pr-profile-summary::-webkit-details-marker { display: none; }
.pr-profile-summary:focus-visible { outline: 3px solid var(--vd-action); outline-offset: 3px; }
.pr-profile-small-avatar { width: 52px; height: 52px; flex: 0 0 52px; }
.pr-profile-who { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1; }
.pr-profile-who small { color: var(--vd-muted); font-size: .75rem; }
.pr-profile-who strong { font-size: 1.0625rem; font-weight: 650; overflow-wrap: anywhere; line-height: 1.3; }
.pr-profile-change { color: var(--vd-action); font-size: .75rem; white-space: nowrap; }
.pr-profile-fields { padding: 18px; }
.pr-profile[open]>.pr-profile-summary:not([hidden]) { border-bottom: 1px solid var(--vd-line); border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.pr-profile-fields .vd-field { margin-bottom: 0; }
.pr-profile-customize { display: grid; grid-template-columns: 94px minmax(0,1fr); align-items: center; gap: 16px; padding-top: 21px; }
.pr-profile-portrait { width: 94px; height: 94px; }
.pr-profile-tools { min-width: 0; }
.pr-profile-label { display: block; font-size: .75rem; color: var(--vd-muted); line-height: 1.45; margin-bottom: 6px; }
.pr-profile-shuffle { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 44px; padding: 8px 12px; border: 1px solid #d9d8ce; border-radius: 11px; background: #f7f5ee; color: var(--vd-ink); font-size: .8125rem; font-weight: 600; cursor: pointer; line-height: 1.35; }
.pr-profile-shuffle>span { font-size: 22px; line-height: 1; }
.pr-profile-colors { display: flex; flex-wrap: wrap; justify-content: center; grid-column: 1/-1; gap: 3px; }
.pr-profile-color { display: grid; place-items: center; flex: 0 0 44px; min-width: 44px; min-height: 44px; padding: 4px; border: 0; border-radius: 50%; background: transparent; cursor: pointer; }
.pr-profile-color>span { position: relative; width: 28px; height: 28px; border-radius: 50%; background: var(--profile-swatch); border: 1px solid #263b5820; }
.pr-profile-color[aria-pressed=true]>span { outline: 2px solid var(--vd-ink); outline-offset: 4px; }
.pr-profile-color[aria-pressed=true]>span::after { content: "✓"; position: absolute; inset: 0; display: grid; place-items: center; color: #263b58; font-size: 15px; font-weight: 750; }
.pr-profile-options { display: flex; justify-content: flex-end; gap: 10px; align-items: center; padding-top: 10px; }
.pr-profile-forget,.pr-profile-done { min-height: 44px; min-width: 44px; border: 0; background: transparent; padding: 8px 2px; font-size: .75rem; cursor: pointer; }
.pr-profile-forget { margin-right: auto; color: var(--vd-muted); }
.pr-profile-done { color: var(--vd-action); font-weight: 650; padding: 8px 12px; }
.pr-profile-status { color: var(--vd-muted); font-size: .75rem; line-height: 1.5; margin: 10px 0 20px; }
.pr-profile-status:empty { display: none; }
.pr-profile-shuffle,.pr-profile-color,.pr-profile-done { transition: transform 130ms ease, background-color 130ms ease; }
.pr-profile-shuffle:active,.pr-profile-color:active,.pr-profile-done:active { transform: scale(.96); }
@media (max-width: 360px) {
  .pr-profile-fields { padding: 14px; }
  .pr-profile-customize { grid-template-columns: 80px minmax(0,1fr); gap: 12px; }
  .pr-profile-portrait { width: 80px; height: 80px; }
  .pr-profile-colors { gap: 0; }
  .pr-profile-summary { gap: 9px; padding: 12px; }
  .pr-profile-change { font-size: .75rem; }
}
@media (prefers-reduced-motion: reduce) {
  .pr-profile-shuffle,.pr-profile-color,.pr-profile-done { transition: none; }
  .pr-profile-shuffle:active,.pr-profile-color:active,.pr-profile-done:active { transform: none; }
}
/* Let larger text wrap inside the compact character editor. */
.pr-profile-shuffle { max-width: 100%; overflow-wrap: anywhere; }
.pr-profile-shuffle>span { flex-shrink: 0; }

/* Drawing: no text selection or callouts while sketching, and the biggest canvas the screen allows. */
.pr-game-sketch-club.pr-phone, .pr-drawing, .vd-drawing-dialog { -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; -webkit-tap-highlight-color:transparent; }
.pr-drawing canvas, .vd-drawing-dialog canvas { -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; touch-action:none; }
.pr-drawing.is-editable { touch-action:none; width:100vw; max-width:100vw; margin-inline:calc(50% - 50vw); border-radius:0; border-inline:0; }
.pr-drawing.is-editable canvas { width:min(100%, calc((100dvh - 170px) * 1.6)); margin-inline:auto; }
.pr-drawing-status:empty { display:none; }
