.encoding-page { padding-top: 86px; }
.encoding-page .utility-main { padding-top: 1rem; }
.encoding-page .breadcrumb-item.active { color: var(--tool-text-soft) !important; }
.encoding-page .utility-panel + .utility-panel { margin-top: 0; }
.encoding-page :is(a, button, input, select, summary, [tabindex]):focus-visible {
    outline: 3px solid var(--tool-cyan);
    outline-offset: 4px;
}
.encoding-skip { position: fixed; left: 1rem; top: -100px; z-index: 1100; padding: 1rem; background: var(--tool-panel); }
.encoding-skip:focus { top: 1rem; }
.encoding-dropzone { padding: 1.25rem; border: 2px dashed var(--tool-border-strong); border-radius: 8px; background: #071321; }
.encoding-dropzone.dragging { border-color: var(--tool-cyan); background: var(--tool-panel-strong); }
.encoding-dropzone label { display: block; margin-bottom: .75rem; font-weight: 800; }
.encoding-dropzone p { margin: .75rem 0 0; font-size: .9rem; }
.encoding-page input[type="file"] { min-width: 0; padding: .5rem; font-size: .9rem; }
.encoding-page input[type="file"]::file-selector-button { color: var(--tool-text); background: var(--tool-panel-strong); border: 1px solid var(--tool-border-strong); border-radius: 5px; padding: .45rem .6rem; margin-right: .6rem; cursor: pointer; }
.encoding-file-info { margin: 1rem 0; overflow-wrap: anywhere; }
.encoding-note { margin: .8rem 0; font-size: .9rem; line-height: 1.65; }
.encoding-confirmation { display: flex; gap: .65rem; align-items: start; padding: .8rem; border: 1px solid var(--tool-border-strong); border-radius: 8px; }
.encoding-confirmation[hidden] { display: none; }
.encoding-confirmation input { width: 20px; height: 20px; flex: 0 0 auto; margin-top: .2rem; accent-color: var(--tool-cyan); }
.encoding-confirmation label { font-size: .9rem; }
.encoding-preview { height: 350px; margin: 0; font-family: Consolas, 'Courier New', monospace; font-size: .9rem; }
.encoding-content { margin-top: 1.5rem; }
.encoding-page .faq-list { display: block; }
.encoding-content h3 { margin-top: 1.5rem; font-size: 1.1rem; }
.encoding-content code { color: #f5c4e5; overflow-wrap: anywhere; }
.encoding-table-wrap { overflow-x: auto; margin: 1rem 0; }
.encoding-table { width: 100%; min-width: 500px; border-collapse: collapse; }
.encoding-table th, .encoding-table td { padding: .8rem; border-bottom: 1px solid var(--tool-border); text-align: left; color: var(--tool-text-soft); vertical-align: top; }
.encoding-table thead th { color: var(--tool-text); background: var(--tool-bg-soft); }
.encoding-table caption { color: var(--tool-text-soft); caption-side: top; font-size: .9rem; }
@media (prefers-reduced-motion: reduce) { .encoding-page *, .encoding-page { scroll-behavior: auto; transition: none; } }
@media (max-width: 640px) { .encoding-dropzone { padding: .8rem; } .encoding-preview { height: 280px; } }
