@import url(https://fonts.googleapis.com/css2?family=Rubik&display=swap);body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{font-family:"Rubik",sans-serif}.App{font-size:1.7em;text-align:center;background:linear-gradient(#dbdbdb,#f7f7f7);height:100vh;display:flex;align-items:center;justify-content:center;position:relative}input,select{font-size:inherit;border-radius:.5em;background:transparent;border:0;padding:0;margin:0;width:auto;transition:.3s}input{padding:.6em 0 .5em;height:100%;width:100%;width:max(5em,3.9em);width:max(5em,calc(var(--chars, 5)*0.62em + .8em));max-width:none;font-weight:600;text-align:center}.content{padding:10px;border-radius:.5em;background:#fff;box-shadow:0 4px 8px 0 rgba(0,0,0,.2);display:flex;align-items:center;justify-content:center;position:relative}.content span{line-height:5px;font-size:.7em;opacity:.7}.App-logo{position:absolute;top:-4.2em;background:#fff;border:5px solid #fff;width:350px}.show-css{padding:.6em 5px .5em 0;transition:.7s}.select-css,.show-css{box-sizing:border-box;border-radius:.5em;margin:10px;-moz-appearance:none;-webkit-appearance:none;appearance:none;background-repeat:no-repeat,repeat;background-position:right .7em top 50%,0 0;background-size:.65em auto,100%}.select-css{transition:.3s;padding:.6em 1.5em .5em .9em;box-shadow:0 1px 0 1px rgba(0,0,0,.04);background-color:#fff;background-image:url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E"),linear-gradient(180deg,#fff 0,#e5e5e5)}select::-ms-expand{display:none}.select-css:focus,input:focus{box-shadow:0 0 1px 3px rgba(59,153,252,.7);box-shadow:0 0 0 3px -moz-mac-focusring;color:#222}.select-css:focus,.show-css:focus,input:focus{border-color:#aaa;outline:none}.install-btn{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%);padding:.6em 1.4em;border:1px solid #aaa;border-radius:2em;background:#fff;color:#222;font-family:"Rubik",sans-serif;font-size:1rem;cursor:pointer}.install-btn:hover{border-color:#888}.rate-note{position:fixed;top:1rem;left:50%;transform:translateX(-50%);margin:0;padding:0 1rem;width:-webkit-max-content;width:-moz-max-content;width:max-content;max-width:90vw;text-align:center;font-family:"Rubik",sans-serif;font-size:.85rem;color:#666}.rate-note-delayed{opacity:0;-webkit-animation:rate-note-in .2s ease 1.2s forwards;animation:rate-note-in .2s ease 1.2s forwards}@-webkit-keyframes rate-note-in{to{opacity:1}}@keyframes rate-note-in{to{opacity:1}}.card-wrap{position:relative}.extras-card{position:absolute;top:100%;left:50%;transform:translateX(-50%);margin-top:.9em;padding:4px 10px;border-radius:.5em;background:#fff;box-shadow:0 2px 6px 0 rgba(0,0,0,.12);display:flex;flex-direction:column;align-items:flex-end}.row.extra{display:flex;align-items:center}.extra-remove{border:0;background:transparent;color:#999;font-size:.7em;line-height:1;padding:0 .3em;cursor:pointer;opacity:0;transition:opacity .2s}.extra-remove:focus,.row.extra:hover .extra-remove{opacity:.8}.add-currency{position:absolute;left:50%;transform:translateX(-50%);width:1.2em;height:1.2em;padding:0;border:1px solid #e2e2e2;border-radius:50%;background:#fff;color:#999;font-size:.8em;line-height:1;cursor:pointer;opacity:.35;transition:opacity .2s}.add-currency.below{top:100%;margin-top:.8em}.add-currency.on-card{bottom:-.6em}.add-currency:focus,.card-wrap:hover .add-currency{opacity:.9}@media (hover:none){.extra-remove{opacity:.5}.add-currency{opacity:.55}}@media (max-width:560px){.App{font-size:min(1.7em,calc((100vw - 57px)/19.8));font-size:min(1.7em,calc((100vw - 57px)/(19.8 + 0.62*var(--extra, 0))))}.select-css,.show-css{margin:3px}input{width:max(4.2em,3.9em);width:max(4.2em,calc(var(--chars, 5)*0.62em + .8em))}.content{padding:8px 6px}.content span{margin:0 2px}.App-logo{box-sizing:border-box;width:min(350px,100%);left:0;right:0;margin:0 auto;top:auto;bottom:100%}}
/*# sourceMappingURL=main.ad46c5ff.chunk.css.map */