:root{color-scheme:dark;--bg: #050d18;--bg-deep: #02060d;--line: rgba(198, 228, 255, .1);--line-strong: rgba(238, 247, 255, .34);--dot: rgba(228, 238, 252, .2);--dot-active: rgba(245, 249, 255, .86)}*{box-sizing:border-box}html,body{min-height:100%}body{margin:0;overflow:hidden;overscroll-behavior:none;font-family:Avenir Next,Segoe UI,sans-serif;background:radial-gradient(circle at 14% 18%,rgba(100,182,255,.14),transparent 26%),radial-gradient(circle at 78% 16%,rgba(255,214,168,.08),transparent 20%),radial-gradient(circle at 64% 70%,rgba(110,135,255,.1),transparent 28%),linear-gradient(180deg,#07111f 0%,var(--bg) 38%,var(--bg-deep) 100%)}body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.12;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:10rem 10rem;-webkit-mask-image:radial-gradient(circle at center,black 42%,transparent 88%);mask-image:radial-gradient(circle at center,black 42%,transparent 88%)}.page-shell{position:relative;height:100vh;padding:.75rem;isolation:isolate;overflow:hidden}.ambient{position:absolute;border-radius:999px;filter:blur(72px);z-index:-1}.ambient-a{width:18rem;height:18rem;top:-2rem;left:-3rem;background:#6cc2ff24}.ambient-b{width:16rem;height:16rem;right:-1rem;top:4rem;background:#ffe9c612}.ambient-c{width:14rem;height:14rem;left:46%;bottom:-2rem;background:#8491ff14}.hero-layout,.stage-panel,.webgl-stage{height:100%}.stage-panel{margin:0}.webgl-stage{position:relative;border-radius:2rem;overflow:hidden;border:1px solid rgba(255,255,255,.06);background:radial-gradient(circle at 50% 46%,rgba(120,194,255,.08),transparent 20%),radial-gradient(circle at 50% 64%,rgba(126,218,255,.08),transparent 28%),linear-gradient(180deg,#070f1bcc,#030810eb);box-shadow:inset 0 1px #ffffff0d,0 40px 100px #00000059}.webgl-stage:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 28%,rgba(255,255,255,.03),transparent 22%),linear-gradient(135deg,rgba(255,255,255,.03),transparent 24%,transparent 72%,rgba(255,255,255,.01))}.webgl-stage:after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at center,transparent 48%,rgba(2,7,14,.28) 100%)}#dice-canvas{display:block;width:100%;height:100%;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.webgl-stage.is-dragging #dice-canvas{cursor:grabbing}.back-variant-switch{position:absolute;top:1rem;right:1rem;display:flex;align-items:center;gap:.35rem;padding:.35rem;border-radius:999px;border:1px solid var(--line);background:#050c1747;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);opacity:0;pointer-events:none;transform:translateY(-.35rem);transition:opacity .18s ease,transform .18s ease}.back-variant-switch.is-visible{opacity:1;pointer-events:auto;transform:translateY(0)}.back-variant-button{margin:0;padding:.42rem .72rem;border:1px solid rgba(255,255,255,.08);border-radius:999px;background:#ffffff08;color:#e8f1fcb8;cursor:pointer;font-size:.75rem;line-height:1;transition:border-color .18s ease,background .18s ease,color .18s ease,box-shadow .18s ease;-webkit-tap-highlight-color:transparent}.back-variant-button:hover,.back-variant-button:focus-visible,.back-variant-button.is-active{outline:none;border-color:var(--line-strong);background:#ffffff14;color:#fafcfff5;box-shadow:0 0 18px #b2e1ff2e}.ability-console{position:absolute;left:50%;bottom:1.25rem;transform:translate(-50%);display:flex;align-items:center;gap:.65rem;padding:.45rem .55rem;border-radius:999px;border:1px solid var(--line);background:#050c1733;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);touch-action:manipulation}.ability-pill{position:relative;width:.78rem;height:.78rem;margin:0;padding:0;border:1px solid rgba(255,255,255,.08);border-radius:999px;background:var(--dot);opacity:.55;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease,opacity .18s ease}.ability-pill:hover,.ability-pill:focus-visible,.ability-pill.is-active{outline:none;transform:scale(1.12);border-color:var(--line-strong);background:var(--dot-active);box-shadow:0 0 18px #b2e1ff47;opacity:1}@media(max-width:720px){.page-shell{padding:.5rem}.webgl-stage{border-radius:1.5rem}.ability-console{bottom:.95rem}.back-variant-switch{top:auto;right:50%;bottom:3.9rem;transform:translate(50%,.35rem)}.back-variant-switch.is-visible{transform:translate(50%)}}@media(hover:none)and (pointer:coarse){.ability-console{gap:.8rem;padding:.6rem .72rem}.ability-pill{width:.95rem;height:.95rem}.ability-pill:after{content:"";position:absolute;inset:-.55rem}.back-variant-button{padding:.5rem .8rem}}@media(prefers-reduced-motion:reduce){.ability-pill{transition:none}}