const toggle = document.getElementById('toggle');
  const track  = document.getElementById('track');
  const knob   = document.getElementById('knob');
  const rays   = document.getElementById('rays');
  const stateLabel = document.getElementById('state-label');
  const themeRoot  = document.getElementById('themeRoot');

  let isDay = true;

  const RAY_COUNT = 8;
  for (let i = 0; i < RAY_COUNT; i++) {
    const r = document.createElement('div');
    r.className = 'ray';
    r.style.transform = `rotate(${i * (360/RAY_COUNT)}deg)`;
    rays.appendChild(r);
  }

  function applyState() {
    if (isDay) {
      track.className      = 'track day';
      knob.className       = 'knob day';
      toggle.setAttribute('aria-checked', 'true');
      themeRoot.classList.remove('night');
    } else {
      track.className = 'track night';
      knob.className  = 'knob night';
      toggle.setAttribute('aria-checked', 'false');
      themeRoot.classList.add('night');
    }
  }

  toggle.addEventListener('click', () => { isDay = !isDay; applyState(); });
  toggle.addEventListener('keydown', e => {
    if (e.key === ' ' || e.key === 'Enter') { e.preventDefault(); isDay = !isDay; applyState(); }
  });

  function copyClass() {
    navigator.clipboard.writeText(classOut.textContent).catch(() => {});
  }
// just some fun.
  console.log("%c👀 hi there!", "font-size:20px")



// about.js
function closeOverlay() {
  document.getElementById('overlay').style.display = 'none';
}

// or toggle it from anywhere:
function openOverlay() {
  document.getElementById('overlay').style.display = 'flex';
}

function InterestShow() {
      const body = document.getElementById('interests-body');
      const chevron = document.getElementById('interests-chevron');
      chevron.classList.add("hidden")
      body.classList.remove("hidden")
      chevron.textContent = hidden ? '▶' : '▼';
    }

    function toggleInterests() {
      const body = document.getElementById('interests-body');
      const chevron = document.getElementById('interests-chevron');
      const hidden = body.classList.toggle('hidden');
      chevron.textContent = hidden ? '▶' : '▼';
      }