.Home{display:flex;flex-direction:column;align-items:center;height:50vh;gap:30px}.Home__title{font-family:Permanent Marker,Comic Sans MS,Arial,sans-serif;font-size:40px;color:#00f;text-transform:uppercase;margin-bottom:20px}.Home__section{display:flex;align-items:center;gap:10px}.Home__input{padding:10px;font-size:16px;border:1px solid blue;border-radius:5px;width:250px;box-sizing:border-box}.Home__btn{background:#2fc52f;color:#fff;border:2px solid green;border-radius:10px;padding:10px 14px;font-size:18px;cursor:pointer;height:44px;width:210px}.Home__btn:hover{background:green;transform:scale(1.05)}.Result{height:50vh;max-height:600px;min-height:300px;width:100vw;max-width:930px;min-width:450px;background:#fff;border:1px solid blue;border-radius:5px;display:flex;flex-direction:column;align-items:center}.Result__title{font-size:30px;font-weight:700;color:#00f;text-align:center}.Result__list{list-style:none}.Result__item{display:flex;align-items:center;justify-content:space-between;font-size:20px;padding:10px;margin:5px;width:50vw;max-width:800px;border-radius:10px}.Result__name{font-weight:600;color:#000}.Result__score{color:#000}@keyframes shine{0%{background-position:0% 0}to{background-position:400% 0}}.shiny{background-size:200% 100%!important;animation:shine 10s cubic-bezier(.4,0,.6,1) infinite}.gold-bg{background:linear-gradient(45deg,gold,#ffc107,#fff8dc,#ffc107,gold)}.silver-bg{background:linear-gradient(45deg,silver,#d9d9d9,#fff,#d9d9d9,silver)}.bronze-bg{background:linear-gradient(45deg,#cd7f32,#d28a47,#ffdab9,#d28a47,#cd7f32)}.other-bg{background:linear-gradient(45deg,#87ceeb,#b0e0e6,#e0ffff,#b0e0e6,#87ceeb)}.Topbar{display:flex;justify-content:space-between;align-items:center;background:#fff;padding:0 15px;height:40px;font-family:Arial,sans-serif;font-weight:700;font-size:14px;letter-spacing:1px;border:1px solid blue;border-radius:5px;max-width:900px;min-width:450px;width:100vw;position:fixed;top:0;z-index:10}.Topbar__round{flex:1;text-align:right;margin-right:30px}.Topbar__word{flex:2;text-align:center;display:flex;justify-content:center;gap:5px}.Topbar__letter{display:inline-block;font-size:16px;text-transform:uppercase;font-weight:700}.Topbar__word-length{font-size:16px;font-weight:700}.Topbar__timer{flex:1;text-align:left}.Timer{padding:8px 12px;color:#333;font-size:14px}.canvas-wrapper{width:100vw;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}.canvas-toolbar{height:70px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:10px;width:95vw;padding:10px 14px;background:#fff;border:1px solid blue;border-radius:2px;max-width:900px;min-width:450px}.tool-group{display:flex;align-items:center;gap:8px}.tool-group button{border:none;background:#f0f0f0;padding:8px 10px;border-radius:8px;font-size:18px;cursor:pointer;transition:all .2s}.tool-group button:hover{background:#e2e2e2;transform:scale(1.05)}.tool-group button.active{background:gray;color:#fff}.tool-group input[type=color]{border:none;width:36px;height:36px;border-radius:6px;cursor:pointer;background:transparent;padding:0}.tool-group input[type=range]{width:25vw;cursor:pointer}.palette-container{display:flex;justify-content:space-between;gap:20px}.palette{display:flex;gap:10px}.current-tool{margin-right:auto;font-size:20px}.Swatch{width:28px;height:28px;border:2px solid transparent;border-radius:50%;cursor:pointer;transition:transform .2s,border .2s}.Swatch:hover{transform:scale(1.1)}.Swatch.active{border:2px solid #222;transform:scale(1.15)}.Canvas{height:50vh;max-height:600px;min-height:300px;width:100vw;max-width:930px;min-width:450px;background:#fff;border:1px solid blue;border-radius:5px;touch-action:none;-ms-touch-action:none}.Canvas--active{cursor:crosshair}.Canvas--spectator{cursor:not-allowed;opacity:.85}html,body{overscroll-behavior:contain}.Chat{border:1px solid blue;background:#fff;display:flex;flex-direction:column;height:40vh;width:60vw;min-width:250px;max-width:630px;font-family:Permanent Marker,Comic Sans MS,Roboto,sans-serif;position:relative;box-sizing:border-box}.Chat__list{overflow-y:auto;display:flex;flex-direction:column}.Chat__item{font-size:16px;display:flex;align-items:flex-start;line-height:1.4;border:1px solid grey;padding:10px;background:linear-gradient(to bottom,#fff,#e2d87f)}.Chat__user{font-weight:700;margin-right:8px;color:#222;white-space:nowrap;max-width:120px;overflow:hidden;text-overflow:ellipsis}.Chat__text{color:#333;overflow-wrap:anywhere;flex:1}.Guess__form{display:flex;gap:2px;background:#fff;position:fixed;bottom:0;width:95vw;max-width:930px;box-sizing:border-box;left:50%;transform:translate(-48.5%)}.Guess__field{flex:1;padding:8px 12px;border:1px solid blue;border-radius:6px;outline:none;font-size:20px;background:#fff;text-align:center}.Guess__field:focus{border:2px solid #ff4500}.Guess__length{padding:8px 12px;border:1px solid blue;border-radius:6px;outline:none;font-size:20px;background:#fff;text-align:center;width:50px;font-weight:700}.Guess__send{padding:8px 16px;border:none;background:#ff4500;color:#fff;border-radius:6px;cursor:pointer;font-size:20px;font-weight:700}.Guess__send:hover{background:#ff6700}.Guess__send:disabled{background:#ccc;cursor:not-allowed;opacity:.7}.PlayerList{background:#fff;border:1px solid blue;border-radius:5px;min-width:250px;max-width:300px;width:40vw;height:40vh;box-sizing:border-box;font-family:Permanent Marker,Comic Sans MS,Arial,sans-serif;display:flex;flex-direction:column;overflow-y:auto;box-shadow:0 4px 10px #0000004d}.PlayerList__item{height:50px;margin:2px;gap:20px;text-align:center;justify-content:left;font-weight:700;color:#ff4d4d;text-transform:uppercase;display:flex;align-items:center;background:linear-gradient(to bottom,#fff,#aedeec);font-size:14px}.PlayerList__item:hover{transform:scale(1.02);background:#fff3cc}.PlayerList__item:active{border:3px solid #00ff66;background:#cfc;position:relative}.PlayerList__rank{font-size:18px;max-width:20px}.PlayerList__name{font-weight:700;font-size:14px;color:#000;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}.PlayerList__score{color:#00f;font-size:15px;text-align:right}.PlayerList__you{font-size:12px;color:#888;margin-left:5px}.WordChoice{height:50vh;max-height:600px;min-height:300px;width:100vw;max-width:930px;min-width:450px;background:#ccd8db;border:1px solid blue;border-radius:5px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:30px}.WordChoice__title{font-family:Arial,sans-serif;font-weight:700;color:#00f;font-size:30px;letter-spacing:1px;text-align:center;padding-top:20px}.WordChoice__grid{display:flex;gap:20px}.WordChoice__btn{padding:15px 20px;border-radius:10px;border:1px solid #111;background:#5a5353;color:#fff;cursor:pointer;font-size:20px}.WordChoice__btn:hover{opacity:.9;background:brown}.Scoreboard{height:50vh;max-height:600px;min-height:300px;width:100vw;max-width:930px;min-width:450px;background:#ccd8db;border:1px solid blue;border-radius:5px;display:flex;flex-direction:column;align-items:center}.Scoreboard__title{font-size:30px;font-weight:700;color:#00f;text-align:center}.Scoreboard__list{list-style:none}.Scoreboard__item{display:flex;align-items:center;justify-content:space-between;font-size:20px;margin:10px;width:50vw;max-width:800px}.Scoreboard__name{font-weight:600;color:#000}.Scoreboard__score{color:#000}.Waiting{height:50vh;max-height:600px;min-height:300px;width:100vw;max-width:930px;min-width:450px;background:#ccd8db;border:1px solid blue;border-radius:5px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:30px}.Waiting__title{font-family:Arial,sans-serif;font-weight:700;color:#00f;font-size:30px;letter-spacing:1px;text-align:center;padding-top:20px}.Game{display:flex;flex-direction:column;justify-content:center;align-items:center;height:100vh;gap:4px;width:100vw}.player-chat-container{display:flex;justify-content:center;gap:4px;width:100vw;max-width:1000px}.dropdown-container,.dropdown-label,.dropdown-toggle,.dropdown-menu,.dropdown-item{margin:0;padding:0;border:none;outline:none;background:none;font:inherit;box-sizing:border-box}.dropdown-container{border:solid 1px blue;display:flex;justify-content:space-between;width:200px;background-color:#fff;font-family:Arial,sans-serif;max-height:100px}.dropdown-label{display:flex;width:60%;padding:6px 10px;font-weight:700;font-size:14px;color:#333;text-align:left}.dropdown-toggle{background-color:#fff;color:#333;padding:6px 10px;font-size:14px;font-weight:700;text-align:center;cursor:pointer;position:relative;width:40%;transition:background-color .2s ease}.dropdown-toggle:hover{background-color:#add8e6}.dropdown-toggle:focus{background-color:#add8e6;outline:none}.dropdown-toggle .arrow{position:absolute;right:0;top:50%;transform:translateY(-50%);font-size:12px;pointer-events:none}.dropdown-menu{position:absolute;top:100%;left:0;width:100%;background-color:#fff;border:2px solid #aaa;border-top:none;box-shadow:none;z-index:10;padding:0}.dropdown-item{display:block;width:100%;padding:6px 10px;font-size:14px;font-weight:700;line-height:1.2;color:#333;text-align:center;cursor:pointer;background-color:#fff;transition:background-color .2s ease}.dropdown-item:hover{background-color:#add8e6}.dropdown-item:focus{background-color:#add8e6;outline:none}.private-room{display:flex;flex-direction:column;gap:10vw}.dropdowns{display:grid;grid-template-columns:repeat(2,auto);width:40vw;height:auto;position:relative;margin-left:0%;margin-right:0;gap:10vw}.dropdown{display:flex}.start-btn{position:relative;font-weight:700;padding:10px 20px;height:auto;width:80vw;align-self:center}button{background-color:#1ac41a;border-radius:5%;border:2px solid green;color:#fff;text-align:center;display:inline-block;font-size:16px;cursor:pointer}button:hover{background-color:green}.player-chat-container{display:flex;justify-content:center;gap:5px;width:100vw;max-width:950px;margin-bottom:0}.container{text-align:center;padding:2rem}.checkbox-input{transform:scale(1.5);margin-right:1rem}.checkbox-label{font-size:1.5rem}.checkbox-label input{margin-right:1rem}.spinner-container{display:flex;justify-content:center;align-items:center;margin:2rem;gap:1rem}.loader{width:50px;padding:8px;aspect-ratio:1;border-radius:50%;background:#0ca30c;--_m: conic-gradient(#0000 10%,#000), linear-gradient(#000 0 0) content-box;mask:var(--_m);-webkit-mask-composite:source-out;mask-composite:subtract;animation:l3 4s infinite linear}@keyframes l3{to{transform:rotate(1turn)}}