:root{--accent:#1769aa;--ink:#202124;--muted:#6f767d;--line:#dadddf;--soft:#f7f8f9;--result:#f4f7f9}*{box-sizing:border-box}html{font-size:16px}body{margin:0;background:#fff;color:var(--ink);font-family:Arial,Helvetica,sans-serif;line-height:1.5}button,input,select{font:inherit}button,select{cursor:pointer}a{color:inherit;text-decoration:none}.site-header{border-bottom:1px solid #eceff1}.header-inner{max-width:1080px;min-height:60px;margin:auto;padding:0 20px;display:flex;align-items:center;gap:18px}.logo{font-size:22px;font-weight:800;letter-spacing:-1px}.logo span{color:var(--accent)}.tagline{font-size:12px;color:var(--muted)}.home,.page{max-width:1080px;margin:auto;padding:22px 20px 52px}.page article{max-width:940px}.home-intro{margin-bottom:18px}.home-intro h1,.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.search{height:40px;border:1px solid #bec5ca;border-radius:10px;display:flex;align-items:center;width:420px;max-width:100%;background:#fff}.search:focus-within{border-color:var(--accent)}.search>span{font-size:20px;margin:0 10px;color:#7a858c}.search input{border:0;outline:0;width:100%;height:100%;padding-right:10px;background:transparent}.quick-heading{font-size:19px;font-weight:600;margin:0 0 7px}.category-tabs{display:flex;gap:4px;overflow-x:auto;margin:0 0 8px}.category-tab{border:0;border-radius:10px;background:transparent;padding:8px 13px;color:#626a70;white-space:nowrap}.category-tab:hover{background:var(--soft)}.category-tab.active{color:var(--accent);background:#edf4f9;font-weight:700}.converter-shell{display:grid;grid-template-columns:minmax(0,1fr) 38px minmax(0,1fr);align-items:center}.converter-panel{position:relative;height:205px;border:1px solid var(--line);border-radius:12px;background:#fff}.converter-panel.output-panel{background:var(--result)}.unit-row{height:50px;display:flex;align-items:center;padding:0 16px}.unit-select{max-width:calc(100% - 36px);border:0;background:transparent;color:#4e565c;font-weight:600;outline:0;padding:5px 25px 5px 0}.unit-select:focus{color:var(--accent)}.clear-button,.copy-button{position:absolute;border:0;border-radius:10px;background:transparent;color:#68727a;width:34px;height:34px;display:grid;place-items:center}.clear-button{right:10px;top:58px;font-size:24px}.copy-button{right:10px;bottom:10px;font-size:20px}.clear-button:hover,.copy-button:hover{color:var(--accent);background:#e9eef1}.number-input{position:absolute;left:20px;right:50px;top:76px;width:calc(100% - 70px);border:0;outline:0;background:transparent;color:var(--ink);font-size:42px;line-height:1.2;font-variant-numeric:tabular-nums;padding:6px 0}.copy-status{position:absolute;right:49px;bottom:17px;color:#39775b;font-size:12px;opacity:0;transition:opacity .15s}.copy-status.show{opacity:1}.swap-button{width:34px;height:34px;margin:auto;border:1px solid var(--line);border-radius:10px;background:#fff;color:#5f6970;font-size:20px;display:grid;place-items:center;z-index:2}.swap-button:hover{color:var(--accent);border-color:#aab7c0}.swap-vertical{display:none}.result-line{margin:14px 2px 20px;color:#4e565c}.result-line strong{color:var(--ink);font-weight:600}.ad-placeholder{height:66px;border:1px dashed #d6dcdf;border-radius:10px;background:#fcfcfc;color:#9ba4a9;text-transform:uppercase;font-size:9px;letter-spacing:1.3px;display:grid;place-items:center;margin:20px 0 30px}.home-section,.content-section{margin-top:30px}.home-section h2,.content-section h2{font-size:18px;font-weight:600;margin:0 0 10px}.content-section p{margin:7px 0}.formula-line{font-size:17px}.formula-line strong{font-weight:600}.link-list{display:grid;grid-template-columns:1fr 1fr;column-gap:32px}.tool-link{min-height:40px;padding:8px 2px;border-bottom:1px solid #eceff1;display:flex;align-items:center;justify-content:space-between}.tool-link b{color:var(--accent)}a.tool-link:hover{color:var(--accent)}.empty{padding:10px 0;color:var(--muted)}.category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}.category-card{padding:2px 0}.category-card h3{margin:0;font-size:15px;font-weight:600}.category-card p{margin:3px 0 0;font-size:12px;color:var(--muted)}.breadcrumbs{font-size:12px;color:var(--muted);display:flex;gap:6px;margin-bottom:12px}.breadcrumbs a{color:#59666e}.page-title h1{font-size:26px;line-height:1.25;letter-spacing:-.4px;margin:0 0 4px;font-weight:600}.page-title p{color:var(--muted);margin:0 0 13px}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%}th,td{padding:9px 8px;text-align:left;border-bottom:1px solid #e9edef}th{font-size:12px;color:#667078;font-weight:600;background:transparent}td{font-variant-numeric:tabular-nums}.value-list,.related-links{display:flex;flex-wrap:wrap;gap:7px 20px}.value-list>*{color:#4b555c}.value-list a,.related-links a{color:var(--accent)}.related-links>*{padding:2px 0}.related-links span{color:#4b555c}footer{border-top:1px solid #eceff1;background:#fafafa;padding:22px 18px;text-align:center;color:var(--muted);font-size:12px}
@media(max-width:700px){.header-inner{display:block;padding-top:10px;padding-bottom:9px}.tagline{display:block;padding-top:2px;font-size:11px}.home,.page{padding:17px 15px 44px}.search{width:100%}.quick-heading{font-size:18px}.category-tabs{gap:1px}.category-tab{padding:7px 10px}.converter-shell{grid-template-columns:1fr}.converter-panel{height:170px}.swap-button{margin:-1px auto}.swap-horizontal{display:none}.swap-vertical{display:inline}.number-input{top:66px;font-size:34px}.link-list,.category-grid{grid-template-columns:1fr}.category-grid{gap:18px}.page-title h1{font-size:23px}.value-list,.related-links{display:grid;grid-template-columns:1fr 1fr;gap:7px 12px}}
.link-list{display:grid;grid-template-columns:1fr 1fr;gap:8px 10px}.tool-link{min-height:42px;padding:9px 12px;border:1px solid #dfe4e7;border-radius:6px;background:#fff;display:flex;align-items:center;justify-content:space-between}.tool-link b{color:#657078;font-size:14px;font-weight:400}.tool-link:hover{background:#f4f8fb;border-color:#d5e1e9}.browse-all{display:inline-block;margin-top:12px;color:var(--accent);font-size:14px}.browse-all:hover{text-decoration:underline}
@media(max-width:700px){.link-list{grid-template-columns:1fr}}
.tool-link{height:46px;min-height:46px;border:1px solid #dadce0;border-radius:8px}.tool-link:hover{background:#f5f8fa;border-color:#dadce0}.browse-all{font-size:13px;color:#5b6570}.browse-all:hover{color:var(--accent)}
.swap-button{width:38px;height:38px;border-radius:50%;place-self:center}.clear-button{right:11px;top:67px}.copy-button{width:36px;height:36px;right:10px;bottom:10px}.copy-button::after{content:"Copy";position:absolute;right:0;bottom:41px;padding:4px 7px;border-radius:4px;background:#303438;color:#fff;font-size:11px;line-height:1;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .12s}.copy-button:hover::after{opacity:1}.copy-status{right:51px;bottom:18px}.tool-link:hover{background:#f4f8fc;border-color:#cbdde9}
@media(max-width:700px){.clear-button{top:59px}}
.converter-shell{grid-template-columns:minmax(0,1fr) 56px minmax(0,1fr)}
.clear-button{top:18px;right:18px;width:34px;height:34px;border-radius:50%;font-size:17px;line-height:1}
.clear-button:hover{color:#5f6368;background:#f1f3f4}
.copy-button{right:17px;bottom:17px;width:36px;height:36px;border-radius:50%}
.copy-button svg{display:block;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.copy-status{right:60px;bottom:26px}
@media(max-width:700px){.converter-shell{grid-template-columns:1fr}.swap-button{margin:14px auto}.clear-button{top:18px;right:18px}.copy-button{right:17px;bottom:17px}}
.text-page{max-width:760px}.text-page .page-title{margin-bottom:22px}.text-content p{margin:0 0 14px}.text-content h2{font-size:18px;font-weight:600;margin:26px 0 8px}.text-content .last-updated{color:var(--muted);font-size:13px;margin-bottom:22px}.text-content a{color:var(--accent)}.text-content a:hover{text-decoration:underline}.footer-links{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:5px 9px;margin-bottom:7px}.footer-links a:hover{color:var(--accent);text-decoration:underline}