:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#f3f3f3;background:#0b0b0d;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 50% -20%,#30252d 0,#111116 35%,#08080a 75%);color:#f5f5f5}button,input{font:inherit}.shell{width:min(980px,100%);margin:0 auto;padding:28px 18px 60px}header{text-align:center;margin-bottom:30px}.brand{font-weight:950;letter-spacing:.19em;font-size:clamp(25px,5vw,42px)}.subtitle{opacity:.45;text-transform:uppercase;letter-spacing:.3em;font-size:10px;margin-top:5px}.card{background:#19191eeb;border:1px solid #35353d;border-radius:20px;padding:24px;box-shadow:0 20px 60px #0007}.hero{max-width:520px;margin:0 auto}.hero h1{font-size:34px;margin:0 0 8px}.hero p{opacity:.68;line-height:1.5}.card label{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.12em;opacity:.6;margin:20px 0 8px}input{width:100%;border:1px solid #41414c;background:#111116;color:#fff;border-radius:12px;padding:14px;outline:none}input:focus{border-color:#8f7180}button{border:1px solid #454550;background:#24242b;color:#fff;border-radius:12px;padding:12px 16px;cursor:pointer}button:hover{background:#303039}button:disabled{opacity:.35;cursor:not-allowed}.primary{width:100%;margin-top:12px;background:#eee;color:#111;border-color:#eee;font-weight:850}.primary:hover{background:#fff}.danger{border-color:#64383d;color:#ffc2c7}.row{display:flex;gap:10px}.divider{display:flex;align-items:center;gap:12px;margin:22px 0 0;color:#777;font-size:12px}.divider:before,.divider:after{content:"";height:1px;background:#38383f;flex:1}.roomcode{letter-spacing:.18em;font-size:13px;opacity:.7}.roomcode strong{font-size:24px;color:#fff;opacity:1}.status{display:inline-block;margin-top:5px;border:1px solid #4b4b55;border-radius:999px;padding:6px 11px;font-size:11px;letter-spacing:.14em}.gameHeader{display:flex;align-items:center;justify-content:space-between;margin:15px 0 24px}.gameHeader small{opacity:.4}.cycleSmall{font-size:20px;font-weight:850;letter-spacing:.08em}.grid{display:grid;grid-template-columns:1fr 260px;gap:28px}.grid h2{margin-top:0}.grid h2 small{font-size:13px;opacity:.45}.players{display:grid;gap:8px}.player{display:flex;align-items:center;gap:10px;background:#141419;border:1px solid #2d2d34;padding:11px 12px;border-radius:11px}.player em{margin-left:auto;font-style:normal;font-size:10px;letter-spacing:.12em;opacity:.45}.dot{width:9px;height:9px;border-radius:50%;background:#5b5b63}.dot.on{background:#d7d7d7;box-shadow:0 0 0 3px #d7d7d722}aside{display:flex;flex-direction:column;gap:10px;align-items:stretch}.qr{width:100%;border-radius:14px;background:#fff;padding:10px}.mini{text-align:center;font-size:11px;opacity:.5;margin-top:-3px}.pinbox{border:1px dashed #55545d;border-radius:14px;padding:14px;margin-top:22px;display:flex;flex-direction:column;align-items:center;gap:4px}.pinbox span,.pinbox small{opacity:.5;font-size:11px}.pinbox strong{font-size:28px;letter-spacing:.18em}.hostPanel{margin-top:22px;border-top:1px solid #34343b;padding-top:18px;display:flex;flex-wrap:wrap;gap:9px}.hostPanel h3{width:100%;margin:0 0 2px}.hostPanel .primary{width:auto;margin-top:0}.hint,.error{margin-top:12px;font-size:13px}.hint{opacity:.55}.error{color:#ffb2b2}.tabs{display:flex;gap:8px;margin:18px 0}.tabs button{flex:1}.tabs .active{background:#eee;color:#111}.display{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px;text-align:center}.huge{font-size:clamp(36px,8vw,90px)}.cycle{margin-top:35px;font-size:clamp(25px,5vw,56px);font-weight:900;letter-spacing:.12em}.phase{margin-top:8px;font-size:clamp(18px,3vw,35px);letter-spacing:.18em;opacity:.7}.count{margin-top:18px;opacity:.55;letter-spacing:.15em}.displayPlayers{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:34px;max-width:1100px}.displayPlayers span{border:1px solid #484850;border-radius:999px;padding:9px 15px;font-size:18px}.offline{opacity:.35}@media(max-width:720px){.grid{grid-template-columns:1fr}.grid aside{max-width:260px;margin:0 auto;width:100%}.hero h1{font-size:29px}.card{padding:18px}.shell{padding-top:18px}.gameHeader{align-items:flex-start}.hostPanel{flex-direction:column}.hostPanel .primary{width:100%}}.player .removePlayer{margin-left:auto;flex:0 0 auto;padding:5px 9px;min-height:0;border:1px solid #71383d;border-radius:8px;background:#3a1f23;color:#e7b4b8;font-size:11px;font-weight:650;line-height:1.2}.player .removePlayer:hover{border-color:#875057;background:#49282d;color:#f0c5c8}.player em+.removePlayer{margin-left:0}.joinRequests{margin-top:22px;padding:16px;border:1px solid #5a4b32;border-radius:14px;background:#262015}.joinRequests h3{margin:0 0 12px}.joinRequest{display:flex;align-items:center;gap:9px;padding:9px 0}.joinRequest+.joinRequest{border-top:1px solid #493e2b}.joinRequest span{color:#b9b0a1;font-size:12px}.joinRequest .acceptJoin{margin-left:auto;background:#243b2b;border-color:#40664a;color:#c8e9cf}.joinRequest .rejectJoin{background:#3a1f23;border-color:#71383d;color:#e7b4b8}@media(max-width:720px){.joinRequest{flex-wrap:wrap}.joinRequest span{width:100%}.joinRequest .acceptJoin{margin-left:0}}.modeChoices{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.modeChoices button{min-height:86px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:5px;text-align:left}.modeChoices button.active{border-color:#a38b97;background:#3a3037;box-shadow:inset 0 0 0 1px #a38b9755}.modeChoices small{opacity:.55;line-height:1.25}.roomMeta{display:flex;flex-direction:column;align-items:flex-end;gap:5px;font-size:12px;opacity:.55}.masterBar{display:flex;align-items:center;gap:9px;margin:-10px 0 22px;padding:10px 12px;border:1px solid #393941;border-radius:11px;background:#202026}.masterBar>span{font-size:9px;letter-spacing:.16em;opacity:.45}.masterBar .dot{margin-left:auto}.masterBar small{opacity:.55}.playerAck{margin-left:auto;font-size:10px;color:#c7aeb1;opacity:.65}.playerAck.yes{color:#afceb6}.playerAck+.removePlayer{margin-left:0}.possibleRolesPublic{margin-top:22px;padding-top:18px;border-top:1px solid #34343b}.possibleRolesPublic h3{margin:0 0 12px}.possibleRolesPublic h3 small{margin-left:6px;font-size:10px;font-weight:400;text-transform:uppercase;letter-spacing:.1em;opacity:.4}.possibleRolesPublic>div{display:flex;flex-wrap:wrap;gap:7px}.possibleRolesPublic span{padding:6px 9px;border:1px solid #3d3d45;border-radius:999px;background:#17171c;font-size:11px}.roleSetupPanel,.masterAssignments,.privateRoleCard,.waitingRole{margin-top:24px;border:1px solid #403b42;border-radius:16px;padding:18px;background:#17171c}.roleSetupTitle{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}.roleSetupTitle h3,.masterAssignments h3,.waitingRole h3{margin:0 0 5px}.roleSetupTitle p,.masterAssignments>p,.waitingRole p{margin:0;opacity:.58;font-size:12px;line-height:1.45}.modeBadge{border:1px solid #5a5057;border-radius:999px;padding:6px 9px;font-size:10px;text-transform:uppercase;letter-spacing:.1em;white-space:nowrap}.modeBadge.advanced{border-color:#705a3b;color:#dec99f}.effectiveHeader{display:flex;justify-content:space-between;margin:20px 0 9px;font-size:12px}.effectiveHeader span{opacity:.55}.effectiveRoles{display:flex;flex-wrap:wrap;align-items:center;gap:7px;min-height:40px;padding:9px;border:1px dashed #414149;border-radius:11px}.effectiveRoles button{display:flex;align-items:center;gap:7px;padding:6px 8px;font-size:11px;background:#302a30}.effectiveRoles button b{color:#d8a8ad}.emptySelection{opacity:.35;font-size:12px}.roleSearch{margin:14px 0 9px}.rolePicker{max-height:390px;overflow-y:auto;border:1px solid #34343b;border-radius:12px}.rolePickerRow{display:grid;grid-template-columns:90px minmax(150px,1fr) 28px 90px;align-items:center;gap:9px;padding:9px;background:#131318}.rolePickerRow+.rolePickerRow{border-top:1px solid #2c2c33}.rolePickerRow.possible{background:#1c1a1e}.rolePickerRow>div{min-width:0}.rolePickerRow strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.rolePickerRow small{display:block;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;opacity:.45;font-size:10px}.rolePickerRow button{padding:6px 7px;font-size:10px}.possibleToggle{color:#bbb}.rolePickerRow.possible .possibleToggle{color:#cbdaca;border-color:#49604d;background:#243128}.effectiveCount{width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:#4b3e47;font-size:10px}.addEffective{white-space:nowrap}.setupMessages{display:grid;gap:6px;margin-top:12px}.setupIssue,.setupWarning{padding:8px 10px;border-radius:8px;font-size:11px}.setupIssue{background:#3a2225;color:#e3b6ba}.setupWarning{background:#382f20;color:#dfcc9f}.saveRoles{width:auto}.masterAssignments{border-color:#5b4935;background:#1d1915}.masterSecret,.roleSecret{margin-bottom:7px;font-size:9px;letter-spacing:.18em;color:#c8ae87}.assignmentList{display:grid;gap:7px;margin-top:15px}.assignmentRow{display:grid;grid-template-columns:10px minmax(100px,1fr) minmax(150px,1fr) 82px;gap:9px;align-items:center;padding:9px 10px;border:1px solid #40382e;border-radius:9px;background:#161411}.assignmentRow strong{overflow:hidden;text-overflow:ellipsis}.assignmentRow select{min-width:0;border:1px solid #51483d;border-radius:8px;padding:7px;background:#242018;color:#fff}.assignedRole{color:#e0caa8}.ackState{text-align:right;font-size:10px;color:#bd8e92}.ackState.yes{color:#9fc0a7}.privateRoleCard{position:relative;overflow:hidden;border-color:#71606a;background:linear-gradient(145deg,#251f24,#17171c 50%)}.privateRoleCard:before{content:"";position:absolute;width:190px;height:190px;border-radius:50%;right:-90px;top:-110px;border:1px solid #806c7866;box-shadow:0 0 70px #76576622}.privateRoleCard h2{position:relative;margin:0 0 13px;font-size:30px}.roleTraits{display:flex;flex-wrap:wrap;gap:7px}.roleTraits span{border:1px solid #4a4248;border-radius:999px;padding:6px 9px;font-size:10px;opacity:.8}.privateRoleCard h4{margin:18px 0 6px;text-transform:uppercase;letter-spacing:.1em;font-size:10px;opacity:.55}.privateRoleCard p{margin:0;max-width:760px;line-height:1.55;color:#e2dee0;font-size:14px}.acknowledgeRole{width:auto;margin-top:20px}.roleConfirmed{display:inline-block;margin-top:20px;padding:8px 11px;border:1px solid #45604b;border-radius:9px;color:#b8d4bf;background:#213026;font-size:12px}.waitingRole{border-style:dashed;text-align:center}@media(max-width:720px){.modeChoices{grid-template-columns:1fr}.modeChoices button{min-height:66px}.roomMeta{display:none}.roleSetupTitle{flex-direction:column;gap:10px}.rolePickerRow{grid-template-columns:80px minmax(0,1fr) 24px}.rolePickerRow .addEffective{grid-column:2 / 4}.assignmentRow{grid-template-columns:10px minmax(0,1fr)}.assignmentRow .assignedRole,.assignmentRow select,.assignmentRow .ackState{grid-column:2}.assignmentRow .ackState{text-align:left}.roleTraits{flex-direction:column;align-items:flex-start}.privateRoleCard h2{font-size:25px}}.nightGuide{margin-top:24px;border:1px solid #4b4148;border-radius:17px;padding:18px;background:#151519}.masterGuide{border-color:#65523d;background:#1b1814}.guideHeader{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.guideHeader h3{margin:0}.guideHeader>span{padding:6px 9px;border:1px solid #4a4347;border-radius:999px;font-size:10px;letter-spacing:.06em;white-space:nowrap;opacity:.75}.guideProgress{height:4px;margin:14px 0 18px;overflow:hidden;border-radius:99px;background:#302b2d}.guideProgress i{display:block;height:100%;border-radius:inherit;background:#b99c77;transition:width .25s ease}.guidePaused{margin:12px 0;padding:10px 12px;border:1px solid #624e32;border-radius:10px;background:#30271b;color:#dcc396;font-size:12px}.guideComplete{display:flex;flex-direction:column;gap:5px;padding:18px;border:1px solid #3f6248;border-radius:12px;background:#1e2d22;color:#c9decf}.guideComplete span{font-size:12px;opacity:.65}.guideLayout{display:grid;grid-template-columns:210px minmax(0,1fr);gap:18px}.guideSequence{max-height:520px;margin:0;padding:6px;overflow-y:auto;list-style:none;border:1px solid #3b342d;border-radius:12px;background:#12110f}.guideSequence li{display:grid;grid-template-columns:22px minmax(0,1fr);align-items:center;gap:7px;min-height:35px;padding:5px 7px;border-radius:8px;color:#7e7770;font-size:10px}.guideSequence li b{width:20px;height:20px;display:grid;place-items:center;border:1px solid #3d3832;border-radius:50%;font-size:9px}.guideSequence li span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.guideSequence li.completed{color:#8faf97}.guideSequence li.current{color:#f0ddc2;background:#332a20}.guideSequence li.current b{border-color:#a7855d}.guideCurrent{min-width:0;padding:4px 2px}.guideCallNumber,.yourTurnLabel{color:#c2a274;font-size:9px;font-weight:800;letter-spacing:.16em}.guideCurrent h2{margin:5px 0 10px;font-size:28px}.guideScript{margin:0;color:#dfd8d2;font-size:14px;line-height:1.58}.guideActors{margin-top:18px}.guideActors h4{margin:0 0 8px;font-size:10px;text-transform:uppercase;letter-spacing:.1em;opacity:.5}.guideNoActor,.guideWaiting{padding:10px 11px;border:1px dashed #50463b;border-radius:9px;color:#a89d90;font-size:11px}.guideActor{padding:12px;border:1px solid #463b30;border-radius:11px;background:#13110f}.guideActor+.guideActor{margin-top:8px}.guideActorName{display:flex;align-items:center;gap:8px}.guideActorName small{margin-left:auto;opacity:.45;font-size:10px}.guideActionReceived{display:flex;align-items:center;gap:8px;margin-top:10px;padding:9px 10px;border-radius:8px;background:#202a22;color:#bcd1c1;font-size:11px}.guideActionReceived strong{margin-left:auto;color:#eef5ef}.guideResponse{margin-top:12px}.guideResponse>span{display:block;margin-bottom:7px;font-size:11px;opacity:.6}.guideResponse>div{display:flex;flex-wrap:wrap;gap:7px}.guideResponse button{padding:8px 10px;font-size:11px}.guideResponse button.selected,.guideChoices button.selected{border-color:#708a73;background:#29372c;color:#d9eadc}.guideBlocks{display:grid;gap:5px;margin-top:13px;color:#d6a7aa;font-size:11px}.guideControls{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.guideControls .primary{width:auto;margin:0}.guideForce{border-color:#66484b;color:#d9adb0;background:#2c2022;font-size:11px}.participantGuide{border-color:#5f5360;background:linear-gradient(145deg,#211c21,#141418)}.participantGuide.yourTurn{border-color:#806b52;box-shadow:0 0 0 1px #806b5222,0 18px 50px #0005}.participantGuide .guideHeader{margin-bottom:13px}.participantAction{margin-top:18px;padding:14px;border:1px solid #4c4033;border-radius:12px;background:#17130f}.participantAction>p{margin:6px 0 12px;font-size:13px;color:#ded4c7}.participantAction label{margin:12px 0 6px}.participantAction select{width:100%;border:1px solid #464049;border-radius:10px;padding:11px;background:#111116;color:#fff}.guideChoices{display:flex;flex-wrap:wrap;gap:8px}.guideChoices button{flex:1;min-width:160px}.participantSubmitted{margin-top:9px;color:#9fc1a7;font-size:11px;text-align:center}.participantResponse{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:12px;padding:11px;border:1px dashed #4b454d;border-radius:9px;color:#9c959f;font-size:11px}.participantResponse.received{border-style:solid;border-color:#596d5d;background:#202a22;color:#c7ddcc}.participantResponse strong{color:#fff}.eyesClosed{display:flex;flex-direction:column;align-items:center;gap:5px;margin-top:18px;padding:22px;border:1px dashed #3e3b42;border-radius:12px;color:#aaa5ad;text-align:center}.eyesClosed>span{font-size:28px;color:#36323a}.eyesClosed small{opacity:.55}.displayGuide{margin-top:15px;padding:8px 12px;border:1px solid #5b4c3d;border-radius:999px;color:#d6bea0;font-size:clamp(11px,2vw,17px);letter-spacing:.08em}@media(max-width:720px){.guideLayout{grid-template-columns:1fr}.guideSequence{display:flex;max-height:none;overflow-x:auto}.guideSequence li{flex:0 0 140px}.guideCurrent h2{font-size:24px}.guideControls{flex-direction:column}.guideControls .primary{width:100%}.guideResponse>div,.guideChoices{flex-direction:column}.guideChoices button{min-width:0}}
