html,body{margin:0;width:100%;height:100%}:root{--color-background: #262335;--color-text: #e0e0e0}*,*:before,*:after{box-sizing:border-box;margin:0;font-weight:400;padding:0}ul{list-style:none}body{min-height:100vh;color:var(--color-text);background:var(--color-background);line-height:1.6;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*::-webkit-scrollbar{width:8px}*::-webkit-scrollbar-thumb{background:#949494;border-radius:10px}:root{--color-main-modal-color: #6800df}.modal-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility 0s linear .2s}.modal-overlay.active{opacity:1;visibility:visible;transition:opacity .2s ease}.modal{background-color:#111827;padding:30px;border-radius:8px;box-shadow:0 4px 20px #0003;border:1px solid #494949;max-width:1000px;width:90%;transform:scale(.8);opacity:1;transition:all .2s ease}.modal-overlay.active .modal{transform:scale(1);opacity:1}.modal-header{display:flex;justify-content:space-between;align-items:start;margin-bottom:20px;h2{font-size:32px;font-weight:600}p{font-size:19px;color:#9ca3af}.btn-close{background:none;border:none;cursor:pointer;color:#999;transition:color .2s;&:hover{color:#fff}}}.search{background-color:#1f2937;display:flex;align-items:center;border-radius:8px;overflow:hidden;color:#999;margin-bottom:20px;transition:box-shadow .2s ease;svg{width:28px;margin:0 6px 0 12px;height:100%}input{width:100%;font-size:21px;padding:13px 0;border:none;outline:none;background:none;color:#999}&:has(input:focus){box-shadow:0 0 0 2px #111827,0 0 0 4px var(--color-main-modal-color)}}.modal-body{margin-bottom:20px;display:grid;grid-template-columns:1fr 1fr;gap:20px;max-height:550px;overflow-y:auto;.card{padding:15px;border:1px solid #494949;border-radius:8px;transition:all .3s ease;user-select:none;cursor:pointer;&:hover{border:1px solid var(--color-main-modal-color);background-color:#6800df08}h4{font-size:22px;font-weight:600}p{font-size:18px;color:#9ca3af;margin-bottom:10px}img{width:100%;height:100%;object-fit:cover}}}.modal-theme{padding:10px 10px 10px 0}.modal-footer{display:flex;justify-content:space-between;gap:10px;.btn{padding:10px 17px;border-radius:7px;cursor:pointer;color:#fff;transition:background-color .2s;font-size:16px;font-weight:500}.btn-primary{background-color:var(--color-main-modal-color);border:none;&:hover{background-color:#380092}}.btn-secondary{background-color:#111827;border:1px solid #999;margin-right:10px;&:hover{background-color:#e5e5e510}}}.card-theme.selected{border:1px solid var(--color-main-modal-color);transition:all .3s ease}.modal-settings{display:flex;flex-direction:column;gap:20px;margin-bottom:20px;.range-options{display:flex;gap:20px;.card-settings{width:100%;cursor:default;user-select:none;padding:15px;border:1px solid #494949;border-radius:8px;p{font-size:20px;font-weight:600;color:#c7ccd3;padding-bottom:2px}input{width:100%;cursor:pointer;border-radius:20px}}}.card-select{display:flex;justify-content:space-between;border:1px solid #494949;border-radius:8px;user-select:none;padding:15px;align-items:center;p{font-size:20px;font-weight:600;color:#c7ccd3}.switch{font-size:16px;position:relative;display:inline-block;width:3.5em;height:2em;input{opacity:0;width:0;height:0;&:checked+.slider{background-color:var(--color-main-modal-color)}&:checked+.slider:before{transform:translate(1.5em)}}.slider{position:absolute;cursor:pointer;inset:0;background-color:#b6b6b6;transition:.4s;border-radius:10px;&:before{position:absolute;content:"";height:1.4em;width:1.4em;border-radius:8px;left:.3em;bottom:.3em;transform:rotate(270deg);background-color:#fff;transition:.4s}}}}}body{height:100vh;display:flex;flex-direction:column;background-color:var(--color-background);color:var(--color-text)}.loading-screen{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#262335;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:9999;transition:opacity .3s ease;.loading-spinner{border:8px solid rgba(255,255,255,.3);border-radius:50%;border-top:5px solid #72f1b8;width:60px;height:60px;animation:spin 1s linear infinite}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.header-main{height:30px;display:flex;justify-content:space-between;user-select:none;-webkit-app-region:drag;.logo{height:100%;padding:5px;display:flex;align-items:center;img{height:100%}h1{font-size:16px;color:var(--color-text);margin-left:5px;font-weight:500;user-select:none}}.buttons{display:flex;align-items:center;justify-content:center;-webkit-app-region:no-drag;.button{width:50px;height:100%;display:flex;align-items:center;justify-content:center;color:#949494;position:relative;transition:all .1s ease-in-out;svg{width:19px;transition:all .1s ease-in-out}&:hover{background-color:#6464644d}}}}.container{height:100%;overflow:hidden;width:100%;display:flex;border:1px solid #646464;border-left:transparent;border-right:transparent;font-size:20px;.utils{width:50px;border-right:1px solid #646464;height:100%;display:flex;flex-direction:column;justify-content:space-between;.icon{width:100%;height:50px;cursor:pointer;display:flex;align-items:center;color:#949494;position:relative;transition:all .2s ease-in-out;svg{width:100%;transition:all .2s ease-in-out}span{position:absolute;left:100%;border:1px solid #646464;z-index:1;font-size:14px;color:#e4e4e4;background-color:#16171d;border-radius:6px;padding:4px 8px;opacity:0;transition:all .2s ease-in-out;pointer-events:none;box-shadow:0 0 10px #0003;white-space:nowrap;font-weight:600}&:hover{background-color:#646464;span{opacity:1}}}}.split{display:flex;flex-direction:row;width:100%;.gutter.gutter-horizontal{cursor:col-resize;position:relative;z-index:10;background-color:var(--color-background)}.gutter.gutter-horizontal:after{content:"";position:absolute;top:0;left:50%;transform:translate(-50%);width:1px;height:100%;background-color:#646464;pointer-events:none}}#console{background-color:var(--color-background);width:100%;height:100%;display:flex;flex-direction:column}}