:root{--color-red: #f43f5e;--color-red-glow: rgba(244, 63, 94, .45);--color-green: #10b981;--color-green-glow: rgba(16, 185, 129, .45);--color-yellow: #f59e0b;--color-yellow-glow: rgba(245, 158, 11, .45);--color-blue: #3b82f6;--color-blue-glow: rgba(59, 130, 246, .45);--dice-size: 52px}*{box-sizing:border-box;margin:0;padding:0;font-family:Outfit,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;-webkit-tap-highlight-color:transparent}body{background-color:#070709;background-image:radial-gradient(circle at 50% 0%,rgba(244,63,94,.08),transparent 35%),radial-gradient(circle at 100% 100%,rgba(59,130,246,.06),transparent 30%),radial-gradient(circle at 0% 100%,rgba(16,185,129,.06),transparent 30%);color:#f4f4f5;min-height:100dvh;overflow-x:hidden}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.inset-0{inset:0}.flex{display:flex}.inline-flex{display:inline-flex}.hidden{display:none!important}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-1{gap:.25rem}.gap-1\.5{gap:.375rem}.gap-2{gap:.5rem}.gap-2\.5{gap:.625rem}.gap-3{gap:.75rem}.gap-3\.5{gap:.875rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.grid{display:grid}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.w-full{width:100%}.h-full{height:100%}.w-8{width:2rem}.h-8{height:2rem}.w-9{width:2.25rem}.h-9{height:2.25rem}.w-10{width:2.5rem}.h-10{height:2.5rem}.w-12{width:3rem}.h-12{height:3rem}.w-16{width:4rem}.h-16{height:4rem}.w-48{width:12rem}.w-52{width:13rem}.min-h-\[100dvh\]{min-height:100dvh}.max-w-md{max-width:28rem}.max-w-lg{max-width:32rem}.max-w-4xl{max-width:56rem}.max-w-5xl{max-width:64rem}.max-w-6xl{max-width:72rem}.mx-auto{margin-left:auto;margin-right:auto}.mb-1{margin-bottom:.25rem}.mb-1\.5{margin-bottom:.375rem}.mb-2{margin-bottom:.5rem}.mb-2\.5{margin-bottom:.625rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.mt-0\.5{margin-top:.125rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.ml-0\.5{margin-left:.125rem}.ml-1{margin-left:.25rem}.p-1{padding:.25rem}.p-1\.5{padding:.375rem}.p-2{padding:.5rem}.p-2\.5{padding:.625rem}.p-3{padding:.75rem}.p-3\.5{padding:.875rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-2\.5{padding-left:.625rem;padding-right:.625rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-3\.5{padding-left:.875rem;padding-right:.875rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-0\.5{padding-top:.125rem;padding-bottom:.125rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.pb-2{padding-bottom:.5rem}.pb-3{padding-bottom:.75rem}.pb-4{padding-bottom:1rem}.pb-6{padding-bottom:1.5rem}.pt-1{padding-top:.25rem}.pt-2{padding-top:.5rem}.pt-3{padding-top:.75rem}.pt-4{padding-top:1rem}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.rounded-2xl{border-radius:1rem}.rounded-3xl{border-radius:1.5rem}.rounded-full{border-radius:9999px}.border{border-width:1px}.border-t{border-top-width:1px}.border-b{border-bottom-width:1px}.border-zinc-700{border-color:#3f3f46}.border-zinc-800{border-color:#27272a}.border-zinc-800\/60{border-color:#27272a99}.border-zinc-800\/80{border-color:#27272acc}.border-white\/10{border-color:#ffffff1a}.border-rose-500{border-color:#f43f5e}.border-rose-500\/20{border-color:#f43f5e33}.border-rose-500\/30{border-color:#f43f5e4d}.border-rose-500\/50{border-color:#f43f5e80}.border-emerald-500{border-color:#10b981}.border-emerald-500\/30{border-color:#10b9814d}.border-emerald-500\/50{border-color:#10b98180}.border-amber-500{border-color:#f59e0b}.border-amber-500\/30{border-color:#f59e0b4d}.border-blue-500{border-color:#3b82f6}.border-blue-500\/30{border-color:#3b82f64d}.border-blue-500\/50{border-color:#3b82f680}.bg-zinc-950{background-color:#09090b}.bg-zinc-950\/60{background-color:#09090b99}.bg-zinc-950\/70{background-color:#09090bb3}.bg-zinc-950\/80{background-color:#09090bcc}.bg-zinc-900{background-color:#18181b}.bg-zinc-900\/40{background-color:#18181b66}.bg-zinc-900\/60{background-color:#18181b99}.bg-zinc-900\/70{background-color:#18181bb3}.bg-zinc-900\/80{background-color:#18181bcc}.bg-zinc-900\/90{background-color:#18181be6}.bg-zinc-800{background-color:#27272a}.bg-zinc-800\/50{background-color:#27272a80}.bg-zinc-800\/80{background-color:#27272acc}.bg-rose-500{background-color:#f43f5e}.bg-rose-500\/10{background-color:#f43f5e1a}.bg-rose-500\/15{background-color:#f43f5e26}.bg-rose-500\/20{background-color:#f43f5e33}.bg-emerald-500{background-color:#10b981}.bg-emerald-500\/15{background-color:#10b98126}.bg-amber-500{background-color:#f59e0b}.bg-amber-500\/10{background-color:#f59e0b1a}.bg-amber-500\/20{background-color:#f59e0b33}.bg-blue-500\/10{background-color:#3b82f61a}.bg-blue-500\/15{background-color:#3b82f626}.bg-blue-500\/20{background-color:#3b82f633}.text-white{color:#fff}.text-black{color:#000}.text-zinc-100{color:#f4f4f5}.text-zinc-200{color:#e4e4e7}.text-zinc-300{color:#d4d4d8}.text-zinc-400{color:#a1a1aa}.text-zinc-500{color:#71717a}.text-zinc-600{color:#52525b}.text-rose-400{color:#fb7185}.text-rose-500{color:#f43f5e}.text-emerald-400{color:#34d399}.text-amber-300{color:#fcd34d}.text-amber-400{color:#fbbf24}.text-blue-300{color:#93c5fd}.text-blue-400{color:#60a5fa}.text-xs{font-size:.75rem;line-height:1rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.font-extrabold{font-weight:800}.font-black{font-weight:900}.font-mono{font-family:JetBrains Mono,monospace}.tracking-tight{letter-spacing:-.025em}.tracking-wider{letter-spacing:.05em}.tracking-widest{letter-spacing:.1em}.uppercase{text-transform:uppercase}.capitalize{text-transform:capitalize}.text-center{text-align:center}.text-left{text-align:left}.cursor-pointer{cursor:pointer}.opacity-50{opacity:.5}.opacity-70{opacity:.7}.opacity-80{opacity:.8}.outline-none{outline:2px solid transparent;outline-offset:2px}.shadow-sm{box-shadow:0 1px 2px #0000000d}.shadow-md{box-shadow:0 4px 6px -1px #0000001a}.shadow-lg{box-shadow:0 10px 15px -3px #0000001a}.shadow-xl{box-shadow:0 20px 25px -5px #0003}.shadow-2xl{box-shadow:0 25px 50px -12px #00000059}.backdrop-blur-md{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.backdrop-blur-xl{backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color;transition-duration:.15s}.select-none{user-select:none}.overflow-hidden{overflow:hidden}.overflow-x-hidden{overflow-x:hidden}.z-10{z-index:10}.z-20{z-index:20}.z-50{z-index:50}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.space-y-2>:not([hidden])~:not([hidden]){margin-top:.5rem}.space-y-3>:not([hidden])~:not([hidden]){margin-top:.75rem}.bg-gradient-to-r{background-image:linear-gradient(to right,#f43f5e,#e11d48)}.bg-gradient-to-br{background-image:linear-gradient(to bottom right,#f43f5e,#f59e0b,#10b981)}@media(min-width:640px){.sm\:flex-row{flex-direction:row!important}.sm\:flex-none{flex:none!important}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))!important}.sm\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))!important}}@media(min-width:768px){.md\:flex{display:flex!important}.md\:hidden{display:none!important}.md\:flex-row{flex-direction:row!important}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))!important}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))!important}.md\:col-span-2{grid-column:span 2 / span 2!important}.md\:py-10{padding-top:2.5rem!important;padding-bottom:2.5rem!important}}.no-scrollbar::-webkit-scrollbar{display:none}.no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}.board-wrapper{background:radial-gradient(circle at 50% 50%,#181820e6,#0c0c10f2);box-shadow:0 25px 50px -12px #000c,inset 0 1px #ffffff14,0 0 40px -10px #00000080}#board-viewport{width:min(94vw,calc(100dvh - 195px),480px);height:min(94vw,calc(100dvh - 195px),480px);aspect-ratio:1 / 1}@media(min-width:768px){#board-viewport{width:min(52vw,calc(100dvh - 180px),530px);height:min(52vw,calc(100dvh - 180px),530px)}}@media(max-width:640px){:root{--dice-size: 42px}}.player-hud-card{background:#121218d9;border:1px solid rgba(255,255,255,.08);border-radius:20px;padding:14px 16px;transition:all .25s cubic-bezier(.16,1,.3,1);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 10px 25px -5px #00000059}.player-hud-card.active{transform:translateY(-2px) scale(1.02)}.player-hud-card.active.color-red{border-color:var(--color-red);box-shadow:0 0 25px -3px var(--color-red-glow),0 10px 25px -5px #0006}.player-hud-card.active.color-green{border-color:var(--color-green);box-shadow:0 0 25px -3px var(--color-green-glow),0 10px 25px -5px #0006}.player-hud-card.active.color-yellow{border-color:var(--color-yellow);box-shadow:0 0 25px -3px var(--color-yellow-glow),0 10px 25px -5px #0006}.player-hud-card.active.color-blue{border-color:var(--color-blue);box-shadow:0 0 25px -3px var(--color-blue-glow),0 10px 25px -5px #0006}.dice-scene{width:var(--dice-size);height:var(--dice-size);perspective:600px}.dice-cube{width:100%;height:100%;position:relative;transform-style:preserve-3d;transform:translateZ(calc(var(--dice-size) * -.5));transition:transform .6s cubic-bezier(.2,.8,.2,1)}.dice-face{position:absolute;width:var(--dice-size);height:var(--dice-size);background:linear-gradient(145deg,#fff,#e4e4e7);border:1.5px solid #d4d4d8;border-radius:12px;display:flex;justify-content:center;align-items:center;font-size:26px;font-weight:900;color:#18181b;box-shadow:inset 0 2px 4px #ffffffe6,inset 0 -2px 4px #00000026,0 4px 10px #00000059;user-select:none}.dice-face.front{transform:rotateY(0) translateZ(calc(var(--dice-size) * .5));color:#e11d48}.dice-face.back{transform:rotateY(180deg) translateZ(calc(var(--dice-size) * .5))}.dice-face.right{transform:rotateY(90deg) translateZ(calc(var(--dice-size) * .5))}.dice-face.left{transform:rotateY(-90deg) translateZ(calc(var(--dice-size) * .5))}.dice-face.top{transform:rotateX(90deg) translateZ(calc(var(--dice-size) * .5))}.dice-face.bottom{transform:rotateX(-90deg) translateZ(calc(var(--dice-size) * .5))}.dice-cube[data-value="1"]{transform:translateZ(calc(var(--dice-size) * -.5)) rotateY(0) rotateX(0)}.dice-cube[data-value="6"]{transform:translateZ(calc(var(--dice-size) * -.5)) rotateY(180deg) rotateX(0)}.dice-cube[data-value="3"]{transform:translateZ(calc(var(--dice-size) * -.5)) rotateY(-90deg) rotateX(0)}.dice-cube[data-value="4"]{transform:translateZ(calc(var(--dice-size) * -.5)) rotateY(90deg) rotateX(0)}.dice-cube[data-value="2"]{transform:translateZ(calc(var(--dice-size) * -.5)) rotateX(-90deg) rotateY(0)}.dice-cube[data-value="5"]{transform:translateZ(calc(var(--dice-size) * -.5)) rotateX(90deg) rotateY(0)}@keyframes diceTumble{0%{transform:translateZ(calc(var(--dice-size) * -.5)) rotateX(0) rotateY(0) rotate(0) scale(.95)}25%{transform:translateZ(calc(var(--dice-size) * -.5)) rotateX(180deg) rotateY(270deg) rotate(90deg) scale(1.1)}50%{transform:translateZ(calc(var(--dice-size) * -.5)) rotateX(360deg) rotateY(540deg) rotate(180deg) scale(1.05)}75%{transform:translateZ(calc(var(--dice-size) * -.5)) rotateX(540deg) rotateY(810deg) rotate(270deg) scale(1.15)}to{transform:translateZ(calc(var(--dice-size) * -.5)) rotateX(720deg) rotateY(1080deg) rotate(360deg) scale(1)}}.dice-cube.rolling{animation:diceTumble .6s cubic-bezier(.25,1,.5,1) infinite}.token-piece{user-select:none}.token-body{transform-box:fill-box;transform-origin:center center;transition:transform .22s cubic-bezier(.34,1.56,.64,1),filter .22s ease}.token-body.eligible{animation:tokenPulse 1.25s ease-in-out infinite;filter:drop-shadow(0 0 12px rgba(255,255,255,.95)) drop-shadow(0 0 6px rgba(255,255,255,.8))}.token-piece:hover .token-body.eligible{transform:scale(1.22);filter:drop-shadow(0 0 18px rgba(255,255,255,1)) drop-shadow(0 0 8px rgba(255,255,255,.9))}.projected-tile-highlight{stroke:#fff!important;stroke-width:4px!important;fill-opacity:.95!important;filter:drop-shadow(0 0 12px rgba(255,255,255,.85));animation:tileGlowPulse 1s ease-in-out infinite alternate}@keyframes tileGlowPulse{0%{filter:drop-shadow(0 0 6px rgba(255,255,255,.6))}to{filter:drop-shadow(0 0 16px rgba(255,255,255,1))}}@keyframes tokenPulse{0%,to{transform:scale(1)}50%{transform:scale(1.18)}}@keyframes spinSlow{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-spin-slow{animation:spinSlow 6s linear infinite;transform-box:fill-box;transform-origin:center center}.emote-bubble{display:flex;align-items:center;gap:6px;background:#121218f2;border:1px solid rgba(255,255,255,.15);border-radius:9999px;padding:6px 12px;box-shadow:0 12px 30px -4px #000000b3;pointer-events:none}@keyframes bounceIn{0%{opacity:0;transform:scale(.3) translateY(12px)}50%{opacity:1;transform:scale(1.1) translateY(-4px)}to{opacity:1;transform:scale(1) translateY(0)}}.animate-bounce-in{animation:bounceIn .35s cubic-bezier(.16,1,.3,1) forwards}.fade-out{opacity:0;transform:translateY(-8px);transition:opacity .3s ease,transform .3s ease}.modal-overlay{position:fixed;inset:0;background:#000c;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);z-index:50;display:flex;align-items:center;justify-content:center;padding:16px}.modal-card{background:#121217;border:1px solid rgba(255,255,255,.1);border-radius:22px;padding:16px;max-width:min(94vw,520px);max-height:90dvh;overflow-y:auto;width:100%;box-shadow:0 30px 60px -15px #000000e6;animation:modalEnter .25s cubic-bezier(.16,1,.3,1)}@media(min-width:640px){.modal-card{border-radius:28px;padding:24px}}@keyframes modalEnter{0%{opacity:0;transform:scale(.95) translateY(12px)}to{opacity:1;transform:scale(1) translateY(0)}}@media(prefers-reduced-motion:reduce){.dice-cube,.token-piece,.player-hud-card,.animate-spin-slow,.animate-bounce-in{transition:none!important;animation:none!important}}