html{--app-primary: #e45b5b;--app-secondary: #104494;--app-bg: #f1f0eb;--app-success: #15C815;--app-danger: red;--app-text: #333;--app-text-muted: #666;--app-border: #E5E5E5;--app-card-bg: #f2f2f2;--app-logout-bg: #e6e6e6;--app-header-height: 60px;--app-content-padding: 24px;--app-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif}body{font-family:var(--app-font-family);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app-header{display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;width:100%;height:var(--app-header-height);padding:12px 24px;background-color:var(--app-bg);position:sticky;top:0;z-index:100;box-sizing:border-box;border-bottom:1px solid var(--app-border)}.header-brand{display:flex;align-items:center;gap:8px;flex-shrink:0}.header-brand img{max-height:36px;max-width:36px;border-radius:6px;object-fit:contain}.header-brand h3{font-weight:700;color:var(--app-primary);font-size:20px;margin:0;white-space:nowrap}.header-nav{display:flex;align-items:center;gap:24px;margin-left:32px}.header-nav-item{font-weight:500;color:var(--app-primary);font-size:15px;cursor:pointer;padding:4px 0;white-space:nowrap;transition:opacity .2s ease}.header-nav-item:hover{opacity:.8}.header-left{display:flex;align-items:center}.header-right{display:flex;align-items:center;flex-shrink:0}.active-page{border-bottom:2px solid var(--app-primary);font-weight:700!important}.in-active-item{position:relative;display:inline-block;font-weight:500;cursor:pointer;overflow:hidden}.in-active-item:after{content:"";position:absolute;left:0;bottom:0;width:0;height:2px;background-color:var(--app-primary);transition:width .3s ease-in-out}.in-active-item:hover:after{width:100%}.in-active-item:not(:hover):after{width:0}.logout-btn{display:flex;align-items:center;gap:6px;background-color:var(--app-logout-bg);padding:6px 14px;border-radius:6px;cursor:pointer;transition:background-color .2s ease}.logout-btn:hover{background-color:#d9d9d9}.logout-btn h5{margin:0;font-size:14px;cursor:pointer}.logout-btn img{max-height:22px;max-width:22px;border-radius:4px;cursor:pointer}.floating-button{position:fixed;bottom:20px;right:20px;z-index:100}.edit-icon{visibility:hidden}.apiKeyField:hover .edit-icon,.text-field:hover .edit-icon{visibility:visible}.dialog{display:flex;justify-content:center;align-items:center}.v-dialog-overlay{background:#0006}.background-image{display:flex;align-items:center;position:relative;width:100%;height:100%;background-size:cover;background-position:center;background-repeat:no-repeat;z-index:0}vaadin-horizontal-layout,vaadin-button,vaadin-h3{position:relative;z-index:1}.trading-account-container{width:50%;max-width:600px;background-color:var(--app-card-bg);border:1px solid #ccc;border-radius:12px;box-shadow:0 2px 8px #00000014;padding:20px}.web-home-page{display:flex;flex-direction:column;align-items:center;width:100%}@media screen and (max-width:768px){.app-header{padding:8px 12px}.header-brand img{max-height:30px;max-width:30px}.header-brand h3{font-size:17px}.header-nav{gap:12px;margin-left:16px}.header-nav-item{font-size:13px}.logout-btn{padding:4px 10px}.logout-btn h5{display:none}.logout-btn img{max-height:20px;max-width:20px}.trading-account-container{width:80%!important}}@media screen and (max-width:600px){.app-header{padding:6px 8px;height:auto;min-height:48px}.header-brand img{max-height:26px;max-width:26px}.header-brand h3{font-size:15px}.header-nav{gap:8px;margin-left:10px}.header-nav-item{font-size:12px}.logout-btn{padding:4px 8px}.logout-btn h5{display:none}.logout-btn img{max-height:18px;max-width:18px}.background-image{width:100%;height:100%;display:flex!important;flex-direction:column!important;align-items:center!important}.web-home-page{width:100%}.trading-account-container{width:95%!important;margin-top:10px!important}.accountLayout{display:flex;justify-content:center;align-items:center;margin:10px;border-radius:8px!important}.floating-button{bottom:16px;right:16px}}@media screen and (max-width:400px){.header-brand h3{font-size:14px}.header-nav-item{font-size:11px}.header-nav{gap:6px;margin-left:6px}.trading-account-container{width:100%!important}}@media screen and (min-width:600px)and (max-width:1000px){.trading-account-container{width:70%!important}}