.tool{--conv-accent:#3454d1;--conv-accent-ink:#1f2f8f;--conv-accent-tint:#eef1fd;--conv-amber:#b8710a;--conv-amber-tint:#fdf3e2;--conv-ink:#1d2433;--conv-muted:#6b7280;--conv-border:#e2e4ea;width:min(100%,920px);padding:var(--space-lg) 0;margin-inline:auto}.tool-header{margin-bottom:var(--space-lg)}.tool-header h1{color:var(--conv-ink);margin:0 0 .5rem}.tool-header p{color:var(--conv-muted);max-width:62ch;margin:0}.category-tabs{margin-bottom:var(--space-md);flex-wrap:wrap;gap:.5rem;display:flex}.category-tab{font:inherit;color:var(--conv-muted);border:1px solid var(--conv-border);cursor:pointer;background:#fff;border-radius:999px;padding:.5rem 1rem;font-size:.9rem;transition:background .15s,border-color .15s,color .15s}.category-tab:hover{border-color:var(--conv-accent);color:var(--conv-accent-ink)}.category-tab.active{background:var(--conv-accent);border-color:var(--conv-accent);color:#fff}.input-row{margin-bottom:var(--space-md);grid-template-columns:1fr 2fr auto;align-items:end;gap:1rem;display:grid}.input-group{flex-direction:column;gap:.4rem;display:flex}.input-group label{color:var(--conv-muted);font-size:.85rem}.value-input,.unit-select{font:inherit;border:1px solid var(--conv-border);border-radius:var(--radius);background:#fff;padding:.75rem .9rem;font-size:1.1rem}.value-input{font-variant-numeric:tabular-nums}.value-input:focus,.unit-select:focus{outline:2px solid var(--conv-accent);outline-offset:1px}.random-button{font:inherit;white-space:nowrap;border:1px solid var(--conv-border);border-radius:var(--radius);cursor:pointer;background:#fff;padding:.75rem 1rem;font-size:.95rem;transition:background .15s,border-color .15s}.random-button:hover{background:var(--conv-accent-tint);border-color:var(--conv-accent)}.controls-row{margin-bottom:var(--space-md);grid-template-columns:1fr 1fr;align-items:end;gap:1rem;display:grid}.filter-group,.precision-group{flex-direction:column;gap:.4rem;display:flex}.filter-group label,.precision-group label{color:var(--conv-muted);font-size:.85rem}.filter-group input{font:inherit;border:1px solid var(--conv-border);border-radius:var(--radius);padding:.6rem .8rem}.precision-group input[type=range]{width:100%;accent-color:var(--conv-accent)}.fun-fact{margin-bottom:var(--space-md);border-radius:var(--radius);background:var(--conv-amber-tint);color:#6b4a06;border:1px solid #f0dba8;padding:.9rem 1.1rem;font-size:.95rem;transition:opacity .15s}.results-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:.75rem;display:grid}.unit-card{border:1px solid var(--conv-border);border-radius:var(--radius);cursor:pointer;text-align:left;background:#fff;padding:1rem 1rem .9rem;transition:background-color .4s,border-color .15s,transform .1s;position:relative}.unit-card:hover{border-color:var(--conv-accent);transform:translateY(-1px)}.unit-card.source{background:var(--conv-accent-tint);border-color:var(--conv-accent)}.unit-card.flash{background-color:#dfe6fb}.unit-card .unit-name{color:var(--conv-muted);margin-bottom:.3rem;font-size:.8rem;display:block}.unit-card.source .unit-name{color:var(--conv-accent-ink)}.unit-card .unit-value{color:var(--conv-ink);font-variant-numeric:tabular-nums;word-break:break-word;font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace;font-size:1.3rem;font-weight:600;display:block}.unit-card .unit-symbol{color:var(--conv-muted);margin-top:.2rem;font-size:.75rem;display:block}.copy-button{width:1.6rem;height:1.6rem;color:var(--conv-muted);cursor:pointer;opacity:0;background:0 0;border:1px solid #0000;border-radius:6px;justify-content:center;align-items:center;font-size:.85rem;line-height:1;transition:opacity .15s,background .15s;display:flex;position:absolute;top:.5rem;right:.5rem}.unit-card:hover .copy-button,.unit-card:focus-within .copy-button{opacity:1}.copy-button:hover{background:#0000000f}.copy-button.copied:after{content:"Copied";white-space:nowrap;background:var(--conv-ink);color:#fff;border-radius:6px;padding:.15rem .5rem;font-size:.7rem;position:absolute;top:-1.6rem;right:0}.empty-state{text-align:center;color:var(--conv-muted);padding:2rem 0}.tool-info{width:min(100%, var(--content-width));margin:0 auto var(--space-xl);padding-top:var(--space-lg);border-top:1px solid var(--conv-border,#e2e4ea)}.tool-info h2{margin:var(--space-lg) 0 .6rem;font-size:1.15rem}.tool-info h2:first-child{margin-top:0}.tool-info p{color:#3a3f4b;margin:0 0 .9rem}@media (width<=700px){.input-row,.controls-row{grid-template-columns:1fr}.random-button{width:100%}}@media (prefers-reduced-motion:reduce){.unit-card,.fun-fact,.copy-button{transition:none}}
