@font-face{font-family:"Calibri Web";src:url("/fonts/calibri-regular.woff") format("woff");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Calibri Web";src:url("/fonts/calibri-bold.woff") format("woff");font-weight:700;font-style:normal;font-display:swap}
:root{font-family:"Calibri Web",Calibri,"Segoe UI",Tahoma,sans-serif;color:#14264a;background:#f5f8fd;font-synthesis:none;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 50% 0,#ffffff 0,#f5f8fe 68%,#eff5ff 100%)}button,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.58;cursor:not-allowed}.shell{max-width:1110px;margin:0 auto;padding:18px 24px 36px;min-height:100vh}.header{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:0 0 24px;padding:0 4px}.brand{display:flex;align-items:center;gap:12px}.flame{width:50px;height:50px;border-radius:15px;color:#fa602a;background:#fff2e5;display:grid;place-items:center}.brand strong{font-size:23px;font-weight:800;display:block}.brand small{display:block;margin-top:4px;color:#7789a5;font-size:11px}.header-right{display:flex;align-items:center;gap:10px}.user-tag,.logout{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid #e2eaf6;border-radius:10px;padding:10px 15px;box-shadow:0 4px 18px #18395b06;color:#304f78;font-size:12px}.logout:hover{background:#eaf2ff}.panel{border:1px solid #e4eaf5;border-radius:16px;background:#fff;box-shadow:0 10px 35px #1a42770b;padding:24px}.login-panel{text-align:center;padding:32px 25px 19px;max-width:740px;margin:55px auto 20px}.hero-icon{margin:auto;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;color:#276fee;background:#ecf4ff}.login-panel h1{font-size:27px;margin:14px 0 9px}.subtitle{color:#7f8fa9;margin:0 0 30px;font-size:13px}.login-form{display:grid;gap:12px;text-align:right}.login-form label{font-weight:bold;font-size:13px}.login-form input{display:block;width:100%;padding:15px 17px;border-radius:8px;min-height:48px;border:1px solid #cfdaf0;outline:none;color:#17305b;font-family:"Calibri Web",Calibri,"Segoe UI",Tahoma,sans-serif;font-size:15px;text-align:center;letter-spacing:.35px}.login-form input:focus{border-color:#397df3;box-shadow:0 0 0 4px #3079ff20}.login-form input::placeholder{color:#b0bfd3}.primary{display:flex;align-items:center;justify-content:center;gap:12px;color:#fff;background:linear-gradient(100deg,#398bff,#1c68f2);border:0;border-radius:8px;padding:12px;font-size:14px;font-weight:700;min-height:46px;box-shadow:0 6px 15px #2b76e524}.primary:hover{filter:brightness(.96)}.tip{display:flex;align-items:center;gap:10px;justify-content:center;color:#336cc7;background:#eff6ff;border:1px solid #d9e9ff;border-radius:9px;padding:13px 15px;margin-top:19px;font-size:12px;line-height:1.9;text-align:right}.tip svg{flex:none}.help{display:flex;align-items:center;gap:12px;max-width:740px;margin:0 auto;background:#ffffffaa;border:1px solid #e5edfa;border-radius:13px;padding:18px 22px}.help-icon{color:#2e7ae8;background:#ecf3ff;border-radius:12px;padding:11px;display:flex}.help strong{font-size:13px}.help p{font-size:12px;color:#7789a5;margin:6px 0 0;line-height:1.8}.room-panel{margin-top:8px;padding:28px 25px}.room-title{display:flex;align-items:center;gap:12px}.room-title h1{font-size:25px;margin:0 0 8px}.room-title p{font-size:13px;color:#7b8ca8;margin:0}.room-icon{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:#e9f2ff;color:#2673e8;flex:none}.live{margin-right:auto;display:flex;align-items:center;gap:8px;color:#637b9c;font-size:11px;white-space:nowrap}.game-title{margin:17px 0 0;padding:12px 14px;background:#f7faff;border:1px solid #e9f0fb;border-radius:9px;font-weight:700;font-size:14px}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:16px 0 23px}.stat{min-height:112px;display:flex;flex-direction:column;gap:8px;padding:16px;border-radius:12px}.stat>svg{align-self:flex-end}.stat small{font-size:12px}.stat strong{font-size:18px}.stat.blue{background:#e8f3ff;color:#255ed0}.stat.green{background:#eaf9f0;color:#198553}.stat.sky{background:#edf5ff;color:#3b69bc}.stat.purple{background:#f3eefd;color:#7b49bf}.progress-heading{display:flex;align-items:center;justify-content:space-between;font-size:13px;margin-bottom:9px}.progress-heading span{color:#7488a4}.progress-track{width:100%;height:13px;border-radius:25px;overflow:hidden;background:#e9eef7;direction:rtl}.progress-fill{height:100%;background:linear-gradient(90deg,#2679ef,#3c91ff);border-radius:25px;transition:width .35s}.roster-heading{font-size:16px;margin:27px 0 13px}.roster{border:1px solid #e6edf7;border-radius:11px;overflow:hidden}.roster-row{display:grid;grid-template-columns:35px 1fr auto;align-items:center;gap:12px;padding:12px 14px;border-bottom:1px solid #e9eef6;font-size:13px}.roster-row:nth-child(2n){background:#fcfdff}.roster-row:last-child{border:0}.roster-number{color:#627595}.presence{font-size:11px;padding:7px 12px;border-radius:9px;white-space:nowrap}.presence.here{background:#e2f7e9;color:#158850}.presence.away{background:#fff5e1;color:#a77722}.banner{display:flex;gap:10px;align-items:center;margin-top:18px;border-radius:10px;border:1px solid;padding:16px;line-height:1.9;font-size:12px;font-weight:650}.banner svg{flex:none}.banner.pending{background:#fff8e9;color:#ac7120;border-color:#f8e1ae}.banner.success{background:#edf9f0;color:#207b4c;border-color:#c6efd4}.sync{color:#8999b0;font-size:11px;margin:16px 0 0;text-align:left}.error{color:#b33a43;background:#fff1f2;border:1px solid #ffd6db;border-radius:9px;padding:12px;font-size:12px;text-align:right;line-height:1.9}.loading{text-align:center;padding:80px 10px;color:#7386a1}.loading-card{text-align:center;padding:80px 10px}.loading-card h2{font-size:17px}.spinner{width:34px;height:34px;border:4px solid #d5e6ff;border-top-color:#317df5;border-radius:50%;animation:spin 1s linear infinite;margin:auto}@keyframes spin{to{transform:rotate(360deg)}}footer{color:#a3afc1;text-align:center;margin-top:34px;font-size:11px}@media(max-width:760px){.shell{padding:14px}.panel{padding:16px}.header{margin-bottom:14px}.brand strong{font-size:18px}.flame{width:43px;height:43px}.header-right .user-tag{display:none}.login-panel{margin-top:50px;padding:30px 16px 16px}.stat-grid{grid-template-columns:repeat(2,1fr);gap:8px}.room-title{flex-wrap:wrap}.live{margin-right:0;width:100%;padding-right:58px}.room-title h1{font-size:21px}.roster-row{padding:11px 9px}.presence{padding:6px 8px}.help{padding:14px}.tip{font-size:11px}}


/* Synchronized scoring, following the approved third-screen design. */
.vote-progress{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:16px 0 28px}
.progress-pill{background:#eff4fb;border-radius:13px;padding:12px 18px;text-align:center;min-width:160px;font-weight:700;font-size:14px;color:#284777}
.progress-pill small{display:block;margin-top:8px;color:#7187a7;font-size:12px;font-weight:400}
.stepper{display:flex;align-items:center;gap:18px;justify-content:center;flex-wrap:wrap}
.step-node{width:37px;height:37px;border:2px solid #d6e3f5;color:#7991b3;background:#fff;border-radius:50%;display:grid;place-items:center;font-size:15px}
.step-node.current{background:#2b78ef;color:white;border-color:#2b78ef;box-shadow:0 4px 14px #4284e938}
.step-node.past{background:#19b97a;color:white;border-color:#19b97a}
.score-panel{max-width:970px;margin:0 auto;padding:35px 30px;text-align:center}
.voting-tag{display:inline-block;border-radius:50px;background:#ecf4ff;color:#246cdf;font-size:13px;padding:8px 19px}
.candidate-symbol{display:grid;place-items:center;margin:15px auto;background:#e4efff;color:#5792ef;width:74px;height:74px;border-radius:50%}
.score-panel h1{font-size:32px;margin:12px 0 24px}
.question-box{background:#eaf3ff;border-radius:13px;min-height:125px;display:grid;place-content:center;gap:12px;padding:24px;margin-bottom:24px;position:relative}
.question-box span{color:#1f64ce;background:#d9eaff;border-radius:14px;font-size:13px;padding:5px 13px;justify-self:start}
.question-box strong{font-size:20px;line-height:1.9}
.score-panel form{display:grid;text-align:right;gap:13px}
.score-panel label{font-size:15px;font-weight:650}
.score-panel input{height:57px;border:2px solid #b9cff5;padding:14px 18px;border-radius:9px;font-size:20px;text-align:right;direction:rtl}
.score-panel input:focus{border-color:#3379ea;outline:none;box-shadow:0 0 0 3px #327ffc15}
.score-panel form small{font-size:12px;color:#6580aa}
.vote-submit{margin-top:15px;font-size:16px;min-height:58px}
.score-note{display:flex;gap:12px;align-items:center;background:#f3f7fc;border-radius:12px;padding:19px 16px;margin-top:16px;color:#617b9f;font-size:13px;text-align:right;line-height:2}
.score-note svg{flex:none}
.vote-footer{margin-top:16px;color:#8196b2;font-size:12px}
.submitted-state{background:#f4fbf7;border:1px solid #d7f1e2;border-radius:12px;padding:25px;margin:12px 0}
.success-mark{margin:auto;width:58px;height:58px;background:#1cbb78;color:white;display:grid;place-items:center;border-radius:50%}
.submitted-state h2{margin:12px 0 7px}.submitted-state p{color:#608270}
.vote-counter{display:inline-block;border-radius:9px;background:#e3f5eb;padding:11px 18px;color:#138454;font-weight:700}
@media(max-width:760px){.vote-progress{gap:5px;flex-wrap:wrap}.progress-pill{min-width:0;flex:1;font-size:11px;padding:11px 6px}.progress-pill small{font-size:10px}.stepper{order:3;width:100%;gap:8px;margin-top:12px}.score-panel{padding:22px 16px}.score-panel h1{font-size:26px}.question-box{padding:14px;min-height:110px}.question-box strong{font-size:17px}.score-note{font-size:12px}}
