/* UTIL-049 Base64 và URL Encode/Decode. Dùng font của bộ giao diện (Arial); tiêu đề 700; không ghi đè font icon. */
.sou-b64-banner{margin:0 0 14px;font-weight:400}
.sou-b64-banner strong{font-weight:700}
.sou-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 18px;padding:4px;border-radius:14px;background:var(--sou-soft);border:1px solid var(--sou-line)}
.sou-tabs [role=tab]{flex:1 1 auto;min-height:44px;padding:8px 14px;border:0;border-radius:10px;background:transparent;color:var(--sou-ink);font:700 15px Arial,"Helvetica Neue",Helvetica,sans-serif;cursor:pointer}
.sou-tabs [role=tab]:hover{background:#e6eeff}
.sou-tabs [role=tab][aria-selected=true]{background:#fff;color:var(--sou-primary);box-shadow:0 2px 8px rgba(16,36,94,.12)}
.sou-tabs [role=tab]:focus-visible{outline:2px solid #3869ed;outline-offset:2px}
.sou-b64-opts{align-items:flex-start;gap:0 14px}
.sou-b64-opts .sou-check{min-height:44px;padding:6px 0}
.sou-page .sou-b64-opts .sou-field>.sou-check{display:flex;margin:0;font-weight:400;color:var(--sou-text)}
.sou-page textarea.sou-b64-out{min-height:220px;background:#fff;overflow-wrap:anywhere;word-break:break-all}
.sou-result h2{font-size:18px}
.sou-b64-stale{font-size:14px;font-weight:400;color:var(--sou-warn)}
.sou-b64-note{font-size:13px}
.sou-b64-choice{margin:0 0 12px;padding:12px 14px;border:1px solid #f0d39a;border-radius:12px;background:var(--sou-warn-bg);color:var(--sou-warn)}
.sou-b64-choice p{margin:0 0 4px;font-weight:700}
.sou-b64-filebox h2{font-size:19px;margin:0 0 12px}
.sou-b64-filebox .sou-drop{min-height:150px}
.sou-b64-filebox .sou-drop span:last-of-type{color:var(--sou-muted);font-size:14px}
.sou-b64-filebox [data-file-info]{overflow-wrap:anywhere}
.sou-b64-filebox .sou-progress{margin:0 0 8px}
.sou-b64-decoded{margin-top:4px;padding:14px;border:1px solid var(--sou-line);border-radius:14px;background:#f7f9fd}
.sou-b64-facts{margin:0 0 10px;padding:0;list-style:none;font-size:14px;overflow-wrap:anywhere}
.sou-b64-facts li{margin:3px 0}
.sou-b64-facts strong{color:var(--sou-ink)}
.sou-b64-decoded .sou-alert{font-size:14px}
.sou-b64-preview{margin-top:14px}
.sou-b64-preview img{display:block;max-height:320px;margin-top:4px}
.sou-b64-text{margin:4px 0 0;padding:10px 12px;max-height:240px;overflow:auto;border:1px solid var(--sou-line);border-radius:10px;background:#fff;font:14px/1.5 Arial,"Helvetica Neue",Helvetica,sans-serif;white-space:pre-wrap;overflow-wrap:anywhere}
@media(max-width:600px){.sou-tabs [role=tab]{flex:1 1 40%;padding:8px 10px;font-size:14px}.sou-toolbar .sou-button{flex:1 1 auto}}
@media print{.sou-tabs,.sou-b64-banner,.sou-actions{display:none!important}}