
:root{--qd3-accent:#2f6df6;--qd3-border:#e6eaf0}
.qd3-conv{background:#fff;border:1px solid var(--qd3-border);border-radius:16px;padding:18px;box-shadow:0 6px 18px rgba(0,0,0,.05);margin:18px 0;max-width:100%}
.qd3-title{font-size:22px;margin:0 0 14px;font-weight:800;color:#18923a}
.qd3-row{display:grid;grid-template-columns:minmax(0,1fr) 56px minmax(0,1fr);gap:12px;align-items:center}
@media (max-width:900px){.qd3-row{grid-template-columns:minmax(0,1fr)} .qd3-swap{width:100%}}
.qd3-box{display:flex;align-items:center;gap:12px;border:1.5px solid var(--qd3-border);border-radius:12px;padding:12px 14px;background:#fff;min-width:0;max-width:100%}
.qd3-input{flex:1;font-size:40px;line-height:1;border:none;outline:none;background:transparent;font-weight:800;min-width:0;max-width:100%}
.qd3-input::-webkit-outer-spin-button,.qd3-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.qd3-unit{display:flex;align-items:center;margin-left:auto}
.qd3-select{font-weight:700;border:none;background:#f7f9fc;border-radius:10px;padding:10px 12px;outline:none;max-width:100%}
.qd3-swap{height:56px;display:flex;align-items:center;justify-content:center;border-radius:12px;border:1.5px solid var(--qd3-border);background:#f2f6ff;color:#2f6df6;font-size:24px;font-weight:800;cursor:pointer;transition:.2s}
.qd3-swap:hover{transform:rotate(180deg)}
.qd3-sub{margin-top:10px;color:#222}
.qd3-sub b{font-weight:800}
.qd3-note{margin-top:14px;border:1px dashed var(--qd3-border);border-radius:12px;padding:12px;background:#fafbfc}
.qd3-note details{margin-top:6px}
.qd3-note summary{cursor:pointer;font-weight:700}
