/* ==== Downloader Page Header (isolated) ==== */
.dl-header{
  position:fixed; top:0; left:0; right:0;
  z-index:160;
  backdrop-filter:blur(14px);
  background:rgba(13,17,21,.78);
  border-bottom:1px solid #93909059;
  transition:.35s height,.25s background,.25s box-shadow;
}
.light .dl-header{background:rgba(255,255,255,.82);border-color:#d4dbe2;}
.dl-header[data-scrolled="yes"]{
  box-shadow:0 4px 20px -10px #000a;
  background:rgba(13,17,21,.88);
}
.light .dl-header[data-scrolled="yes"]{background:rgba(255,255,255,.92);}
.dl-header-inner{
  max-width:1180px;
  margin:0 auto;
  display:flex; align-items:center;
  gap:26px;
  padding:8px 20px;
  min-height:66px;
}
.dl-header[data-scrolled="yes"] .dl-header-inner{min-height:58px;}
.dl-logo img{
  display:block;
  width:42px; height:42px;
  border-radius:12px;
  object-fit:contain;
}

/* Desktop nav */
.dl-nav{margin-left:auto;}
.dl-nav ul{list-style:none; margin:0; padding:0;}
.dl-nav .dl-nav-root{display:flex; gap:4px; align-items:center;}
.dl-link{
  font:600 13.5px/1 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  background:transparent;
  color:var(--text-dim);
  border:1px solid transparent;
  padding:10px 14px;
  border-radius:10px;
  text-decoration:none;
  cursor:pointer;
  display:inline-flex; align-items:center;
  gap:6px;
  position:relative;
  transition:.18s background,.18s color;
}
.dl-link:focus-visible{outline:none; box-shadow:0 0 0 2px #ffffff55;}
.dl-link:hover,
.dl-link:focus{background:var(--card-alt);color:var(--text);}
.dl-cta{
  background:#141414;
  color:var(--accent-fg);
  border:none;
}
.dl-cta:hover{background:var(--accent-hover); color:#fff;}
/* Dropdown containers */
.dl-has-dd{position:relative;}
.dl-has-dd > button.dl-link:after{
  content:"";
  width:6px; height:6px;
  border:2px solid currentColor;
  border-top:none; border-left:none;
  transform:rotate(45deg);
  margin-left:2px;
  opacity:.65;
  transition:.2s transform;
}
.dl-has-dd.open > button.dl-link:after{transform:rotate(225deg);}
.dl-dd{
  position:absolute; top:100%; left:0;
  min-width:240px;
  display:flex; flex-direction:column;
  background:var(--card);
  border:1px solid #0006;
  border-radius:14px;
  padding:8px 6px 10px;
  opacity:0; visibility:hidden;
  transform:translateY(8px);
  pointer-events:none;
  transition:.22s opacity,.22s transform;
  box-shadow:0 16px 36px -14px #000d,0 4px 18px -8px #000c;
  z-index:10;
}
.light .dl-dd{border-color:#d0d8e1;}
.dl-has-dd.open > .dl-dd{
  opacity:1; visibility:visible; transform:translateY(0);
  pointer-events:auto;
}
.dl-dd-link{
  display:flex; gap:8px; align-items:center;
  padding:9px 14px;
  font-size:13px;
  border-radius:9px;
  color:var(--text-dim);
  text-decoration:none;
  transition:.16s background,.16s color;
}
.dl-dd-link:hover,
.dl-dd-link:focus{background:var(--card-alt);color:var(--text);outline:none;}
.dl-dd-wide{columns:1;}

/* Hamburger */
.dl-hamburger{
  display:none;
  width:46px; height:46px;
  align-items:center; justify-content:center;
  border:1px solid #27323c;
  background:var(--card-alt);
  border-radius:14px;
  cursor:pointer;
  position:relative;
  transition:.25s background;
}
.light .dl-hamburger{border-color:#ccd4dd;}
.dl-hamburger span{
  position:absolute;
  width:20px; height:2px;
  background:var(--text);
  border-radius:2px;
  transition:.35s;
}
.dl-hamburger span:nth-child(1){transform:translateY(-6px);}
.dl-hamburger span:nth-child(2){transform:translateY(0);}
.dl-hamburger span:nth-child(3){transform:translateY(6px);}
.dl-hamburger.active span:nth-child(1){transform:rotate(45deg);}
.dl-hamburger.active span:nth-child(2){opacity:0;}
.dl-hamburger.active span:nth-child(3){transform:rotate(-45deg);}

/* Theme btn adaptation */
.dl-theme-btn{
  font:600 12.5px/1 system-ui;
  background:var(--card-alt);
  border:1px solid #27323c;
  color:var(--text-dim);
  padding:8px 15px;
  border-radius:30px;
  cursor:pointer;
  transition:.18s background,.18s color;
}
.dl-theme-btn:hover{color:var(--text);background:#29323b;}
.light .dl-theme-btn{border-color:#cfd7e0;}
.light .dl-theme-btn:hover{background:#eef2f6;color:#1f2d37;}

/* Mobile Panel */
.dl-mobile-panel{
  position:fixed; inset:0;
  background:rgba(0,0,0,.55);
  backdrop-filter:blur(4px);
  display:none;
  z-index:300;
}
.dl-mobile-panel.open{display:block;}
.dl-mobile-sheet{
  position:absolute; top:0; left:0;
  width:84%; max-width:340px; height:100%;
  background:var(--bg-alt);
  border-right:1px solid #0007;
  padding:18px 18px 50px;
  overflow-y:auto;
  display:flex; flex-direction:column; gap:20px;
  animation:dlSlide .32s cubic-bezier(.4,.2,.2,1);
}
@keyframes dlSlide{0%{transform:translateX(-35px);opacity:0;}100%{transform:translateX(0);opacity:1;}}
.dl-mobile-head{display:flex; align-items:center; justify-content:space-between; gap:14px;}
.dl-mobile-logo img{width:42px;height:42px;display:block;border-radius:12px;}
.dl-mobile-close{
  background:#27323c;
  border:1px solid #36424d;
  color:var(--text-dim);
  border-radius:10px;
  font-size:13px;
  font-weight:600;
  padding:8px 14px;
  cursor:pointer;
}
.dl-mobile-close:hover{color:var(--text);}

.dl-mobile-root,
.dl-mobile-sub{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;}

.dl-mobile-link,
.dl-mobile-parent{
  background:var(--card);
  border:1px solid #27323c;
  color:var(--text-dim);
  text-decoration:none;
  font:600 14px/1.2 system-ui;
  padding:11px 14px;
  border-radius:12px;
  display:flex; align-items:center; justify-content:space-between;
  cursor:pointer;
  transition:.16s background,.16s color;
}
.dl-mobile-parent:after{
  content:"";
  width:8px; height:8px;
  border:2px solid currentColor;
  border-top:none; border-left:none;
  transform:rotate(45deg);
  transition:.3s transform;
  opacity:.7;
}
.dl-mobile-parent[aria-expanded="true"]:after{transform:rotate(225deg);}
.dl-mobile-link:hover,
.dl-mobile-parent:hover{background:var(--card-alt);color:var(--text);}

.dl-mobile-sub{
  margin:2px 0 8px 0;
  padding-left:10px;
  border-left:2px solid #27323c;
  display:none;
}
.dl-mobile-sub.open{display:flex;}
.dl-mobile-sub a{
  background:var(--card-alt);
  border:1px solid #27323c;
  font:500 13px/1.2 system-ui;
  padding:9px 12px;
  border-radius:10px;
  color:var(--text-dim);
  text-decoration:none;
  transition:.15s background,.15s color;
}
.dl-mobile-sub a:hover{background:#2a333d;color:var(--text);}
.dl-mobile-cta{
  background:var(--accent)!important;
  color:#fff!important;
  border-color:var(--accent)!important;
}
.dl-mobile-cta:hover{background:var(--accent-hover)!important;}

.dl-mobile-util{margin-top:auto;padding-top:10px;border-top:1px solid #27323c;display:flex;gap:10px;flex-wrap:wrap;}
.light .dl-mobile-sheet{border-color:#d4dce5;}
.light .dl-mobile-sub{border-color:#d4dce5;}

/* Active link */
.dl-link[aria-current="page"],
.dl-dd-link[aria-current="page"],
.dl-mobile-link[aria-current="page"]{
  background:var(--card-alt);
  color:var(--text);
}

/* Responsive */
@media (max-width:1000px){
  .dl-nav{display:none;}
  .dl-hamburger{display:inline-flex;}
  .dl-header-inner{gap:16px;}
}
body{padding-top:82px;}
@media (max-width:600px){ body{padding-top:76px;} }
/* ===== Downloader Header Mobile Alignment Fix ===== */
.dl-header-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  min-height:64px;
}

.dl-hamburger,
.dl-logo,
.dl-theme-btn {
  flex:0 0 auto;
}

/* Prevent image from stretching / baseline shift */
.dl-logo img {
  display:block;
  width:40px;
  height:40px;
  object-fit:contain;
}

/* Theme toggle ensure consistent sizing */
.dl-theme-btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 16px;
  font-size:13px;
  line-height:1;
  border-radius:26px;
  background:var(--card-alt);
  border:1px solid #27323c;
  color:var(--text-dim);
  cursor:pointer;
  transition:.18s background,.18s color;
}
.light .dl-theme-btn { border-color:#cfd7e0; }
.dl-theme-btn:hover { background:#2a333d; color:var(--text); }
.light .dl-theme-btn:hover { background:#eef2f6; color:#1f2d37; }

/* Hamburger button sizing */
.dl-hamburger {
  width:44px;
  height:44px;
  border-radius:14px;
  background:#232d3700;
  border:1px solid #27323c00;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:5px;
  cursor:pointer;
  transition:.18s background;
}
.light .dl-hamburger { border-color:#cfd7e0; }
.dl-hamburger span {
  display:block;
  width:20px;
  height:2px;
  background:var(--text);
  border-radius:2px;
  transition:.35s;
}
.dl-hamburger.active span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.dl-hamburger.active span:nth-child(2){ opacity:0; }
.dl-hamburger.active span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* When you want mathematical centering (optional) */
@media (max-width: 820px){
  .dl-header-inner.equal-mobile {
    justify-content:space-between;
  }
  .dl-header-inner.equal-mobile .dl-hamburger,
  .dl-header-inner.equal-mobile .dl-logo,
  .dl-header-inner.equal-mobile .dl-theme-btn {
    flex:1 1 0;
    display:flex;
    justify-content:center;
  }
  .dl-header-inner.equal-mobile .dl-hamburger { justify-content:flex-start; }
  .dl-header-inner.equal-mobile .dl-theme-btn { justify-content:flex-end; }
}

/* Tighter phones */
@media (max-width: 480px){
  .dl-header-inner { gap:12px; min-height:60px; }
  .dl-theme-btn { padding:7px 14px; font-size:12.5px; }
  .dl-hamburger { width:40px; height:40px; }
  .dl-logo img { width:38px; height:38px; }
}

/* Remove any legacy absolute positioning from earlier builds */
#themeToggle { position:static !important; top:auto !important; right:auto !important; margin:0 !important; }
/* ================= MOBILE NAV CLEAN LAYOUT ================= */

/* Adjustable density (baseline vertical padding for parent & child) */
:root {
  --dl-mobile-pad-y: 11px; /* STANDARD */
  /* For compact variant use: 9px */
}

/* Root list reset */
.dl-mobile-root,
.dl-mobile-sub {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* Each top-level LI wrapper spacing */
.dl-mobile-root > li {
  margin: 6px 0;
  position: relative;
}

/* Parent (accordion toggle) */
.dl-mobile-parent {
  width: 100%;
  background: var(--card);
  /* border: 1px solid #27323c; */
  color: var(--text);
  font: 600 14px/1.25 system-ui, sans-serif;
  padding: var(--dl-mobile-pad-y) 14px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  cursor: pointer;
  position: relative;
  letter-spacing: .2px;
  transition: .18s background, .18s border-color, .18s color;
}

.dl-mobile-parent:hover,
.dl-mobile-parent:focus {
  background: var(--card-alt);
  outline: none;
}

/* Chevron */
.dl-mobile-parent:after {
  content: "";
  width: 7px;
  height: 7px;
  border: 2px solid currentColor;
  border-left: none;
  border-top: none;
  transform: rotate(45deg);
  transition: .25s transform;
  opacity: .75;
}

.dl-mobile-parent[aria-expanded="true"]:after {
  transform: rotate(225deg);
}

/* Simple focus ring (keyboard) */
.dl-mobile-parent:focus-visible {
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--accent);
}

/* Sub list container */
.dl-mobile-sub {
  margin-top: 4px;
  margin-left: 6px;
  padding-left: 10px;
  border-left: 2px solid #27323c;
  display: none;
  flex-direction: column;
  gap: 4px;
}

.dl-mobile-sub.open {
  display: flex;
  animation: dlSubFade .25s ease;
}

@keyframes dlSubFade {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Child links (and single non-parent links share style) */
.dl-mobile-sub a,
.dl-mobile-link,
.dl-mobile-cta {
  display: block;
  text-decoration: none;
  background: var(--card-alt);
/*  border: 1px solid #27323c; */
  color: var(--text-dim);
  font: 500 13.5px/1.25 system-ui, sans-serif;
  padding: var(--dl-mobile-pad-y) 14px;
  border-radius: 10px;
  letter-spacing: .15px;
  transition: .16s background, .16s color, .16s border-color;
}

.dl-mobile-sub a:hover,
.dl-mobile-sub a:focus,
.dl-mobile-link:hover,
.dl-mobile-link:focus {
  background: #2a333d;
  color: var(--text);
  outline: none;
}

/* CTA highlight */
.dl-mobile-cta {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
  font-weight: 600;
}
.dl-mobile-cta:hover,
.dl-mobile-cta:focus {
  background: var(--accent-hover);
}

/* Density variant (COMPACT)
   Uncomment if you want tighter:
:root { --dl-mobile-pad-y: 9px; }
.dl-mobile-parent { font-size: 13.5px; }
.dl-mobile-sub a, .dl-mobile-link { font-size: 13px; }
*/

/* Light theme adjustments */
.light .dl-mobile-parent,
.light .dl-mobile-sub a,
.light .dl-mobile-link {
  border-color: #d0d8e0;
}
.light .dl-mobile-sub {
  border-left-color: #d0d8e0;
}
.light .dl-mobile-sub a:hover,
.light .dl-mobile-link:hover {
  background: #e6edf3;
  color: #1f2d37;
}
.light .dl-mobile-cta {
  color: #fff;
}

/* Optional subtle separator rule – remove if you don't want lines */
.dl-mobile-root > li:not(:last-child) {
  padding-bottom: 2px;
  border-bottom: 1px solid #ffffff08;
}

