.base64-section{color:#e8edf7;padding:60px 24px 90px}.base64-container{width:100%;max-width:1000px;margin:0 auto}.base64-heading{margin-bottom:30px}.base64-heading .section-label{color:#52d9c5;letter-spacing:2px;margin-bottom:12px;font-size:12px;font-weight:700;display:block}.base64-heading h1{margin:0 0 12px;font-size:clamp(28px,4vw,40px);font-weight:700;line-height:1.2}.base64-heading p{color:#a5b3c9;margin:0;font-size:16px;line-height:1.6}.base64-panel{background:#111d32;border:1px solid #273750;border-radius:16px;padding:30px}.base64-panel label{color:#e8edf7;margin-bottom:12px;font-size:14px;font-weight:600;display:block}.base64-panel textarea{box-sizing:border-box;resize:vertical;color:#e8edf7;background:#0b1425;border:1px solid #34445e;border-radius:10px;outline:none;width:100%;min-height:170px;padding:18px;font-family:Consolas,Monaco,monospace;font-size:14px;line-height:1.6;transition:border-color .2s;display:block}.base64-panel textarea::placeholder{color:#72829a}.base64-panel textarea:focus{border-color:#52d9c5}.base64-panel textarea[readonly]{background:#0d192b}.base64-actions{flex-wrap:wrap;gap:12px;margin-top:20px;display:flex}.base64-actions button,.base64-copy-btn{cursor:pointer;border:1px solid #0000;border-radius:8px;padding:12px 22px;font-size:14px;font-weight:600;transition:background .2s,transform .2s}.base64-actions button:hover,.base64-copy-btn:hover{transform:translateY(-2px)}.base64-primary-btn{color:#081321;background:#52d9c5}.base64-primary-btn:hover{background:#78e9d8}.base64-secondary-btn{color:#e8edf7;background:#1c2c44;border-color:#34445e!important}.base64-secondary-btn:hover{background:#293b56}.base64-status{color:#a5b3c9;min-height:22px;margin:18px 0 26px;font-size:14px}.base64-status.success{color:#52d9c5}.base64-status.error{color:#ff818b}.base64-output-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.base64-output-header label{margin-bottom:0}.base64-copy-btn{color:#52d9c5;background:#1c2c44;border:1px solid #34445e;padding:9px 18px}.base64-copy-btn:hover{background:#293b56}@media (width<=600px){.base64-section{padding:35px 16px 60px}.base64-panel{padding:18px}.base64-actions{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.base64-actions button{padding:12px 10px}.base64-panel textarea{min-height:150px}}.base64-info ul,.base64-info ol{margin:12px 0 22px;padding-left:1.5rem}.base64-info li{margin-bottom:5px;padding-left:3px;line-height:1.65}.base64-info li::marker{color:#56ddc2}