.converter-page{--converter-color:#0b1b46;--converter-accent:#087af4;--converter-ink:#07183d}.converter-workflow{padding:clamp(24px,3vw,48px)}.converter-workspace-grid{grid-template-columns:minmax(0,1fr) minmax(360px,.9fr);gap:22px;display:grid}.converter-input-panel,.converter-result-panel{background:#f9fbffeb;border:1px solid #d8e4f7;border-radius:26px;padding:clamp(22px,2.2vw,34px)}.converter-input-hint{color:#52698f;margin:8px 0 20px;line-height:1.65}.converter-modes{border:0;margin:0 0 18px;padding:0}.converter-modes legend,.converter-examples legend{color:#243a63;margin-bottom:9px;font-weight:850}.converter-modes>div{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.converter-modes label{cursor:pointer}.converter-modes input{opacity:0;pointer-events:none;position:absolute}.converter-modes span{color:#476087;background:#fff;border:1px solid #ccd9ee;border-radius:13px;place-items:center;min-height:48px;font-weight:900;display:grid}.converter-modes input:checked+span{border-color:var(--converter-accent);color:#0870df;background:#eaf4ff;box-shadow:0 0 0 2px #087af41a}.converter-modes input:focus-visible+span{outline-offset:2px;outline:3px solid #087af440}#converter-form{gap:14px;display:grid}.converter-picker{color:var(--converter-ink);background:#fff;border:1px solid #d8e4f7;border-radius:16px;grid-template-columns:minmax(0,1fr) 62px;align-items:center;gap:12px;padding:12px 14px;font-weight:850;display:grid}.converter-picker input{cursor:pointer;background:#fff;border:1px solid #cbdaf1;border-radius:11px;width:62px;height:48px;padding:3px}.converter-mode-panel>label,.converter-channel-grid label{color:#243a63;gap:7px;font-weight:800;display:grid}.converter-mode-panel>input,.converter-channel-grid input{width:100%;min-width:0;min-height:52px;color:var(--converter-ink);font:inherit;background:#fff;border:1px solid #cbdaf1;border-radius:13px;padding:0 13px;font-weight:900}.converter-mode-panel>input:focus,.converter-channel-grid input:focus{border-color:var(--converter-accent);outline:0;box-shadow:0 0 0 3px #087af41f}.converter-channel-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.converter-channel-grid[hidden],.converter-mode-panel[hidden]{display:none}.converter-submit{width:100%;min-height:56px;margin-top:2px}.converter-examples{border:0;min-width:0;margin:22px 0 0;padding:0}.converter-examples>div{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;display:grid}.converter-examples button{color:#263c65;cursor:pointer;min-width:0;min-height:46px;font:inherit;text-align:left;background:#fff;border:1px solid #d5e0f2;border-radius:13px;align-items:center;gap:9px;padding:8px 11px;font-size:.84rem;font-weight:800;display:flex}.converter-examples button:hover{background:#f0f7ff;border-color:#8abcf6}.converter-examples button span{background:var(--example-color);border:1px solid #cbd7e9;border-radius:9px;flex:none;width:30px;height:30px}.converter-reset{width:100%;margin-top:12px}.converter-preview{color:#52698f;gap:10px;font-weight:850;display:grid}.converter-preview div{background:var(--converter-color);border:1px solid #d3def0;border-radius:22px;min-height:170px;box-shadow:inset 0 0 0 10px #fff3}.converter-results{gap:10px;margin-top:15px;display:grid}.converter-results article{background:#fff;border:1px solid #dbe6f7;border-radius:15px;grid-template-columns:74px minmax(0,1fr) auto;align-items:center;gap:10px;padding:12px;display:grid}.converter-results article>span{color:#64799d;font-size:.78rem;font-weight:850}.converter-results code{overflow-wrap:anywhere;min-width:0;color:var(--converter-ink);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.92rem;font-weight:800}.converter-results button{color:#126dd3;cursor:pointer;min-height:40px;font:inherit;background:#f6f9ff;border:1px solid #cbdaf1;border-radius:10px;padding:0 10px;font-size:.78rem;font-weight:850}.converter-copy-all{width:100%;margin-top:14px}.converter-copy-status{color:#087c64;min-height:22px;margin:8px 0 0;font-weight:750}.converter-scope-note{color:#52698f;background:#eef4ff;border-radius:13px;gap:8px;margin:8px 0 0;padding:12px;line-height:1.55;display:flex}@media (width<=1050px){.converter-workspace-grid{grid-template-columns:1fr}}@media (width<=680px){.converter-workflow{padding:20px 14px}.converter-input-panel,.converter-result-panel{border-radius:20px;padding:20px 16px}.converter-channel-grid,.converter-examples>div{grid-template-columns:1fr}}@media (width<=420px){.converter-results article{grid-template-columns:58px minmax(0,1fr)}.converter-results button{grid-column:1/-1}}