.codec-main{max-width:1100px;padding-block:12px 56px}.codec-crumb{display:block;font-size:13px;color:var(--muted);margin-bottom:14px}.codec-crumb a{text-decoration:underline}.codec-main h1{font-size:clamp(28px,4.4vw,42px);margin:8px 0;letter-spacing:-1px}.codec-lead{color:var(--muted);margin:8px 0 12px}.codec-private{display:inline-block;font-size:12px;background:#dcece2;color:#315d44;padding:6px 12px;border-radius:99px}.codec-tabs,.codec-actions,.codec-presets,.codec-secondary-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-start}.codec-tabs{margin:18px 0}.codec-tabs a{display:inline-flex;align-items:center;min-height:44px;padding:8px 14px;border:1px solid var(--line);border-radius:99px;background:var(--white);font-size:13px}.codec-tabs [aria-current]{background:var(--ink);color:var(--white)}.codec-presets{margin:16px 0 10px}.codec-main .button[aria-pressed=true]{background:#fbe0cd;border-color:#b94d27;color:#71341d;box-shadow:inset 0 0 0 1px #b94d27}.codec-flow-box{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;padding:12px 16px;border-radius:14px;background:#eee9df;border:1px solid var(--line);margin:12px 0}.codec-flow-label{font-size:12px;color:var(--muted);flex-shrink:0}.codec-flow-box strong{font-size:13px}.codec-flow-box p{font-size:15px;font-weight:750;margin:0;overflow-wrap:anywhere}.codec-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}.codec-panel,.codec-help{background:var(--white);border:1px solid var(--line);border-radius:20px;padding:22px;min-width:0}.codec-panel h2{font-size:19px;margin:0 0 16px}.codec-step{display:inline-grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#fbe0cd;color:#71341d;margin-right:8px;font-size:13px}.codec-panel label{display:block;font-size:14px;font-weight:650;margin-bottom:8px}.codec-field{margin-bottom:14px!important}.codec-options{border:0;border-top:1px solid var(--line);padding:16px 0 0;margin:16px 0 0;min-width:0}.codec-options legend{font-size:14px;font-weight:750;padding-right:8px}.codec-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.codec-fields label{min-width:0}.codec-main textarea,.codec-main select,.codec-main input[type=file]{display:block;width:100%;max-width:100%;font:inherit;font-size:16px;border:1px solid #c5b7a6;border-radius:10px;padding:10px;background:var(--white);color:var(--ink);min-width:0}.codec-main select{min-height:46px;margin-top:6px}.codec-main textarea{min-height:225px;resize:vertical;line-height:1.7;overflow-wrap:anywhere;tab-size:4;font-family:ui-monospace,"SFMono-Regular",Consolas,monospace}.codec-main textarea[readonly]{background:#faf7f1}.codec-main textarea[aria-invalid=true]{border-color:#a53124}.codec-hint,.codec-status{font-size:13px;color:var(--muted);overflow-wrap:anywhere}.codec-status{min-height:1.8em;margin:14px 0 0}.codec-error{color:#a53124;font-size:14px;overflow-wrap:anywhere}.codec-state{font-size:13px;font-weight:750;color:var(--muted);margin:14px 0 6px}.codec-state[data-state=stale],.codec-state[data-state=binary]{color:#815016}.codec-state[data-state=error]{color:#a53124}.codec-state[data-state=ready]{color:#315d44}.codec-summary{font-size:15px;font-weight:750;color:#315d44;margin:6px 0 12px;overflow-wrap:anywhere}.codec-actions{margin:14px 0 0}.codec-secondary-actions{align-items:center;margin:12px 0 0}.codec-shortcut{font-size:12px;color:var(--muted)}.codec-main button{min-height:44px;font-family:inherit;cursor:pointer}.codec-main button:disabled{opacity:.55;cursor:not-allowed;transform:none}.codec-main select:disabled{background:#f3f0ea;color:#6c625a}.codec-main :is(button,input,select,textarea,summary):focus-visible,.codec-output:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.codec-main details summary{min-height:44px;padding-block:10px;cursor:pointer;font-weight:700;font-size:13px}.codec-panel .codec-check{display:flex;align-items:center;gap:8px;font-size:13px;min-height:44px;font-weight:400}.codec-check input{width:18px;height:18px;flex-shrink:0}.codec-check:has(input:disabled){color:var(--muted)}.codec-download-help{margin-top:12px}.codec-download-help p{font-size:13px;color:var(--muted);margin-top:0}.codec-back{margin-top:12px}.codec-help{margin-top:24px;font-size:14px}.codec-help li{margin-block:10px}.codec-help ul{padding-left:20px}.codec-main [hidden]{display:none!important}.codec-links{display:grid;gap:16px;margin-top:24px}.codec-links a{display:block;border:1px solid var(--line);border-radius:18px;padding:20px;background:var(--white)}.codec-links strong{display:block;font-size:20px}.codec-links span{font-size:14px;color:var(--muted)}
.codec-advanced[open],.codec-layout-options[open]{background:#f5f0e7;border:1px solid var(--line);border-radius:12px;padding:0 14px 12px}.codec-layout-options{margin-bottom:14px}.codec-layout-options select{max-width:360px}.codec-normalization{font-size:14px;background:#edf3ec;padding:12px;border-radius:12px;margin-top:14px}.codec-normalization p{margin-top:0}#codec-form[data-layout=stack] .codec-grid{grid-template-columns:1fr}#codec-form[data-layout=stack]{max-width:760px;margin-inline:auto}
.codec-section{margin-top:28px}.codec-section h2{font-size:20px;margin:0 0 12px;letter-spacing:-.3px}.codec-section .codec-links{margin-top:0}.codec-main>.codec-private{margin-bottom:4px}@media(max-width:900px){.codec-main .codec-grid{grid-template-columns:1fr}.codec-fields{grid-template-columns:1fr;gap:8px}.codec-panel,.codec-help{padding:16px}.codec-main textarea{min-height:195px}.codec-actions .button,.codec-presets .button{flex:1 1 auto;padding-inline:12px}.codec-flow-box p{flex-basis:100%}.codec-tabs{gap:8px}.codec-tabs a{padding-inline:11px}.codec-shortcut{flex-basis:100%}}
@media(pointer:coarse) and (hover:none){#codec-form[data-layout=auto] .codec-grid{grid-template-columns:1fr}#codec-form[data-layout=auto]{max-width:760px;margin-inline:auto}}
@media(prefers-reduced-motion:reduce){.codec-main *{scroll-behavior:auto}}
@media(max-width:720px){.codec-main .codec-presets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.codec-main .codec-presets .button{width:100%;min-width:0;padding-inline:8px}}