@font-face{font-family:"Montserrat";src:url(c8313bad66bf2cf4f9e6.woff2) format("woff2"),url(d27ca3cc852da1ea6803.woff) format("woff");font-weight:100;font-style:normal;font-display:swap}@font-face{font-family:"Montserrat";src:url(9d07dba4961a9ee966fb.woff2) format("woff2"),url(5cf6da228040b2f5774c.woff) format("woff");font-weight:100;font-style:italic;font-display:swap}
@font-face{font-family:"EB Garamond";src:url(afd131904ea6230d3636.woff2) format("woff2"),url(0e9dd292bb99e43f6b10.woff) format("woff");font-weight:normal;font-style:normal;font-display:swap}@font-face{font-family:"EB Garamond";src:url(bb031e7f053805b56aa1.woff2) format("woff2"),url(4ad998a9d34a4e3932a1.woff) format("woff");font-weight:normal;font-style:italic;font-display:swap}
@font-face{font-family:"Organic Plant";src:url(562edcb664030f0b7a9d.woff2) format("woff2"),url(be397a8709406a00fcf1.woff) format("woff");font-weight:normal;font-style:normal;font-display:swap}
@font-face{font-family:"Font Awesome 5 Pro";src:url(b91ed5e2226514248f5f.woff2) format("woff2"),url(763b520294c3e3d7e4ad.woff) format("woff");font-weight:normal;font-style:normal;font-display:swap}@font-face{font-family:"SF Pro Display";src:url(d005695c902b2c14152b.woff2) format("woff2"),url(cc78a6be15bdad5dc88f.woff) format("woff");font-weight:normal;font-style:normal;font-display:swap}@font-face{font-family:"SF Pro Text";src:url(723f6578364443ef62c7.woff2) format("woff2"),url(a6cc2e6a4718706f550e.woff) format("woff");font-weight:normal;font-style:normal;font-display:swap}@font-face{font-family:"SF Pro Text";src:url(8efd5a5bc80efe954338.woff2) format("woff2"),url(e7c215784c87dc41779e.woff) format("woff");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:"SF Pro Icons";src:url(3373ff012138f5a2fc21.woff2) format("woff2"),url(b5381d2da0d31c002505.woff) format("woff");font-weight:normal;font-style:normal;font-display:swap}@font-face{font-family:"SF Pro Display";src:url(abf74db8a324991ecb72.woff2) format("woff2"),url(cd7681fe512962794c1a.woff) format("woff");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:"SF Pro Icons";src:url(547212c483d662c30e4c.woff2) format("woff2"),url(844cc045789bf28fd194.woff) format("woff");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Open Sans";src:url(50745f79a0d851b45c43.woff2) format("woff2"),url(20434f184d261c7abe57.woff) format("woff");font-weight:normal;font-style:normal;font-display:swap}@font-face{font-family:"Open Sans";src:url(424c3e9f245be4b4ca1c.woff2) format("woff2"),url(ce5b13d0e95023056f6a.woff) format("woff");font-weight:normal;font-style:italic;font-display:swap}
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0) !important;background:#fff}body{line-height:1;font-size:1.3rem;margin:0 auto;width:100%;min-width:300px !important;scroll-behavior:smooth}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace;font-size:1em}a{background-color:rgba(0,0,0,0);font-size:inherit;font-weight:500;letter-spacing:inherit;color:inherit;text-decoration:underline;text-decoration-thickness:1px}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{appearance:button;-webkit-touch-callout:none;user-select:none;cursor:pointer}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto;resize:none}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{appearance:none}::-webkit-file-upload-button{appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}*{box-sizing:border-box;content:"";content:none}*::-webkit-scrollbar{display:none}span{margin:auto}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{appearance:none;margin:0}input[type=number]{-moz-apperance:textfield}:root{--font-eb-garamond: 'EB Garamond';--font-montserrat: 'Montserrat';--font-sans-serif: 'sans-serif';--font-organic-plant: 'Organic Plant';--font-roboto: 'Roboto';--font-times-new-roman: 'Times New Roman';--font-source-code-pro: 'Source Code Pro';--open-sans: 'Open Sans';--font-primary-font-title: var(--font-eb-garamond, --font-times-new-roman);--font-primary-paragraph: var(--open-sans, --font-montserrat, --font-sans-serif);--font-sub-title: var(--font-source-code-pro);--apple-webkit-opacity: 1;--primary-bg-color: ;--animation-transition-duration: 0.25s;--animation-transition: ease;--max-width-device: 561px;--nav-bar-height: 50px;--nav-bar-top: 0px;--slidingSpeed: 0.3s;--nav-shadow-colour: rgb(174, 174, 178, var(--apple-webkit-opacity, 1));--nav-min-width: 430}body{white-space:nowrap;padding:0;margin:0 auto;width:100%;font-family:var(--font-organic-plant);font-weight:400;line-height:20px;font-size:13px;-webkit-font-smoothing:antialiased;-webkit-touch-callout:none;color:rgb(142, 142, 147, var(--apple-webkit-opacity, 1));padding-bottom:1rem;display:flex;min-height:100vh;flex-wrap:nowrap;flex-direction:column;background-color:#eee;background-size:10em;background-image:url("./bg-main.png");background-repeat:repeat}*:focus{outline:none}body>nav#main-nav{width:100vw;max-width:var(--max-width-device);min-width:var(--nav-min-width);height:var(--nav-bar-height);max-height:50px;box-shadow:0px 3px 5px var(--nav-shadow-colour);z-index:999;margin:1.6em auto 0 auto;border-radius:8px;border-color:#c7c7cc;border-width:1px;border-style:solid;overflow:hidden;display:inline-flex;transition:all ease-in-out 190ms}body>nav#main-nav div{border-radius:0}body>nav#main-nav>div:first-child{width:70%;height:100%;background-color:#f2f2f7}body>nav#main-nav>div:first-child>div#burger-menu-btn{width:3.1rem;height:100%;display:flex;flex-direction:column;place-content:center center;align-items:center;cursor:pointer;box-sizing:border-box;margin:0;padding:0;padding-left:7px;gap:1%}body>nav#main-nav>div:first-child>div#burger-menu-btn>span{width:70%;height:8%;background-color:#48484a;margin:2px}body>nav#main-nav>div:first-child>div#back-btn{display:none;position:absolute;left:calc(50px + 4% + 5px);height:60%;width:50px;border-left:1px solid #c7c7cc;top:50%;transform:translate(0%, -50%);display:none}body>nav#main-nav>div:first-child>div#back-btn>span{text-align:center;height:75%;width:100%;display:block;padding:0;margin-top:50%;transform:translate(5%, -75%);color:#363638;font-weight:700;font-size:1.1rem}body>nav#main-nav>div#page-title{background-color:#48484a;overflow:hidden;box-sizing:border-box;width:30%;height:100%;margin-right:0;right:0;margin-left:0;left:0;display:flex;place-content:center center;align-items:center;border-left:2px groove #8e8e93}body>nav#main-nav>div#page-title>a{font-size:1.7rem;color:#d8d8dc;letter-spacing:0px;font-family:"SF Pro Text";font-weight:700;font-style:normal;transition:all ease-in-out 190ms}body>nav#main-nav>div#page-title>a::before{content:"xCreatIOn";transition:all ease-in-out 190ms}@media(max-width: 560px){body>nav#main-nav{margin:0 auto .6em auto;border-radius:0 0 15px 15px;border-width:0 0 1px 0}body>nav#main-nav>div:first-child{width:80%}body>nav#main-nav>div#page-title{width:20%}body>nav#main-nav>div#page-title>a{font-size:2rem}body>nav#main-nav>div#page-title>a::before{content:"xIO"}}body #page-title{text-align:center}body #page-title>h4{background-color:inherit;width:-moz-fit-content;width:fit-content;z-index:999;margin:28px auto 10px auto;border:1px solid #c7c7cc;padding:6px 8px 6px 8px;border-radius:9px 5px 8px 4px;color:#363638}body>div#app{box-sizing:border-box;padding:.5rem 1rem;width:100%;max-width:767px !important;margin:0 auto;background-color:rgba(0,0,0,0);display:inline-grid;grid-gap:4px;grid-template-columns:repeat(40, 1fr);grid-auto-rows:10px}body>div#app>#title-container,body>div#app>#ta-container-input,body>div#app>#ta-container-output,body>div#app>#control-panel-container{width:auto;height:auto;position:static}body>div#app>#title-container{grid-area:3/8/7/34}body>div#app>#ta-container-input{grid-area:7/2/span 18/20}body>div#app>#ta-container-output{grid-area:7/21/span 18/40}body>div#app>#control-panel-container{grid-area:27/9/span 6/31}@media only screen and (width <= 560px){body>div#app{grid-gap:4px;grid-template-columns:repeat(19, 1fr);grid-auto-rows:10px}body>div#app>#title-container{grid-area:2/1/5/20}body>div#app>#ta-container-input{grid-area:6/2/span 16/19}body>div#app>#control-panel-container{grid-area:23/1/span 6/20}body>div#app>#ta-container-output{grid-area:30/2/span 16/19}}body>div#main-foot-tagline{text-align:right;margin-right:5%;font-weight:800}.title-container>p,.title-container>span,.title-container>h3>a,.title-container>h3,.title-container{padding:0;margin:0;border:none;outline:none;width:100%;height:100%;display:block}.title-container{text-align:center;min-width:22rem;max-width:100vw !important}.title-container>h3{border-bottom:1px solid rgb(99, 99, 102, var(--apple-webkit-opacity, 1));margin-bottom:0;overflow:hidden;height:auto}.title-container>h3>a{font-family:var(--font-organic-plant);font-size:1.5em;font-style:italic;text-decoration:none;font-weight:700;letter-spacing:.2rem;color:rgb(58, 58, 60, var(--apple-webkit-opacity, 1))}.title-container>p,.title-container>span{width:fit-content;display:inline-block;font-family:var(--font-sub-title);font-weight:500;color:rgb(58, 58, 60, var(--apple-webkit-opacity, 1))}.title-container>p{white-space:nowrap;margin:0 1rem;font-size:.8rem}.title-container>span{font-size:1.2rem;color:rgb(99, 99, 102, var(--apple-webkit-opacity, 1))}.container#control-panel-container>button#convert,.container#control-panel-container>label.toggle-btn>span,.container#control-panel-container>label.toggle-btn,.container>#ta-input,.container>#ta-output,.container{padding:0;margin:0;border:none;outline:none;width:100%;height:100%;display:block}.container#control-panel-container>button#convert,.container#control-panel-container>label.toggle-btn>span{font-size:.85rem;font-weight:500;line-height:1.2rem;text-align:center;color:rgb(142, 142, 147, var(--apple-webkit-opacity, 1));font-family:var(--font-organic-plant)}.container#control-panel-container>button#convert,.container#control-panel-container>label.toggle-btn{background-color:var(--cpanel-button-bg);transition:background-color var(--animation-transition) var(--animation-transition-duration),color var(--animation-transition) var(--animation-transition-duration)}.container#control-panel-container>button#convert:hover,.container#control-panel-container>label.toggle-btn:hover{--cpanel-button-bg: rgb(229, 229, 234, var(--apple-webkit-opacity, 1))}.container{--input-border-color: rgb(199, 199, 204, var(--apple-webkit-opacity, 1));--textarea-bg-color: textarea-bg-color;--cpanel-button-radius: 14px;--cpanel-button-width: 33.333%;--cpanel-button-bg: rgb(242, 242, 247, var(--apple-webkit-opacity, 1))}.container>#ta-input,.container>#ta-output{border:1px solid var(--input-border-color);padding:.5em;resize:none;font-style:bold;font-family:var(--font-organic-plant);color:rgb(99, 99, 102, var(--apple-webkit-opacity, 1));font-weight:400;font-size:1.4em;border-radius:14px;line-height:1.6rem;letter-spacing:1px;background-color:rgb(242, 242, 247, var(--apple-webkit-opacity, 1));transition:border ease-in-out .25s}.container>#ta-input:focus,.container>#ta-output:focus{--input-border-color: rgb(64, 156, 255, var(--apple-webkit-opacity, 1))}.container#control-panel-container{font-size:0;letter-spacing:0;line-height:0}.container#control-panel-container>button#convert,.container#control-panel-container>label.toggle-btn>span{box-sizing:border-box}.container#control-panel-container>label.toggle-btn{width:var(--cpanel-button-width);display:inline-block;height:45%;cursor:pointer;border:1px solid rgb(199, 199, 204, var(--apple-webkit-opacity, 1));white-space:nowrap;overflow:hidden}.container#control-panel-container>label.toggle-btn:hover{--cpanel-button-bg: rgb(229, 229, 234, var(--apple-webkit-opacity, 1))}.container#control-panel-container>label.toggle-btn:first-of-type{border-top-left-radius:var(--cpanel-button-radius)}.container#control-panel-container>label.toggle-btn:last-of-type{border-top-right-radius:var(--cpanel-button-radius)}.container#control-panel-container>label.toggle-btn:nth-child(2):not(:last-of-type,:first-of-type){border-left:0;border-right:0}.container#control-panel-container>label.toggle-btn::before,.container#control-panel-container>label.toggle-btn::after{display:none}.container#control-panel-container>label.toggle-btn>span{box-sizing:border-box;position:relative;padding:.45rem;transition:transform var(--animation-transition) var(--animation-transition-duration)}.container#control-panel-container>label.toggle-btn>input[type=checkbox]{position:absolute;z-index:9999;opacity:0}.container#control-panel-container>label.toggle-btn>input[type=checkbox]:checked~span{transform:translateY(-100%)}.container#control-panel-container>button#convert{height:55%;width:calc(var(--cpanel-button-width)*3);border-radius:0 0 var(--cpanel-button-radius) var(--cpanel-button-radius);border:1px solid rgb(199, 199, 204, var(--apple-webkit-opacity, 1));border-top:none;font-weight:600;letter-spacing:2px}.container#control-panel-container>button#convert:active{color:rgb(174, 174, 178, var(--apple-webkit-opacity, 1));font-size:.8rem}.modal.backdrop{position:fixed;overflow:hidden;width:100vw;height:100vh;top:50%;left:50%;transform:translate(-50%, -50%);margin:0;padding:0;border:none;outline:none;background-color:rgba(24,24,26,.8);z-index:9999}.modal.hidden{display:none}.modal.modal-active{position:absolute;border:1px solid rgb(209, 209, 214, var(--apple-webkit-opacity, 1));width:20rem;top:50%;left:50%;transform:translate(-50%, -50%);background-color:#fafafa;border-radius:14px;z-index:99999;box-shadow:0px 2px 6px #e0e0ff}.modal.modal-active>div{box-sizing:border-box;padding:1em;width:100%;height:80%}.modal.modal-active>div>h4{font-size:2.4em;padding:.4em;margin:0;text-align:center;color:#9e9e9e;border-bottom:1px solid #aeaea2;white-space:normal;height:14%}.modal.modal-active>div>p{white-space:normal;color:#8a8a8a;font-size:1.4em;width:100%;height:86%;overflow-y:auto;margin:.8rem 0 0 0;padding-bottom:.4em;border:none}.modal.modal-active>div:last-child{border:none;width:100%;height:5em;box-sizing:border-box;display:inline-block}.modal.modal-active>div:last-child>button{height:100%;width:100%;margin:none;padding:0;outline:none;background-color:rgba(0,0,0,0);box-shadow:0px 0px 5px rgba(224,224,240,.8);font-size:1.2rem;font-weight:700;color:#9e9e9e;letter-spacing:2px;border-color:rgba(0,0,0,0);border-bottom-color:rgb(209, 209, 214, var(--apple-webkit-opacity, 1));transition:transform 50ms linear;border-style:solid;border-width:1px}.modal.modal-active>div:last-child>button:first-child{border-right-color:rgb(209, 209, 214, var(--apple-webkit-opacity, 1))}.modal.modal-active>div:last-child>button:last-child{border-left-color:rgb(209, 209, 214, var(--apple-webkit-opacity, 1))}.modal.modal-active>div:last-child>button:active{transform:translateY(0.1rem);border-bottom-color:rgba(0,0,0,0);border-top-color:rgb(209, 209, 214, var(--apple-webkit-opacity, 1))}.modal.modal-active>div.button-count-2:last-child>button{width:50%;margin:auto}.modal.modal-active>div.button-count-3:last-child>button{width:33.3333333333%;margin:auto}