:root{--color-primary: #007AFF;--color-background: #F2F2F7;--color-surface: rgba(255, 255, 255, .65);--color-surface-brighter: rgba(255, 255, 255, .85);--color-text: #1C1C1E;--color-text-secondary: #8E8E93;--color-border: rgba(255, 255, 255, .4);--shadow-soft: 0 8px 32px rgba(0, 0, 0, .08);--color-dark-primary: #0A84FF;--color-dark-background: #000000;--color-dark-surface: rgba(28, 28, 30, .65);--color-dark-surface-brighter: rgba(44, 44, 46, .85);--color-dark-text: #FFFFFF;--color-dark-text-secondary: #98989D;--color-dark-border: rgba(255, 255, 255, .1);--shadow-dark: 0 8px 32px rgba(0, 0, 0, .4)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background-color:var(--color-background);color:var(--color-text);height:100vh;overflow:hidden;transition:background-color .3s ease}.dark body{background-color:var(--color-dark-background);color:var(--color-dark-text)}#app{height:100vh;display:flex;flex-direction:row;position:relative;max-width:480px;margin:0 auto;background:transparent;transition:max-width .4s cubic-bezier(.2,.8,.2,1);align-items:stretch;justify-content:center}.scientific-mode-active #app{max-width:740px}.history-mode-active #app{max-width:780px}.scientific-mode-active.history-mode-active #app{max-width:1040px}.calc-scientific-section{width:0;opacity:0;overflow:hidden;transition:all .4s cubic-bezier(.2,.8,.2,1);background:var(--color-surface);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-right:1px solid var(--color-border);display:flex;flex-direction:column;padding:0;align-self:flex-end;height:auto;border-radius:24px}.dark .calc-scientific-section{background:var(--color-dark-surface);border-color:var(--color-dark-border)}.scientific-mode-active .calc-scientific-section{width:240px;opacity:1;margin-right:16px;padding:20px;margin-top:0;margin-bottom:0}.scientific-panel{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(5,1fr);gap:12px;width:100%;height:100%}.scientific-panel .calc-button{font-size:20px;font-weight:500;height:auto}html.dark .history-panel-item .history-item-result,html.dark .history-item-result,html.dark .calc-history-section .history-item-result{color:#fff!important;opacity:1!important;text-shadow:0 1px 2px rgba(0,0,0,.5)}html.dark .history-panel-item .history-item-expression,html.dark .history-item-expression{color:#fffc!important}.calc-main-content{flex:0 0 480px;display:flex;flex-direction:column;z-index:10;transition:all .4s ease;background:transparent}.calc-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px 8px;z-index:50;width:100%}.calc-header button{background:var(--color-surface);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--color-border);border-radius:20px;height:40px;min-width:40px;display:flex;align-items:center;justify-content:center;color:var(--color-text);font-weight:500;cursor:pointer;box-shadow:0 2px 10px #0000000d;transition:all .2s cubic-bezier(.34,1.56,.64,1)}.calc-header button:hover{background:var(--color-surface-brighter);transform:scale(1.05)}.calc-header button:active{transform:scale(.95);transition:all .1s ease}.dark .calc-header button:hover{background:var(--color-dark-surface-brighter)}.calc-display-section{margin-bottom:80px;padding-bottom:0}.history-clear-btn{width:auto;margin:0 20px 20px;background-color:#ff3b30;color:#fff;font-weight:700;font-size:16px;border:none;border-radius:12px;padding:14px;cursor:pointer;box-shadow:0 4px 10px #ff3b304d;transition:all .2s cubic-bezier(.34,1.56,.64,1);display:block}.history-clear-btn:hover{background-color:#ff453a;transform:translateY(-2px);box-shadow:0 8px 16px #ff3b3066}.history-clear-btn:active{transform:scale(.96) translateY(0);background-color:#d73328}html.dark .history-panel-item *{color:#fff!important}html.dark .history-item-expression{color:#ffffffb3!important}.calc-display{background:var(--color-surface);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-radius:24px;padding:30px;box-shadow:var(--shadow-soft);border:1px solid var(--color-border);display:flex;flex-direction:column;justify-content:flex-end;min-height:160px;width:100%;box-sizing:border-box}.dark .calc-display{background:var(--color-dark-surface);box-shadow:var(--shadow-dark);border-color:var(--color-dark-border)}.display-expression{font-size:18px;color:var(--color-text-secondary);margin-bottom:8px;height:24px}.dark .display-expression{color:var(--color-dark-text-secondary)}.display-number{font-size:56px;font-weight:300;color:var(--color-text);line-height:1.1;word-break:break-all}.dark .display-number{color:var(--color-dark-text)}.calc-keypad-section{flex:1;display:flex;padding:0 20px 20px;gap:16px;overflow:visible;box-sizing:border-box;width:100%}.calc-keypad-grid{flex:1;display:grid;grid-template-columns:repeat(4,1fr);gap:12px;min-width:0}.calc-button{background:var(--color-surface);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--color-border);border-radius:16px;font-size:22px;color:var(--color-text);cursor:pointer;box-shadow:0 2px 5px #00000008;-webkit-user-select:none;user-select:none;display:flex;align-items:center;justify-content:center;transition:all .15s cubic-bezier(.4,0,.2,1)}.calc-button:hover{background:#fff!important;transform:translateY(-2px);box-shadow:0 6px 16px #0000001f}.calc-button:active{transform:scale(.96) translateY(0);background:#e5e5ea!important;box-shadow:0 1px 2px #0000000d}.dark .calc-button:hover{background:#3a3a3c!important;transform:translateY(-2px);box-shadow:0 6px 16px #0006}.dark .calc-button:active{background:#2c2c2e!important;transform:scale(.96) translateY(0)}.dark .calc-button{background:var(--color-dark-surface);border-color:var(--color-dark-border);color:var(--color-dark-text)}.calc-button-operator{background-color:#ff95001a;color:#ff9500;font-weight:600}.dark .calc-button-operator{background-color:#ff9f0a26;color:#ff9f0a}.calc-button-equals{background-color:var(--color-primary)!important;color:#fff!important;font-weight:600;box-shadow:0 4px 12px #007aff4d}.dark .calc-button-equals{background-color:var(--color-dark-primary)!important}.calc-history-section{width:0;opacity:0;overflow:hidden;transition:all .4s cubic-bezier(.2,.8,.2,1);background:var(--color-surface);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-left:1px solid var(--color-border);display:flex;flex-direction:column}.dark .calc-history-section{background:var(--color-dark-surface);border-color:var(--color-dark-border)}.history-mode-active .calc-history-section{width:300px;opacity:1;margin-left:16px;border-radius:24px;margin-top:20px;margin-bottom:20px}.history-panel-side{display:flex;flex-direction:column;height:100%}.history-header{padding:20px;display:flex;justify-content:center;align-items:center;border-bottom:none}.history-title{font-size:24px;font-weight:700;color:var(--color-text)}.dark .history-title{color:var(--color-dark-text)}.history-list-container{flex:1;overflow-y:auto;padding:0 20px 20px}.history-panel-item{background:var(--color-surface);border:1px solid var(--color-border);border-radius:16px;padding:16px 48px 16px 16px;margin-bottom:12px;position:relative;display:flex;flex-direction:column;justify-content:center}.dark .history-panel-item{background:#28282899;border-color:#ffffff1a}.history-item-result{font-size:22px;font-weight:600;color:var(--color-text);text-align:right;margin-top:4px}.dark .history-item-result{color:#fff!important}.history-item-expression{font-size:14px;color:var(--color-text-secondary)}.dark .history-item-expression{color:#ffffffb3!important}.history-delete-btn{position:absolute;top:50%;right:12px;transform:translateY(-50%);background:#0000000d;border:none;border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;color:#ff3b30;cursor:pointer;padding:0;font-size:16px;transition:all .2s ease}.history-delete-btn:hover{background:#0000001a;transform:translateY(-50%) scale(1.1)}.history-delete-btn:active{transform:translateY(-50%) scale(.95);background:#00000026}.dark .history-delete-btn{background:#ffffff1a}.history-overlay,.calc-history{display:none}.dark #angle-unit-btn:hover,.dark #angle-unit-btn:active{background:var(--color-dark-surface)!important;transform:scale(.96)}
