:root{--bg: #f6f7f9;--surface: #ffffff;--text: #0b1220;--muted: #6b7280;--hairline: rgba(12, 18, 32, .08);--primary: #0a84ff;--success: #1db954;--danger: #ff453a;--warning: #ff9f0a;--glass: rgba(255, 255, 255, .55);--glass-blur: 12px;--radius: 16px;--radius-lg: 20px;--shadow-1: 0 1px 2px rgba(12, 18, 32, .06);--shadow-2: 0 10px 30px rgba(12, 18, 32, .06);--card-padding-v: clamp(4px, 1vh, 12px);--card-padding-h: 16px;--cards-gap: clamp(4px, .6vh, 8px);--cards-margin: 4px 0;--flag-w: clamp(42px, 2vh + 24px, 50px);--flag-h: calc(var(--flag-w) * .7);--flag-radius: 4px;--font-code: clamp(1.1rem, 1.05rem + .4vh, 1.3rem);--font-val: clamp(2rem, 1.8rem + 1vh, 2.6rem);--font-sym: calc(var(--font-val) * .6);--handle-size: clamp(1.4rem, 2vh + .5rem, 1.6rem);--handle-color: #8e8e93;--keypad-pad: clamp(8px, 1.5vh, 14px);--keypad-font: clamp(1.25rem, 2.5vh + .4rem, 1.6rem);--display-font: clamp(1.4rem, 3vh + .2rem, 1.8rem)}[data-theme=dark]{--bg: #0b0f14;--surface: #0f141a;--text: #e7ebf0;--muted: #9aa4b2;--hairline: rgba(231, 235, 240, .12);--glass: rgba(20, 24, 30, .5);--shadow-1: 0 1px 2px rgba(0, 0, 0, .35);--shadow-2: 0 20px 40px rgba(0, 0, 0, .35)}*{box-sizing:border-box}body{margin:0;height:100vh;height:100dvh;width:100vw;overflow:hidden;font-family:ui-sans-serif,-apple-system,SF Pro Text,Segoe UI,Noto Sans TC,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}.container{max-width:920px;height:100dvh;margin:0 auto;padding:6px 16px;padding-bottom:env(safe-area-inset-bottom,16px);display:flex;flex-direction:column;overflow:hidden}.topbar{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:48px;padding:4px 8px;margin-bottom:6px;border:1px solid var(--hairline);border-radius:12px;background:var(--glass);-webkit-backdrop-filter:saturate(150%) blur(var(--glass-blur));backdrop-filter:saturate(150%) blur(var(--glass-blur));box-shadow:var(--shadow-1)}.icon-btn{background:transparent;border:none;font-size:1.4rem;padding:8px;cursor:pointer;color:var(--primary);border-radius:8px;display:flex;align-items:center;justify-content:center;transition:background .2s}.icon-btn:active{background:var(--hairline);opacity:.7}.status-container{flex:1;display:flex;align-items:center;justify-content:center;min-width:0;margin:0 2px}.status{font-size:.85rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;padding:4px 8px;border-radius:12px;background:transparent;max-width:100%}.status:before{content:"";width:6px;height:6px;border-radius:50%;display:inline-block}.status.ok:before{background:var(--success)}.status.err:before{background:var(--danger)}.status.load:before{background:var(--warning)}.meta{opacity:.9;font-size:.8rem;color:var(--muted)}.dropdown-menu{position:absolute;top:60px;right:12px;width:200px;background:var(--surface);border:1px solid var(--hairline);border-radius:12px;box-shadow:var(--shadow-2);display:none;flex-direction:column;z-index:100;padding:6px;transform-origin:top right;animation:scaleIn .2s ease-out}.dropdown-menu.show{display:flex}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.dropdown-item{background:transparent;border:none;color:var(--text);padding:12px 16px;text-align:left;font-size:1rem;border-radius:8px;cursor:pointer;display:flex;align-items:center;gap:8px}.dropdown-item:active{background:var(--bg)}.divider{height:1px;background:var(--hairline);margin:4px 8px}.cards{flex:1 1 auto;display:flex;flex-direction:column;overflow-y:hidden;min-height:0;gap:var(--cards-gap);margin:var(--cards-margin)}.card{flex:1;min-height:0;height:auto;display:flex;align-items:center;justify-content:space-between;background:var(--surface);border:1px solid var(--hairline);border-radius:14px;padding:var(--card-padding-v) var(--card-padding-h);position:relative;box-shadow:var(--shadow-1)}.card.skeleton{min-height:44px}.card.base{outline:2px solid var(--primary);outline-offset:-2px;background:#0a84ff0f}.card .left{display:flex;align-items:center;gap:8px}.handle{cursor:grab;color:var(--handle-color);margin-right:2px;font-size:var(--handle-size);line-height:1}.flag{width:var(--flag-w);height:var(--flag-h);border-radius:var(--flag-radius);object-fit:cover;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;display:block}.lock-icon{position:absolute;bottom:-4px;right:-6px;font-size:1rem;filter:drop-shadow(0 1px 2px rgba(0,0,0,.5));z-index:2}.flag-sm{width:20px;height:14px;border-radius:3px;border:1px solid var(--hairline)}.cname{opacity:.85;font-size:var(--font-code);font-weight:500}.value{font-weight:700;font-size:var(--font-val);line-height:1.1;font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right}.amt-text{transition:color .2s}.reference-mode{opacity:.6!important;font-weight:400!important;color:var(--muted)!important}.keypad{flex:0 0 auto;position:relative;z-index:5;background:var(--surface);border-top:1px solid var(--hairline);border-radius:12px 12px 0 0;margin-top:clamp(4px,1vh,18px);box-shadow:var(--shadow-1);touch-action:none}.display{padding:clamp(2px,1.5vh,6px) 14px;font-size:var(--display-font);font-weight:700;border-bottom:1px solid var(--hairline);text-align:right;transition:color .2s}.display.tax-plus{color:var(--danger)}.display.tax-minus{color:var(--primary)}.display.discounted{color:var(--success)}#btnTax{position:relative}#btnTax:after{content:"+";position:absolute;bottom:4px;right:6px;font-size:.7em;opacity:.6}.discount-panel{position:absolute;inset:50px 0 0;background:var(--surface);display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(3,1fr);gap:clamp(4px,.8vh,8px);padding:clamp(6px,1vh,10px);z-index:10;display:none}.discount-panel.show{display:grid}.discount-panel button{padding:var(--keypad-pad) 0;border-radius:12px;border:1px solid var(--hairline);background:var(--surface);color:var(--text);font-size:var(--keypad-font);font-weight:700;box-shadow:var(--shadow-1);cursor:pointer;display:flex;align-items:center;justify-content:center}.discount-panel button:active{background:var(--hairline)}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(4px,.8vh,8px);padding:clamp(6px,1vh,10px)}.grid button{padding:var(--keypad-pad) 0;border-radius:12px;border:1px solid var(--hairline);background:var(--surface);color:var(--text);font-size:var(--keypad-font);font-weight:700;box-shadow:var(--shadow-1);line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.grid button.op{background:transparent}.grid button.primary{background:var(--primary);border-color:var(--primary);color:#fff}.grid button.muted{opacity:.8}.grid button.zero{grid-column:span 2}.grid button.active{transform:translateY(1px);box-shadow:none;background:var(--hairline);transition:all .05s}.disclaimer{flex:0 0 auto;font-size:.8rem;color:#868585;text-align:center;margin-top:6px;padding:4px 0;border-top:1px solid #eee}.modal{position:fixed;inset:0;background:#00000073;display:none;align-items:flex-end;z-index:1000}.modal.show{display:flex}.modal-content{background:var(--surface);border-top-left-radius:16px;border-top-right-radius:16px;width:100%;max-width:720px;margin:0 auto;max-height:85vh;display:flex;flex-direction:column;box-shadow:var(--shadow-2)}.modal-header{display:flex;justify-content:space-between;padding:12px 14px;border-bottom:1px solid var(--hairline)}.modal-close{background:transparent;border:0;color:var(--text);font-size:20px;cursor:pointer}.tabs{display:flex;gap:8px;padding:8px 10px;border-bottom:1px solid var(--hairline);overflow:auto}.tab-btn{background:var(--surface);border:1px solid var(--hairline);color:var(--text);border-radius:10px;padding:8px 10px;white-space:nowrap}.tab-btn.active{background:var(--primary);border-color:var(--primary);color:#fff}.tab-panels{padding:12px 14px;overflow:auto}.tab-panel{display:none}.tab-panel.active{display:block}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}.field label{font-weight:700;color:var(--text)}.field .hint,.field small{opacity:.8;font-size:.9rem;color:var(--muted);line-height:1.5}.actions{display:flex;gap:8px;flex-wrap:wrap}.danger{background:var(--danger);color:#fff;border:0;border-radius:10px;padding:8px 12px}.modal-footer{display:flex;justify-content:flex-end;padding:10px;border-top:1px solid var(--hairline)}.modal-footer .primary{background:var(--primary);color:#fff;border:0;border-radius:10px;padding:8px 12px}.modal-footer .secondary{background:transparent;color:var(--text);border:1px solid var(--hairline);border-radius:10px;padding:8px 12px;margin-right:8px}.skeleton{position:relative;overflow:hidden}.skeleton:before{content:"";position:absolute;inset:0;transform:translate(-100%);background:linear-gradient(90deg,transparent,rgba(0,0,0,.06),transparent);animation:sk 1.1s linear infinite}@keyframes sk{to{transform:translate(100%)}}.error-dialog-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:10000;padding:20px}.error-dialog{background:var(--surface);border-radius:16px;max-width:500px;width:100%;max-height:80vh;overflow:hidden;box-shadow:var(--shadow-2)}.error-header{display:flex;justify-content:space-between;padding:16px 20px;background:var(--bg);border-bottom:1px solid var(--hairline)}.error-content{padding:20px;overflow-y:auto;max-height:50vh}.error-actions{display:flex;gap:8px;padding:16px 20px;border-top:1px solid var(--hairline);background:var(--bg)}.error-actions button{flex:1;padding:10px 12px;border-radius:8px;border:1px solid var(--hairline);cursor:pointer}.btn-copy{background:var(--primary)!important;color:#fff!important;border:none}.btn-share{background:var(--success)!important;color:#fff!important;border:none}.btn-retry{background:var(--warning)!important;color:#fff!important;border:none}.version-history-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:10001;padding:20px}.version-history-modal{background:var(--surface);border-radius:16px;width:100%;max-width:800px;max-height:90vh;overflow:hidden;box-shadow:var(--shadow-2)}.version-history-header{display:flex;justify-content:space-between;padding:16px 20px;background:var(--bg);border-bottom:1px solid var(--hairline)}.version-history-content iframe{width:100%;height:80vh;border:none;background:var(--bg)}.update-toast{position:fixed;bottom:24px;right:24px;background:var(--surface);border:1px solid var(--hairline);box-shadow:var(--shadow-2);border-radius:16px;padding:16px;width:320px;z-index:10000;display:flex;flex-direction:column;gap:12px;transform:translateY(20px) scale(.95);opacity:0;pointer-events:none;transition:all .4s cubic-bezier(.16,1,.3,1)}.update-toast.show{transform:translateY(0) scale(1);opacity:1;pointer-events:auto}.toast-content{display:flex;gap:12px}.toast-btn-update{flex:1;background:var(--primary);color:#fff;border:none;padding:10px;border-radius:10px;cursor:pointer}.toast-btn-close{width:44px;background:transparent;border:1px solid var(--hairline);color:var(--text);border-radius:10px;cursor:pointer;display:flex;align-items:center;justify-content:center}@media(min-width:800px){.display{font-size:2rem;padding:12px 20px}.grid{gap:12px;padding:16px}.grid button{padding:16px 0;font-size:2.2rem}.card{padding:20px}.flag{width:60px;height:42px}.value{font-size:3rem}}@media(max-width:640px){.container{padding:0 12px}.topbar{margin-bottom:4px;padding:4px 8px;gap:6px}.error-dialog{margin:10px;max-width:none}.error-actions{flex-direction:column}.update-toast{left:16px;right:16px;width:auto;bottom:20px}.version-history-modal{margin:10px;max-height:90vh}.version-history-content iframe{height:70vh}}@media(max-height:700px){.container{padding-top:4px;padding-bottom:4px}.topbar{margin-bottom:2px;padding:2px 8px}.card{min-height:40px}.disclaimer{display:none}}@media(max-height:600px){.grid button{padding:8px 0}.disclaimer{display:none}}#rotateOverlay{position:fixed;inset:0;background:#000000e6;display:none;align-items:center;justify-content:center;z-index:10000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.rotate-content{text-align:center;color:#fff;padding:20px}.rotate-icon{font-size:6rem;margin-bottom:24px;animation:rotateAnimation 2s infinite}.rotate-text{font-size:2rem;font-weight:600}@keyframes rotateAnimation{0%,to{transform:rotate(0)}25%{transform:rotate(-15deg)}75%{transform:rotate(15deg)}}
