*{
    box-sizing:border-box;
  }
  
  body{
    margin:0;
    background:#0b0d14;
    color:#d6d6d6;
    font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,sans-serif;
    min-height:100vh;
  }
  
  .container{
    max-width:1100px;
    margin:auto;
    padding:28px;
  }
  
  /* HEADER */
  
  .header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:14px;
  }
  
  .logo{
    font-size:34px;
    font-weight:600;
    color:white;
    display:flex;
    align-items:center;
    gap:12px;
  }
  
  .logo .favicon{
    vertical-align:middle;
    border-radius:4px;
  }
  
  .nav{
    margin-top:4px;
    font-size:18px;
  }
  
  .nav a{
    color:#5fb3ff;
    text-decoration:none;
  }
  
  .right-links a{
    color:#5fb3ff;
    text-decoration:none;
    margin-left:14px;
  }
  
  .support{
    background:#2a2a33;
    padding:4px 8px;
    border-radius:6px;
  }
  
  .divider{
    height:4px;
    background:#7b6cff;
    border-radius:2px;
    margin:0 0 30px 0;
  }

  .textbutton {
    margin-right: 50px;
    font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    border: 4px solid #7b6cff;
    padding: 0px;
    padding-left: 45px;
    padding-right: 45px;
    border-top-right-radius: 15px;
    border-top-left-radius: 15px;
    border-bottom: none;
  }
  
  /* CONTENT */

  #dropOverlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.1);
    border: 2px dashed rgba(0, 0, 0, 0.2);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 1000;
    pointer-events: none;
    border-radius: 20px;
    border: 2px solid #7b6cff;
  }
  #dropOverlay.show {
    display: flex;
  }
  
  .settings{
    display:inline-block;
    background:#1b1e27;
    border:1px solid #3b3e4a;
    padding:10px 16px;
    border-radius:10px;
    margin-bottom:18px;
  }
  
  a{
    color:#5fb3ff;
    text-decoration:none;
    cursor:pointer;
  }
  
  a:hover{
    text-decoration:underline;
  }
  
  .text{
    margin-top:20px;
    line-height:1.6;
  }
  
  .upload{
    margin-top:22px;
  }
  
  .upload button{
    background:transparent;
    border:2px solid #7b6cff;
    color:white;
    padding:10px 18px;
    border-radius:8px;
    font-size:18px;
    cursor:pointer;
    transition:all 0.2s ease;
  }
  
  .upload button:hover{
    background:#7b6cff;
  }
  
  /* MODAL STYLES */
  
  .modal{
    display:none;
    position:fixed;
    z-index:1000;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background-color:rgba(0,0,0,0.8);
  }
  
  .modal-content{
    background-color:#1b1e27;
    margin:5% auto;
    padding:30px;
    border:1px solid #3b3e4a;
    border-radius:12px;
    width:90%;
    max-width:600px;
    max-height:80vh;
    overflow-y:auto;
    position:relative;
  }
  
  .close{
    color:#d6d6d6;
    float:right;
    font-size:28px;
    font-weight:bold;
    position:absolute;
    right:20px;
    top:15px;
    cursor:pointer;
  }
  
  .close:hover,
  .close:focus{
    color:#7b6cff;
  }
  
  .modal h2{
    color:white;
    margin-top:0;
    margin-bottom:20px;
    font-size:24px;
  }
  
  .modal-text{
    line-height:1.6;
    color:#d6d6d6;
  }
  
  /* UPLOADER POPUP STYLES */
  
  .sharex-download{
    text-align:center;
    margin:20px 0;
  }
  
  .download-btn{
    display:inline-block;
    background:#7b6cff;
    color:white;
    padding:12px 24px;
    border-radius:8px;
    text-decoration:none;
    font-size:16px;
    font-weight:600;
    transition:all 0.2s ease;
  }
  
  .download-btn:hover{
    background:#6b5ce6;
    text-decoration:none;
  }
  
  .setup-instructions{
    margin:25px 0;
  }
  
  .setup-instructions h3{
    color:white;
    margin-bottom:15px;
    font-size:18px;
  }
  
  .setup-instructions ol{
    padding-left:20px;
  }
  
  .setup-instructions li{
    margin-bottom:8px;
    line-height:1.5;
  }
  
  .setup-instructions code{
    background:#2a2a33;
    padding:2px 6px;
    border-radius:4px;
    font-family:monospace;
    color:#5fb3ff;
  }
  
  .config-preview{
    margin-top:25px;
  }
  
  .config-preview h3{
    color:white;
    margin-bottom:15px;
    font-size:18px;
  }
  
  .config-preview pre{
    background:#0b0d14;
    border:1px solid #3b3e4a;
    border-radius:6px;
    padding:15px;
    overflow-x:auto;
    margin:0;
  }
  
  .config-preview code{
    color:#d6d6d6;
    font-family:monospace;
    font-size:14px;
    line-height:1.4;
  }