body {
	  font-family: 'Segoe UI', Tahoma, sans-serif;
      background: #f8f9fa;
      margin: 0;
      line-height: 1.6;
	  -webkit-tap-highlight-color: transparent; 
	  -webkit-focus-ring-color: transparent;  
	  outline: none;
    }
	.bangla-text {
	  font-family: 'Tiro Bangla', serif !important;
	}

    h1 {
      text-align: center;
      font-size: 1.8em;
      color: #333;
	  user-select: none;
    }

    .tree ul {
      list-style-type: none;
      margin: 0;
      padding: 0 0 0 20px;
      border-left: 1px dashed #bbb;
    }

    .tree li {
      <!-- margin: 6px 0; -->
      position: relative;
      word-wrap: break-word;
    }

    .tree li::before {
      content: "";
      position: absolute;
      top: 20px;
      left: -12px;
      width: 10px;
      height: 1px;
      background: #bbb;
    }
	@media screen and (min-width: 768px) {
	  .tree {
		margin-left: 100px; /* or any value you prefer */
	  }
	}

	.tree > ul > li::before {
	  top: 20px;
	}
	.tree ul ul li::before {
	  top: 12px;
	}

    .folder-label {
      font-weight: 600;
      font-size: 1rem;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      padding: 5px 0;
      color: #2a2a2a;
    }

    .toggle {
      font-weight: bold;
      font-size: 1.1em;
      width: 20px;
      user-select: none;
      color: #007BFF;
	  vertical-align: middle;
    }

    .file a {
      display: inline-block;
      text-decoration: none;
      color: #444;
      padding: 3px 0 3px 22px;
      transition: all 0.2s ease;
    }
	

    .file a:hover {
      color: #007BFF;
    }

    .hidden {
      display: none;
    }

    @media screen and (max-width: 600px) {
      body {
        padding: 15px 10px;
      }

      .folder-label {
        font-size: 0.95rem;
		display: inline-flex;
      }

      .file a {
        font-size: 0.9rem;
        padding-left: 20px;
      }
    }

	.home-link {
		text-decoration: none;
		color: #111;
		font-weight: 600;
	}

	.home-link:hover {
		color: #007BFF;
	}