/* Composição TV 1920 × 1080, escalada sem distorcer os fundos do Figma. */
body.tv[data-ready="true"] #app { padding:0; position:relative; overflow:hidden; }
body.tv[data-ready="true"] .game-exit-bar { display:none; }
.ready-stage { width:1920px; height:1080px; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%) scale(var(--ready-scale,1)); transform-origin:center; overflow:hidden; isolation:isolate; font-family:Figtree,sans-serif; color:white; }
.ready-bg,.ready-tint { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; pointer-events:none; }
.ready-tint { z-index:-1; }
.ready-stage h1,.ready-stage h2 { font-weight:600; }
.ready-stage h1 { font-size:32px; line-height:32px; margin:0 0 18px; }
.ready-stage button { color:white; font:600 20px/1.4 Figtree,sans-serif; }
.ready-stage button:disabled { opacity:.5; cursor:wait; }
.ready-stage .glass { backdrop-filter:blur(6px); box-shadow:inset 1px 1px 0 #ffffff45,inset -1px -1px 0 #ffffff20; }
.ready-exit { position:absolute; right:95px; top:95px; width:70px; height:70px; display:grid; place-items:center; border:3px solid transparent; border-radius:16px; background:linear-gradient(var(--primary-50),var(--primary-50)) padding-box,var(--stroke-gradient) border-box; z-index:2; }
.ready-exit img { width:35px; height:35px; }
.ready-letter { width:120px; height:120px; border:3px solid transparent; border-radius:50%; background:linear-gradient(var(--secondary-pink-100),var(--secondary-pink-100)) padding-box,var(--stroke-gradient) border-box; display:grid; place-items:center; font:700 64px Inter,sans-serif; }
.ready-choice { position:absolute; top:430px; left:190px; width:1540px; height:220px; border-radius:999px; padding:36px; background:rgba(124,58,237,.2); display:flex; align-items:center; justify-content:space-between; }
.ready-round { width:150px; height:150px; border:5px solid transparent; border-radius:50%; background:linear-gradient(var(--secondary-cyan-100),var(--secondary-cyan-100)) padding-box,var(--stroke-gradient) border-box; }
.ready-round:first-child { background:linear-gradient(var(--secondary-sky-blue-200),var(--secondary-sky-blue-200)) padding-box,var(--stroke-gradient) border-box; }
.ready-back,.ready-setup-nav button,.ready-final-actions button { border:3px solid transparent; border-radius:16px; padding:12px 24px; background:linear-gradient(var(--primary-50),var(--primary-50)) padding-box,var(--stroke-gradient) border-box; }
.ready-back { position:absolute; left:95px; bottom:35px; }
.ready-options .ready-tint { background:radial-gradient(ellipse,rgba(107,46,209,.2),rgba(255,133,194,.2)); }
.ready-options section.ready-options { position:absolute; left:189px; top:305px; width:1541px; height:474px; border-radius:999px; background:rgba(99,169,255,.42); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:30px; }
.ready-options h1,.ready-categories h1 { font-size:40px; line-height:48px; margin:0; }
.ready-options-grid { display:flex; align-items:center; gap:200px; }
.ready-option { width:220px; display:flex; flex-direction:column; align-items:center; gap:12px; background:none; border:0; }
.ready-option img { width:200px; height:230px; object-fit:contain; filter:drop-shadow(11px 4px 6px #0004); }
.ready-option span { font-size:32px; line-height:32px; }
.ready-option strong { font-size:24px; background:var(--primary-200); border-radius:99px; padding:0 14px; }
.ready-setup-nav { position:absolute; bottom:28px; left:190px; right:190px; display:flex; justify-content:space-between; }
.ready-categories .ready-tint { background:radial-gradient(ellipse,rgba(209,108,46,.2),rgba(255,204,36,.2)); }
.ready-categories section.ready-categories { position:absolute; left:190px; top:277px; width:1541px; height:709px; background:rgba(99,169,255,.42); border-radius:350px; padding:22px 170px 35px; display:flex; flex-direction:column; gap:20px; align-items:center; }
.ready-category-grid { display:grid; grid-template-columns:repeat(4,190px); justify-content:space-between; gap:22px 145px; }
.ready-category { display:flex; flex-direction:column; align-items:center; gap:8px; background:none; border:0; border-radius:24px; padding:5px; min-height:170px; }
.ready-category img { width:120px; height:120px; }
.ready-category span { text-transform:uppercase; font-size:20px; line-height:28px; }
.ready-category[aria-pressed="true"] { background:rgba(91,33,182,.28); box-shadow:inset 0 0 0 3px var(--secondary-cyan-50); }
.ready-category-extra { justify-content:center; }
.ready-selection { position:absolute; bottom:85px; left:0; right:0; text-align:center; font-size:20px; }
.ready-category-grid { gap:16px 145px; }
.ready-value-dialog input { width:100%; color:white; background:var(--primary-200); padding:16px; border:2px solid var(--primary-25); border-radius:16px; font:600 26px Figtree,sans-serif; }
.ready-value-dialog form>div { display:flex; justify-content:space-between; gap:20px; margin-top:24px; }
.ready-value-dialog button { padding:12px 20px; border:2px solid var(--primary-25); background:var(--primary-50); color:white; border-radius:16px; font:600 18px Figtree,sans-serif; }
.ready-letter .ready-tint { background:radial-gradient(ellipse,transparent,rgba(105,74,156,.18) 50%,rgba(107,46,209,.36)); }
.ready-stage.ready-letter { width:1920px; height:1080px; display:block; border:0; border-radius:0; background:none; }
.ready-letter #letra { position:absolute; top:399px; left:0; width:100%; text-align:center; font:700 215px/.89 Figtree,sans-serif; color:var(--greyscale-25); background:none; -webkit-text-fill-color:var(--greyscale-25); }
.ready-roll-status { position:absolute; bottom:35px; width:100%; display:flex; justify-content:center; gap:24px; font:600 24px Figtree,sans-serif; }
.ready-playing .ready-tint,.ready-grace .ready-tint { background:rgba(46,16,101,.2); }
.ready-playing>.ready-letter,.ready-grace>.ready-letter { position:absolute; top:100px; left:900px; }
.ready-writing-panel { position:absolute; left:95px; right:95px; top:260px; height:725px; border-radius:80px; background:rgba(91,33,182,.04); display:flex; align-items:center; justify-content:space-between; padding:30px 70px; }
.ready-grace .ready-writing-panel { top:225px; height:760px; }
.ready-progress { max-height:100%; overflow:auto; width:520px; padding:5px; display:flex; flex-direction:column; gap:20px; }
.ready-progress-row { display:flex; align-items:center; gap:29px; flex:none; }
.ready-avatar { display:flex; flex-direction:column; align-items:center; width:92px; flex:none; }
.ready-avatar img { width:100%; aspect-ratio:1; object-fit:contain; background:var(--avatar-color); border-radius:50%; }
.ready-avatar span { font:600 14px/1.55 Figtree,sans-serif; max-width:150%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 5px; border-radius:53px; background:var(--primary-50); }
.ready-progress-track { width:300px; height:14px; border-radius:999px; background:var(--secondary-cyan-50); overflow:hidden; flex:none; }
.ready-progress-track span { display:block; height:100%; border-radius:999px; background:var(--warning-50); }
.ready-count { width:60px; height:60px; margin-left:-17px; flex:none; display:grid; place-items:center; border-radius:50%; background:var(--primary-100); font-size:24px; }
.ready-writing-status { width:500px; display:flex; flex-direction:column; align-items:center; gap:20px; text-align:center; }
.ready-timer { width:210px; height:210px; border:10px solid var(--success-50); border-radius:50%; background:var(--primary-25); color:var(--primary-100); display:grid; place-items:center; font:700 96px/.89 Figtree,sans-serif; }
.ready-timer.perigo { border-color:var(--error-50); }
.ready-writing-status>.ready-avatar { width:150px; }
.ready-writing-status>.ready-avatar span { display:none; }
.ready-writing-status h2 { font-size:40px; line-height:48px; }
.ready-stop { position:relative; width:205px; height:205px; flex:none; }
.ready-stop img { display:block; }
.ready-stop span { position:absolute; inset:0; display:grid; place-items:center; color:white; font:600 32px/32px Figtree,sans-serif; }
.ready-grace-time { font-size:24px; }
.ready-scores .ready-tint { background:linear-gradient(rgba(46,16,101,.2),rgba(102,102,102,.2)); }
.ready-word { position:absolute; top:95px; left:900px; display:flex; flex-direction:column; align-items:center; gap:10px; }
.ready-word h2 { font-size:32px; line-height:32px; }
.ready-score-list { position:absolute; top:345px; left:665px; width:589px; }
.ready-ranking { list-style:none; padding:20px; border-radius:60px; background:rgba(232,30,131,.23); max-height:630px; overflow:auto; }
.ready-ranking li { display:flex; align-items:center; gap:16px; padding:10px; height:80px; border-radius:80px; }
.ready-ranking li:first-child { background:var(--secondary-pink-50); }
.ready-position { width:36px; height:36px; flex:none; border-radius:50%; display:grid; place-items:center; font:500 24px/1.5 Figtree,sans-serif; }
.ready-ranking li:nth-child(1) .ready-position { background:var(--warning-50); color:black; }
.ready-ranking li:nth-child(2) .ready-position { background:var(--greyscale-100); color:black; }
.ready-ranking li:nth-child(3) .ready-position { background:var(--warning-200); color:black; }
.ready-ranking .ready-avatar { width:60px; }
.ready-name { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:32px; font-weight:600; }
.ready-ranking strong { color:var(--primary-25); font:600 32px/32px Figtree,sans-serif; white-space:nowrap; }
.ready-over .ready-tint { background:linear-gradient(90deg,rgba(46,16,101,.4) 1.328%,transparent 52.786%); }
.ready-final-left { position:absolute; top:75px; left:95px; bottom:70px; width:589px; display:flex; flex-direction:column; justify-content:space-between; align-items:center; }
.ready-final-left>div { width:100%; }
.ready-final-left .ready-ranking { max-height:440px; width:589px; }
.ready-final-left .ready-logo { width:160px; height:160px; border:9px solid var(--greyscale-25); border-radius:50%; background:var(--primary-200); overflow:hidden; }
.ready-logo img { width:100%; height:100%; object-fit:cover; }
.ready-final-actions { display:flex; justify-content:space-between; }
.ready-final-actions button { width:220px; height:55px; font-size:20px; }
.ready-final-actions button:last-child { background:linear-gradient(var(--primary-200),var(--primary-200)) padding-box,var(--stroke-gradient) border-box; }
.ready-winner { position:absolute; width:160px; }
.ready-winner .ready-avatar { width:120px; margin:auto; }
.ready-winner .ready-avatar span { font-size:32px; background:none; }
.winner-1 { left:1394px; top:390px; }.winner-2 { left:1200px; top:496px; }.winner-3 { left:1588px; top:540px; }
.ready-error { position:absolute; bottom:12px; left:400px; right:400px; padding:12px; background:var(--error-200); border-radius:12px; text-align:center; font-size:22px; z-index:3; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
/* Figma 303:1527 — voting. Verdicts only appear after the voting period. */
.ready-voting .ready-tint { background:radial-gradient(ellipse,rgba(46,16,101,.56),rgba(77,31,155,.403) 50%,rgba(107,46,209,.246)); }
.ready-voting>.ready-letter { position:absolute; top:95px; left:95px; }
.ready-voting>h1 { position:absolute; top:110px; left:250px; right:250px; text-align:center; font:700 83px/.89 Figtree,sans-serif; }
.ready-votes { position:absolute; width:1022px; height:710px; top:275px; left:449px; background:rgba(255,255,255,.28); border-radius:80px; display:flex; flex-direction:column; gap:29px; padding:20px; overflow:auto; }
.ready-vote-row { display:flex; align-items:center; justify-content:center; gap:15px; min-height:110px; flex:none; }
.ready-vote-word { width:335px; min-height:40px; padding:7px 16px; border:1.5px solid transparent; border-radius:16px; background:linear-gradient(var(--primary-50),var(--primary-50)) padding-box,var(--stroke-gradient) border-box; font:600 16px/1.55 Figtree,sans-serif; color:var(--primary-0); box-shadow:0 4px 8px #7c3aed45; overflow-wrap:anywhere; }
.ready-vote-pending { width:60px; height:60px; border-radius:50%; display:grid; place-items:center; background:var(--greyscale-200); font-size:32px; }
.ready-vote-footer { position:absolute; bottom:24px; left:95px; right:95px; display:flex; align-items:center; justify-content:center; gap:30px; font-size:20px; }
.ready-vote-footer .cron { margin:0; }
.ready-vote-verdict { width:60px; height:60px; border-radius:50%; display:grid; place-items:center; background:var(--success-50); }
.ready-vote-verdict.invalid { background:var(--error-50); }
