:root{--edge: min(38vmin, 260px);--pip: #1a1a1f;--face: #fdfdfb;--face-edge: rgba(0, 0, 0, .08);--bg: #15161a;--muted: #8a8d98}*{box-sizing:border-box}body{margin:0;min-height:100vh;display:grid;place-items:center;gap:2rem;background:var(--bg);color:var(--muted);font:400 1.1rem/1.4 system-ui,-apple-system,sans-serif}#app{display:grid;justify-items:center;gap:2.5rem}.dice{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;padding:0;background:none;cursor:pointer;position:relative;width:var(--edge);height:var(--edge)}.dice:focus-visible{outline:3px solid #5b8cff;outline-offset:1.5rem;border-radius:.5rem}.dice-canvas{position:absolute;pointer-events:none}.status{margin:0;display:flex;align-items:center;min-height:calc(1.6rem * 1.4)}.status[data-phase=result]{color:var(--face);font-size:1.6rem;font-weight:600}.config{max-width:32rem;margin:0 auto;padding:2rem 1.5rem;text-align:center}.config h1{margin:0 0 .5rem;font-size:1.5rem}.config p{margin:0;opacity:.75}