*{box-sizing:border-box}:has(>*>#tab-content){display:flex;max-height:100dvh;height:100dvh}:has(>#tab-content){background-color:var(--background,#333);color:var(--foreground,#DDD);font-family:Open Sans,segoe ui,Tahoma,Geneva,Verdana,sans-serif;font-size:1rem;width:100%;flex:1 1;position:relative;margin:0;display:flex;flex-flow:column nowrap;align-items:stretch}button{min-height:1.5rem;min-width:1.5rem;height:auto;border-radius:1.5rem;font-size:1rem;text-align:center;padding:.25rem .75rem;cursor:pointer;color:var(--foreground,#DDD);background-color:var(--background,#333);border:1px solid var(--foreground,#DDD)}button:disabled{opacity:.3;cursor:not-allowed}button:not(:disabled):hover{background-color:color-mix(in srgb,var(--foreground,#DDD) 10%,var(--background,#333))}input[type=number]{width:6rem;padding:.25rem .5rem;border-radius:.5rem;border:1px solid var(--foreground,#DDD);background:var(--background,#333);color:var(--foreground,#DDD);font-size:1rem;text-align:center}input[type=number]:focus{outline:2px solid var(--accent,royalblue);outline-offset:1px}label{font-weight:600}#history-list{list-style:none;margin:0;padding:0;width:100%;overflow-y:auto;min-height:0;font-size:.9rem}#history-list:empty::after{content:"No history yet.";display:block;text-align:center;opacity:.5;padding:1rem}#history-list li{margin:0;padding:.4rem .5rem;word-break:break-word;border-bottom:1px solid color-mix(in srgb,var(--foreground,#DDD) 15%,transparent)}@keyframes history-flash{0%{background-color:color-mix(in srgb,var(--accent,royalblue) 25%,transparent)}100%{background-color:initial}}.history-item--new{animation:history-flash 600ms ease-out forwards}.history-actions{flex-shrink:0}#tabs{display:flex;flex-flow:row nowrap;gap:0;border-bottom:1px solid color-mix(in srgb,var(--foreground,#DDD) 30%,transparent);flex-shrink:0;overflow-x:auto;overflow-y:hidden}#tabs a{display:inline-block;padding:.5rem 1.25rem;text-decoration:none;color:color-mix(in srgb,var(--foreground,#DDD) 60%,transparent);border-bottom:2px solid transparent;margin-bottom:-1px;font-weight:500;transition:color .15s,border-color .15s;white-space:nowrap;flex-shrink:0}#tabs a:hover{color:var(--foreground,#DDD)}#tabs:not(:has(~#tab-content :target)) a[href="#dice"],#tabs:has(~#tab-content>#dice:target) a[href="#dice"],#tabs:has(~#tab-content>#coin:target) a[href="#coin"],#tabs:has(~#tab-content>#number:target) a[href="#number"],#tabs:has(~#tab-content>#history:target) a[href="#history"]{color:var(--accent,royalblue);border-bottom-color:var(--accent,royalblue)}#tab-content{flex:1 1;min-height:0;position:relative}#tab-content>section{display:none;flex-flow:column nowrap;align-items:center;justify-content:space-between;height:100%;padding:1rem;gap:1rem}#tab-content>section>:first-child{flex:1 1}#tab-content:not(:has(:target))>#dice,#tab-content>section:target{display:flex}#dice-tray{display:flex;flex-flow:row wrap;gap:.75rem 1rem;justify-content:safe center;align-content:safe center;list-style:none;padding:.5rem;margin:0;flex:1 1;overflow-y:auto;width:100%;container-type:size;position:relative}#dice-tray:not(:has(span))::before{content:"No dice";position:absolute;top:50%;left:50%;translate:-50% -50%;color:color-mix(in srgb,var(--foreground,#DDD) 70%,transparent);font-size:1.25rem}#dice-tray:has(span)::after{content:"";position:sticky;bottom:-.5rem;align-self:flex-end;width:100%;height:1.5rem;margin-top:-1.5rem;background:linear-gradient(to top,var(--background,#333) 10%,transparent)}#dice-result{display:flex;flex-flow:column nowrap;align-items:center;gap:.25rem;min-height:4.5rem;text-align:center}#dice-sum{font-size:3rem;font-weight:700;line-height:1;color:var(--accent,royalblue)}#dice-breakdown{font-size:.9rem;color:color-mix(in srgb,var(--foreground,#DDD) 70%,transparent)}#dice-controls{display:flex;flex-flow:column nowrap;align-items:center;gap:.75rem;flex-shrink:0;width:100%}#dice-selector{display:flex;flex-flow:row nowrap;justify-content:safe center;align-items:safe center;gap:.5rem;border:none;margin:0;padding:0;overflow-x:auto;min-width:0;width:100%}#dice-selector>*{flex-shrink:0}.dice-separator{opacity:.5}#dice-modifier-input{width:4rem}.dice-actions{display:flex;flex-wrap:nowrap;gap:.75rem;align-items:center;justify-content:center;overflow-x:auto;width:100%}.dice-actions>*{flex-shrink:0}#dice-colour{appearance:none;-webkit-appearance:none;width:1.65625rem;height:1.65625rem;border-radius:50%;border:1px solid var(--foreground,#ddd);padding:0;cursor:pointer;background:0 0}#dice-colour::-webkit-color-swatch-wrapper{padding:0;border-radius:50%}#dice-colour::-webkit-color-swatch{border:none;border-radius:50%}#dice-colour::-moz-color-swatch{border:none;border-radius:50%}.die-wrapper{position:relative;min-width:5rem;min-height:5rem;width:20cqw;height:20cqw;max-width:40rem;max-height:40rem;perspective:none;container-type:size}.die{position:absolute;top:50%;left:50%;transform-style:preserve-3d;transform:rotateX(var(--rot-x,0deg))rotateY(var(--rot-y,0deg))rotateZ(var(--rot-z,0deg));transition:transform 1.5s ease}.die-remove{position:absolute;top:-.5rem;right:-.5rem;min-height:1.25rem;min-width:1.25rem;height:1.25rem;width:1.25rem;border-radius:50%;font-size:.85rem;padding:0;line-height:1;opacity:0;transition:opacity .15s;z-index:1}.die-wrapper:hover .die-remove,.die-wrapper:focus-within .die-remove{opacity:1}.d4-face,.d6-face,.d8-face,.d10-face,.d12-face,.d20-face{position:absolute;width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:0;font-size:16cqw;line-height:25cqw;font-weight:700;background:radial-gradient(circle at 35% 35%,var(--dice-colour,royalblue),color-mix(in srgb,var(--dice-colour,royalblue) 55%,var(--background,#333)));color:var(--dice-text,#FFF);backface-visibility:hidden}.d4{--size:65cqw;width:var(--size);height:var(--size);translate:-50% -50%;transform-origin:50% calc(100% * sqrt(6)/4)0;--height-adjust:calc(var(--size) / 4)}.d4-face{height:calc(100% * sqrt(3)/2);padding:10cqw 0 0;mask-image:url(../images/triangular-face.svg);backface-visibility:visible}.d4-face-1{transform:translateZ(var(--height-adjust))}.d4-face-2{transform-origin:bottom right;transform:translateZ(var(--height-adjust))rotateZ(60deg)rotateX(calc(90deg + asin(1/3)))}.d4-face-3{transform-origin:bottom left;transform:translateZ(var(--height-adjust))rotateZ(-60deg)rotateX(calc(90deg + asin(1/3)))}.d4-face-4{transform-origin:center bottom;transform:translateZ(var(--height-adjust))rotateZ(180deg)rotateX(calc(180deg - acos(1/3)))}.d6{--size:50cqw;width:var(--size);height:var(--size);translate:-50% -50%}.d6-face{font-size:20cqw}.d6-face-1{transform-origin:center;transform:translateZ(calc(var(--size)/2))}.d6-face-2{transform-origin:center;transform:rotateX(270deg)translateZ(calc(var(--size)/2))rotateZ(-90deg)}.d6-face-3{transform-origin:center;transform:rotateY(90deg)translateZ(calc(var(--size)/2))rotateZ(90deg)}.d6-face-4{transform-origin:center;transform:rotateY(270deg)translateZ(calc(var(--size)/2))rotateZ(180deg)}.d6-face-5{transform-origin:center;transform:rotateX(90deg)translateZ(calc(var(--size)/2))rotateZ(180deg)}.d6-face-6{transform-origin:center;transform:rotateY(180deg)translateZ(calc(var(--size)/2))rotateZ(-90deg);text-decoration:underline}.d8{--size:55cqw;width:var(--size);height:var(--size);translate:-50% calc(-100% * sqrt(2)/2);transform-origin:50% calc(100% * sqrt(2)/2)0;transform:rotateX(var(--rot-x,-35.26deg))rotateY(var(--rot-y,0deg))rotateZ(var(--rot-z,0deg));--tilt-angle-1:calc(asin(1 / sqrt(3)));--tilt-angle-2:calc(var(--tilt-angle-1) + 180deg);--height-adjust:calc((2 * sqrt(6) / 3) * 100%)}.d8-face{height:calc(100% * sqrt(3)/2);padding:10cqw 0 0;mask-image:url(../images/triangular-face.svg)}.d8-face-1{transform-origin:center top;transform:rotateX(var(--tilt-angle-1))}.d8-face-2{transform-origin:center top;transform:rotateY(90deg)translateY(var(--height-adjust))rotateX(var(--tilt-angle-2))}.d8-face-3{transform-origin:center top;transform:rotateY(270deg)rotateX(var(--tilt-angle-1))}.d8-face-4{transform-origin:center top;transform:rotateY(180deg)translateY(var(--height-adjust))rotateX(var(--tilt-angle-2))}.d8-face-5{transform-origin:center top;transform:rotateY(180deg)rotateX(var(--tilt-angle-1))}.d8-face-6{transform-origin:center top;transform:rotateY(270deg)translateY(var(--height-adjust))rotateX(var(--tilt-angle-2));text-decoration:underline}.d8-face-7{transform-origin:center top;transform:rotateY(90deg)rotateX(var(--tilt-angle-1))}.d8-face-8{transform-origin:center top;transform:translateY(var(--height-adjust))rotateX(var(--tilt-angle-2))}.d10{--size:50cqw;width:var(--size);height:var(--size);translate:-50% calc(var(--height-adjust)/-2);transform-origin:50% calc(var(--height-adjust)/2)0;transform:rotateX(var(--rot-x,-221.97deg))rotateY(var(--rot-y,-108deg))rotateZ(var(--rot-z,0deg));--tilt-angle-1:calc(asin(pow(5, -0.25)));--tilt-angle-2:calc(var(--tilt-angle-1) + 180deg);--height-adjust:calc((sqrt(5 + sqrt(5))) / 2 * var(--size))}.d10-face{width:calc(100% * sqrt((sqrt(5) - 1)/2));padding:18cqw 0 0;margin:0 12.5%;mask-image:url(../images/kite-face.svg)}.d10-face-2{transform-origin:center top;transform:rotateY(36deg)rotateX(var(--tilt-angle-1))}.d10-face-8{transform-origin:center top;transform:rotateY(108deg)rotateX(var(--tilt-angle-1))}.d10-face-10{transform-origin:center top;transform:rotateY(180deg)rotateX(var(--tilt-angle-1))}.d10-face-4{transform-origin:center top;transform:rotateY(252deg)rotateX(var(--tilt-angle-1))}.d10-face-6{transform-origin:center top;transform:rotateY(324deg)rotateX(var(--tilt-angle-1));text-decoration:underline}.d10-face-7{transform-origin:center top;transform:translateY(var(--height-adjust))rotateY(36deg)rotateX(var(--tilt-angle-2))}.d10-face-1{transform-origin:center top;transform:translateY(var(--height-adjust))rotateY(108deg)rotateX(var(--tilt-angle-2))}.d10-face-9{transform-origin:center top;transform:translateY(var(--height-adjust))rotateY(180deg)rotateX(var(--tilt-angle-2));text-decoration:underline}.d10-face-5{transform-origin:center top;transform:translateY(var(--height-adjust))rotateY(252deg)rotateX(var(--tilt-angle-2))}.d10-face-3{transform-origin:center top;transform:translateY(var(--height-adjust))rotateY(324deg)rotateX(var(--tilt-angle-2))}.d12{--size:36cqw;width:var(--size);height:var(--size);--center-y:calc(100% * sqrt(10 + 2 * sqrt(5)) / 4);transform-origin:50% var(--center-y)0;translate:-50% calc(var(--center-y) * -1);transform:rotateX(var(--rot-x,-90.001deg))rotateY(var(--rot-y,0deg))rotateZ(var(--rot-z,0deg));--tilt-angle-1:90deg;--tilt-angle-2:calc(atan(2) + 90deg);--tilt-angle-3:calc(atan(2) - 90deg);--tilt-angle-4:270deg;--vertical-adjust:calc(sqrt(25 + 10 * sqrt(5)) / 10 * -1 * var(--size));--horizontal-adjust:calc(var(--size) * sqrt((5 + sqrt(5)) / 40))}.d12-face{height:calc(100% * sqrt(10 + 2 * sqrt(5))/4);padding:4cqw 0 0;font-size:12cqw;mask-image:url(../images/pentagonal-face.svg)}.d12-face-1{transform-origin:center bottom;transform:translateY(var(--vertical-adjust))rotateX(var(--tilt-angle-1))translateY(var(--horizontal-adjust))}.d12-face-5{transform-origin:center bottom;transform:translateY(var(--vertical-adjust))rotateY(36deg)translateZ(calc(var(--horizontal-adjust) * -1))rotateX(var(--tilt-angle-2))}.d12-face-6{transform-origin:center bottom;transform:translateY(var(--vertical-adjust))rotateY(108deg)translateZ(calc(var(--horizontal-adjust) * -1))rotateX(var(--tilt-angle-2));text-decoration:underline}.d12-face-4{transform-origin:center bottom;transform:translateY(var(--vertical-adjust))rotateY(180deg)translateZ(calc(var(--horizontal-adjust) * -1))rotateX(var(--tilt-angle-2))}.d12-face-2{transform-origin:center bottom;transform:translateY(var(--vertical-adjust))rotateY(252deg)translateZ(calc(var(--horizontal-adjust) * -1))rotateX(var(--tilt-angle-2))}.d12-face-10{transform-origin:center bottom;transform:translateY(var(--vertical-adjust))rotateY(324deg)translateZ(calc(var(--horizontal-adjust) * -1))rotateX(var(--tilt-angle-2))}.d12-face-12{transform-origin:center bottom;transform:translateY(calc(var(--vertical-adjust) * -1))rotateX(var(--tilt-angle-4))translateY(var(--horizontal-adjust))}.d12-face-3{transform-origin:center bottom;transform:translateY(calc(var(--vertical-adjust) * -1))rotateY(36deg)translateZ(var(--horizontal-adjust))rotateX(var(--tilt-angle-3))}.d12-face-11{transform-origin:center bottom;transform:translateY(calc(var(--vertical-adjust) * -1))rotateY(108deg)translateZ(var(--horizontal-adjust))rotateX(var(--tilt-angle-3))}.d12-face-7{transform-origin:center bottom;transform:translateY(calc(var(--vertical-adjust) * -1))rotateY(180deg)translateZ(var(--horizontal-adjust))rotateX(var(--tilt-angle-3))}.d12-face-9{text-decoration:underline;transform-origin:center bottom;transform:translateY(calc(var(--vertical-adjust) * -1))rotateY(252deg)translateZ(var(--horizontal-adjust))rotateX(var(--tilt-angle-3))}.d12-face-8{transform-origin:center bottom;transform:translateY(calc(var(--vertical-adjust) * -1))rotateY(324deg)translateZ(var(--horizontal-adjust))rotateX(var(--tilt-angle-3))}.d20{--size:40cqw;width:var(--size);height:var(--size);--center-y:calc(100% * sqrt(3) / 2);transform-origin:50% var(--center-y)0;translate:-50% calc(var(--center-y) * -1);transform:rotateX(var(--rot-x,10.73deg))rotateY(var(--rot-y,0deg))rotateZ(var(--rot-z,0deg));--tilt-angle-1:calc(90deg - acos(sqrt((5 + 2 * sqrt(5)) / 15)));--tilt-angle-2:calc(-90deg - acos(sqrt((5 - 2 * sqrt(5)) / 15)));--tilt-angle-3:calc(-90deg + acos(sqrt((5 - 2 * sqrt(5)) / 15)));--tilt-angle-4:calc(90deg + acos(sqrt((5 + 2 * sqrt(5)) / 15)));--vertical-adjust-1:calc(sqrt(50 + 10 * sqrt(5)) * -1 * var(--size) / (2 * 10));--vertical-adjust-2:calc(var(--vertical-adjust-1) * -1);--horizontal-adjust:calc(var(--size) / (2 * tan(36deg)))}.d20-face{height:calc(100% * sqrt(3)/2);padding:8cqw 0 0;font-size:10cqw;mask-image:url(../images/triangular-face.svg)}.d20-face-1{transform-origin:center bottom;transform:rotateY(0)translateZ(var(--horizontal-adjust))translateY(var(--vertical-adjust-2))rotateX(var(--tilt-angle-3))}.d20-face-2{transform-origin:center bottom;transform:rotateY(216deg)translateZ(var(--horizontal-adjust))translateY(var(--vertical-adjust-2))rotateX(var(--tilt-angle-3))}.d20-face-3{transform-origin:center bottom;transform:rotateY(324deg)translateZ(var(--horizontal-adjust))translateY(var(--vertical-adjust-1))rotateX(var(--tilt-angle-1))}.d20-face-4{transform-origin:center bottom;transform:rotateY(144deg)translateZ(var(--horizontal-adjust))translateY(var(--vertical-adjust-2))rotateX(var(--tilt-angle-4))rotateY(180deg)}.d20-face-5{transform-origin:center bottom;transform:rotateY(288deg)translateZ(var(--horizontal-adjust))translateY(var(--vertical-adjust-2))rotateX(var(--tilt-angle-4))rotateY(180deg)}.d20-face-6{transform-origin:center bottom;transform:rotateY(36deg)translateZ(var(--horizontal-adjust))translateY(var(--vertical-adjust-1))rotateX(var(--tilt-angle-2))rotateY(180deg);text-decoration:underline}.d20-face-7{transform-origin:center bottom;transform:rotateY(252deg)translateZ(var(--horizontal-adjust))translateY(var(--vertical-adjust-1))rotateX(var(--tilt-angle-2))rotateY(180deg)}.d20-face-8{transform-origin:center bottom;transform:rotateY(180deg)translateZ(var(--horizontal-adjust))translateY(var(--vertical-adjust-1))rotateX(var(--tilt-angle-1))}.d20-face-9{transform-origin:center bottom;transform:rotateY(72deg)translateZ(var(--horizontal-adjust))translateY(var(--vertical-adjust-2))rotateX(var(--tilt-angle-3));text-decoration:underline}.d20-face-10{transform-origin:center bottom;transform:rotateY(108deg)translateZ(var(--horizontal-adjust))translateY(var(--vertical-adjust-1))rotateX(var(--tilt-angle-1))}.d20-face-11{transform-origin:center bottom;transform:rotateY(72deg)translateZ(var(--horizontal-adjust))translateY(var(--vertical-adjust-2))rotateX(var(--tilt-angle-4))rotateY(180deg)}.d20-face-12{transform-origin:center bottom;transform:rotateY(324deg)translateZ(var(--horizontal-adjust))translateY(var(--vertical-adjust-1))rotateX(var(--tilt-angle-2))rotateY(180deg)}.d20-face-13{transform-origin:center bottom;transform:rotateY(0)translateZ(var(--horizontal-adjust))translateY(var(--vertical-adjust-2))rotateX(var(--tilt-angle-4))rotateY(180deg)}.d20-face-14{transform-origin:center bottom;transform:rotateY(144deg)translateZ(var(--horizontal-adjust))translateY(var(--vertical-adjust-2))rotateX(var(--tilt-angle-3))}.d20-face-15{transform-origin:center bottom;transform:rotateY(288deg)translateZ(var(--horizontal-adjust))translateY(var(--vertical-adjust-2))rotateX(var(--tilt-angle-3))}.d20-face-16{transform-origin:center bottom;transform:rotateY(252deg)translateZ(var(--horizontal-adjust))translateY(var(--vertical-adjust-1))rotateX(var(--tilt-angle-1))}.d20-face-17{transform-origin:center bottom;transform:rotateY(36deg)translateZ(var(--horizontal-adjust))translateY(var(--vertical-adjust-1))rotateX(var(--tilt-angle-1))}.d20-face-18{transform-origin:center bottom;transform:rotateY(216deg)translateZ(var(--horizontal-adjust))translateY(var(--vertical-adjust-2))rotateX(var(--tilt-angle-4))rotateY(180deg)}.d20-face-19{transform-origin:center bottom;transform:rotateY(108deg)translateZ(var(--horizontal-adjust))translateY(var(--vertical-adjust-1))rotateX(var(--tilt-angle-2))rotateY(180deg)}.d20-face-20{transform-origin:center bottom;transform:rotateY(180deg)translateZ(var(--horizontal-adjust))translateY(var(--vertical-adjust-1))rotateX(var(--tilt-angle-2))rotateY(180deg)}#coin{justify-content:center;gap:2rem}#coin-display{perspective:400px;width:120px;height:120px;display:flex;flex-flow:column nowrap;justify-content:center}#coin-inner{width:120px;height:120px;transform-style:preserve-3d;transform:rotateX(0);position:relative}.coin-face{position:absolute;width:120px;height:120px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2.25rem;font-weight:700;border:6px solid var(--foreground,#DDD)}.coin-heads{background:color-mix(in srgb,var(--accent,royalblue) 20%,var(--background,#333));transform:rotateX(0)translateZ(.05px)}.coin-tails{background:color-mix(in srgb,var(--purple,mediumpurple) 20%,var(--background,#333));transform:rotateX(180deg)}#coin-result{font-size:2rem;font-weight:700;min-height:2.5rem;text-align:center}#number{justify-content:center;gap:2rem}#number-result{font-size:4rem;font-weight:700;min-height:4.5rem;text-align:center;color:var(--accent,royalblue);line-height:1;display:flex;flex-flow:column nowrap;justify-content:center}#number-controls{display:grid;grid-template-columns:auto auto auto auto auto;align-items:center;justify-content:center;gap:.5rem}@media(max-width:400px){#number-controls{grid-template-columns:auto auto;justify-items:center}#number-controls button{grid-column:1/-1}}.sr-only{position:absolute;left:-1e4px;top:auto;width:1px;height:1px;overflow:hidden}