
*{margin:0;padding:0;box-sizing:border-box}
body{font:15px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;color:#333;background:#fff}
a{color:#1a0dab;text-decoration:none}a:hover{text-decoration:underline}
.hd{background:#f8f9fa;border-bottom:1px solid #dadce0}
.hd-in{max-width:1000px;margin:0 auto;padding:0 16px;display:flex;align-items:center;height:48px;gap:24px}
.logo{font-weight:700;font-size:1.15rem;color:#333}.logo span{color:#1a8fe3}.logo:hover{text-decoration:none}
.nav{display:flex;gap:20px}.nav a{color:#555;font-size:.9rem}.nav a:hover{color:#1a0dab}
.menu-btn{display:none;background:none;border:none;font-size:1.4rem;cursor:pointer}
@media(max-width:700px){.nav{display:none;position:absolute;top:48px;left:0;right:0;background:#f8f9fa;flex-direction:column;padding:12px 16px;border-bottom:1px solid #dadce0;z-index:99}.nav.open{display:flex}.menu-btn{display:block}}
.wrap{max-width:800px;margin:0 auto;padding:12px 16px 48px}
.bc{font-size:.82rem;color:#70757a;margin-bottom:10px}.bc a{color:#70757a}.bc a:hover{color:#1a0dab}
h1{font-size:1.5rem;margin-bottom:4px;color:#202124;font-weight:600}
h2{font-size:1.15rem;margin:20px 0 8px;color:#202124;font-weight:600}
h3{font-size:1rem;margin:12px 0 6px}
p{margin-bottom:8px;color:#4d5156}
.desc{color:#70757a;margin-bottom:14px;font-size:.95rem}
/* Converter */
.conv-box{background:#f8f9fa;border:1px solid #dadce0;border-radius:8px;padding:16px;margin-bottom:14px}
.conv-row{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap}
.conv-field{flex:1;min-width:160px}
.conv-field label{display:block;font-size:.8rem;font-weight:600;color:#5f6368;margin-bottom:4px;text-transform:uppercase;letter-spacing:.5px}
.conv-field input,.conv-field select{width:100%;padding:10px 12px;border:1px solid #dadce0;border-radius:6px;font-size:1.05rem;background:#fff}
.conv-field input:focus{outline:none;border-color:#1a8fe3;box-shadow:0 0 0 2px rgba(26,143,227,.15)}
.swap{width:40px;height:40px;border-radius:50%;background:#fff;border:1px solid #dadce0;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.1rem;flex-shrink:0}
.swap:hover{background:#f0f7ff;border-color:#1a8fe3}
.formula{background:#e8f0fe;border-radius:6px;padding:8px 14px;margin-bottom:14px;font-size:.9rem;color:#174ea6}
/* Table */
table{width:100%;border-collapse:collapse;margin-bottom:14px;font-size:.9rem}
th,td{padding:8px 12px;text-align:left;border-bottom:1px solid #e8eaed}
th{background:#f8f9fa;color:#5f6368;font-weight:600;font-size:.8rem;text-transform:uppercase;letter-spacing:.3px}
tr:hover td{background:#f8f9fa}
/* Grid */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1px;background:#dadce0;border:1px solid #dadce0;border-radius:8px;overflow:hidden;margin-bottom:14px}
.grid a{background:#fff;padding:12px 14px;color:#1a0dab;font-size:.9rem;display:block}
.grid a:hover{background:#f8f9fa;text-decoration:none}
.grid a .gi{color:#5f6368;font-size:.78rem;margin-top:2px}
/* Link list */
.link-list{columns:2;column-gap:20px;margin-bottom:14px}
.link-list a{display:block;padding:3px 0;font-size:.9rem;color:#1a0dab}
@media(max-width:500px){.link-list{columns:1}}
/* Related pills */
.pills{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.pills a{padding:6px 14px;background:#f8f9fa;border:1px solid #dadce0;border-radius:16px;font-size:.82rem;color:#1a0dab}
.pills a:hover{background:#e8f0fe;border-color:#1a8fe3;text-decoration:none}
/* Calc */
.calc-box{background:#f8f9fa;border:1px solid #dadce0;border-radius:8px;padding:20px;margin-bottom:20px}
.calc-row{display:flex;align-items:center;gap:8px;margin-bottom:10px;flex-wrap:wrap}
.calc-row label{min-width:130px;font-size:.9rem;font-weight:500}
.calc-row input,.calc-row select{padding:8px 10px;border:1px solid #dadce0;border-radius:4px;font-size:.95rem}
.calc-row input:focus{outline:none;border-color:#1a8fe3}
.result{background:#fff;border:2px solid #1a8fe3;border-radius:8px;padding:16px;text-align:center;margin-top:12px}
.result strong{font-size:1.5rem;color:#1a8fe3}
.result .rl{display:block;font-size:.8rem;color:#70757a;margin-bottom:4px}
.btn{background:#1a8fe3;color:#fff;border:none;padding:10px 24px;border-radius:6px;font-size:.95rem;cursor:pointer}.btn:hover{background:#1577c0}
/* FAQ */
.faq{margin-top:18px}.faq details{border:1px solid #e8eaed;border-radius:6px;margin-bottom:6px}
.faq summary{padding:12px 14px;cursor:pointer;font-weight:500;font-size:.9rem;list-style:none}
.faq summary::after{content:"+";float:right;color:#70757a}
.faq details[open] summary::after{content:"−"}
.faq p{padding:0 14px 12px;color:#4d5156;font-size:.88rem}
/* Ad */
.ad{margin:20px 0}
/* Search */
.search-input{width:100%;padding:10px 14px;border:1px solid #dadce0;border-radius:8px;font-size:.95rem;margin-bottom:16px}
.search-input:focus{outline:none;border-color:#1a8fe3}
/* Textarea */
.ta{width:100%;min-height:80px;padding:10px 12px;border:1px solid #dadce0;border-radius:6px;font-family:monospace;font-size:.95rem;resize:vertical}
.ta:focus{outline:none;border-color:#1a8fe3}
.copy-btn{background:#1a8fe3;color:#fff;border:none;padding:4px 12px;border-radius:4px;font-size:.78rem;cursor:pointer;margin-top:6px}
/* Footer */
.ft{background:#f8f9fa;border-top:1px solid #dadce0;margin-top:20px;padding:16px 16px;text-align:center;font-size:.82rem;color:#70757a}
.ft-in{max-width:800px;margin:0 auto}.ft-nav{margin-bottom:8px}.ft-links{margin-bottom:8px}
.ft a{color:#70757a}.ft a:hover{color:#1a0dab}
/* Ref table */
.ref-table{font-size:.85rem}.ref-table th{position:sticky;top:0;z-index:1}
.char-cell{font-size:1.1rem;font-weight:700;text-align:center;min-width:36px}
.swatch{display:inline-block;width:32px;height:18px;border-radius:3px;vertical-align:middle;border:1px solid #dadce0}
/* SEO content */
.seo{margin-top:18px;color:#4d5156;font-size:.9rem;line-height:1.7}
.seo h2{color:#202124;font-size:1rem;margin-top:14px;margin-bottom:4px}
