.learn-cue-list
{
    list-style: none;
    margin: 0;
    padding: 0;
}

.learn-cue-list li
{
    margin: 0 0 0.85rem;
    padding: 0.75rem 0.85rem;
    border-radius: 12px;
    border: 1px solid color-mix(in srgb, var(--accent) 18%, transparent);
    background: color-mix(in srgb, var(--accent) 5%, transparent);
}

.learn-cue-list li:last-child
{
    margin-bottom: 0;
}

.learn-cue-list strong
{
    display: block;
    margin-bottom: 0.25rem;
    font-size: 0.9rem;
    color: var(--accent-bright);
}

.learn-cue-list span
{
    display: block;
    font-size: 0.84rem;
    line-height: 1.5;
    color: var(--text-secondary, rgba(255, 255, 255, 0.72));
}

html[data-theme="light"] .learn-cue-list li
{
    border-color: rgba(179, 83, 0, 0.28);
    background: rgba(179, 83, 0, 0.06);
}

html[data-theme="light"] .learn-cue-list span
{
    color: var(--text-secondary);
}