.mt-reader-tools,
.mt-translation-view {
    --mt-reader-ink: #17191b;
    --mt-reader-red: #b70824;
    --mt-reader-line: #dfe3e6;
    font-family: inherit;
}

.mt-editor-summary { margin: 0 0 24px; padding: 17px 19px; background: #eef6fb; border-left: 4px solid #075a96; }
.mt-editor-summary strong { display: block; margin-bottom: 6px; color: #075a96; font-size: 12px; }
.mt-editor-summary p { margin: 0; color: #20262a; font-size: 16px; line-height: 1.65; font-weight: 650; }

.mt-reader-tools {
    margin: 0 0 24px;
    padding: 14px 16px 11px;
    color: var(--mt-reader-ink);
    background: #f7f8f9;
    border: 1px solid var(--mt-reader-line);
    border-top: 3px solid var(--mt-reader-ink);
}

.mt-reader-tools__heading,
.mt-reader-tools__controls {
    display: flex;
    align-items: center;
}

.mt-reader-tools__heading { gap: 10px; margin-bottom: 11px; }
.mt-reader-tools__heading > span { width: 34px; height: 34px; display: grid; place-items: center; color: #fff; background: var(--mt-reader-ink); font: 700 14px/1 sans-serif; }
.mt-reader-tools__heading strong,
.mt-reader-tools__heading small { display: block; }
.mt-reader-tools__heading strong { font-size: 14px; }
.mt-reader-tools__heading small { margin-top: 2px; color: #667078; font-size: 10px; }
.mt-reader-tools__controls { flex-wrap: wrap; gap: 8px; }

.mt-reader-button,
.mt-reader-icon-button,
.mt-reader-speed,
.mt-reader-language {
    min-height: 42px;
    border: 1px solid #cfd5d9;
    border-radius: 3px;
    background: #fff;
}

.mt-reader-button,
.mt-reader-icon-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 8px 13px; color: var(--mt-reader-ink); cursor: pointer; font: 700 12px/1.2 inherit; }
.mt-reader-button:hover { border-color: var(--mt-reader-ink); }
.mt-reader-play { color: #fff; background: var(--mt-reader-red); border-color: var(--mt-reader-red); }
.mt-reader-play:hover { background: #97051d; border-color: #97051d; }
.mt-reader-icon-button { width: 42px; padding: 0; }
.mt-reader-icon-button:disabled { cursor: not-allowed; opacity: .45; }
.mt-reader-speed,
.mt-reader-language { display: inline-flex; align-items: center; gap: 5px; padding-left: 9px; color: #59636b; font-size: 10px; }
.mt-reader-speed select,
.mt-reader-language select { min-height: 40px; padding: 0 24px 0 5px; background: transparent; border: 0; font: 700 12px/1 inherit; }
.mt-reader-status { min-height: 20px; padding-top: 7px; color: #4e5961; font-size: 11px; line-height: 1.5; }
.mt-reader-status.is-error { color: #9b1026; }
.mt-reader-status a { color: #005d9e !important; font-weight: 700; }
.mt-reader-progress { height: 2px; overflow: hidden; background: #e1e5e8; }
.mt-reader-progress span { width: 0; height: 100%; display: block; background: var(--mt-reader-red); transition: width .2s linear; }

.mt-translation-view { margin: 0 0 30px; padding: 20px; background: #fffdf7; border: 1px solid #e5dcc4; border-top: 4px solid #c28b00; }
.mt-translation-view[hidden] { display: none !important; }
.mt-translation-view__header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 13px; border-bottom: 1px solid #e5dcc4; }
.mt-translation-view__header strong { font-size: 20px; line-height: 1.4; }
.mt-translation-view__header button { flex: 0 0 auto; padding: 8px 10px; color: #111; background: #fff; border: 1px solid #bbb; cursor: pointer; font: 700 11px/1.2 inherit; }
.mt-translation-view__excerpt { color: #41484d; font-size: 16px; line-height: 1.65; font-weight: 650; }
.mt-translation-view__content { color: #1d2022; font-family: var(--mt-serif, serif); font-size: 18px; line-height: 1.85; }
.mt-translation-disclosure { margin: 24px 0 0; padding-top: 10px; color: #6c7277; border-top: 1px solid #e5dcc4; font-size: 10px; }

@media (max-width: 560px) {
    .mt-reader-tools { margin-inline: -2px; padding: 12px; }
    .mt-reader-tools__controls { display: grid; grid-template-columns: minmax(0, 1fr) 42px minmax(84px, .7fr); }
    .mt-reader-translate { grid-column: span 2; }
    .mt-reader-language { min-width: 0; }
    .mt-reader-language select { width: 100%; }
    .mt-translation-view { margin-inline: -2px; padding: 16px; }
    .mt-translation-view__header { align-items: flex-start; flex-direction: column; }
}