:root{--dairy-primary:#0f172a;--dairy-primary-hover:#1e293b;--dairy-accent:#2563eb;--dairy-accent-hover:#1d4ed8;--dairy-secondary-info:#0284c7;--dairy-bg:#f8fafc;--dairy-surface:#fff;--dairy-surface-subtle:#f1f5f9;--dairy-border:#e2e8f0;--dairy-border-strong:#cbd5e1;--dairy-input-border:#cbd5e1;--dairy-text-primary:#0f172a;--dairy-text-secondary:#64748b;--dairy-text-muted:#94a3b8;--dairy-success:#15803d;--dairy-success-bg:#dcfce7;--dairy-warning:#b45309;--dairy-warning-bg:#fef3c7;--dairy-danger:#dc2626;--dairy-danger-bg:#fee2e2;--dairy-info:#0284c7;--dairy-info-bg:#e0f2fe;--dairy-font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--dairy-font-heading:"Outfit", "Inter", -apple-system, sans-serif;--dairy-font-mono:"JetBrains Mono", monospace;--dairy-sidebar-width:240px;--dairy-header-height:52px;--dairy-mobile-header-height:48px;--dairy-mobile-bottom-nav-height:54px;--dairy-radius-xs:4px;--dairy-radius-sm:6px;--dairy-radius-md:8px;--dairy-radius-lg:12px;--dairy-radius-xl:16px;--dairy-radius-full:9999px;--dairy-shadow-subtle:0 1px 2px #0f172a0a;--dairy-shadow-sm:0 1px 3px #0f172a0f;--dairy-shadow-md:0 4px 6px -1px #0f172a14, 0 2px 4px -2px #0f172a0f;--dairy-shadow-lg:0 10px 15px -3px #0f172a14, 0 4px 6px -4px #0f172a0a;--dairy-shadow-drawer:-4px 0 24px #0f172a1f;--dairy-shadow-modal:0 20px 25px -5px #0f172a26, 0 8px 10px -6px #0f172a1a}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}html,body{background-color:var(--dairy-bg);color:var(--dairy-text-primary);font-family:var(--dairy-font-sans);-webkit-font-smoothing:antialiased;width:100%;height:100%;font-size:13px;line-height:1.5;overflow:hidden}#root{width:100%;height:100%;display:flex;overflow:hidden}input,textarea,select,button{font-family:inherit}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:9999px}::-webkit-scrollbar-thumb:hover{background:#94a3b8}.desktop-viewport-container{background-color:var(--dairy-bg);width:100vw;height:100vh;display:flex;overflow:hidden}.mobile-viewport-container{background-color:var(--dairy-bg);flex-direction:column;width:100vw;height:100dvh;max-height:100dvh;display:flex;position:relative;overflow:hidden}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes popIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.desktop-card{border:1px solid var(--dairy-border);border-radius:var(--dairy-radius-lg);box-shadow:var(--dairy-shadow-subtle);background:#fff;transition:border-color .15s,box-shadow .15s}.desktop-card:hover{border-color:#cbd5e1}.desktop-btn-primary{background:var(--dairy-accent);color:#fff;border-radius:var(--dairy-radius-md);cursor:pointer;border:none;justify-content:center;align-items:center;gap:6px;padding:8px 16px;font-size:13px;font-weight:600;transition:all .15s;display:inline-flex;box-shadow:0 1px 2px #2563eb33}.desktop-btn-primary:hover{background:var(--dairy-accent-hover);box-shadow:0 2px 4px #2563eb40}.desktop-btn-secondary{color:var(--dairy-text-primary);border:1px solid var(--dairy-border);border-radius:var(--dairy-radius-md);cursor:pointer;background:#fff;justify-content:center;align-items:center;gap:6px;padding:7px 14px;font-size:13px;font-weight:600;transition:all .15s;display:inline-flex}.desktop-btn-secondary:hover{background:#f8fafc;border-color:#cbd5e1}.mobile-viewport{background-color:var(--dairy-bg);flex-direction:column;width:100%;height:100%;display:flex;position:relative;overflow:hidden}.touch-input{border:1.5px solid var(--dairy-input-border);border-radius:var(--dairy-radius-md);width:100%;height:44px;color:var(--dairy-text-primary);background:#fff;outline:none;padding:0 12px;font-size:14px;font-weight:600;transition:border-color .15s}.touch-input:focus{border-color:var(--dairy-accent);box-shadow:0 0 0 3px #2563eb26}.touch-label{color:var(--dairy-text-secondary);text-transform:uppercase;letter-spacing:.3px;margin-bottom:4px;font-size:11px;font-weight:700;display:block}.cta-button{background:var(--dairy-accent);color:#fff;border-radius:var(--dairy-radius-md);cursor:pointer;border:none;justify-content:center;align-items:center;gap:8px;width:100%;height:44px;font-size:14px;font-weight:700;transition:all .15s;display:flex}.cta-button:active{transform:scale(.98)}.cta-button.secondary{color:var(--dairy-text-primary);border:1px solid var(--dairy-border);background:#fff}.keypad-grid{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.keypad-key{color:#0f172a;cursor:pointer;background:#f8fafc;border:1.5px solid #cbd5e1;border-radius:10px;justify-content:center;align-items:center;height:48px;font-size:18px;font-weight:700;transition:all .1s;display:flex}.keypad-key:active{background:#e2e8f0;transform:scale(.96)}.giant-number-card{text-align:center;background:#fff;border:1.5px solid #cbd5e1;border-radius:12px;padding:12px}.giant-number{color:var(--dairy-accent);font-size:34px;font-weight:800;line-height:1.1;font-family:var(--dairy-font-mono)}.giant-unit{color:var(--dairy-text-secondary);margin-top:3px;font-size:12px;font-weight:600}