@font-face {
    font-family: 'Frank Ruhl Libre';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/study/frank-ruhl-libre-hebrew-400-normal.woff2') format('woff2');
    unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}

@font-face {
    font-family: 'Frank Ruhl Libre';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/study/frank-ruhl-libre-hebrew-700-normal.woff2') format('woff2');
    unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}

@font-face {
    font-family: 'Noto Serif Hebrew';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/study/noto-serif-hebrew-hebrew-400-normal.woff2') format('woff2');
    unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}

@font-face {
    font-family: 'Noto Serif Hebrew';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/study/noto-serif-hebrew-hebrew-700-normal.woff2') format('woff2');
    unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}

@font-face {
    font-family: 'Noto Rashi Hebrew';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/study/noto-rashi-hebrew-hebrew-400-normal.woff2') format('woff2');
    unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}

.study-hebrew {
    font-family: var(--study-font-family, 'Frank Ruhl Libre', serif);
    font-size: var(--study-font-size, 1.25rem);
    line-height: var(--study-line-height, 1.75);
    max-width: 38rem;
}

.study-hebrew--bible {
    --study-font-size: 1.35rem;
    --study-line-height: 1.95;
}

.study-line {
    display: grid;
    grid-template-columns: minmax(4.5rem, auto) 1fr;
    gap: 0.65rem 0.85rem;
    align-items: baseline;
    margin: 0 0 0.85rem;
}

.study-line-margin {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.2rem;
    color: var(--limud-muted);
    font-size: 0.72rem;
    line-height: 1.35;
    padding-top: 0.15rem;
}

.study-marker {
    display: block;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.study-marker--perek,
.study-marker--siman,
.study-marker--book {
    font-weight: 700;
    font-size: 0.82rem;
    color: var(--limud-text, #1a1a1a);
}

.study-marker--aliyah,
.study-marker--daf,
.study-marker--amud {
    font-weight: 600;
    font-size: 0.76rem;
    color: var(--limud-muted);
}

.study-marker--pasuk,
.study-marker--mishnah,
.study-marker--seif,
.study-marker--leaf {
    font-weight: 400;
    font-size: 0.7rem;
    color: var(--limud-muted);
}

.study-line-body {
    margin: 0;
}

.study-display-panel {
    margin: 0.75rem 0 1rem;
    padding: 0.75rem 1rem;
    border: 1px solid var(--limud-border);
    border-radius: 10px;
    background: #fafafa;
    font-size: 0.85rem;
}

.study-display-summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.35rem 0.5rem;
    cursor: pointer;
    font-weight: 600;
    color: var(--limud-muted);
    list-style: none;
}

.study-display-summary::-webkit-details-marker {
    display: none;
}

.study-display-summary-label {
    flex: 0 0 auto;
}

.study-display-symbol-toggles {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    justify-content: flex-end;
    margin-inline-start: auto;
}

.study-display-symbol-toggle {
    min-width: 2.25rem;
    min-height: 2.25rem;
    padding: 0.25rem 0.4rem;
    font-size: 1.05rem;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.study-display-symbol-toggle[aria-pressed="true"] {
    background: color-mix(in srgb, var(--limud-accent) 14%, #fff);
}

.study-display-dictionary-icon {
    display: block;
    fill: none;
    stroke: currentColor;
}

.study-display-grid {
    grid-area: content;
    display: grid;
    gap: 0.65rem;
    margin-top: 0.75rem;
}

.study-display-grid label {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    color: var(--limud-muted);
}

.study-display-grid select {
    font: inherit;
    padding: 0.35rem 0.5rem;
    border-radius: 8px;
    border: 1px solid var(--limud-border);
    background: #fff;
}

.study-display-toggles {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    align-items: center;
}

.study-display-hint {
    margin: 0;
    color: var(--limud-muted);
    font-size: 0.8rem;
}

.study-display-reset {
    font: inherit;
    font-size: 0.85rem;
    padding: 0.25rem 0.5rem;
    border: none;
    background: none;
    color: var(--limud-accent);
    cursor: pointer;
    text-decoration: underline;
}

.study-display-reset:disabled {
    opacity: 0.45;
    cursor: default;
    text-decoration: none;
}
