@import url('data:text/css,');
:root{--bg:#170f26;--panel:#2c1b40;--pink:#ff5bac;--gold:#ffd955;--muted:#b4a5c5;color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 80% 40%,#5c285333,transparent 60%),var(--bg);color:#fff8fe;font-family:Arial,Helvetica,sans-serif;min-height:100dvh}button,a,input,select{-webkit-tap-highlight-color:transparent}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid var(--gold);outline-offset:3px}button{border:0}button:disabled{opacity:.55;cursor:default}[hidden]{display:none!important}a{color:inherit;text-decoration:none}.top{height:80px;max-width:1440px;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:0 4%;border-bottom:1px solid #ffffff10}.brand{font-size:22px;letter-spacing:-1px;font-weight:900}.brand span{color:var(--pink)}.brand small{display:block;letter-spacing:3px;font-size:8px;margin-top:5px;color:#ac98bd}.top nav{display:flex;align-items:center;gap:12px}.top nav a{font-size:12px;color:#cabdd8;margin-right:10px}.top button{color:#e8d8f5;background:#ffffff08;border:1px solid #ffffff16;border-radius:10px;padding:10px 12px}.top button:hover{background:#ffffff18}main{max-width:1380px;padding:32px 4%;margin:auto;display:grid;grid-template-columns:minmax(0,1fr) 345px;gap:48px;align-items:start}.play-area{border:1px solid #ffffff12;border-radius:24px;background:radial-gradient(ellipse at center,#78395c30,transparent 70%),#21152e;padding:18px 24px 15px;min-width:0}.board-heading,.board-bottom{display:flex;align-items:center;justify-content:space-between;gap:8px}.badge,#connection{font-size:9px;letter-spacing:1.4px;color:#c8b6d7}.badge{color:var(--gold)}.board-stage{height:calc(100dvh - 200px);min-height:450px;max-height:850px;display:grid;place-items:center;perspective:1400px;padding:20px 0}.board-art{position:relative;aspect-ratio:1086/1448;height:100%;max-width:100%;border-radius:12px;transform:rotateX(5deg) rotateZ(-1deg);transform-origin:center;box-shadow:0 6px 0 #744268,0 11px 0 #10081f,0 25px 50px #0007;transition:transform .5s;isolation:isolate}.board-art.flat{transform:none}.board-art img{display:block;height:100%;width:100%;border-radius:12px;user-select:none}.board-bottom{font-size:10px;color:#b9a4c9}.board-bottom button{font-size:10px;padding:8px 10px;border-radius:12px;background:#ffffff0a;color:#e4c8ee}.pawn{position:absolute;width:4.5%;height:3.7%;left:0;top:0;transform:translate(-50%,-75%);transition:left 350ms ease-in-out,top 350ms ease-in-out;z-index:5;filter:drop-shadow(0 3px 2px #000b);display:grid;place-items:center;font-size:clamp(7px,1vw,12px);font-weight:bold;color:#140d20;text-shadow:0 1px #ffffff88;border-radius:50% 50% 35% 35%;background:radial-gradient(circle at 35% 20%,#fff 0%,var(--pawn) 40%,color-mix(in srgb,var(--pawn),#000 45%) 100%);border:1px solid #ffffffb3}.pawn:before{content:'';position:absolute;top:-25%;left:20%;width:60%;height:53%;border-radius:50%;background:radial-gradient(circle at 30% 20%,white,var(--pawn) 55%,color-mix(in srgb,var(--pawn),#000 40%));border:1px solid #ffffffa0;z-index:-1}.pawn.active{outline:2px solid white;outline-offset:3px}.title{padding:14px 0 20px}.eyebrow{font-size:9px;letter-spacing:2px;color:var(--gold);font-weight:700}.title h1{font-size:42px;line-height:1.05;letter-spacing:-1.7px;margin:15px 0}.title h1 span{color:var(--pink)}.title p{font-size:12px;color:var(--muted);line-height:1.8}.card{background:linear-gradient(135deg,#332246,#271a38);border:1px solid #ffffff13;border-radius:20px;padding:22px}.switch{display:flex;background:#180f24;padding:4px;border-radius:12px;margin-bottom:23px}.switch button{flex:1;color:#b8a4cd;background:none;padding:12px 0;font-size:11px;border-radius:9px}.switch button.active{background:#593657;color:#fff}.switch b{background:var(--pink);color:#25122f;padding:2px 5px;border-radius:4px;font-size:9px;margin-left:4px}.label{display:block;font-size:9px;color:#c8b5d6;letter-spacing:1.6px;margin:16px 0 8px}input,select{display:block;width:100%;padding:12px;border:1px solid #7d60833d;border-radius:9px;background:#1c142b;color:white;font-size:13px;min-height:44px}input::placeholder{color:#9b88ac}input.name-input{padding-left:36px}.name-wrap{position:relative;margin:9px 0}.name-dot{width:12px;height:12px;position:absolute;top:16px;left:13px;border-radius:50%;background:var(--pawn);box-shadow:0 2px 3px #0006}.primary{background:var(--gold);color:#352035;border-radius:11px;padding:15px;font-size:12px;font-weight:bold;width:100%;box-shadow:0 3px 0 #b18c3e;min-height:46px}.primary:hover:enabled{background:#ffe68b}.card>.primary,#localStart,#create{margin-top:18px}.or{text-align:center;letter-spacing:2px;font-size:8px;color:#a992b7;margin:24px 0 14px}.join{display:flex;gap:8px}.join input{min-width:0;letter-spacing:3px;text-transform:uppercase}.join button{border-radius:9px;padding:0 16px;background:var(--pink);color:#30152c;font-weight:bold;font-size:12px}.hint{font-size:10px;color:#ac95bc;text-align:center;margin:16px 0 0}.smallprint{text-align:center;color:#917aab;font-size:10px;line-height:1.8;padding:20px 0}#error{color:#ffd19d;font-size:12px;line-height:1.6;padding-top:14px}.status h2{font-size:25px;letter-spacing:-.6px;margin:10px 0}.status p{color:#bca6ce;font-size:11px;line-height:1.6;min-height:34px;margin:8px 0}.dice-row{display:flex;align-items:center;gap:20px;margin:15px 0 25px}.dice-row .primary{flex:1}.dice-scene{width:85px;height:90px;perspective:650px;display:grid;place-items:center}.dice{width:62px;height:62px;position:relative;transform-style:preserve-3d;transform:rotateX(-18deg) rotateY(22deg);transition:transform .7s cubic-bezier(.2,.7,.3,1)}.face{position:absolute;inset:0;background:linear-gradient(135deg,#fff,#f5d9ed);border:2px solid #e2b6cf;border-radius:11px;display:grid;grid-template:repeat(3,1fr)/repeat(3,1fr);padding:9px;gap:3px;backface-visibility:hidden;box-shadow:inset 0 0 8px #d89abc}.face i{display:block;background:radial-gradient(circle at 65% 70%,#9e426e,#3b1839);border-radius:50%;box-shadow:inset 1px 2px 1px #280a2d}.f1{transform:translateZ(31px)}.f2{transform:rotateY(90deg) translateZ(31px)}.f3{transform:rotateX(90deg) translateZ(31px)}.f4{transform:rotateX(-90deg) translateZ(31px)}.f5{transform:rotateY(-90deg) translateZ(31px)}.f6{transform:rotateY(180deg) translateZ(31px)}.f1 i{grid-area:2/2}.f2 i:first-child,.f3 i:first-child,.f4 i:first-child,.f5 i:first-child,.f6 i:first-child{grid-area:1/1}.f2 i:last-child,.f3 i:last-child,.f4 i:last-child,.f5 i:last-child,.f6 i:last-child{grid-area:3/3}.f3 i:nth-child(2),.f5 i:nth-child(3){grid-area:2/2}.f4 i:nth-child(2),.f5 i:nth-child(2),.f6 i:nth-child(2){grid-area:1/3}.f4 i:nth-child(3),.f5 i:nth-child(4),.f6 i:nth-child(5){grid-area:3/1}.f6 i:nth-child(3){grid-area:2/1}.f6 i:nth-child(4){grid-area:2/3}.dice.rolling{animation:tumble .8s linear infinite}@keyframes tumble{from{transform:rotateX(-18deg) rotateY(22deg) rotateZ(0)}to{transform:rotateX(702deg) rotateY(742deg) rotateZ(360deg)}}.players{border-top:1px solid #ffffff12;padding-top:6px}.player{display:flex;gap:10px;align-items:center;font-size:12px;padding:11px 6px;border-bottom:1px solid #ffffff0a;border-radius:6px}.player.current{background:#ffffff08}.player .dot{width:23px;height:23px;display:grid;place-items:center;font-size:10px;font-weight:bold;background:var(--pawn);color:#28152f;border-radius:50%;flex-shrink:0}.player .name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player .pos{font-size:10px;color:#bca8cb}.player button{background:transparent;color:#aa8dbc;font-size:17px}.game-foot{display:flex;align-items:center;justify-content:space-between;margin-top:20px;color:#a18aaf;font-size:9px}.game-foot button{background:none;color:#c0a8ce;font-size:10px;padding:5px 0}.roomline{display:flex;justify-content:space-between;align-items:center;padding-bottom:20px;margin-bottom:18px;border-bottom:1px solid #ffffff10;font-size:9px;color:#bda3d1}.roomline strong{color:var(--gold);letter-spacing:2px;margin-left:6px;font-size:12px}.roomline button{background:transparent;color:var(--pink);font-size:10px}.toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#ffe078;color:#321c32;padding:13px 23px;border-radius:20px;font-size:12px;z-index:30;opacity:0;pointer-events:none;transition:opacity .2s}.toast.show{opacity:1}dialog{background:#2b1b3e;color:#fff;border:1px solid #785084;border-radius:24px;max-width:460px;padding:28px;margin:auto;line-height:1.8}dialog::backdrop{background:#0e061ed9;backdrop-filter:blur(8px)}dialog h2{line-height:1.2;font-size:27px}dialog p,dialog li{font-size:12px;color:#d1bedf}dialog ol{padding-left:18px}body.focus .top{height:44px}body.focus .title,body.focus .smallprint,body.focus .board-heading,body.focus .board-bottom{display:none}body.focus main{padding:8px 2%;gap:25px}body.focus .board-stage{height:calc(100dvh - 75px);max-height:none;padding:0;min-height:0}body.focus .play-area{padding:6px;background:none;border:0}body.focus #setup{max-height:calc(100dvh - 60px);overflow:auto}
@media(max-width:900px){main{gap:24px;grid-template-columns:minmax(0,1fr) 300px;padding:24px 3%}.play-area{padding:14px}.title h1{font-size:35px}.card{padding:18px}.board-heading{font-size:8px}.badge{letter-spacing:.5px}#connection{font-size:7px}.board-bottom span{display:none}}
@media(max-width:680px){.top{height:60px;padding:0 4%}.brand{font-size:18px}.brand small{font-size:7px}.top nav{gap:6px}.top nav a{font-size:10px;margin-right:1px}.top button{padding:8px 10px;font-size:12px}.top #full span{display:none}main{display:flex;flex-direction:column;padding:12px;gap:15px}main>aside{width:100%}.title{display:none}.play-area{width:100%;padding:10px 6px;border-radius:15px}.board-heading{padding:0 7px;margin-bottom:6px}.board-stage{height:calc(100dvh - 300px);min-height:320px;max-height:680px;padding:5px}.board-art{max-width:100%}.board-bottom{justify-content:center;margin-top:6px}.card{padding:16px;border-radius:16px}.switch{margin-bottom:16px}#names{display:grid;grid-template-columns:1fr 1fr;gap:0 8px}.name-wrap{min-width:0}.smallprint{padding:8px 0}.dice-row{margin:8px 0;gap:14px}.dice-scene{height:78px;width:82px}.status h2{font-size:20px;margin:6px 0}.status p{min-height:0;margin:4px 0}.eyebrow{font-size:8px}.players{display:flex;gap:4px;overflow:auto;padding-top:8px}.player{padding:7px 5px;flex:1;flex-direction:column;gap:5px;min-width:47px;border:0;text-align:center;font-size:10px}.player .name{max-width:100%}.player .pos{font-size:8px}.player .dot{height:20px;width:20px}.player button{padding:0;line-height:12px}.roomline{padding-bottom:10px;margin-bottom:12px}.game-foot{margin-top:10px}.pawn{font-size:7px}body.focus{height:100dvh;overflow:hidden}body.focus main{height:calc(100dvh - 44px);padding:2px 8px;display:grid;grid-template-rows:minmax(0,1fr) auto;gap:4px}body.focus .play-area{height:100%;min-height:0;overflow:hidden;padding:0}body.focus .board-stage{height:100%;width:100%;padding:5px 8px}body.focus .board-art{height:100%;width:auto;max-width:calc((100dvh - 250px)*.75)}body.focus aside{min-height:0}body.focus .game{padding:9px 12px}body.focus .game .status{float:left;width:calc(100% - 150px);padding-top:8px}body.focus .game .status h2{font-size:16px;margin:4px 0}body.focus .game .status p{font-size:9px}body.focus .game .dice-row{margin:0;margin-left:auto;width:145px;height:60px;gap:8px}body.focus .game .dice-scene{width:55px;height:60px;scale:.65;flex-shrink:0}body.focus .game #roll{padding:10px 5px;font-size:10px;min-height:40px}body.focus .players{clear:both;padding-top:4px}body.focus .player{padding:3px 0;flex-direction:row;gap:4px;justify-content:center;min-width:40px}body.focus .player .dot{height:15px;width:15px;font-size:8px}body.focus .player .pos,body.focus .player button{display:none}body.focus .roomline,body.focus .game-foot{display:none}body.focus #setup{max-height:60dvh}body.focus:has(#setup:not([hidden])) main{grid-template-rows:minmax(130px,1fr) auto}body.focus #error{position:fixed;bottom:170px;background:#302039;padding:8px;left:10px;right:10px;border-radius:8px}body.focus #error:empty{display:none}}
@media(max-width:680px) and (orientation:landscape){body.focus main{display:grid;grid-template-columns:minmax(0,1fr) 260px;grid-template-rows:1fr;gap:10px}body.focus .board-art{max-width:none}body.focus .game .status{float:none;width:100%}body.focus .game .dice-row{width:100%;height:70px}body.focus .game .dice-scene{width:70px;scale:.8}body.focus .players{flex-wrap:wrap}body.focus #setup{max-height:calc(100dvh - 60px)}body.focus .game{max-height:calc(100dvh - 60px);overflow:auto}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
.board-art{min-width:0;min-height:0;flex-shrink:0}.board-art img{position:absolute;inset:0;width:100%;height:100%}@media(max-width:680px){body.focus .board-art{max-width:100%}}
@media(max-width:680px){.top nav{gap:4px}.top nav a{font-size:9px}.top button{padding:8px}.top .brand{font-size:16px}}
@media(max-width:680px) and (orientation:portrait){body.focus main{grid-template-columns:minmax(0,1fr)}}
/* Solid canvas die: no CSS cube faces or 3D compositing required. */
.dice-scene{width:120px;height:140px;perspective:none;flex-shrink:0;gap:0;align-content:center}.dice-canvas{display:block;width:120px;height:120px;transform:none!important}#diceResult{font-size:12px;font-weight:700;color:#ffe395;text-align:center;white-space:nowrap}.dice-row{gap:12px}#soloStart{margin-bottom:4px}.game .status h2{overflow-wrap:anywhere}
@media(max-width:680px){input,select{font-size:16px}.top button{min-height:44px}.top nav a:first-child{display:none}.dice-scene{width:112px;height:128px}.dice-canvas{width:112px;height:112px}body.focus{padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}body.focus main{height:calc(100dvh - 44px - env(safe-area-inset-top) - env(safe-area-inset-bottom));padding-bottom:5px}body.focus .game{padding:8px 10px}body.focus .game .status{width:calc(100% - 184px);padding-top:10px}body.focus .game .status h2{font-size:15px}body.focus .game .status p{font-size:10px;line-height:1.3}body.focus .game .dice-row{width:180px;height:100px;gap:4px}body.focus .game .dice-scene{width:92px;height:100px;scale:1}body.focus .dice-canvas{width:92px;height:92px}body.focus #diceResult{font-size:10px;margin-top:-7px}body.focus .game #roll{font-size:11px;min-height:48px;padding:8px 6px}body.focus .game-foot{display:flex;margin-top:3px}body.focus .game-foot button{min-height:28px}body.focus .players{padding-top:5px}body.focus .player{min-height:25px}body.focus .game .roomline{display:flex;padding-bottom:4px;margin-bottom:2px}body.focus .board-art{transform:none}body.focus .game #again{margin-top:6px;min-height:36px;padding:8px}body.focus .top{padding:0 8px}body.focus #setup{max-height:48dvh}body.focus .alijah-mascot{margin-bottom:4px!important}}
@media(max-height:500px) and (orientation:landscape){body.focus main{grid-template-columns:minmax(0,1fr) 300px;grid-template-rows:1fr}body.focus aside{max-height:100%;overflow:auto}body.focus .game .status{float:left;width:calc(100% - 184px)}body.focus .game .dice-row{width:180px}body.focus .game{max-height:none}}