:root{--text:#222;--text-light:#666;--text-med:#444;--bg:#ccc;--bright:#eee;--font:"Inter", Verdana, Geneva, Tahoma, sans-serif;--mono:"IBM Plex Mono", monospace;--hover-bg:#fff8;--link-color:oklch(61.54% .168 260.44);font-family:var(--font);color:var(--text);background:var(--bright);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:18px}body{margin:0}h2{margin:0;box-sizing:border-box;margin-inline:1rem;padding:0;font-size:1.5rem}#app{box-sizing:border-box;width:100svw;height:100svh;padding-top:.5rem;overflow:hidden}div.playground{flex-direction:row;display:flex}.start,.middle,.end{box-sizing:border-box;flex-grow:1;flex-basis:33%;height:calc(100svh - 3.5rem);padding:1rem;overflow:scroll}.end{flex-grow:0;max-width:33%}.end p.decrypted{overflow-wrap:break-word}.start,.middle{border-right:1px solid gray}@media screen and (width<=700px){.middle{display:none}}table.matrix,table.conversion-table{border-collapse:collapse}table.matrix td,table.conversion-table td{text-align:center;border:1px solid #000;width:2ch;padding:.25rem}table.matrix td{width:calc(max(2ch,2em) + .25rem);height:calc(max(2ch,2em) + .25rem);padding:.25rem}textarea{font-family:var(--font);resize:none;box-sizing:border-box;width:100%;font-family:var(--font);color:var(--text);border:none;padding:.5rem}input,button{font-family:var(--font);color:var(--text);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:20px}input{border-radius:.25rem;width:15ch;min-width:1ch;padding:.25rem;display:inline}input.text-key{text-overflow:ellipsis}input,textarea,select{box-sizing:border-box;border:1px solid #0000;border-radius:.25rem;font-size:1rem}select{padding:.25rem}textarea{field-sizing:content}input:hover,textarea:hover{border:1px solid var(--text-light)}.arrow-container{flex-direction:row;justify-content:center;font-size:2rem;font-weight:100;display:flex}.inps{margin-bottom:1rem}.mat-status i{position:absolute}.status-chex{width:1rem;height:1rem;display:inline-block;position:relative}.mat-status.bad .status-text{color:#822}.status-chex i.fa-check,.status-chex i.fa-x{opacity:0;transition:transform .25s,opacity .25s;transform:rotate(90deg)}.status-chex i.fa-check{transform:rotate(-90deg)}.status-chex i.fa-x{color:#822}.status-chex i.fa-check{color:green}.mat-status.bad .status-chex i.fa-x,.mat-status.good .status-chex i.fa-check{opacity:1;transform:rotate(0)}.mat-status.good .status-text{color:green}div.mat-status{box-sizing:border-box;border:1px solid #000;border-radius:.25rem;margin-top:1rem;padding:1rem;transition:background .25s}div.mat-status.good{background:#90ee90}div.mat-status.bad{background:#faa}div.mat-status.good span.not-ok,div.mat-status.bad span.ok{display:none}.start label{flex-flow:wrap;align-items:center;gap:.5rem;display:flex}.start label input{flex-grow:1;width:10ch}textarea::placeholder{opacity:.4;font-style:italic}div.top{flex-direction:row;justify-content:space-between;align-items:center;display:flex}.top-buttons button i,.top-buttons a i,dialog button i{font-size:.75rem}.top-buttons button,.top-buttons a,dialog button{box-sizing:border-box;color:gray;background:#fff;border:2px solid gray;border-radius:.5rem;justify-content:center;align-items:center;width:1.5rem;height:1.5rem;display:flex;position:relative;top:0;box-shadow:0 .125rem #909090}:is(.top-buttons button,.top-buttons a,dialog button):hover{cursor:pointer;background:#ddd}:is(.top-buttons button,.top-buttons a,dialog button):active{top:.125rem;box-shadow:0 0 #909090}dialog button{width:2rem;height:2rem}dialog button i{font-size:1rem}.top-buttons{box-sizing:border-box;padding:.5rem;flex-direction:row;gap:.5rem;padding-inline-end:1rem;display:flex}body:not(.is-iframe) .top-buttons .new-window-button{display:none}dialog{box-sizing:border-box;background:#eee;border:2px solid gray;border-radius:1rem;max-width:min(100vw - 4rem,80ch);padding:1rem}dialog::backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}dialog ol{line-height:1.5rem}.info-bottom a{color:var(--text-light)}.info-bottom a:hover{color:var(--link-color)}.info-bottom{padding-bottom:4rem}footer{background:silver;border-top:1px solid gray;flex-direction:row;justify-content:space-between;align-items:center;height:2rem;padding:1rem;display:flex;position:absolute;bottom:0;left:0;right:0}footer a.github{font-size:1.5rem}body.is-iframe .info-bottom{display:none}