.draw-page{--blue:#1599ee;--deep:#087bc8;--ink:#173951;min-height:100dvh;color:var(--ink);font-family:var(--font-geist-sans),sans-serif;background:radial-gradient(circle at 50% 8%,#64c8ff 0,#159ff3 42%,#0783d8 100%);place-items:center;padding:28px;display:grid}.draw-shell{width:min(1120px,100%);margin:auto}.draw-shell>header{display:none}.draw-game{background:#e9f6fc;border:5px solid #0a78bf;border-radius:18px;grid-template-columns:230px minmax(0,1fr) 270px;width:100%;height:min(720px,100dvh - 56px);min-height:560px;display:grid;overflow:hidden;box-shadow:0 25px 80px #005c9b66,inset 0 4px #fff6}.draw-players{background:linear-gradient(#f7fcff,#e7f5fc);border-right:1px solid #bdd9e8;flex-direction:column;min-width:0;padding:20px 14px 16px;display:flex}.draw-brand{color:#058cd9;letter-spacing:-1.5px;justify-content:center;align-items:center;gap:9px;height:52px;font-size:24px;display:flex}.draw-brand i{color:#0788d4;background:#ffdc42;border-radius:50%;place-items:center;width:32px;height:32px;font-size:16px;font-style:normal;display:grid;box-shadow:0 2px #e3a800}.draw-brand strong{font-weight:950}.draw-players>p{border-top:1px solid #cfe3ee;border-bottom:1px solid #cfe3ee;justify-content:space-between;margin:7px 4px 12px;padding:9px 6px;font-size:10px;display:flex}.draw-players>p span{letter-spacing:1px;font-weight:900}.draw-players>p b{color:#4d91b8;font-weight:700}.draw-player-list{flex-direction:column;gap:7px;display:flex}.draw-player-list article{border:1px solid #0000;border-radius:10px;align-items:center;gap:9px;min-width:0;padding:9px 8px;display:flex}.draw-player-list article.drawing{background:#d8f2ff;border-color:#83c8ec;box-shadow:0 2px 5px #1b88bd1c}.draw-player-list article>i{color:#37617b;background:#ffd86b;border:3px solid #fff;border-radius:50%;flex:0 0 38px;place-items:center;width:38px;height:38px;font-style:normal;font-weight:950;display:grid;box-shadow:0 1px 4px #4b7d9940}.draw-player-list article:nth-child(2)>i{background:#71d7ed}.draw-player-list article:nth-child(3)>i{background:#ff9da0}.draw-player-list article:nth-child(4)>i{background:#a8e18a}.draw-player-list article>span{flex-direction:column;min-width:0;display:flex}.draw-player-list b{text-overflow:ellipsis;font-size:12px;overflow:hidden}.draw-player-list small{color:#7194a8;margin-top:3px;font-size:8px}.draw-player-list em{color:#0794dd;margin-left:auto;font-size:16px;font-style:normal}.draw-players>button{color:#2379a8;cursor:pointer;background:#fff;border:1px solid #8fc8e4;border-radius:8px;height:38px;margin-top:auto;font-size:9px;font-weight:850}.draw-main{background:#fff;grid-template-rows:72px 46px minmax(0,1fr) 30px;min-width:0;min-height:0;display:grid;overflow:hidden}.draw-round{background:#fff;border-bottom:1px solid #c7dbe5;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 18px;display:grid}.draw-round span{color:#6f94a8;letter-spacing:1px;font-size:8px;font-weight:850}.draw-round b{font:800 20px var(--font-geist-mono);letter-spacing:7px;color:#1e4156}.draw-round time{color:#158aca;font:850 15px var(--font-geist-mono);background:#e8f5fb;border-radius:7px;justify-self:end;padding:7px 10px}.draw-round time.urgent{color:#e84f3f;background:#ffe9e6}.draw-toolbar{background:#edf7fb;border-bottom:1px solid #bdd7e3;align-items:center;gap:12px;padding:0 12px;display:flex}.draw-toolbar>div{scrollbar-width:none;gap:5px;min-width:0;padding:3px;display:flex;overflow-x:auto}.draw-toolbar>div::-webkit-scrollbar{display:none}.draw-toolbar>div button{cursor:pointer;border:2px solid #fff;border-radius:50%;flex:0 0 21px;width:21px;height:21px;padding:0;box-shadow:0 0 0 1px #aac5d2}.draw-toolbar>div button.active{box-shadow:0 0 0 2px #1c607e}.draw-toolbar label{color:#5d8295;align-items:center;gap:7px;margin-left:auto;font-size:9px;display:flex}.draw-toolbar>button{color:#426c82;cursor:pointer;background:#fff;border:1px solid #aac8d7;border-radius:5px;flex:none;padding:6px 9px;font-size:8px}.draw-main canvas{cursor:crosshair;touch-action:none;-webkit-user-select:none;user-select:none;background:#fff;width:100%;min-width:0;max-width:100%;height:100%;min-height:0;display:block}.draw-privacy{color:#6e94a7;white-space:nowrap;text-overflow:ellipsis;background:#edf7fb;border-top:1px solid #c3dce8;padding:9px 12px;font-size:7px;overflow:hidden}.draw-chat{background:#f6fbfe;border-left:1px solid #bdd9e8;flex-direction:column;min-width:0;min-height:0;display:flex}.draw-chat>header{background:linear-gradient(#fff,#edf8fd);border-bottom:1px solid #c2dce8;justify-content:space-between;align-items:center;height:72px;padding:0 15px;display:flex}.draw-chat>header span{color:#417d9c;letter-spacing:1px;align-items:center;gap:7px;font-size:9px;font-weight:900;display:flex}.draw-chat>header span>i{background:#2ac56f;border-radius:50%;width:7px;height:7px;animation:1.8s ease-out infinite chatLive;box-shadow:0 0 #2ac56f77}.draw-chat>header b{color:#fff;text-align:center;background:#168fd2;border-radius:999px;min-width:25px;padding:5px;font-size:10px;transition:transform .2s}.draw-chat>div{scroll-behavior:smooth;flex:1;min-height:0;padding:11px;overflow:auto}.draw-chat article{background:#fff;border:1px solid #d2e5ee;border-radius:4px 12px 12px;gap:8px;margin-bottom:7px;padding:9px 10px;animation:.35s cubic-bezier(.2,.8,.2,1) both chatMessage;display:flex;position:relative;box-shadow:0 3px 10px #347a9d0b}.draw-chat article:nth-child(2n){background:#e8f6fd;border-radius:12px 4px 12px 12px}.draw-chat article>i{color:#29779e;background:#d7edf7;border-radius:50%;flex:0 0 28px;place-items:center;width:28px;height:28px;font-size:8px;font-style:normal;font-weight:900;display:grid}.draw-chat article p{flex-direction:column;gap:3px;margin:0;display:flex}.draw-chat article b{font-size:9px}.draw-chat article span{color:#52778a;font-size:10px}.draw-chat article>em{color:#fff;letter-spacing:.6px;background:#65b82e;border-radius:999px;align-self:center;margin-left:auto;padding:5px 7px;font-size:6px;font-style:normal;font-weight:950;animation:.65s cubic-bezier(.2,.9,.25,1) .18s both correctBadge}.draw-chat article.correct{background:linear-gradient(135deg,#efffe4,#dcf7c9);border-color:#9ed578;border-radius:8px;animation:.55s cubic-bezier(.2,.9,.25,1) both chatCorrect;box-shadow:0 5px 18px #65b82e28}.draw-chat article.correct>i{color:#fff;background:#65b82e;font-size:14px;box-shadow:0 0 0 4px #65b82e20}.draw-chat article.correct b{color:#347a18}.draw-chat article.correct span{color:#4d921c;font-weight:800}.draw-chat-waiting{color:#7196a9;text-align:center;flex-direction:column;justify-content:center;align-items:center;height:100%;min-height:180px;display:flex}.draw-chat-waiting>i{background:#e1f1f8;border-radius:999px;align-items:center;gap:4px;height:30px;padding:0 12px;display:flex}.draw-chat-waiting>i span{background:#258fc3;border-radius:50%;width:5px;height:5px;animation:1.2s ease-in-out infinite chatDot}.draw-chat-waiting>i span:nth-child(2){animation-delay:.15s}.draw-chat-waiting>i span:nth-child(3){animation-delay:.3s}.draw-chat-waiting strong{color:#4c7e96;margin-top:12px;font-size:10px}.draw-chat-waiting small{max-width:170px;margin-top:4px;font-size:8px;line-height:1.5}.draw-chat>form{background:#e7f4fa;border-top:1px solid #bdd7e3;padding:13px}.draw-chat>form label{color:#48829f;letter-spacing:1px;margin-bottom:7px;font-size:7px;font-weight:850;display:block}.draw-chat>form>div{display:flex}.draw-chat>form input{color:#24495d;background:#fff;border:1px solid #9ec4d7;border-radius:7px 0 0 7px;outline:none;flex:1;min-width:0;height:40px;padding:0 10px}.draw-chat>form input:focus{border-color:#168fd2}.draw-chat>form button{color:#fff;cursor:pointer;background:#168fd2;border:0;border-radius:0 7px 7px 0;width:40px;font-weight:950}.draw-chat>form button:disabled{opacity:.45}.draw-chat>footer{background:#fff;border:1px solid #bdd8e5;border-radius:9px;flex-direction:column;gap:6px;margin:auto 12px 12px;padding:17px;display:flex}.draw-chat>footer strong{font-size:13px}.draw-chat>footer span{color:#7192a3;font-size:9px}.draw-chat>footer button{color:#fff;cursor:pointer;background:#168fd2;border:0;border-radius:6px;height:38px;margin-top:7px;font-size:8px;font-weight:900}.draw-secret{text-align:center;background:#fff;border:5px solid #0878bf;border-radius:18px;flex-direction:column;justify-content:center;align-items:center;min-height:520px;padding:35px;display:flex;box-shadow:0 25px 80px #005c9b66}.draw-secret>small{color:#0b8fd7;letter-spacing:2px;font-size:8px;font-weight:900}.draw-secret h2{color:#173e54;letter-spacing:-2px;margin:13px 0 8px;font-size:clamp(30px,4vw,48px)}.draw-secret p{color:#67899b;font-size:10px}.draw-secret form{gap:7px;width:min(520px,100%);margin-top:25px;display:flex}.draw-secret input{border:1px solid #a9c9d9;border-radius:7px;outline:none;flex:1;min-width:0;height:50px;padding:0 14px}.draw-secret button{color:#fff;cursor:pointer;background:#168fd2;border:0;border-radius:7px;height:50px;padding:0 18px;font-size:9px;font-weight:900}.draw-secret.handoff>strong{color:#078ed8;text-transform:uppercase;margin:20px 0 5px;font-size:clamp(50px,8vw,90px)}@media (max-width:900px){.draw-page{padding:12px}.draw-game{grid-template-columns:190px minmax(0,1fr);height:auto;min-height:calc(100dvh - 24px)}.draw-chat{border-top:1px solid #bdd9e8;border-left:0;grid-column:1/-1;min-height:250px}.draw-chat>div{max-height:170px}.draw-main{min-height:520px}}@media (max-width:620px){.draw-page{padding:0;display:block}.draw-game{border:0;border-radius:0;grid-template-columns:1fr;min-height:100dvh}.draw-players{border-bottom:1px solid #bdd9e8;border-right:0;padding:10px 12px}.draw-brand{height:37px;font-size:19px}.draw-brand i{width:25px;height:25px}.draw-players>p{display:none}.draw-player-list{grid-template-columns:repeat(4,1fr);gap:3px;display:grid}.draw-player-list article{justify-content:center;padding:5px}.draw-player-list article>i{flex-basis:30px;width:30px;height:30px}.draw-player-list article>span,.draw-player-list article>em,.draw-players>button{display:none}.draw-main{min-height:520px}.draw-round{grid-template-columns:1fr auto;height:64px}.draw-round span{display:none}.draw-round b{letter-spacing:4px;font-size:15px}.draw-toolbar label{display:none}.draw-chat{grid-column:auto}}body .draw-page.is-playing{background:radial-gradient(circle at 50% 8%,#64c8ff 0,#159ff3 42%,#0783d8 100%);height:auto;min-height:100dvh;overflow:auto}body .draw-page.is-playing .draw-shell{width:min(1120px,100%);height:auto;min-height:0;padding:0;display:block;overflow:visible}body .draw-page.is-playing .draw-game{background:#e9f6fc;border:5px solid #0a78bf;border-radius:18px;grid-template-columns:230px minmax(0,1fr) 270px;gap:0;width:100%;height:min(720px,100dvh - 56px);min-height:560px;display:grid;position:relative;overflow:hidden}body .draw-page.is-playing .draw-main{width:auto;height:auto;min-height:0;box-shadow:none;background:#fff;border:0;border-radius:0;grid-template-rows:72px 46px minmax(0,1fr) 30px;display:grid;position:relative;inset:auto;overflow:hidden}body .draw-page.is-playing .draw-main canvas{z-index:auto;background:#fff;border-radius:0;width:100%;height:100%;position:relative;inset:auto}body .draw-page.is-playing .draw-round{z-index:auto;width:auto;height:auto;color:var(--ink);box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;background:#fff;border:0;border-bottom:1px solid #c7dbe5;border-radius:0;position:relative;top:auto;left:auto;transform:none}body .draw-page.is-playing .draw-toolbar{z-index:auto;width:auto;height:auto;box-shadow:none;background:#edf7fb;border:0;border-bottom:1px solid #bdd7e3;border-radius:0;flex-direction:row;padding:0 12px;position:relative;top:auto;left:auto;transform:none}body .draw-page.is-playing .draw-toolbar>div{flex-direction:row}body .draw-page.is-playing .draw-toolbar label{writing-mode:initial;margin-left:auto;font-size:9px}body .draw-page.is-playing .draw-toolbar label input{width:auto;transform:none}body .draw-page.is-playing .draw-toolbar>button{width:auto;padding:6px 9px;font-size:8px}body .draw-page.is-playing .draw-toolbar>button:after{content:none}body .draw-page.is-playing .draw-privacy{display:block}body .draw-page.is-playing .draw-chat{z-index:auto;pointer-events:auto;background:#f6fbfe;border:0;border-left:1px solid #bdd9e8;border-radius:0;height:auto;min-height:0;padding:0;display:flex;position:relative;inset:auto;overflow:hidden}body .draw-page.is-playing .draw-chat>header{display:flex}body .draw-page.is-playing .draw-chat>div{width:auto;height:auto;min-height:0;max-height:none;padding:11px;display:block;position:relative;bottom:auto;left:auto;overflow:auto;transform:none}body .draw-page.is-playing .draw-chat article{width:auto;max-width:none;color:var(--ink);box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;animation:none}body .draw-page.is-playing .draw-chat article>i{display:grid}body .draw-page.is-playing .draw-chat-empty{color:#7da0b2;background:0 0;width:auto;margin:20px 8px;padding:0}body .draw-page.is-playing .draw-chat>form{border-top:1px solid #bdd7e3;width:auto;margin:0;padding:13px;position:relative;bottom:auto;left:auto;right:auto;transform:none}body .draw-page.is-playing .draw-chat>form label{color:#48829f;background:0 0;border-radius:0;width:auto;margin:0 0 7px;padding:0;position:relative;bottom:auto;left:auto}body .draw-page.is-playing .draw-chat>form>div{height:auto;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;border:0;border-radius:0;padding:0}body .draw-page.is-playing .draw-chat>form input{background:#fff;border:1px solid #9ec4d7;height:40px;padding:0 10px}body .draw-page.is-playing .draw-chat>form button{color:#fff;border-radius:0 7px 7px 0;width:40px;height:auto}@keyframes chatLive{70%,to{box-shadow:0 0 0 7px #2ac56f00}}@keyframes chatDot{0%,60%,to{opacity:.45;transform:translateY(0)}30%{opacity:1;transform:translateY(-4px)}}@keyframes chatMessage{0%{opacity:0;transform:translateY(10px)scale(.96)}to{opacity:1;transform:none}}@keyframes chatCorrect{0%{opacity:0;transform:scale(.86)rotate(-1deg)}55%{transform:scale(1.045)rotate(.5deg)}to{opacity:1;transform:none}}@keyframes correctBadge{0%{opacity:0;transform:translate(8px)scale(.7)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.draw-chat>header span>i,.draw-chat-waiting>i span,.draw-chat article,.draw-chat article>em{animation:none}.draw-chat>div{scroll-behavior:auto}}body .draw-page.is-playing .draw-chat article{animation:.35s cubic-bezier(.2,.8,.2,1) both chatMessage}body .draw-page.is-playing .draw-chat article.correct{animation:.55s cubic-bezier(.2,.9,.25,1) both chatCorrect}@media (prefers-reduced-motion:reduce){body .draw-page.is-playing .draw-chat article{animation:none}}.draw-entry-page{padding:24px}.draw-entry{color:#173951;background:#f7fcff;border:5px solid #0878bf;border-radius:18px;width:min(760px,100%);min-height:560px;padding:50px;box-shadow:0 25px 80px #005c9b66}.draw-entry>.draw-brand{justify-content:flex-start}.draw-entry>small{color:#168fd2;letter-spacing:2px;margin-top:42px;font-size:8px;font-weight:950;display:block}.draw-entry h1{letter-spacing:-5px;margin:12px 0 17px;font-size:clamp(48px,8vw,76px);line-height:.88}.draw-entry h1 em{color:#168fd2;font-style:normal}.draw-entry>p{color:#668b9e;font-size:11px}.draw-entry>div:last-child{grid-template-columns:1fr 1fr;gap:12px;margin-top:35px;display:grid}.draw-entry form{background:#fff;border:1px solid #c4dce8;border-radius:12px;flex-direction:column;gap:9px;padding:20px;display:flex}.draw-entry form label{color:#4e819b;letter-spacing:1px;font-size:7px;font-weight:900}.draw-entry input{color:#173951;border:1px solid #a9c9d9;border-radius:7px;outline:none;height:44px;padding:0 12px}.draw-entry input:focus{border-color:#168fd2}.draw-entry button,.draw-start-button{color:#fff;cursor:pointer;background:#168fd2;border:0;border-radius:7px;height:44px;font-size:9px;font-weight:900}.draw-entry button:disabled,.draw-start-button:disabled{opacity:.4;cursor:not-allowed}.draw-error{color:#a63b30;background:#fff0ed;border:1px solid #efa8a0;border-radius:7px;margin-top:12px;padding:10px 12px;font-size:9px}.draw-lobby{min-height:640px}.draw-lobby-list{grid-template-columns:repeat(2,1fr)!important;gap:7px!important;margin-top:25px!important;display:grid!important}.draw-lobby-list article{background:#fff;border:1px solid #c5deea;border-radius:9px;align-items:center;gap:10px;padding:11px;display:flex}.draw-lobby-list article i{color:#2485b4;background:#d7f0fb;border-radius:50%;place-items:center;width:34px;height:34px;font-style:normal;font-weight:900;display:grid}.draw-lobby-list article b{font-size:10px}.draw-lobby-list article span{color:#4aa26a;margin-left:auto;font-size:7px;font-weight:900}.draw-start-button{width:100%;margin-top:15px}.draw-loader{gap:7px;margin-top:24px;display:flex}.draw-loader i{background:#168fd2;border-radius:50%;width:9px;height:9px;animation:1.2s ease-in-out infinite chatDot}.draw-loader i:nth-child(2){animation-delay:.15s}.draw-loader i:nth-child(3){animation-delay:.3s}.draw-countdown{z-index:100;color:#fff;text-align:center;background:#0d91e6ed;place-content:center;animation:.3s both drawCountdownIn;display:grid;position:fixed;inset:0}.draw-countdown small{letter-spacing:3px;font-size:10px;font-weight:900}.draw-countdown strong{text-shadow:0 10px 40px #00589266;margin-top:15px;font-size:clamp(90px,18vw,190px);line-height:.85;animation:.7s cubic-bezier(.2,.85,.2,1) infinite drawCountdownNumber}.draw-main canvas.readonly{cursor:default}.draw-toolbar button:disabled,.draw-toolbar input:disabled{cursor:not-allowed;opacity:.45}.draw-chat>footer small{color:#6b91a4;font-size:8px}@keyframes drawCountdownIn{0%{opacity:0}to{opacity:1}}@keyframes drawCountdownNumber{0%{opacity:0;transform:scale(.55)}35%,75%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.15)}}@media (max-width:620px){.draw-entry-page{padding:0}.draw-entry{border:0;border-radius:0;min-height:100dvh;padding:30px 20px}.draw-entry h1{letter-spacing:-3px;font-size:50px}.draw-entry>div:last-child{grid-template-columns:1fr}.draw-lobby-list{grid-template-columns:1fr!important}}@media (prefers-reduced-motion:reduce){.draw-countdown,.draw-countdown strong,.draw-loader i{animation:none}}.draw-secret form:has(input+input){flex-direction:column}:is(.draw-secret form:has(input+input) input,.draw-secret form:has(input+input) button){flex:none;width:100%}@media (max-width:900px){body .draw-page.is-playing .draw-game{grid-template-columns:190px minmax(0,1fr);height:auto;min-height:calc(100dvh - 24px)}body .draw-page.is-playing .draw-main{min-height:520px}body .draw-page.is-playing .draw-chat{border-top:1px solid #bdd9e8;border-left:0;grid-column:1/-1;min-height:250px}body .draw-page.is-playing .draw-chat>div{max-height:170px}}@media (max-width:620px){body .draw-page.is-playing .draw-shell{width:100%}body .draw-page.is-playing .draw-game{border:0;border-radius:0;grid-template-columns:1fr;min-height:100dvh}body .draw-page.is-playing .draw-chat{grid-column:auto}body .draw-page.is-playing .draw-toolbar label{display:none}body .draw-page.is-playing .draw-toolbar>div{flex:1}}