.role-grid { grid-template-columns:repeat(3,1fr); gap:12px; }
.role-card { grid-template-columns:1fr; justify-items:center; text-align:center; padding:18px 12px; }.role-icon { grid-row:auto; }.participant-role { background:#a797d42b; border-color:#b5a1da55; }
#playerNameField { width:100%; }#playerName { width:100%; min-height:60px; font-size:18px; letter-spacing:0; text-align:left; padding:12px 16px; }
.phone-manager-button { min-height:60px; padding:0 14px; border:1px solid #fff; border-radius:18px; background:#ffffffb0; color:#695381; font-size:14px; }.phone-manager-button b { margin-left:6px; }#dismissDuo { color:#fff; background:#72518f; }
.duo-intro[data-phase="hold"] .duo-count { opacity:0; filter:none; }.duo-intro[data-phase="hold"] .duo-title { opacity:1; filter:none; }
.stage-score-team { min-height:75px; grid-template-columns:1fr; }.stage-score-team strong { display:none; }
.award-podium .covered { opacity:1; filter:none; background:#ffffff08; border:1px dashed #d5bced44; }.award-podium .covered b { color:#9e87b4; font-size:clamp(24px,3vw,50px); }.award-podium { max-height:45vh; }.awards-stage .stage-tool-title { font-size:clamp(36px,6vw,100px); }
.individual-award-stage { width:100%; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2vh; text-align:center; padding:3vh 4vw; }.individual-award-stage>span { color:#bc9bd9; font-size:clamp(14px,1.5vw,25px); letter-spacing:.22em; }.individual-award-stage h1 { color:#d7b5f0; font-size:clamp(36px,6vw,105px); font-weight:500; margin:0; }.individual-award-stage>strong { color:#fff4fc; font-size:clamp(55px,11vw,190px); line-height:1.2; letter-spacing:-.06em; overflow-wrap:anywhere; }.individual-award-stage p { color:#baa5c8; font-size:clamp(20px,2.5vw,42px); margin:0; }
.phone-host-actions { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }.phone-roster-row,.phone-response-row { display:flex; align-items:center; gap:12px; padding:10px; border-bottom:1px solid #dacde2; font-size:14px; }.phone-roster-row>div { flex:1; }.phone-roster-row small { display:block; color:#9c8aa8; font-size:12px; margin-top:5px; }.phone-roster-row button,.phone-response-row button { padding:8px 14px; }.phone-response-row>span { flex:1; overflow-wrap:anywhere; }#phoneInvite { font-size:15px; }#phoneResponses:empty { display:none; }
.participant-shell { min-height:100dvh; color:#32273d; background:radial-gradient(ellipse at 100% 0,#dfd4f3,transparent 60%),#f3eef7; padding:0 20px max(30px,env(safe-area-inset-bottom)); color-scheme:light; }
.participant-header { display:flex; align-items:center; justify-content:space-between; gap:12px; max-width:600px; margin:auto; padding:16px 0; }.participant-header>b { font-size:32px; letter-spacing:-.12em; color:#70518f; }.participant-header>span { margin-right:auto; margin-left:10px; font-size:16px; font-weight:600; }.participant-header button { min-width:60px; min-height:60px; border:0; border-radius:18px; color:#8c739f; background:#e8dff1; font-size:14px; }
.phone-connection { margin:0 auto 14px; max-width:600px; font-size:12px; color:#8b769d; }
#participantContent { max-width:600px; margin:auto; }.phone-live { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:22px; border-radius:25px; background:#302538; color:#e2d2ed; }.phone-live span { font-size:16px; }.phone-live strong { font-size:36px; font-weight:400; font-variant-numeric:tabular-nums; letter-spacing:-.05em; white-space:nowrap; }
.phone-team-label { display:flex; align-items:center; gap:18px; margin:16px 0; color:#8c769c; font-size:14px; }.phone-team-label select { flex:1; min-height:60px; border:1px solid #e2d7ea; border-radius:16px; color:#684a80; background:#fff9; padding:12px; font-size:16px; }
.phone-game { padding:24px; background:#fffc; border:1px solid white; border-radius:30px; }.phone-game h1 { font-size:clamp(26px,7vw,42px); letter-spacing:-.055em; line-height:1.3; margin:0 0 24px; overflow-wrap:anywhere; }.phone-game p { color:#8e799c; font-size:16px; line-height:1.7; }.phone-game button { min-height:64px; padding:16px; border-radius:18px; border:1px solid #e5d9ee; background:#ece2f5; color:#715286; font-size:18px; font-weight:600; width:100%; }.phone-game button:disabled { opacity:.6; }.phone-choices { display:grid; gap:12px; }.phone-choices button { text-align:left; }.phone-choices button.selected { color:white; background:#8963aa; border-color:#8963aa; }.phone-choices small { float:right; font-size:13px; }
.phone-quiz-image { width:100%; max-height:40vh; object-fit:contain; border-radius:20px; margin-bottom:20px; }.phone-answer { color:#664780; background:#e6d6f1; padding:18px; border-radius:18px; margin:16px 0; font-size:20px; font-weight:600; overflow-wrap:anywhere; }
#phoneAnswerForm { display:grid; gap:12px; }#phoneAnswerForm label { font-size:16px; color:#8b7599; }#phoneAnswer { width:100%; min-height:64px; font-size:18px; border:1px solid #d8c6e6; border-radius:16px; padding:16px; background:white; color:#523c65; }#phoneAnswerForm button { background:#8963aa; color:white; }
.phone-role { text-align:center; padding:24px; background:#302537; color:#eedff7; border-radius:24px; display:grid; gap:20px; }.phone-role small { color:#bba5cd; font-size:14px; }.phone-role strong { font-size:42px; }.phone-role button { background:#d6bee7; color:#5b3c72; }.phone-eyebrow { color:#a688bb; font-size:14px; }.phone-mafia-actions { margin-top:14px; }
@media(max-width:1100px) { .console-status { display:none; } }
@media(max-width:760px) { .role-grid { grid-template-columns:1fr; }.role-card { grid-template-columns:60px 1fr; justify-items:start; text-align:left; min-height:100px; }.role-icon { grid-row:1/3; }.phone-host-actions { grid-template-columns:1fr; }.phone-roster-row,.phone-response-row { flex-wrap:wrap; }.header-actions { gap:5px; }.phone-manager-button { padding:0 8px; font-size:12px; }.brand-lockup>div { display:none; }.participant-shell { padding-left:14px; padding-right:14px; }.phone-game { padding:20px; }.phone-live { padding:18px; }.phone-live strong { font-size:32px; } }