.comment-feedback, .comment-context-status {
    margin: 12px 0 0;
    padding: 10px 14px;
    border-radius: 8px;
    background: #edf7f1;
    color: #0c4b33;
    overflow-wrap: anywhere;
}
.comment-feedback:empty { display: none; }
.comment-feedback.is-error { background: #fff2ed; color: #913d25; }
.comment-context-status button { border: 0; background: transparent; color: inherit; text-decoration: underline; }
.comment__container:target, .comment__container:focus {
    scroll-margin-top: 90px;
    /* app.css resets every focus outline with !important. */
    outline: 2px solid #44a87a !important;
    outline-offset: 5px;
    border-radius: 8px;
}
.comment-recovery { max-width: 780px; margin: 32px auto; padding: 28px; }
.comment-recovery textarea { margin: 10px 0 18px; }
.video-learning { margin: 24px 0; padding: 20px; background: #f3f8f5; border: 1px solid #dce9e1; border-radius: 12px; }
.video-learning-player { display: block; width: 100%; aspect-ratio: 16 / 9; height: auto; border: 0; border-radius: 8px; background: #14221b; }
.video-learning iframe { min-height: 180px; }
.video-learning-actions { margin: 14px 0 0; }
.video-learning-resource { margin-top: 18px; padding-top: 18px; border-top: 1px solid #dce9e1; overflow-wrap: anywhere; }
.video-learning-resource p, .video-learning-empty { line-height: 1.8; }
.video-learning-resource a { font-weight: 600; }
@media (max-width: 480px) {
    .video-learning { padding: 12px; }
    .video-learning-actions .home-button { width: 100%; text-align: center; }
    .video-learning iframe { min-height: 150px; }
    .comment-recovery { padding: 18px; }
}
