@import"https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@100..700&family=JetBrains+Mono:wght@100..800&family=Mona+Sans:ital,wght@0,200..900;1,200..900&display=swap";*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}html{margin:0;padding:0;scrollbar-width:auto;scrollbar-color:#303f5f #282828}body{line-height:1.5;-webkit-font-smoothing:antialiased}::-webkit-scrollbar{width:12px}::-webkit-scrollbar-track{background:#282828}::-webkit-scrollbar-thumb{background-color:#1c273d;border-radius:20px;border:3px solid #282828}::-webkit-scrollbar-thumb:hover{background-color:#303f5f}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}p{text-wrap:pretty}h1,h2,h3,h4,h5,h6{text-wrap:balance}a{text-decoration:none;font:inherit;font-size:11px;text-transform:uppercase;color:inherit;cursor:pointer}a:hover{color:#3ea8f4}h1{font-weight:700;color:#fff;font-size:32px;letter-spacing:2px;text-transform:uppercase;line-height:1}h2{font-weight:300;font-size:14px;font-family:"JetBrains Mono",monospace}h3{font-weight:400;font-size:12px;color:#a4abb5}h3::before{content:"//";margin-right:5px}body{background-color:#030407;font-family:"IBM Plex Sans",sans-serif;font-optical-sizing:auto;font-size:12px;color:#8190a7;overflow-x:hidden}#root{display:flex;flex-direction:column;width:100%;min-height:100vh;overflow-x:hidden}#screen{display:flex;flex-direction:column;min-height:100vh;width:100%;overflow:hidden}.header-section{display:flex;align-items:center;gap:20px;padding:12px 20px 12px 20px;background-color:#090e1a;border-bottom:1px solid #232934}.header-section a.logo{font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:2px;color:#fff}.tool-configs{display:flex;align-items:flex-start;gap:30px}.tool-configs .tool-configs-group{display:flex;align-items:flex-start;gap:30px}.tool-configs .tool-configs-group .tool-configs-item{display:flex;flex-direction:column;gap:7px}.tool-configs .tool-configs-group .tool-configs-item label{font-family:"JetBrains Mono",monospace;font-weight:300;font-size:11px}.tool-configs .tool-configs-group .tool-configs-item select,.tool-configs .tool-configs-group .tool-configs-item input{font-family:"JetBrains Mono",monospace;background-color:#090e1a;border:1px solid #232934;color:#fff;font-weight:300;padding:4px 20px 4px 10px;border-radius:4px;font-size:12px;outline:none;max-width:183px}.tool-configs .tool-configs-group .tool-configs-item .background-tiles{display:flex;gap:5px;align-items:center}.tool-configs .tool-configs-group .tool-configs-item .background-tiles .background-tile{width:22px;height:22px;border-radius:4px;cursor:pointer}.tool-configs .tool-configs-group .tool-configs-item .editor-layout-wrapper{display:flex;align-items:center;gap:5px}.tool-configs .tool-configs-group .tool-configs-item .editor-layout-wrapper .editor-layout{border:1px solid #232934;border-radius:4px;padding:4px;cursor:pointer}.tool-configs .tool-configs-group .tool-configs-item .editor-layout-wrapper .editor-layout svg{width:17px;height:17px}.tool-configs .tool-configs-group .tool-configs-item .editor-layout-wrapper .editor-layout.active-editor{border:1px solid #2d4653;background-color:#151f37}.index-section{flex:1;display:flex;flex-direction:column;gap:20px;align-items:center;justify-content:center;max-width:900px;margin:0 auto;padding:80px 20px 80px 20px}.index-section .link-box{display:flex;flex-direction:column;gap:20px;width:100%;margin:20px auto 0px auto;padding:20px;background-color:#090e1a;border:1px solid #232934;border-radius:5px}.index-section .link-box:hover{border:1px solid #3ebaf4}.index-section .link-box .link-box-header{font-weight:500;font-size:13px;text-transform:uppercase;color:#fff}.index-section .link-box .link-box-content{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;column-gap:40px;row-gap:15px}.tool-section{flex:1;display:grid;width:100%}.tool-section.tool-section-horizontal{grid-template-columns:1fr 1fr;grid-template-rows:1fr}.tool-section.tool-section-horizontal .tool-section-input{border-right:1px solid #232934;border-bottom:none}.tool-section.tool-section-horizontal .tool-section-preview .capture-area{min-width:50%}.tool-section.tool-section-vertical{grid-template-columns:1fr;grid-template-rows:auto 1fr}.tool-section.tool-section-vertical .tool-section-input{border-right:none;border-bottom:1px solid #232934}.tool-section.tool-section-vertical .tool-section-preview .capture-area{min-width:40%}.tool-section .tool-section-input{min-height:0;min-width:0}.tool-section .tool-section-input textarea{font-family:"JetBrains Mono",monospace;background-color:rgba(0,0,0,0);border:none;color:#adb7c6;padding:20px;font-size:13px;resize:none;outline:none;width:100%;height:100%;overflow:hidden}.tool-section .tool-section-preview{min-height:0;min-width:0;display:flex;align-items:center;justify-content:center;padding-top:30px;padding-bottom:30px}.tool-section .tool-section-preview .capture-area{display:flex;align-items:center;justify-content:center;max-width:90%;margin:0 auto;padding:30px;font-family:"JetBrains Mono",monospace;border-radius:10px}.tool-section .tool-section-preview .capture-area .macos-window{background-color:#1e1e1e;border-radius:10px;box-shadow:0 20px 50px rgba(0,0,0,.5);overflow:hidden;width:100%}.tool-section .tool-section-preview .capture-area .window-header{display:flex;align-items:center;gap:10px;height:34px;background-color:hsla(0,0%,100%,.05);padding:0 15px;border-bottom:1px solid hsla(0,0%,100%,.05)}.tool-section .tool-section-preview .capture-area .window-header .window-dots{display:flex;gap:7px}.tool-section .tool-section-preview .capture-area .window-header .dot{width:9px;height:9px;border-radius:50%}.tool-section .tool-section-preview .capture-area .window-header .dot.red{background-color:#ff5f56}.tool-section .tool-section-preview .capture-area .window-header .dot.yellow{background-color:#ffbd2e}.tool-section .tool-section-preview .capture-area .window-header .dot.green{background-color:#27c93f}.tool-section .tool-section-preview .capture-area .window-header .window-title-tab{flex:1;font-size:11px;color:#95a0b1}.tool-section .tool-section-preview .capture-area .window-header-dark{background-color:rgba(0,0,0,.5) !important}.tool-section .tool-section-preview .capture-area .window-header-dark .window-title-tab{color:#c9c8c8;text-align:center}.footer-section{display:flex;flex-direction:column;gap:15px;padding:12px 20px 12px 20px;background-color:#090e1a;border-top:1px solid #232934}.footer-section h1{margin-top:15px;font-size:21px}.footer-section .footer-panels{display:grid;grid-template-columns:1fr 1fr;gap:30px;padding-top:10px;padding-bottom:20px;border-bottom:1px solid #232934}.footer-section .footer-panels .footer-panel{display:flex;flex-direction:column;gap:10px}.footer-section .footer-panels .footer-panel .footer-panel-header{font-weight:500;font-size:12px;color:#fff}.footer-section .footer-panels .footer-panel .footer-panel-text{white-space:pre-wrap;overflow-wrap:break-word}.footer-section .footer-credits{flex:1;display:flex;align-items:center;justify-content:space-between}.error-page{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:25px;overflow:hidden;text-align:center}.error-page h1{font-size:100px}.error-page .error-page-link{color:#ffae6c}.spacer{flex:1}.active-link{color:#3ebaf4}.iconed-link{display:flex;align-items:center;gap:10px}.iconed-link i,.iconed-link img{border-radius:2px;padding:4px;background-color:hsla(0,0%,48.2%,.1);border:1px solid hsla(0,0%,100%,.05)}.dl-btn{display:flex;align-items:center;justify-content:center;padding:6px 12px 6px 12px;background-color:#2079ba;color:#fff;border-radius:4px;text-transform:uppercase;font-size:10px;cursor:pointer}.dl-btn:hover{background-color:#1e71ab}.dl-btn-disabled{background-color:#403c3c !important}.bg-gradient-1{background:linear-gradient(135deg, #667eea 0%, #764ba2 100%)}.bg-gradient-2{background:linear-gradient(135deg, #ff9a9e 0%, #fecfef 100%)}.bg-gradient-3{background:linear-gradient(135deg, #a1c4fd 0%, #c2e9fb 100%)}.bg-gradient-4{background:linear-gradient(135deg, #f093fb 0%, #f5576c 100%)}.bg-gradient-5{background:linear-gradient(135deg, #5ee7df 0%, #b490ca 100%)}.hljs{line-height:1.6}pre code.hljs{padding:10px 15px 10px 15px !important}.hljs-ln-numbers{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;text-align:right;color:#5c6370;vertical-align:top;padding-right:15px !important;border-right:1px solid hsla(0,0%,100%,.1);word-break:keep-all}.hljs-ln-code{padding-left:15px !important;white-space:pre}.error-modal{display:none;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;background-color:rgba(0,0,0,.5)}.error-modal .error-modal-content{display:flex;flex-direction:column;gap:15px;min-width:300px;min-height:300px;margin:auto;padding:20px;text-align:center;border-radius:5px;font-family:"JetBrains Mono",monospace;background-color:#090e1a;border:1px solid #232934}.error-modal .error-modal-close{background:#ff4d4d;color:#fff;border:none;padding:8px 16px;border-radius:4px;cursor:pointer}.window-body{padding:10px 20px 10px 20px;white-space:pre-wrap;word-break:break-all;overflow-wrap:break-word;display:block}.markdown-body{font-family:"Mona Sans",sans-serif;font-size:15px;line-height:1.6;word-wrap:break-word;color:#24292e;background-color:#fff;padding:2rem}.markdown-body>*:first-child{margin-top:0 !important}.markdown-body>*:last-child{margin-bottom:0 !important}.markdown-body h1,.markdown-body h2,.markdown-body h3,.markdown-body h4,.markdown-body h5,.markdown-body h6{margin-top:24px;margin-bottom:16px;font-weight:600;line-height:1.25;letter-spacing:0;color:#1a1a1a}.markdown-body h1 a,.markdown-body h2 a,.markdown-body h3 a,.markdown-body h4 a,.markdown-body h5 a,.markdown-body h6 a{font-size:inherit}.markdown-body h1:before,.markdown-body h2:before,.markdown-body h3:before,.markdown-body h4:before,.markdown-body h5:before,.markdown-body h6:before{display:none}.markdown-body h1{font-size:26px;font-weight:700;padding-bottom:10px;border-bottom:1px dashed #c4c6c8}.markdown-body h2{font-size:24px;padding-top:5px;padding-bottom:10px;border-bottom:1px dashed #c4c6c8}.markdown-body h3{font-size:18px}.markdown-body p{margin-bottom:16px}.markdown-body a{display:inline-block;color:#0366d6;text-decoration:none;font-weight:400;text-transform:none;font-size:inherit}.markdown-body strong{font-weight:600}.markdown-body blockquote{padding:0 1em;color:#6a737d;border-left:.25em solid #dfe2e5;margin:0 0 16px 0}.markdown-body ul,.markdown-body ol{padding-left:2em;margin-bottom:16px}.markdown-body ul li,.markdown-body ol li{margin-top:.25em}.markdown-body code{padding:.2em .4em;margin:0;font-size:85%;background-color:rgba(27,31,35,.05);border-radius:6px;font-family:"JetBrains Mono",monospace;font-size:13px}.markdown-body pre{padding:16px;overflow:auto;font-size:13px;line-height:1.45;background-color:#f6f8fa;border-radius:8px;margin-bottom:16px;border:1px solid #e1e4e8}.markdown-body pre code{display:inline;padding:0;margin:0;background-color:rgba(0,0,0,0);border:0}.markdown-body table{width:100%;margin-bottom:16px;border-collapse:collapse;overflow-wrap:anywhere}.markdown-body table tr{background-color:#fff;border-top:1px solid #c6cbd1}.markdown-body table:nth-child(2n){background-color:#f6f8fa}.markdown-body table th,.markdown-body table td{padding:6px 13px;border:1px solid #dfe2e5}.markdown-body table th{text-align:left;font-weight:600;background-color:#f6f8fa}.markdown-body hr{height:0px;padding:0;margin:24px 0;background-color:rgba(0,0,0,0);border:none;border-bottom:1px dashed #c4c6c8}.markdown-body img{max-width:100%;box-sizing:content-box;background-color:#fff}.grid-body table{width:100%;border-collapse:collapse;overflow-wrap:anywhere}.grid-body table tr{background-color:#fff;border-top:1px solid #c6cbd1}.grid-body table:nth-child(2n){background-color:#f6f8fa}.grid-body table th,.grid-body table td{padding:6px 13px;border:1px solid #dfe2e5}.grid-body table th{color:#24292e;text-align:left;font-weight:600;background-color:#f6f8fa}@media(max-width: 1200px){.tool-configs{flex-direction:column;gap:20px}}@media(max-width: 1024px){.index-section .link-box .link-box-content{grid-template-columns:1fr 1fr 1fr}.tool-configs .tool-configs-group .editor-layout-tool{display:none}.tool-section{grid-template-columns:1fr !important;grid-template-rows:auto 1fr !important}.tool-section .tool-section-input{border-right:none !important;border-bottom:1px solid #232934 !important}.tool-section .tool-section-preview .capture-area{min-width:40% !important}}@media(max-width: 767px){h1,h2{text-align:center}.index-section .link-box .link-box-content{grid-template-columns:1fr 1fr}.footer-section h1,.footer-section h2{text-align:left}.footer-section .footer-credits{flex-direction:column;gap:10px}.footer-section .footer-panels{grid-template-columns:1fr}}@media(max-width: 600px){.header-section{flex-direction:column;gap:10px}.tool-configs{align-items:center;gap:15px;padding-top:20px;padding-bottom:20px}.tool-configs .tool-configs-group{flex-direction:column;gap:15px;width:300px}.tool-configs .tool-configs-group select,.tool-configs .tool-configs-group input{max-width:300px !important;width:300px}.index-section .link-box .link-box-content{grid-template-columns:1fr}.tool-section .tool-section-input{display:flex;justify-content:center}.tool-section .tool-section-input textarea{width:300px;padding:30px 0px 30px 0px}.tool-section .tool-section-preview{width:300px;margin:0 auto}.tool-section .tool-section-preview .capture-area{min-width:auto;max-width:auto;width:100%}.footer-section h1,.footer-section h2{width:300px;margin:10px auto 10px auto}.footer-section .footer-panels .footer-panel{width:300px;margin:0 auto}}