@font-face{font-family:pixel;src:url(/static/media/pixel.b72ce33f489be3eb8504.ttf)}@font-face{font-family:Consolas;src:url(/static/media/consolas.252a062087ec8913016e.TTF)}::-webkit-scrollbar{height:0;width:0}#App{height:100vh;width:100vw}#App[theme=light]{background:#f7f7f7}#App[theme=dark]{background:#19171d}#App[theme=dark] .container #-keybar #-tools [class*=ps-]:after{color:#68637d}#App[theme=dark] .container #-keybar #-tools #-copy div{border-color:#4d495d}#App[theme=dark] .container #-keybar #-tools #-copy #copy,#App[theme=dark] .container #-keybar #-tools #-modeSVG #keySVGmacro{fill:#4d495d}#App[theme=dark] .container #-keybar #-tools #separator{color:#4d495d}#App[theme=dark] #params .grid .-i .i{color:#68637d}#App[theme=dark] #params .grid label{color:#4d495d}#App[theme=dark] #params .grid .val,#App[theme=dark] #params .grid input{color:#68637d}#App[theme=dark] #params #advanced{color:#4d495d}#App[theme=dark] #params #advanced[status=active]{color:#68637d}#App[theme=vivid]{background:#19171d}#App[theme=vivid] .container #-keybar #-tools [class*=ps-]:after{color:color-mix(in srgb,violet 40%,#fff)}#App[theme=vivid] .container #-keybar #-tools #-copy #copy{fill:color-mix(in srgb,violet 60%,#000)}#App[theme=vivid] .container #-keybar #-tools #separator{color:color-mix(in srgb,violet 60%,#000)}#App[theme=vivid] #params .grid .-i .i{color:color-mix(in srgb,violet 40%,#fff)}#App[theme=vivid] #params .grid label{color:violet}#App[theme=vivid] #params .grid .val,#App[theme=vivid] #params .grid input{color:#f0f}#App[theme=vivid] #params #advanced{color:color-mix(in srgb,violet 60%,#000)}#App[theme=vivid] #params #advanced[status=active]{color:color-mix(in srgb,violet 40%,#fff)}.container{display:flex;flex-direction:column;top:33vh}.container #-keybar{grid-gap:1rem;align-content:center;display:grid;margin-bottom:3rem}.container #-keybar [class*=ps-]:after{color:#f4a460}.container #-keybar #-key{position:relative}.container #-keybar #-key #key{color:#f4a460;font-family:Consolas;font-weight:700;letter-spacing:3px;margin:0;-webkit-user-select:none;user-select:none;white-space:nowrap;white-space:pre}.container #-keybar #-key span.span-key{font-size:1.5rem;-webkit-user-select:none;user-select:none}.container #-keybar #-key #dropDownTools{position:absolute;right:1rem;top:calc(100% + .5rem)}.container #-keybar #-key #dropDownTools p{color:#70707080;font-family:Consolas;font-size:12px;margin:0}.container #-keybar #-tools .-tool{-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;align-items:center;cursor:pointer;display:flex;height:100%;position:relative;-webkit-user-select:none;user-select:none}.container #-keybar #-tools #-copy:not(.copied):after{content:"copy"}.container #-keybar #-tools #-copy.copied:after{content:"copied!"}.container #-keybar #-tools #-copy div{cursor:pointer;height:calc(var(--key-height)/5*6);position:relative;width:calc(var(--key-height)/5*6)}.container #-keybar #-tools #-copy div #div1{border:calc(var(--key-height)/5) solid #000}.container #-keybar #-tools #-copy div #div1,.container #-keybar #-tools #-copy div #div2{box-sizing:border-box;height:calc(var(--key-height)/5*4);width:calc(var(--key-height)/5*4)}.container #-keybar #-tools #-copy div #div2{border-bottom:calc(var(--key-height)/5) solid #000;border-right:calc(var(--key-height)/5) solid #000;bottom:0;position:absolute;right:0}.container #-keybar #-tools #-copy #copy{fill:#f4a460;cursor:pointer;height:1.25rem}.container #-keybar #-tools #-modeSVG{transition:width .2s ease-out}.container #-keybar #-tools #-modeSVG:after{content:"generate"}.container #-keybar #-tools #-modeSVG #keySVGmacro{fill:blue;height:var(--key-height)}.container #-keybar #-tools #-modeSVG #userSVGmacro{fill:grey;height:1.2rem}.container #-keybar #-tools #separator{color:grey;font-family:Consolas;margin:0 .25rem 0 1rem}.container #-keybar #-tools #-notmodeSVG[status=key]:after{content:"key"}.container #-keybar #-tools #-notmodeSVG[status=username]:after{content:"username"}.container #-keybar #-tools #-notmodeSVG svg{fill:grey}.container #-keybar #-tools #-notmodeSVG #keyIMGmini,.container #-keybar #-tools #-notmodeSVG #keySVGmini{height:.66rem}.container #-keybar #-tools #-notmodeSVG #userIMGmini,.container #-keybar #-tools #-notmodeSVG #userSVGmini{height:.792rem}.container #params input,.container #params label,.container #params p{-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;font-family:Consolas;margin:0;-webkit-user-select:none;user-select:none}.container #params .newLineElement{margin-top:1rem}.container #params .grid{grid-gap:1rem;display:grid;grid-template-columns:1fr 1fr}.container #params .grid .-i{justify-self:end}.container #params .grid .-i .i{color:#f4a460;cursor:default;font-family:Consolas;font-size:13px;font-style:italic;font-weight:700;margin:0;padding-left:2px}.container #params .grid .-i .-ie{align-items:end;padding-right:8px}.container #params .grid .-i .-ie .ie{font-family:Consolas}.container #params .grid .-i .-ie .the-goods{color:#f4a460;font-family:Consolas;font-weight:700;letter-spacing:2px;margin-left:6px;white-space:nowrap}.container #params .grid .-i .-ie .the-goods span.accent{color:purple}.container #params .grid .-i .-ie .the-goods span.comma{letter-spacing:0}.container #params .grid .val,.container #params .grid input{background:none;border:none;color:#202020;font-size:1em;margin:0;max-width:100%;outline:none;padding:0}.container #params .grid label{color:#707070;text-align:right}.container #params .grid .val{cursor:pointer;white-space:nowrap}.container #params .opts-panel{overflow:hidden;transition:height .3s ease-out}.container #params .opts-panel #useClientHeight{padding-bottom:1rem}.container #params .opts-panel .grid{grid-template-columns:1fr auto;margin-bottom:1rem;margin-left:1rem;width:-moz-fit-content;width:-webkit-fit-content;width:fit-content}.container #params .opts-panel .grid>*{cursor:pointer;font-family:Consolas}.container #params .opts-panel .grid label{text-align:left}.container #params .opts-panel .grid div{text-align:center}.container #params #exclude_inputs .test-input{border:1px solid #0000;border-radius:3px;margin-right:.5rem;padding:3px;width:1rem}.container #params #exclude_inputs .test-input:hover{border-color:#f4a460}.container #params #exclude_inputs input{letter-spacing:8px}.container #params #exclude_inputs input.condensed,.container #params #exclude_inputs input::placeholder{letter-spacing:normal}.container #params #exclude_inputs input::placeholder{color:#707070;font-family:Consolas;font-weight:400}.container #params #exclude_inputs input:not(.condensed){color:red;font-weight:700}.container #params #-format{left:0;position:absolute;top:0}.container #params #-format .-elem{cursor:pointer;margin-right:3px;position:relative}.container #params #-format .-elem>p{width:-moz-fit-content;width:-webkit-fit-content;width:fit-content}.container #params #-format .-elem.open .drop-menu{display:block}.container #params #-format .-elem .drop-menu{background:#f7f7f7f7;display:none;left:0;padding-top:1rem;position:absolute;top:100%;width:-moz-fit-content;width:-webkit-fit-content;width:fit-content}.container #params #-format .-elem .drop-menu:hover{display:block}.container #params #-format .-elem .drop-menu p{cursor:pointer;margin:0;padding:.25em .5em;white-space:nowrap}.container #params #-format .-elem .drop-menu p:hover{background:#d3d3d3}.container #params #advanced{color:grey;font-size:12px;letter-spacing:1px;margin:1em;text-align:center}.container #params #advanced[status=active]{color:#f4a460}@media (orientation:landscape){#App[device=desktop]{--key-height:18px}#App[device=desktop] .container #-keybar{grid-template-columns:1fr 1fr}#App[device=desktop] .container #-keybar #key{position:absolute;right:0;top:50%;transform:translateY(-50%)}#App[device=desktop] .container #-keybar #-tools #-modeSVG{margin-left:1rem}}@media (orientation:portrait){#App[device=mobile]{--key-height:1.5rem}#App[device=mobile] .container{bottom:auto;left:auto;padding-top:15vh;position:relative;right:auto;top:auto;transform:none;width:100vw}#App[device=mobile] .container #-keybar{grid-gap:2rem;box-sizing:border-box;grid-template-rows:1fr 1fr;justify-content:center;justify-items:center;margin-bottom:5rem;width:100vw}#App[device=mobile] .container #-keybar [class*=ps-]:after{display:none}#App[device=mobile] .container #-keybar #key{width:-moz-fit-content;width:-webkit-fit-content;width:fit-content}#App[device=mobile] .container #-keybar span.span-key{font-size:2rem}#App[device=mobile] .container #-keybar #-tools{flex-direction:row-reverse}#App[device=mobile] .container #-keybar #-tools #-modeSVG{margin-right:2rem}#App[device=mobile] .container .grid{align-items:start}}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}@keyframes -fade-out{0%{opacity:1}to{opacity:0}}@keyframes -fade-in{0%{opacity:0}to{opacity:100%}}@keyframes -blink{0%{opacity:1}50%{opacity:0}to{opacity:1}}@keyframes -blink-double{0%{opacity:1}25%{opacity:0}50%{opacity:1}75%{opacity:0}to{opacity:1}}.x{left:50%;position:absolute;transform:translateX(-50%)}.y{transform:translateY(-50%)}.xy,.y{position:absolute;top:50%}.xy{left:50%;transform:translate(-50%,-50%)}.x0y0{left:0;position:absolute;top:0}.unset-input{background:none;border:none;border-radius:0;outline:none;padding:0}#y{background:blue;height:100vh;left:50%;position:absolute;transform:translateX(-50%);width:1px}#q1{height:1px;left:0;width:25vw}#q1,#q1 .down{background:blue;position:absolute;top:50%;transform:translateY(-50%)}#q1 .down{height:100vh;right:0;width:1px}#q4{height:1px;right:0;width:25vw}#q4,#q4 .down{background:blue;position:absolute;top:50%;transform:translateY(-50%)}#q4 .down{height:100vh;left:0;width:1px}#h-y{background:red;height:3px;left:50%;top:50%;transform:translate(-50%,-50%);width:50vw}#h-y,#twoThirds{position:absolute}#twoThirds{background:#ff0;height:100vw;left:66%;width:2px}#custom{border-left:1px solid #32cd32;border-right:1px solid #32cd32;left:50%;transform:translateX(-50%);width:calc(50vw - 2rem)}#custom,#drag-me{height:100vh;position:absolute}#drag-me{display:flex;justify-content:space-between;left:.5rem;top:0;width:22px}#drag-me .rule{background:#ff0;height:100%;width:2px}.cursor-default{cursor:default!important}.pointer{cursor:pointer}.no-select{-webkit-user-select:none;user-select:none}body{margin:0}img,svg{display:block}.inline-block{display:inline-block}.posrel{position:relative}.fit-content{width:-moz-fit-content;width:-webkit-fit-content;width:fit-content}[class^="--f"]{display:flex;flex-direction:column}[class^="--f"][class*="--f-a"]{align-items:center}[class^="--f"][class*="--f-j"]{justify-content:center}[class^="--f"][class*="--f-j"][class*=-j-sb]{justify-content:space-between}[class^="--f"][class*="--f-ja"]{align-items:center;justify-content:center}[class^=-f-]{display:flex}[class^=-f-][class*=-f-a]{align-items:center}[class^=-f-][class*=-f-j]{justify-content:center}[class^=-f-][class*=-f-j][class*=-j-sb]{justify-content:space-between}[class^=-f-][class*=-f-ja]{align-items:center;justify-content:center}[class*=-m-]{height:100vh;left:0;position:absolute;top:0;width:100vw;z-index:1}[class*=-m-] .back{height:100%;width:100%}[class*=-m-] .back.dark{background:#0003}[class*=-p-]{left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}[class*=-p-][class*=-p-block]{height:100%;width:100%;z-index:1}[class*=-p-][class*=-p-back]{height:100vh;position:fixed;width:100vw;z-index:-1}.inherit-w{width:inherit}.black{color:#000!important}.m0{margin:0}.firstelm-mt0,.mt0{margin-top:0}.mt0IMP{margin-top:0!important}.lastelm-mb0,.mb0,.mtb0,.nomarj{margin-bottom:0}.mtb0,.nomarj{margin-top:0}a{display:contents}.h-link,.hlink,.hyperlink{color:blue!important;cursor:pointer;font-weight:400}.h-link:hover,.hlink:hover,.hyperlink:hover{text-decoration:underline}.rlink{cursor:pointer}.rlink:hover,.txt-u,.underline{text-decoration:underline}.italic,.txt-i{font-style:italic}.bold,.txt-b{font-weight:700}.bolder{font-weight:bolder}.txt-u{text-decoration:underline}.pre{white-space:pre}.nowrap{white-space:nowrap}[class*=ps-]:hover:after{visibility:visible}[class*=ps-]:after{visibility:hidden;white-space:nowrap;width:-webkit-max-content;width:max-content;z-index:999}[class*=ps-][class*=-static]:after{border-radius:4px!important;transition:none!important}[class*=ps-][class*=ps-left]:after{position:absolute;right:calc(100% + 1.5rem);top:50%;transform:translateY(-50%);transition:right .3s ease-out}[class*=ps-][class*=ps-left]:hover:after{right:calc(100% + 1rem)}[class*=ps-][class*=ps-right]:after{left:calc(100% + 1.5rem);position:absolute;top:50%;transform:translateY(-50%);transition:left .3s ease-out}[class*=ps-][class*=ps-right]:hover:after{left:calc(100% + 1rem)}[class*=ps-][class*=ps-top]:after{bottom:calc(100% + 1.5rem);left:50%;position:absolute;transform:translateX(-50%);transition:bottom .3s ease-out}[class*=ps-][class*=ps-top]:hover:after{bottom:calc(100% + 1rem)}[class*=ps-][class*=ps-bottom]:after{left:50%;position:absolute;top:calc(100% + 1.5rem);transform:translateX(-50%);transition:top .3s ease-out}[class*=ps-][class*=ps-bottom]:hover:after{top:calc(100% + 1rem)}[class*=ps-][class*=ps-top-mini]:after{bottom:calc(100% + 1rem);left:50%;position:absolute;transform:translateX(-50%);transition:bottom .3s ease-out}[class*=ps-][class*=ps-top-mini]:hover:after{bottom:calc(100% + .5rem)}[class*=ps-][class*=ps-bottom-mini]:after{left:50%;position:absolute;top:calc(100% + 1rem);transform:translateX(-50%);transition:top .3s ease-out}[class*=ps-][class*=ps-bottom-mini]:hover:after{top:calc(100% + .5rem)}[class*=pseudo-]:hover .pseudo{visibility:visible}[class*=pseudo-][class*=pseudo-top]:hover .pseudo{bottom:calc(100% + 1rem)}[class*=pseudo-][class*=pseudo-top] .pseudo{bottom:calc(100% + 1.5rem);left:50%;position:absolute;transform:translateX(-50%);transition:bottom .3s ease-out}[class*=pseudo-][class*=pseudo-top-mini]:hover .pseudo{bottom:calc(100% + .5rem)}[class*=pseudo-][class*=pseudo-top-mini] .pseudo{bottom:calc(100% + 1rem);left:50%;position:absolute;transform:translateX(-50%);transition:bottom .3s ease-out}[class*=pseudo-][class*=pseudo-bottom]:hover .pseudo{top:calc(100% + 1rem)}[class*=pseudo-][class*=pseudo-bottom] .pseudo{left:50%;position:absolute;top:calc(100% + 1.5rem);transform:translateX(-50%);transition:top .3s ease-out}[class*=pseudo-] .pseudo{visibility:hidden;white-space:nowrap}.ps-opacity:hover .ps-elem{opacity:1}.ps-opacity .ps-elem{opacity:0}.no-overflow{overflow:hidden}.devices-no-tap,.noselect{-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}
/*# sourceMappingURL=main.d8298a6f.css.map*/