.ll-reading-panel {
  position: relative;
  margin-left: 0.25rem;
}

.ll-reading-panel > summary {
  list-style: none;
  cursor: pointer;
  border-radius: 10px;
  border: none;
  width: 2.5rem;
  height: 2.5rem;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.92);
  background: rgba(255, 255, 255, 0.14);
  opacity: 1;
  transition: color 0.2s ease, background-color 0.2s ease, opacity 0.2s ease;
}

.ll-reading-panel > summary::-webkit-details-marker {
  display: none;
}

.ll-reading-panel__icon {
  width: 2.2rem;
  height: 2.2rem;
  display: block;
  object-fit: contain;
}

.ll-reading-panel__trigger-label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.ll-reading-panel[open] > summary,
.ll-reading-panel > summary:hover,
.ll-reading-panel > summary:focus-visible {
  color: #fff;
  background: rgba(255, 255, 255, 0.24);
  opacity: 1;
}

.ll-reading-panel > summary:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.34);
}

.ll-reading-panel__menu {
  position: absolute;
  right: 0;
  top: calc(100% + 0.45rem);
  width: min(18rem, calc(100vw - 1rem));
  background: var(--md-default-bg-color);
  color: var(--md-default-fg-color);
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 0.5rem;
  box-shadow: 0 0.5rem 1.4rem rgba(0, 0, 0, 0.2);
  padding: 0.72rem;
  display: grid;
  gap: 0.55rem;
  z-index: 40;
}

.ll-reading-panel__menu label {
  display: grid;
  gap: 0.25rem;
  font-size: 0.72rem;
  color: var(--md-default-fg-color--light);
}

.ll-reading-panel__menu select,
.ll-reading-panel__reset {
  font: inherit;
  color: var(--md-default-fg-color);
  background: var(--md-default-bg-color);
  border: 1px solid var(--md-default-fg-color--lighter);
  border-radius: 0.35rem;
  padding: 0.35rem 0.45rem;
}

.ll-reading-panel__menu select:focus,
.ll-reading-panel__reset:focus {
  outline: none;
  border-color: var(--md-primary-fg-color);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--md-primary-fg-color) 22%, transparent);
}

.ll-reading-panel__reset {
  cursor: pointer;
  margin-top: 0.35rem;
}

.ll-reading-panel__reset:hover,
.ll-reading-panel__reset:focus-visible {
  border-color: var(--md-primary-fg-color);
  color: var(--md-primary-fg-color);
}

@media (max-width: 48rem) {
  .ll-reading-panel {
    position: static;
  }

  .ll-reading-panel__menu {
    right: 0.25rem;
  }
}

/* Ensure slate palette exists when user selects dark/system-dark */
[data-md-color-scheme='slate'] {
  color-scheme: dark;
  --md-default-fg-color: hsla(0, 0%, 100%, 0.86);
  --md-default-fg-color--light: hsla(0, 0%, 100%, 0.7);
  --md-default-fg-color--lighter: hsla(0, 0%, 100%, 0.32);
  --md-default-fg-color--lightest: hsla(0, 0%, 100%, 0.12);
  --md-default-bg-color: hsla(225, 15%, 14%, 1);
  --md-default-bg-color--light: hsla(225, 15%, 14%, 0.54);
  --md-default-bg-color--lighter: hsla(225, 15%, 14%, 0.26);
  --md-default-bg-color--lightest: hsla(225, 15%, 14%, 0.1);
  --md-code-bg-color: hsla(225, 15%, 18%, 1);
  --md-code-fg-color: hsla(0, 0%, 96%, 0.92);
  --md-typeset-color: var(--md-default-fg-color);
  --md-typeset-a-color: var(--md-primary-fg-color--light);
  --md-typeset-table-color: hsla(0, 0%, 100%, 0.2);
  --md-typeset-table-color--light: hsla(0, 0%, 100%, 0.05);
}

/* Global proportional scaling */
html {
  font-size: calc(100% * var(--ll-font-scale, 1));
}

html[data-reader-font-size='sm'] { --ll-font-scale: 0.93; }
html[data-reader-font-size='md'] { --ll-font-scale: 1; }
html[data-reader-font-size='lg'] { --ll-font-scale: 1.09; }

/* Keep typeset tied to scale for clear visual impact */
.md-typeset {
  font-size: calc(0.8rem * var(--ll-font-scale, 1));
  line-height: var(--ll-line-height, 1.72);
  font-family: var(--ll-reading-font, var(--md-text-font-family));
}

.md-typeset p {
  margin: 0 0 var(--ll-paragraph-space, 1.08em);
}

html[data-reader-line-height='compact'] { --ll-line-height: 1.58; }
html[data-reader-line-height='comfortable'] { --ll-line-height: 1.72; }
html[data-reader-line-height='spacious'] { --ll-line-height: 1.9; }

html[data-reader-paragraph-spacing='compact'] { --ll-paragraph-space: 0.85em; }
html[data-reader-paragraph-spacing='comfortable'] { --ll-paragraph-space: 1.08em; }
html[data-reader-paragraph-spacing='spacious'] { --ll-paragraph-space: 1.35em; }

html[data-reader-font-family='sans'] { --ll-reading-font: var(--md-text-font-family); }
html[data-reader-font-family='serif'] { --ll-reading-font: Georgia, 'Times New Roman', serif; }