:root{font-family:Inter,system-ui,-apple-system,PingFang SC,sans-serif;color:#292330;background:#fff9f5;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(circle at top right,#ffe7de 0,transparent 38%),#fff9f5}.page{max-width:760px;margin:0 auto;padding:64px 20px}.eyebrow{color:#a97062;font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}h1{font-size:clamp(34px,8vw,64px);line-height:1.05;margin:10px 0 32px}h2{margin:0 0 14px;font-size:clamp(22px,5vw,34px)}h3{margin-top:30px}.card,.screen-card{background:#fff;border:1px solid #f1ded8;border-radius:28px;box-shadow:0 24px 70px #c7988d22;padding:28px}.stack{display:grid;gap:16px}label{display:grid;gap:8px;font-weight:700;color:#665664}input{border:1px solid #dec9c1;border-radius:14px;padding:14px 16px;font:inherit;background:#fffdfc}button{font:inherit;border:0;cursor:pointer}.primary{background:#a84757;color:#fff;padding:14px 18px;border-radius:14px;font-weight:800}.primary:disabled{opacity:.4;cursor:not-allowed}.primary{text-decoration:none;display:inline-block}.row{display:flex;gap:16px;align-items:center}.between{justify-content:space-between}.muted{color:#8b7c86;font-size:14px}.pill{background:#f8e8e3;color:#8d4e56;border-radius:999px;padding:8px 12px;font-size:13px;font-weight:700}.notice{background:#fff4e5;color:#9a6a39;padding:12px 14px;border-radius:12px;margin:18px 0}.error{color:#b23448;min-height:20px}.lobby,.center{text-align:center;padding:54px 10px}.big-emoji{font-size:64px}.question h2{line-height:1.35}.options{display:grid;gap:12px;margin:24px 0}.option{display:flex;gap:14px;align-items:center;text-align:left;border:1px solid #eadad5;background:#fffaf8;padding:16px;border-radius:16px;color:#443844}.option b{display:grid;place-items:center;border-radius:50%;width:30px;height:30px;background:#f5e1df;color:#954654}.option.selected{border-color:#a84757;background:#fff0f0}.answer{padding:16px;border-radius:16px;background:#fff0d7;color:#87532f;font-weight:800}.rank{display:grid;grid-template-columns:48px 1fr auto;padding:10px 0;border-bottom:1px solid #f0e6e2}.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:22px 0}.stats div{display:grid;gap:5px;padding:18px;background:#fff5f1;border-radius:16px}.stats b{font-size:30px}.actions{display:flex;gap:10px;flex-wrap:wrap}.home-card{text-align:center}.home-card .notice{margin-top:24px}.screen-card{max-width:1100px;margin:6vh auto;background:#201824;color:#fff0e9;border:0;min-height:70vh;text-align:center}.screen-top{display:flex;justify-content:space-between;color:#edb9aa}.screen-card h2{color:#f2b6a4;margin-top:34px}.screen-question{margin:10vh auto 0;max-width:900px}.screen-question h1{font-size:clamp(34px,6vw,80px);margin:18px 0 44px}.screen-options{display:grid;grid-template-columns:1fr 1fr;gap:18px;text-align:left}.screen-options div{background:#332734;border-radius:18px;padding:22px;font-size:24px;color:#f2b6a4}.screen-options span{color:#fff0e9;margin-left:18px}.screen-lobby{margin-top:8vh}.screen-lobby-content{display:flex;align-items:center;justify-content:center;gap:52px}.screen-qr{width:min(34vw,380px);height:auto;padding:16px;background:#fff8f5;border-radius:18px}.screen-lobby-copy{max-width:420px}.screen-lobby-copy p{font-size:24px}.screen-join-url{font-size:20px!important;overflow-wrap:anywhere;color:#f2b6a4}.screen-room-code{font-weight:800;letter-spacing:.12em}@media (max-width:600px){.page{padding:32px 14px}.card{padding:20px}.screen-options{grid-template-columns:1fr}.screen-card{border-radius:0;margin:0;min-height:100vh}.screen-lobby-content{flex-direction:column;gap:24px}.screen-qr{width:min(72vw,320px)}.screen-lobby-copy p{font-size:20px}}:root{--ink: #2b2030;--muted-ink: #8d7b8c;--rose: #b84d68;--rose-dark: #8d3d55;--rose-soft: #fff0f2;--paper: #fffdfb;--line: #f0dce1;--ease-out: cubic-bezier(.23, 1, .32, 1);--ease-in-out: cubic-bezier(.77, 0, .175, 1);--ease-drawer: cubic-bezier(.32, .72, 0, 1)}body{background:radial-gradient(circle at 8% 8%,#ffe8ef 0,transparent 27%),radial-gradient(circle at 92% 12%,#ffe9d7 0,transparent 28%),linear-gradient(145deg,#fffaf8,#fff6f3)}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:.28;background-image:radial-gradient(#d79caf .7px,transparent .7px);background-size:22px 22px;-webkit-mask-image:linear-gradient(to bottom,#000,transparent 72%);mask-image:linear-gradient(to bottom,#000,transparent 72%)}.page{position:relative;max-width:860px;padding:clamp(34px,7vw,82px) 20px}.page>h1{color:var(--ink);letter-spacing:-.045em}.card{background:#fffdfbe6;border:1px solid rgba(240,220,225,.95);box-shadow:0 24px 70px #a04f6321,0 3px 12px #502c3a0a;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}#player.card{overflow:hidden}#player>.row:first-child{padding-bottom:18px;border-bottom:1px solid var(--line)}#player>.row:first-child .muted,#player>.muted{color:var(--rose-dark);font-weight:800;letter-spacing:.08em}.lobby{position:relative;padding:58px 18px 48px;border-radius:22px;margin-top:22px;background:linear-gradient(135deg,#fff0f2,#fff8ed);border:1px solid #f7dce0}.lobby:after{content:"✦";position:absolute;top:18px;right:24px;color:#e6a5b2;font-size:24px}.lobby p:first-of-type{color:var(--ink);font-size:20px;font-weight:700}.question{padding-top:12px}.question h2{margin-top:12px;color:var(--ink)}.primary{background:linear-gradient(135deg,var(--rose),#d16b7c);box-shadow:0 10px 22px #b84d6833;transition:transform .14s var(--ease-out)}.primary:active:not(:disabled),.secondary:active:not(:disabled){transform:scale(.97)}.secondary{border:1px solid #f0d2d9;background:#fff7f5;color:var(--rose-dark);box-shadow:0 4px 12px #8c3d550f;transition:transform .14s var(--ease-out)}.option{border-color:#efdfe2;background:var(--paper);box-shadow:0 5px 14px #5c30400a;transition:transform .14s var(--ease-out)}.option:active{transform:scale(.985)}@media (hover: hover) and (pointer: fine){.primary:hover:not(:disabled),.secondary:hover:not(:disabled),.option:hover{transform:translateY(-1px)}}.option:focus{outline:none}.option:focus-visible{outline:3px solid rgba(184,77,104,.38);outline-offset:2px}.option.selected{border-color:var(--rose);background:var(--rose-soft);box-shadow:0 8px 18px #b84d681f}.question-image-frame{margin:20px 0 24px;border-radius:20px;overflow:hidden;background:#fff;border:1px solid #f1dfe4;box-shadow:0 12px 28px #502c3a1a}.question-image{display:block;width:100%;max-height:360px;object-fit:cover}.room-waiting{display:grid;gap:8px;text-align:center;background:linear-gradient(135deg,#fff2ee,#fff8eb)}.room-waiting:before{content:"⏳";display:block;font-size:36px}@media (max-width: 600px){.page{padding:30px 14px 44px}.card{border-radius:22px;padding:20px}.question-image{max-height:260px}}.player-view-enter{animation:wedding-view-enter .22s var(--ease-out) both}@keyframes wedding-view-enter{0%{opacity:0;transform:translateY(3%) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes wedding-fade-enter{0%{opacity:0}to{opacity:1}}@media (prefers-reduced-motion: reduce){.player-view-enter{animation:wedding-fade-enter .18s var(--ease-out) both}.primary,.secondary,.option{transition:opacity .12s ease}.primary:active:not(:disabled),.secondary:active:not(:disabled),.option:active{opacity:.82;transform:none}.primary:hover:not(:disabled),.secondary:hover:not(:disabled),.option:hover{transform:none}}.screen-participant-count{color:#f2b6a4;font-size:clamp(18px,2.8vw,30px);font-weight:800;margin-bottom:20px}.screen-participant-count strong{display:block;font-size:clamp(44px,6vw,72px);line-height:1}.screen-participant-count span{font-size:20px;font-weight:700}.secondary{background:#f6e8e4;color:#843f4c;padding:14px 18px;border-radius:14px;font-weight:800}.screen-mode .page{max-width:1200px}.screen-options div.correct{background:#244a3b;border:2px solid #62d09b;color:#8ce8ba}.screen-explanation{color:#f3cbbb;font-size:22px;margin-top:28px}.screen-leaderboard,.screen-center{max-width:820px;margin:7vh auto 0}.screen-leaderboard h1,.screen-center h1{font-size:clamp(34px,6vw,80px);margin:18px 0 44px}.screen-rank{display:grid;grid-template-columns:80px 1fr auto;gap:20px;align-items:center;padding:16px 22px;margin:10px 0;border-radius:16px;background:#332734;font-size:22px;text-align:left}.screen-rank span{color:#f2b6a4;font-weight:900}.screen-rank strong{color:#8ce8ba}@media (max-width: 600px){.screen-rank{grid-template-columns:52px 1fr auto;padding:12px;font-size:16px}}.nickname-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center}.nickname-field{display:grid;gap:8px}.nickname-row input{width:100%;min-width:0}.nickname-row .secondary{white-space:nowrap}@media (max-width: 420px){.nickname-row{grid-template-columns:1fr}.nickname-row .secondary{width:100%}}.screen-mode{color:#fff3ef;background:radial-gradient(circle at 12% 10%,rgba(209,107,124,.24),transparent 30%),radial-gradient(circle at 92% 88%,rgba(228,170,106,.17),transparent 32%),#17121c}.screen-mode:before{opacity:.12;background-image:radial-gradient(#f5c4bb .8px,transparent .8px);-webkit-mask-image:linear-gradient(#000,transparent 88%);mask-image:linear-gradient(#000,transparent 88%)}.screen-mode .page{max-width:1320px;min-height:100vh;padding:clamp(20px,4vw,58px)}.screen-card{position:relative;max-width:none;min-height:calc(100vh - clamp(40px,8vw,116px));margin:0;padding:clamp(28px,5vw,72px);border:1px solid rgba(255,214,204,.16);border-radius:34px;overflow:hidden;background:linear-gradient(145deg,#352234f5,#1b1421fa);box-shadow:0 30px 100px #00000061,inset 0 1px #ffffff0f}.screen-card:before{content:"✦  ✧  ✦";position:absolute;top:22px;right:28px;color:#f2b6a47a;letter-spacing:.65em;font-size:14px}.screen-top{position:relative;z-index:1;color:#ffdbd0b8;font-size:15px;letter-spacing:.12em}.screen-card h2{color:#ffe0d6;letter-spacing:-.03em}.screen-question{margin:clamp(40px,9vh,110px) auto 0}.screen-question h1{max-width:1040px;margin:18px auto 30px;color:#fff3ef;text-wrap:balance}.screen-answer-progress{display:inline-flex;align-items:baseline;gap:12px;margin:20px auto 4px;padding:10px 22px;border:1px solid rgba(242,182,164,.28);border-radius:999px;color:#f3cbbb;background:#fff7f112;font-size:clamp(16px,2vw,22px);font-weight:700}.screen-answer-progress strong{color:#ffd2c5;font-size:clamp(24px,3vw,38px);line-height:1}.screen-question-image-frame{max-width:680px;margin:0 auto 34px;border:1px solid rgba(255,218,209,.2);border-radius:22px;overflow:hidden;background:#fff8f514;box-shadow:0 18px 44px #00000047}.screen-question-image{display:block;width:100%;max-height:min(34vh,360px);object-fit:contain}.screen-options div{border:1px solid rgba(255,218,209,.1);background:linear-gradient(135deg,#4d3046eb,#302235eb);box-shadow:0 10px 24px #00000026}.screen-lobby{margin-top:clamp(34px,8vh,100px)}.screen-lobby-copy{padding:26px 30px;border-radius:24px;background:#fff7f10f;border:1px solid rgba(255,218,209,.13)}.screen-qr{box-shadow:0 20px 50px #0000004d}@media (max-width: 700px){.screen-card{border-radius:24px;padding:24px 18px}.screen-card:before{right:18px}.screen-lobby-copy{padding:20px}.screen-question-image{max-height:240px}}body.screen-mode{height:100dvh;min-height:100dvh;overflow:hidden}body.screen-mode .page{width:100%;max-width:none;height:100dvh;min-height:0;padding:clamp(12px,2.4vh,32px) clamp(16px,3vw,48px);display:flex}body.screen-mode .screen-card{width:100%;height:100%;min-height:0;margin:0;padding:clamp(18px,3.2vh,48px) clamp(20px,3.5vw,56px);display:flex;flex-direction:column}body.screen-mode .screen-card>.screen-top,body.screen-mode .screen-card>h2{flex:0 0 auto}body.screen-mode .screen-card>h2{margin:clamp(4px,1.2vh,12px) 0 0;font-size:clamp(20px,2.6vw,34px)}body.screen-mode .screen-leaderboard,body.screen-mode .screen-center{width:min(100%,860px);flex:1 1 auto;min-height:0;margin:clamp(10px,2vh,24px) auto 0;display:flex;flex-direction:column;justify-content:center}body.screen-mode .screen-leaderboard h1,body.screen-mode .screen-center h1{margin:clamp(4px,1.2vh,14px) 0 clamp(8px,1.8vh,20px);font-size:clamp(28px,5vw,64px)}body.screen-mode .screen-rank{min-height:0;margin:clamp(3px,.65vh,8px) 0;padding:clamp(7px,1.3vh,15px) clamp(14px,2vw,24px);font-size:clamp(16px,1.8vw,24px);line-height:1.15}body.screen-mode .screen-question{width:min(100%,1040px);flex:1 1 auto;min-height:0;margin:clamp(10px,4vh,44px) auto 0;display:flex;flex-direction:column;justify-content:center;overflow:hidden}body.screen-mode .screen-question h1{flex:0 1 auto;margin:clamp(8px,1.4vh,18px) auto clamp(10px,2vh,24px);font-size:clamp(28px,5.5vw,72px);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}body.screen-mode .screen-answer-progress{flex:0 0 auto;margin:clamp(4px,1vh,12px) auto}body.screen-mode .screen-question-image-frame{flex:0 1 auto;max-height:min(25vh,280px);margin:0 auto clamp(8px,1.8vh,20px)}body.screen-mode .screen-question-image{max-height:min(25vh,280px)}body.screen-mode .screen-options{flex:0 0 auto;gap:clamp(8px,1.5vh,16px)}body.screen-mode .screen-options div{padding:clamp(12px,1.8vh,22px);font-size:clamp(16px,2.1vw,24px)}body.screen-mode .screen-explanation{flex:0 1 auto;max-width:900px;margin:clamp(8px,1.6vh,18px) auto 0;font-size:clamp(14px,1.6vw,22px);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}body.screen-mode .screen-lobby{flex:1 1 auto;min-height:0;margin:0;display:flex;align-items:center;justify-content:center}body.screen-mode .screen-lobby-content{width:min(100%,1080px);max-height:100%;display:grid;grid-template-columns:minmax(220px,min(36vh,380px)) minmax(0,1fr);align-items:center;justify-content:center;gap:clamp(20px,4vw,56px)}body.screen-mode .screen-qr{width:min(36vh,34vw,380px);max-width:100%;max-height:48vh}body.screen-mode .screen-lobby-copy{min-width:0;max-width:none;padding:clamp(18px,2.5vh,30px)}body.screen-mode .screen-lobby-copy p{margin:clamp(8px,1.5vh,16px) 0;font-size:clamp(16px,2.1vw,26px)}@media (max-width: 700px){body.screen-mode .page{padding:0}body.screen-mode .screen-card{border-radius:0;padding:16px 14px}body.screen-mode .screen-lobby-content{grid-template-columns:minmax(0,1fr);gap:clamp(12px,2.5vh,24px);justify-items:center}body.screen-mode .screen-qr{width:min(55vw,240px);max-height:34vh}body.screen-mode .screen-lobby-copy{width:100%;padding:16px}body.screen-mode .screen-options{grid-template-columns:1fr}}@media (max-height: 700px){body.screen-mode .screen-card{padding-top:14px;padding-bottom:14px}body.screen-mode .screen-card:before{display:none}body.screen-mode .screen-rank{margin:2px 0;padding:6px 14px}body.screen-mode .screen-leaderboard h1{margin:4px 0 8px;font-size:clamp(34px,5vw,48px)}body.screen-mode .screen-question h1{-webkit-line-clamp:2}body.screen-mode .screen-options{gap:8px}body.screen-mode .screen-options div{padding:10px 14px}}.screen-view-enter{animation:wedding-screen-enter .26s var(--ease-out) both}.screen-leaderboard.screen-view-enter{animation:none}.screen-leaderboard.screen-view-enter>.muted,.screen-leaderboard.screen-view-enter>h1{animation:wedding-screen-enter .24s var(--ease-out) both}.screen-leaderboard.screen-view-enter .screen-rank{opacity:0;animation:wedding-rank-enter .26s var(--ease-out) forwards}.screen-leaderboard.screen-view-enter .screen-rank:nth-of-type(2){animation-delay:0ms}.screen-leaderboard.screen-view-enter .screen-rank:nth-of-type(3){animation-delay:50ms}.screen-leaderboard.screen-view-enter .screen-rank:nth-of-type(4){animation-delay:.1s}.screen-leaderboard.screen-view-enter .screen-rank:nth-of-type(5){animation-delay:.15s}.screen-leaderboard.screen-view-enter .screen-rank:nth-of-type(6){animation-delay:.2s}.screen-leaderboard.screen-view-enter .screen-rank:nth-of-type(7){animation-delay:.25s}.screen-progress-enter{animation:wedding-progress-enter .18s var(--ease-out) both}.screen-option-reveal{animation:wedding-correct-enter .22s var(--ease-out) both}.screen-celebration{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;overflow:hidden;pointer-events:none}.screen-card>h2,.screen-leaderboard{position:relative;z-index:1}.screen-firework{position:absolute;width:6px;height:6px}.firework-one{top:22%;left:17%}.firework-two{top:24%;right:16%}.firework-three{top:10%;left:50%}.screen-spark{position:absolute;top:0;right:0;bottom:0;left:0;width:6px;height:6px;border-radius:999px;background:#ffd991;box-shadow:0 0 12px #ffd991d1;opacity:0;animation:screen-firework-burst .9s var(--ease-out) both}.firework-two .screen-spark{background:#f2a9bd;box-shadow:0 0 12px #f2a9bdd1;animation-delay:.4s}.firework-three .screen-spark{background:#91e5c5;box-shadow:0 0 12px #91e5c5d1;animation-delay:.8s}.screen-spark:nth-child(1){--spark-x: 0%;--spark-y: -1800%}.screen-spark:nth-child(2){--spark-x: 1280%;--spark-y: -1280%}.screen-spark:nth-child(3){--spark-x: 1800%;--spark-y: 0%}.screen-spark:nth-child(4){--spark-x: 1280%;--spark-y: 1280%}.screen-spark:nth-child(5){--spark-x: 0%;--spark-y: 1800%}.screen-spark:nth-child(6){--spark-x: -1280%;--spark-y: 1280%}.screen-spark:nth-child(7){--spark-x: -1800%;--spark-y: 0%}.screen-spark:nth-child(8){--spark-x: -1280%;--spark-y: -1280%}.screen-confetti{--confetti-drift: 4vw;--confetti-turn: 540deg;position:absolute;top:-4%;width:7px;height:16px;border-radius:999px;background:#ffd991;opacity:0;animation:screen-confetti-fall 1.8s linear both}.screen-confetti:nth-of-type(odd){--confetti-drift: -4vw;--confetti-turn: -540deg;background:#f2a9bd}.screen-confetti:nth-of-type(3n){background:#91e5c5}.confetti-1{left:8%;animation-delay:40ms}.confetti-2{left:16%;animation-delay:.13s}.confetti-3{left:24%;animation-delay:.22s}.confetti-4{left:33%;animation-delay:70ms}.confetti-5{left:42%;animation-delay:.27s}.confetti-6{left:50%;animation-delay:.16s}.confetti-7{left:58%;animation-delay:20ms}.confetti-8{left:67%;animation-delay:.24s}.confetti-9{left:75%;animation-delay:.11s}.confetti-10{left:83%;animation-delay:.3s}.confetti-11{left:90%;animation-delay:.19s}.confetti-12{left:96%;animation-delay:80ms}@keyframes wedding-screen-enter{0%{opacity:0;transform:translateY(3%) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes wedding-rank-enter{0%{opacity:0;transform:translateY(12%) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes wedding-progress-enter{0%{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}@keyframes wedding-correct-enter{0%{opacity:.72;transform:scale(.97)}to{opacity:1;transform:scale(1)}}@keyframes screen-firework-burst{0%{opacity:0;transform:translate(0) scale(.95)}14%{opacity:1;transform:translate(0) scale(1)}to{opacity:0;transform:translate(var(--spark-x),var(--spark-y)) scale(.95)}}@keyframes screen-confetti-fall{0%{opacity:0;transform:translate3d(0,-100%,0) rotate(0)}10%,82%{opacity:1}to{opacity:0;transform:translate3d(var(--confetti-drift),82vh,0) rotate(var(--confetti-turn))}}@media (prefers-reduced-motion: reduce){.screen-celebration{display:none}.screen-view-enter,.screen-leaderboard.screen-view-enter>.muted,.screen-leaderboard.screen-view-enter>h1,.screen-leaderboard.screen-view-enter .screen-rank,.screen-progress-enter,.screen-option-reveal{animation-name:wedding-fade-enter;animation-duration:.18s;animation-delay:0ms;animation-timing-function:var(--ease-out)}}