.b64{gap:var(--s5);display:grid}.b64-grid{gap:var(--s5);grid-template-columns:1fr 1fr;align-items:start;display:grid}.b64-modes{background:var(--surface-2);border-radius:var(--r-md);flex-wrap:wrap;gap:2px;width:fit-content;max-width:100%;padding:3px;display:flex}.b64-modes button{min-height:40px;padding:0 var(--s5);font-size:var(--step--1);color:var(--ink-1);transition:background var(--dur) var(--ease), color var(--dur) var(--ease);border-radius:7px}.b64-modes button[aria-pressed=true]{background:var(--surface-0);color:var(--ink-0);box-shadow:var(--shadow-1)}.b64-modes span{color:var(--ink-2);margin:0 2px}.b64-in{background:var(--surface-1);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s5)}.b64-drop{place-items:center;gap:var(--s3);padding:var(--s8) var(--s4);text-align:center;background:var(--surface-2);border:1.5px dashed var(--line-firm);border-radius:var(--r-lg);color:var(--ink-1);min-height:300px;transition:border-color var(--dur) var(--ease), background var(--dur) var(--ease);align-content:center;display:grid}.b64-drop.b64-over{border-color:var(--brass);background:var(--brass-wash)}.b64-drop svg{color:var(--ink-2)}.b64-big{font-size:var(--step-1);color:var(--ink-0)}.b64-fine{font-size:var(--step--1);color:var(--ink-2);max-width:48ch}.b64-fine code,.b64-empty code,.b64-notes code,.b64-verdict code{font-family:var(--font-mono);background:var(--surface-2);border-radius:var(--r-sm);padding:.1em .3em}.b64-err{font-size:var(--step--1);color:var(--error);max-width:46ch;margin-top:var(--s3)}.b64-pick span{min-height:44px;padding:11px var(--s5);background:var(--brass);color:var(--on-brass);border-radius:var(--r-md);cursor:pointer;transition:background var(--dur) var(--ease);font-weight:500;display:inline-block}.b64-pick span:hover{background:var(--brass-hi)}.b64-preview{padding:var(--s4);background:var(--surface-2);border-radius:var(--r-lg);gap:var(--s3);justify-items:center;margin:0;display:grid}.b64-preview img{border-radius:var(--r-md);width:auto;max-width:100%;max-height:220px;box-shadow:var(--shadow-1)}.b64-preview figcaption{justify-content:space-between;align-items:center;gap:var(--s4);width:100%;font-size:var(--step--1);color:var(--ink-2);display:flex}.b64-name{text-overflow:ellipsis;white-space:nowrap;color:var(--ink-1);overflow:hidden}.b64-reset{font-size:var(--step--1);color:var(--ink-1);border-bottom:1px solid var(--brass);flex:none;min-height:30px}.b64-reset:hover{color:var(--ink-0)}.b64-decoded{margin-bottom:var(--s4)}.b64-decoded figcaption{justify-content:center}.b64-cost{margin-top:var(--s4);padding:var(--s4);border-radius:var(--r-md);background:var(--surface-2);border-left:3px solid var(--line-firm);min-height:150px}.b64-cost[data-verdict=ideal]{border-left-color:var(--ok)}.b64-cost[data-verdict=caution]{border-left-color:var(--warn)}.b64-cost[data-verdict=excessive]{border-left-color:var(--error)}.b64-facts{gap:var(--s3) var(--s5);flex-wrap:wrap;margin:0;display:flex}.b64-facts dt{font-family:var(--font-mono);font-size:var(--step--1);text-transform:uppercase;letter-spacing:.08em;color:var(--ink-2)}.b64-facts dd{font-size:var(--step--1);margin:2px 0 0}.b64-num{font-size:var(--step-0);color:var(--ink-0)}.b64-grow{color:var(--brass-lo)}.b64-cost[data-verdict=excessive] .b64-grow{color:var(--error)}.b64-verdict{margin-top:var(--s4);font-size:var(--step--1);color:var(--ink-1);max-width:62ch;line-height:1.6}.b64-verdict strong{color:var(--ink-0)}.b64-verdict a{color:var(--brass-lo);text-decoration:underline}.b64-thresholds{margin-top:var(--s3);letter-spacing:.03em;color:var(--ink-2);font-size:11px}.b64-set{margin-top:var(--s4);padding-top:var(--s4);border-top:1px solid var(--line);gap:var(--s3);display:grid}.b64-lbl{font-family:var(--font-mono);font-size:var(--step--1);text-transform:uppercase;letter-spacing:.08em;color:var(--ink-2);display:block}.b64-seg{background:var(--surface-2);border-radius:var(--r-md);flex-wrap:wrap;gap:2px;padding:3px;display:flex}.b64-seg button{min-height:38px;padding:0 var(--s3);font-size:var(--step--1);color:var(--ink-1);transition:background var(--dur) var(--ease), color var(--dur) var(--ease);border-radius:7px}.b64-seg button[aria-pressed=true]{background:var(--surface-0);color:var(--ink-0);box-shadow:var(--shadow-1)}.b64-note{font-size:var(--step--1);color:var(--ink-2)}.b64-field{gap:var(--s2);display:grid}.b64-field span{font-family:var(--font-mono);font-size:var(--step--1);text-transform:uppercase;letter-spacing:.08em;color:var(--ink-2)}.b64-field input{width:100%;min-height:44px;padding:0 var(--s3);background:var(--surface-0);border:1px solid var(--line);border-radius:var(--r-md);color:var(--ink-0);transition:border-color var(--dur) var(--ease);font-size:16px}.b64-field input:focus{border-color:var(--brass);outline:none}.b64-head{justify-content:space-between;align-items:center;gap:var(--s3);flex-wrap:wrap;display:flex}.b64-clear{font-size:var(--step--1);color:var(--ink-1);border-bottom:1px solid var(--brass);min-height:24px}.b64-clear:hover{color:var(--ink-0)}.b64-in textarea{width:100%;margin-top:var(--s3);padding:var(--s4);background:var(--surface-0);border:1px solid var(--line);border-radius:var(--r-md);resize:vertical;line-height:1.6;font-family:var(--font-mono);font-size:var(--step--1);word-break:break-all;transition:border-color var(--dur) var(--ease)}.b64-in textarea:focus{border-color:var(--brass);outline:none}.b64-in textarea::placeholder{color:var(--ink-2);opacity:.55}.b64-instats{margin-top:var(--s4);padding-top:var(--s4);border-top:1px solid var(--line);min-height:54px}.b64-notes{margin:var(--s4) 0 0;padding-left:var(--s5);gap:var(--s2);font-size:var(--step--1);color:var(--ink-1);max-width:60ch;display:grid}.b64-out{background:var(--surface-1);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s5);min-height:320px;box-shadow:var(--shadow-1);transition:box-shadow .26s var(--ease), border-color .26s var(--ease)}.b64-out.b64-has{box-shadow:var(--shadow-2);border-color:var(--line-firm)}.b64-stub{justify-content:space-between;align-items:baseline;gap:var(--s3);display:flex}.b64-no{color:var(--brass-lo);font-size:var(--step--1);letter-spacing:.04em}.b64-sum{color:var(--ink-2);font-size:var(--step--1);text-align:right}.b64-perf{height:1px;margin:var(--s4) calc(-1 * var(--s5));background-image:linear-gradient(90deg, var(--line-firm) 55%, transparent 0);background-size:9px 1px;position:relative}.b64-perf:before,.b64-perf:after{content:"";border-radius:var(--r-full);background:var(--surface-0);border:1px solid var(--line);width:14px;height:14px;position:absolute;top:-7px}.b64-perf:before{left:-7px}.b64-perf:after{right:-7px}.b64-empty{color:var(--ink-2);font-size:var(--step--1);max-width:44ch}.b64-result{font-size:var(--step--1);white-space:pre-wrap;word-break:break-all;max-height:420px;line-height:1.55;overflow:auto}.b64-more{margin-top:var(--s3);color:var(--ink-2);font-size:var(--step--1)}.b64-acts{gap:var(--s3);margin-top:var(--s5);flex-wrap:wrap;display:flex}.b64-primary,.b64-ghost{min-height:44px;padding:0 var(--s5);border-radius:var(--r-md);font-size:var(--step--1);transition:background var(--dur) var(--ease), border-color var(--dur) var(--ease);justify-content:center;align-items:center;text-decoration:none;display:inline-flex}.b64-primary{background:var(--brass);color:var(--on-brass);font-weight:500}.b64-primary:hover{background:var(--brass-hi)}.b64-ghost{background:var(--surface-0);border:1px solid var(--line-firm);color:var(--ink-1)}.b64-ghost:hover{border-color:var(--brass);color:var(--ink-0)}.b64-error{animation:b64-land .26s var(--ease) both}@keyframes b64-land{0%{opacity:0;transform:translateY(-4px)}}@media (prefers-reduced-motion:reduce){.b64-error{animation:none}}.b64-pos{font-size:var(--step--1);letter-spacing:.04em;text-transform:uppercase;color:var(--error)}.b64-msg{margin-top:var(--s2);font-size:var(--step-0);max-width:58ch}.b64-hint{margin-top:var(--s4);font-size:var(--step--1);color:var(--ink-1);border-left:2px solid var(--brass);padding-left:var(--s3);max-width:60ch;line-height:1.6}.b64-warnbox{margin-bottom:var(--s4);padding:var(--s3) var(--s4);border-radius:var(--r-md);background:var(--surface-2);border-left:3px solid var(--warn);font-size:var(--step--1);color:var(--ink-1);max-width:60ch}@media (width<=860px){.b64-grid{grid-template-columns:1fr}.b64-out{min-height:0}.b64-result{max-height:300px}.b64-drop{min-height:240px}.b64-modes{width:100%}.b64-modes button{padding:0 var(--s3);flex:1}.b64-acts{bottom:var(--s3);position:sticky}.b64-primary,.b64-ghost{flex:1}}