:root{--bg-primary: #0a0e14;--bg-secondary: #0f1319;--bg-surface: #151b23;--bg-surface-hover: #1a2230;--bg-elevated: #1e2736;--text-primary: #f0f4f8;--text-secondary: #94a3b8;--text-muted: #64748b;--brand: #06b6d4;--brand-light: #22d3ee;--brand-dark: #0891b2;--brand-glow: rgba(6, 182, 212, .15);--brand-glow-strong: rgba(6, 182, 212, .25);--accent: #f59e0b;--accent-light: #fbbf24;--accent-glow: rgba(245, 158, 11, .12);--success: #10b981;--info: #3b82f6;--border: rgba(148, 163, 184, .1);--border-hover: rgba(148, 163, 184, .2);--border-brand: rgba(6, 182, 212, .3);--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 4px 16px rgba(0, 0, 0, .3);--shadow-lg: 0 12px 40px rgba(0, 0, 0, .4);--shadow-glow: 0 0 40px rgba(6, 182, 212, .08);--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--radius-full: 9999px;--ease: cubic-bezier(.4, 0, .2, 1);--duration: .2s;--glass-bg: rgba(15, 19, 25, .7);--glass-border: rgba(148, 163, 184, .08);--glass-blur: 20px;color-scheme:dark}body.light{--bg-primary: #f8fafc;--bg-secondary: #f1f5f9;--bg-surface: #ffffff;--bg-surface-hover: #f8fafc;--bg-elevated: #ffffff;--text-primary: #0f172a;--text-secondary: #475569;--text-muted: #94a3b8;--brand: #0891b2;--brand-light: #06b6d4;--brand-dark: #0e7490;--brand-glow: rgba(8, 145, 178, .08);--brand-glow-strong: rgba(8, 145, 178, .15);--accent: #d97706;--accent-light: #f59e0b;--accent-glow: rgba(217, 119, 6, .08);--border: rgba(15, 23, 42, .08);--border-hover: rgba(15, 23, 42, .15);--border-brand: rgba(8, 145, 178, .25);--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 16px rgba(0, 0, 0, .08);--shadow-lg: 0 12px 40px rgba(0, 0, 0, .1);--shadow-glow: 0 0 40px rgba(8, 145, 178, .05);--glass-bg: rgba(255, 255, 255, .75);--glass-border: rgba(15, 23, 42, .06);color-scheme:light}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:16px;line-height:1.6;color:var(--text-primary);background:var(--bg-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}a{color:inherit;text-decoration:none}button,input,select{font:inherit;color:inherit}button{cursor:pointer;border:none;background:none}svg{display:block;flex-shrink:0}img{max-width:100%;display:block}h1,h2,h3,h4,p{overflow-wrap:anywhere}.wrap{width:min(1200px,calc(100% - 40px));margin:0 auto}.content-narrow{max-width:860px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:absolute;top:-60px;left:16px;z-index:100;padding:12px 18px;background:var(--brand);color:#fff;border-radius:var(--radius-sm);font-weight:700;transition:top var(--duration) var(--ease)}.skip-link:focus{top:12px}.site-header{position:sticky;top:0;z-index:50;background:var(--glass-bg);border-bottom:1px solid var(--glass-border);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur))}.nav{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}.logo{display:inline-flex;align-items:center;gap:10px;font-weight:800;font-size:1.1rem;letter-spacing:-.02em}.logo-icon{width:36px;height:36px;display:grid;place-items:center;border-radius:var(--radius-sm);background:linear-gradient(135deg,var(--brand),var(--brand-dark));color:#fff;box-shadow:0 2px 8px #06b6d44d}.logo-icon svg{width:18px;height:18px}.nav-links{display:flex;align-items:center;gap:8px}.nav-links a{padding:8px 14px;border-radius:var(--radius-sm);color:var(--text-secondary);font-size:.9rem;font-weight:500;transition:all var(--duration) var(--ease)}.nav-links a:hover,.nav-links a:focus-visible{color:var(--text-primary);background:var(--brand-glow)}.theme-toggle{width:40px;height:40px;display:grid;place-items:center;border-radius:var(--radius-sm);color:var(--text-secondary);border:1px solid var(--border);transition:all var(--duration) var(--ease)}.theme-toggle:hover{color:var(--text-primary);border-color:var(--border-hover);background:var(--brand-glow)}.theme-toggle svg{width:18px;height:18px}.icon-sun{display:none}body.light .icon-sun{display:block}body.light .icon-moon{display:none}.menu-toggle{display:none;width:44px;height:44px;flex-direction:column;align-items:center;justify-content:center;gap:5px;border-radius:var(--radius-sm);border:1px solid var(--border);color:var(--text-primary)}.hamburger-line{display:block;width:20px;height:2px;background:currentColor;border-radius:1px;transition:all var(--duration) var(--ease)}:focus-visible{outline:2px solid var(--brand);outline-offset:2px}.hero{position:relative;padding:60px 0 30px;overflow:hidden}.hero-bg-effects{position:absolute;inset:0;pointer-events:none;overflow:hidden}.glow{position:absolute;border-radius:50%;filter:blur(100px);opacity:.4}.glow-1{width:600px;height:600px;top:-200px;left:-100px;background:radial-gradient(circle,rgba(6,182,212,.15),transparent 70%);animation:glowFloat 12s ease-in-out infinite}.glow-2{width:400px;height:400px;top:100px;right:-100px;background:radial-gradient(circle,rgba(245,158,11,.1),transparent 70%);animation:glowFloat 15s ease-in-out infinite reverse}.glow-3{width:300px;height:300px;bottom:-100px;left:30%;background:radial-gradient(circle,rgba(59,130,246,.08),transparent 70%);animation:glowFloat 10s ease-in-out infinite}@keyframes glowFloat{0%,to{transform:translate(0) scale(1)}33%{transform:translate(20px,-30px) scale(1.05)}66%{transform:translate(-15px,15px) scale(.95)}}.hero-grid{position:relative;display:grid;grid-template-columns:1fr 440px;gap:60px;align-items:start}.hero-content{padding-top:20px}.badge{display:inline-flex;align-items:center;gap:8px;padding:6px 16px 6px 10px;border-radius:var(--radius-full);background:var(--brand-glow);border:1px solid var(--border-brand);color:var(--brand-light);font-size:.8rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;margin-bottom:24px}.badge-dot{width:8px;height:8px;border-radius:50%;background:var(--brand);box-shadow:0 0 8px var(--brand);animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.85)}}h1{font-size:clamp(2.8rem,6vw,4.5rem);font-weight:900;line-height:.95;letter-spacing:-.03em;background:linear-gradient(135deg,var(--text-primary) 0%,var(--text-secondary) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:20px}h2{font-size:clamp(1.6rem,3.5vw,2.5rem);font-weight:800;line-height:1.1;letter-spacing:-.02em;margin-bottom:16px}h3{font-size:1.15rem;font-weight:700;margin-bottom:12px;margin-top:32px}.hero-subtitle{font-size:1.1rem;color:var(--text-secondary);max-width:540px;line-height:1.7;margin-bottom:28px}.feature-pills{display:flex;flex-wrap:wrap;gap:10px;list-style:none;margin-bottom:40px}.feature-pills li{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:var(--radius-full);background:var(--bg-surface);border:1px solid var(--border);font-size:.85rem;font-weight:600;color:var(--text-secondary);transition:all var(--duration) var(--ease)}.feature-pills li:hover{border-color:var(--border-brand);color:var(--text-primary)}.feature-pills svg{width:14px;height:14px;color:var(--brand)}.density-visual{padding:20px;border-radius:var(--radius-lg);background:var(--bg-surface);border:1px solid var(--border);box-shadow:var(--shadow-md)}.density-visual-header{margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--border)}.density-visual-header span{font-size:.8rem;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em}.density-bars{display:grid;gap:8px}.d-bar{display:grid;grid-template-columns:60px 1fr 50px;gap:10px;align-items:center;font-size:.85rem}.d-bar span{font-weight:700;color:var(--text-secondary)}.d-bar b{font-weight:800;text-align:right}.d-track{height:10px;border-radius:var(--radius-full);background:var(--border);overflow:hidden}.d-fill{display:block;width:var(--pct);height:100%;border-radius:inherit;animation:fillGrow 1.2s var(--ease) forwards;animation-delay:var(--delay);transform-origin:left;transform:scaleX(0)}.d-fill.water{background:linear-gradient(90deg,#06b6d4,#22d3ee)}.d-fill.milk{background:linear-gradient(90deg,#8b5cf6,#a78bfa)}.d-fill.flour{background:linear-gradient(90deg,#3b82f6,#60a5fa)}.d-fill.sugar{background:linear-gradient(90deg,#f59e0b,#fbbf24)}.d-fill.honey{background:linear-gradient(90deg,#f97316,#fb923c)}.d-fill.butter{background:linear-gradient(90deg,#eab308,#facc15)}.d-fill.oil{background:linear-gradient(90deg,#84cc16,#a3e635)}@keyframes fillGrow{to{transform:scaleX(1)}}.calc-card{position:sticky;top:88px;border-radius:var(--radius-xl);background:var(--bg-surface);border:1px solid var(--border);box-shadow:var(--shadow-lg),var(--shadow-glow);overflow:hidden;transition:box-shadow .3s var(--ease)}.calc-card:hover{box-shadow:var(--shadow-lg),0 0 60px #06b6d41f}.calc-card-inner{padding:28px}.calc-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}.calc-header h2{font-size:1.35rem;margin-bottom:0}.density-badge{padding:5px 12px;border-radius:var(--radius-full);background:var(--brand-glow);border:1px solid var(--border-brand);color:var(--brand-light);font-size:.8rem;font-weight:800;white-space:nowrap;transition:all .3s var(--ease)}.calc-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:var(--radius-md);background:var(--bg-secondary);border:1px solid var(--border);margin-bottom:24px}.calc-tab{padding:10px 8px;border-radius:var(--radius-sm);font-size:.85rem;font-weight:700;color:var(--text-muted);transition:all var(--duration) var(--ease);white-space:nowrap}.calc-tab.active{background:var(--brand);color:#fff;box-shadow:0 2px 8px #06b6d44d}.calc-tab:not(.active):hover{color:var(--text-primary);background:var(--brand-glow)}.calc-form{display:grid;gap:18px}.form-group{display:grid;gap:6px}.form-group label{font-size:.88rem;font-weight:700;color:var(--text-secondary)}.select-wrap{position:relative}.select-chevron{position:absolute;right:14px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--text-muted);pointer-events:none}select{width:100%;min-height:48px;padding:12px 40px 12px 14px;border-radius:var(--radius-md);border:1px solid var(--border);background:var(--bg-secondary);color:var(--text-primary);font-weight:600;appearance:none;transition:all var(--duration) var(--ease);cursor:pointer}select:hover{border-color:var(--border-hover)}select:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-glow)}.input-wrap{position:relative;display:flex;border-radius:var(--radius-md);border:1px solid var(--border);background:var(--bg-secondary);overflow:hidden;transition:all var(--duration) var(--ease)}.input-wrap:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-glow)}.input-wrap input{flex:1;min-height:48px;padding:12px 14px;border:none;background:transparent;font-weight:600;font-size:1.1rem;min-width:0}.input-wrap input:focus{outline:none}.input-unit{display:grid;place-items:center;padding:0 16px;background:var(--border);font-weight:800;font-size:.88rem;color:var(--text-muted);border-left:1px solid var(--border);white-space:nowrap}.input-help{font-size:.8rem;color:var(--text-muted)}.btn-convert{display:flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:14px 24px;border-radius:var(--radius-md);background:linear-gradient(135deg,var(--brand),var(--brand-dark));color:#fff;font-weight:800;font-size:1rem;letter-spacing:.01em;box-shadow:0 4px 14px #06b6d44d;transition:all var(--duration) var(--ease)}.btn-convert:hover{transform:translateY(-1px);box-shadow:0 6px 20px #06b6d466}.btn-convert:active{transform:translateY(0)}.btn-convert svg{width:18px;height:18px}.result-panel{padding:20px;border-radius:var(--radius-md);background:linear-gradient(135deg,var(--brand-glow),var(--accent-glow));border:1px solid var(--border-brand);transition:all .4s var(--ease)}.result-label{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}.result-label span{font-size:.85rem;font-weight:700;color:var(--brand-light);text-transform:uppercase;letter-spacing:.04em}.info-btn{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;color:var(--text-muted);background:var(--border);transition:all var(--duration) var(--ease)}.info-btn:hover{color:var(--text-primary);background:var(--border-hover)}.info-btn svg{width:16px;height:16px}.result-value{display:block;font-size:clamp(2rem,8vw,3rem);font-weight:900;line-height:1;margin-bottom:8px;letter-spacing:-.02em}.result-formula{font-size:.9rem;font-weight:600;color:var(--text-secondary);margin:0}.result-steps{margin-top:16px;padding-top:16px;border-top:1px solid var(--border)}.steps-title{font-size:.75rem;font-weight:800;color:var(--brand-light);letter-spacing:.06em;text-transform:uppercase;margin-bottom:8px}.result-steps ol{padding-left:20px;color:var(--text-secondary);font-size:.88rem;display:grid;gap:4px}.action-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.btn-secondary{display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:10px 16px;border-radius:var(--radius-md);background:var(--bg-secondary);border:1px solid var(--border);font-weight:700;font-size:.88rem;color:var(--text-secondary);transition:all var(--duration) var(--ease)}.btn-secondary:hover{background:var(--bg-surface-hover);border-color:var(--border-hover);color:var(--text-primary)}.btn-secondary svg{width:16px;height:16px}.copy-feedback{font-size:.82rem;color:var(--success);font-weight:600;min-height:1.4em}.section{padding:60px 0}.section-compact{padding:50px 0 60px}.section-alt{background:var(--bg-secondary)}.section-header{max-width:760px;margin:0 auto 36px;text-align:center}.section-desc{color:var(--text-secondary);margin-top:8px;max-width:640px;margin-inline:auto}.eyebrow{display:inline-block;margin-bottom:12px;padding:4px 12px;border-radius:var(--radius-full);background:var(--brand-glow);color:var(--brand-light);font-size:.75rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.body-text{color:var(--text-secondary);font-size:1.05rem;line-height:1.75;margin-bottom:16px}.split-layout{display:grid;grid-template-columns:1fr minmax(340px,440px);gap:56px;align-items:center}.split-content .eyebrow{margin-bottom:16px}.density-card{padding:24px;border-radius:var(--radius-lg);background:var(--bg-surface);border:1px solid var(--border);box-shadow:var(--shadow-lg)}.density-card-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding-bottom:16px;margin-bottom:18px;border-bottom:1px solid var(--border)}.density-card-header span{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted)}.density-card-header strong{text-align:right;line-height:1.2;font-size:.95rem}.density-card-bars{display:grid;gap:10px}.dc-bar{display:grid;grid-template-columns:55px 1fr 48px;gap:10px;align-items:center;font-size:.85rem}.dc-bar span{font-weight:700;color:var(--text-secondary)}.dc-bar b{font-weight:800;text-align:right}.dc-bar div{height:12px;border-radius:var(--radius-full);background:var(--border);overflow:hidden}.dc-bar i{display:block;width:var(--fill);height:100%;border-radius:inherit}.fill-flour{background:linear-gradient(90deg,#3b82f6,#60a5fa)}.fill-sugar{background:linear-gradient(90deg,#f59e0b,#fbbf24)}.fill-oil{background:linear-gradient(90deg,#84cc16,#a3e635)}.fill-water{background:linear-gradient(90deg,#06b6d4,#22d3ee)}.fill-milk{background:linear-gradient(90deg,#8b5cf6,#a78bfa)}.fill-honey{background:linear-gradient(90deg,#f97316,#fb923c)}.formula-strip{display:grid;grid-template-columns:1fr auto 1.3fr auto 1fr;gap:8px;align-items:center;margin-top:20px;padding-top:16px;border-top:1px solid var(--border);text-align:center}.formula-strip span{min-height:38px;display:grid;place-items:center;padding:6px 8px;border-radius:var(--radius-sm);background:var(--brand-glow);border:1px solid var(--border-brand);color:var(--brand-light);font-weight:800;font-size:.88rem}.formula-strip b{color:var(--text-muted);font-size:1.1rem}.quick-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:12px}.quick-grid button{min-height:72px;padding:12px;border-radius:var(--radius-md);background:var(--bg-surface);border:1px solid var(--border);font-weight:800;font-size:.9rem;color:var(--text-primary);transition:all var(--duration) var(--ease)}.quick-grid button:hover{transform:translateY(-2px);border-color:var(--border-brand);box-shadow:var(--shadow-md);background:var(--brand-glow)}.ingredient-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}.ingredient-card{display:flex;flex-direction:column;gap:4px;padding:20px;border-radius:var(--radius-md);background:var(--bg-surface);border:1px solid var(--border);transition:all var(--duration) var(--ease)}.ingredient-card:hover{transform:translateY(-3px);border-color:var(--border-brand);box-shadow:var(--shadow-md),var(--shadow-glow)}.ing-icon{font-size:1.6rem;margin-bottom:6px}.ing-name{font-weight:800;font-size:1rem}.ingredient-card small{color:var(--text-muted);font-size:.85rem}.formula-card{padding:28px;border-radius:var(--radius-lg);background:var(--bg-surface);border:1px solid var(--border);box-shadow:var(--shadow-lg)}.formula-cubes{display:flex;align-items:flex-end;gap:14px;height:120px;margin-bottom:24px}.cube{border-radius:var(--radius-sm);animation:cubeFloat 4s ease-in-out infinite}.cube.c1{width:64px;height:64px;background:linear-gradient(135deg,var(--brand),var(--brand-dark));animation-delay:0s}.cube.c2{width:64px;height:96px;background:linear-gradient(135deg,var(--accent),var(--accent-light));animation-delay:.3s}.cube.c3{width:80px;height:48px;background:linear-gradient(135deg,var(--info),#60a5fa);animation-delay:.6s}@keyframes cubeFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.formula-label{font-size:.85rem;font-weight:700;color:var(--text-muted);margin-bottom:8px}.formula-equation{display:block;font-size:1.45rem;line-height:1.2}.formula-examples{margin-top:20px;padding-top:18px;border-top:1px solid var(--border);color:var(--text-secondary);font-size:.92rem}.formula-examples p{margin:5px 0}.formula-examples b{color:var(--text-primary)}.table-controls{display:flex;gap:16px;margin-bottom:16px;flex-wrap:wrap}.table-control-item{display:flex;flex-direction:column;gap:6px}.table-control-item label{font-size:.85rem;font-weight:700;color:var(--text-secondary)}.table-control-item input{min-height:44px;padding:10px 14px;border-radius:var(--radius-md);border:1px solid var(--border);background:var(--bg-surface);color:var(--text-primary);font-weight:500;min-width:200px;transition:all var(--duration) var(--ease)}.table-control-item input:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-glow);outline:none}.table-wrap{overflow-x:auto;border-radius:var(--radius-md);border:1px solid var(--border);background:var(--bg-surface)}table{width:100%;min-width:560px;border-collapse:collapse}th,td{padding:14px 18px;text-align:left;border-bottom:1px solid var(--border)}thead th{background:var(--brand-glow);font-size:.82rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--text-secondary)}tbody tr{transition:background var(--duration) var(--ease)}tbody tr:hover{background:var(--brand-glow)}tbody tr:last-child th,tbody tr:last-child td{border-bottom:0}.is-hidden{display:none}.table-note{margin-top:14px;text-align:center;color:var(--text-muted);font-size:.85rem}.link-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.link-grid a{display:flex;align-items:center;justify-content:center;min-height:60px;padding:14px;border-radius:var(--radius-md);background:var(--bg-surface);border:1px solid var(--border);font-weight:700;font-size:.92rem;text-align:center;transition:all var(--duration) var(--ease)}.link-grid a:hover{transform:translateY(-2px);border-color:var(--border-brand);box-shadow:var(--shadow-md);color:var(--brand-light)}.faq-list{display:grid;gap:10px}details{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--bg-surface);transition:all var(--duration) var(--ease);overflow:hidden}details:hover{border-color:var(--border-hover)}details[open]{border-color:var(--border-brand);box-shadow:0 0 20px var(--brand-glow)}summary{padding:18px 20px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;font-weight:700;font-size:1rem;list-style:none;transition:background var(--duration) var(--ease)}summary::-webkit-details-marker{display:none}summary:hover{background:var(--brand-glow)}summary svg{width:20px;height:20px;color:var(--text-muted);flex-shrink:0;transition:transform .3s var(--ease)}details[open] summary svg{transform:rotate(180deg)}.faq-body{padding:0 20px 20px}.faq-body p{color:var(--text-secondary);line-height:1.75}.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.related-card{display:flex;flex-direction:column;gap:8px;padding:24px;border-radius:var(--radius-md);background:var(--bg-surface);border:1px solid var(--border);transition:all var(--duration) var(--ease)}.related-card:hover{transform:translateY(-3px);border-color:var(--border-brand);box-shadow:var(--shadow-md),var(--shadow-glow)}.related-icon{font-size:1.5rem}.related-card strong{font-size:1.02rem}.related-card small{color:var(--text-muted);font-size:.88rem;line-height:1.5}.site-footer{padding:60px 0 0;background:var(--bg-secondary);border-top:1px solid var(--border)}.footer-grid{display:grid;grid-template-columns:1.2fr .8fr 1.2fr;gap:40px;padding-bottom:40px}.footer-brand p{color:var(--text-muted);margin-top:16px;font-size:.92rem;max-width:280px}.logo-footer{margin-bottom:8px}.footer-links h3,.footer-newsletter h3{font-size:.9rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);margin-bottom:16px;margin-top:0}.footer-links{display:flex;flex-direction:column;gap:10px}.footer-links a{color:var(--text-secondary);font-size:.92rem;transition:color var(--duration) var(--ease)}.footer-links a:hover{color:var(--brand-light)}.footer-newsletter p{color:var(--text-muted);font-size:.9rem;margin-bottom:14px}.newsletter-row{display:flex;gap:8px}.newsletter-row input{flex:1;min-height:44px;padding:10px 14px;border-radius:var(--radius-md);border:1px solid var(--border);background:var(--bg-primary);color:var(--text-primary);min-width:0}.newsletter-row input:focus{border-color:var(--brand);outline:none}.newsletter-row button{padding:10px 20px;border-radius:var(--radius-md);background:linear-gradient(135deg,var(--brand),var(--brand-dark));color:#fff;font-weight:800;font-size:.88rem;white-space:nowrap;box-shadow:0 2px 8px #06b6d44d;transition:all var(--duration) var(--ease)}.newsletter-row button:hover{transform:translateY(-1px);box-shadow:0 4px 12px #06b6d466}.newsletter-status{font-size:.82rem;color:var(--success);font-weight:600;min-height:1.4em;margin-top:8px}.footer-bottom{padding:20px 0;border-top:1px solid var(--border);text-align:center}.footer-bottom p{color:var(--text-muted);font-size:.85rem}@media(max-width:1024px){.hero-grid{grid-template-columns:1fr;gap:40px}.calc-card{position:static}.split-layout{grid-template-columns:1fr;gap:32px}.quick-grid{grid-template-columns:repeat(4,1fr)}.related-grid{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:1fr 1fr}}@media(max-width:768px){.menu-toggle{display:flex}.nav{flex-wrap:wrap}.nav-links{width:100%;display:none;flex-direction:column;gap:4px;padding:8px 0 16px}.nav-links.is-open{display:flex}.nav-links a{padding:12px 14px}.hero{padding:36px 0 48px}.section{padding:56px 0}h1{font-size:clamp(2.2rem,8vw,3.2rem)}.feature-pills{flex-direction:column;gap:8px}.feature-pills li{justify-content:flex-start}.quick-grid,.link-grid{grid-template-columns:repeat(2,1fr)}.ingredient-grid{grid-template-columns:1fr 1fr}.related-grid{grid-template-columns:1fr}.table-controls{flex-direction:column}.table-control-item input{min-width:unset}.footer-grid{grid-template-columns:1fr;gap:32px}.density-card-header{flex-direction:column}.density-card-header strong{text-align:left}.action-row{grid-template-columns:1fr}}@media(max-width:480px){.wrap{width:calc(100% - 32px)}.quick-grid,.link-grid,.ingredient-grid{grid-template-columns:1fr}.calc-card-inner{padding:20px}.calc-tabs{grid-template-columns:1fr}.newsletter-row{flex-direction:column}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}@keyframes resultPop{0%{transform:scale(.95);opacity:.7}50%{transform:scale(1.02)}to{transform:scale(1);opacity:1}}.result-value.animate{animation:resultPop .3s var(--ease)}.interactive-formula-card{padding:24px;border-radius:var(--radius-lg);background:var(--bg-surface);border:1px solid var(--border);box-shadow:var(--shadow-lg)}.ifc-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding-bottom:16px;margin-bottom:20px;border-bottom:1px solid var(--border)}.ifc-header span{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted)}.ifc-header strong{text-align:right;line-height:1.2;font-size:.95rem}.ifc-equation{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:20px}.ifc-input-group{flex:1;min-width:80px}.ifc-input-group label{display:block;font-size:.75rem;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}.ifc-input-group input,.ifc-input-group select{width:100%;min-height:44px;padding:10px 12px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-secondary);color:var(--text-primary);font-weight:700;font-size:1rem;transition:all var(--duration) var(--ease)}.ifc-input-group input:focus,.ifc-input-group select:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-glow);outline:none}.ifc-operator{font-size:1.4rem;font-weight:900;color:var(--text-muted);padding-bottom:10px}.ifc-result-group{flex:1;min-width:100px}.ifc-result-group label{display:block;font-size:.75rem;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}.ifc-result{min-height:44px;display:flex;align-items:center;padding:10px 12px;border-radius:var(--radius-sm);background:linear-gradient(135deg,var(--brand-glow),var(--accent-glow));border:1px solid var(--border-brand);font-weight:900;font-size:1.1rem;color:var(--brand-light)}.ifc-bar-visual{padding-top:16px;border-top:1px solid var(--border)}.ifc-bar-track{height:12px;border-radius:var(--radius-full);background:var(--border);overflow:hidden;margin-bottom:6px}.ifc-bar-fill{height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--brand),var(--accent));transition:width .4s var(--ease)}.ifc-bar-labels{display:flex;justify-content:space-between;font-size:.75rem;font-weight:700;color:var(--text-muted)}.interactive-volume-card{padding:24px;border-radius:var(--radius-lg);background:var(--bg-surface);border:1px solid var(--border);box-shadow:var(--shadow-lg)}.ivc-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding-bottom:16px;margin-bottom:20px;border-bottom:1px solid var(--border)}.ivc-header span{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted)}.ivc-header strong{text-align:right;line-height:1.2;font-size:.95rem}.ivc-beaker{display:flex;justify-content:center;margin-bottom:20px}.ivc-beaker-body{position:relative;width:140px;height:220px;border:3px solid var(--border-hover);border-top:none;border-radius:0 0 16px 16px;background:var(--bg-secondary);overflow:hidden}.ivc-liquid{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(180deg,#06b6d44d,#06b6d499);border-radius:0 0 13px 13px;transition:height .4s var(--ease);overflow:hidden}.ivc-liquid:before{content:"";position:absolute;top:0;left:-10%;right:-10%;height:8px;background:#06b6d466;border-radius:50%;animation:wave 3s ease-in-out infinite}@keyframes wave{0%,to{transform:translate(0) scaleY(1)}50%{transform:translate(5px) scaleY(1.5)}}.ivc-bubbles span{position:absolute;width:6px;height:6px;border-radius:50%;background:#ffffff4d;animation:bubbleUp 3s ease-in-out infinite}.ivc-bubbles span:nth-child(1){left:20%;animation-delay:0s}.ivc-bubbles span:nth-child(2){left:50%;animation-delay:1s;width:4px;height:4px}.ivc-bubbles span:nth-child(3){left:75%;animation-delay:2s;width:5px;height:5px}@keyframes bubbleUp{0%{bottom:0;opacity:0}20%{opacity:.6}to{bottom:100%;opacity:0}}.ivc-markings{position:absolute;top:0;right:8px;bottom:0;display:flex;flex-direction:column;justify-content:space-between;padding:8px 0}.ivc-markings span{font-size:.65rem;font-weight:700;color:var(--text-muted);text-align:right}.ivc-controls{display:grid;gap:12px}.ivc-controls input[type=range]{width:100%;height:8px;border-radius:var(--radius-full);background:var(--border);appearance:none;cursor:pointer}.ivc-controls input[type=range]::-webkit-slider-thumb{appearance:none;width:22px;height:22px;border-radius:50%;background:var(--brand);box-shadow:0 2px 8px #06b6d466;cursor:pointer}.ivc-controls input[type=range]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--brand);box-shadow:0 2px 8px #06b6d466;cursor:pointer;border:none}.ivc-readout{display:flex;align-items:center;justify-content:center;gap:12px;padding:10px;border-radius:var(--radius-sm);background:var(--brand-glow);border:1px solid var(--border-brand)}.ivc-readout span{font-weight:800;font-size:.95rem}.ivc-readout .ivc-eq{color:var(--text-muted)}.interactive-scale-card{padding:24px;border-radius:var(--radius-lg);background:var(--bg-surface);border:1px solid var(--border);box-shadow:var(--shadow-lg)}.isc-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding-bottom:16px;margin-bottom:20px;border-bottom:1px solid var(--border)}.isc-header span{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted)}.isc-header strong{text-align:right;line-height:1.2;font-size:.95rem}.isc-scale-display{display:flex;flex-direction:column;align-items:center;gap:16px;margin-bottom:20px}.isc-display-screen{display:flex;align-items:baseline;gap:4px;padding:16px 32px;border-radius:var(--radius-md);background:var(--bg-secondary);border:2px solid var(--border);min-width:160px;justify-content:center}.isc-display-value{font-size:2.5rem;font-weight:900;font-variant-numeric:tabular-nums;line-height:1;transition:all .3s var(--ease)}.isc-display-value.animate{animation:resultPop .3s var(--ease)}.isc-display-unit{font-size:1.2rem;font-weight:700;color:var(--text-muted)}.isc-scale-platform{width:120px;height:48px;border-radius:var(--radius-md) var(--radius-md) 0 0;background:linear-gradient(180deg,var(--bg-elevated),var(--bg-secondary));border:1px solid var(--border);border-bottom:3px solid var(--brand);display:grid;place-items:center}.isc-ingredient-icon{font-size:1.8rem;transition:all .3s var(--ease)}.isc-buttons{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:12px}.isc-btn{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 4px;border-radius:var(--radius-sm);background:var(--bg-secondary);border:1px solid var(--border);transition:all var(--duration) var(--ease);cursor:pointer}.isc-btn:hover{border-color:var(--border-brand);background:var(--brand-glow)}.isc-btn.active{border-color:var(--brand);background:var(--brand-glow-strong);box-shadow:0 0 12px var(--brand-glow)}.isc-btn span{font-size:1.2rem}.isc-btn small{font-size:.65rem;font-weight:700;color:var(--text-muted);white-space:nowrap}.isc-note{text-align:center;font-size:.8rem;color:var(--text-muted);font-weight:600}.comparison-grid{margin-top:40px;padding:24px;border-radius:var(--radius-lg);background:var(--bg-surface);border:1px solid var(--border);box-shadow:var(--shadow-md)}.comp-card-header{text-align:center;margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid var(--border)}.comp-card-header strong{font-size:1rem}.comp-items{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-bottom:16px}.comp-item{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}.comp-bar-wrap{width:100%;height:120px;display:flex;align-items:flex-end;justify-content:center}.comp-bar{width:80%;height:var(--comp-height);border-radius:var(--radius-sm) var(--radius-sm) 0 0;display:flex;align-items:flex-start;justify-content:center;padding-top:6px;min-height:30px;transition:height .6s var(--ease)}.comp-bar-water{background:linear-gradient(180deg,#06b6d4,#0891b2)}.comp-bar-milk{background:linear-gradient(180deg,#8b5cf6,#7c3aed)}.comp-bar-flour{background:linear-gradient(180deg,#3b82f6,#2563eb)}.comp-bar-sugar{background:linear-gradient(180deg,#f59e0b,#d97706)}.comp-bar-honey{background:linear-gradient(180deg,#f97316,#ea580c)}.comp-bar-butter{background:linear-gradient(180deg,#eab308,#ca8a04)}.comp-bar-oil{background:linear-gradient(180deg,#84cc16,#65a30d)}.comp-weight{font-size:.65rem;font-weight:800;color:#fff;white-space:nowrap}.comp-emoji{font-size:1.2rem}.comp-label{font-size:.7rem;font-weight:700;color:var(--text-secondary)}.comp-baseline{text-align:center;padding-top:12px;border-top:2px dashed var(--border-brand)}.comp-baseline span{font-size:.75rem;font-weight:700;color:var(--brand-light)}.steps-visual{display:grid;gap:0;margin-top:32px;margin-bottom:40px}.step-card{display:grid;grid-template-columns:auto 1fr;gap:20px;padding:24px;border-radius:var(--radius-md);background:var(--bg-surface);border:1px solid var(--border);opacity:.5;transform:translate(-10px);transition:all .5s var(--ease)}.step-card.active{opacity:1;transform:translate(0);border-color:var(--border-brand);box-shadow:0 0 20px var(--brand-glow)}.step-number{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,var(--brand),var(--brand-dark));color:#fff;font-weight:900;font-size:1.1rem;flex-shrink:0}.step-body h3{margin-top:0;margin-bottom:8px;font-size:1.05rem}.step-body p{color:var(--text-secondary);font-size:.95rem;line-height:1.6;margin:0}.step-connector{display:flex;justify-content:flex-start;padding-left:34px}.step-connector span{display:block;width:2px;height:24px;background:var(--border)}.live-walkthrough{padding:24px;border-radius:var(--radius-lg);background:var(--bg-surface);border:1px solid var(--border);box-shadow:var(--shadow-md)}.lw-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding-bottom:16px;margin-bottom:20px;border-bottom:1px solid var(--border)}.lw-header span{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted)}.lw-header strong{text-align:right;line-height:1.2;font-size:.95rem}.lw-demo{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap}.lw-slot{flex:1;min-width:80px}.lw-slot label{display:block;font-size:.75rem;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}.lw-slot input,.lw-slot select{width:100%;min-height:44px;padding:10px 12px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-secondary);color:var(--text-primary);font-weight:700;transition:all var(--duration) var(--ease)}.lw-slot input:focus,.lw-slot select:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-glow);outline:none}.lw-slot small{display:block;font-size:.75rem;color:var(--text-muted);margin-top:4px;font-weight:600}.lw-slot-result{min-width:100px}.lw-result{min-height:44px;display:flex;align-items:center;padding:10px 12px;border-radius:var(--radius-sm);background:linear-gradient(135deg,var(--brand-glow),var(--accent-glow));border:1px solid var(--border-brand);font-weight:900;font-size:1.15rem;color:var(--brand-light)}.lw-op{font-size:1.4rem;font-weight:900;color:var(--text-muted);padding-bottom:28px}.reverse-calc-card{padding:28px;border-radius:var(--radius-lg);background:var(--bg-surface);border:1px solid var(--border);box-shadow:var(--shadow-lg)}.rc-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px}.rc-input-group{display:grid;gap:6px}.rc-input-group label{font-size:.88rem;font-weight:700;color:var(--text-secondary)}.rc-result-panel{padding:20px;border-radius:var(--radius-md);background:linear-gradient(135deg,var(--brand-glow),var(--accent-glow));border:1px solid var(--border-brand)}.rc-label{display:block;font-size:.85rem;font-weight:700;color:var(--brand-light);text-transform:uppercase;letter-spacing:.04em;margin-bottom:4px}.rc-value{display:block;font-size:clamp(1.8rem,6vw,2.5rem);font-weight:900;line-height:1;margin-bottom:8px;letter-spacing:-.02em}.rc-formula{font-size:.9rem;font-weight:600;color:var(--text-secondary);margin:0}.on-page-nav{position:fixed;bottom:24px;right:24px;z-index:40}.opn-toggle{width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:var(--brand);color:#fff;box-shadow:0 4px 20px #06b6d466;transition:all var(--duration) var(--ease);border:none;cursor:pointer}.opn-toggle:hover{transform:scale(1.1);box-shadow:0 6px 24px #06b6d480}.opn-toggle svg{width:20px;height:20px}.opn-links{display:none;position:absolute;bottom:60px;right:0;min-width:200px;padding:8px;border-radius:var(--radius-md);background:var(--bg-surface);border:1px solid var(--border);box-shadow:var(--shadow-lg);flex-direction:column;gap:2px}.opn-links.is-open{display:flex}.opn-links a{padding:10px 14px;border-radius:var(--radius-sm);font-size:.85rem;font-weight:600;color:var(--text-secondary);transition:all var(--duration) var(--ease)}.opn-links a:hover,.opn-links a.active{color:var(--text-primary);background:var(--brand-glow)}.opn-links a.active{color:var(--brand-light);border-left:2px solid var(--brand)}.formula-diagram{margin-top:32px;padding:24px;border-radius:var(--radius-lg);background:var(--bg-surface);border:1px solid var(--border);box-shadow:var(--shadow-md)}.fd-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap;justify-content:center}.fd-box{flex:1;min-width:120px;padding:20px 16px;border-radius:var(--radius-md);border:1px solid var(--border);text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px;transition:all var(--duration) var(--ease)}.fd-box:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.fd-volume{background:linear-gradient(135deg,#06b6d414,#06b6d405);border-color:#06b6d433}.fd-density{background:linear-gradient(135deg,#f59e0b14,#f59e0b05);border-color:#f59e0b33}.fd-weight{background:linear-gradient(135deg,#10b98114,#10b98105);border-color:#10b98133}.fd-icon{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;background:var(--bg-secondary)}.fd-icon svg{width:22px;height:22px}.fd-volume .fd-icon{color:var(--brand)}.fd-density .fd-icon{color:var(--accent)}.fd-weight .fd-icon{color:var(--success)}.fd-box strong{font-size:.95rem;font-weight:800}.fd-box small{font-size:.78rem;color:var(--text-muted);font-weight:600}.fd-op{font-size:1.6rem;font-weight:900;color:var(--text-muted);flex-shrink:0}.ml-reference-grid,.gram-reference-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:28px}.ml-ref-item,.gram-ref-item{display:flex;flex-direction:column;align-items:center;gap:4px;padding:16px 12px;border-radius:var(--radius-md);background:var(--bg-surface);border:1px solid var(--border);text-align:center;transition:all var(--duration) var(--ease)}.ml-ref-item:hover,.gram-ref-item:hover{transform:translateY(-2px);border-color:var(--border-brand);box-shadow:var(--shadow-sm)}.ml-ref-icon,.gram-ref-icon{font-size:1.5rem;margin-bottom:4px}.ml-ref-item strong,.gram-ref-item strong{font-size:1rem;font-weight:800}.ml-ref-item small,.gram-ref-item small{font-size:.78rem;color:var(--text-muted);font-weight:600}.density-data-grid{display:grid;gap:10px;margin-top:28px}.dd-card{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:14px 16px;border-radius:var(--radius-md);background:var(--bg-surface);border:1px solid var(--border);transition:all var(--duration) var(--ease)}.dd-card:hover{border-color:var(--border-brand);box-shadow:var(--shadow-sm)}.dd-emoji{font-size:1.3rem}.dd-info{display:flex;flex-direction:column;gap:2px}.dd-info strong{font-size:.9rem;font-weight:700}.dd-value{font-size:.8rem;font-weight:800;color:var(--brand-light)}.dd-bar-track{width:80px;height:8px;border-radius:var(--radius-full);background:var(--border);overflow:hidden}.dd-bar-fill{height:100%;border-radius:inherit;transition:width .6s var(--ease)}.dd-fill-water{background:linear-gradient(90deg,#06b6d4,#22d3ee)}.dd-fill-milk{background:linear-gradient(90deg,#8b5cf6,#a78bfa)}.dd-fill-flour{background:linear-gradient(90deg,#3b82f6,#60a5fa)}.dd-fill-sugar{background:linear-gradient(90deg,#f59e0b,#fbbf24)}.dd-fill-honey{background:linear-gradient(90deg,#f97316,#fb923c)}.dd-fill-butter{background:linear-gradient(90deg,#eab308,#facc15)}.dd-fill-oil{background:linear-gradient(90deg,#84cc16,#a3e635)}.use-cases-grid{margin-top:40px;padding:24px;border-radius:var(--radius-lg);background:var(--bg-surface);border:1px solid var(--border);box-shadow:var(--shadow-md)}.uc-header{text-align:center;padding-bottom:16px;margin-bottom:20px;border-bottom:1px solid var(--border)}.uc-header strong{font-size:1rem}.uc-items{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.uc-item{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;padding:16px 12px;border-radius:var(--radius-md);background:var(--bg-secondary);border:1px solid var(--border);transition:all var(--duration) var(--ease)}.uc-item:hover{transform:translateY(-3px);border-color:var(--border-brand);box-shadow:var(--shadow-md)}.uc-icon{font-size:1.8rem}.uc-item strong{font-size:.95rem;font-weight:800}.uc-item small{font-size:.78rem;color:var(--text-muted);font-weight:500;line-height:1.4}.density-vs-water{margin-top:40px;padding:28px;border-radius:var(--radius-lg);background:var(--bg-surface);border:1px solid var(--border);box-shadow:var(--shadow-md)}.dvw-header{text-align:center;padding-bottom:20px;margin-bottom:24px;border-bottom:1px solid var(--border)}.dvw-header strong{display:block;font-size:1.05rem;margin-bottom:4px}.dvw-header small{font-size:.82rem;color:var(--text-muted);font-weight:600}.dvw-items{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.dvw-item{text-align:center}.dvw-item strong{display:block;font-size:.95rem;margin-top:12px}.dvw-item small{display:block;font-size:.78rem;color:var(--text-muted);font-weight:600;margin-top:2px}.dvw-circles{display:flex;align-items:center;justify-content:center;gap:8px}.dvw-circle{width:72px;height:72px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:.82rem;border:2px solid var(--border);transition:all .4s var(--ease)}.dvw-circle:hover{transform:scale(1.05)}.dvw-volume{background:linear-gradient(135deg,#06b6d41f,#06b6d40a);border-color:#06b6d44d;color:var(--brand-light)}.dvw-light{background:linear-gradient(135deg,#3b82f61f,#3b82f60a);border-color:#3b82f64d;color:#60a5fa}.dvw-equal{background:linear-gradient(135deg,#10b9811f,#10b9810a);border-color:#10b9814d;color:var(--success)}.dvw-heavy{background:linear-gradient(135deg,#f973161f,#f973160a);border-color:#f973164d;color:#fb923c}.dvw-arrow{font-weight:900;font-size:1.2rem;color:var(--text-muted)}.dvw-baseline{position:relative}.dvw-baseline:before{content:"";position:absolute;top:-8px;left:50%;transform:translate(-50%);padding:2px 10px;border-radius:var(--radius-full);background:var(--success);color:#fff;font-size:.65rem;font-weight:800;letter-spacing:.04em}.dvw-circle span{font-weight:800}@media(max-width:1024px){.comp-items,.isc-buttons{grid-template-columns:repeat(4,1fr)}.uc-items{grid-template-columns:repeat(2,1fr)}.dvw-items{grid-template-columns:1fr;gap:24px}.dvw-circles{justify-content:center}}@media(max-width:768px){.comp-items{grid-template-columns:repeat(3,1fr)}.ifc-equation{flex-direction:column;align-items:stretch}.ifc-operator,.lw-op{text-align:center;padding-bottom:0}.lw-demo{flex-direction:column;align-items:stretch}.rc-row{grid-template-columns:1fr}.isc-buttons{grid-template-columns:repeat(3,1fr)}.on-page-nav{bottom:16px;right:16px}.fd-row{flex-direction:column}.fd-box{min-width:100%}.fd-op{transform:rotate(90deg)}.ml-reference-grid,.gram-reference-grid{grid-template-columns:repeat(2,1fr)}.uc-items{grid-template-columns:1fr 1fr}.dd-bar-track{width:60px}}@media(max-width:480px){.comp-items,.isc-buttons{grid-template-columns:repeat(2,1fr)}.ml-reference-grid,.gram-reference-grid,.uc-items{grid-template-columns:1fr}.dvw-circle{width:60px;height:60px;font-size:.72rem}}