.subs .editor-action-row.sub-buttons { flex-direction:row; flex-wrap:wrap; }
.subs .editor-action-row.sub-buttons > .button-filesub,
.subs .editor-action-row.sub-buttons > .button-checksub,
.subs .editor-action-row.sub-buttons > .button-synthesize { flex:1 1 220px; width:auto; min-width:0; }
.subs .editor-action-row.sub-buttons > #div_cptch:not(.none) { flex-basis:100%; }
.subs .button-checksub { display:flex; align-items:center; justify-content:center; gap:10px; padding:16px; min-height:60px; border:1px solid #bdcbdc; border-radius:12px; background:#edf3fa; color:#345271; font-family:inherit; font-size:16px; font-weight:600; line-height:1.35; cursor:pointer; }
.subs .button-checksub:hover { background:#dfeaf6; }
.subs .button-checksub.good { border-color:#8bc8a8; background:#e8f7ee; color:#237149; }
.subs .button-checksub.bad { border-color:#e0aa9c; background:#fff1eb; color:#973f27; }
.subs .button-checksub:disabled { opacity:.65; cursor:wait; }
.subs .button-checksub:focus-visible, .subs .subtitle-check-jump:focus-visible { outline:2px solid #2e58ef; outline-offset:3px; }
.subs .subtitle-step { display:inline-flex; align-items:center; justify-content:center; flex:0 0 24px; width:24px; height:24px; margin-right:6px; border:1px solid currentColor; border-radius:50%; font-size:13px; }
.subs .subtitle-check-status { margin:0; padding:0 20px 14px; color:#60738a; font-size:13px; }
.subs .editor-textarea-wrapper.has-subtitle-issues { display:grid; grid-template-columns:minmax(0,1fr) 330px; align-items:stretch; }
.subs .editor-textarea-wrapper.has-subtitle-issues > #mytextarea { display:block; min-width:0; margin:0; }
.subs .subtitle-check-issues[hidden] { display:none; }
.subs .subtitle-check-issues { display:flex; flex-direction:column; contain:size; min-width:0; min-height:0; overflow:hidden; box-sizing:border-box; border-left:1px solid #dde3eb; padding:0; background:#fbfcfe; }
.subs .subtitle-check-heading { flex:none; display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0; padding:10px 14px; border-bottom:1px solid #dde3eb; }
.subs .subtitle-check-heading h2 { margin:0; font-size:15px; font-weight:600; line-height:1.35; }
.subs .subtitle-check-heading button { flex:none; border:0; padding:0 4px; background:transparent; color:#526175; cursor:pointer; font-size:24px; line-height:1; }
.subs .subtitle-check-issues ol { flex:1 1 auto; min-height:0; overflow:auto; overscroll-behavior:contain; scrollbar-gutter:stable; list-style:none; padding:12px; margin:0; }
.subs .subtitle-check-issue { padding:10px; margin:0 0 10px; border:1px solid #edc5bd; border-radius:8px; background:#fff6f3; overflow-wrap:anywhere; }
.subs .subtitle-check-issue:last-child { margin-bottom:0; }
.subs .subtitle-check-issue.warning { border-color:#e9d4a1; background:#fffaf0; }
.subs .subtitle-check-issue strong { font-weight:600; color:#923d30; font-size:13px; }
.subs .subtitle-check-issue.warning strong { color:#8c6113; }
.subs .subtitle-check-issue p { margin:6px 0; padding:0; font-size:13px; line-height:1.5; }
.subs .subtitle-check-issue blockquote { margin:8px 0; padding:6px 8px; border-left:2px solid #bdc7d5; color:#556479; font:12px/1.5 monospace; white-space:pre-wrap; }
.subs .subtitle-check-jump { padding:2px 0; border:0; background:transparent; color:#2857bb; text-decoration:underline; font-family:inherit; font-size:13px; line-height:1.5; cursor:pointer; text-align:left; }
.subs .subtitle-check-jump:disabled { color:#8793a3; text-decoration:none; cursor:not-allowed; }
.subtitle-check-measure { position:fixed; top:0; left:0; visibility:hidden; pointer-events:none; box-sizing:border-box; border:0; margin:0; height:auto; min-height:0; max-height:none; white-space:pre-wrap; overflow-wrap:break-word; }
@media (max-width:800px) {
    .subs .editor-textarea-wrapper.has-subtitle-issues { grid-template-columns:minmax(0,1fr); }
    .subs .subtitle-check-issues { contain:none; max-height:280px; border-left:0; border-top:1px solid #dde3eb; }
    /* The stacked action buttons must not cover the panel below the textarea. */
    .subs .editor-textarea-wrapper.has-subtitle-issues + .editor-footer { position:static; }
}
@media (max-width:600px) {
    .subs .editor-action-row.sub-buttons { flex-direction:column; }
    .subs .editor-action-row.sub-buttons > .button-filesub,
    .subs .editor-action-row.sub-buttons > .button-checksub,
    .subs .editor-action-row.sub-buttons > .button-synthesize { flex:auto; width:100%; }
}