:root{--black:#080a0c;--panel:#11151a;--line:#2a3038;--green:#9bf00b;--white:#f0f3f5;--muted:#7c8793}*{box-sizing:border-box}html{background:var(--black)}body{margin:0;color:var(--white);background:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px),var(--black);background-size:40px 40px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}button,input{font:inherit}header{height:92px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 clamp(18px,5vw,70px);background:rgba(8,10,12,.92)}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--white);font-size:25px;font-weight:800}.brand span:first-child{color:var(--green)}.brand i{font-style:normal;color:var(--muted)}.live{margin-left:auto;text-align:right}.live small{display:block;color:var(--muted);font-size:9px;letter-spacing:.12em}.live button{background:none;border:0;color:var(--green);padding:3px 0;cursor:pointer}.live button span{font-size:10px;color:var(--muted);margin-left:8px}.live b{font-size:18px}main{max-width:1180px;margin:auto;padding:70px clamp(18px,5vw,60px)}.intro{display:grid;grid-template-columns:160px 1fr 320px;align-items:end;margin-bottom:54px}.label{color:var(--green);font-size:10px;letter-spacing:.14em}.intro h1{font-family:Arial,"PingFang SC",sans-serif;font-size:clamp(40px,6vw,76px);line-height:.96;letter-spacing:-.055em;margin:0}.intro h1 em{font-style:normal;color:var(--muted)}.intro p{color:#a0a9b2;line-height:1.8;font-family:"PingFang SC",sans-serif;font-size:14px;margin:0}.converter{display:grid;grid-template-columns:1fr 50px 1fr;border:1px solid var(--line);background:var(--panel)}.input-block{padding:26px}.head{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;letter-spacing:.1em;margin-bottom:16px}.head span{color:var(--green)}.big-input{display:flex;border-bottom:2px solid #68727e}.big-input:focus-within{border-color:var(--green)}.big-input input{width:100%;min-width:0;background:transparent;border:0;color:var(--white);outline:0;font-size:clamp(20px,3vw,34px);padding:12px 0}.big-input button{border:0;background:transparent;color:var(--green);cursor:pointer}.hint{color:var(--muted);font-size:10px;min-height:24px}.hint.error{color:#ff746c}.swap{border-left:1px solid var(--line);border-right:1px solid var(--line);display:grid;place-items:center;color:var(--green);font-size:24px}.outputs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:15px}.outputs button{min-width:0;background:#191f25;border:1px solid var(--line);color:white;text-align:left;padding:10px;cursor:pointer;display:grid;grid-template-columns:1fr auto}.outputs small{color:var(--muted);grid-column:1/-1}.outputs b{overflow:hidden;text-overflow:ellipsis}.outputs i{font-style:normal;color:var(--green);font-size:10px}.zones{margin-top:70px}.zone-head{display:flex;justify-content:space-between;align-items:end;border-bottom:1px solid var(--line);padding-bottom:18px}.zone-head h2{font-family:Arial,"PingFang SC",sans-serif;font-size:32px;margin:0}.zone-grid{display:grid;grid-template-columns:repeat(3,1fr)}.zone{border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:24px}.zone:nth-child(3n){border-right:0}.zone small{color:var(--green)}.zone h3{font-size:13px;color:#a3adb7;font-weight:400;margin:25px 0 8px}.zone b{font-size:clamp(17px,2.3vw,25px);display:block}.zone span{color:var(--muted);font-size:11px}footer{border-top:1px solid var(--line);padding:20px clamp(18px,5vw,70px);display:flex;justify-content:space-between;color:var(--muted);font-size:9px;letter-spacing:.1em}.toast{position:fixed;right:24px;bottom:24px;background:var(--green);color:#0a0c0e;padding:10px 18px;font-weight:bold;transform:translateY(80px);transition:.2s}.toast.show{transform:none}@media(max-width:800px){header{height:78px}.live button span{display:none}.intro{grid-template-columns:1fr;gap:20px}.intro p{max-width:520px}.converter{grid-template-columns:1fr}.swap{height:42px;border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.zone-grid{grid-template-columns:1fr 1fr}.zone:nth-child(3n){border-right:1px solid var(--line)}.zone:nth-child(2n){border-right:0}}@media(max-width:520px){main{padding-top:45px}.live b{font-size:12px}.intro h1{font-size:43px}.input-block{padding:18px}.big-input input{font-size:20px}.zone-grid{grid-template-columns:1fr}.zone,.zone:nth-child(3n){border-right:0}footer{gap:12px;flex-wrap:wrap}}
