.calculator-wrapper{position:relative;background:var(--card);border-radius:24px;overflow:hidden;--calculator-secondary-foreground: var(--text-secondary, var(--muted-foreground));--calculator-success-background: var(--bg-success);--calculator-success-border: rgba(21, 128, 61, .18);--calculator-success-foreground: #166534;box-shadow:0 0 0 .5px #0000000d,0 2px 4px #0000000a,0 8px 16px #0000000f,0 24px 48px #00000014}:root.dark .calculator-wrapper,.dark .calculator-wrapper{--calculator-success-border: rgba(134, 239, 172, .24);--calculator-success-foreground: #86efac;box-shadow:0 0 0 .5px #ffffff0f,0 2px 4px #0003,0 8px 16px #0000004d,0 24px 48px #0006}.calculator-card{background:#fff;border:1px solid rgba(0,0,0,.08);box-shadow:0 4px 24px #0000000f;transition:all .2s ease}:root.dark .calculator-card,.dark .calculator-card{background:#1c1c1e;border:1px solid rgba(255,255,255,.1);box-shadow:0 4px 24px #0000004d}.glass-card{position:relative;background:#00000005;border:none;border-radius:16px;transition:background-color .2s ease}:root.dark .glass-card,.dark .glass-card{background:#ffffff0a}.glass-card:hover{background:#0000000a}:root.dark .glass-card:hover,.dark .glass-card:hover{background:#ffffff0f}.counter-button{position:relative;background:#0000000a;border:none;border-radius:50%;color:var(--foreground);transition:all .15s ease}:root.dark .counter-button,.dark .counter-button{background:#ffffff14}.counter-button:hover:not(:disabled){background:#00000014;transform:scale(1.05)}:root.dark .counter-button:hover:not(:disabled),.dark .counter-button:hover:not(:disabled){background:#ffffff1f}.counter-button:active:not(:disabled){transform:scale(.95);background:#0000001f}:root.dark .counter-button:active:not(:disabled),.dark .counter-button:active:not(:disabled){background:#ffffff29}.counter-button:disabled{opacity:.3;cursor:not-allowed}.modern-input{background:#00000008;border:1px solid rgba(0,0,0,.06);border-radius:12px;color:var(--foreground);font-size:14px;transition:all .2s ease}:root.dark .modern-input,.dark .modern-input{background:#ffffff0d;border:1px solid rgba(255,255,255,.08)}.modern-input::placeholder{color:var(--muted-foreground);opacity:.6}.modern-input:focus{background:#00000005;border-color:#00000026;box-shadow:0 0 0 3px #0000000a;outline:none}:root.dark .modern-input:focus,.dark .modern-input:focus{background:#ffffff14;border-color:#fff3;box-shadow:0 0 0 3px #ffffff0d}.calculator-dropdown{background:#fffffffa;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(0,0,0,.06);border-radius:14px;box-shadow:0 4px 12px #00000014,0 16px 32px #0000001f}:root.dark .calculator-dropdown,.dark .calculator-dropdown{background:#28282dfa;border:1px solid rgba(255,255,255,.08);box-shadow:0 4px 12px #00000040,0 16px 32px #00000059}.dropdown-item{transition:all .15s ease;border-radius:10px;margin:2px 4px}.dropdown-item:hover,.dropdown-item.highlighted{background:#0000000a}:root.dark .dropdown-item:hover,:root.dark .dropdown-item.highlighted,.dark .dropdown-item:hover,.dark .dropdown-item.highlighted{background:#ffffff14}.calculator-header{padding:20px 24px;border-bottom:1px solid var(--border)}.calculator-content{padding:20px 24px;display:flex;flex-direction:column;gap:14px}.calculator-footer{padding:0 24px 20px}.gradient-separator{height:1px;background:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.08) 20%,rgba(0,0,0,.08) 80%,transparent 100%)}:root.dark .gradient-separator,.dark .gradient-separator{background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.08) 20%,rgba(255,255,255,.08) 80%,transparent 100%)}.fee-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;font-size:13px;color:var(--calculator-secondary-foreground)}.fee-row .fee-label{color:inherit;transition:color .2s ease}.fee-row:hover .fee-label{color:var(--foreground)}.fee-row .value{font-variant-numeric:tabular-nums;color:var(--foreground);font-weight:500}.fee-row .fee-zero{font-variant-numeric:tabular-nums;font-weight:600;font-size:14px;color:var(--calculator-success-foreground)}.section-label{font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--calculator-secondary-foreground)}.ticker-badge{display:inline-flex;align-items:center;padding:3px 8px;background:#0000000a;border-radius:6px;font-size:10px;font-weight:600;color:var(--muted-foreground);letter-spacing:.04em}:root.dark .ticker-badge,.dark .ticker-badge{background:#ffffff14}.stock-price{font-size:18px;font-weight:700;color:var(--foreground);font-variant-numeric:tabular-nums;letter-spacing:-.02em}.updated-time{font-size:10px;color:var(--calculator-secondary-foreground)}.number-display{font-size:42px;font-weight:700;line-height:1;color:var(--foreground);font-variant-numeric:tabular-nums;letter-spacing:-.03em;transition:all .2s cubic-bezier(.4,0,.2,1)}@keyframes number-pop{0%{transform:scale(1);opacity:1}30%{transform:scale(1.08);opacity:.9}to{transform:scale(1);opacity:1}}.number-display.animating{animation:number-pop .25s cubic-bezier(.4,0,.2,1)}.shares-unit{font-size:12px;color:var(--calculator-secondary-foreground);font-weight:500}.total-amount{font-size:32px;font-weight:700;color:var(--foreground);font-variant-numeric:tabular-nums;letter-spacing:-.03em}.exchange-indicator{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--calculator-secondary-foreground)}.exchange-indicator .dot{width:6px;height:6px;border-radius:50%;background:#22c55e;box-shadow:0 0 8px #22c55e80;animation:pulse-dot 2s ease-in-out infinite}@keyframes pulse-dot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(.9)}}.live-pulse-dot{border-radius:50%;background:var(--primary);animation:live-pulse 1.5s ease-out infinite}@keyframes live-pulse{0%{transform:scale(1);box-shadow:0 0 #00c54566}50%{transform:scale(1.2);box-shadow:0 0 0 4px #00c54500}to{transform:scale(1);box-shadow:0 0 #00c54500}}.exchange-indicator .dot.warning{background:#eab308;box-shadow:0 0 8px #eab30880}.info-button{color:var(--calculator-secondary-foreground)}.savings-callout{background:var(--calculator-success-background);border:1px solid var(--calculator-success-border)}.savings-callout-label,.savings-callout-value{color:var(--calculator-success-foreground)}.logo-fallback{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#0000000a,#00000014);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:11px;color:var(--muted-foreground);letter-spacing:-.02em}:root.dark .logo-fallback,.dark .logo-fallback{background:linear-gradient(135deg,#ffffff14,#ffffff0a)}.stock-logo-ring{position:relative}.stock-logo-ring img{border-radius:50%;box-shadow:0 2px 8px #0000001a}@keyframes shimmer{0%{opacity:.4}50%{opacity:.8}to{opacity:.4}}.shimmer-loading{animation:shimmer 1.5s ease-in-out infinite}.calculator-placeholder{border:1px dashed rgba(0,0,0,.12);background:linear-gradient(180deg,#ffffffb8,#ffffffeb),radial-gradient(circle at top,rgba(0,197,69,.12),transparent 55%)}:root.dark .calculator-placeholder,.dark .calculator-placeholder{border-color:#ffffff1f;background:linear-gradient(180deg,#18181be6,#18181bf5),radial-gradient(circle at top,rgba(0,197,69,.16),transparent 55%)}.calculator-placeholder-bar{border-radius:999px;background:#00000012}:root.dark .calculator-placeholder-bar,.dark .calculator-placeholder-bar{background:#ffffff14}.primary-button{position:relative;background:var(--foreground);color:var(--background);font-weight:600;font-size:15px;border:none;border-radius:12px;transition:all .15s ease;overflow:hidden}.primary-button:hover{opacity:.9}.primary-button:active{transform:scale(.98);opacity:.85}.calculator-mobile{background:transparent;border-radius:0;box-shadow:none}:root.dark .calculator-mobile,.dark .calculator-mobile{box-shadow:none}.calculator-mobile .calculator-header-mobile{padding:0 0 12px}.calculator-mobile .calculator-content{padding:0;gap:14px}.calculator-mobile .stock-price{font-size:15px}.calculator-mobile .number-display{font-size:28px}.calculator-mobile .total-amount{font-size:24px}.calculator-mobile .section-label{font-size:9px}.calculator-mobile .fee-row{font-size:12px;padding:4px 0}.calculator-mobile .fee-row .fee-zero{font-size:12px}.calculator-mobile .glass-card{border-radius:14px;padding:12px}.calculator-mobile .counter-button{width:40px;height:40px}.calculator-mobile .logo-fallback{width:36px;height:36px;border-radius:50%;font-size:10px}.calculator-mobile .stock-logo-ring img{border-radius:50%;width:36px;height:36px}.calculator-mobile .exchange-indicator{font-size:11px}.calculator-mobile .stock-name{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.calculator-mobile .updated-time{font-size:10px}.calculator-mobile-scroll{scrollbar-width:none;-ms-overflow-style:none}.calculator-mobile-scroll::-webkit-scrollbar{display:none}@keyframes subtle-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-2px)}}.interactive-element:hover{animation:subtle-bounce .4s ease}.ripple-container{position:relative;overflow:hidden}.ripple-container:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,rgba(255,255,255,.3) 0%,transparent 70%);opacity:0;transform:scale(0);transition:all .4s ease}.ripple-container:active:after{opacity:1;transform:scale(2);transition:all 0s}
