.zv-conversion{position:relative;background:radial-gradient(ellipse at 25% 43%,#21446380,transparent 56%),#071b31;color:#ecf1f6;padding:65px 6% 70px;min-height:0;scroll-margin-top:132px;direction:rtl}.zv-heading{display:flex;justify-content:space-between;align-items:center;gap:45px;margin-bottom:35px}.zv-kicker{font-size:11px;line-height:2;color:#cbb57f}.zv-heading h2{font-size:clamp(34px,3.7vw,54px);font-weight:500;line-height:1.65;margin:13px 0}.zv-heading h2 em{font-style:normal;color:#e4c68c}.zv-heading>div:last-child{padding-right:32px;border-right:1px solid #acbcd033;max-width:340px}.zv-edition{font-size:10px;letter-spacing:3px;color:#adc0d0}.zv-heading p{font-size:14px;line-height:2.2;color:#a5bbcc}.zv-sticky{position:relative;top:auto;display:grid;grid-template-columns:1.12fr 1fr;gap:7%;direction:ltr;align-items:center;max-width:1300px;margin:auto}.zv-visual{min-width:0}.zv-visual-note{text-align:center;color:#91a9bd;font-size:10px;margin:10px 0;line-height:1.9}.zv-calculator{direction:rtl;background:linear-gradient(140deg,#1b3756cc,#102c48bb);border:1px solid #b7c6d033;border-top-color:#c8b18388;border-radius:18px;padding:30px;box-shadow:0 22px 70px #020d1820}.zv-card-head{display:flex;flex-direction:row-reverse;align-items:center;gap:15px;justify-content:space-between;margin-bottom:28px}.zv-card-head>span{font-size:15px;white-space:nowrap;color:#bcd1e2;direction:ltr}.zv-card-head i{font-style:normal;color:#ddc083;margin:0 6px}.zv-card-head h3{font-size:20px;font-weight:500;margin:0;line-height:1.8}.zv-calculator>label{font-size:12px;color:#b1c4d6;display:block;margin-bottom:11px}.zv-input{display:flex;align-items:center;border:1px solid #abc1d443;border-radius:10px;background:#031a3199;height:72px;padding:0 18px;gap:15px}.zv-input input{width:100%;min-width:0;border:0;background:none;color:#fff;font-size:26px;outline:0}.zv-input:focus-within{border-color:#d4b67b;box-shadow:0 0 0 3px #dfbe7a12}.zv-input span{white-space:nowrap;color:#a3b9cd;font-size:12px}.zv-presets{display:flex;gap:9px;margin:13px 0 26px}.zv-presets button{border:1px solid #9cb2ca33;border-radius:7px;background:#ffffff05;color:#a9c0d5;padding:8px 14px;font-size:11px}.zv-presets button[aria-pressed=true]{border-color:#c5aa72;color:#e6ce9d;background:#c2a76d10}.zv-result{background:linear-gradient(120deg,#b69a5e17,#ddc38108);border:1px solid #cbb2764d;border-radius:12px;padding:22px 20px}.zv-result>div{display:flex;justify-content:space-between;align-items:center;gap:15px}.zv-result>div:first-child{font-size:12px;color:#c6d1db;margin-bottom:14px}.zv-result small{font-size:10px;color:#c4ae7b}.zv-result output{font-size:36px;color:#edd297;line-height:1.4}.zv-result>div:last-child>span{color:#cfbd98;font-size:12px}.zv-ratio{display:flex;justify-content:space-between;gap:12px;padding:19px 0;font-size:10px;line-height:1.8;color:#9eb5ca}.zv-ratio strong{font-size:11px;font-weight:400;color:#ced9e3}.zv-continue{width:100%;border-radius:9px;color:#092239!important;font-weight:500}.zv-note{font-size:10px;line-height:2.1;color:#8fa8be;margin:15px 0 0}.zv-bottom{position:relative;margin-top:42px;display:flex;justify-content:space-between;padding-top:20px;border-top:1px solid #c6d2df1f;color:#9eb1c4;font-size:11px}.zv-bottom a{color:#d6bb83}.zv-conversion #zc-error,.zt-trade #zt-error{color:#ffc0b3;font-size:11px;line-height:1.9;margin:10px 0}
.zt-trade{margin:35px 6%;padding:24px;border:1px solid #9ab8db40;border-radius:24px;background:radial-gradient(ellipse at 25% 0%,#2b5180aa,transparent 65%),linear-gradient(120deg,#183b64,#082541);color:#eaf1fa;box-shadow:0 15px 35px #0b274513}.zt-trade-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:17px;gap:20px}.zt-trade-head p{font-size:11px;line-height:1.9;color:#a9bed4;margin:4px 0 0}.zt-tabs{display:flex;gap:9px;direction:rtl}.zt-tabs button{padding:8px 28px;border-radius:12px;border:1px solid #a7c0db3d;background:#ffffff09;color:#b5c6df;min-height:40px;font-size:14px;font-weight:700}.zt-tabs button[aria-pressed=true]{background:#061d39;color:white;border-color:#bbd3e347}.zt-form{border:1px solid #b5d0e52b;border-radius:18px;background:#ffffff07;padding:17px;display:grid;grid-template-columns:1fr 1.3fr 1.1fr;align-items:end;gap:13px}.zt-form label{font-size:12px;font-weight:500;color:#d6e2ef}.zt-form label>div{display:flex;align-items:center;background:#ffffff07;border:1px solid #a8c5e539;border-radius:13px;margin-top:8px;overflow:hidden}.zt-form input{background:none;border:0;color:#eef4fa;padding:13px;width:100%;min-width:0;font-size:13px;outline:0;text-align:right}.zt-form input::placeholder{color:#89a2bb;font-size:11px}.zt-form label>div:focus-within{border-color:#dbc188}.zt-form label>div>span{padding:13px;border-right:1px solid #abc4df18;font-size:12px}.zt-form button{min-height:48px;background:linear-gradient(100deg,#f4d168,#e9b737);color:#0b2339;border:0;border-radius:13px;font-size:14px;font-weight:700}.zt-trade-note{display:flex;justify-content:space-between;gap:15px;font-size:9px;color:#93aec7;margin:14px 6px 0;line-height:1.8}.zt-trade-note b{font-weight:400;color:#d4e1ef}
@media(max-width:1100px){.zv-sticky{gap:4%;grid-template-columns:1fr 1fr}.zv-calculator{padding:22px}.zv-card-head h3{font-size:17px}.zv-card-head>span{font-size:12px}.zv-ratio{font-size:9px}.zv-ratio strong{font-size:10px}}
@media(max-width:760px){.zv-conversion{padding:40px 6% 45px;min-height:0;scroll-margin-top:126px}.zv-heading{display:block;margin-bottom:32px}.zv-heading h2{font-size:32px;margin:12px 0 20px}.zv-heading>div:last-child{padding-right:17px}.zv-heading p{font-size:12px;margin:9px 0}.zv-edition{font-size:8px}.zv-sticky{position:relative;top:auto;display:flex;flex-direction:column;gap:28px}.zv-visual,.zv-calculator{width:100%;max-width:500px}.zv-calculator{padding:23px}.zv-card-head h3{font-size:18px}.zv-card-head{margin-bottom:23px}.zv-result output{font-size:31px}.zv-bottom{font-size:10px;gap:15px}.zt-trade{margin:22px 5%;padding:18px;border-radius:18px}.zt-trade-head{flex-direction:column;align-items:stretch;gap:15px}.zt-tabs{align-self:start}.zt-trade-head p{font-size:10px}.zt-tabs button{font-size:12px;padding:7px 27px}.zt-form{grid-template-columns:1fr 1fr;gap:12px;padding:14px}.zt-form button{grid-column:1/-1}.zt-form label{font-size:10px}.zt-form input{padding:13px 8px;font-size:12px}.zt-form label>div>span{padding:12px 8px;font-size:10px}.zt-form input::placeholder{font-size:9px}.zt-trade-note{flex-direction:column;gap:3px;font-size:9px}}
.zv-card-head h3{color:#f5f8fc!important;font-weight:600;text-shadow:0 1px 14px #0005}.zv-conversion[data-source-asset="gold"] .zv-card-head h3{color:#f1d18f!important}.zv-conversion[data-source-asset="silver"] .zv-card-head h3{color:#e7f0fa!important}


/* Refined conversion copy + single-border input focus */
.zv-heading h2{font-size:clamp(30px,3vw,46px);line-height:1.75}
.zv-edition{letter-spacing:0;font-size:11px;color:#d7c28f}
.zv-heading p{max-width:390px}
.zv-card-head{align-items:flex-start}
.zv-card-head>span{direction:rtl;font-size:12px;color:#b8cce0;background:#ffffff08;border:1px solid #b8cce01f;border-radius:999px;padding:6px 10px}
.zv-card-head h3{font-size:20px;line-height:1.7}
.zv-calculator>label{font-size:12px;color:#c0d0df;margin-bottom:9px}
.zv-input{height:64px;border:1px solid #9fb7d13d;border-radius:9px;background:#102e5460;box-shadow:none!important;transition:border-color .18s ease,background-color .18s ease}
.zv-input:focus-within{border-color:#d5b873;box-shadow:none!important;background:#102e548f}
.zv-input input,.zv-input input:focus,.zv-input input:focus-visible{appearance:none;-webkit-appearance:none;border:0!important;outline:0!important;box-shadow:none!important;background:transparent!important;border-radius:0!important;color:#fff;font:inherit;font-size:24px;line-height:1.4;padding:0;margin:0;caret-color:#e7ca8d}
.zv-input input[aria-invalid="true"]{outline:0!important;box-shadow:none!important}
.zv-input span{color:#b8c9d9;font-size:12px}
.zv-result>div:first-child{font-size:12px}
.zv-ratio{font-size:10px}
@media(max-width:760px){.zv-heading h2{font-size:29px;line-height:1.75}.zv-card-head{gap:10px;flex-direction:column-reverse;align-items:stretch}.zv-card-head>span{align-self:flex-start}.zv-input{height:60px}.zv-input input,.zv-input input:focus,.zv-input input:focus-visible{font-size:22px}}

/* Responsive balance for the two conversion directions. */
.zv-conversion,.zv-conversion *{box-sizing:border-box}
.zv-scale{margin:0;min-width:0;width:100%;max-width:520px;justify-self:center}
.zv-scale-stage{position:relative;isolation:isolate;container-type:inline-size;width:100%;aspect-ratio:5/4;overflow:visible;background:transparent}
.zv-scale-glow{position:absolute;inset:20% 8% 8%;background:radial-gradient(ellipse at 50% 75%,#dfc48b18,transparent 70%);pointer-events:none}
.zv-scale-pillar{position:absolute;z-index:1;top:28%;bottom:12%;left:calc(50% - 1.15cqw);width:2.3cqw;background:linear-gradient(90deg,#5b4025,#c19855 25%,#efd8a0 48%,#9c7339 80%,#563b22);box-shadow:3px 0 8px #0003}
.zv-scale-beam{position:absolute;z-index:2;top:27%;left:11%;width:78%;height:1.8cqw;min-height:6px;border:1px solid #f1dca680;border-radius:999px;background:linear-gradient(#fff0c2,#c7a35f 38%,#7b572c 83%,#4b341f);box-shadow:0 4px 9px #0008,0 0 12px #debf7b2e}
.zv-scale-beam:before,.zv-scale-beam:after{content:"";position:absolute;top:50%;width:2.5cqw;height:2.5cqw;border-radius:50%;transform:translateY(-50%);background:radial-gradient(circle at 35% 35%,#fff2c8,#9b7540 67%,#654b2d)}
.zv-scale-beam:before{left:-1cqw}.zv-scale-beam:after{right:-1cqw}
.zv-scale-hub{position:absolute;z-index:4;top:50%;left:50%;width:3cqw;height:3cqw;border:1px solid #f5dfa5;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle at 35% 30%,#fff0bd,#b48b47 65%,#6d4e28);box-shadow:0 2px 4px #0005}
.zv-scale-arm{position:absolute;top:0;width:29cqw;height:39cqw;transform-origin:50% 0}
.zv-scale-arm-source{left:-5cqw}.zv-scale-arm-target{right:-5cqw}
.zv-scale-chain{position:absolute;z-index:2;top:0;left:50%;width:1.6cqw;height:1.6cqw;border:1px solid #f2dba88c;border-radius:50%;transform:translateX(-50%);background:#bd9655;box-shadow:0 1px 3px #0008}
.zv-scale-chain:before,.zv-scale-chain:after{content:"";position:absolute;top:1cqw;left:50%;width:1px;height:32.4cqw;background:linear-gradient(#f5dc9e,#b08b51 60%,#e7c887);box-shadow:0 0 2px #d5af6b7a;transform-origin:top center}
.zv-scale-chain:before{transform:rotate(-24deg)}.zv-scale-chain:after{transform:rotate(24deg)}
.zv-scale-pan{position:absolute;bottom:0;left:0;width:100%;height:9cqw;border:1px solid #c4a36b;border-top:2px solid #e9d39c;border-radius:7% 7% 50% 50% / 11% 11% 89% 89%;background:linear-gradient(180deg,#c6a66e6e,#806640b3 44%,#1d2939 96%);box-shadow:inset 0 2px 5px #fff3,inset 0 -8px 13px #0009,0 12px 17px #0008}
.zv-metal-piece{--piece-scale:.55;position:absolute;z-index:2;bottom:7cqw;left:50%;display:flex;align-items:center;justify-content:center;width:22cqw;height:12cqw;max-width:none;border-radius:2.3cqw 2.3cqw 1.2cqw 1.2cqw;transform:translateX(-50%) scale(var(--piece-scale));transform-origin:center bottom;transition:transform .28s ease,opacity .28s ease;font:700 4cqw/1 Arial,sans-serif;letter-spacing:.04em}
.zv-metal-piece:before{content:"";position:absolute;inset:1.4cqw;border:1px solid currentColor;border-radius:1.6cqw 1.6cqw .7cqw .7cqw;opacity:.45}
.zv-metal-piece span{position:relative;text-shadow:0 1px 1px #fff6}
.zv-metal-piece[hidden]{display:none}
.zv-metal-gold{color:#704716;border:1px solid #fff0bc;background:linear-gradient(140deg,#ffefb7,#c89943 29%,#f9da87 54%,#9a6b27 100%);box-shadow:inset 0 1px #fff9,inset -2px -3px #65421d66,0 5px 12px #0008}
.zv-metal-silver{color:#344d63;border:1px solid #f8fcff;background:linear-gradient(140deg,#fbfeff,#9bb1c2 29%,#e8f2f9 55%,#758da2 100%);box-shadow:inset 0 1px #fff,inset -2px -3px #4d657c66,0 5px 12px #0008}
.zv-scale-foot{position:absolute;z-index:2;bottom:8%;left:50%;width:26%;height:2.6cqw;min-height:8px;transform:translateX(-50%);border:1px solid #c9a96f;border-radius:1.2cqw 1.2cqw .45cqw .45cqw;background:linear-gradient(180deg,#e1c185,#9d7742 48%,#503924);box-shadow:inset 0 1px #fff4,0 3px 6px #07162970}
.zv-scale-pillar:after{content:"";position:absolute;bottom:0;left:50%;width:5.2cqw;height:2.1cqw;transform:translate(-50%,25%);border:1px solid #d5b77c;border-radius:.8cqw .8cqw .2cqw .2cqw;background:linear-gradient(90deg,#765431,#ddbf80 45%,#8e6a3d);box-shadow:0 1px 2px #0004}
.zv-scale-pan:before{content:"";position:absolute;top:-1cqw;left:0;right:0;height:2cqw;border:1px solid #f0d6a4b8;border-radius:50%;background:linear-gradient(180deg,#e9c98777,#806037aa);box-shadow:inset 0 1px #fff9,0 2px 3px #0006}
.zv-scale-pan:after{content:"";position:absolute;bottom:1cqw;left:23%;width:54%;height:1px;background:linear-gradient(90deg,transparent,#e9cc9066,transparent)}
.zv-scale-foot:after{content:"";position:absolute;top:1px;left:11%;width:78%;height:1px;background:linear-gradient(90deg,transparent,#fff0bc9c,transparent)}
.zv-scale-readouts{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:12px;margin:14px 0 0;direction:ltr}
.zv-scale-readout{display:flex;flex-direction:column;gap:5px;min-width:0;padding:11px 14px;border:1px solid #c4d2dd2c;border-radius:11px;background:#ffffff08;direction:rtl;text-align:center}
.zv-scale-readout small{font-size:11px;color:#aec2d4}.zv-scale-readout strong{font-size:clamp(12px,1.5vw,17px);font-weight:600;color:#f3dfb6;white-space:nowrap;font-variant-numeric:tabular-nums}
.zv-scale-equals{color:#d7bd84;font-size:25px}.zv-scale .zv-visual-note{margin:11px 0 0}
@media(max-width:760px){.zv-scale{max-width:500px}.zv-scale-readouts{gap:7px;margin-top:9px}.zv-scale-readout{padding:9px 6px}.zv-scale-readout small{font-size:10px}.zv-scale-readout strong{font-size:12px}.zv-scale-equals{font-size:19px}}
@media(max-width:360px){.zv-scale-readout strong{font-size:11px}.zv-scale-readout small{font-size:9px}}
@media(prefers-reduced-motion:reduce){.zv-metal-piece{transition:none}}

/* Keep long quotes and scale labels inside their cards on narrow screens. */
.zv-result>div:last-child{min-width:0}
.zv-result output{display:block;flex:1 1 auto;min-width:0;max-width:100%;overflow-wrap:anywhere;word-break:break-word;line-height:1.45;text-align:right}
.zv-scale-readout strong{white-space:normal;overflow-wrap:anywhere;line-height:1.5}
