/* ===== Static CSS replacement for Tailwind utilities used in decifr.html ===== */
:root{
  --ink:#0b1220; --muted:#667085; --bg:#f6f8fc;
  --brand:#0a6cff; --brand-dark:#084dbd;
  --surface:#ffffff; --line:#e5e7eb; --footer:#0f172a;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:#fff;scroll-behavior:smooth}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}

/* Layout helpers (subset) */
.mx-auto{margin-left:auto;margin-right:auto}
.max-w-6xl{max-width:72rem} /* 1152px */
.px-4{padding-left:1rem;padding-right:1rem}
.py-3{padding-top:.75rem;padding-bottom:.75rem}
.py-4{padding-top:1rem;padding-bottom:1rem}
.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}
.pt-10{padding-top:2.5rem}
.pb-12{padding-bottom:3rem}
.sm\:pt-12{}
.sm\:pb-16{}
.h-16{height:4rem}
.h-5{height:1.25rem}.w-5{width:1.25rem}
.h-6{height:1.5rem}.w-6{width:1.5rem}
.h-8{height:2rem}.w-8{width:2rem}
.h-9{height:2.25rem}.w-9{width:2.25rem}
.h-4{height:1rem}.w-4{width:1rem}
.p-2{padding:.5rem}
.p-5{padding:1.25rem}
.px-2{padding-left:.5rem;padding-right:.5rem}
.px-3{padding-left:.75rem;padding-right:.75rem}
.px-5{padding-left:1.25rem;padding-right:1.25rem}
.py-1{padding-top:.25rem;padding-bottom:.25rem}
.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}
.py-2{padding-top:.5rem;padding-bottom:.5rem}
.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}
.text-sm{font-size:.875rem;line-height:1.25rem}
.text-base{font-size:1rem;line-height:1.5rem}
.text-lg{font-size:1.125rem;line-height:1.75rem}
.text-xl{font-size:1.25rem;line-height:1.75rem}
.text-2xl{font-size:1.5rem;line-height:2rem}
.text-3xl{font-size:1.875rem;line-height:2.25rem}
.text-4xl{font-size:2.25rem;line-height:2.5rem}
.font-medium{font-weight:500}
.font-semibold{font-weight:600}
.font-bold{font-weight:700}
.leading-none{line-height:1}
.leading-relaxed{line-height:1.625}
.tracking-tight{letter-spacing:-.015em}
.rounded{border-radius:.375rem}
.rounded-md{border-radius:.375rem}
.rounded-lg{border-radius:.5rem}
.rounded-xl{border-radius:.75rem}
.rounded-2xl{border-radius:1rem}
.border{border:1px solid var(--line)}
.border-gray-200{border-color:#e5e7eb}
.border-gray-300{border-color:#d1d5db}
.border-blue-600{border-color:#2563eb}
.bg-white{background:#ffffff}
.bg-white\/95{background:rgba(255,255,255,.95)}
.bg-gray-50{background:#f9fafb}
.bg-gray-100{background:#f3f4f6}
.text-gray-700{color:#374151}
.text-gray-800{color:#1f2937}
.text-gray-900{color:#111827}
.placeholder-gray-400::placeholder{color:#9ca3af}
.shadow-sm{box-shadow:0 1px 2px rgba(0,0,0,.05)}
.shadow-lg{box-shadow:0 10px 15px rgba(0,0,0,.1), 0 4px 6px rgba(0,0,0,.05)}
.sticky{position:sticky}
.top-0{top:0}
.z-50{z-index:50}
.z-40{z-index:40}
.hidden{display:none}
.block{display:block}
.flex{display:flex}
.grid{display:grid}
.items-center{align-items:center}
.items-start{align-items:flex-start}
.items-end{align-items:flex-end}
.justify-between{justify-content:space-between}
.justify-center{justify-content:center}
.gap-1{gap:.25rem}
.gap-2{gap:.5rem}
.gap-3{gap:.75rem}
.gap-4{gap:1rem}
.gap-5{gap:1.25rem}
.gap-6{gap:1.5rem}
.gap-8{gap:2rem}
.text-center{text-align:center}
.text-right{text-align:right}
.italic{font-style:italic}
.underline{text-decoration:underline}
.whitespace-nowrap{white-space:nowrap}
.aspect-\[4\/3\]{position:relative}
.aspect-\[4\/3\]::before{content:"";display:block;padding-top:75%}
.aspect-\[4\/3\]>*{position:absolute;inset:0}
.object-contain{object-fit:contain}
.overflow-hidden{overflow:hidden}
.relative{position:relative}
.absolute{position:absolute}
.inset-y-0{top:0;bottom:0}
.right-2{right:.5rem}
.right-12{right:3rem}
.left-0{left:0}
.mt-1{margin-top:.25rem}
.mt-2{margin-top:.5rem}
.mt-3{margin-top:.75rem}
.mt-4{margin-top:1rem}
.mt-5{margin-top:1.25rem}
.mb-6{margin-bottom:1.5rem}
.ml-1{margin-left:.25rem}
.w-full{width:100%}
.min-w-\[64px\]{min-width:64px}
.rounded-full{border-radius:9999px}
.border-y{border-top:1px solid; border-bottom:1px solid}
.text-amber-900{color:#78350f}
.bg-amber-50{background:#fffbeb}
.border-amber-200{border-color:#fde68a}

/* Controls used in the file */
.btn-tbas{background:var(--brand);color:#fff;border:1px solid var(--brand)}
.btn-tbas:hover{background:var(--brand-dark);border-color:var(--brand-dark);color:#fff}

/* Cards */
.card{background:var(--surface);border:1px solid var(--line);border-radius:1rem;transition:transform .2s ease, box-shadow .2s ease}
.card:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(2,6,23,.10)}

/*::after content:'Restricted Access';*/
.restricted{position:absolute;top:.75rem;right:.75rem;background:rgba(2,6,23,.60);color:#fff;font-size:.75rem;font-weight:600;padding:.25rem .5rem;border-radius:.375rem}

/* Header wrapper look */
header.sticky{background:rgba(255,255,255,.95);backdrop-filter:blur(6px);border-bottom:1px solid #e5e7eb}

/* Dropdown panels */
#toolsMenu,#adminMenu{display:none;position:absolute;background:#fff;border:1px solid #e5e7eb;border-radius:.75rem;padding:.5rem;box-shadow:0 10px 24px rgba(15,23,42,.1)}
#toolsMenuWrapper:hover #toolsMenu,
#toolsMenuWrapper:focus-within #toolsMenu{display:block}
#adminMenuWrapper:hover #adminMenu,
#adminMenuWrapper:focus-within #adminMenu{display:block}

/* Hero bg */
section#home{background:var(--bg);border-bottom:1px solid #e5e7eb}

/* Simple responsive breakpoints to mimic sm/md/lg used */
@media (min-width: 640px){
  .sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}
  .sm\:text-4xl{font-size:2.25rem;line-height:2.5rem}
  .sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width: 768px){
  .md\:flex{display:flex}
  .md\:hidden{display:none}
  .md\:block{display:block}
  .md\:items-center{align-items:center}
  .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (min-width: 1024px){
  .lg\:px-8{padding-left:2rem;padding-right:2rem}
  .lg\:gap-6{gap:1.5rem}
  .lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* Grid helpers seen in the file */
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}

/* Utility colors on hover as used */
.hover\:bg-gray-50:hover{background:#f9fafb}
.hover\:bg-blue-50:hover{background:#eff6ff}
.hover\:text-blue-600:hover{color:#2563eb}
.hover\:underline:hover{text-decoration:underline}

/* Forms */
input[type="search"]{
  width:100%;border:1px solid #d1d5db;border-radius:.5rem;
  padding:.75rem 3.5rem .75rem 1rem;font-size:1rem;color:#111827;
}
input[type="search"]:focus{outline:1px solid #0a6cff; border-color:#0a6cff; box-shadow:0 0 0 1px #0a6cff}
button{cursor:pointer;background:transparent;border:0}
button:focus{outline:2px solid rgba(10,108,255,.4);outline-offset:2px}

/* Misc fixes from inline CSS */
footer .text-xs{font-size:.875rem}




/* ===== Migrated inline styles from original file ===== */

    /* Match T-BAS color system for seamless transition */
    :root{
      --ink:#0b1220; --muted:#667085; --bg:#f6f8fc;      /* T-BAS hero background */
      --brand:#0a6cff; --brand-dark:#084dbd;             /* T-BAS button blue */
      --surface:#ffffff; --line:#e5e7eb;                 /* cards & borders */
      --footer:#0f172a;                                  /* T-BAS footer */
    }
    html,body{font-family:Arial,Helvetica,sans-serif;color:var(--ink)}
    body{background:#fff}
    html{scroll-behavior:smooth}
    section[id]{scroll-margin-top:4rem}
    a{color:var(--brand)}
    /* Keep primary button text white on hover; limit global hover style */
    a:not(.btn-tbas):hover{color:var(--brand-dark);text-decoration:underline}

    .btn-tbas{background:var(--brand);color:#fff;border:1px solid var(--brand);box-shadow:inset 0 0 0 1px rgba(255,255,255,.04)}
    .btn-tbas:hover{background:var(--brand-dark);border-color:var(--brand-dark);color:#fff!important}
    .btn-tbas:focus-visible{outline:none;box-shadow:0 0 0 2px #fff,0 0 0 4px var(--brand)}

    .card{background:var(--surface);border:1px solid var(--line)}
    .card:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(2,6,23,.10)}

    /*::after  content:'Restricted Access';*/
    .restricted{position:absolute;top:.75rem;right:.75rem;background:rgba(2,6,23,.60);color:#fff;font-size:.75rem;font-weight:600;padding:.25rem .5rem;border-radius:.375rem}

    /* Tools dropdown stays open on hover/focus */
    #toolsMenuWrapper:focus-within #toolsMenu,
    #toolsMenuWrapper:hover #toolsMenu{display:block}

    /* Footer ~14px like T-BAS (without touching headings) */
    footer .text-xs{font-size:.875rem}

    /* Header nav links 16px to match T-BAS Bootstrap default */
    header a,header button{font-size:1rem}
  


/* Uniform navbar font sizing */
header a.nav-link, header a.brand {
  font-size: 1.25rem;
  line-height: 1.2;
}



/* Match T-BAS navbar font sizing */
header a.nav-link, header a.brand {
  font-size: 16px;
  line-height: 1.2;
}



/* Tools submenu exact alignment */
#toolsMenu { left: 0 !important; top: 100% !important; margin-top: 0 !important; padding: 0 !important; }
#toolsMenu .nav-link,
#toolsMenu a,
#toolsMenu .dropdown-item,
#toolsMenu .dropdown-header {
  display: block;
  padding: 10px 16px !important;
  margin: 0 !important;
  text-indent: 0 !important;
}
#toolsMenu > *:first-child { padding: 10px 16px !important; margin: 0 !important; }
#toolsMenu a:hover, #toolsMenu .dropdown-item:hover { background-color: #e6f0ff !important; }

/* Hero "How to Cite" hover identical to Create Account */
section#home a[href*="cite"],
section#home a[href*="how-to-cite"] {
  transition: background-color .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease;
}
section#home a[href*="cite"]:hover,
section#home a[href*="how-to-cite"]:hover {
  background-color: #64748b !important;
  color: #ffffff !important;
  border-color: #64748b !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.06), 0 2px 6px rgba(0,0,0,.06);
}



/* Restore navigator hover highlight (no underline) */
header .nav-link {
  text-decoration: none !important;
  border-radius: .5rem;
  transition: background-color .15s ease, color .15s ease;
}
header .nav-link:hover,
header .nav-link:focus {
  background-color: #e6f0ff;   /* light blue */
  color: #0b1220;
  text-decoration: none !important;
}

/* Ensure Tools toggle also gets the same hover highlight */
#toolsMenuBtn:hover, #toolsMenuWrapper:hover #toolsMenuBtn {
  background-color: #e6f0ff;
  border-radius: .5rem;
}



/* --- Restore hover highlight (soft blue, no underline) across header nav --- */
header a { text-decoration: none !important; }
header a:hover, header a:focus { text-decoration: none !important; }

/* Left nav ('nav-link' items like Tools, Citation) */
header .nav-link {
  border-radius: .5rem;
  transition: background-color .15s ease, color .15s ease;
}
header .nav-link:hover,
header .nav-link:focus {
  background-color: #e6f0ff;
  color: #0b1220;
}

/* Tools toggle button */
#toolsMenuBtn {
  border-radius: .5rem;
  transition: background-color .15s ease, color .15s ease;
}
#toolsMenuBtn:hover,
#toolsMenuWrapper:hover #toolsMenuBtn {
  background-color: #e6f0ff;
}

/* Right-side header links (CIFR, Contact, History, Job Monitor, Users Map, Sign in, Create account) */
header .md\:flex.items-center a.text-sm {
  border-radius: .5rem;
  transition: background-color .15s ease, color .15s ease;
}
header .md\:flex.items-center a.text-sm:hover,
header .md\:flex.items-center a.text-sm:focus {
  background-color: #e6f0ff;
  color: #0b1220;
}



/* --- Header: remove underline on hover everywhere --- */
header a { text-decoration: none !important; }
header a:hover, header a:focus { text-decoration: none !important; }

/* --- Generic nav items (left & right): blue TEXT on hover, no background --- */
header .nav-link,
#toolsMenuBtn,
header .md\:flex.items-center a.text-sm {
  transition: color .15s ease, background-color .15s ease, border-color .15s ease;
}
/* Text blue on hover */
header .nav-link:hover,
header .nav-link:focus,
#toolsMenuBtn:hover,
#toolsMenuWrapper:hover #toolsMenuBtn,
header .md\:flex.items-center a.text-sm:hover,
header .md\:flex.items-center a.text-sm:focus {
  color: #2563eb !important;         /* blue-600 */
  background-color: transparent !important;
}

/* --- CTA exceptions --- */
/* Sign in: blue background + white text on hover */
header a[href*="check_login"]:hover,
header a[href*="login"]:hover {
  background-color: #2563eb !important;
  color: #ffffff !important;
  border-color: #2563eb !important;
}

/* Create account: grey background + white text on hover (like How to Cite) */
header a[href*="registration"]:hover,
header a[href*="create"]:hover,
section#home a[href*="cite"]:hover,
section#home a[href*="how-to-cite"]:hover {
  background-color: #64748b !important;   /* grey */
  color: #ffffff !important;
  border-color: #64748b !important;
}

/* Keep underline off for hero buttons too */
section#home a[href*="cite"],
section#home a[href*="how-to-cite"] {
  text-decoration: none !important;
}



/* Exception: highlight Tools with a soft background on hover */
#toolsMenuBtn:hover,
#toolsMenuWrapper:hover #toolsMenuBtn,
#toolsMenuWrapper:focus-within #toolsMenuBtn {
  background-color: #e6f0ff !important;  /* soft blue fill */
  color: #0b1220 !important;
  border-radius: .5rem;
}

/* Ensure "Create account" fills like "How to Cite" (dark grey + white) */
header a[href*="registration"]:hover,
header a[href*="create"]:hover {
  background-color: #64748b !important;
  color: #ffffff !important;
  border-color: #64748b !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.06), 0 2px 6px rgba(0,0,0,.06);
}



/* === FINAL OVERRIDES: placed last for highest precedence === */

/* 1) Highlight Tools with soft blue background on hover/open */
header #toolsMenuBtn:hover,
header #toolsMenuWrapper:hover #toolsMenuBtn,
header #toolsMenuWrapper:focus-within #toolsMenuBtn {
  background-color: #e6f0ff !important;  /* soft blue */
  color: #0b1220 !important;
  border-radius: .5rem;
}

/* 2) Create account fills like How to Cite: dark grey + white */
header a[href*="registration.php"]:hover,
header a[href*="/registration"]:hover,
header a[href*="create"]:hover {
  background-color: #64748b !important;
  color: #ffffff !important;
  border-color: #64748b !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.06), 0 2px 6px rgba(0,0,0,.06);
}

/* Keep generic nav items text-only blue hover (do not override Tools/CTAs above) */
header nav .nav-link:hover { color: #2563eb !important; background: transparent !important; }



/* === FINAL-FINAL OVERRIDES for Tools hover highlight === */
header #toolsMenuBtn,
header #toolsMenuBtn * { transition: background-color .15s ease, color .15s ease; }

/* Apply soft blue background when hovering the button itself */
header #toolsMenuBtn:hover {
  background-color: #e6f0ff !important;
  color: #0b1220 !important;
  border-radius: .5rem !important;
}

/* Also apply when hovering the wrapper (so moving toward the menu keeps highlight) */
header #toolsMenuWrapper:hover #toolsMenuBtn,
header #toolsMenuWrapper:focus-within #toolsMenuBtn {
  background-color: #e6f0ff !important;
  color: #0b1220 !important;
  border-radius: .5rem !important;
}

/* Ensure no conflicting rule removes the background on hover */
header nav .nav-link:hover { background-color: transparent !important; }



/* === FINAL OVERRIDES (placed last) === */

/* Header: remove underline on hover within header only (do not affect body links) */
header a:hover, header a:focus { text-decoration: none !important; }

/* 1) Tools: soft blue background on hover/open */
header #toolsMenuBtn:hover,
header #toolsMenuWrapper:hover #toolsMenuBtn,
header #toolsMenuWrapper:focus-within #toolsMenuBtn {
  background-color: #e6f0ff !important;  /* soft blue */
  color: var(--ink) !important;
  border-radius: .5rem !important;
}

/* 2) Sign in: blue background + white text on hover */
header a[href*="check_login"]:hover,
header a[href*="login"]:hover {
  background-color: var(--brand) !important;   /* #0a6cff */
  color: #ffffff !important;
  border-color: var(--brand) !important;
}

/* 3) Create account: dark grey background + white text on hover (like How to Cite) */
header a[href*="registration"]:hover,
header a[href*="registration.php"]:hover,
header a[href*="create"]:hover {
  background-color: #64748b !important;
  color: #ffffff !important;
  border-color: #64748b !important;
}

/* Keep How to Cite consistent */
section#home a[href*="cite"]:hover,
section#home a[href*="how-to-cite"]:hover {
  background-color: #64748b !important;
  color: #ffffff !important;
  border-color: #64748b !important;
}



  /* --- Sign in (header + mobile) -> brand blue fill with white text on hover --- */
  header .md\:flex.items-center a.text-sm[href*="check_login"]:hover,
  header .md\:flex.items-center a.text-sm[href*="login"]:hover,
  header .md\:flex.items-center a.text-sm[href*="signin"]:hover,
  #mobileMenu a[href*="check_login"]:hover,
  #mobileMenu a[href*="login"]:hover,
  #mobileMenu a[href*="signin"]:hover {
    background-color: var(--brand, #0a6cff) !important;
    color: #ffffff !important;
    border-color: var(--brand, #0a6cff) !important;
    text-decoration: none !important;
  }

  /* --- Create account (header + mobile) -> gray fill with white text on hover --- */
  header .md\:flex.items-center a.text-sm[href*="registration"]:hover,
  header .md\:flex.items-center a.text-sm[href*="registration.php"]:hover,
  header .md\:flex.items-center a.text-sm[href*="register"]:hover,
  header .md\:flex.items-center a.text-sm[href*="create"]:hover,
  #mobileMenu a[href*="registration"]:hover,
  #mobileMenu a[href*="registration.php"]:hover,
  #mobileMenu a[href*="register"]:hover,
  #mobileMenu a[href*="create"]:hover {
    background-color: #6c757d !important;
    color: #ffffff !important;
    border-color: #6c757d !important;
    text-decoration: none !important;
  }

  /* --- How to Cite (already working, keep for completeness across sections) --- */
  section#home a[href*="cite"]:hover,
  a[href*="how-to-cite"]:hover {
    background-color: #6c757d !important;
    color: #ffffff !important;
    border-color: #6c757d !important;
    text-decoration: none !important;
  }



  /* Only change the Tools text color on hover over the Tools nav trigger */
  #toolsMenuBtn:hover span.font-medium { color: var(--brand, #0a6cff) !important; }



  .search-hit { box-shadow: 0 0 0 2px rgba(10,108,255,.25) !important; }
  .search-hit-current { box-shadow: 0 0 0 3px rgba(10,108,255,.6) !important; }



  /* Hide native Safari/Chrome clear (cancel) icon to prevent overlap */
  input[type="search"]::-webkit-search-decoration,
  input[type="search"]::-webkit-search-cancel-button,
  input[type="search"]::-webkit-search-results-button,
  input[type="search"]::-webkit-search-results-decoration { display: none; }



  section[id], .card { scroll-margin-top: 110px; }



  /* Footer: remove underline from CIFR link to match T-BAS */
  footer a.underline[href*="cifr.ncsu.edu"] { text-decoration: none !important; }
  footer a.underline[href*="cifr.ncsu.edu"]:hover { text-decoration: none !important; }

  /* Hero/title wrapping fixes */
  h1.whitespace-nowrap { white-space: normal !important; }
  /* Ensure subheading/citation line wraps and long tokens (e.g., DOIs) break as needed */
  section#home p { white-space: normal !important; overflow-wrap: anywhere; word-break: normal; }



  footer .grid.md\:grid-cols-3 { column-gap: 3rem !important; row-gap: 2rem !important; }



  @media (min-width: 768px){
    footer .grid.md\:grid-cols-3 {
      display: grid !important;
      grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
      column-gap: 3rem !important;
      row-gap: 2rem !important;
    }
    /* Optional debug (disabled): add 'debug-cols' to footer .grid to visualize column boundaries */
    footer .grid.md\:grid-cols-3.debug-cols > * { outline: 1px dotted rgba(255,255,255,.25); }
  }



  @media (min-width: 768px){
    footer .grid.md\:grid-cols-3 > :nth-child(2),
    footer .grid.md\:grid-cols-3 > :nth-child(3){
      border-left: 1px solid rgba(255,255,255,0.14);
      padding-left: 3rem; /* match the md column gap */
      margin-left: 0 !important; /* neutralize any stray margins */
    }
  }



  /* When the root has .jobmon-hide, hide Job Monitor by URL or explicit marks */
  html.jobmon-hide a[href*="vclvm178-33.vcl.ncsu.edu:5555"],
  html.jobmon-hide li[data-job-monitor],
  html.jobmon-hide a[data-job-monitor] {
    display: none !important;
  }



  footer .decifr-col { display:flex; flex-direction:column; gap:8px; }
  footer .decifr-col .brand-row { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
  footer .decifr-col .brand-row img { height:18px; }
  footer .decifr-col .powered-by { font-size:12px; line-height:1.2; opacity:.75; display:inline-flex; gap:6px; align-items:center; padding:2px 6px; border-radius:6px; }
  footer .project-links { font-size:12px; opacity:.85; display:block; margin-top:6px; }
  footer .project-links a { color:inherit; text-decoration:none; }
  footer .project-links a:hover { text-decoration:underline; }
  footer .project-links a + a::before { content:"·"; margin:0 8px; opacity:.5 }



  /* smaller, subtler Flask chip */
  footer .powered-by { font-size: 11px; line-height: 1.2; opacity: 0.65; }
  /* put GitHub and History on their own lines under the chip */
  footer .project-links a { display: block; margin: 2px 0; }



  /* Left-align and emphasize project links */
  footer .project-links { margin: 6px 0 0 0 !important; }
  footer .project-links a {
    display: block !important;
    margin: 2px 0 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-decoration: none;
  }
  footer .project-links a + a::before { content: none !important; }

  /* Make the Flask chip smaller & subtler */
  footer .powered-by {
    font-size: 10px !important;
    line-height: 1.1 !important;
    opacity: 0.6 !important;
    padding: 1px 4px !important;
    border-radius: 4px !important;
  }



  /* Gentle vertical spacing in the left footer column */
  footer .decifr-col .brand-row { margin-top: 6px !important; }
  footer .decifr-col .powered-by { margin-top: 6px !important; }
  footer .decifr-col .project-links { margin-top: 8px !important; }



  footer .chip-row { display:flex; gap:8px; flex-wrap:wrap; margin-top:6px; }
  footer .chip {
    display:inline-flex; align-items:center;
    padding:6px 10px; border:1px solid rgba(255,255,255,.12);
    border-radius:10px; font-size:12px; text-decoration:none; color:inherit;
    background:rgba(255,255,255,.02);
  }
  footer .chip:hover { text-decoration:underline; }
  footer .chip--micro { font-size:10px; opacity:.8; padding:2px 6px; }
  footer .pb-flask { display:inline-block; }



  /* Make NC State appear as a pill chip */
  footer .decifr-col .brand-row a.chip { 
    display:inline-flex; align-items:center; gap:8px;
    padding:6px 12px; border:1px solid rgba(255,255,255,.18);
    border-radius:10px; background:#c62f2f; color:#fff; font-weight:700;
  }
  footer .decifr-col .brand-row a.chip img { height:14px; }

  /* Chip row for GitHub / History */
  footer .chip-row { display:flex; gap:8px; flex-wrap:wrap; margin-top:8px; }
  footer .chip {
    display:inline-flex; align-items:center;
    padding:6px 10px; border:1px solid rgba(255,255,255,.12);
    border-radius:10px; font-size:12px; text-decoration:none; color:inherit;
    background:rgba(255,255,255,.02);
  }
  footer .chip:hover { text-decoration:underline; }

  /* Micro Flask chip: full-width subtle bar */
  footer .chip--micro { 
    font-size:10px; opacity:.8; padding:2px 8px; 
    display:block; width:100%; 
    border-radius:10px; margin-top:8px;
  }
  footer .pb-flask { display:block; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.02); }



  /* Flip the Tools chevron when the menu is hovered or open (focus-within) */
  #toolsMenuBtn svg { transition: transform .18s ease; }
  #toolsMenuWrapper:hover #toolsMenuBtn svg,
  #toolsMenuWrapper:focus-within #toolsMenuBtn svg {
    transform: rotate(180deg);
  }


#adminMenuWrapper:hover #adminMenu,
#adminMenuWrapper:focus-within #adminMenu { display:block; }
#adminMenuBtn svg { transition: transform .18s ease; }
#adminMenuWrapper:hover #adminMenuBtn svg,
#adminMenuWrapper:focus-within #adminMenuBtn svg { transform: rotate(180deg); }


  /* Make Tools & Admin dropdown panels fit their content (eliminate unused white space) */
  #toolsMenu, #adminMenu {
    width: fit-content !important;      /* shrink to content width */
    min-width: 0 !important;            /* allow shrinking below Tailwind defaults */
    max-width: calc(100vw - 2rem) !important; /* guard against overflow on narrow screens */
  }
  /* Keep items on one line so width is truly content-driven */
  #toolsMenu a, #adminMenu a { white-space: nowrap !important; }



/* Base state: outline-secondary look (match T-BAS) */
section#home a[href*="cite"],
section#home a[href*="how-to-cite"],
section#home button[href*="cite"],
section#home button[data-target*="cite"],
section#home button[data-toggle][data-target*="cite"] {
  background-color: transparent !important;
  color: #6c757d !important;         /* Bootstrap secondary */
  border: 1px solid #6c757d !important;
  box-shadow: none !important;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

/* Hover/focus: filled secondary with white text (like T-BAS hover) */
section#home a[href*="cite"]:hover,
section#home a[href*="how-to-cite"]:hover,
section#home button[href*="cite"]:hover,
section#home button[data-target*="cite"]:hover,
section#home button[data-toggle][data-target*="cite"]:hover,
section#home a[href*="cite"]:focus,
section#home a[href*="how-to-cite"]:focus,
section#home button[href*="cite"]:focus,
section#home button[data-target*="cite"]:focus,
section#home button[data-toggle][data-target*="cite"]:focus {
  background-color: #6c757d !important;
  color: #ffffff !important;
  border-color: #6c757d !important;
  text-decoration: none !important;
}



  #backToTop{position:fixed;right:24px;bottom:24px;z-index:9999;display:none;border:0;border-radius:9999px;padding:10px 14px;box-shadow:0 2px 8px rgba(0,0,0,.2);cursor:pointer;font:inherit}


/* === Footer dark theme support (added) === */
.bg-\[var\(--footer\)\]{background:var(--footer)}
.text-slate-200{color:#e2e8f0}
.text-slate-300{color:#cbd5e1}
.text-slate-400{color:#94a3b8}
footer{color:#e2e8f0}
footer a{color:#93c5fd}
footer a:hover{color:#bfdbfe;text-decoration:underline}
footer .border-t{border-top:1px solid rgba(148,163,184,.35)}


/* === Visibility fixes for header icons === */
.inline-flex{display:inline-flex}
@media (min-width: 768px){
  .md\:inline-flex{display:inline-flex}
}


/* === Force submenu links to dark (no blue) === */
#toolsMenu a, #adminMenu a, #toolsMenu .nav-link, #adminMenu .nav-link{
  color: var(--ink) !important;
}
#toolsMenu a:hover, #adminMenu a:hover{
  background:#f3f4f6;
  color: var(--ink) !important;
  text-decoration:none;
}
/* Search highlight */
mark.search-hit{background:#fde68a; padding:0 .1em; border-radius:.2em}
mark.search-hit-current{outline:2px solid #f59e0b; outline-offset:2px}


/* === Search panel styling & animation === */
#navSearchBar{position:relative; box-shadow:0 6px 18px rgba(2,6,23,.10)}
.search-panel-enter{display:block; animation:slideDown .18s ease-out both}
.search-panel-exit{animation:slideUp .14s ease-in both}
@keyframes slideDown{from{opacity:0; transform:translateY(-6px)} to{opacity:1; transform:translateY(0)}}
@keyframes slideUp{from{opacity:1; transform:translateY(0)} to{opacity:0; transform:translateY(-6px)}}


/* === Footer visual parity tweaks === */
footer{
  background: var(--footer);
  color: #e2e8f0; /* slate-200 */
  font-size: 1rem;
}
footer h4{
  font-size: .875rem; /* text-sm */
  letter-spacing: .06em;
  text-transform: uppercase;
  color:#cbd5e1; /* slate-300 */
  margin: 0 0 .75rem 0;
}
footer a{ color:#cbd5e1; text-decoration:none }
footer a:hover{ color:#ffffff; text-decoration:none }
footer .muted{ color:#94a3b8 } /* slate-400 */

.bg-slate-800{ background:#1f2937 }
.text-slate-600\/60{ color: rgba(71,85,105,.6) } /* not used for links */
.text-slate-300{ color:#cbd5e1 }
.text-slate-200{ color:#e2e8f0 }

/* Columns + vertical dividers on md+ */
@media (min-width: 768px){
  footer .grid > div + div{
    border-left:1px solid rgba(148,163,184,.25);
    padding-left:2rem;
  }
}

/* Bottom bar */
footer .border-white\/10{ border-color: rgba(255,255,255,.10) }
footer .pt-4{ padding-top:1rem }
footer .mt-8{ margin-top:2rem }

/* Powered-by badge */
footer .powered-by{
  display:inline-flex; align-items:center; gap:.5rem;
  border:1px solid rgba(148,163,184,.35);
  border-radius:.5rem;
  padding:.25rem .5rem;
  font-size:.75rem;
  color:#cbd5e1;
  background:#1f2937;
}

/* List spacing */
footer ul{ list-style:none; margin:0; padding:0 }
footer li{ margin:.5rem 0 }

/* Ensure FAQ doesn't pick bright blue */
footer a.text-blue-600{ color:#cbd5e1 }
footer a.text-blue-600:hover{ color:#ffffff }


/* === Footer spacing tweak (more space above headers) === */
footer > .mx-auto{
  padding-top: 3rem !important; /* ~48px */
}
footer h4{
  margin-top: .5rem; /* ensure breathing room if grid sits close to top */
}


/* === Section/card spacing fixes === */
.card{ margin-bottom: 1.5rem; } /* 24px gap under cards */
.rounded-xl.border.bg-white{ display:block; margin-top: 1.5rem; margin-bottom: 2rem; } /* citation block spacing */

/* Ensure the last content above footer has breathing room */
main > *:last-child{ margin-bottom: 2.5rem; }
footer{ margin-top: 2.5rem; }

body.is-cite-open .dc-overlay{display:block}

/* scroll lock removed by scrollfix */


/* === DeCIFR Cite Modal (Overlay via body class) === */
.dc-overlay{position:fixed;left:0;top:0;right:0;bottom:0;z-index:2147483000;display:none}
body.is-cite-open .dc-overlay{display:block}
.dc-overlay__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.45);display:block}
.dc-overlay__dialog{
  position:relative;z-index:1;background:#fff;color:#0b1220;border-radius:12px;
  max-width:720px;width:calc(100% - 2rem);margin:6vh auto;padding:20px 20px 16px;
  border:1px solid #e5e7eb;box-shadow:0 20px 48px rgba(0,0,0,.25),0 2px 8px rgba(0,0,0,.15);
}
.dc-overlay__title{margin:0 0 8px 0;font-size:20px;line-height:1.35;font-weight:700}
.dc-overlay__body{max-height:60vh;overflow:auto}
.dc-overlay__body h3{font-size:16px;margin:16px 0 6px;font-weight:700}
.dc-overlay__body p{margin:6px 0 12px}
.dc-overlay__body a{color:#0a6cff;text-decoration:underline}
.dc-overlay__footer{display:flex;justify-content:flex-end;gap:8px;margin-top:10px}
.dc-overlay__btn{
  background:#f3f4f6;border:1px solid #d1d5db;border-radius:8px;padding:8px 14px;
  font-size:14px;font-weight:600;color:#111827;display:inline-block
}
.dc-overlay__btn:hover{background:#e5e7eb}
.dc-overlay__close{
  position:absolute;top:8px;right:10px;width:32px;height:32px;line-height:32px;
  border-radius:9999px;border:1px solid #d1d5db;background:#fff;color:#111827;
  font-size:20px;text-align:center;display:inline-block
}
.dc-overlay__close:hover{background:#f3f4f6}
@media (min-width:640px){.dc-overlay__dialog{padding:24px 24px 16px}}



/* === Professional typography for How to Cite section (scoped) === */
#cite { font-family: Arial, Helvetica, sans-serif; }
#cite h3 {
  font-size: 1.5rem;        /* 24px */
  line-height: 1.4;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: #0f172a;           /* slate-900 */
  margin: 0 0 8px 0;
}
#cite p {
  font-size: 0.975rem;      /* ~15.6px */
  line-height: 1.65;
  color: #334155;           /* slate-700 */
  margin: 6px 0 0 0;
}
#cite em { color: #1f2937; } /* slightly darker for emphasis */
#cite a { color: #0a6cff; text-decoration: none; }
#cite a:hover { text-decoration: underline; }


/* === Professional Typography: DeCIFR Cite Modal (dc-overlay) === */
.dc-overlay__dialog{
  padding:24px 24px 18px;           /* more breathing room */
  border-radius:16px;               /* slightly softer corners */
}
.dc-overlay__close{
  position:absolute; right:12px; top:12px;
  width:32px; height:32px; border-radius:9999px;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:20px; line-height:1; color:#64748b; text-decoration:none;
  border:1px solid transparent;
}
.dc-overlay__close:hover{ background:#f1f5f9; border-color:#e2e8f0; }

.dc-overlay__title{
  font-size:26px; line-height:1.3; font-weight:700; letter-spacing:-0.01em;
  color:#0f172a; margin:0 0 10px 0;
}

.dc-overlay__body{
  max-height:62vh; overflow:auto;
  scrollbar-gutter: stable;         /* avoids layout shift on scrollbars */
}
.dc-overlay__body p{
  font-size:15.6px; line-height:1.65; color:#334155;
  margin:8px 0 12px;
}
.dc-overlay__body h3{
  font-size:17px; line-height:1.45; font-weight:700; color:#0f172a;
  margin:16px 0 6px;
}
.dc-overlay__body em{ color:#1f2937; }
.dc-overlay__body strong{ color:#0f172a; font-weight:700; }

.dc-overlay__footer{ margin-top:14px; }
.dc-overlay__btn{ font-size:15px; border-radius:10px; padding:8px 16px; }

/* Footer bottom spacing (scoped) */
footer > .mx-auto { padding-bottom: 18px !important; }


/* === Breathing room: hero pill + cite card (scoped) === */

/* Hero pill: target the specific chip used under the hero title */
.rounded-full.border.text-xs.font-medium.text-gray-700{
  padding: 8px 14px !important;    /* v h */
  line-height: 1.2 !important;
  border-radius: 9999px !important;
}

/* Cite card: add inner padding and slightly softer corners */
#cite > div.rounded-xl{
  padding: 22px 24px !important;
  border-radius: 12px !important;
}
#cite h3{ margin-bottom: 10px !important; }


/* Admin submenu alignment + position tweak (surgical) */
#adminMenu { text-align: left !important; margin-top: 6px !important; }
#adminMenu a { display: block !important; text-align: left !important; }


/* === Card color updates (scoped) ===
   Match "updated" look: dark headings, muted body, no blue links inside cards */
.card { border-color: #d1d5db !important; }                /* slightly darker border */
.card h3, .card h3 a { color: #111827 !important;          /* gray-900 title */
  text-decoration: none !important; }
.card p { color: #374151 !important; }                     /* gray-700 body */
.card p a { color: #374151 !important; text-decoration: none !important; }
.card p a:hover { text-decoration: underline !important; color: #111827 !important; }


/* === Hero title weight adjustment only === */
section#home h1 { font-weight: 400 !important; }
\n
/* === Match T-BAS hero title exactly === */
section#home h1 {
  font-family: Arial, Helvetica, sans-serif !important;
  font-weight: 400 !important;
  font-size: 2.25rem !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
}

/* === Section headers: lighter weight + tighter header/description gap === */
section[id] > header h2 { 
  font-weight: 400 !important;      /* less bold */
  margin-bottom: 0.12rem !important;/* gentle tighten below header */
}
section[id] > header h2 + p { 
  margin-top: 0.12rem !important;   /* nudge description upward */
}


/* === Increased top spacing for "Phylogenetic & Network Methods" ONLY === */
section#phylogenetic > header h2 { margin-top: 2.5rem !important; }