:root{color-scheme:dark;--bg:#101825;--panel:#1c2737;--panel-soft:#233145;--line:rgba(220,235,251,.13);--text:#f5f5f1;--muted:#a6b5c8;--lime:#cdf16b;--peach:#ffa782;--blue:#8cc8fb;--radius:24px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:var(--bg);font-family:"Vazirmatn","Noto Sans Arabic",Tahoma,sans-serif;color:var(--text);line-height:1.65}button,input,select{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}button:disabled{cursor:not-allowed;opacity:.48}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid var(--lime);outline-offset:3px}::selection{background:var(--lime);color:#172018}.shell{position:relative;max-width:1352px;margin:auto;padding:0 38px;z-index:2}.ambient{position:fixed;pointer-events:none;border-radius:50%;filter:blur(80px);opacity:.38}.ambient-one{width:530px;height:530px;top:-280px;left:-130px;background:#3973a0}.ambient-two{width:430px;height:430px;bottom:-240px;right:-240px;background:#635567}.topbar{min-height:100px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);gap:16px}.wordmark{font-size:23px;font-weight:500;display:inline-flex;gap:14px;align-items:center;white-space:nowrap}.wordmark b{font-weight:900}.brand-mark{display:grid;grid-template-columns:repeat(2,8px);gap:3px;transform:rotate(-16deg)}.brand-mark i{display:block;width:8px;height:8px;border-radius:3px;background:var(--lime)}.brand-mark i:nth-child(2){background:var(--peach)}.brand-mark i:nth-child(3){background:var(--blue)}.topbar-side{display:flex;align-items:center;gap:20px}.live-dot{font-size:12px;color:var(--lime);border:1px solid rgba(205,241,107,.25);padding:6px 13px;border-radius:100px}.live-dot:before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--lime);margin-left:8px;box-shadow:0 0 12px var(--lime)}.admin-link{color:#b9c6d5;font-size:13px}.admin-link:hover{color:white}main{min-height:calc(100vh - 168px)}.entry{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(360px,.82fr);gap:7%;padding:80px 0 90px;align-items:center}.hero{position:relative;min-height:600px}.hero-overline,.eyebrow{color:var(--lime);font-size:13px;letter-spacing:.02em;font-weight:800}.sparkle{font-size:24px;margin-left:7px;vertical-align:-3px}.hero h1{font-size:clamp(50px,5.7vw,87px);line-height:1.28;letter-spacing:-.055em;font-weight:900;margin:30px 0 18px}.hero h1 em{font-style:normal;color:var(--lime)}.hero-desc{color:var(--muted);font-size:17px;max-width:495px;line-height:2.15}.mini-flow{display:flex;align-items:center;gap:13px;color:#d5dce4;font-size:13px;margin-top:34px;white-space:nowrap}.mini-flow b{color:var(--peach);font-weight:900;margin-left:5px}.flow-line{height:1px;width:32px;background:#627287}.hero-shape{height:215px;position:relative;margin-top:36px;max-width:470px;isolation:isolate}.hero-shape:before{content:"";position:absolute;inset:22px 10px 0;border-radius:50%;background:radial-gradient(ellipse,rgba(116,162,189,.14),transparent 68%)}.shape-card{position:absolute;border-radius:22px;border:1px solid rgba(255,255,255,.18);background:linear-gradient(140deg,#334662,#1b283b);box-shadow:0 18px 40px #090f1880;display:grid;place-items:center;font-size:58px}.shape-one{width:145px;height:165px;right:5%;top:12px;transform:rotate(12deg);color:var(--peach)}.shape-two{width:135px;height:155px;right:32%;top:42px;transform:rotate(-8deg);color:var(--lime)}.shape-three{width:124px;height:140px;right:62%;top:23px;transform:rotate(11deg);color:var(--blue)}.shape-core{position:absolute;right:45%;top:45px;font-size:32px;color:#fff}.entry-card,.room-panel,.result-panel{background:linear-gradient(145deg,rgba(39,54,73,.97),rgba(24,36,53,.97));border:1px solid var(--line);box-shadow:0 26px 75px rgba(0,0,0,.23);border-radius:30px}.entry-card{padding:34px 36px}.card-head h2{font-size:32px;letter-spacing:-.04em;margin:2px 0 0}.card-head p{font-size:14px;color:var(--muted);margin:5px 0 25px}.field{display:flex;flex-direction:column;gap:8px;font-size:13px;color:#d5e0ea;font-weight:700}.field input,.field select,.join-row input{border:1px solid rgba(223,239,255,.15);background:#152233;color:#f7f7f4;border-radius:13px;padding:13px 15px;width:100%;min-height:50px;outline:none}.field input::placeholder,.join-row input::placeholder{color:#7d91a6}.field input:focus,.field select:focus,.join-row input:focus{border-color:var(--lime);box-shadow:0 0 0 3px rgba(205,241,107,.10)}.field select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,#bed0df 50%),linear-gradient(135deg,#bed0df 50%,transparent 50%);background-position:16px 22px,10px 22px;background-size:6px 6px;background-repeat:no-repeat}.separator{display:flex;align-items:center;gap:13px;color:#c1cdd9;font-size:12px;margin:26px 0 19px;white-space:nowrap}.separator:after{content:"";height:1px;width:100%;background:var(--line)}.form-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}.availability{min-height:23px;margin:12px 0 18px;font-size:12px;color:#b9db97}.availability.warning{color:#ffb39b}.primary-button{width:100%;min-height:55px;display:flex;justify-content:center;align-items:center;gap:12px;background:var(--lime);color:#172418;border:0;border-radius:14px;font-weight:900;font-size:15px;box-shadow:0 8px 23px rgba(205,241,107,.13);transition:transform .2s,background .2s}.primary-button:hover:not(:disabled){transform:translateY(-2px);background:#e1ffa0}.primary-button span{font-size:20px}.join-row{display:flex;gap:8px}.join-row input{direction:ltr;text-align:center;letter-spacing:.09em;font-size:16px;font-weight:800;min-width:0;flex:1}.outline-button{background:transparent;color:#f1f6fc;border:1px solid rgba(218,232,247,.3);border-radius:13px;padding:0 19px;white-space:nowrap;font-weight:700}.outline-button:hover{background:#35445a}.card-footnote{color:#8295aa;font-size:11px;margin:24px 0 0}.footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:21px 0;color:#879bb0;font-size:12px;gap:20px}.toast{position:fixed;z-index:100;left:50%;transform:translateX(-50%);top:23px;max-width:min(90vw,480px);background:#e6fbb7;color:#233322;padding:13px 20px;border-radius:13px;box-shadow:0 15px 35px #0006;font-weight:700;text-align:center}.toast.error{background:#ffcdbe;color:#4c2426}.toast[hidden],section[hidden]{display:none!important}.room-view{padding:48px 0 95px}.back-link{border:0;background:transparent;color:#c7d7e5;font-size:13px;padding:7px 0;margin-bottom:22px}.back-link:hover{color:white}.room-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:30px}.room-heading h1{font-size:clamp(31px,4vw,53px);line-height:1.45;letter-spacing:-.04em;margin:8px 0 0}.room-heading p{color:var(--muted);margin:4px 0 0}.phase-tag{display:inline-flex;padding:8px 14px;border-radius:99px;color:var(--lime);background:#c5ee6021;font-size:12px;font-weight:800}.room-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(270px,.6fr);gap:23px}.room-panel{padding:28px}.room-panel h2{margin:0 0 10px;font-size:22px}.room-panel p{color:var(--muted)}.room-code{direction:ltr;letter-spacing:.16em;font-size:clamp(32px,5vw,58px);font-weight:900;line-height:1.2;color:var(--lime);padding:22px 0;text-align:center}.copy-line{display:flex;gap:9px;flex-wrap:wrap}.copy-line button,.soft-button{border:1px solid #8293a962;background:#293a50;color:#f7f8f4;padding:11px 15px;border-radius:12px;font-weight:700}.copy-line button:hover,.soft-button:hover{background:#394e67}.people{display:grid;gap:11px;margin:15px 0}.person{display:flex;align-items:center;gap:10px;padding:10px 12px;background:#182638;border:1px solid rgba(255,255,255,.07);border-radius:13px}.avatar{display:grid;place-items:center;width:39px;height:39px;flex:none;border-radius:12px;background:#556d8b;color:#fff;font-weight:900}.person:nth-child(3n+2) .avatar{background:#795f80}.person:nth-child(3n+3) .avatar{background:#657347}.person-info{display:flex;flex-direction:column;min-width:0}.person-info strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.person-info small{color:#9aacbd}.person-meta{margin-right:auto;color:#b1c2d1;font-size:12px;white-space:nowrap}.room-panel .primary-button{margin-top:18px}.hint-box{border:1px dashed #65819a88;border-radius:14px;padding:16px;margin-top:22px;font-size:13px;color:#b8cad9;background:#23354b77}.question-layout{display:grid;grid-template-columns:minmax(0,1fr) 265px;gap:22px}.question-main{min-width:0}.progress-label{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px;color:var(--muted);margin-bottom:10px}.progress-track{height:7px;border-radius:99px;background:#334055;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,var(--blue),var(--lime));border-radius:99px;transition:width .35s}.question-heading{font-size:clamp(28px,3.6vw,48px);line-height:1.65;letter-spacing:-.035em;margin:25px 0 7px}.question-sub{color:var(--muted);font-size:14px;margin:0 0 21px}.options-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.option-card{position:relative;text-align:right;border:2px solid #ffffff1f;background:#213147;border-radius:22px;padding:9px;overflow:hidden;color:var(--text);transition:transform .17s,border-color .17s,box-shadow .17s}.option-card:hover{transform:translateY(-3px);border-color:#b9dc84}.option-card.selected{border-color:var(--lime);box-shadow:0 0 0 3px #c9ee6c2e}.option-card img{display:block;width:100%;aspect-ratio:1/1;object-fit:contain;background:#fff;border-radius:14px}.option-footer{display:flex;align-items:center;justify-content:space-between;padding:10px 5px 2px;gap:10px;color:#d8e3ee;font-weight:700;font-size:13px}.choice-letter{display:grid;place-items:center;width:25px;height:25px;border-radius:7px;background:#39506b;color:white}.option-card.selected .choice-letter{background:var(--lime);color:#1a2925}.chosen-check{font-size:19px;color:var(--lime);visibility:hidden}.option-card.selected .chosen-check{visibility:visible}.confirm-row{position:sticky;bottom:16px;margin-top:18px;z-index:5}.confirm-row .primary-button{max-width:380px;margin-right:auto}.aside-stack{display:grid;gap:17px;align-content:start}.aside-stack .room-panel{padding:21px}.aside-stack .room-panel h2{font-size:16px}.waiting-finish{max-width:740px;margin:60px auto;text-align:center}.waiting-finish .big-icon{font-size:67px;color:var(--lime);line-height:1.3}.waiting-finish h1{font-size:38px;margin:8px 0}.waiting-finish p{color:var(--muted)}.result-intro{max-width:680px;margin-bottom:28px}.result-intro h1{font-size:clamp(35px,5vw,64px);letter-spacing:-.06em;margin:8px 0}.result-intro h1 span{color:var(--lime)}.result-intro p{color:var(--muted);line-height:2}.result-panel{padding:27px;overflow:auto}.result-panel table{width:100%;border-spacing:8px;min-width:520px;text-align:center}.result-panel th{font-size:13px;color:#becbd7;padding:7px;white-space:nowrap}.result-panel tbody th{text-align:right}.heat{min-width:90px;height:75px;border-radius:12px;background:rgba(205,241,107,calc(.08 + var(--heat)*.48));color:white;font-weight:900;font-size:24px}.heat small{display:block;font-size:10px;color:#c1d4cb;font-weight:400}.heat.self{background:#334554;color:var(--lime)}.result-actions{margin-top:24px;display:flex;gap:10px}.result-actions .primary-button{width:auto;min-width:210px}.stats-mini{display:flex;gap:12px;flex-wrap:wrap;color:#bdd1dc;font-size:13px;margin:15px 0}.stats-mini span{background:#34475b;padding:6px 12px;border-radius:99px}@media(max-width:1000px){.entry{gap:4%;grid-template-columns:1fr 400px}.hero{min-height:550px}.hero h1{font-size:56px}.hero-shape{opacity:.8}.question-layout{grid-template-columns:minmax(0,1fr) 225px}}@media(max-width:760px){.shell{padding:0 18px}.topbar{min-height:75px}.wordmark{font-size:19px}.live-dot{display:none}.entry{grid-template-columns:1fr;padding:32px 0 56px;gap:23px}.hero{min-height:auto}.hero h1{font-size:clamp(47px,10vw,70px);margin:15px 0 8px}.hero-desc{font-size:14px;line-height:1.9}.hero-shape{display:none}.mini-flow{margin-top:20px;gap:9px;font-size:11px}.flow-line{width:16px}.entry-card{padding:25px 20px;border-radius:23px}.footer{display:block;text-align:center}.footer span+span{display:none}.room-view{padding-top:27px}.room-heading{display:block}.room-heading h1{font-size:32px}.phase-tag{margin-top:12px}.room-grid,.question-layout{grid-template-columns:1fr}.room-panel{padding:20px}.question-layout .aside-stack{grid-row:1;grid-template-columns:1fr}.question-layout .aside-stack .room-panel:last-child{display:none}.question-heading{font-size:30px;margin-top:18px}.options-grid{gap:9px}.option-card{border-radius:15px;padding:6px}.option-card img{border-radius:9px}.option-footer{font-size:12px}.result-panel{padding:12px}.result-panel table{min-width:490px}.confirm-row{position:static}.confirm-row .primary-button{max-width:none}.room-code{font-size:40px}}@media(max-width:390px){.join-row{flex-direction:column}.join-row .outline-button{height:44px}.mini-flow{font-size:10px}.hero h1{font-size:44px}.option-footer{font-size:10px}}.topic-field{margin-top:12px}.pair-highlight{display:flex;align-items:center;justify-content:space-between;gap:15px;border:1px solid rgba(205,241,107,.35);background:linear-gradient(100deg,rgba(205,241,107,.15),rgba(140,200,251,.10));border-radius:22px;padding:20px 28px;margin:22px 0}.pair-highlight strong{font-size:clamp(45px,7vw,78px);line-height:1;color:var(--lime);white-space:nowrap}.pair-highlight p{color:#ccd6d8;margin:4px 0}.muted-hint{color:var(--muted);font-size:13px}.result-panel.two-person table{min-width:0}@media(max-width:760px){.question-layout .aside-stack{grid-row:2;grid-template-columns:1fr}.pair-highlight{padding:16px 18px}.pair-highlight strong{font-size:47px}.result-panel.two-person table{min-width:0;border-spacing:3px}.result-panel.two-person th{font-size:11px;padding:3px;white-space:normal}.result-panel.two-person .heat{min-width:58px;height:63px;font-size:18px}.result-panel.two-person .heat small{font-size:9px}}@media(max-width:760px){.options-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.mode-picker{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 16px}.mode-card{display:flex;align-items:center;gap:10px;padding:13px;border:1px solid var(--line);border-radius:13px;background:#152233;cursor:pointer}.mode-card:has(input:checked){border-color:var(--lime);background:#324636}.mode-card input{width:18px;height:18px;accent-color:var(--lime);flex:none}.mode-card span{display:flex;flex-direction:column;min-width:0}.mode-card strong{font-size:14px}.mode-card small{font-size:11px;color:var(--muted);line-height:1.6}.mode-note{font-size:12px;color:var(--muted);margin:10px 0 0}.mode-note[hidden]{display:none}.stage-note{border:1px solid rgba(205,241,107,.35);background:#bde36b14;color:#e9f6d5;border-radius:13px;padding:11px 15px;margin:15px 0}.stage-actions{display:flex;gap:12px;align-items:center;margin-top:16px}.stage-actions .primary-button{max-width:380px;margin-right:auto}.stage-actions .soft-button{white-space:nowrap}.recognition-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:24px 0}.recognition-card{padding:26px;border-radius:23px;background:linear-gradient(140deg,#30455c,#1d2b40);border:1px solid var(--line)}.recognition-card.mine{border-color:rgba(205,241,107,.55)}.recognition-card h2{font-size:20px;margin:8px 0}.recognition-card strong{display:block;font-size:clamp(48px,7vw,76px);line-height:1.15;color:var(--lime)}.recognition-card p{color:var(--muted);margin:8px 0 0}@media(max-width:760px){.mode-picker,.recognition-grid{grid-template-columns:1fr}.stage-actions{flex-direction:column-reverse}.stage-actions .primary-button,.stage-actions .soft-button{width:100%;max-width:none}.mode-card{padding:11px}}

/* 2026 visual refresh */
@font-face{font-family:Vazirmatn;src:url('/static/fonts/Vazirmatn.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:VazirmatnRound;src:url('/static/fonts/Vazirmatn-RD.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
:root{color-scheme:light;--bg:#f7f4ec;--panel:#fffdf8;--panel-soft:#f1ecff;--line:#e5dff1;--text:#20203e;--muted:#64657e;--lime:#7551dc;--peach:#ff786e;--blue:#5589ec;--purple:#6742d6;--purple-deep:#432396;--pink:#ff816e;--mint:#c6efcf}
body{background:radial-gradient(circle at 15% 10%,#e7ddff 0,transparent 30%),radial-gradient(circle at 90% 37%,#ffe3d7 0,transparent 30%),var(--bg);font-family:Vazirmatn,Tahoma,sans-serif;line-height:1.7;color:var(--text)}
button,input,select{font-family:Vazirmatn,Tahoma,sans-serif}
h1,h2,.wordmark,.room-code,.recognition-card strong,.pair-highlight strong{font-family:VazirmatnRound,Vazirmatn,Tahoma,sans-serif}
button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid var(--purple);outline-offset:3px}
::selection{background:#d7c8ff;color:#29105b}
.ambient{filter:blur(66px);opacity:.55}.ambient-one{background:#d4c0ff}.ambient-two{background:#ffcaba}
.topbar{border-bottom:1px solid #d7cde5;min-height:86px}.wordmark{font-size:25px;font-weight:750;letter-spacing:-.035em}.wordmark b{color:var(--purple);font-weight:900}
.brand-mark{grid-template-columns:repeat(2,9px);gap:4px}.brand-mark i{width:9px;height:9px;border-radius:4px;background:#7c56e2}.brand-mark i:nth-child(2){background:#ff8373}.brand-mark i:nth-child(3){background:#fecb60}.brand-mark i:nth-child(4){background:#4fc9ab}
.admin-link{color:#716689;font-weight:750;border:1px solid #d9cdec;border-radius:100px;padding:8px 14px;background:#fff9}.admin-link:hover{color:var(--purple);background:#fff}
.entry{gap:8%;padding:65px 0 95px;align-items:start}.hero{padding-top:43px;min-height:625px}
.hero-overline{display:inline-flex;align-items:center;padding:8px 17px;border-radius:100px;background:#fff;color:#6f49d8;box-shadow:0 8px 25px #6c45b211;font-size:13px;font-weight:850}
.sparkle{color:#ff806e;font-size:21px}.hero h1{font-size:clamp(61px,5.8vw,90px);line-height:1.35;letter-spacing:-.065em;margin:27px 0 14px;color:#252248}
.hero h1 em{color:#7550df;font-style:normal}.hero-desc{font-size:18px;line-height:2.05;color:#575675;max-width:450px;margin:0}
.hero-shape{height:245px;margin-top:36px;max-width:470px}.hero-shape:before{background:radial-gradient(ellipse,#9c72eb27,transparent 70%)}
.shape-card{border:2px solid #fff;box-shadow:0 18px 32px #4b337033;border-radius:25px;font-size:60px}
.shape-one{background:#ff8878;color:white}.shape-two{background:#7651dc;color:white}.shape-three{background:#ffcf63;color:#492b80}.shape-core{color:#492b80;right:45%;font-weight:900}
.entry-card,.room-panel,.result-panel{background:#fffdfb;border:1px solid #e9e2ef;box-shadow:0 24px 60px #59458517;border-radius:27px}
.entry-card{padding:32px 34px;border-top:5px solid #7853dc}.card-head h2{font-size:33px;margin:2px 0 0;letter-spacing:-.04em}.card-head p{font-size:14px;color:var(--muted);margin:4px 0 21px}
.eyebrow{color:var(--purple);font-weight:900;font-size:13px}.field{color:#37344d;font-weight:800;gap:5px}
.field input,.field select,.join-row input{background:#f9f7ff;color:#292545;border:1.5px solid #ded5ed;border-radius:13px;min-height:50px;padding:11px 14px}
.field input::placeholder,.join-row input::placeholder{color:#9390a7}.field input:focus,.field select:focus,.join-row input:focus{border-color:#8968e6;box-shadow:0 0 0 3px #8b66e625}
.field input:disabled{background:#eeeaf5;color:#817996}
.separator{color:#8a819d;margin:22px 0 14px}.separator:after{background:#e9e2ed}
.mode-picker{gap:9px}.mode-card{background:#faf8ff;border:1.5px solid #e4dcef;border-radius:15px;padding:13px;transition:border-color .15s,transform .15s,background .15s}
.mode-card:hover{transform:translateY(-2px);border-color:#b49cea}.mode-card:has(input:checked){border-color:#805be0;background:#efe8ff;box-shadow:inset 0 0 0 1px #805be0}.mode-card input{accent-color:var(--purple);width:19px;height:19px}
.mode-card strong{color:#30254d;font-weight:900;font-size:14px}.mode-card small{color:#706987;font-size:11px}
.mode-note{color:#6d608d}.availability{color:#70618d;font-weight:700;margin:9px 0 15px}.availability.warning{color:#bd4754}
.primary-button{background:#7046d8;color:white;border-radius:14px;box-shadow:0 10px 22px #734ad72c;font-weight:900;min-height:53px;transition:transform .18s,box-shadow .18s,background .18s}
.primary-button:hover:not(:disabled){background:#5a32bf;box-shadow:0 13px 24px #734ad746;transform:translateY(-2px)}
.outline-button{color:#5e3fb5;background:#fff;border:1.5px solid #a993e2}.outline-button:hover{background:#f2ebff}.card-footnote{color:#8a819a;margin-top:16px}
.footer{border-color:#d9cee9;color:#77708d}.toast{background:#e6dcff;color:#442688;box-shadow:0 12px 30px #4b348830}.toast.error{background:#ffe3e0;color:#9a3742}
.back-link{color:#685788;font-weight:800}.back-link:hover{color:#432396}
.room-heading h1{color:#292345}.room-heading p{color:#726b85}
.phase-tag{color:#5e3abb;background:#e9dfff;border:1px solid #d9c8ff;white-space:normal}
.room-panel h2{color:#30244c}.room-panel p{color:#676079}
.room-code{color:#6844c7;letter-spacing:.13em;background:#f3eeff;border:1px dashed #c8b5f5;border-radius:18px;margin:15px 0 20px;padding:18px 7px}
.copy-line button,.soft-button{background:#f2edff;color:#5b3cae;border:1px solid #d5c6f6;border-radius:12px;font-weight:850}.copy-line button:hover,.soft-button:hover{background:#e9ddff}
.hint-box{background:#f5f0ff;border:1px solid #e2d5ff;color:#645289;border-radius:14px}
.person{background:#f8f6fd;border:1px solid #eee8f5}.avatar{background:#7956db;color:white}.person:nth-child(3n+2) .avatar{background:#f3857c}.person:nth-child(3n+3) .avatar{background:#4aab9e}
.person-info small,.person-meta{color:#79708e}.person-info strong{color:#28233e}
.progress-label{color:#6a6280}.progress-track{background:#e6def3;height:8px}.progress-fill{background:linear-gradient(90deg,#ff9578,#7d50df)}
.question-heading{line-height:1.45;color:#2c234c}.question-sub{color:#66617a}.stage-note{border:1px solid #ddcaf9;background:#f2ebff;color:#6345a5}
.option-card{border:2px solid #e4dcef;background:#fff;border-radius:19px;color:#2d2945;box-shadow:0 8px 22px #49307410}
.option-card:hover{border-color:#c4a6f5;box-shadow:0 12px 24px #6343a225}.option-card.selected{border-color:#7550dc;box-shadow:0 0 0 4px #8055da28,0 14px 24px #5c38ba20;background:#f5efff}
.option-card img{background:#fff;border-radius:12px}.option-footer{color:#625877;font-weight:800}.choice-letter{background:#eee8fc;color:#6b48c8;font-weight:900}.option-card.selected .choice-letter{background:#7450dd;color:#fff}.chosen-check{color:#6941cd}
.waiting-finish .big-icon{color:#8a5bd9}.waiting-finish p{color:#69617e}
.result-intro h1{color:#292246}.result-intro h1 span{color:#7351d4}.result-intro p{color:#665d7b}
.stats-mini{color:#5e4b87}.stats-mini span{background:#ede6ff;border:1px solid #e0d5fa;color:#5e41ad;font-weight:800}
.pair-highlight{border:1px solid #dbcafa;background:linear-gradient(100deg,#eee6ff,#ffe7da);box-shadow:0 12px 35px #7858bb15}.pair-highlight strong{color:#633cc4}.pair-highlight p{color:#655779}
.result-panel th{color:#685f7c}.heat{background:rgba(115,81,212,calc(.08 + var(--heat)*.25));color:#3e2582}.heat small{color:#685a7e}.heat.self{background:#eee8f7;color:#6646af}
.recognition-card{background:#fff;border:1px solid #e6dcf0;box-shadow:0 15px 35px #49347e13}.recognition-card.mine{border-color:#9a75eb;background:linear-gradient(145deg,#f3edff,#fffdfb)}.recognition-card h2{color:#332951}.recognition-card strong{color:#6a41cb}.recognition-card p{color:#6e6583}
@media(max-width:1000px){.entry{grid-template-columns:minmax(0,1fr) minmax(360px,410px);gap:4%}.hero{min-height:550px}.hero h1{font-size:59px}}
@media(max-width:760px){.topbar{min-height:73px}.wordmark{font-size:21px}.admin-link{font-size:11px;padding:6px 9px}
.entry{display:grid;grid-template-columns:1fr;padding:26px 0 58px;gap:30px}.hero{padding-top:0;min-height:auto}.hero h1{font-size:clamp(48px,11vw,66px);margin:16px 0 9px}.hero-desc{font-size:14px;line-height:1.85}.hero-shape{display:none}.entry-card{padding:23px 20px;border-radius:22px}.card-head h2{font-size:29px}
.room-view{padding-top:27px}.room-heading h1{font-size:34px}.room-panel{padding:20px}.question-layout .aside-stack{grid-row:2}.question-heading{font-size:27px}.options-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.option-card{border-radius:15px;padding:6px}.option-card img{border-radius:10px}.option-footer{font-size:12px}.stage-actions .primary-button{max-width:none}
.result-panel.two-person .heat{min-width:58px}.recognition-grid{grid-template-columns:1fr}.recognition-card{padding:22px}
}
@media(max-width:390px){.hero h1{font-size:45px}.mode-card{padding:9px}.mode-card strong{font-size:13px}.mode-card small{font-size:10px}}
.room-facts{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.room-facts span{background:#eee6ff;color:#5e3dac;border:1px solid #e0d2ff;border-radius:100px;padding:6px 12px;font-size:13px;font-weight:800}

/* Room and guest exit controls */
.topbar-side{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.logout-game{border:1px solid #e5d5e9;border-radius:100px;background:#fff7f4;color:#a04f66;padding:8px 14px;font-size:13px;font-weight:800}
.logout-game:hover{background:#ffece9;border-color:#eeb5bd}
.back-link{display:inline-flex;align-items:center;min-height:40px;padding:7px 14px;border:1px solid #eacbd7;border-radius:100px;background:#fff9fa;color:#a04767;margin-bottom:22px}
.back-link:hover{background:#ffe7eb;color:#823653}
@media(max-width:760px){.topbar-side{gap:5px}.logout-game{font-size:11px;padding:6px 9px}}
@media(max-width:420px){.topbar{flex-wrap:wrap;justify-content:center;padding:13px 0;gap:7px}.wordmark{font-size:17px}.topbar-side{justify-content:center;width:100%}.logout-game{font-size:10px;padding:6px 8px}}

/* Third result metric compares the players' actual choices. */
.similarity-card{grid-column:1/-1;text-align:center;background:linear-gradient(120deg,#f2eaff,#fff4e9);border-color:#d6c0f6}
.similarity-card strong{color:#5933bd}

/* Direct invites and host approval */
.share-button{background:#7046d8!important;color:#fff!important;border-color:#7046d8!important}
.share-button:hover{background:#5a32bf!important}
.share-options{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.share-options[hidden],#inviteCard[hidden]{display:none!important}
.share-options a,.share-options button{display:inline-flex;align-items:center;border:1px solid #d5c6f6;border-radius:11px;background:#f6f1ff;color:#56339e;font-size:13px;font-weight:800;padding:9px 14px}
.room-panel h3{margin:24px 0 10px;color:#392955;font-size:17px}
.room-panel h2 span{color:var(--purple)}
.requests-list{display:grid;gap:9px}
.join-request{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:12px;border:1px solid #e6def2;background:#f8f5ff;border-radius:13px}
.join-request strong{min-width:0;overflow-wrap:anywhere;color:#2e2447}
.join-request span{font-size:12px;color:var(--muted);margin-left:auto}
.join-request button{border:1px solid #d6c6e8;background:#fff;border-radius:10px;padding:7px 11px;font-weight:800;color:#6646aa}
.join-request .approve-request{background:#7046d8;border-color:#7046d8;color:#fff}
.join-request .reject-request{color:#a04f66}
.entry.invited{display:block;max-width:500px;margin:auto;padding-top:55px}
.entry.invited .hero,.entry.invited .card-head,.entry.invited .separator,.entry.invited .mode-picker,.entry.invited .form-pair,.entry.invited .topic-field,.entry.invited #modeNote,.entry.invited #availability,.entry.invited #create,.entry.invited .join-row{display:none}
.invite-card h2{font-size:30px;margin:6px 0;color:#32244f}
.invite-card p{color:var(--muted);margin:0}
.invite-card .room-code{font-size:34px;margin:20px 0}
.invite-back{display:block;margin:15px auto 0;border:0;background:transparent;color:#6847b6;font-weight:800}
@media(max-width:760px){.entry.invited{padding-top:28px}.join-request span{width:100%;margin:0}.join-request button{flex:1}}

/* Four-choice rounds use a balanced two-by-two layout. */
.options-grid.four-options{grid-template-columns:repeat(2,minmax(0,1fr));max-width:760px}
@media(max-width:760px){.options-grid.four-options{max-width:none}}

/* Keep the room invite action visible above the room content. */
.room-heading-actions{display:flex;flex-direction:column;align-items:flex-start;gap:9px;flex:none}
.room-heading-actions .share-button{border:1px solid #7046d8;border-radius:14px;background:#7046d8;color:#fff;font-size:16px;font-weight:900;padding:12px 20px;box-shadow:0 10px 22px #734ad72c;white-space:nowrap}
.room-heading-actions .share-button:hover{background:#5a32bf}
.room-view>.share-options{margin:0 0 22px;padding:14px;border-radius:17px;border:1px solid #decff6;background:#fffdfb;box-shadow:0 10px 28px #59458515}
@media(max-width:760px){.room-heading-actions{align-items:stretch;margin-top:12px}.room-heading-actions .share-button{width:100%}.room-heading-actions .phase-tag{align-self:flex-start}}

.public-queues{display:grid;gap:10px}.public-queues-note{font-size:12px;color:var(--muted);margin:-5px 0 2px}
.public-rooms-list{display:grid;gap:9px}.public-room-card{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px;border:1px solid #e3d9f1;background:#faf8ff;border-radius:15px}
.public-room-card>div{min-width:0;display:grid;gap:3px}.public-room-card strong{font-size:14px;color:#30244c}.public-room-card small{font-size:11px;line-height:1.7;color:#736b83}
.public-join-button{flex:none;border:0;border-radius:11px;background:#7046d8;color:#fff;font:inherit;font-size:12px;font-weight:850;padding:9px 13px;cursor:pointer}.public-join-button:hover{background:#5a32bf}
@media(max-width:390px){.public-room-card{align-items:stretch;flex-direction:column}.public-join-button{width:100%}}
.result-analysis{display:grid;gap:18px;margin:30px 0}.result-analysis h2{font-size:27px;margin:0}
.analysis-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}
.analysis-stat,.analysis-box,.analysis-all,.analysis-round{background:#fff;border:1px solid #e7dbf4;border-radius:18px;padding:16px}
.analysis-stat{display:grid;gap:8px}.analysis-stat small{color:#75678c}.analysis-stat strong{color:#4c2d8d;font-size:17px}
.analysis-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.analysis-box h3{margin:0 0 14px}
.analysis-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(85px,1fr));gap:8px}
.analysis-options figure{margin:0}.analysis-options img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px}
.analysis-options figcaption{font-size:12px;text-align:center}.analysis-box ol{line-height:2}.analysis-all summary,.analysis-round summary{cursor:pointer;font-weight:800;color:#513594}.analysis-round{margin:9px 0}
.account-link{border:1px solid #d5c6f6;border-radius:100px;padding:8px 14px;color:#56339e;font-size:13px;font-weight:800;text-decoration:none}
@media(max-width:700px){.analysis-columns{grid-template-columns:1fr}}
.room-chat-dock{position:fixed;left:18px;bottom:18px;z-index:80;max-width:min(400px,calc(100vw - 24px));direction:rtl}
.room-chat-dock[hidden],.room-chat-panel[hidden]{display:none}
.room-chat-toggle{border:0;border-radius:100px;padding:12px 20px;background:#7046d8;color:white;font:inherit;font-weight:900;box-shadow:0 8px 28px #422c8855;cursor:pointer}
.room-chat-panel{margin-bottom:10px;padding:16px;border:1px solid #d8caed;border-radius:20px;background:#fff;box-shadow:0 10px 40px #39245b44;min-width:min(360px,calc(100vw - 24px))}
.room-chat-panel h2{margin:0 0 10px;font-size:18px}.room-chat-messages{height:235px;overflow:auto;display:grid;align-content:start;gap:7px;border:1px solid #eee7f5;border-radius:12px;padding:10px}
.room-chat-line{display:flex;gap:9px;align-items:baseline;padding:6px;border-radius:9px;background:#f9f6ff;overflow-wrap:anywhere}
.room-chat-line strong{color:#513595;white-space:nowrap;font-size:12px}.room-chat-line span{font-size:13px}
.room-chat-presets{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;max-height:115px;overflow:auto}
.room-chat-presets button{font:inherit;font-size:13px;padding:6px 10px;background:#f1eafe;border:1px solid #dacdf1;border-radius:100px;cursor:pointer}
@media(max-width:600px){.room-chat-dock{left:10px;bottom:10px}.room-chat-panel{min-width:min(320px,calc(100vw - 20px))}}

.entry-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:5px;margin:18px 0 8px;background:#f1ebfa;border-radius:14px}
.entry-tabs button{border:0;background:transparent;color:#665c77;border-radius:10px;padding:10px;font-weight:850}
.entry-tabs button[aria-selected="true"]{color:#4d2a99;background:white;box-shadow:0 2px 9px #5936a625}
#privateControls[hidden],#publicControls[hidden]{display:none!important}
.entry.invited .entry-tabs,.entry.invited #privateControls,.entry.invited #publicControls{display:none!important}
.public-room-card .queue-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.public-room-card .queue-code{font:800 13px ui-monospace,monospace;letter-spacing:.07em;direction:ltr;unicode-bidi:isolate;color:#51359c}
.public-room-card .queue-share{border:1px solid #d8c8f5;border-radius:10px;padding:8px 10px;color:#51359c;background:#fff;font-size:12px;font-weight:800}
@media(max-width:600px){.public-room-card{align-items:stretch;flex-direction:column}.public-room-card .queue-actions{justify-content:space-between}}

.preparing-panel{max-width:650px;margin:35px auto;text-align:center;padding:34px}
.preparing-panel h1{font-size:clamp(27px,5vw,42px);margin:13px 0}
.preparing-panel>p{color:var(--muted)}
.preparing-progress{height:9px;background:#eee8f7;border-radius:99px;overflow:hidden;margin:25px 0 8px}
.preparing-progress span{display:block;height:100%;background:linear-gradient(90deg,#a681fa,#cdf16b);border-radius:99px}
.preparing-count{color:#5935ae;font-size:18px}
.similarity-list{display:grid;gap:8px;max-height:500px;overflow:auto}
.similarity-row{display:grid;grid-template-columns:40px minmax(100px,1fr) auto;align-items:center;gap:4px 12px;border:1px solid #e9e0f4;background:#fbf9fe;padding:9px;border-radius:12px}
.similarity-row .avatar{grid-row:span 2}
.similarity-row strong{color:#5631aa;font-size:18px}
.similarity-row small{grid-column:2 / 4;color:#746b83}
.result-image-card{min-width:100px;max-width:180px;margin:0;padding:7px;background:#f8f6fc;border:1px solid #eee8f4;border-radius:12px}
.result-image-card img{width:100%;aspect-ratio:1;object-fit:contain;border-radius:8px;background:white}
.result-image-card figcaption{font-size:12px;line-height:1.8;color:#4f4265;text-align:center}
.agreement-cards{display:grid;gap:12px}.agreement-cards .analysis-box{padding:12px}
.agreement-cards h3{font-size:15px}
@media(max-width:760px){.result-image-card{max-width:150px}.similarity-row{grid-template-columns:36px minmax(80px,1fr) auto}}

.person .avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover}.person-info a,.similarity-name a{color:inherit;text-decoration:underline;text-decoration-color:#a999ba;text-underline-offset:3px}

.sound-toggle{font:inherit;cursor:pointer;border:1px solid #dfd0ee;color:#533778;background:#fff9;border-radius:999px;padding:8px 13px;white-space:nowrap}.sound-toggle:focus-visible{outline:3px solid #9f77cc;outline-offset:2px}@media(max-width:600px){.sound-toggle{font-size:12px;padding:6px 9px}}

.entry-avatars{margin:12px 0;border:1px solid #e2d7f3;border-radius:15px;background:#fffdfd;padding:12px}.entry-avatars summary{cursor:pointer;display:flex;align-items:center;gap:10px;font-weight:800;color:#52388a}.entry-avatars summary img{width:35px;height:35px;object-fit:cover;border-radius:50%}.entry-avatar-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(58px,1fr));gap:8px;max-height:260px;overflow:auto;margin:14px 0}.entry-avatar-choice{padding:0;border:2px solid transparent;border-radius:13px;background:#fff;cursor:pointer}.entry-avatar-choice.selected{border-color:#7849cc}.entry-avatar-choice img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:11px}.entry-avatars p{font-size:12px;color:#716983}

.room-chat-presets{display:grid;gap:10px;max-height:210px}.room-chat-group h3{font-size:12px;color:#675587;margin:0 0 4px}.room-chat-group>div{display:flex;flex-wrap:wrap;gap:5px}

/* Matchi logo palette and Persian typography */
@font-face{font-family:Estedad;src:url('/static/fonts/Estedad-VF.ttf') format('truetype');font-weight:100 900;font-style:normal;font-display:swap}
:root{--bg:#f7f9ff;--panel:#fff;--panel-soft:#e6f3ff;--line:#dce5f4;--text:#171a38;--muted:#65718d;--lime:#087be8;--peach:#f32da4;--blue:#08bce8;--purple:#087be8;--purple-deep:#1252c6;--pink:#f32da4;--mint:#aef5ee}
body,button,input,select{font-family:Estedad,Tahoma,sans-serif}
body{background:radial-gradient(circle at 12% 12%,#dceeff 0,transparent 32%),radial-gradient(circle at 92% 48%,#ffe0f2 0,transparent 28%),var(--bg)}
h1,h2,.wordmark,.room-code,.recognition-card strong,.pair-highlight strong{font-family:Estedad,Tahoma,sans-serif}
.topbar{background:linear-gradient(120deg,#d9efff,#f4e9ff 56%,#ffe5f5);border:1px solid #d4e5f7;border-radius:25px;padding:6px 18px;margin-top:12px;min-height:84px;box-shadow:0 13px 30px #171a381c}
.wordmark{display:inline-flex;align-items:center}.brand-logo{width:68px;height:68px;object-fit:contain;border-radius:16px;display:block}
.topbar-side a,.topbar-side button{color:#192c59;border-color:#c9d7ed;background:#ffffffcc}.topbar-side a:hover,.topbar-side button:hover{color:#1252c6;background:#fff}
.ambient-one{background:#97d6ff}.ambient-two{background:#ffa4dc}.hero-overline{color:#1252c6}.hero h1{color:#171a38}.hero h1 em{color:#f32da4}.sparkle{color:#f32da4}
.entry-card,.room-panel,.result-panel{background:#fff;border-color:#dce5f4;box-shadow:0 24px 56px #1252c61c}.entry-card{border-top:5px solid #087be8}
.shape-one{background:#08bce8}.shape-two{background:#f32da4}.shape-three{background:#ffce22}.shape-core{color:#171a38}
.primary-button,.share-button,.public-join-button,.room-chat-toggle{background:#087be8!important;color:white!important;border-color:#087be8!important;box-shadow:0 9px 22px #087be82b}
.primary-button:hover:not(:disabled),.share-button:hover,.public-join-button:hover{background:#1252c6!important}.mode-card:has(input:checked){border-color:#f32da4;background:#ffecf7}.mode-card input{accent-color:#f32da4}
.progress-fill,.preparing-progress span{background:linear-gradient(90deg,#08bce8,#f32da4,#ffce22)}.option-card.selected{border-color:#f32da4;box-shadow:0 0 0 4px #f32da429}.chosen-check,.result-intro h1 span{color:#f32da4}
.public-room-card{background:#f3f9ff;border-color:#dcecff}.room-code{background:#ebf6ff;border-color:#b8dfff;color:#1252c6}.coin-pill{background:#ffce22}
@media(max-width:420px){.topbar{margin-top:8px;padding:8px 10px}.brand-logo{width:60px;height:60px}.topbar-side{justify-content:center}}

.my-room-card{width:100%;font:inherit;cursor:pointer;text-align:right;color:#30244c}.my-room-card:hover{border-color:#8d6cdb;background:#f0e9ff}.my-room-card strong{display:block}.my-room-card small{display:block}

.room-chat-presets{display:grid;max-height:240px;overflow:auto}.room-chat-group{display:grid;gap:6px;width:100%}.room-chat-group h3{font-size:14px;margin:4px 0}.room-chat-group>div{display:flex;gap:7px;flex-wrap:wrap}.room-chat-group button{white-space:normal;text-align:right}.room-chat-panel #roomChatStatus{font-size:12px;margin:0 0 10px}

.public-room-card.has-room-bg{position:relative;isolation:isolate;overflow:hidden;background:#e9f3ff}.public-room-card.has-room-bg:before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(90deg,rgba(255,255,255,.93),rgba(255,255,255,.7)),var(--room-bg);background-size:cover;background-position:center}

.matchi-pair,.matchi-my-pair{border:1px solid #d5ddf4;border-radius:20px;background:#f5f6ff;padding:14px;box-shadow:0 8px 24px #101c4b0d}
.matchi-pair h3{margin:0 0 12px;color:#172762;font-size:17px}
.matchi-faceoff{display:flex;align-items:center;justify-content:space-between;gap:8px}
.matchi-person{width:86px;min-width:74px;border:1px solid #dce2f4;border-radius:15px;background:white;padding:7px;text-align:center}
.matchi-person a{color:inherit;text-decoration:none}
.matchi-person-photo{width:58px;height:58px;margin:auto;border-radius:12px;overflow:hidden;background:#e5ebff;display:grid;place-items:center;color:#1564bc;font-size:23px;font-weight:900}
.matchi-person-photo img{display:block;width:100%;height:100%;object-fit:cover}
.matchi-person strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11px;color:#18244e;margin-top:6px}
.matchi-score{text-align:center;min-width:78px}
.matchi-score strong{display:block;color:#cf258c;font-size:29px;line-height:1.25}
.matchi-score small,.matchi-my-pair small,.matchi-my-pair span{display:block;color:#68728e;font-size:11px}
.matchi-my-pair{display:flex;align-items:center;gap:15px}
.matchi-my-pair>div:last-child strong{display:block;color:#1763c0;font-size:25px}
.matchi-comparison-table{display:grid;gap:7px}
.matchi-comparison{display:flex;align-items:center;gap:10px;border:1px solid #e5e8f4;border-radius:13px;background:#fff;padding:7px}
.matchi-comparison .matchi-person{display:flex;align-items:center;gap:8px;width:auto;min-width:0;flex:1;border:0;padding:0;text-align:start}
.matchi-comparison .matchi-person a{display:flex;align-items:center;gap:8px;min-width:0}
.matchi-comparison .matchi-person-photo{width:38px;height:38px;flex:0 0 38px;font-size:17px}
.matchi-comparison .matchi-person strong{margin:0;font-size:12px}
.matchi-comparison small{color:#727d97;white-space:nowrap;font-size:10px}
.matchi-comparison>strong{color:#1763c0;white-space:nowrap}
@media(max-width:420px){.matchi-person{width:75px;min-width:66px}.matchi-person-photo{width:52px;height:52px}.matchi-score strong{font-size:24px}.matchi-comparison small{font-size:9px}}

.hourly-best{position:relative;isolation:isolate;overflow:hidden;max-width:460px;margin:32px 0 0;padding:17px 19px 15px;border:1px solid #cbd8f6;border-radius:23px;background:linear-gradient(116deg,#fff1fa,#f1f4ff 55%,#e8f8ff);box-shadow:0 12px 32px #1727621c;color:#172762}
.hourly-best-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;font-weight:900;font-size:18px}
.hourly-best-heading small{font-size:11px;color:#1763c0;background:#fff;border-radius:20px;padding:4px 10px}
.hourly-best-content{position:relative;z-index:1}
.hourly-best-content.hourly-refresh{animation:hourly-fade .55s ease both}
.hourly-empty{color:#697591;font-size:13px;margin:18px 0 5px;text-align:center}
.hourly-match{display:flex;justify-content:space-evenly;align-items:center;gap:10px;margin-top:16px}
.hourly-face{width:90px;min-width:0;text-align:center;background:#ffffffcf;border:1px solid #d8e1f3;border-radius:15px;padding:7px}
.hourly-photo{width:58px;height:58px;margin:auto;border-radius:12px;overflow:hidden;background:#e1f6ff;display:grid;place-items:center;color:#1763c0;font-size:25px}
.hourly-photo img{width:100%;height:100%;object-fit:cover}
.hourly-face strong{display:block;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px}
.hourly-score{text-align:center;min-width:95px}
.hourly-score strong{display:block;font-size:32px;line-height:1.2;color:#d82b91}
.hourly-score small{font-size:10px;color:#697591;white-space:nowrap}
.hourly-room{font-size:11px;color:#1763c0;text-align:center;margin:10px 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hourly-best-joy{position:absolute;inset:0;pointer-events:none;z-index:3}
.hourly-best-joy i{position:absolute;top:51%;left:50%;width:7px;height:12px;border-radius:2px;background:var(--tone);opacity:0}
.hourly-best.celebrate .hourly-best-joy i{animation:hourly-burst 1.2s cubic-bezier(.12,.64,.3,1) both}
.hourly-best.celebrate .hourly-best-joy i:nth-child(3n){animation-delay:.08s}
.hourly-best.celebrate .hourly-best-joy i:nth-child(4n){animation-delay:.14s}
@keyframes hourly-burst{0%{opacity:0;transform:translate(0,0) rotate(0)}12%{opacity:1}100%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(540deg)}}
@keyframes hourly-fade{from{opacity:.2;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:760px){.hourly-best{max-width:none;margin:20px 0 0}.hourly-face{width:80px}.hourly-score{min-width:75px}.hourly-score strong{font-size:27px}}
@media(prefers-reduced-motion:reduce){.hourly-best.celebrate .hourly-best-joy i,.hourly-best-content.hourly-refresh{animation:none}}

/* Compact five-column lobby roster; border color conveys room state. */
.lobby-people{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px;margin-top:14px}
.lobby-person{aspect-ratio:1;min-width:0;background:#fff;border:1px solid #dedaf0;border-radius:11px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:3px}
.lobby-person.ready{border:3px solid #38b878}.lobby-person.left{border:3px solid #e75a66}
.lobby-person.done{border:3px solid #e8b739}
.lobby-avatar{display:grid;place-items:center;width:33px;height:33px;border-radius:50%;background:#dff3ff;overflow:hidden;font-size:15px;font-weight:800}
.lobby-avatar img{width:100%;height:100%;object-fit:cover}
.lobby-person small{display:block;width:100%;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;font-weight:800;color:#283154}
.lobby-person small a{color:inherit;text-decoration:none}
@media(max-width:390px){.lobby-people{gap:5px}.lobby-avatar{width:27px;height:27px}.lobby-person small{font-size:9px}}

/* Bubble arena spans the central banner space. Targets alone capture touches. */
.bubble-arena{height:225px;position:relative;isolation:isolate;overflow:hidden;margin:16px 0 12px;
 border:1px solid #cce4f6;border-radius:20px;background:linear-gradient(140deg,#e4f8ff,#f5e7ff)}
.bubble-target{position:absolute;z-index:4;width:52px;height:52px;border-radius:50%;padding:0;
 display:grid;place-items:center;border:3px solid #fff;cursor:pointer;touch-action:manipulation;
 box-shadow:0 5px 14px #525eb755;animation:float-bubble 2s ease-in-out infinite alternate}
.bubble-target{border:0;background:transparent center/contain no-repeat;box-shadow:none}
.bubble-target.bubble{background-image:url("/static/game/bubble.webp")}
.bubble-target.bomb{background-image:url("/static/game/bomb.webp")}
.bubble-target.burst{pointer-events:none;background-position:center;animation:none}
.bubble-target.burst.bubble{background-image:url("/static/game/bubble_pop_0.webp")}
.bubble-target.burst.bomb{background-image:url("/static/game/bomb_pop_0.webp")}
.lobby-person{position:relative}.lobby-person em{position:absolute;top:-7px;right:-4px;padding:1px 4px;
 border-radius:7px;font:900 10px/1.2 inherit;color:#2a2862;background:#fff1aa;box-shadow:0 2px 7px #7773}
@keyframes float-bubble{from{transform:translateY(5px) translateX(-4px)}to{transform:translateY(-15px) translateX(var(--drift,8px))}}



/* The roster stays in one horizontal strip; points occupy the last line. */
.lobby-people{display:flex;flex-wrap:nowrap;gap:7px;overflow-x:auto;overscroll-behavior-inline:contain;padding:5px 2px 9px}
.lobby-person{flex:0 0 84px;min-height:106px;aspect-ratio:auto;justify-content:flex-start;gap:2px;padding:5px 4px}
.lobby-avatar{width:39px;height:39px;flex:none}
.lobby-person small{margin-top:2px}
.lobby-person em{position:static;display:block;margin-top:auto;width:100%;text-align:center;white-space:nowrap;font:900 10px/1.3 inherit;color:#452a87;background:none;box-shadow:none}
@media(max-width:390px){.lobby-people{gap:6px}.lobby-person{flex-basis:76px}.lobby-avatar{width:35px;height:35px}}

/* The targets float across the lobby with no enclosing ad panel. */
.bubble-arena{position:fixed;inset:0;z-index:20;width:100vw;height:100dvh;margin:0;
 padding:0;overflow:hidden;border:0;border-radius:0;background:transparent;pointer-events:none}
.bubble-target{pointer-events:auto}
.option-card img{object-fit:cover;background:#ede6f6}
.analysis-options img{object-fit:contain;background:#fff}

/* Clear illustrated controls shared with the Android icon set. */
.mode-card{min-height:92px;gap:12px}.mode-card .mode-art{display:block;flex:none;width:62px;height:62px;object-fit:contain}.mode-card span{min-width:0}.mode-card strong{font-size:16px}.mode-card small{font-size:12px}.sound-toggle{display:inline-flex;align-items:center;gap:6px}.sound-toggle img{width:28px;height:28px;object-fit:contain}.waiting-art{display:block;width:86px;height:86px;object-fit:contain;margin:0 auto 12px}@media(max-width:390px){.mode-card .mode-art{width:54px;height:54px}.mode-card{min-height:80px}.mode-card strong{font-size:15px}}

.public-room-card .entry-fee{display:inline-flex;align-items:center;justify-self:start;gap:5px;width:max-content;padding:2px 8px;border:1px solid #f2cf68;border-radius:10px;background:#ffecb8;color:#413165;font-size:12px;font-weight:900;line-height:1.35}.public-room-card .entry-fee img{display:block;width:24px;height:24px;object-fit:contain;flex:none}

/* Two-person report: three distinct scores and topic comparisons. */
.duo-scores{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:16px 0 26px}
.duo-scores .recognition-card{min-width:0;padding:17px}.duo-scores h2{font-size:14px}.duo-scores strong{font-size:34px}
.duo-topics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.duo-topic{margin:0}
.duo-topic-scores{display:grid;gap:8px}.duo-topic-scores span{display:flex;align-items:center;gap:8px;justify-content:space-between;padding:8px 10px;border-radius:10px;background:#f4f0fc}
.duo-topic-scores b{color:#5c36af;font-size:18px}.duo-topic-scores small{color:#736787}
.duo-misses{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.duo-miss{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.duo-miss figure{min-width:0;margin:0}
@media(max-width:760px){.duo-scores,.duo-topics,.duo-misses{grid-template-columns:1fr}.duo-miss{max-width:370px}}