:root { --turq: #09c9bf; --turq-deep: #02aaa9; --navy: #062d4a; --ink: #10151e; --coral: #f5515c; --rose: #ed2f6b; --muted: #637184; --paper: #f8fcfc; }
* { box-sizing: border-box; }
body { margin: 0; font-family: Arial, Helvetica, sans-serif; background: var(--paper); color: var(--ink); }
button { font: inherit; cursor: pointer; }
.brand { display: flex; align-items: center; gap: 15px; font-weight: 800; letter-spacing: .07em; color: var(--navy); }
.brand .absentix { color: var(--turq-deep); font-size: 1.2rem; letter-spacing: -.05em; font-weight: 500; }
.brand .divider { height: 28px; border-left: 1px solid #9fb2be; }
.brand .camera { font-size: .75rem; letter-spacing: .13em; }
.question-stage { min-height: 100vh; overflow: hidden; padding: clamp(24px, 4vw, 70px); background: radial-gradient(circle at 94% 2%, #d7faf6 0 7%, transparent 7.1%), radial-gradient(circle at 3% 100%, #d9f8f5 0 10%, transparent 10.1%), #fff; }
.question-header { display:flex; align-items:center; justify-content:space-between; gap: 20px; margin-bottom: clamp(25px,4vh,60px); }
.eyebrow { color: var(--turq-deep); font-size: .9rem; letter-spacing: .22em; font-weight: 800; text-transform: uppercase; }
.timer { min-width: 130px; text-align: center; padding: 12px 18px; color: #fff; background: var(--navy); border-radius: 999px; font-size: 1.25rem; font-weight: 800; }
.timer.closed { background: var(--coral); }
.timer.waiting-timer { background: #78909c; font-size: .9rem; letter-spacing: .12em; }
.question-layout { max-width: 1320px; margin: 0 auto; }
.question-title { max-width: 1100px; margin: 0 0 15px; color: var(--navy); font-size: clamp(2rem, 5vw, 5.3rem); line-height: .98; letter-spacing: -.055em; }
.question-note { color: var(--muted); font-size: 1.1rem; margin: 0 0 28px; }
.options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap: 16px; margin-top: 34px; }
.live-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; margin-top:38px; }
.presenter .live-options .option { min-height:132px; padding:26px 30px; font-size:clamp(1.35rem,2.35vw,2.35rem); line-height:1.12; box-shadow:none; border:2px solid #bcece7; }
.presenter .live-options .option .letter { flex-basis:58px; width:58px; height:58px; font-size:1.35rem; }
.live-help { margin:24px 0 0; color:var(--muted); font-size:1.05rem; font-weight:700; }
.option { display:flex; align-items:center; gap:18px; padding: 20px 24px; border:1px solid #c6ece9; background:#fff; border-radius: 18px; box-shadow:0 8px 25px rgba(6,45,74,.07); min-height: 105px; font-size: clamp(1rem,1.8vw,1.55rem); font-weight: 700; color:var(--navy); }
.option .letter { display:grid; place-items:center; flex:0 0 42px; width:42px; height:42px; border-radius:50%; background:var(--turq); color:var(--navy); font-size:1rem; }
.option.selected { border: 3px solid var(--turq); background: #effffb; }
.option input { position:absolute; opacity:0; }
.cta { border:0; border-radius:999px; padding:16px 28px; color:#fff; background:var(--navy); font-weight:800; }
.cta:hover { background:#0a4269; }
.cta.coral { background:var(--coral); }
.waiting { display:grid; min-height:100vh; place-items:center; padding:30px; text-align:center; background:radial-gradient(circle at 90% 5%,#d8faf6 0 11%,transparent 11.1%),#fff; }
.waiting-inner { max-width:620px; }
.waiting h1 { color:var(--navy); margin:25px 0 10px; font-size:clamp(2rem,7vw,4.5rem); letter-spacing:-.06em; line-height:.96; }
.waiting p { color:var(--muted); font-size:1.2rem; }
.pulse { width:76px; height:76px; margin:auto; border-radius:50%; background:var(--turq); box-shadow:0 0 0 0 rgba(9,201,191,.5); animation:pulse 2s infinite; }
@keyframes pulse { 70% { box-shadow:0 0 0 25px rgba(9,201,191,0); } 100% { box-shadow:0 0 0 0 rgba(9,201,191,0); } }
.participant .question-stage { padding-bottom:42px; }
.participant .options { grid-template-columns:1fr; margin-top:24px; }
.participant .option { min-height:76px; padding:14px 17px; font-size:1rem; text-align:left; }
.participant .submit { width:100%; margin-top:24px; font-size:1.1rem; }
.participant .feedback { min-height:26px; color:var(--turq-deep); font-weight:700; text-align:center; margin:16px 0 0; }
.presenter { background:#061c2e; min-height:100vh; }
.slide { position:relative; min-height:calc(100vh - 82px); display:grid; place-items:center; overflow:hidden; background:#fff; }
.slide > img { display:block; width:100%; height:calc(100vh - 82px); object-fit:cover; }
.slide.intro { overflow:hidden; }
.slide .qr-wrap { position:absolute; width:min(18vw,300px); aspect-ratio:1; top:24%; left:64.2%; display:grid; place-items:center; padding:12px; border-radius:14px; background:#fff; }
.slide .qr-wrap img { width:100%; height:100%; object-fit:contain; }
.slide-question { min-height:calc(100vh - 82px); }
.presenter .question-stage { min-height:calc(100vh - 82px); }
.controlbar { min-height:82px; padding:12px 18px; display:flex; align-items:center; gap:10px; background:var(--navy); color:#fff; }
.controlbar button, .controlbar select { border:1px solid rgba(255,255,255,.27); border-radius:10px; padding:10px 13px; background:transparent; color:#fff; }
.controlbar select { max-width:220px; }
.controlbar select option { color:var(--ink); }
.controlbar .counter { margin-right:auto; color:#d7e6ee; font-weight:700; }
.status { color:#85f6df; font-size:.85rem; font-weight:700; }
.open-panel { display:flex; align-items:center; gap:20px; margin-top:34px; padding:22px; border-radius:18px; background:rgba(9,201,191,.12); }
.open-panel p { margin:0; color:var(--navy); font-weight:700; }
.results { margin:34px 0 0; display:grid; gap:20px; }
.result-row { display:grid; grid-template-columns:minmax(230px,38%) 1fr 64px; gap:20px; align-items:center; color:var(--navy); font-size:clamp(1.1rem,1.8vw,1.8rem); line-height:1.1; font-weight:800; }
.bar { height:38px; overflow:hidden; background:#dceff0; border-radius:999px; box-shadow:inset 0 0 0 1px rgba(9,201,191,.16); }.bar i { display:block; height:100%; background:linear-gradient(90deg,var(--turq),#0d9fbd); border-radius:inherit; transition:width .35s ease; }
.result-row b { display:grid; place-items:center; width:58px; height:58px; border-radius:50%; color:#fff; background:var(--navy); font-size:1.35em; }
.response-count { color:var(--turq-deep); font-size:1.25rem; font-weight:800; }
.results-stage .question-title { max-width:1000px; font-size:clamp(2.1rem,4.25vw,4.6rem); }
@media (max-width:700px) { .options,.live-options { grid-template-columns:1fr; }.presenter .live-options .option { min-height:90px; padding:18px; font-size:1.1rem; }.question-header { align-items:flex-start; flex-direction:column; }.timer { min-width:105px; }.controlbar { flex-wrap:wrap; }.controlbar .counter { order:4; width:100%; }.slide,.slide-question,.presenter .question-stage { min-height:calc(100vh - 142px); }.slide > img { height:calc(100vh - 142px); }.open-panel { flex-direction:column; align-items:flex-start; }.result-row { grid-template-columns:100px 1fr 40px; gap:10px; font-size:.78rem; }.bar { height:22px; }.result-row b { width:36px; height:36px; } }