@layer components{:root{--pc:var(--cyan);--key-drop:.375rem;--slam:cubic-bezier(.16, 1, .3, 1);--pop:cubic-bezier(.3, 0, .2, 1);scrollbar-color:var(--rule) var(--ground)}::selection{background:var(--cyan);color:var(--stage-black)}input{caret-color:var(--cyan)}input::placeholder{color:var(--ink-quiet);opacity:1}input[type=search]::-webkit-search-cancel-button{display:none}.wordmark{letter-spacing:.02em;transform:skewX(var(--skew));font-weight:900;font-stretch:125%;display:inline-block}.title{text-transform:uppercase;font-size:1.5625rem;font-weight:900;font-stretch:125%;line-height:1}.label{letter-spacing:.14em;text-transform:uppercase;font-size:.8125rem;font-weight:800}.key{min-height:2.75rem;margin-bottom:var(--key-drop);color:var(--stage-black);font:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:0 0;border:0;flex:none;padding:0;display:inline-grid;position:relative}.key-base{inset:var(--key-drop) 0 calc(var(--key-drop) * -1);background:var(--spotlight-base);transform:skewX(var(--skew));position:absolute}.key-top{background:var(--spotlight);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;transform:skewX(var(--skew));justify-content:center;align-items:center;gap:.375rem;font-size:.9375rem;font-weight:900;font-stretch:118%;transition:transform 70ms ease-out,background-color .15s;display:flex;position:absolute;inset:0}@media (hover:hover){.key:hover:not(:disabled) .key-top{background:var(--spotlight-hover)}}.key:is(:active:not(:disabled),[data-down]) .key-top{transform:translateY(var(--key-drop)) skewX(var(--skew))}.key:disabled{cursor:default}.key:disabled:not([data-down]){opacity:.4}.key:focus-visible{outline:2px solid var(--paper);outline-offset:.375rem}.plate{isolation:isolate;position:relative}.plate:before{content:"";z-index:-1;background:var(--panel);border-left:3px solid var(--rule);transform:skewX(var(--skew));position:absolute;inset:0}.field{isolation:isolate;position:relative}.field:before{content:"";z-index:-1;border:2px solid var(--ink-quiet);transform:skewX(var(--skew));transition:border-color .15s;position:absolute;inset:0}.field:focus-within:before{border-color:var(--paper)}.field input:focus-visible{outline:none}.thumb{clip-path:polygon(.35rem 0,100% 0,calc(100% - .35rem) 100%,0 100%)}.card{height:4.5rem;position:relative}.card-under{background:var(--pc);transform:translate(.5rem, .5rem) skewX(var(--skew));position:absolute;inset:0}.card-body{background:var(--raised);transform:skewX(var(--skew));display:flex;position:absolute;inset:0}.card-tag{background:var(--pc);min-width:6rem;max-width:62%;color:var(--stage-black);font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;border:0;flex:none;align-items:center;gap:.375rem;padding:0 .875rem 0 1rem;display:flex}.card-tag:focus-visible{outline:2px solid var(--paper);outline-offset:3px}.card-name{text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap;font-size:2rem;font-weight:900;font-stretch:125%;line-height:1;overflow:hidden}.card-name[data-length=mid]{font-size:1.5rem}.card-name[data-length=long]{font-size:1.1875rem;font-stretch:112%}.stub{isolation:isolate;flex-direction:column;flex:none;justify-content:center;align-self:stretch;width:4.125rem;padding-left:.875rem;line-height:1;display:flex;position:relative}.stub:before{content:"";z-index:-1;background:var(--raised);border-left:5px solid var(--pc);transform:skewX(var(--skew));position:absolute;inset:0}.mine-outline{position:relative}.mine-outline:after{content:"";border:2px solid var(--pc);transform:skewX(var(--skew));pointer-events:none;position:absolute;inset:0}.lean-bar{height:3px;transform:skewX(var(--skew));display:block}.meter{gap:3px;display:flex}.meter i{width:.5625rem;height:.5625rem;transform:skewX(var(--skew));background:#1d2130}.meter i[data-on]{background:var(--cyan);animation:cell .26s cubic-bezier(.2, .8, .2, 1) var(--d,0s) both}@keyframes cell{0%{transform:skewX(var(--skew)) scaleY(.3);background:#1d2130}}.slam-in{animation:slam-in .46s var(--slam) calc(min(var(--i,0), 10) * 45ms) both}@keyframes slam-in{0%{transform:translate(110%)}70%{transform:translate(-2.2%)}86%{transform:translate(.6%)}to{transform:none}}.slam-left{animation:slam-left .52s var(--slam) both}@keyframes slam-left{0%{transform:translate(-120%)}72%{transform:translate(.75rem)}88%{transform:translate(-.1875rem)}to{transform:none}}.pop-in{transform-origin:0 80%;animation:pop-in .36s var(--pop) var(--delay,0s) both}@keyframes pop-in{0%{opacity:0;transform:scale(1.9)}60%{opacity:1;transform:scale(.93)}to{transform:none}}.drop-in{animation:drop-in .28s var(--slam) var(--delay,0s) both}@keyframes drop-in{0%{opacity:0;transform:translateY(-1rem)}}.wipe{animation:wipe .3s var(--slam) var(--delay,0s) both}@keyframes wipe{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}.fly{pointer-events:none;font-size:2.5rem;line-height:1;animation:.76s cubic-bezier(.2,.7,.3,1) both fly;position:absolute;top:0;left:50%;translate:-50%}@keyframes fly{0%{opacity:0;transform:translateY(.5rem)scale(.6)}18%{opacity:1;transform:translateY(-1.5rem) scale(1.5) rotate(var(--r,0deg))}to{opacity:0;transform:translateY(-9rem) scale(1.1) rotate(var(--r,0deg))}}.sticker{justify-items:center;gap:.25rem;animation:4s cubic-bezier(.25,.7,.3,1) both sticker;display:grid;position:absolute;bottom:0}.sticker-emoji{filter:drop-shadow(3px 0 0 var(--paper)) drop-shadow(-3px 0 0 var(--paper)) drop-shadow(0 3px 0 var(--paper)) drop-shadow(0 -3px 0 var(--paper)) drop-shadow(0 .5rem .625rem #00000080);font-size:2.75rem;line-height:1}.sticker-name{background:var(--stage-black);max-width:7rem;color:var(--pc);letter-spacing:.08em;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap;transform:skewX(var(--skew));padding:.25rem .5rem;font-size:.8125rem;font-weight:900;font-stretch:118%;overflow:hidden}@keyframes sticker{0%{opacity:0;transform:translateY(2rem)scale(.3)rotate(-24deg)}10%{opacity:1;transform:translateY(-1rem) scale(1.15) rotate(var(--r))}18%{transform:translateY(-1.5rem) scale(1) rotate(var(--r))}80%{opacity:1}to{opacity:0;transform:translateY(-16rem) scale(.9) rotate(var(--r))}}@media (prefers-reduced-motion:reduce){.slam-in,.slam-left,.pop-in,.drop-in,.wipe{animation:.2s linear both fade-in}.meter i[data-on]{animation:none}.fly{animation:.6s linear both rm-fade}.sticker{animation:4s linear both rm-fade}.key-top{transition:none}}@keyframes rm-fade{0%,to{opacity:0}10%,80%{opacity:1}}}
