@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";:root{--primary: #818cf8;--primary-hover: #a5b4fc;--bg-matte: #0f0f12;--card-matte: #1a1a1e;--card-border: #2a2a2e;--text-main: #f8fafc;--text-muted: #94a3b8;--accent-cyan: #22d3ee;--accent-violet: #a78bfa;--matte-black: #121212}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,system-ui,-apple-system,sans-serif;background-color:var(--bg-matte);color:var(--text-main);min-height:100vh;display:flex;justify-content:center;align-items:center;overflow-x:hidden}#root{width:100%;display:flex;justify-content:center;align-items:center;padding:1rem}.glass-card{background:var(--card-matte);border:1px solid var(--card-border);border-radius:20px;padding:2.5rem;width:100%;max-width:500px;box-shadow:0 40px 100px -20px #000c;animation:fadeIn .6s cubic-bezier(.16,1,.3,1)}.input-group{margin-bottom:1.5rem}.input-label{display:block;font-size:.8rem;font-weight:600;color:var(--text-muted);margin-bottom:.6rem;text-transform:uppercase;letter-spacing:.05em}.input-wrapper{position:relative;display:flex;align-items:center}.input-field{width:100%;background:var(--matte-black);border:1px solid var(--card-border);border-radius:10px;padding:.85rem 1rem;color:#fff;font-size:1rem;transition:all .2s cubic-bezier(.4,0,.2,1);outline:none}.input-field:focus{border-color:var(--primary);background:#16161a;box-shadow:0 0 0 1px var(--primary)}.input-unit{position:absolute;right:1.25rem;color:var(--text-muted);font-size:.8rem;font-weight:500;pointer-events:none}.preset-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;margin-bottom:2rem}.preset-card{background:var(--matte-black);border:1px solid var(--card-border);border-radius:12px;padding:1rem;cursor:pointer;transition:all .2s ease;text-align:left;display:flex;flex-direction:column}.preset-card:hover{background:#16161a;border-color:#3a3a3e}.preset-card.active{background:#818cf80f;border-color:var(--primary)}.preset-name{font-size:.95rem;font-weight:700;margin-bottom:.25rem;color:var(--accent-cyan)}.preset-card.active .preset-name{color:var(--primary)}.preset-desc{font-size:.7rem;color:var(--text-muted)}.info-panel{background:#22d3ee08;border-left:2px solid var(--accent-cyan);border-radius:6px;padding:1.25rem;margin-bottom:2rem;font-size:.85rem;line-height:1.6;color:#cbd5e1}.unit-toggle{display:flex;background:var(--matte-black);border:1px solid var(--card-border);border-radius:8px;overflow:hidden;margin-top:.6rem;padding:2px}.unit-btn{flex:1;padding:.5rem;background:none;border:none;color:var(--text-muted);font-size:.7rem;font-weight:700;cursor:pointer;transition:all .25s ease;border-radius:6px}.unit-btn.active{background:var(--card-border);color:#fff}.result-container{margin-top:2.5rem;padding:2rem;background:var(--matte-black);border:1px solid var(--card-border);border-radius:16px;text-align:center}.result-value{font-size:4rem;font-weight:800;background:linear-gradient(to right,var(--accent-cyan),var(--accent-violet));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;line-height:1;margin:.5rem 0}.result-label{font-size:.75rem;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em}.lang-toggle{display:flex;justify-content:flex-end;gap:.5rem;margin-bottom:1.5rem}.lang-btn{background:none;border:1px solid var(--card-border);color:var(--text-muted);padding:.3rem .6rem;border-radius:6px;font-size:.7rem;font-weight:600;cursor:pointer;transition:all .2s}.lang-btn.active{background:var(--card-border);color:#fff;border-color:var(--primary)}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-matte)}::-webkit-scrollbar-thumb{background:var(--card-border);border-radius:4px}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none!important;margin:0!important}input[type=number]{-moz-appearance:textfield!important;appearance:textfield!important}
