:root{color-scheme:dark;--bg:#080b1b;--panel:#10152b;--card:#151a34;--line:rgba(164,174,255,.13);--muted:#9da7c9;--text:#f6f8ff;--blue:#70a9ff;--violet:#9b7cff;--pink:#ed7bd9;--green:#70e5bd;--red:#ff748f;--gold:#ffd78e;--shadow:0 20px 70px rgba(0,0,0,.25);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}html{min-height:100%;background:var(--bg)}body{margin:0;min-height:100vh;color:var(--text);background:radial-gradient(ellipse 65% 38% at 50% -10%,#25235a 0,transparent 72%),#080b1b;overflow-x:hidden}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}button:focus-visible,input:focus-visible{outline:2px solid #bca4ff;outline-offset:3px}a{color:inherit;text-decoration:none}[hidden]{display:none!important}
.ambient{position:fixed;z-index:-1;width:34rem;height:34rem;border-radius:100%;filter:blur(95px);opacity:.1;pointer-events:none}.ambient-a{background:#4e58f3;top:10%;left:-25rem}.ambient-b{background:#a62ecf;right:-28rem;bottom:0}
.topbar{height:79px;border-bottom:1px solid rgba(178,189,255,.09);background:rgba(9,12,29,.73);backdrop-filter:blur(18px);position:sticky;top:0;z-index:20}.topbar-inner{max-width:1360px;height:100%;margin:auto;padding:0 32px;display:flex;align-items:center;justify-content:space-between;gap:18px}.brand{display:inline-flex;align-items:center;gap:10px;flex:none}.brand-mark{width:41px;height:41px;border-radius:13px;background:linear-gradient(145deg,#7dafff,#7752e8 60%,#3a2d90);box-shadow:0 4px 24px #8073ff61;display:grid;place-items:center;transform:rotate(-8deg);border:1px solid #b8c1ff7a}.brand-mark span{font-size:23px;color:#fff;transform:rotate(8deg)}.brand-copy{display:grid;line-height:1}.brand-copy strong{font-size:17px;letter-spacing:.025em;font-weight:900}.brand-copy strong span{color:#a58aff}.brand-copy small{font-size:7px;letter-spacing:.19em;color:#9da7c9;font-weight:800;margin-top:5px}.top-actions{display:flex;align-items:center;gap:12px}.install-link{border:0;background:transparent;color:#b8bfe2;font-size:12px;font-weight:700;padding:10px}.profile-chip{border:1px solid var(--line);background:#151a31;color:#e6eaff;border-radius:12px;padding:11px 13px;font-weight:700;font-size:12px;display:flex;gap:8px;align-items:center;max-width:200px}.profile-chip #header-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.status-dot{height:7px;width:7px;background:#62e4af;border-radius:50%;box-shadow:0 0 13px #59dfab}.chevron{color:#858eaf}
.network-banner{text-align:center;background:#52331a;color:#ffe1b3;font-size:12px;font-weight:700;padding:10px 20px;position:sticky;top:79px;z-index:19}.app-shell{max-width:1360px;margin:0 auto;padding:38px 32px 70px}.loading-card{min-height:65vh;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--muted);font-size:13px}.loading-orbit{width:40px;height:40px;border:3px solid #33345f;border-top-color:#9f89ff;border-radius:50%;animation:spin .8s linear infinite}
.eyebrow{display:flex;align-items:center;gap:8px;text-transform:uppercase;color:#a999ff;font-size:10px;font-weight:850;letter-spacing:.17em}.eyebrow .spark{font-size:16px;color:#c9b8ff}.subtle{color:var(--muted)}.micro{font-size:11px;color:var(--muted);line-height:1.55}.section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:17px}.section-head h2,.section-head h3{font-size:16px;margin:0;font-weight:800;letter-spacing:-.02em}.section-head p{font-size:12px;color:var(--muted);margin:5px 0 0}.badge{display:inline-flex;align-items:center;gap:6px;border:1px solid #7773b441;border-radius:100px;padding:6px 10px;font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#c4bcff;background:#7667d018;white-space:nowrap}.badge.green{color:#80eac5;background:#56bd9820;border-color:#60c8a13c}.badge.gold{color:#ffda94;background:#ba8b3020;border-color:#ffcb6a38}
.button{border:1px solid transparent;border-radius:13px;padding:14px 19px;min-height:47px;color:white;font-weight:800;font-size:12px;letter-spacing:.01em;display:inline-flex;align-items:center;justify-content:center;gap:9px;transition:transform .18s,filter .18s,box-shadow .18s}.button:hover:not(:disabled){transform:translateY(-2px);filter:brightness(1.12)}.button:active:not(:disabled){transform:translateY(0)}.button.primary{background:linear-gradient(110deg,#788dff,#9b69f2);box-shadow:0 8px 24px #7762ec45}.button.ghost{background:#ffffff08;border-color:#ffffff1f;color:#e4e7ff}.button.dark{background:#202644;border-color:#ffffff12}.button.danger{background:#ff748f12;color:#ff9aab;border-color:#ff748f25}.button.compact{min-height:34px;padding:8px 11px;font-size:10px;border-radius:9px}.button.wide{width:100%}.arrow{font-size:16px;line-height:0}.card{border:1px solid var(--line);border-radius:21px;background:linear-gradient(145deg,rgba(25,30,58,.96),rgba(15,19,40,.97));box-shadow:var(--shadow)}
.home-header{display:flex;justify-content:space-between;align-items:flex-end;margin:0 0 23px;gap:20px}.home-header h1{font-size:clamp(26px,3vw,36px);letter-spacing:-.05em;margin:9px 0 4px}.home-header p{color:var(--muted);font-size:13px;margin:0}.player-id{padding:11px 13px;border:1px solid var(--line);border-radius:12px;display:flex;align-items:center;gap:11px;background:#15192e}.player-id small{font-size:9px;color:#949dbd;text-transform:uppercase;letter-spacing:.12em;display:block;margin-bottom:4px}.player-id strong{font-size:12px;letter-spacing:.1em}.copy-btn{border:0;background:#7986ff1c;color:#b7baff;border-radius:8px;width:31px;height:31px;font-size:15px}.home-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(285px,.75fr);gap:20px}.hero{min-height:404px;position:relative;overflow:hidden;display:flex;align-items:center;background:#111232 url('arena.webp') center/cover no-repeat}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,12,34,.96) 3%,rgba(13,14,39,.9) 38%,rgba(17,18,52,.45) 72%,rgba(13,14,37,.3)),linear-gradient(0deg,#10112a88,transparent)}.hero-content{position:relative;z-index:2;padding:43px;max-width:490px}.hero-title{font-size:clamp(36px,4vw,58px);font-weight:950;letter-spacing:-.065em;line-height:.99;margin:18px 0}.hero-title span{background:linear-gradient(105deg,#92baff,#bba2ff 70%,#f2a1f7);color:transparent;background-clip:text}.hero-content p{font-size:13px;line-height:1.8;color:#b6bfdb;max-width:310px;margin:0 0 23px}.hero-actions{display:flex;gap:10px;flex-wrap:wrap}.hero-feature{display:flex;gap:14px;margin-top:31px;align-items:center}.hero-feature span{font-size:10px;font-weight:700;color:#c1c8e3}.hero-feature i{height:3px;width:3px;background:#737a9b;border-radius:50%}
.home-side{display:grid;gap:20px;align-content:start}.side-card{padding:23px}.side-card .section-head{margin-bottom:15px}.how-row{display:flex;gap:12px;align-items:flex-start;margin:15px 0}.how-icon{width:31px;height:31px;flex:none;border-radius:10px;display:grid;place-items:center;background:#9184ff1b;color:#c2b5ff;font-size:15px}.how-row strong{font-size:12px;display:block;margin-bottom:3px}.how-row p{font-size:11px;line-height:1.55;color:var(--muted);margin:0}.invite-empty{border:1px dashed #a2aef126;border-radius:13px;padding:19px 12px;text-align:center;color:#929bbd;font-size:11px}.invite-entry{padding:13px;background:#ffffff07;border:1px solid #ffffff0e;border-radius:13px;margin-top:8px}.invite-entry strong{font-size:12px}.invite-entry p{font-size:11px;color:var(--muted);margin:5px 0 12px}.invite-actions{display:flex;gap:8px}.rules-note{color:#7984a5;font-size:10px;line-height:1.6;margin:16px 0 0}
.room-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px}.room-header h1{font-size:26px;letter-spacing:-.05em;margin:6px 0 0}.room-header-actions{display:flex;align-items:center;gap:9px}.room-code{font-size:10px;color:#a8b1d3;padding:10px 12px;background:#ffffff08;border:1px solid var(--line);border-radius:10px}.room-code strong{color:#e4e7ff;letter-spacing:.09em;margin-left:5px}.lobby-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(300px,.92fr);gap:20px}.lobby-card{padding:27px}.players-list{display:grid;gap:8px}.player-row{display:flex;align-items:center;gap:11px;padding:11px;border:1px solid #ffffff0a;background:#ffffff05;border-radius:12px}.avatar{height:38px;width:38px;border-radius:12px;display:grid;place-items:center;flex:none;color:white;font-size:13px;font-weight:850;background:linear-gradient(140deg,#9b83fb,#506de1);box-shadow:inset 0 0 0 1px #ffffff26}.avatar.alt1{background:linear-gradient(145deg,#e395c6,#aa59be)}.avatar.alt2{background:linear-gradient(145deg,#73cfc9,#4692b8)}.avatar.alt3{background:linear-gradient(145deg,#f4bc7c,#d67a70)}.player-info{min-width:0;flex:1}.player-info strong{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-info small{display:block;margin-top:3px;color:#8f9abd;font-size:10px}.player-info small.online{color:#72d9b6}.player-extra{display:flex;align-items:center;gap:7px}.host-label{font-size:9px;color:#e2bd7e;font-weight:800;letter-spacing:.07em}.icon-btn{border:0;background:#ffffff0b;color:#c1c7e5;border-radius:8px;min-height:30px;min-width:30px}.player-slot{border:1px dashed #ffffff1b;background:transparent;color:#7882a7;font-size:11px}.slot-plus{height:38px;width:38px;border-radius:12px;display:grid;place-items:center;border:1px dashed #ffffff1d;font-size:18px}.start-bar{margin-top:20px}.start-bar p{font-size:10px;color:#929bbf;margin:9px 0 0;text-align:center}.invite-box{margin-top:22px;border-top:1px solid var(--line);padding-top:21px}.field-label{display:block;color:#acb5d5;font-size:10px;letter-spacing:.04em;font-weight:800;margin-bottom:8px}.input-row{display:flex;gap:8px}.input{background:#0b1023;color:#f2f4ff;border:1px solid #ffffff1d;border-radius:11px;min-width:0;width:100%;padding:12px 13px;font-size:12px;outline:0}.input::placeholder{color:#6e789c}.input:focus{border-color:#9e8cff;box-shadow:0 0 0 3px #8679e31c}.search-result{display:flex;align-items:center;gap:10px;margin-top:12px;padding:10px 11px;border-radius:12px;background:#7d72ec12;border:1px solid #9389ff24}.search-result .player-info small{color:#a7b1d3}
.chat-card{display:flex;flex-direction:column;min-height:400px;overflow:hidden}.chat-head{padding:20px 21px;border-bottom:1px solid var(--line);margin:0}.chat-head h3{font-size:14px}.chat-body{height:255px;overflow:auto;padding:18px 20px;scrollbar-color:#444574 transparent;scrollbar-width:thin}.chat-empty{text-align:center;color:#7e89ad;font-size:11px;padding:50px 10px}.chat-message{display:flex;gap:9px;margin:0 0 14px}.chat-message .avatar{height:29px;width:29px;border-radius:9px;font-size:10px}.chat-message-content{min-width:0}.chat-meta{font-size:10px;font-weight:800;color:#aeb8d8}.chat-meta span{font-weight:500;color:#707a9c;margin-left:5px}.chat-text{font-size:12px;line-height:1.5;color:#ecedff;word-break:break-word;margin:4px 0 0}.chat-bottom{padding:12px 16px 17px;margin-top:auto;border-top:1px solid var(--line)}.emoji-bar{display:flex;gap:3px;margin-bottom:10px}.emoji-btn{padding:3px;background:none;border:0;font-size:17px;line-height:1.5;border-radius:7px}.emoji-btn:hover{background:#ffffff13}.chat-send{height:42px;width:45px;border-radius:11px;padding:0;font-size:17px}
.game-grid{display:grid;grid-template-columns:minmax(215px,.75fr) minmax(0,1.5fr) minmax(235px,.83fr);gap:17px;align-items:start}.standings-card{padding:20px}.standings-card .section-head{align-items:center}.score-list{display:grid;gap:8px}.score-row{display:flex;gap:9px;align-items:center;padding:11px 9px;border:1px solid transparent;border-radius:12px;background:#ffffff06}.score-row.current{background:#7e75e91e;border-color:#a095ff4d}.score-rank{font-size:10px;font-weight:800;color:#8a95b8;width:14px;text-align:center}.score-row .avatar{width:34px;height:34px;border-radius:10px;font-size:11px}.score-value{font-size:18px;font-weight:900;letter-spacing:-.06em}.score-points{font-size:8px;color:#8d98ba;text-transform:uppercase;letter-spacing:.08em}.lives{display:flex;gap:2px;margin-top:4px}.life{color:#fc829e;font-size:10px}.life.lost{color:#464b68}.standings-footer{border-top:1px solid var(--line);padding-top:14px;margin-top:15px;font-size:10px;color:#8791b4;line-height:1.6}
.arena-card{position:relative;overflow:hidden;min-height:526px;text-align:center;display:flex;flex-direction:column;align-items:center;background:#151238 url('arena.webp') center/cover}.arena-card:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#11112bdd,#11142c6b 42%,#101127d9 100%)}.arena-content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;width:100%;height:100%;min-height:526px;padding:25px 22px}.arena-top{display:flex;justify-content:space-between;align-items:center;width:100%}.arena-round{font-size:10px;color:#d8d3ff;font-weight:850;letter-spacing:.14em;text-transform:uppercase}.turn-title{font-size:clamp(20px,2.7vw,29px);letter-spacing:-.045em;margin:20px 0 3px}.turn-subtitle{margin:0;color:#b5bedb;font-size:11px;min-height:17px}.dice-stage{flex:1;min-height:220px;width:100%;display:flex;align-items:center;justify-content:center;position:relative;perspective:700px}.dice-orbit{position:absolute;width:225px;height:225px;border:1px solid #a2a5ff2c;border-radius:50%;box-shadow:0 0 55px #8065fd20,inset 0 0 42px #5a5de31a}.dice-orbit:before,.dice-orbit:after{content:"";position:absolute;border-radius:50%;inset:18px;border:1px solid #a7aaff1c}.dice-orbit:after{inset:45px}.die{width:112px;height:112px;position:relative;transform-style:preserve-3d;transform:rotateX(-18deg) rotateY(-25deg);filter:drop-shadow(0 20px 18px #05071799);transition:transform .5s cubic-bezier(.2,.8,.2,1)}.die.rolling{animation:dice-roll .8s cubic-bezier(.2,.6,.3,1)}.die-face{position:absolute;width:112px;height:112px;border:2px solid #d4e7ffb3;border-radius:22px;display:grid;place-items:center;font-size:60px;font-weight:950;color:#26275f;text-shadow:0 2px #fff9;background:linear-gradient(145deg,#fff,#c4d8ff 46%,#9990f3);box-shadow:inset 0 0 25px #fff6}.die-front{transform:translateZ(56px)}.die-right{background:linear-gradient(135deg,#8f8ef0,#5359bc);transform:rotateY(90deg) translateZ(56px);color:#e3e4ff}.die-top{background:linear-gradient(140deg,#e9f5ff,#a8bbff);transform:rotateX(90deg) translateZ(56px);font-size:32px;color:#7179c9}.die.danger .die-front{background:linear-gradient(145deg,#fff1f2,#ffb7c5,#f476a3);color:#862449}.die.danger .die-right{background:#c45591}.arena-controls{display:flex;align-items:center;justify-content:center;gap:13px;width:100%;margin-top:8px}.roll-btn{min-width:170px;height:52px;font-size:13px}.timer-ring{--progress:100%;height:52px;width:52px;padding:3px;border-radius:50%;background:conic-gradient(#b99cff var(--progress),#ffffff25 0);flex:none}.timer-ring div{height:100%;width:100%;border-radius:50%;background:#17142f;display:grid;place-items:center;font-weight:900;font-size:14px}.timer-ring.urgent{background:conic-gradient(#ff879f var(--progress),#ffffff25 0)}.timer-hint{font-size:10px;color:#adb7d6;margin:10px 0 0}.arena-event{font-size:10px;color:#c4cae6;margin-top:12px;min-height:15px}.break-content{max-width:380px;margin:auto}.break-content h2{font-size:30px;letter-spacing:-.05em;margin:12px 0}.break-content p{font-size:12px;color:#c5cae4;line-height:1.6}.trophy{font-size:64px;filter:drop-shadow(0 8px 25px #ffc6689c);animation:float 3s ease-in-out infinite}.results-list{display:grid;gap:7px;width:min(100%,330px);margin:16px auto}.result-row{display:flex;align-items:center;gap:9px;background:#ffffff10;border:1px solid #ffffff14;padding:9px 11px;border-radius:10px;text-align:left;font-size:11px}.result-row strong{flex:1}.result-row b{color:#f7e1aa}.result-row em{font-style:normal;color:#a1e3ca;font-size:9px;font-weight:800;text-transform:uppercase}.game-chat{min-height:526px}.game-chat .chat-body{height:360px}.mobile-only{display:none}
.overlay{position:fixed;inset:0;background:#060819c9;backdrop-filter:blur(11px);z-index:100;display:grid;place-items:center;padding:18px}.modal{width:min(100%,440px);padding:30px;position:relative;border-radius:23px;background:linear-gradient(150deg,#202446,#101429);border:1px solid #a3a1ff35;box-shadow:0 30px 100px #0009}.modal:before{content:"";position:absolute;inset:0;border-radius:23px;background:radial-gradient(circle at 85% 0,#8d73ff20,transparent 42%);pointer-events:none}.modal>*{position:relative}.modal h2{font-size:26px;letter-spacing:-.05em;margin:13px 0 8px}.modal p{color:#aeb8d9;font-size:12px;line-height:1.7;margin:0 0 20px}.modal .input{height:48px;margin-bottom:13px}.modal-close{position:absolute;right:19px;top:18px;border:0;background:#ffffff12;color:#d5d9ef;width:32px;height:32px;border-radius:9px;font-size:18px}.modal-emblem{width:50px;height:50px;border-radius:16px;background:linear-gradient(140deg,#7d9fff,#a06af3);display:grid;place-items:center;font-size:25px;box-shadow:0 9px 30px #8c72ed55}.modal-foot{font-size:10px!important;color:#8d98ba!important;margin:15px 0 0!important}.modal-id{padding:13px;border:1px solid #ffffff1a;border-radius:11px;background:#0c1024;font-size:12px;color:#c5cdef;margin-bottom:14px;word-break:break-all}.modal-id strong{float:right;color:#eaeaff;letter-spacing:.1em}.toast{position:fixed;left:50%;bottom:max(24px,env(safe-area-inset-bottom));z-index:200;transform:translate(-50%,20px);opacity:0;pointer-events:none;transition:.2s;background:#262c4c;border:1px solid #a2a9ff42;border-radius:12px;color:#f7f8ff;padding:12px 17px;box-shadow:0 12px 40px #0007;font-size:12px;font-weight:700;text-align:center;max-width:calc(100vw - 30px)}.toast.show{opacity:1;transform:translate(-50%,0)}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes dice-roll{0%{transform:rotateX(-18deg) rotateY(-25deg)}65%{transform:rotateX(355deg) rotateY(345deg) scale(1.1)}100%{transform:rotateX(342deg) rotateY(335deg)}}@keyframes float{50%{transform:translateY(-9px)}}
.floating-reaction{position:absolute;z-index:5;bottom:20%;font-size:34px;pointer-events:none;animation:reaction-float 2.2s ease-out forwards}@keyframes reaction-float{0%{opacity:0;transform:translateY(0) scale(.6)}15%{opacity:1}100%{opacity:0;transform:translateY(-180px) scale(1.25) rotate(14deg)}}
@media(max-width:1000px){.game-grid{grid-template-columns:minmax(185px,.7fr) minmax(0,1.4fr)}.game-chat{grid-column:1/-1;min-height:340px}.game-chat .chat-body{height:220px}.arena-card,.arena-content{min-height:500px}}
@media(max-width:700px){.topbar{height:68px}.topbar-inner{padding:0 17px}.brand-mark{height:36px;width:36px;border-radius:11px}.brand-copy strong{font-size:15px}.brand-copy small{font-size:6px}.install-link{font-size:11px;padding:7px}.profile-chip{padding:9px;font-size:11px;max-width:128px}.network-banner{top:68px}.app-shell{padding:24px 15px 45px}.home-header{margin-bottom:18px}.home-header h1{font-size:27px}.home-header p{font-size:11px}.player-id{padding:9px;gap:8px}.player-id strong{font-size:10px}.home-grid,.lobby-grid,.game-grid{grid-template-columns:1fr;gap:13px}.hero{min-height:350px}.hero-content{padding:28px 23px}.hero-title{font-size:45px}.hero-content p{font-size:12px;max-width:255px}.hero-feature{gap:9px;margin-top:25px}.hero-feature span{font-size:9px}.home-side{gap:13px}.side-card{padding:19px}.room-header{margin-bottom:16px}.room-header h1{font-size:23px}.room-header-actions{gap:5px}.room-code{padding:9px;font-size:9px}.room-header .button{padding:9px 10px}.lobby-card{padding:19px}.game-grid>.arena-card{order:0}.game-grid>.standings-card{order:1}.game-grid>.game-chat{order:2;grid-column:auto}.arena-card,.arena-content{min-height:460px}.arena-content{padding:20px 16px}.turn-title{margin-top:17px;font-size:24px}.dice-stage{min-height:205px}.dice-orbit{width:190px;height:190px}.die,.die-face{width:98px;height:98px}.die-face{font-size:52px;border-radius:19px}.die-front{transform:translateZ(49px)}.die-right{transform:rotateY(90deg) translateZ(49px)}.die-top{transform:rotateX(90deg) translateZ(49px)}.standings-card{padding:18px}.game-chat{min-height:340px}.game-chat .chat-body{height:210px}.chat-card{min-height:360px}.chat-body{height:220px}.mobile-only{display:block}.toast{font-size:11px}}
@media(max-width:370px){.install-link span{display:none}.hero-title{font-size:39px}.home-header{align-items:center}.home-header h1{font-size:23px}.player-id small{font-size:8px}.room-code{display:none}.button{padding-left:13px;padding-right:13px}.modal{padding:25px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}