.D{--border-width: 2px;--border-color: #4bb;position:relative;font-size:4rem;line-height:6rem;color:#fff;font-family:monospace;text-transform:uppercase;padding:0 4rem;text-align:center;border:var(--border-width) solid var(--border-color);border-radius:8px;box-shadow:6px 6px 12px -6px color-mix(in srgb,#4aaa,#000a 95%);box-sizing:border-box;background-color:var(--bg);-webkit-appearance:unset;-moz-appearance:unset;appearance:unset;align-items:unset;cursor:pointer;transition:border-color .1s,transform .1s}.D:disabled{cursor:default;border-color:#444}.D:active{transform:scale(.97)}.D:hover{background-color:color-mix(in srgb,var(--bg),var(--border-color) 2%)}.E{position:relative;aspect-ratio:1;background-color:var(--bg);padding:0}.F{border:2px solid transparent}.G{position:relative;overflow:hidden}.y{display:flex;flex-direction:column;align-items:flex-end}.z{font-size:3rem;line-height:6rem;color:#888;font-family:monospace}.A{display:flex;gap:1rem}.B{height:2rem;width:2rem;flex:1;border:1px solid #555;border-radius:1rem}.C{background-color:#20f86c44;border-color:#20f86c}.p{display:grid;grid-template-columns:repeat(4,1fr);gap:calc(2 * var(--gap))}.p .q{aspect-ratio:1;font-size:8rem}.H{display:block;margin:2px}.I{position:absolute;top:0}.J{stroke:#eee;stroke-width:.2;stroke-linecap:round;stroke-linejoin:round;fill:none}.K{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}.r{position:relative}.s{position:absolute;top:0;height:100%;width:100%;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}.t{grid-column-start:1;grid-row-start:1;background-image:url("data:image/svg+xml,%3Csvg width='6' height='6' viewBox='0 0 6 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%2320f86c' fill-rule='evenodd'%3E%3Cpath d='M5 0h1L0 6V5zM6 5v1H5z'/%3E%3C/g%3E%3C/svg%3E");margin:var(--gap)}.u{grid-column-start:2;grid-column-end:5;grid-row-start:1;background-image:url("data:image/svg+xml,%3Csvg width='6' height='6' viewBox='0 0 6 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23b50000' fill-rule='evenodd'%3E%3Cpath d='M5 0h1L0 6V5zM6 5v1H5z'/%3E%3C/g%3E%3C/svg%3E");margin:var(--gap)}.v{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}.w{box-shadow:inset 0 0 0 1px #20f86c}.x{box-shadow:inset 0 0 0 1px #b50000}.a{padding:2rem 0}.b{position:sticky;top:0;background-color:var(--bg);padding:var(--gap) 0;display:flex;flex-direction:column;gap:var(--gap);z-index:1;--fh: calc(var(--gap) + .333 * (96rem - 2 * var(--gap)))}.c{display:flex;justify-content:space-between;align-items:center}.d{padding:0;width:9rem;height:9rem}.e{background-color:var(--bg);position:relative;--fh: calc(var(--gap) + .333 * (96rem - 2 * var(--gap)))}.f{margin-bottom:2rem}.g{--border-color: #b50000;animation-name:g;animation-timing-function:ease;animation-duration:var(--dur)}.h{--border-color: #20f86c;animation-name:h;animation-timing-function:cubic-bezier(.22,.61,.36,1);animation-duration:var(--dur);z-index:999}.i{font-size:5rem;color:#fff;font-family:monospace;text-transform:uppercase;display:block;text-align:center;line-height:22.5rem}@keyframes g{0%{transform:translate(0)}25%{transform:translate(1rem)}50%{transform:translate(-1rem)}75%{transform:translate(1rem)}to{transform:translate(0)}}@keyframes h{0%{transform:scale(1)}10%{transform:scale(1.3)}to{transform:scale(1)}}.b .j,.e .j{transform:translateY(calc(-1 * var(--fh)));animation-name:j;animation-fill-mode:forwards;animation-duration:var(--dur);animation-delay:var(--del);animation-timing-function:ease-out}@keyframes j{0%{transform:translateY(calc(-1 * var(--fh)))}to{transform:translateY(0)}}.b .k,.e .k{animation-name:k;animation-fill-mode:forwards;animation-duration:var(--dur);animation-delay:var(--del);animation-timing-function:ease-out}@keyframes k{0%{transform:translateY(0)}to{transform:translateY(var(--fh))}}.e .l{animation-name:l;animation-duration:var(--dur);animation-timing-function:ease-out}@keyframes l{0%{clip-path:inset(0 0 calc(var(--gap) + var(--fh)))}to{clip-path:inset(0 0 var(--gap))}}.m{--border-color: #4bb;list-style-type:none;margin:0;padding:0;display:flex;gap:var(--gap);box-shadow:0 -2px 0 0 var(--border-color) inset}.n{padding:0;width:9rem;height:9rem;border-radius:8px 8px 0 0}.n:active{transform:none}.o{border-bottom-color:transparent}._{width:96rem}button{padding:0}