.downloads button {
    background: transparent;
    color: var(--ink);
}

.downloads button:hover {
    background: #27334f;
    color: var(--sheet);
}

.score-preview-frame {
    display: block;
    width: 100%;
    height: min(70vh, 40rem);
    margin: 0 0 1.8rem;
    border: 1px solid var(--rule);
    border-radius: 3px;
    background: var(--sheet);
}

.score-preview-frame[hidden] {
    display: none;
}

.score-preview-shell[hidden] {
    display: none;
}

.score-preview-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .8rem;
    min-height: 9rem;
    margin: 0 0 1.8rem;
    border: 1px solid var(--rule);
    border-radius: 3px;
    background: var(--sheet);
    color: var(--ink);
}

.score-preview-loading[hidden] {
    display: none;
}

.score-preview-spinner {
    width: 1.35rem;
    height: 1.35rem;
    border: .18rem solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: score-preview-spin .75s linear infinite;
}

@keyframes score-preview-spin {
    to { transform: rotate(360deg); }
}
