:root{--primary: #135bec;--primary-light: #3b7bff;--primary-dark: #0d47c4;--bg-light: #f6f6f8;--bg-dark: #101622;--surface-light: #ffffff;--surface-dark: #1e2430;--keypad-dark: #151a23;--number-btn-dark: #1a202c;--text-primary-light: #0f172a;--text-primary-dark: #ffffff;--text-secondary-light: #64748b;--text-secondary-dark: #94a3b8;--error: #ef4444;--success: #10b981;--warning: #f59e0b;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: .75rem;--spacing-lg: 1rem;--spacing-xl: 1.5rem;--spacing-2xl: 2rem;--radius-sm: .25rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--radius-2xl: 1.5rem;--radius-full: 9999px;--font-display: "Space Grotesk", sans-serif;--font-body: "Noto Sans", sans-serif;--transition-fast: .15s ease;--transition-base: .2s ease;--transition-slow: .3s ease;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .1);--shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / .25)}*{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-body);line-height:1.5;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--spacing-lg);transition:background-color var(--transition-base)}body.light{background-color:var(--bg-light);color:var(--text-primary-light)}body.dark{background-color:var(--bg-dark);color:var(--text-primary-dark)}button{font-family:inherit;cursor:pointer;border:none;outline:none;background:none;-webkit-tap-highlight-color:transparent}#app{width:100%;max-width:28rem;margin:0 auto}.calculator-container{border-radius:var(--radius-2xl);overflow:hidden;box-shadow:var(--shadow-2xl);transition:all var(--transition-base)}.light .calculator-container{background-color:var(--surface-light)}.dark .calculator-container{background-color:var(--surface-dark)}.header{display:flex;align-items:center;justify-content:space-between;padding:.75rem var(--spacing-lg);height:3rem}.header-menu-btn,.header-settings-btn{width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-md);transition:all var(--transition-fast)}.header-menu-btn:hover,.header-settings-btn:hover{background-color:#64748b1a}.header-menu-btn:active,.header-settings-btn:active{transform:scale(.95)}.header-title{font-family:var(--font-display);font-size:.875rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase}.angle-mode-toggle{display:flex;gap:var(--spacing-xs);background-color:#64748b1a;padding:var(--spacing-xs);border-radius:var(--radius-md)}.angle-mode-btn{padding:.25rem .75rem;font-size:.75rem;font-weight:600;border-radius:var(--spacing-xs);transition:all var(--transition-fast)}.angle-mode-btn.active{background-color:var(--primary);color:#fff}.light .angle-mode-btn:not(.active){color:var(--text-secondary-light)}.dark .angle-mode-btn:not(.active){color:var(--text-secondary-dark)}.mode-switch{display:flex;gap:var(--spacing-xs);padding:var(--spacing-xs);margin:var(--spacing-lg);border-radius:var(--radius-lg);transition:background-color var(--transition-base)}.light .mode-switch{background-color:#e2e8f0}.dark .mode-switch{background-color:var(--surface-dark)}.mode-switch-btn{flex:1;padding:.75rem;font-family:var(--font-display);font-size:.875rem;font-weight:500;border-radius:var(--radius-md);transition:all var(--transition-base)}.mode-switch-btn.active{color:var(--primary)}.light .mode-switch-btn.active{background-color:#fff;box-shadow:var(--shadow-sm)}.dark .mode-switch-btn.active{background-color:var(--keypad-dark)}.light .mode-switch-btn:not(.active){color:var(--text-secondary-light)}.dark .mode-switch-btn:not(.active){color:var(--text-secondary-dark)}.display{padding:var(--spacing-xl);min-height:10rem;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-end;text-align:right;gap:var(--spacing-sm)}.display-history{font-size:1.125rem;font-weight:500;opacity:.6;word-break:break-all;transition:all var(--transition-base)}.light .display-history{color:var(--text-secondary-light)}.dark .display-history{color:var(--text-secondary-dark)}.display-result{font-family:var(--font-display);font-size:3.75rem;font-weight:700;line-height:1;letter-spacing:-.025em;word-break:break-all;display:flex;align-items:center;gap:.25rem}.light .display-result{color:var(--text-primary-light)}.dark .display-result{color:var(--text-primary-dark)}.display-result.error{color:var(--error)}.display-cursor{display:inline-block;width:.125rem;height:3rem;background-color:var(--primary);animation:blink 1.06s infinite;margin-left:.25rem}@keyframes blink{0%,49%{opacity:1}50%,to{opacity:0}}.function-chips{display:flex;gap:var(--spacing-sm);padding:0 var(--spacing-lg) var(--spacing-lg);overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.function-chips::-webkit-scrollbar{display:none}.function-chip{flex-shrink:0;padding:.5rem var(--spacing-lg);font-family:var(--font-display);font-size:.875rem;font-weight:500;border-radius:var(--radius-md);transition:all var(--transition-fast);white-space:nowrap}.light .function-chip{background-color:#e2e8f0;color:var(--text-primary-light)}.dark .function-chip{background-color:var(--surface-dark);color:var(--text-primary-dark)}.function-chip:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.function-chip:active{transform:scale(.95)}.keypad{padding:var(--spacing-lg);padding-bottom:var(--spacing-2xl);border-radius:var(--radius-2xl) var(--radius-2xl) 0 0;transition:background-color var(--transition-base)}.light .keypad{background-color:#fff;box-shadow:0 -4px 20px #0000000d}.dark .keypad{background-color:var(--keypad-dark);box-shadow:0 -4px 20px #0003}.keypad-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--spacing-md)}.keypad-btn{height:4rem;border-radius:var(--radius-xl);font-family:var(--font-display);font-weight:500;transition:all var(--transition-fast);display:flex;align-items:center;justify-content:center}.keypad-btn:hover{filter:brightness(.95)}.keypad-btn:active{transform:scale(.95)}.keypad-btn.number{font-size:1.5rem}.light .keypad-btn.number{background-color:#f1f5f9;color:var(--text-primary-light)}.dark .keypad-btn.number{background-color:var(--number-btn-dark);color:var(--text-primary-dark)}.keypad-btn.control{font-size:1.125rem}.light .keypad-btn.control{background-color:#e2e8f0;color:var(--text-primary-light)}.dark .keypad-btn.control{background-color:var(--surface-dark);color:var(--text-primary-dark)}.keypad-btn.operator{font-size:1.5rem;font-weight:700;color:var(--primary)}.light .keypad-btn.operator{background-color:#135bec1a}.dark .keypad-btn.operator{background-color:#135bec33}.keypad-btn.equals{grid-column:span 2;background-color:var(--primary);color:#fff;font-size:1.875rem;font-weight:700;box-shadow:0 10px 15px -3px #135bec4d}.keypad-btn.equals:hover{background-color:var(--primary-light);box-shadow:0 15px 20px -3px #135bec66}.material-symbols-outlined{font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 24;-webkit-user-select:none;user-select:none}.hidden{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}@media (max-width: 640px){body{padding:0}.calculator-container{border-radius:0;min-height:100vh;display:flex;flex-direction:column}.display{flex:1}}@media (min-width: 641px){.display-result{font-size:4rem}}