.at-cursor-bar {
    background: rgba(37, 99, 235, 0.1);
}

.at-cursor-beat {
    background: rgba(37, 99, 235, 0.65);
    width: 3px;
}

.at-selection div {
    background: rgba(37, 99, 235, 0.35);
}

.notation-strip,
.notation-sheet {
    isolation: isolate;
}

.notation-strip {
    position: relative;
    overflow-x: auto;
    min-height: 181px;
    margin-inline: calc(-1 * var(--card-p, 1.5rem));
    scrollbar-width: none;
    mask-image: linear-gradient(
        to right,
        transparent,
        black 24px,
        black calc(100% - 24px),
        transparent
    );
}

.notation-sheet {
    position: relative;
    overflow-y: scroll;
    background: #ffffff;
    border-radius: 0.5rem;
    border: 1px solid var(--color-base-300);
}

@media (width >= 64rem) {
    /* Leaves room for main's p-6 above and below. */
    .notation-preview {
        height: calc(100dvh - 3rem);
    }

    .notation-preview .notation-sheet {
        flex: 1;
        min-height: 0;
    }
}