:root{--accent:var(--calc-color-math,#818cf8);--accent-raw:#818cf8;--bg-card:#0d0d1f;--bg-card2:#111827;--input-bg:#1a1a2e;--border:#ffffff12;--text-main:#fff;--text-dim:#88a;--text-muted:#666680;--font-sans:"Plus Jakarta Sans", sans-serif;--font-mono:"JetBrains Mono", monospace}[data-theme=light],[data-theme=light] body{background-color:#e8edf5}[data-theme=light]{--accent:var(--calc-color-math,#4f46e5);--accent-raw:#4f46e5;--bg-card:#fff;--bg-card2:#f0f4f9;--input-bg:#edf2f9;--border:#0000001f;--text-main:#0f172a;--text-dim:#334155;--text-muted:#64748b}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--calc-bg-page,#0d1117);color:var(--text-main);font-family:var(--font-sans);min-height:100vh}.glass-navbar{z-index:100;backdrop-filter:blur(12px);background:#050510eb;border-bottom:1px solid #818cf81f;align-items:center;gap:0;height:60px;padding:0 1.5rem;display:flex;position:sticky;top:0}[data-theme=light] .glass-navbar{background:#f8fafcf2;border-bottom-color:#4f46e52e}.nav-brand{align-items:center;gap:10px;text-decoration:none;display:flex}.nav-logo{width:auto;height:40px}.brand-text{font-family:var(--font-sans);letter-spacing:2px;text-transform:uppercase;color:var(--accent);font-size:1.1rem;font-weight:800}[data-theme=light] .brand-text{color:var(--accent-raw)}.nav-links-container{flex-wrap:nowrap;flex:1;align-items:center;gap:6px;margin-left:16px;display:flex;overflow:hidden}.nav-link{color:#ffffffa6;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;border-radius:4px;padding:4px 6px;font-size:.75rem;font-weight:600;text-decoration:none;transition:color .2s}.nav-link:hover,.nav-link.active{color:#fff}[data-theme=light] .nav-link{color:#0f172a99}[data-theme=light] .nav-link:hover,[data-theme=light] .nav-link.active{color:#0f172a}.nav-toggle{cursor:pointer;background:0 0;border:1px solid #ffffff26;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;gap:5px;margin-left:auto;padding:8px 10px;display:none}.hamburger-bar{background:#fffc;border-radius:2px;width:20px;height:2px;display:block}[data-theme=light] .hamburger-bar{background:var(--text-main)}.nav-dropdown{position:relative}.nav-dropdown-menu{z-index:200;background:#0a0e1af7;border:1px solid #ffffff1a;border-radius:10px;flex-direction:column;min-width:160px;padding:.5rem 0;display:none;position:absolute;top:100%;left:50%;transform:translate(-50%);box-shadow:0 8px 32px #0006}[data-theme=light] .nav-dropdown-menu{background:#fffffffa;border-color:#0000001a}.nav-dropdown:hover .nav-dropdown-menu{display:flex}.nav-dropdown-menu a{color:#ffffffbf;white-space:nowrap;padding:8px 16px;font-size:.82rem;text-decoration:none;transition:color .15s;display:block}.nav-dropdown-menu a:hover{color:#fff}[data-theme=light] .nav-dropdown-menu a{color:#0f172ab3}[data-theme=light] .nav-dropdown-menu a:hover{color:#0f172a}@media (width<=1200px){.nav-toggle{display:flex}.nav-links-container{z-index:99;background:#0a0e1af7;border-bottom:1px solid #ffffff14;flex-direction:column;align-items:flex-start;gap:0;margin-left:0;padding:12px 0;display:none;position:absolute;top:60px;left:0;right:0}.nav-links-container.open{display:flex}.nav-link{width:100%;padding:12px 24px;font-size:.88rem}.nav-dropdown-menu{box-shadow:none;background:#0003;border:none;border-radius:0;min-width:auto;padding:0;display:none;position:static;transform:none}}.page-header{max-width:1200px;margin:0 auto;padding:1.5rem 1.5rem .5rem}.breadcrumb{color:var(--text-dim);margin-bottom:.75rem;font-size:.78rem}.breadcrumb a{color:var(--accent);text-decoration:none}.breadcrumb a:hover{text-decoration:underline}[data-theme=light] .breadcrumb a{color:var(--accent-raw)}.page-title{font-family:var(--font-sans);color:var(--text-main);margin:0 0 .4rem;font-size:clamp(1.6rem,4vw,2.2rem);font-weight:800}.page-subtitle{color:var(--text-dim);margin:0 0 1rem;font-size:1rem;line-height:1.55}.outer-tabs{border-bottom:1px solid var(--border);gap:4px;max-width:1200px;margin:0 auto;padding:0 1.5rem;display:flex}.tab-btn{color:var(--text-dim);font-family:var(--font-sans);cursor:pointer;white-space:nowrap;background:0 0;border:none;border-bottom:3px solid #0000;padding:.65rem 1.1rem;font-size:.875rem;font-weight:600;transition:color .2s,border-color .2s}.tab-btn:hover{color:var(--text-main)}.tab-btn.active{color:var(--accent);border-bottom-color:var(--accent)}[data-theme=light] .tab-btn.active{color:var(--accent-raw);border-bottom-color:var(--accent-raw)}main{max-width:1200px;margin:0 auto;padding:1.5rem 1.5rem 3rem}.tab-content{display:none}.tab-content.active{display:block}.calc-layout{grid-template-columns:1fr 1.5fr;align-items:start;gap:1.25rem;display:grid}@media (width<=768px){.calc-layout{grid-template-columns:1fr}}.input-card,.result-card,.comp-card,.moles-card{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;padding:1.25rem 1.5rem}[data-theme=light] .input-card,[data-theme=light] .result-card,[data-theme=light] .comp-card,[data-theme=light] .moles-card{background:#fff;border-color:#0000001f;box-shadow:0 2px 10px #00000012}.card-title{font-family:var(--font-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim);margin-bottom:1.1rem;font-size:.75rem;font-weight:700}.input-group{flex-direction:column;gap:.4rem;margin-bottom:1rem;display:flex}.input-group:last-child{margin-bottom:0}.input-label{color:var(--text-dim);font-size:.85rem;font-weight:500}.glass-input{background:var(--input-bg);border:1px solid var(--border);color:var(--text-main);font-family:var(--font-mono);border-radius:10px;width:100%;padding:.6rem .85rem;font-size:1rem;transition:border-color .2s}.glass-input:focus{border-color:var(--accent);outline:none}.glass-select{-webkit-appearance:none;appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238888aa' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;padding-right:2rem}[data-theme=light] .glass-input{color:#0f172a;background:#f0f4f9;border-color:#00000026}[data-theme=light] .glass-input:focus{border-color:var(--accent-raw)}.glass-input::placeholder{color:#ffffff4d}[data-theme=light] .glass-input::placeholder{color:#00000059}.input-hint{color:var(--text-muted);font-size:.78rem;line-height:1.5}[data-theme=light] .input-hint{color:#64748b}.preset-row{flex-wrap:wrap;gap:6px;display:flex}.preset-chip{background:var(--bg-card2);border:1px solid var(--border);color:var(--text-dim);font-family:var(--font-mono);cursor:pointer;border-radius:20px;padding:4px 12px;font-size:.78rem;transition:background .15s,color .15s,border-color .15s}.preset-chip:hover,.preset-chip.active{border-color:var(--accent);color:var(--accent);background:#818cf826}[data-theme=light] .preset-chip{color:#475569;background:#edf2f9;border-color:#0000001a}[data-theme=light] .preset-chip:hover,[data-theme=light] .preset-chip.active{border-color:var(--accent-raw);color:var(--accent-raw);background:#4f46e51a}.error-box{color:#fca5a5;background:#ef44441f;border:1px solid #ef444459;border-radius:10px;margin-bottom:1rem;padding:.65rem 1rem;font-size:.85rem;line-height:1.5}[data-theme=light] .error-box{color:#7f1d1d;background:#fff1f2;border-color:#ef444466}.hero-result{text-align:center;border-bottom:1px solid var(--border);margin-bottom:1.25rem;padding:1.25rem 0 1rem}[data-theme=light] .hero-result{border-bottom-color:#00000014}.hero-value{font-family:var(--font-mono);color:var(--accent);font-size:clamp(2.2rem,6vw,3rem);font-weight:700;line-height:1.1}[data-theme=light] .hero-value{color:var(--accent-raw)}.hero-unit{font-family:var(--font-mono);color:var(--text-dim);margin-top:.2rem;font-size:1rem}.hero-label{color:var(--text-muted);margin-top:.35rem;font-size:.88rem}.action-bar{flex-wrap:wrap;gap:8px;margin-bottom:1.25rem;display:flex}.action-btn{background:var(--bg-card2);border:1px solid var(--border);color:var(--text-dim);cursor:pointer;border-radius:8px;padding:6px 14px;font-size:.8rem;font-weight:600;transition:background .15s,color .15s}.action-btn:hover{color:var(--text-main);background:#818cf81f}.action-btn--reset{margin-left:auto}[data-theme=light] .action-btn{color:#475569;background:#edf2f9;border-color:#0000001a}[data-theme=light] .action-btn:hover{color:#0f172a;background:#4f46e514}.breakdown-section{margin-top:.5rem}.section-label{letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim);margin-bottom:.75rem;font-size:.75rem;font-weight:700}.table-wrap{-webkit-overflow-scrolling:touch;overflow-x:auto}.breakdown-table{border-collapse:collapse;width:100%;font-size:.85rem}.breakdown-table th{text-align:left;letter-spacing:.06em;text-transform:uppercase;color:var(--text-dim);border-bottom:1px solid var(--border);white-space:nowrap;padding:6px 10px;font-size:.73rem;font-weight:700}.breakdown-table td{color:var(--text-main);font-family:var(--font-mono);white-space:nowrap;border-bottom:1px solid #ffffff0a;padding:8px 10px;font-size:.82rem}.breakdown-table td.el-name{font-family:var(--font-sans);color:var(--text-dim)}.breakdown-table tbody tr:last-child td{border-bottom:none}.breakdown-table tbody tr:hover td{background:#ffffff08}[data-theme=light] .breakdown-table th{color:#64748b;border-bottom-color:#0000001a}[data-theme=light] .breakdown-table td{color:#0f172a;border-bottom-color:#0000000d}[data-theme=light] .breakdown-table td.el-name{color:#475569}[data-theme=light] .breakdown-table tbody tr:hover td{background:#f8fafc}.comp-layout,.moles-layout{flex-direction:column;gap:1.25rem;display:flex}.comp-formula-label,.moles-formula-label{font-family:var(--font-mono);color:var(--accent);margin-bottom:1.25rem;font-size:.9rem;font-weight:600}[data-theme=light] .comp-formula-label,[data-theme=light] .moles-formula-label{color:var(--accent-raw)}.chart-wrap{margin-bottom:1.5rem}.moles-inputs{grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1.5rem;display:grid}@media (width<=480px){.moles-inputs{grid-template-columns:1fr}}.mole-result-grid{grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1.25rem;display:grid}@media (width<=640px){.mole-result-grid{grid-template-columns:1fr}}.mole-stat{background:var(--bg-card2);border:1px solid var(--border);text-align:center;border-radius:12px;padding:1rem}[data-theme=light] .mole-stat{background:#edf2f9;border-color:#0000001a}.mole-stat-label{text-transform:uppercase;letter-spacing:.07em;color:var(--text-dim);margin-bottom:.5rem;font-size:.73rem;font-weight:700}.mole-stat-value{font-family:var(--font-mono);color:var(--accent);word-break:break-all;font-size:1.3rem;font-weight:700;line-height:1.2}[data-theme=light] .mole-stat-value{color:var(--accent-raw)}.mole-stat-unit{color:var(--text-dim);margin-top:.2rem;font-size:.75rem}.mole-stat-formula{color:var(--text-muted);margin-top:.35rem;font-size:.7rem;font-style:italic}[data-theme=light] .mole-stat-formula{color:#94a3b8}.avogadro-box{background:#818cf814;border:1px solid #818cf833;border-radius:10px;flex-wrap:wrap;align-items:center;gap:.75rem;padding:.75rem 1rem;font-size:.82rem;display:flex}[data-theme=light] .avogadro-box{background:#4f46e50f;border-color:#4f46e533}.avogadro-label{color:var(--text-dim);font-weight:600}.avogadro-value{font-family:var(--font-mono);color:var(--accent);font-size:.88rem}[data-theme=light] .avogadro-value{color:var(--accent-raw)}.calc-back-to-top{background:var(--accent);color:#fff;cursor:pointer;opacity:0;pointer-events:none;z-index:50;border:none;border-radius:50%;width:42px;height:42px;font-size:1.3rem;line-height:1;transition:opacity .25s;position:fixed;bottom:1.5rem;right:1.5rem}[data-theme=light] .calc-back-to-top{background:var(--accent-raw)}.skip-link{width:1px;height:1px;position:absolute;top:auto;left:-9999px;overflow:hidden}.skip-link:focus{background:var(--accent);color:#fff;z-index:9999;width:auto;height:auto;padding:8px 16px;font-size:.9rem;font-weight:600;position:fixed;top:0;left:0}