@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap";:root{color-scheme:dark;font-family:DM Sans,sans-serif;background:#080a10;color:#f7f7fa;--violet: #875df5;--cyan: #36d6c5;--line: #ffffff10}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at 75% 5%,#45279d35,transparent 30%),#080a10}.shell{width:min(1120px,calc(100% - 36px));margin:auto}.topbar{height:78px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:11px;color:inherit;text-decoration:none;font:700 17px Space Grotesk;letter-spacing:.14em}.brand span{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:linear-gradient(140deg,#a27cff,#6740da);box-shadow:0 0 25px #8056ed55;letter-spacing:0}.room-meta{display:flex;align-items:center;gap:18px;color:#747a8a;font-size:10px;letter-spacing:.1em}.room-meta>span{display:flex;align-items:center;gap:7px}.room-meta i{width:7px;height:7px;border-radius:50%;background:#df6679}.room-meta .connected i{background:#48df94;box-shadow:0 0 10px #48df94}.room-meta b{padding:7px 9px;border:1px solid var(--line);border-radius:6px;color:#9b82e3}.intro{min-height:330px;display:flex;align-items:center;justify-content:space-between;padding:60px 5%}.eyebrow{margin:0 0 15px;color:#9674f0;font-size:10px;font-weight:700;letter-spacing:.2em}.intro h1{margin:0;font:600 clamp(46px,7vw,72px)/.98 "Space Grotesk";letter-spacing:-.055em}.intro h1 em{color:#9872ff;font-style:normal}.intro>div>p:last-child{max-width:540px;color:#8d93a2;line-height:1.7}.live-count{width:160px;aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid #9673f533;border-radius:50%;background:#724ae51a;box-shadow:0 0 70px #7147df26}.live-count span{font:600 48px Space Grotesk}.live-count small{color:#878d9c}.game-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:18px}.game-picker button{min-height:88px;display:flex;align-items:center;gap:15px;padding:18px;color:#fff;text-align:left;border:1px solid var(--line);border-radius:14px;background:#11141d;cursor:pointer;transition:.2s}.game-picker button:hover,.game-picker button.active{border-color:#8e68f566;background:#1c1730}.game-picker button>span{width:48px;height:48px;display:grid;place-items:center;border-radius:12px;color:#bca9f9;background:#855cf522;font:600 22px Space Grotesk}.game-picker strong,.game-picker small{display:block}.game-picker strong{font:600 15px Space Grotesk}.game-picker small{margin-top:4px;color:#747a89}.game-picker .invite>span{color:#94f2e7;background:#32cbb818}.arena{padding:34px;border:1px solid #9775f333;border-radius:22px;background:linear-gradient(150deg,#171322,#0e1118 50%);box-shadow:0 35px 90px #0006}.arena-head{display:flex;align-items:end;justify-content:space-between}.arena-head h2{margin:0;font:600 34px Space Grotesk}.turn{display:flex;align-items:center;gap:9px;padding:9px 12px;border:1px solid var(--line);border-radius:9px;color:#a9aebb;background:#ffffff06;font-size:11px}.turn i{width:7px;height:7px;border-radius:50%;background:#8d68f5;box-shadow:0 0 10px #8d68f5}.players{max-width:600px;margin:30px auto 20px;display:grid;grid-template-columns:1fr auto 1fr;gap:20px;align-items:center}.players article{position:relative;display:flex;align-items:center;gap:12px;padding:14px;border:1px solid var(--line);border-radius:12px;background:#11141c}.players article.me{border-color:#9270ef66}.players article.playing .active-bar{position:absolute;inset:auto 12px -2px;height:3px;border-radius:4px;background:#8d68f5}.players article.won{border-color:#48df9488;background:#12302566;box-shadow:0 0 25px #48df9418}.players article.lost{opacity:.55}.score{margin-left:auto;color:#fff;font:700 26px Space Grotesk}.match-meta{display:flex;justify-content:center;gap:10px;margin:22px auto 0}.match-meta>span{min-width:86px;padding:9px 13px;text-align:center;border:1px solid var(--line);border-radius:10px;background:#ffffff05}.match-meta small,.match-meta b{display:block}.match-meta small{color:#696f7e;font-size:8px;letter-spacing:.14em}.match-meta b{margin-top:4px;font:600 17px Space Grotesk}.result-banner{max-width:600px;margin:18px auto 0;padding:16px 18px;display:flex;align-items:center;gap:14px;border:1px solid #48df9444;border-radius:14px;background:linear-gradient(100deg,#15342688,#171322)}.result-banner[hidden]{display:none}.result-banner>span{font-size:30px}.result-banner small,.result-banner strong{display:block}.result-banner small{color:#65dba0;font-size:8px;letter-spacing:.16em}.result-banner strong{margin-top:3px;font:600 19px Space Grotesk}.result-banner p{margin:3px 0 0;color:#8d93a2;font-size:11px}.symbol{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;font:600 20px Space Grotesk}.symbol.x{color:#c8b7ff;background:#835ce52b}.symbol.o{color:#83eee2;background:#2ec6b42b}.players strong,.players small{display:block}.players strong{font:600 13px Space Grotesk}.players small{margin-top:3px;color:#6e7483;font-size:9px}.versus{color:#5f6573;font-size:9px}.board-wrap{min-height:380px;display:grid;place-items:center}.ttt-board{width:min(360px,100%);display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.ttt-board button{aspect-ratio:1;border:1px solid #ffffff12;border-radius:14px;color:#fff;background:#151822;font:600 clamp(38px,7vw,66px) "Space Grotesk";cursor:pointer;transition:.15s}.ttt-board button:not(:disabled):hover{border-color:#906cf0;background:#201a35}.ttt-board button.x{color:#a98cff}.ttt-board button.o{color:#4addcc}.ttt-board button.winner{background:#7650dc55;box-shadow:0 0 25px #7650dc44}.connect-board{width:min(560px,100%);display:grid;grid-template-columns:repeat(7,1fr);gap:7px;padding:14px;border:1px solid #ffffff13;border-radius:18px;background:#171a24}.connect-board button{aspect-ratio:1;padding:7px;border:0;background:none;cursor:pointer}.connect-board button i{display:block;width:100%;height:100%;border-radius:50%;background:#090b11;box-shadow:inset 0 2px 5px #000}.connect-board button.x i{background:#8b63ee;box-shadow:0 0 12px #8b63ee55}.connect-board button.o i{background:#36d6c5;box-shadow:0 0 12px #36d6c555}.connect-board button.winner i{outline:3px solid #fff;outline-offset:2px}.connect-board button:not(:disabled):hover i{box-shadow:inset 0 0 0 2px #ffffff25}.name-editor{max-width:430px;margin:0 auto 18px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:9px;padding:9px;border:1px solid var(--line);border-radius:11px;background:#0b0e15}.name-editor[hidden]{display:none}.name-editor label{padding-left:5px;color:#777e8d;font-size:10px}.name-editor input{min-width:0;padding:9px 11px;color:#fff;border:1px solid #ffffff12;border-radius:7px;outline:none;background:#151822}.name-editor input:focus{border-color:#875df5}.name-editor button{padding:9px 12px;color:#fff;border:0;border-radius:7px;background:#7650dc;cursor:pointer}.arena-footer{display:flex;justify-content:space-between;align-items:center;padding-top:22px;border-top:1px solid var(--line);color:#7d8392;font-size:11px}.arena-footer button{padding:10px 15px;color:#fff;border:1px solid #ffffff17;border-radius:9px;background:#ffffff09;cursor:pointer}.arena-footer>div{display:flex;align-items:center;gap:8px}.series-rule{margin-right:5px;color:#9f86ea;font-weight:600}.arena-footer button.quiet{color:#858b9a;background:transparent}.arena-footer button:disabled{opacity:.35;cursor:not-allowed}.how{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:70px 0}.how article{display:flex;align-items:center;gap:14px;padding:19px;border:1px solid var(--line);border-radius:12px;color:#8a909f;background:#0e1118;font-size:12px}.how b{width:29px;height:29px;display:grid;place-items:center;border-radius:8px;color:#a98df4;background:#8058e925}footer{display:flex;justify-content:space-between;padding:25px 0 35px;border-top:1px solid var(--line);color:#5d6371;font-size:10px}@media(max-width:700px){.shell{width:min(100% - 22px,1120px)}.room-meta b{display:none}.intro{min-height:390px;padding:50px 3%;align-items:flex-start;flex-direction:column}.live-count{width:105px;margin-top:20px}.live-count span{font-size:34px}.game-picker{grid-template-columns:1fr}.arena{padding:20px}.arena-head{align-items:start;flex-direction:column;gap:15px}.players{gap:7px}.players article{padding:9px}.players small{display:none}.board-wrap{min-height:320px}.name-editor{grid-template-columns:1fr auto}.name-editor label{display:none}.arena-footer{align-items:flex-start;flex-direction:column;gap:12px}.arena-footer>div{width:100%;justify-content:space-between}.connect-board{gap:3px;padding:7px}.connect-board button{padding:3px}.how{grid-template-columns:1fr;padding:40px 0}}