:root{--bg:#0d1117;--surface:#161b22;--subtle:#1c2333;--text:#c9d1d9;--text-strong:#f0f6fc;--text-muted:#8b949e;--border:#30363d;--button:#2563eb;--button-hover:#1d4ed8;--button-text:#fff;--focus:#3b82f6;--focus-soft:#3b82f633;--shadow:0 4px 24px #00000073;color:var(--text);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:radial-gradient(100% 45% at 50% -2%,#2563eb38 0%,#0000 68%),#0d1117;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{background:#0d1117;min-width:320px}body{min-width:320px;min-height:100svh;margin:0}button,input,select{font:inherit}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--focus-soft);outline-offset:2px}.app-shell{min-height:100svh;color:var(--text);flex-direction:column;display:flex}.topbar{justify-content:space-between;align-items:center;gap:16px;width:min(900px,100% - 32px);margin:0 auto;padding:22px 0;display:flex}.brand{color:var(--text-strong);align-items:center;gap:12px;font-size:22px;font-weight:720;text-decoration:none;display:inline-flex}.brand-mark{flex-shrink:0;place-items:center;width:40px;height:40px;display:grid}.brand-logo{width:40px;height:40px}.brand-accent{color:#60a5fa}.language-picker select{min-width:140px;color:var(--text-strong);background:var(--surface);border:1px solid var(--border);font:inherit;border-radius:10px;padding:12px 14px;font-size:15px}.content-grid{grid-template-columns:1fr 272px;align-items:start;gap:32px;width:min(900px,100% - 32px);margin:0 auto;padding:28px 0 56px;display:grid}.converter-section{flex-direction:column;gap:20px;display:flex}.intro-copy{max-width:620px}.intro-copy h1{color:var(--text-strong);letter-spacing:0;margin:0;font-size:clamp(26px,3vw,36px);line-height:1.15}.intro-copy p{max-width:580px;color:var(--text);margin:12px 0 0;font-size:17px;line-height:1.55}.converter-card{background:var(--surface);border:1px solid var(--border);width:100%;box-shadow:var(--shadow);border-radius:20px;flex-direction:column;gap:0;padding:28px 24px 24px;display:flex}.conv-group{flex-direction:column;gap:8px;padding:16px 0;display:flex}.conv-group:first-child{padding-top:4px}.conv-label{text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);font-size:12px;font-weight:680}.conv-fields{grid-template-columns:1fr 1fr;align-items:center;gap:10px;display:grid}.conv-input{border:1px solid var(--border);background:var(--subtle);color:var(--text-strong);font:inherit;appearance:textfield;border-radius:12px;outline:0;min-width:0;padding:14px 16px;font-size:24px;font-weight:600}.conv-input::-webkit-outer-spin-button{-webkit-appearance:none}.conv-input::-webkit-inner-spin-button{-webkit-appearance:none}.conv-input:focus{border-color:var(--focus);box-shadow:0 0 0 3px var(--focus-soft);outline:none}.conv-result{background:var(--subtle);border:1px solid var(--border);color:var(--text-strong);text-overflow:ellipsis;white-space:nowrap;border-radius:12px;align-items:center;min-width:0;padding:14px 16px;font-size:24px;font-weight:600;display:flex;overflow:hidden}.conv-select-wrap{align-items:center;min-width:0;display:flex;position:relative}.conv-select{appearance:none;background:var(--subtle);border:1px solid var(--border);width:100%;min-width:0;color:var(--text-strong);font:inherit;cursor:pointer;border-radius:12px;padding:14px 36px 14px 16px;font-size:15px;font-weight:580}.conv-select:focus{border-color:var(--focus);box-shadow:0 0 0 3px var(--focus-soft);outline:none}.select-chevron{color:var(--text-muted);pointer-events:none;font-size:11px;position:absolute;right:13px}.swap-row{justify-content:center;margin:4px 0;display:flex}.swap-btn{cursor:pointer;color:#fff;background:linear-gradient(135deg,#818cf8 0%,#2563eb 100%);border:none;border-radius:50%;place-items:center;width:44px;height:44px;transition:transform .15s,box-shadow .15s;display:grid;box-shadow:0 4px 16px #2563eb73}.swap-btn:hover{transform:scale(1.08);box-shadow:0 6px 20px #2563eb8c}.swap-btn:active{transform:scale(.95)}.swap-icon{width:20px;height:20px}.conv-rate{color:var(--text-muted);margin:12px 0 0;font-size:13px}.conv-warning{color:var(--text-muted);margin:8px 0 0;font-size:13px}.conv-warning span{color:var(--text-strong);font-weight:700}.unit-browser{scrollbar-width:thin;scrollbar-color:var(--border) transparent;flex-direction:column;gap:6px;max-height:calc(100vh - 48px);display:flex;position:sticky;top:24px;overflow-y:auto}.unit-browser::-webkit-scrollbar{width:4px}.unit-browser::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.unit-category{flex-direction:column;display:flex}.unit-category-header{background:var(--surface);border:1px solid var(--border);width:100%;color:var(--text-strong);font:inherit;cursor:pointer;text-align:left;border-radius:10px;align-items:center;gap:8px;padding:10px 14px;font-size:13px;font-weight:680;display:flex}.unit-category-header:hover{background:var(--subtle)}.unit-category-header.is-open{border-bottom-right-radius:0;border-bottom-left-radius:0}.cat-icon{color:#60a5fa;flex-shrink:0;width:15px;height:15px}.unit-category-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.unit-count{color:var(--text-muted);font-size:11px;font-weight:500}.unit-chevron{color:var(--text-muted);font-size:10px}.unit-list{background:var(--surface);border:1px solid var(--border);scrollbar-width:thin;scrollbar-color:var(--border) transparent;border-top:none;border-bottom-right-radius:10px;border-bottom-left-radius:10px;max-height:260px;margin:0 0 6px;padding:0;list-style:none;overflow:hidden auto}.unit-list::-webkit-scrollbar{width:4px}.unit-list::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.unit-list li{border-top:1px solid var(--border)}.unit-list li:first-child{border-top:none}.unit-btn{width:100%;color:var(--text);font:inherit;cursor:pointer;text-align:left;background:0 0;border:none;justify-content:space-between;align-items:center;gap:8px;padding:8px 14px;font-size:12px;display:flex}.unit-btn:hover{background:var(--subtle);color:var(--text-strong)}.unit-btn.is-active{color:var(--text-strong);background:#2563eb1f}.unit-name{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.unit-symbol{color:var(--button);background:#2563eb1f;border-radius:4px;flex-shrink:0;padding:2px 7px;font-family:ui-monospace,Cascadia Code,Source Code Pro,monospace;font-size:11px;font-weight:680}.seo-content{grid-template-columns:1fr 1fr;gap:32px;width:min(900px,100% - 32px);margin:0 auto;padding:0 0 72px;display:grid}.seo-content h2{color:var(--text-strong);letter-spacing:0;margin:0 0 10px;font-size:20px;line-height:1.25}.seo-content p{color:var(--text-muted);margin:0;font-size:15px;line-height:1.7}.popular-conversions{grid-column:1/-1}.popular-conversions ul{flex-wrap:wrap;gap:8px;margin:14px 0 0;padding:0;list-style:none;display:flex}.popular-conversions li{color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:7px 10px;font-size:13px;line-height:1.25}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (width<=960px){.content-grid{grid-template-columns:1fr;padding-top:28px}.seo-content{grid-template-columns:1fr}.unit-browser{max-height:none;position:static;overflow-y:visible}.unit-list{max-height:200px}}@media (width<=620px){.topbar{flex-wrap:wrap;width:min(100% - 24px,900px)}.content-grid,.seo-content{width:min(100% - 24px,900px)}.conv-input,.conv-result{font-size:20px}}@media (width<=460px){.language-picker,.language-picker select{width:100%}.converter-card{padding:22px 16px 20px}.conv-fields{grid-template-columns:1fr}}