:root{--color-bg: #000000;--color-surface: #1c1c1e;--color-surface-hover: #2c2c2e;--color-card: #2c2c2e;--key-num-bg: #333333;--key-num-active: #555555;--key-num-text: #ffffff;--key-fn-bg: #a5a5a5;--key-fn-active: #d9d9d9;--key-fn-text: #000000;--key-op-bg: #ff9f0a;--key-op-active: #f3b14e;--key-op-text: #ffffff;--key-unit-bg: #2c3e50;--key-unit-active: #34495e;--key-unit-accent: #0a84ff;--key-unit-text: #ffffff;--color-text-primary: #ffffff;--color-text-secondary: #8e8e93;--color-accent: #0a84ff;--font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--radius-full: 9999px;--radius-xl: 20px;--radius-lg: 12px;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .4);--shadow-sheet: 0 -8px 30px rgba(0, 0, 0, .8)}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}body,html{width:100%;height:100%;height:calc(var(--vh, 1vh) * 100);height:100dvh;min-height:-webkit-fill-available;background-color:var(--color-bg);color:var(--color-text-primary);font-family:var(--font-family);overflow:hidden}#app{display:flex;flex-direction:column;height:100%;height:calc(var(--vh, 1vh) * 100);height:100dvh;max-width:480px;margin:0 auto;position:relative;background-color:var(--color-bg);overflow:hidden}.app-body,.calc-pane{display:flex;flex-direction:column;flex:1;min-height:0;width:100%;overflow:hidden}.side-pane{display:none}.display-wrapper{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}.app-header{display:flex;align-items:center;justify-content:space-between;padding:max(12px,env(safe-area-inset-top,12px)) max(16px,env(safe-area-inset-right,16px)) 12px max(16px,env(safe-area-inset-left,16px));background:#1c1c1eb3;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);z-index:10;border-bottom:1px solid rgba(255,255,255,.05);flex-shrink:0}.app-title{display:flex;align-items:center;gap:8px}.app-title svg{color:var(--key-op-bg);flex-shrink:0}.title-text-group{display:flex;flex-direction:column}.app-name{font-size:1.1rem;font-weight:600;letter-spacing:-.01em;line-height:1.1}.app-subtitle{font-size:.6rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-secondary);opacity:.85;margin-top:1px}.header-actions{display:flex;gap:8px}.icon-btn{background:#ffffff1a;border:1px solid transparent;color:var(--color-text-primary);width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .15s ease;position:relative}.icon-btn.active{background:#ff9f0a40;color:var(--key-op-bg);border-color:#ff9f0a80}.icon-btn:active{transform:scale(.92);background:#ffffff40}.icon-btn-danger{color:#ff453a;background:#ff453a26}.icon-btn-danger:active{background:#ff453a4d}.badge{position:absolute;top:-2px;right:-2px;background:var(--key-op-bg);color:#000;font-size:.7rem;font-weight:700;min-width:18px;height:18px;border-radius:9px;display:flex;align-items:center;justify-content:center;padding:0 4px}.format-bar{display:flex;background:#ffffff14;border-radius:var(--radius-lg);padding:3px;margin:10px 16px 4px;gap:2px;flex-shrink:0}.format-btn{flex:1;border:none;background:transparent;color:var(--color-text-secondary);font-family:inherit;font-size:.75rem;font-weight:500;padding:6px 0;border-radius:8px;cursor:pointer;transition:all .2s cubic-bezier(.16,1,.3,1);text-align:center}.format-btn.active{background:#fff3;color:#fff;font-weight:600;box-shadow:0 1px 4px #0000004d}.display-container{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-end;padding:12px 20px 8px;overflow:hidden}.running-total-label{font-size:.85rem;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-secondary);margin-bottom:2px;font-weight:500}.running-total-val{font-size:clamp(1.3rem,3.5vh,1.8rem);font-weight:300;color:var(--key-op-bg);word-break:break-all;text-align:right;transition:color .2s ease}.active-input-container{margin-top:4px;width:100%;text-align:right}.active-input-val{font-size:clamp(2.2rem,5.5vh,3.2rem);font-weight:300;line-height:1.1;color:var(--color-text-primary);word-break:break-all;letter-spacing:-.02em;min-height:2.8rem}.keypad-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:16px;padding-left:max(16px,env(safe-area-inset-left,16px));padding-right:max(16px,env(safe-area-inset-right,16px));padding-bottom:max(16px,env(safe-area-inset-bottom,16px));margin-bottom:4px;flex-shrink:0}.key-btn{aspect-ratio:1;border-radius:50%;border:none;font-family:inherit;font-size:2rem;font-weight:500;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .08s ease,background-color .15s ease,border-color .15s ease,box-shadow .15s ease;box-shadow:var(--shadow-sm)}.key-btn:active{transform:scale(.92)}.key-btn.disabled,.key-btn:disabled,.icon-btn.disabled,.icon-btn:disabled{opacity:.35;cursor:not-allowed;pointer-events:none;box-shadow:none}.key-num{background-color:var(--key-num-bg);color:var(--key-num-text)}.key-num:active{background-color:var(--key-num-active)}.key-fn{background-color:var(--key-fn-bg);color:var(--key-fn-text);font-weight:600;font-size:1.6rem}.key-fn:active{background-color:var(--key-fn-active)}.key-op{background-color:var(--key-op-bg);color:var(--key-op-text);font-weight:600;font-size:2.2rem}.key-op:active{background-color:var(--key-op-active)}.key-mode-active{background-color:#ff453a!important;color:#fff}.key-mode-sticky{background-color:#ff453a!important;color:#fff;box-shadow:0 0 0 3px #fff,0 0 12px #ff453acc!important}.key-unit{background-color:var(--key-unit-bg);color:var(--key-unit-text);font-weight:700;font-size:1.6rem;border:none}.key-unit:active{background-color:var(--key-unit-accent)}.sheet-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;opacity:0;pointer-events:none;transition:opacity .25s ease}.sheet-overlay.active{opacity:1;pointer-events:auto}.sheet-content{position:absolute;bottom:0;left:0;width:100%;max-height:80%;background:#1c1c1e;border-top-left-radius:var(--radius-xl);border-top-right-radius:var(--radius-xl);padding:20px;display:flex;flex-direction:column;box-shadow:var(--shadow-sheet);transform:translateY(100%);transition:transform .3s cubic-bezier(.16,1,.3,1);overflow:hidden}.sheet-overlay.active .sheet-content{transform:translateY(0)}.sheet-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.1)}.sheet-title{font-size:1.2rem;font-weight:600}.close-btn{background:#ffffff1a;border:none;color:#fff;font-size:1.2rem;width:32px;height:32px;border-radius:50%;cursor:pointer}.tips-container{overflow-y:auto;flex:1;display:flex;flex-direction:column;gap:16px;padding-right:4px}.tip-section{background:#ffffff0a;border-radius:var(--radius-lg);padding:14px;border:1px solid rgba(255,255,255,.06)}.tip-section-title{font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--key-op-bg);margin-bottom:10px}.shortcut-list{display:flex;flex-direction:column;gap:8px}.shortcut-item{display:flex;align-items:center;justify-content:space-between;font-size:.9rem;padding-bottom:6px;border-bottom:1px solid rgba(255,255,255,.05)}.shortcut-item:last-child{border-bottom:none;padding-bottom:0}.shortcut-label{color:var(--color-text-primary)}kbd{background:#ffffff26;border:1px solid rgba(255,255,255,.25);border-radius:5px;padding:2px 7px;font-size:.78rem;font-family:inherit;font-weight:600;color:#fff;box-shadow:0 1px 2px #0006}.history-list{overflow-y:auto;flex:1;min-height:0;display:flex;flex-direction:column;gap:10px;padding-right:4px}.history-item{background:#ffffff0d;border-radius:var(--radius-lg);padding:12px 14px;display:flex;align-items:center;justify-content:space-between}.item-left{display:flex;align-items:center;gap:10px}.item-sign{font-size:1.2rem;font-weight:700;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center}.item-sign.add{background:#30d15833;color:#30d158}.item-sign.sub{background:#ff453a33;color:#ff453a}.item-expr{font-size:1rem;font-weight:500}.item-running{font-size:.8rem;color:var(--color-text-secondary)}.delete-item-btn{background:transparent;border:none;color:#ff453a;padding:6px;cursor:pointer;border-radius:6px}.delete-item-btn:hover{background:#ff453a26}.empty-state{text-align:center;padding:40px 0;color:var(--color-text-secondary)}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:10px;width:100%}.stat-card{background:#ffffff0d;border-radius:var(--radius-lg);padding:14px;display:flex;flex-direction:column;grid-column:span 2}.stat-card.stat-total{grid-column:span 3;background:linear-gradient(135deg,#ff9f0a26,#ff9f0a0d);border:1px solid rgba(255,159,10,.3)}.stat-card.stat-entries{grid-column:span 1}.stat-label{font-size:.8rem;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px}.stat-val{font-size:1.4rem;font-weight:600;color:#fff}.btn-danger{width:100%;margin-top:16px;background:#ff453a33;color:#ff453a;border:1px solid rgba(255,69,58,.4);padding:12px;border-radius:var(--radius-lg);font-family:inherit;font-size:1rem;font-weight:600;cursor:pointer;flex-shrink:0}.btn-danger:active{background:#ff453a66}.confirm-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#000000b3;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);z-index:200;display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;pointer-events:none;transition:opacity .2s ease}.confirm-overlay.active{opacity:1;pointer-events:auto}.confirm-dialog{background:#1c1c1e;border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-xl);padding:24px;width:100%;max-width:330px;text-align:center;box-shadow:0 20px 40px #000c;transform:scale(.9);transition:transform .2s cubic-bezier(.16,1,.3,1)}.confirm-overlay.active .confirm-dialog{transform:scale(1)}.confirm-icon{width:52px;height:52px;border-radius:50%;background:#ff453a26;color:#ff453a;display:flex;align-items:center;justify-content:center;margin:0 auto 14px}.confirm-title{font-size:1.15rem;font-weight:600;color:#fff;margin-bottom:8px}.confirm-message{font-size:.88rem;color:var(--color-text-secondary);line-height:1.4;margin-bottom:20px}.confirm-actions{display:flex;gap:10px}.confirm-btn{flex:1;padding:12px;border-radius:var(--radius-lg);border:none;font-family:inherit;font-size:.95rem;font-weight:600;cursor:pointer;transition:transform .1s ease,background .15s ease}.confirm-btn:active{transform:scale(.95)}.cancel-btn{background:#ffffff1a;color:#fff}.cancel-btn:hover{background:#ffffff2e}.ok-btn{background:#ff453a;color:#fff}.ok-btn:hover{background:#ff5b52}@media (max-height: 860px) and (orientation: portrait),(max-height: 860px) and (min-width: 500px){.keypad-grid{gap:8px;padding:12px;padding-left:max(12px,env(safe-area-inset-left,12px));padding-right:max(12px,env(safe-area-inset-right,12px));padding-bottom:max(12px,env(safe-area-inset-bottom,12px))}.key-btn{font-size:1.65rem}.key-fn{font-size:1.35rem}.key-op{font-size:1.8rem}.key-unit{font-size:1.35rem}.format-bar{margin:6px 12px 2px}.display-container{padding:8px 16px 4px}}@media (max-height: 750px) and (orientation: portrait),(max-height: 750px) and (min-width: 500px){.keypad-grid{gap:6px;padding:8px;padding-left:max(8px,env(safe-area-inset-left,8px));padding-right:max(8px,env(safe-area-inset-right,8px));padding-bottom:max(8px,env(safe-area-inset-bottom,8px))}.key-btn{font-size:1.35rem}.key-fn{font-size:1.15rem}.key-op{font-size:1.5rem}.key-unit{font-size:1.15rem}.app-header{padding-top:max(8px,env(safe-area-inset-top,8px));padding-bottom:8px}.format-bar{margin:4px 8px 2px}}@media (max-height: 700px) and (orientation: portrait),(max-height: 700px) and (min-width: 500px){.display-container{padding:4px 16px 2px;justify-content:flex-end}.running-total-label{font-size:.75rem;margin-bottom:0}.running-total-val{font-size:clamp(1.1rem,2.8vh,1.4rem)}.active-input-val{font-size:clamp(1.6rem,4vh,2.2rem);min-height:2rem}.keypad-grid{gap:4px;padding:6px 8px max(8px,env(safe-area-inset-bottom,8px)) 8px}.key-btn{font-size:1.25rem}.key-fn{font-size:1.05rem}.key-op{font-size:1.35rem}.key-unit{font-size:1.05rem}}@media (orientation: landscape){#app{max-width:100%;height:100dvh;display:flex;flex-direction:column;overflow:hidden}.app-header{width:100%;flex-shrink:0}.app-body{display:flex;flex-direction:row;flex:1;min-height:0;width:100%;overflow:hidden}.calc-pane{flex:1.3;display:flex;flex-direction:column;min-width:0;height:100%;border-right:1px solid rgba(255,255,255,.08)}.display-wrapper{flex:1;min-height:0;display:flex;flex-direction:column}.format-bar{margin:8px max(12px,env(safe-area-inset-right,12px)) 2px max(12px,env(safe-area-inset-left,12px));flex-shrink:0}.display-container{padding:8px max(16px,env(safe-area-inset-right,16px)) 8px max(16px,env(safe-area-inset-left,16px));justify-content:flex-end}.running-total-val{font-size:clamp(1.1rem,3vh,1.5rem)}.active-input-val{font-size:clamp(1.8rem,4.5vh,2.5rem);min-height:2.2rem}.keypad-grid{flex:0 0 auto;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(5,minmax(32px,calc((46vh - 20px)/5)));gap:6px;padding:6px max(12px,env(safe-area-inset-right,12px)) max(12px,env(safe-area-inset-bottom,12px)) max(12px,env(safe-area-inset-left,12px));margin-bottom:0;flex-shrink:0}.key-btn{width:100%;height:100%;aspect-ratio:auto;border-radius:var(--radius-full);font-size:clamp(.95rem,2.5vh,1.4rem);padding:4px;box-shadow:var(--shadow-sm)}.key-fn{font-size:clamp(.85rem,2.2vh,1.2rem)}.key-op{font-size:clamp(1rem,2.8vh,1.5rem)}.key-unit{font-size:clamp(.85rem,2.2vh,1.2rem)}.side-pane{display:flex;flex-direction:column;flex:.85;min-width:0;height:100%;padding:12px max(16px,env(safe-area-inset-right,16px)) max(12px,env(safe-area-inset-bottom,12px)) max(12px,env(safe-area-inset-left,12px));gap:12px;overflow-y:auto;background:#0003}.side-card{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:var(--radius-lg);padding:12px 14px;display:flex;flex-direction:column;width:100%}.side-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.side-card-title{font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--key-op-bg);display:flex;align-items:center;gap:6px;margin-bottom:10px}.side-card-header .side-card-title{margin-bottom:0}.side-pane .stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:0}.side-pane .stats-grid .stat-card{padding:10px 12px}.side-pane .stats-grid .stat-val{font-size:1.15rem}.history-side-card{flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden}.side-history-list{flex:1;overflow-y:auto;padding-right:2px}.sheet-content{max-width:500px;left:50%;transform:translate(-50%,100%);border-top-left-radius:var(--radius-xl);border-top-right-radius:var(--radius-xl)}.sheet-overlay.active .sheet-content{transform:translate(-50%)}}.item-index{font-size:.78rem;font-weight:700;color:var(--color-text-secondary);min-width:22px;opacity:.8}.running-total-label,.stat-label,.side-card-title,.tip-section-title{text-transform:uppercase;letter-spacing:.05em}@media (orientation: landscape) and (max-height: 620px){#statsBtn,#historyBtn{display:flex!important}.side-pane.show-stats .history-side-card{display:none!important}.side-pane.show-stats .stats-side-card{display:flex!important;flex:1}.side-pane.show-history .stats-side-card{display:none!important}.side-pane.show-history .history-side-card{display:flex!important;flex:1}}@media (orientation: landscape) and (min-height: 621px){#statsBtn,#historyBtn{display:none!important}.side-pane .stats-side-card,.side-pane .history-side-card{display:flex!important}}@media (orientation: landscape) and (max-height: 450px){.app-header{padding-top:max(4px,env(safe-area-inset-top,4px));padding-bottom:4px}.format-bar{margin:4px 10px 1px;padding:2px}.format-btn{padding:4px 0;font-size:.7rem}.display-container{padding:2px 12px;justify-content:flex-end}.running-total-label{font-size:.72rem;margin-bottom:0}.running-total-val{font-size:clamp(1rem,2.5vh,1.25rem)}.active-input-val{font-size:clamp(1.4rem,3.5vh,1.8rem);min-height:1.6rem}.keypad-grid{gap:4px;padding:4px 10px max(6px,env(safe-area-inset-bottom,6px)) 10px;grid-template-rows:repeat(5,minmax(24px,calc((44vh - 16px)/5)))}.side-pane{padding:8px 12px max(8px,env(safe-area-inset-bottom,8px)) 12px;gap:8px}.side-card{padding:8px 12px}.side-card-title{margin-bottom:6px}.side-pane .stats-grid{gap:6px}.side-pane .stats-grid .stat-card{padding:6px 10px}.side-pane .stats-grid .stat-label{font-size:.72rem;margin-bottom:2px}.side-pane .stats-grid .stat-val{font-size:1.05rem}}