.OneDieView{--OneDieView-TilesMapWidth: 1050;--OneDieView-TilesMapHeight: 1000;--OneDieView-TileSize: 50;display:grid;align-items:center;justify-content:center}.OneDieView-ImageWrapper{overflow:hidden;max-width:100%;max-height:100%;aspect-ratio:1}.OneDieView-Image{width:calc(100% * var(--OneDieView-TilesMapWidth) / var(--OneDieView-TileSize));height:calc(100% * var(--OneDieView-TilesMapHeight) / var(--OneDieView-TileSize));position:relative;top:calc(-100% * (var(--OneDieView-D) - 1));left:calc(-100% * var(--OneDieView-Value))}@media (prefers-color-scheme: dark){.OneDieView-Image{filter:invert()}}@keyframes OneDieView-Roll{0%{transform:translateY(-25%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes OneDieView-Appear{0%{transform:translateY(33%);opacity:0}}.OneDieView:not(.OneDieView_noAnimation) .OneDieView-ImageWrapper:not(.OneDieView-ImageWrapper_animated){animation:.3s OneDieView-Appear ease-out}.OneDieView-ImageWrapper_animated:not(.OneDieView_noAnimation *){animation:.3s OneDieView-Roll ease-out;animation-delay:calc(50ms*(mod(var(--OneDieView-Position),var(--dice-in-a-row)) + round(down,var(--OneDieView-Position) / var(--dice-in-a-row),1)));animation-fill-mode:both}.Button{position:relative;appearance:none;font:inherit;border:none;background-color:var(--control-bg-color);border-radius:8px;padding:0 1ex;height:36px;font-size:22px;line-height:1;overflow:hidden;text-box-edge:ex alphabetic;text-box-trim:trim-both;-webkit-user-select:none;user-select:none;color:var(--color)}.Button_size_large{height:64px;font-size:28px;border-radius:9999px;padding:0 3ex}.Button:disabled{opacity:.5;color:var(--color)}.Button:before{content:"";display:block;position:absolute;inset:0;background-color:var(--color);opacity:0}.Button:not(:disabled):active:before{opacity:.1}@media (prefers-color-scheme: dark){.Button:not(:disabled):active:before{opacity:.2}}.Button:not(:active):before{transition:opacity .1s linear}.Button:focus-visible{outline:3px dashed currentColor;outline-offset:-5px}.DiceCounter{width:64px;display:grid;-webkit-user-select:none;user-select:none}.DiceCounter-PlusButton.DiceCounter-PlusButton,.DiceCounter-MinusButton.DiceCounter-MinusButton{border-radius:16px}.DiceCounter-PlusButton.DiceCounter-PlusButton{border-bottom-left-radius:0;border-bottom-right-radius:0}.DiceCounter-MinusButton.DiceCounter-MinusButton{border-top-left-radius:0;border-top-right-radius:0}.DiceCounter-OneDieViewBox{position:relative}.DiceCounter-OneDieView{width:64px;height:64px}.DiceCounter-Counter{position:absolute;border:1px solid currentColor;bottom:0;right:0;background-color:var(--bg-color);padding:0 1ex;font-size:16px;border-radius:9999px}.DiceField{width:100%;height:100%;display:flex;flex-direction:column;box-sizing:border-box;--padding: 12px;--gapV: 32px;--gapH: 12px;--scrollbarWidth: 6px;gap:var(--gapV) var(--gapH);padding:var(--padding)}.DiceField-FieldWrapper{position:relative;min-height:120px;height:100%;box-sizing:border-box}.DiceField-Field{display:flex;flex-direction:column;border:8px dotted var(--control-bg-color);border-radius:32px;height:100%;overflow-x:hidden;overflow-y:auto;box-sizing:border-box}@media (width < 800px){.DiceField-Field{margin:calc(var(--padding) * -1) calc(var(--padding) * -1) 0;border-top:none;border-left:none;border-right:none;border-radius:0;height:calc(100% + var(--padding))}}.DiceField-AboutLink{position:absolute;padding:0 .5ex;transform:rotate(-90deg) translate(100%);transform-origin:bottom right;color:var(--color);bottom:40px;right:0;text-box-edge:ex alphabetic;text-box-trim:trim-both}@supports not (text-box-trim: trim-both){.DiceField-AboutLink{right:-6px}}@media (width >= 800px){.DiceField-AboutLink:before{content:"";display:block;position:absolute;inset:-.25em 0;background-color:var(--bg-color);z-index:-1}}.DiceField-AboutLink:focus-visible{outline:3px dashed currentColor;outline-offset:2px}.DiceField-Dice{margin:auto 0;width:100%;position:relative;--one-die-width: 112px;height:calc(max(1,round(up,var(--dice-count) / var(--dice-in-a-row),1)) * var(--one-die-width));transition:height .3s ease-out}.DiceField-OneDie{--dice-count-1: var(--dice-count);position:absolute;top:0;left:var(--left-indent);width:var(--one-die-width);height:var(--one-die-width);-webkit-user-select:none;user-select:none;--row: round(down, var(--OneDieView-Position) / var(--dice-in-a-row), 1) ;--col: calc(var(--OneDieView-Position) - var(--row) * var(--dice-in-a-row));transform:translate(calc((var(--col) + (round(up,var(--dice-count-1),var(--dice-in-a-row)) - var(--dice-count-1)) / 2 * max(0,calc(round(down,calc(var(--OneDieView-Position) / var(--dice-in-a-row) + 1),1) - round(down,calc(var(--dice-count-1) / var(--dice-in-a-row) + 1),1) + 1))) * var(--one-die-width)),calc(var(--row) * var(--one-die-width)));transition:transform .3s ease-out}@keyframes OneDieView-Disappear{to{transform:translateY(33%);opacity:0}}.DiceField-OneDie_removed{--dice-count-1: calc(var(--dice-count) + 1)}.DiceField-OneDie_removed .OneDieView-ImageWrapper{animation:.3s OneDieView-Disappear ease-out forwards}.DiceField-Counters{display:grid;grid-auto-flow:column;width:max-content;gap:var(--gapV) var(--gapH);flex-shrink:0;overflow:auto;max-width:calc(100% + var(--padding) * 2);margin-left:calc(var(--padding) * -1);margin-right:calc(var(--padding) * -1);box-sizing:border-box;padding:0 var(--padding);scrollbar-width:none}.DiceField-RollButton{flex-shrink:0}.DiceField-NoDiceText{display:block;padding:0 4ex;text-box-edge:ex alphabetic;text-box-trim:trim-both;text-align:center;text-wrap-style:balance;position:absolute;top:50%;transform:translateY(-50%);left:0;right:0}.DiceField-NoDiceText_animated{animation-name:OneDieView-WobbleAnimation,OneDieView-ScaleAnimation;animation-duration:.4s;animation-direction:alternate;animation-iteration-count:2;animation-timing-function:ease-in-out}@keyframes OneDieView-WobbleAnimation{0%{rotate:0deg}50%{rotate:-3deg}to{rotate:3deg}}@keyframes OneDieView-ScaleAnimation{0%{scale:1}to{scale:1.1}}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;--color: black;--bg-color: white;--control-bg-color: #eee;color:var(--color);background-color:var(--bg-color);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;width:100%;height:100svh;margin:0 auto;-webkit-user-select:none;user-select:none}@media (prefers-color-scheme: dark){:root{--color: white;--bg-color: black;--control-bg-color: #333}}@media (width >= 800px){:root{max-width:800px;max-height:800px}}body{width:100%;height:100%;margin:0}#root{width:100%;height:100%}
