.url-codec{--codec-border:#dce3ed;--codec-text:#26364c;--codec-muted:#63748b;color:var(--codec-text);width:100%;max-width:100%;font-size:.94rem}.url-codec *{box-sizing:border-box}.url-codec .codec-panel{border:1px solid var(--codec-border);border-radius:12px;padding:18px;background:#fff}.url-codec .codec-label{display:block;font-size:.86rem;font-weight:700;margin-bottom:7px}.url-codec .codec-textarea{width:100%;min-height:144px;resize:vertical;line-height:1.55;font:13px/1.6 ui-monospace,SFMono-Regular,Consolas,'Liberation Mono',monospace;overflow-wrap:anywhere}.url-codec .codec-output{min-height:124px;background:#fff}.url-codec .codec-count,.url-codec .codec-muted{font-size:.78rem;color:var(--codec-muted)}.url-codec .codec-actions{display:flex;gap:10px;align-items:stretch}.url-codec .codec-reset{width:53px;flex:0 0 53px}.url-codec .btn-calc{background:#2358aa;border:1px solid #2358aa;color:#fff;font-weight:600}.url-codec .btn-calc:hover,.url-codec .btn-calc:focus{background:#194689;border-color:#194689;color:#fff}.url-codec .codec-highlight{background:#F0F5FE;border:1px solid #dce6f7;border-radius:12px;padding:18px}.url-codec .codec-stat{background:#f6f8fb;border:1px solid var(--codec-border);border-radius:8px;padding:12px 6px;min-width:0}.url-codec .codec-stat small{display:block;color:var(--codec-muted);font-size:.75rem;line-height:1.3}.url-codec .codec-stat strong{display:block;font-size:1.2rem;overflow-wrap:anywhere;margin-top:5px}.url-codec .codec-track{height:16px;border-radius:4px;background:#e9edf3;overflow:hidden}.url-codec .codec-bar{height:100%;width:0;transition:width .25s ease}.url-codec .codec-bar-input{background:#5485c9}.url-codec .codec-bar-output{background:#153d7c}.url-codec .codec-table{font-size:.83rem}.url-codec .form-control:focus,.url-codec .form-select:focus{border-color:#6794d7;box-shadow:0 0 0 .17rem rgba(35,88,170,.12)}@media(max-width:575.98px){.url-codec .codec-panel,.url-codec .codec-highlight{padding:13px}.url-codec .codec-actions{width:100%}.url-codec .codec-textarea{min-height:135px}.url-codec .codec-stat strong{font-size:1.05rem}}@media(prefers-reduced-motion:reduce){.url-codec .codec-bar{transition:none}}