.base64-body{background:#f4f6f8;height:100%;min-height:100%;padding:clamp(1rem,3vw,2.5rem);overflow-y:auto}.base64-workspace{width:min(100%,68rem);margin:0 auto}.base64-file-bar{background:#fff;border:1px solid #dce3ee;border-radius:.8rem;align-items:center;gap:.9rem;margin-bottom:1rem;padding:.85rem 1rem;display:flex;box-shadow:0 3px 12px #0f172a0a}.base64-file-icon{color:#2563eb;background:#eff6ff;border-radius:.65rem;flex:none;place-items:center;width:2.7rem;height:2.7rem;display:grid}.base64-file-copy{flex:1;min-width:0}.base64-file-copy strong{color:#172033;text-overflow:ellipsis;white-space:nowrap;font-size:.9rem;display:block;overflow:hidden}.base64-file-actions{flex:none;align-items:center;gap:.5rem;display:flex}.base64-change-button,.base64-button{white-space:nowrap;cursor:pointer;border-radius:.5rem;justify-content:center;align-items:center;gap:.45rem;height:2.65rem;padding:0 .9rem;font-family:inherit;font-size:.78rem;font-weight:750;line-height:1;display:inline-flex}.base64-change-button{color:#526078;background:#fff;border:1px solid #cfd8e5}.base64-change-button:hover{color:#1d4ed8;background:#f8fafc;border-color:#8cabdf}.base64-panel{background:#fff;border:1px solid #dce3ee;border-radius:.9rem;overflow:hidden;box-shadow:0 8px 24px #0f172a0f}.base64-panel-body{gap:1.15rem;padding:clamp(1.15rem,3vw,1.8rem);display:grid}.base64-format{grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;display:grid}.base64-format button{text-align:left;cursor:pointer;background:#fff;border:1px solid #d9e1ec;border-radius:.6rem;gap:.16rem;padding:.82rem .9rem;display:grid}.base64-format button:hover{border-color:#9eb9e9}.base64-format button.active{background:#f0f6ff;border-color:#3b82f6;box-shadow:inset 0 0 0 1px #3b82f614}.base64-format strong{color:#253047;font-size:.8rem}.base64-format span{color:#748095;font-size:.69rem;line-height:1.4}.base64-output{border:1px solid #dfe5ee;border-radius:.65rem;overflow:hidden}.base64-output-heading{background:#f8fafc;border-bottom:1px solid #e3e8f0;justify-content:space-between;align-items:center;gap:1rem;padding:.68rem .8rem;display:flex}.base64-output-heading label{color:#344056;font-size:.72rem;font-weight:800}.base64-output-heading span{color:#27805a;font-size:.65rem;font-weight:750}.base64-output-heading span.truncated{color:#a15c16}.base64-output textarea{resize:vertical;color:#27364d;overflow-wrap:anywhere;background:#fcfdff;border:0;outline:none;width:100%;min-height:18rem;padding:1rem;font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:.74rem;line-height:1.65;display:block}.base64-output>p{color:#7c6547;background:#fffbeb;border-top:1px solid #f4e8ba;padding:.58rem .8rem;font-size:.66rem;line-height:1.45}.base64-local-note{color:#526078;background:#f8fafc;border-radius:.55rem;align-items:flex-start;gap:.55rem;padding:.78rem .85rem;font-size:.72rem;line-height:1.5;display:flex}.base64-local-note svg{color:#2563eb;flex:none}.base64-button.primary{color:#fff;background:#2563eb;border:1px solid #2563eb}.base64-button.primary:hover{background:#1d4ed8;border-color:#1d4ed8}.base64-button.secondary{color:#1d4ed8;background:#fff;border:1px solid #b9cbed}.base64-button.secondary:hover{background:#eff6ff;border-color:#7da3e5}.base64-change-button:focus-visible,.base64-button:focus-visible{outline-offset:2px;outline:3px solid #2563eb47}.base64-overlay{z-index:1000;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0f172a52;place-items:center;padding:1rem;display:grid;position:fixed;inset:0}.base64-processing{text-align:center;background:#fff;border-radius:.8rem;place-items:center;width:min(24rem,100%);padding:2rem;display:grid;box-shadow:0 20px 60px #0f172a33}.base64-spinner{border:3px solid #dbeafe;border-top-color:#2563eb;border-radius:50%;width:2.2rem;height:2.2rem;animation:.8s linear infinite base64-spin}.base64-processing h2{color:#172033;margin-top:.9rem;font-size:1.05rem}.base64-processing p{color:#69768b;margin-top:.35rem;font-size:.78rem}@keyframes base64-spin{to{transform:rotate(360deg)}}@media (width<=680px){.base64-body{padding:.7rem}.base64-file-bar{padding:.55rem .65rem;display:block}.base64-file-icon,.base64-file-copy{display:none}.base64-file-actions{grid-template-columns:auto minmax(0,1fr) minmax(0,1fr);gap:.4rem;width:100%;display:grid}.base64-file-actions .base64-button,.base64-file-actions .base64-change-button{gap:.3rem;width:100%;min-width:0;height:2.3rem;padding:0 .5rem;font-size:.68rem;overflow:hidden}.base64-file-actions .base64-change-button{width:2.3rem;padding:0}.base64-file-actions .base64-change-button .action-label{display:none}.base64-file-actions svg{width:15px;height:15px}.base64-output textarea{min-height:15rem}}@media (width<=440px){.base64-format{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){.base64-spinner{animation:none}}
