:root{color-scheme:light dark;--color: lightgreen}html,body{height:100%;overflow:hidden}body{font-family:system-ui,sans-serif;color:var(--color);--funColor: color-mix(in srgb, var(--color) 75%, transparent);--funColorAlt: color-mix(in srgb, var(--color) 50%, transparent);transition:1s color ease;background:url(https://artlung.com/blog/wp-content/themes/roanoke/images/artlung2023.svg) bottom 1rem right 1rem/10ch no-repeat}div{border:1px solid;background:color-mix(in srgb, var(--funColor) 20%, transparent);position:absolute;width:var(--width, 20px);height:var(--width, 20px);top:var(--top, 50%);left:var(--left, 50%);margin:calc(var(--width, 20px)/-2) 0 0 calc(var(--width, 20px)/-2);transition:all .3s ease-in-out;user-select:none;-webkit-user-select:none;touch-action:manipulation;background-size:0 0;background-position:50% 50%}div[data-gradient=radial-gradient]{background-image:radial-gradient(var(--funColor) 50%, transparent 0)}div[data-gradient=radial-gradient-reversed]{background-image:radial-gradient(transparent 50%, var(--funColor) 0)}div[data-gradient=linear-gradient-45deg]{background-image:linear-gradient(45deg, var(--funColor), 50%, transparent 0)}div[data-gradient=linear-gradient-minus-45deg]{background-image:linear-gradient(-45deg, var(--funColor), 50%, transparent 0)}div[data-gradient=conic-gradient-quad]{background-image:conic-gradient(from 45deg, var(--funColor) 25%, transparent 0 50%, var(--funColor) 0 75%, transparent 0)}div[data-gradient=conic-gradient-4color]{background-image:conic-gradient(from 0deg, var(--funColor) 25%, transparent 0 50%, var(--funColorAlt) 0 75%, transparent 0)}div[data-click-count]{background-position:0 0;background-size:calc(100%/var(--factor, 1)) calc(100%/var(--factor, 1))}div[data-click-count="1"]{--factor: 1}div[data-click-count="2"]{--factor: 2}div[data-click-count="3"]{--factor: 3}div[data-click-count="4"]{--factor: 4}div[data-click-count="5"]{--factor: 5}div[data-click-count="6"]{--factor: 6}div[data-click-count="7"]{--factor: 7}div[data-click-count="8"]{--factor: 8}div[data-click-count="9"]{--factor: 9}div[data-click-count="10"]{--factor: 10}div[data-click-count="11"]{--factor: 11}div[data-click-count="12"]{--factor: 12}div[data-click-count="13"]{--factor: 13}div[data-click-count="14"]{--factor: 14}div[data-click-count="15"]{--factor: 15}div[data-click-count="16"]{--factor: 16}div[data-click-count="17"]{--factor: 17}div[data-click-count="18"]{--factor: 18}div[data-click-count="19"]{--factor: 19}div[data-click-count="20"]{--factor: 20}div.fade-out{pointer-events:none;opacity:1;filter:blur(1px);animation-name:slow-death;animation-duration:4s;animation-timing-function:ease-in-out;animation-fill-mode:forwards;animation-iteration-count:1}p{font-weight:bold;user-select:none;-webkit-user-select:none;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);font-size:1.5rem}p.second-message{display:none}body:has(div) p{display:none}body:has(div) p.second-message{display:block}body:has(div[data-click-count]) p.second-message{display:none}@keyframes slow-death{0%{opacity:1;filter:blur(0)}100%{opacity:0;filter:blur(10px)}}