.form{background-color:#15172b;box-sizing:border-box;height:500px;padding:20px;width:320px}.title{color:#eee;font-family:sans-serif;font-size:36px;font-weight:600;margin-top:30px}.subtitle{color:#eee;font-family:sans-serif;font-size:16px;font-weight:600;margin-top:10px}.input-container{height:36px;position:relative;width:100%}.input-container.large{height:80px}.ic1{margin-top:40px}.ic2{margin-top:30px}.input{background-color:#303245;border-radius:0;border:0;box-sizing:border-box;color:#eee;font-size:14px;height:100%;outline:0;padding:8px;width:100%;font-family:Roboto,sans-serif}.cut{background-color:#15172b;border-radius:10px;height:20px;left:20px;position:absolute;top:-20px;transform:translateY(0);transition:transform .2s;width:76px}.cut-short{width:50px}.input:focus~.cut,.input:not(:placeholder-shown)~.cut{transform:translateY(8px)}.placeholder{color:#65657b;font-family:sans-serif;left:20px;line-height:14px;pointer-events:none;position:absolute;transform-origin:0 50%;transition:transform .2s,color .2s;top:20px}.input:focus~.placeholder,.input:not(:placeholder-shown)~.placeholder{transform:translateY(-30px) translate(10px) scale(.75)}.input:not(:placeholder-shown)~.placeholder{color:#808097}.input:focus~.placeholder{color:#dc2f55}.submit{background-color:#08d;border-radius:0;border:0;box-sizing:border-box;color:#eee;cursor:pointer;font-size:14px;height:50px;margin-top:38px;outline:0;text-align:center;width:100%}.submit:active{background-color:#06b}.autocomplete-list{list-style:none;margin:0;padding:0;position:relative;z-index:2;background-color:#ffffffe6}.autocomplete-list li{padding:4px 12px}.loading-animation{width:24px;aspect-ratio:6;--_g: no-repeat radial-gradient(circle closest-side,white 90%,transparent);background:var(--_g) 0% 50%,var(--_g) 50% 50%,var(--_g) 100% 50%;background-size:calc(100%/3) 100%;animation:l7 1s infinite linear}@keyframes l7{33%{background-size:calc(100%/3) 0%,calc(100%/3) 100%,calc(100%/3) 100%}50%{background-size:calc(100%/3) 100%,calc(100%/3) 0%,calc(100%/3) 100%}66%{background-size:calc(100%/3) 100%,calc(100%/3) 100%,calc(100%/3) 0%}}@keyframes satelliteMoving{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.normal-button{width:48px;height:48px;border:0;border-radius:50%;font-size:16px;font-family:Caprasimo;color:#fff;background-color:#151515}.orbit-button{position:relative}.orbit-button .orbit{position:absolute;left:-6px;top:-6px;bottom:-6px;right:-6px;border-radius:50%;border:.25px solid hsla(0,0%,100%,.66);z-index:-1}.orbit-button .orbit .satellite{position:absolute;top:0;left:0;bottom:0;right:0;animation:satelliteMoving 5s linear infinite}.orbit-button .orbit .satellite:before{content:"";position:absolute;top:calc(50% - 2px);left:-2px;width:3px;height:3px;background:#fff;border-radius:50%}.orbit-button .orbit .satellite:after{content:"";position:absolute;top:calc(50% - 1px);right:-1px;width:2px;height:2px;background:#fff;border-radius:50%}.orbit-button button{width:48px;height:48px;border:0;border-radius:50%;font-size:12px;font-family:Caprasimo;color:#fff;background-color:#111;transition:background .3s ease}.orbit-button button:disabled,.normal-button:disabled{opacity:.5}.card{position:relative;margin:auto;overflow:hidden}.card>.inner{padding:36px 24px;box-sizing:border-box}.card>.inner>.level{position:absolute;bottom:12px;left:0;font-family:Caprasimo;text-align:right;color:#fff;width:100%;padding:0 12px;box-sizing:border-box}.card>.inner>.edit{position:absolute;bottom:12px;left:0;text-align:left;color:#fff;padding:0 12px;box-sizing:border-box}.card>.inner>.level:before{content:"";width:60%;height:.5px;background:#fff;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.card>.inner>.word{margin-bottom:12px;font-family:Caprasimo;font-size:30px;color:invert(var(--word-color, #fff));filter:invert(1) drop-shadow(0 0 2px #0008)}.extra{margin-bottom:6px;font-family:Roboto Condensed;font-weight:600;font-size:13px;white-space:break-spaces;color:invert(var(--word-color, #fff));filter:invert(1) drop-shadow(0 0 2px #0008);text-align:left;min-height:32px;width:100%;box-sizing:border-box;background:transparent}.extra button{display:flex;border:0;font-size:14px;padding:8px 12px;background-color:#fff3;color:#000;font-family:Roboto Condensed}.extra button>svg{margin-right:4px;width:16px;height:auto}.background{position:relative;background:#000}@keyframes background{0%{transform:rotate(0) scale(3)}50%{transform:rotate(180deg) scale(6)}to{transform:rotate(360deg) scale(3)}}.background .main{position:absolute;left:50%;top:50%;width:75%;height:75%;transform:translate(-50%,-50%);z-index:-1;overflow:hidden}.background .main img{display:block;object-fit:cover;width:100%;height:100%;opacity:.4}.background .main:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;box-shadow:inset 0 0 70px 16px #000,inset 0 0 70px 16px #000;z-index:1}.background:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;box-shadow:inset 0 20px 72px 16px #000;z-index:1}html,body{margin:0;padding:0;overflow:hidden;background:#000}a{text-decoration:none}button{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}input{border-radius:0;background-color:transparent;color:#fff;box-shadow:inset 1px 2px 6px #00000080;border:none;outline:none;padding:12px 8px;font-size:14px}.text-button{border:none;outline:none;color:#fff;background:#111;cursor:pointer;padding:12px 16px;position:relative;font-size:12px}
