/* Homepage shortcut next to the menu. App code only loads when opened. */
.tuner-entry {
  position: absolute;
  top: 23px;
  left: calc(77% + 45px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  width: 52px;
  height: 58px;
  padding: 4px;
  color: var(--cyan);
  text-decoration: none;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: .04em;
  border-radius: 10px;
  transition: color .2s, background .2s;
}
.tuner-entry svg { display: block; width: 28px; height: 35px; flex-shrink: 0; }
.tuner-entry:hover { color: #8ce2ff; background: rgba(25,195,255,.07); }
.tuner-entry:focus-visible { outline: 2px solid var(--cyan); outline-offset: 4px; }
.site-header.scrolled .tuner-entry {
  left: auto;
  right: max(24px, calc((100vw - 1180px)/2));
  top: 9px;
}
.site-header.scrolled .menu-button {
  right: calc(max(24px, calc((100vw - 1180px)/2)) + 68px);
}
.menu-open .tuner-entry { visibility: hidden; }
@media (max-width: 860px) {
  .tuner-entry, .site-header.scrolled .tuner-entry {
    left: auto;
    right: 16px;
    top: 14px;
    width: 48px;
    height: 52px;
    gap: 1px;
    font-size: 9px;
  }
  .tuner-entry svg { width: 24px; height: 30px; }
  .site-header:not(.scrolled) .menu-button {
    left: auto;
    right: 78px;
    top: 14px;
    transform: none;
  }
  .site-header.scrolled .menu-button { right: 78px; }
  .site-header.scrolled .tuner-entry { top: 12px; }
}
