*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f5f8fc;color:#102b4d;font-family:Inter,Segoe UI,Arial,sans-serif;font-size:12px}button,input,select{font:inherit}.app-shell{min-height:100vh;display:flex}.sidebar{position:fixed;inset:0 auto 0 0;width:255px;background:#fff;border-right:1px solid #e5ebf2;z-index:20}.brand{height:68px;display:flex;align-items:center;gap:12px;padding:0 22px;border-bottom:1px solid #e7edf4;font-size:17px;letter-spacing:.2px}.brand-chart{height:29px;width:29px;display:flex;align-items:end;gap:3px}.brand-chart i{display:block;width:6px;background:#1677ed;border-radius:2px 2px 0 0}.brand-chart i:nth-child(1){height:12px}.brand-chart i:nth-child(2){height:20px}.brand-chart i:nth-child(3){height:29px}.sidebar nav{padding:14px 12px}.nav,.tree-toggle,.tree-instrument{width:100%;height:42px;border:0;background:transparent;text-decoration:none;color:#183657;display:flex;align-items:center;gap:13px;padding:0 16px;border-radius:9px;cursor:pointer;text-align:left}.nav span,.tree-toggle span{width:14px;text-align:center;color:#5277a0}.nav b,.tree-toggle b,.tree-instrument b{font-size:12px}.nav.active{background:#1678ee;color:#fff;box-shadow:0 5px 12px #1678ee24}.nav.active span{color:#fff}.tree-toggle em,.tree-instrument em{margin-left:auto;color:#6c86a3;font-style:normal}.tree-toggle{margin-top:5px}.tree-toggle:hover,.tree-instrument:hover{background:#f1f6fc}.tree-children{overflow:hidden;max-height:300px;transition:max-height .18s ease}.tree-children.collapsed{max-height:0}.tree-children.nested{margin-left:27px;border-left:1px solid #e5ecf4;padding-left:7px}.silver-toggle{height:39px;color:#294867}.tree-instrument{height:39px;padding-left:18px;background:#edf5ff;color:#12395f}.tree-instrument i{width:8px;height:8px;border-radius:50%;background:#10b77a;display:block}.sidebar-bottom{position:absolute;left:0;right:0;bottom:14px;padding:0 12px}.main{margin-left:255px;min-width:0;width:calc(100% - 255px)}.topbar{height:68px;background:#fff;border-bottom:1px solid #e5ebf2;display:flex;align-items:center;justify-content:flex-end;padding:0 30px;position:sticky;top:0;z-index:10}.top-spacer{flex:1}.top-right{display:flex;align-items:center;gap:15px;color:#173655;font-size:11px}.market-live{display:flex;align-items:center;gap:8px}.market-live i,.live-label i,.mcx-open i{display:inline-block;width:9px;height:9px;background:#10b77a;border-radius:50%}.date{color:#7488a1}.avatar{width:34px;height:34px;border-radius:50%;background:#edf3f9;display:grid;place-items:center;font-weight:700}.mobile-menu{display:none}.page{max-width:1440px;margin:auto;padding:25px 28px 38px}.welcome{display:flex;justify-content:space-between;align-items:center;margin:6px 0 18px}.kicker{font-size:9px;letter-spacing:1.5px;color:#587da6;font-weight:800;margin:0 0 8px}.welcome h1,.broker-hero h1{font-size:31px;line-height:1.08;margin:0;color:#102d51;letter-spacing:-.8px}.welcome>div>p:last-child,.broker-hero>div>p:last-child{margin:8px 0 0;color:#66809e;font-size:12px}.waterline{font-size:28px;color:#cfe0f2;letter-spacing:8px}.summary-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-bottom:15px}.summary-cards article{background:#fff;border:1px solid #e2eaf2;border-radius:11px;min-height:82px;display:flex;align-items:center;gap:13px;padding:15px;box-shadow:0 3px 12px #315a8508}.summary-cards article>div{width:42px;height:42px;border-radius:11px;background:#edf5ff;color:#1879ef;display:grid;place-items:center;font-size:18px}.summary-cards article>div.green{background:#e9faf4;color:#0db67b}.summary-cards b{font-size:23px;color:#0e2c50}.summary-cards small{display:block;font-size:10px;font-weight:500;color:#617895;margin-top:4px}.card{background:#fff;border:1px solid #e1e9f1;border-radius:11px;box-shadow:0 3px 12px #315a8508;overflow:hidden}.card header{min-height:55px;padding:0 15px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #edf1f5}.card h2{margin:0;font-size:16px;color:#102d51}.live-markets{margin-bottom:14px}.live-markets header{border-bottom:0}.live-label{font-size:10px;color:#10a975;display:flex;gap:7px;align-items:center}.table-scroll{overflow-x:auto}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:10px 14px;border-top:1px solid #edf1f5;font-size:10px;white-space:nowrap}th{color:#65809f;font-weight:600}td{color:#284767}td small{display:block;color:#8498ad;font-size:8px;margin-top:4px}.symbol{display:flex;align-items:center;gap:9px}.symbol>span{width:31px;height:31px;border-radius:8px;background:#f0f5fa;display:grid;place-items:center}.symbol b{font-size:11px}.positive{color:#0aaa72!important}.running{display:inline-flex;align-items:center;gap:7px;padding:6px 9px;border-radius:7px;background:#e9faf4;color:#0aab71;font-size:9px;font-weight:700}.running i{width:7px;height:7px;background:#10b77a;border-radius:50%}.dashboard-grid{display:grid;grid-template-columns:minmax(0,2.1fr) minmax(280px,.9fr) minmax(250px,.82fr);gap:14px;align-items:start}.chart-card{grid-column:1 / 3}.chart-card header{padding:13px 15px;min-height:76px}.chart-card header>div:first-child{display:block}.chart-card h2{border:0;margin-bottom:3px}.chart-card h2 small{font-size:10px;color:#65809e}.big-price{font-size:29px;font-weight:800;display:inline-block;margin-right:9px;color:#102d51}.time-tabs{display:flex;background:#edf3f9;padding:3px;border-radius:8px}.time-tabs button{border:0;background:transparent;color:#536f8f;padding:7px 9px;border-radius:6px;font-size:10px;cursor:pointer}.time-tabs button.active{background:#1679ef;color:#fff}.chart-wrap{height:305px;padding:10px 13px 13px;background:linear-gradient(#fff,#fbfdff)}#priceChart{width:100%;height:100%;display:block}.chart-grid{stroke:#e7eef5;stroke-width:1}.chart-line{fill:none;stroke:#1680ed;stroke-width:2.2}.chart-fill{fill:#1680ed12}.chart-empty{fill:#7890aa;font-size:12px}.levels-card{grid-column:2 / 3;grid-row:1 / 2}.levels-card header{min-height:55px}.tag,.state-badge{font-size:8px;background:#edf5ff;color:#1774df;border-radius:5px;padding:5px 7px;font-weight:700}.key-levels{padding:5px 15px 10px}.key-levels p{display:flex;justify-content:space-between;margin:0;padding:8px 0;border-bottom:1px solid #edf1f5;color:#69819d;font-size:10px}.key-levels p b{color:#173657;font-size:10px}.key-levels .buy-row b{color:#087ef0}.key-levels .sell-row b{color:#e05c5c}.right{grid-column:3;grid-row:1 / span 3;display:flex;flex-direction:column;gap:14px}.stat{display:flex;justify-content:space-between;padding:11px 15px;border-bottom:1px solid #edf1f5;color:#5f7896;font-size:10px}.stat b{color:#173657}.stat.highlight{background:#f5f9fd}.stat.highlight b{color:#0aaa72}.mcx-open{padding:10px 15px;color:#0aaa72;font-size:10px;display:flex;gap:7px;align-items:center}.hoursbar{margin:0 15px;height:8px;background:#e7eef5;border-radius:9px;overflow:hidden}.hoursbar span{display:block;width:78%;height:100%;background:#10b77a;border-radius:9px}.hours{display:flex;justify-content:space-between;padding:8px 15px 13px;color:#68819f;font-size:9px}.activity>div{padding:10px 15px;border-bottom:1px solid #edf1f5;display:grid;grid-template-columns:10px 1fr auto;column-gap:8px}.activity i{width:8px;height:8px;background:#10b77a;border-radius:50%;margin-top:3px}.activity i.blue{background:#197bf0}.activity b{font-size:10px}.activity small{grid-column:2;color:#7890a9;font-size:8px;margin-top:3px}.activity time{grid-column:3;grid-row:1 / span 2;color:#8194aa;font-size:8px}.positions{grid-column:1 / 3}.position-head{display:grid;grid-template-columns:1.4fr repeat(6,1fr);padding:9px 15px;color:#68819f;font-size:9px;border-bottom:1px solid #edf1f5}.empty{text-align:center;padding:35px;color:#8194aa;font-size:10px}.trade-state{grid-column:1 / 3;margin-top:14px}.trade-state header{min-height:50px}.trade-state header span{font-size:9px;background:#eef5fc;padding:5px 8px;border-radius:5px;color:#54718f}.state-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;padding:12px}.state-grid div{background:#f7fafd;border:1px solid #e7eef5;border-radius:7px;padding:9px}.state-grid span{display:block;color:#7b90a8;font-size:8px}.state-grid b{display:block;color:#193657;font-size:10px;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status-strip{margin-top:14px;background:#fff;border:1px solid #e1e9f1;border-radius:10px;padding:9px 12px;display:flex;align-items:center;gap:20px;color:#627c99;font-size:9px}.status-strip button{margin-left:auto;border:1px solid #dce6ef;background:#fff;border-radius:6px;padding:6px 9px;color:#4e6b8b;font-size:9px}.broker-content{max-width:1280px}.breadcrumb{display:flex;gap:9px;color:#7890a9;font-size:9px;margin:3px 0 20px}.breadcrumb a{color:#2c63a5;text-decoration:none}.broker-hero{display:flex;justify-content:space-between;align-items:end;margin-bottom:18px}.broker-hero h1{font-size:30px}.primary-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border:0;background:#1679ef;color:#fff;border-radius:8px;padding:11px 18px;font-weight:700;font-size:10px;box-shadow:0 5px 14px #1679ef25}.connection-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.connection-card,.safety-card{padding:15px}.card-top{display:flex;align-items:center;gap:12px}.card-top h2{margin:0;font-size:16px}.card-top small{display:block;color:#7c91a8;font-size:9px;margin-top:3px}.icon-blue,.icon-green{width:43px;height:43px;border-radius:10px;display:grid;place-items:center;font-size:18px}.icon-blue{background:#edf5ff;color:#1679ef}.icon-green{background:#e9faf4;color:#0aaa72}.connection-badge,.safe-badge{margin-left:auto;font-size:8px;font-weight:700;border-radius:6px;padding:6px 8px;background:#fff0f0;color:#ef6969}.safe-badge{background:#e9faf4;color:#0aaa72}.connection-body{margin:16px 0}.connection-body p,.safety-card>p{font-size:10px;line-height:1.6;color:#617b99}.secure-row{background:#f5f9fd;border-radius:7px;padding:9px;color:#65809d;font-size:9px}.safety-list div{padding:9px 0;border-bottom:1px solid #edf1f5;color:#0aaa72;font-size:9px}.safety-list span{float:right;color:#173657}.contract-card{margin-top:14px;padding:15px}.contract-card header{padding:0 0 12px;min-height:0}.contract-card pre{margin:0;background:#f6f9fc;border:1px solid #e7eef5;border-radius:8px;padding:13px;color:#4d6d8e;font:10px Consolas,monospace;white-space:pre-wrap}.status-strip b{color:#1679ef}@media(max-width:1250px){.sidebar{width:225px}.main{margin-left:225px;width:calc(100% - 225px)}.dashboard-grid{grid-template-columns:minmax(0,1.65fr) minmax(270px,.8fr)}.chart-card,.positions,.trade-state{grid-column:1 / 3}.levels-card{grid-column:2;grid-row:1}.right{grid-column:1 / 3;grid-row:auto;display:grid;grid-template-columns:repeat(3,1fr)}}@media(max-width:900px){.sidebar{width:210px}.main{margin-left:210px;width:calc(100% - 210px)}.top-right b:last-of-type,.date{display:none}.dashboard-grid{display:grid;grid-template-columns:1fr}.chart-card,.levels-card,.positions,.trade-state,.right{grid-column:1;grid-row:auto}.right{display:grid;grid-template-columns:1fr}.summary-cards{grid-template-columns:repeat(2,1fr)}.connection-grid{grid-template-columns:1fr}.state-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:650px){.sidebar{position:fixed;transform:translateX(-100%);transition:.2s;width:240px}.sidebar.mobile-open{transform:translateX(0)}.main{margin-left:0;width:100%}.topbar{height:58px;padding:0 14px}.mobile-menu{display:block;margin-right:auto;border:0;background:#edf4fb;color:#183657;border-radius:7px;width:34px;height:34px}.top-spacer{display:none}.page{padding:17px 13px 28px}.welcome h1{font-size:25px}.waterline{display:none}.summary-cards{gap:9px}.summary-cards article{min-height:70px;padding:11px}.summary-cards article>div{width:34px;height:34px}.summary-cards b{font-size:19px}.table-scroll{margin:0 -1px}.chart-wrap{height:250px}.chart-card header{align-items:flex-start}.time-tabs{margin-top:1px}.position-head{min-width:650px}.broker-hero{align-items:flex-start;flex-direction:column;gap:14px}.broker-hero h1{font-size:26px}.state-grid{grid-template-columns:repeat(2,1fr)}.status-strip{flex-wrap:wrap;gap:9px}.status-strip button{margin-left:0}.connection-grid{gap:10px}}.chart-line{stroke:#1680ed;stroke-width:2.2;fill:none}.chart-fill{fill:#1680ed10}.c-up{stroke:#10b77a;fill:#10b77a;stroke-width:1}.c-down{stroke:#ef6262;fill:#ef6262;stroke-width:1}.last-line{stroke:#9bb5cf;stroke-width:1;stroke-dasharray:4 4}.last-label{fill:#fff;font-size:10px;background:#10b77a}.chart-empty{fill:#7b90a8;font-size:12px}.tree-toggle.closed{background:#f7faff}.connection-badge{background:#e9faf4;color:#0aaa72}
/* Backtest audit controls */
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f5f8fc;color:#102b4d;font-family:Inter,Segoe UI,Arial,sans-serif;font-size:12px}button,input,select{font:inherit}.app-shell{min-height:100vh;display:flex}.sidebar{position:fixed;inset:0 auto 0 0;width:255px;background:#fff;border-right:1px solid #e5ebf2;z-index:20}.brand{height:68px;display:flex;align-items:center;gap:12px;padding:0 22px;border-bottom:1px solid #e7edf4;font-size:17px;letter-spacing:.2px}.brand-chart{height:29px;width:29px;display:flex;align-items:end;gap:3px}.brand-chart i{display:block;width:6px;background:#1677ed;border-radius:2px 2px 0 0}.brand-chart i:nth-child(1){height:12px}.brand-chart i:nth-child(2){height:20px}.brand-chart i:nth-child(3){height:29px}.sidebar nav{padding:14px 12px}.nav,.tree-toggle,.tree-instrument{width:100%;height:42px;border:0;background:transparent;text-decoration:none;color:#183657;display:flex;align-items:center;gap:13px;padding:0 16px;border-radius:9px;cursor:pointer;text-align:left}.nav span,.tree-toggle span{width:14px;text-align:center;color:#5277a0}.nav b,.tree-toggle b,.tree-instrument b{font-size:12px}.nav.active{background:#1678ee;color:#fff;box-shadow:0 5px 12px #1678ee24}.nav.active span{color:#fff}.tree-toggle em,.tree-instrument em{margin-left:auto;color:#6c86a3;font-style:normal}.tree-toggle{margin-top:5px}.tree-toggle:hover,.tree-instrument:hover{background:#f1f6fc}.tree-children{overflow:hidden;max-height:300px;transition:max-height .18s ease}.tree-children.collapsed{max-height:0}.tree-children.nested{margin-left:27px;border-left:1px solid #e5ecf4;padding-left:7px}.silver-toggle{height:39px;color:#294867}.tree-instrument{height:39px;padding-left:18px;background:#edf5ff;color:#12395f}.tree-instrument i{width:8px;height:8px;border-radius:50%;background:#10b77a;display:block}.sidebar-bottom{position:absolute;left:0;right:0;bottom:14px;padding:0 12px}.main{margin-left:255px;min-width:0;width:calc(100% - 255px)}.topbar{height:68px;background:#fff;border-bottom:1px solid #e5ebf2;display:flex;align-items:center;justify-content:flex-end;padding:0 30px;position:sticky;top:0;z-index:10}.top-spacer{flex:1}.top-right{display:flex;align-items:center;gap:15px;color:#173655;font-size:11px}.market-live{display:flex;align-items:center;gap:8px}.market-live i,.live-label i,.mcx-open i{display:inline-block;width:9px;height:9px;background:#10b77a;border-radius:50%}.date{color:#7488a1}.avatar{width:34px;height:34px;border-radius:50%;background:#edf3f9;display:grid;place-items:center;font-weight:700}.mobile-menu{display:none}.page{max-width:1440px;margin:auto;padding:25px 28px 38px}.welcome{display:flex;justify-content:space-between;align-items:center;margin:6px 0 18px}.kicker{font-size:9px;letter-spacing:1.5px;color:#587da6;font-weight:800;margin:0 0 8px}.welcome h1,.broker-hero h1{font-size:31px;line-height:1.08;margin:0;color:#102d51;letter-spacing:-.8px}.welcome>div>p:last-child,.broker-hero>div>p:last-child{margin:8px 0 0;color:#66809e;font-size:12px}.waterline{font-size:28px;color:#cfe0f2;letter-spacing:8px}.summary-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-bottom:15px}.summary-cards article{background:#fff;border:1px solid #e2eaf2;border-radius:11px;min-height:82px;display:flex;align-items:center;gap:13px;padding:15px;box-shadow:0 3px 12px #315a8508}.summary-cards article>div{width:42px;height:42px;border-radius:11px;background:#edf5ff;color:#1879ef;display:grid;place-items:center;font-size:18px}.summary-cards article>div.green{background:#e9faf4;color:#0db67b}.summary-cards b{font-size:23px;color:#0e2c50}.summary-cards small{display:block;font-size:10px;font-weight:500;color:#617895;margin-top:4px}.card{background:#fff;border:1px solid #e1e9f1;border-radius:11px;box-shadow:0 3px 12px #315a8508;overflow:hidden}.card header{min-height:55px;padding:0 15px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #edf1f5}.card h2{margin:0;font-size:16px;color:#102d51}.live-markets{margin-bottom:14px}.live-markets header{border-bottom:0}.live-label{font-size:10px;color:#10a975;display:flex;gap:7px;align-items:center}.table-scroll{overflow-x:auto}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:10px 14px;border-top:1px solid #edf1f5;font-size:10px;white-space:nowrap}th{color:#65809f;font-weight:600}td{color:#284767}td small{display:block;color:#8498ad;font-size:8px;margin-top:4px}.symbol{display:flex;align-items:center;gap:9px}.symbol>span{width:31px;height:31px;border-radius:8px;background:#f0f5fa;display:grid;place-items:center}.symbol b{font-size:11px}.positive{color:#0aaa72!important}.running{display:inline-flex;align-items:center;gap:7px;padding:6px 9px;border-radius:7px;background:#e9faf4;color:#0aab71;font-size:9px;font-weight:700}.running i{width:7px;height:7px;background:#10b77a;border-radius:50%}.dashboard-grid{display:grid;grid-template-columns:minmax(0,2.1fr) minmax(280px,.9fr) minmax(250px,.82fr);gap:14px;align-items:start}.chart-card{grid-column:1 / 3}.chart-card header{padding:13px 15px;min-height:76px}.chart-card header>div:first-child{display:block}.chart-card h2{border:0;margin-bottom:3px}.chart-card h2 small{font-size:10px;color:#65809e}.big-price{font-size:29px;font-weight:800;display:inline-block;margin-right:9px;color:#102d51}.time-tabs{display:flex;background:#edf3f9;padding:3px;border-radius:8px}.time-tabs button{border:0;background:transparent;color:#536f8f;padding:7px 9px;border-radius:6px;font-size:10px;cursor:pointer}.time-tabs button.active{background:#1679ef;color:#fff}.chart-wrap{height:305px;padding:10px 13px 13px;background:linear-gradient(#fff,#fbfdff)}#priceChart{width:100%;height:100%;display:block}.chart-grid{stroke:#e7eef5;stroke-width:1}.chart-line{fill:none;stroke:#1680ed;stroke-width:2.2}.chart-fill{fill:#1680ed12}.chart-empty{fill:#7890aa;font-size:12px}.levels-card{grid-column:2 / 3;grid-row:1 / 2}.levels-card header{min-height:55px}.tag,.state-badge{font-size:8px;background:#edf5ff;color:#1774df;border-radius:5px;padding:5px 7px;font-weight:700}.key-levels{padding:5px 15px 10px}.key-levels p{display:flex;justify-content:space-between;margin:0;padding:8px 0;border-bottom:1px solid #edf1f5;color:#69819d;font-size:10px}.key-levels p b{color:#173657;font-size:10px}.key-levels .buy-row b{color:#087ef0}.key-levels .sell-row b{color:#e05c5c}.right{grid-column:3;grid-row:1 / span 3;display:flex;flex-direction:column;gap:14px}.stat{display:flex;justify-content:space-between;padding:11px 15px;border-bottom:1px solid #edf1f5;color:#5f7896;font-size:10px}.stat b{color:#173657}.stat.highlight{background:#f5f9fd}.stat.highlight b{color:#0aaa72}.mcx-open{padding:10px 15px;color:#0aaa72;font-size:10px;display:flex;gap:7px;align-items:center}.hoursbar{margin:0 15px;height:8px;background:#e7eef5;border-radius:9px;overflow:hidden}.hoursbar span{display:block;width:78%;height:100%;background:#10b77a;border-radius:9px}.hours{display:flex;justify-content:space-between;padding:8px 15px 13px;color:#68819f;font-size:9px}.activity>div{padding:10px 15px;border-bottom:1px solid #edf1f5;display:grid;grid-template-columns:10px 1fr auto;column-gap:8px}.activity i{width:8px;height:8px;background:#10b77a;border-radius:50%;margin-top:3px}.activity i.blue{background:#197bf0}.activity b{font-size:10px}.activity small{grid-column:2;color:#7890a9;font-size:8px;margin-top:3px}.activity time{grid-column:3;grid-row:1 / span 2;color:#8194aa;font-size:8px}.positions{grid-column:1 / 3}.position-head{display:grid;grid-template-columns:1.4fr repeat(6,1fr);padding:9px 15px;color:#68819f;font-size:9px;border-bottom:1px solid #edf1f5}.empty{text-align:center;padding:35px;color:#8194aa;font-size:10px}.trade-state{grid-column:1 / 3;margin-top:14px}.trade-state header{min-height:50px}.trade-state header span{font-size:9px;background:#eef5fc;padding:5px 8px;border-radius:5px;color:#54718f}.state-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;padding:12px}.state-grid div{background:#f7fafd;border:1px solid #e7eef5;border-radius:7px;padding:9px}.state-grid span{display:block;color:#7b90a8;font-size:8px}.state-grid b{display:block;color:#193657;font-size:10px;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status-strip{margin-top:14px;background:#fff;border:1px solid #e1e9f1;border-radius:10px;padding:9px 12px;display:flex;align-items:center;gap:20px;color:#627c99;font-size:9px}.status-strip button{margin-left:auto;border:1px solid #dce6ef;background:#fff;border-radius:6px;padding:6px 9px;color:#4e6b8b;font-size:9px}.broker-content{max-width:1280px}.breadcrumb{display:flex;gap:9px;color:#7890a9;font-size:9px;margin:3px 0 20px}.breadcrumb a{color:#2c63a5;text-decoration:none}.broker-hero{display:flex;justify-content:space-between;align-items:end;margin-bottom:18px}.broker-hero h1{font-size:30px}.primary-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border:0;background:#1679ef;color:#fff;border-radius:8px;padding:11px 18px;font-weight:700;font-size:10px;box-shadow:0 5px 14px #1679ef25}.connection-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.connection-card,.safety-card{padding:15px}.card-top{display:flex;align-items:center;gap:12px}.card-top h2{margin:0;font-size:16px}.card-top small{display:block;color:#7c91a8;font-size:9px;margin-top:3px}.icon-blue,.icon-green{width:43px;height:43px;border-radius:10px;display:grid;place-items:center;font-size:18px}.icon-blue{background:#edf5ff;color:#1679ef}.icon-green{background:#e9faf4;color:#0aaa72}.connection-badge,.safe-badge{margin-left:auto;font-size:8px;font-weight:700;border-radius:6px;padding:6px 8px;background:#fff0f0;color:#ef6969}.safe-badge{background:#e9faf4;color:#0aaa72}.connection-body{margin:16px 0}.connection-body p,.safety-card>p{font-size:10px;line-height:1.6;color:#617b99}.secure-row{background:#f5f9fd;border-radius:7px;padding:9px;color:#65809d;font-size:9px}.safety-list div{padding:9px 0;border-bottom:1px solid #edf1f5;color:#0aaa72;font-size:9px}.safety-list span{float:right;color:#173657}.contract-card{margin-top:14px;padding:15px}.contract-card header{padding:0 0 12px;min-height:0}.contract-card pre{margin:0;background:#f6f9fc;border:1px solid #e7eef5;border-radius:8px;padding:13px;color:#4d6d8e;font:10px Consolas,monospace;white-space:pre-wrap}.status-strip b{color:#1679ef}@media(max-width:1250px){.sidebar{width:225px}.main{margin-left:225px;width:calc(100% - 225px)}.dashboard-grid{grid-template-columns:minmax(0,1.65fr) minmax(270px,.8fr)}.chart-card,.positions,.trade-state{grid-column:1 / 3}.levels-card{grid-column:2;grid-row:1}.right{grid-column:1 / 3;grid-row:auto;display:grid;grid-template-columns:repeat(3,1fr)}}@media(max-width:900px){.sidebar{width:210px}.main{margin-left:210px;width:calc(100% - 210px)}.top-right b:last-of-type,.date{display:none}.dashboard-grid{display:grid;grid-template-columns:1fr}.chart-card,.levels-card,.positions,.trade-state,.right{grid-column:1;grid-row:auto}.right{display:grid;grid-template-columns:1fr}.summary-cards{grid-template-columns:repeat(2,1fr)}.connection-grid{grid-template-columns:1fr}.state-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:650px){.sidebar{position:fixed;transform:translateX(-100%);transition:.2s;width:240px}.sidebar.mobile-open{transform:translateX(0)}.main{margin-left:0;width:100%}.topbar{height:58px;padding:0 14px}.mobile-menu{display:block;margin-right:auto;border:0;background:#edf4fb;color:#183657;border-radius:7px;width:34px;height:34px}.top-spacer{display:none}.page{padding:17px 13px 28px}.welcome h1{font-size:25px}.waterline{display:none}.summary-cards{gap:9px}.summary-cards article{min-height:70px;padding:11px}.summary-cards article>div{width:34px;height:34px}.summary-cards b{font-size:19px}.table-scroll{margin:0 -1px}.chart-wrap{height:250px}.chart-card header{align-items:flex-start}.time-tabs{margin-top:1px}.position-head{min-width:650px}.broker-hero{align-items:flex-start;flex-direction:column;gap:14px}.broker-hero h1{font-size:26px}.state-grid{grid-template-columns:repeat(2,1fr)}.status-strip{flex-wrap:wrap;gap:9px}.status-strip button{margin-left:0}.connection-grid{gap:10px}}.chart-line{stroke:#1680ed;stroke-width:2.2;fill:none}.chart-fill{fill:#1680ed10}.c-up{stroke:#10b77a;fill:#10b77a;stroke-width:1}.c-down{stroke:#ef6262;fill:#ef6262;stroke-width:1}.last-line{stroke:#9bb5cf;stroke-width:1;stroke-dasharray:4 4}.last-label{fill:#fff;font-size:10px;background:#10b77a}.chart-empty{fill:#7b90a8;font-size:12px}.tree-toggle.closed{background:#f7faff}.connection-badge{background:#e9faf4;color:#0aaa72}
/* ============================================================
QUANT EDGE — FINAL DASHBOARD STRUCTURE
DOM is intentionally split into independent left/right stacks.
============================================================ */
.summary-cards article section{
display:flex;
flex-direction:column;
align-items:flex-start;
justify-content:center;
min-width:0;
line-height:1;
}
.summary-cards .metric-label{
display:block;
font-size:8px;
line-height:1.2;
letter-spacing:.55px;
font-weight:800;
color:#6b829e;
margin:0 0 5px;
white-space:nowrap;
}
.summary-cards article section>b{
display:block;
font-size:23px;
line-height:1.05;
font-weight:800;
color:#102d51;
margin:0;
}
.summary-cards article section>small{
display:block;
font-size:9px;
line-height:1.2;
color:#8194aa;
margin:5px 0 0;
font-weight:500;
white-space:nowrap;
}
.dashboard-grid{
display:grid !important;
grid-template-columns:minmax(0,2fr) minmax(300px,.9fr) !important;
gap:14px !important;
align-items:start !important;
}
.dashboard-left,
.dashboard-right{
min-width:0;
display:flex;
flex-direction:column;
gap:14px;
}
.dashboard-left > .card,
.dashboard-right > .card{
width:100%;
min-width:0;
margin:0 !important;
}
.dashboard-left .positions{
margin:0 !important;
}
.dashboard-right .levels-card{
order:0;
}
.dashboard-right .right{
display:flex !important;
flex-direction:column !important;
gap:14px !important;
margin:0 !important;
min-width:0;
}
.dashboard-right .right > .card{
width:100%;
margin:0 !important;
}
.dashboard-right .right > .card + .card{
margin-top:0 !important;
}
.chart-wrap{
height:285px !important;
}
.trade-state{
width:100%;
margin-top:14px !important;
}
.status-strip{
width:100%;
}
/* At smaller widths, stack the two columns. */
@media(max-width:1050px){
.dashboard-grid{
grid-template-columns:minmax(0,1fr) !important;
}
}
@media(max-width:650px){
.summary-cards article section>b{font-size:19px}
.summary-cards .metric-label{font-size:7px}
.summary-cards article section>small{font-size:8px}
.chart-wrap{height:245px !important}
}
/* ============================================================
QUANT EDGE — LEFT COLUMN FLOW
Strategy state and market status intentionally live below
Open Positions so the dashboard uses the available space.
============================================================ */
.dashboard-left > .trade-state,
.dashboard-left > .status-strip{
width:100%;
margin:0 !important;
}
.dashboard-left > .trade-state{
margin-top:0 !important;
}
.dashboard-left > .status-strip{
margin-top:0 !important;
}
.dashboard-left .trade-state .state-grid{
grid-template-columns:repeat(3,minmax(0,1fr));
}
@media(max-width:650px){
.dashboard-left .trade-state .state-grid{
grid-template-columns:repeat(2,minmax(0,1fr));
}
}
/* ============================================================
QUANT EDGE — EQUAL BOTTOM ALIGNMENT
Desktop: both dashboard columns share one bottom boundary.
No card is placed into a shared grid row.
============================================================ */
@media(min-width:1051px){
.dashboard-grid{
align-items:stretch !important;
}
.dashboard-left,
.dashboard-right{
height:100% !important;
align-self:stretch !important;
}
/*
* The left column determines the natural dashboard height.
* The right column fills that exact height without changing the
* vertical position of any card.
*/
.dashboard-right{
justify-content:flex-start !important;
}
/*
* Keep the final right-side card aligned with the bottom of the
* left-side stack. We use the available column height rather than
* creating another grid row.
*/
.dashboard-right > .right{
flex:1 1 auto !important;
}
.dashboard-right > .right > .card:last-child{
margin-bottom:0 !important;
}
/* The final left status card participates in the natural stack. */
.dashboard-left > .status-strip{
margin-bottom:0 !important;
}
}
/* At tablet/mobile widths there is one column, so equal-bottom alignment
is neither necessary nor desirable. */
@media(max-width:1050px){
.dashboard-grid{
align-items:start !important;
}
.dashboard-left,
.dashboard-right{
height:auto !important;
}
}
@media(min-width:1051px){
.dashboard-right{
display:grid !important;
grid-template-rows:auto auto auto minmax(0,1fr) !important;
align-content:stretch !important;
gap:14px !important;
}
.dashboard-right > .levels-card{
min-height:0 !important;
}
.dashboard-right > .right{
display:contents !important;
}
.dashboard-right > .right > .card{
min-height:0 !important;
}
/* Quick Stats, Market Hours and Recent Activity become the next rows. */
.dashboard-right > .right > .card:last-child{
height:100% !important;
min-height:0 !important;
}
}
@media(max-width:1050px){
.dashboard-right{
display:flex !important;
flex-direction:column !important;
}
.dashboard-right > .right{
display:flex !important;
flex-direction:column !important;
}
}
.bt-controls{margin-bottom:16px}.bt-controls header{display:flex;justify-content:space-between;align-items:center}.bt-controls header small{display:block;margin-top:5px}.bt-form{display:grid;grid-template-columns:repeat(5,minmax(120px,1fr)) auto;gap:12px;align-items:end;margin-top:18px}.bt-form label{font-size:12px;font-weight:700;letter-spacing:.04em}.bt-form input{display:block;width:100%;box-sizing:border-box;margin-top:7px;padding:12px;border:1px solid #dfe5ec;border-radius:10px;background:#fff;font:inherit}.primary-btn{border:0;border-radius:10px;padding:13px 18px;background:#111827;color:#fff;font-weight:700;cursor:pointer}.primary-btn:disabled{opacity:.55;cursor:wait}.bt-msg{font-size:13px;margin-top:12px;min-height:18px}.bt-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(260px,1fr);gap:16px;margin-top:16px}.bt-equity svg{width:100%;height:300px;color:#111827}.bt-equity header,.bt-trades header{display:flex;justify-content:space-between;align-items:center}.bt-equity header span,.bt-trades header span{font-size:12px;color:#7b8794}.bt-stats{padding:20px}.bt-stat{display:flex;justify-content:space-between;padding:13px 0;border-bottom:1px solid #edf0f3;font-size:13px}.bt-stat:last-child{border-bottom:0}.bt-stat b{font-size:14px}.negative{color:#c2410c}.bt-summary{margin-top:16px}.bt-trades{margin-top:16px}.bt-trades table{width:100%;border-collapse:collapse}.bt-trades th,.bt-trades td{padding:12px 10px;text-align:left;border-bottom:1px solid #edf0f3;font-size:12px;white-space:nowrap}.bt-trades th{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:#7b8794}.bt-trades .empty{text-align:center;padding:28px}.tree-instrument.active{background:#eef5ff;border-radius:8px}
@media(max-width:1050px){.bt-form{grid-template-columns:repeat(2,1fr)}.bt-grid{grid-template-columns:1fr}}
@media(max-width:650px){.bt-form{grid-template-columns:1fr}.bt-controls header{align-items:flex-start;gap:10px}.bt-trades th,.bt-trades td{padding:9px 7px}}
.bt-derived{display:flex;flex-direction:column;justify-content:center;min-width:150px;padding:10px 12px;background:#f6f9fc;border:1px solid #e4ebf2;border-radius:8px}.bt-derived span{font-size:9px;color:#7188a2}.bt-derived b{font-size:16px;color:#173657;margin-top:4px}.bt-derived small{font-size:8px;color:#8a9bae;margin-top:3px}.bt-form{align-items:stretch}
/* Backtest event audit */
.bt-mode{display:inline-flex;align-items:center;padding:4px 8px;border-radius:999px;font-size:10px;font-weight:800;letter-spacing:.04em;white-space:nowrap}
.mode-normal{border:1px solid rgba(90,90,90,.22);background:rgba(90,90,90,.07)}
.mode-gap-up{border:1px solid rgba(0,140,90,.28);background:rgba(0,140,90,.08)}
.mode-gap-down{border:1px solid rgba(180,90,0,.28);background:rgba(180,90,0,.08)}
.mode-reversal{border:1px solid rgba(90,80,180,.28);background:rgba(90,80,180,.08)}
.bt-event-btn{border:1px solid rgba(80,80,80,.2);background:transparent;border-radius:7px;padding:6px 9px;font:inherit;font-size:11px;font-weight:700;cursor:pointer;white-space:nowrap}
.bt-event-btn:hover{background:rgba(80,80,80,.07)}
.bt-event-row td{padding:0 14px 12px!important;border-top:0!important}
.bt-event-panel{display:grid;grid-template-columns:repeat(3,minmax(180px,1fr));gap:10px;padding:14px;border:1px solid rgba(80,80,80,.12);border-radius:10px;background:rgba(80,80,80,.025)}
.bt-event-panel>div{display:flex;flex-direction:column;gap:5px;min-width:0}
.bt-event-panel b{font-size:10px;text-transform:uppercase;letter-spacing:.05em;opacity:.58}
.bt-event-panel span{font-size:12px;line-height:1.35}
.bt-event-panel .muted{opacity:.48}
@media(max-width:900px){.bt-event-panel{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.bt-event-panel{grid-template-columns:1fr}}
/* Backtest audit controls */
.bt-trades > header > div{display:flex;flex-direction:column;gap:4px}
.secondary-btn{
border:1px solid rgba(20,40,70,.14);
background:#fff;
color:#1c2a3a;
border-radius:10px;
padding:10px 14px;
font-weight:700;
cursor:pointer;
white-space:nowrap;
}
.secondary-btn:hover:not(:disabled){background:#f5f8fb}
.secondary-btn:disabled{opacity:.45;cursor:not-allowed}
@media (max-width:760px){
.bt-trades > header{align-items:flex-start;gap:12px;flex-wrap:wrap}
.secondary-btn{width:100%}
}
/* Live Zerodha account details */
.live-markets td small{display:block;margin-top:4px;opacity:.62;font-size:11px}
#accountQty{font-weight:600}
#accountSync{white-space:nowrap}
.bt-min-capital{
margin-top:10px;
padding:12px 14px;
border:1px solid rgba(190,125,20,.28);
background:#fffaf0;
border-radius:10px;
color:#7a5200;
font-size:14px;
}
.bt-min-capital small{display:block;margin-top:4px;opacity:.75}
.bt-msg.error{color:#a33}
.bt-toast{
position:fixed;top:22px;right:24px;z-index:9999;max-width:360px;
padding:13px 17px;border:1px solid rgba(26,79,145,.16);border-radius:12px;
background:#fff;box-shadow:0 12px 32px rgba(18,45,78,.16);color:#102f55;
font-size:14px;font-weight:700;line-height:1.4;opacity:0;transform:translateY(-8px);
pointer-events:none;transition:opacity .18s ease,transform .18s ease;
}
.bt-toast.show{opacity:1;transform:translateY(0)}
@media(max-width:700px){.bt-toast{left:16px;right:16px;top:16px;max-width:none}}
/* Quant Edge account avatar + dropdown
Compact, theme-matched, dependency-free, keyboard/outside-click friendly. */
.qe-account-menu {
position: relative;
display: flex;
align-items: center;
margin-left: 8px;
z-index: 1000;
}
.qe-account-trigger {
appearance: none;
border: 1px solid #dfe6ee;
background: #ffffff;
color: #243247;
height: 38px;
min-width: 38px;
padding: 3px 7px 3px 3px;
border-radius: 11px;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 6px;
cursor: pointer;
transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
box-sizing: border-box;
}
.qe-account-trigger:hover {
background: #f8fafc;
border-color: #cfd9e5;
}
.qe-account-trigger:focus-visible {
outline: none;
border-color: #94a8bd;
box-shadow: 0 0 0 3px rgba(60, 91, 120, .12);
}
.qe-account-avatar {
width: 30px;
height: 30px;
border-radius: 50%;
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 30px;
background: #eaf0f6;
color: #31465c;
font-size: 12px;
line-height: 1;
font-weight: 700;
letter-spacing: .01em;
box-sizing: border-box;
}
.qe-account-chevron {
width: 15px;
height: 15px;
color: #718096;
flex: 0 0 15px;
transition: transform .16s ease;
}
.qe-account-menu.is-open .qe-account-chevron {
transform: rotate(180deg);
}
.qe-account-dropdown {
position: absolute;
top: calc(100% + 9px);
right: 0;
width: 248px;
padding: 8px;
border: 1px solid #e1e7ef;
border-radius: 13px;
background: #ffffff;
box-shadow: 0 14px 34px rgba(31, 45, 61, .13), 0 3px 8px rgba(31, 45, 61, .06);
box-sizing: border-box;
opacity: 0;
visibility: hidden;
transform: translateY(-4px) scale(.985);
transform-origin: top right;
pointer-events: none;
transition: opacity .14s ease, transform .14s ease, visibility .14s ease;
}
.qe-account-menu.is-open .qe-account-dropdown {
opacity: 1;
visibility: visible;
transform: translateY(0) scale(1);
pointer-events: auto;
}
.qe-account-summary {
min-height: 58px;
padding: 7px 8px;
display: flex;
align-items: center;
gap: 10px;
box-sizing: border-box;
}
.qe-account-avatar-large {
width: 38px;
height: 38px;
flex-basis: 38px;
font-size: 13px;
}
.qe-account-summary-copy {
min-width: 0;
flex: 1;
text-align: left;
}
.qe-account-name {
color: #1f2d3d;
font-size: 13px;
line-height: 18px;
font-weight: 650;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.qe-account-email {
margin-top: 1px;
color: #7a8796;
font-size: 11px;
line-height: 16px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.qe-account-divider {
height: 1px;
margin: 5px 4px;
background: #edf1f5;
}
.qe-account-item {
min-height: 38px;
padding: 0 9px;
border-radius: 8px;
display: flex;
align-items: center;
gap: 10px;
color: #334155;
font-size: 12.5px;
line-height: 18px;
font-weight: 500;
text-decoration: none;
box-sizing: border-box;
}
.qe-account-item:hover {
background: #f5f8fb;
color: #1f2d3d;
}
.qe-account-item-danger {
color: #b44a4a;
}
.qe-account-item-danger:hover {
background: #fff5f5;
color: #a63d3d;
}
.qe-account-item-icon {
width: 18px;
height: 18px;
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 18px;
}
.qe-account-item-icon svg {
width: 17px;
height: 17px;
fill: none;
stroke: currentColor;
stroke-width: 1.6;
stroke-linecap: round;
stroke-linejoin: round;
}
@media (max-width: 640px) {
.qe-account-trigger {
width: 38px;
min-width: 38px;
padding: 3px;
}
.qe-account-chevron {
display: none;
}
.qe-account-dropdown {
right: -4px;
width: min(248px, calc(100vw - 24px));
}
}
/* Quant Edge — master Profile page */
.qe-profile-master {
background: #f5f8fc;
color: #173655;
}
.qe-profile-master .qe-profile-content {
max-width: 1180px;
margin: 0 auto;
padding: 30px 32px 50px;
box-sizing: border-box;
}
.qe-profile-master .qe-profile-welcome {
display: flex;
align-items: center;
justify-content: space-between;
margin: 4px 0 24px;
}
.qe-profile-master .qe-profile-welcome h1 {
margin: 0;
color: #102d51;
font-size: 31px;
line-height: 1.08;
letter-spacing: -.8px;
}
.qe-profile-master .qe-profile-welcome .kicker {
margin-bottom: 8px;
}
.qe-profile-master .qe-profile-welcome > div > p:last-child {
margin: 8px 0 0;
color: #66809e;
font-size: 12px;
}
.qe-profile-master .qe-profile-card {
width: 100%;
max-width: 920px;
overflow: hidden;
background: #fff;
border: 1px solid #e1e9f1;
border-radius: 12px;
box-shadow: 0 5px 18px rgba(49, 90, 133, .055);
}
.qe-profile-master .qe-profile-card > header {
min-height: 66px;
padding: 0 22px;
margin: 0;
display: flex;
align-items: center;
border-bottom: 1px solid #edf1f5;
box-sizing: border-box;
}
.qe-profile-master .qe-profile-card h2 {
margin: 0 0 4px;
color: #102d51;
font-size: 16px;
line-height: 20px;
}
.qe-profile-master .qe-profile-muted {
color: #8092a7;
font-size: 11px;
line-height: 16px;
}
.qe-profile-master .qe-profile-form {
padding: 24px 22px 22px;
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
column-gap: 20px;
row-gap: 20px;
box-sizing: border-box;
}
.qe-profile-master .qe-profile-form label {
min-width: 0;
display: flex;
flex-direction: column;
gap: 8px;
color: #294867;
font-size: 11px;
line-height: 15px;
font-weight: 700;
}
.qe-profile-master .qe-profile-form label:last-of-type {
grid-column: 1 / -1;
max-width: calc(50% - 10px);
}
.qe-profile-master .qe-profile-form input {
width: 100%;
height: 42px;
padding: 0 12px;
box-sizing: border-box;
border: 1px solid #dce5ee;
border-radius: 8px;
background: #fbfcfe;
color: #203b58;
font: 500 12px/42px inherit;
outline: none;
}
.qe-profile-master .qe-profile-form input:focus {
border-color: #a9bdd2;
background: #fff;
box-shadow: 0 0 0 3px rgba(82, 119, 160, .08);
}
.qe-profile-master .qe-profile-form input:disabled {
color: #7d90a5;
background: #f5f7fa;
cursor: not-allowed;
}
.qe-profile-master .qe-profile-form-actions {
grid-column: 1 / -1;
display: flex;
align-items: center;
gap: 18px;
margin-top: 2px;
padding-top: 2px;
}
.qe-profile-master .qe-profile-form-actions button {
height: 38px;
padding: 0 16px;
border: 1px solid #176fd8;
border-radius: 8px;
background: #1678ee;
color: #fff;
font: 700 11px/38px inherit;
cursor: pointer;
box-shadow: 0 4px 10px rgba(22, 120, 238, .14);
}
.qe-profile-master .qe-profile-form-actions button:hover {
background: #126edc;
}
.qe-profile-master .qe-profile-back {
color: #5d7692;
font-size: 11px;
line-height: 38px;
text-decoration: none;
}
.qe-profile-master .qe-profile-back:hover {
color: #244e78;
}
.qe-profile-master .qe-auth-error,
.qe-profile-master .qe-auth-success {
margin: 16px 22px 0;
padding: 10px 12px;
border-radius: 8px;
font-size: 11px;
line-height: 16px;
}
.qe-profile-master .qe-auth-error {
color: #a84444;
background: #fff5f5;
border: 1px solid #f0d7d7;
}
.qe-profile-master .qe-auth-success {
color: #187456;
background: #f0faf6;
border: 1px solid #d5eee4;
}
@media (max-width: 760px) {
.qe-profile-master .qe-profile-content {
padding: 24px 18px 36px;
}
.qe-profile-master .qe-profile-form {
grid-template-columns: 1fr;
}
.qe-profile-master .qe-profile-form label:last-of-type {
grid-column: auto;
max-width: none;
}
.qe-profile-master .qe-profile-form-actions {
grid-column: auto;
}
}
/* Universal Quant Edge master header */
.qe .topbar {
box-sizing: border-box;
}
.qe .top-right {
min-height: 38px;
}
.qe .top-right .qe-account-menu {
flex: 0 0 auto;
}
/* Fast profile save feedback */
.qe-profile-save-status {
min-height: 20px;
display: inline-flex;
align-items: center;
margin-left: 10px;
font-size: 12px;
font-weight: 600;
}
.qe-profile-save-status.is-success { color: #178a5b; }
.qe-profile-save-status.is-error { color: #c43d3d; }
.qe-profile-form-actions button:disabled {
opacity: .7;
cursor: wait;
}
@media (max-width: 640px) {
.qe-profile-save-status {
margin-left: 0;
margin-top: 8px;
width: 100%;
}
}
/* Backtest Configuration alignment v15 */
.qe-backtest-config-grid {
display: grid !important;
grid-template-columns: minmax(210px, 1.15fr) minmax(210px, 1.15fr)
repeat(4, minmax(170px, 1fr)) !important;
gap: 14px !important;
align-items: stretch !important;
width: 100% !important;
box-sizing: border-box !important;
}
.qe-backtest-config-grid > * {
min-width: 0 !important;
width: auto !important;
box-sizing: border-box !important;
}
.qe-backtest-config-grid input {
width: 100% !important;
box-sizing: border-box !important;
}
@media (max-width: 1280px) {
.qe-backtest-config-grid {
grid-template-columns: repeat(3, minmax(190px, 1fr)) !important;
}
}
@media (max-width: 760px) {
.qe-backtest-config-grid {
grid-template-columns: 1fr 1fr !important;
}
}
@media (max-width: 520px) {
.qe-backtest-config-grid {
grid-template-columns: 1fr !important;
}
}
/* =========================================================
Quant Edge Backtesting UI — v16
Inspired by modern trading/analytics products:
strong hierarchy, compact KPI tiles, chart-first results,
dense but readable trade table, restrained color usage.
========================================================= */
.qe-backtest-page .bt-page {
max-width: 1500px;
margin: 0 auto;
}
.qe-backtest-page .bt-hero {
display:flex;
justify-content:space-between;
align-items:flex-end;
gap:28px;
padding:6px 2px 24px;
}
.qe-backtest-page .bt-eyebrow,
.qe-backtest-page .bt-section-kicker,
.qe-backtest-page .bt-field-label,
.qe-backtest-page .bt-kpi-label {
font-size:10px;
font-weight:800;
letter-spacing:.11em;
text-transform:uppercase;
color:#7890aa;
}
.qe-backtest-page .bt-eyebrow {
display:flex;
align-items:center;
gap:7px;
margin-bottom:8px;
color:#527493;
}
.qe-backtest-page .bt-status-dot {
width:7px;
height:7px;
border-radius:50%;
background:#19a56f;
box-shadow:0 0 0 4px rgba(25,165,111,.10);
}
.qe-backtest-page .bt-hero h1 {
margin:0;
font-size:28px;
line-height:1.15;
letter-spacing:-.035em;
color:#102b49;
}
.qe-backtest-page .bt-hero p {
max-width:720px;
margin:8px 0 0;
color:#71839a;
font-size:13px;
line-height:1.6;
}
.qe-backtest-page .bt-hero-badge {
min-width:130px;
padding:13px 16px;
border:1px solid #dbe7f2;
border-radius:12px;
background:#f8fbfe;
text-align:left;
}
.qe-backtest-page .bt-hero-badge strong {
display:block;
color:#155cbd;
font-size:12px;
letter-spacing:.04em;
}
.qe-backtest-page .bt-hero-badge span {
display:block;
margin-top:4px;
color:#7b8da2;
font-size:11px;
}
.qe-backtest-page .bt-config-card,
.qe-backtest-page .bt-panel {
background:#fff;
border:1px solid #dfe8f1;
border-radius:14px;
box-shadow:0 5px 20px rgba(22,53,82,.045);
}
.qe-backtest-page .bt-config-card {
overflow:hidden;
}
.qe-backtest-page .bt-section-head {
display:flex;
justify-content:space-between;
align-items:flex-start;
gap:20px;
padding:20px 22px 17px;
border-bottom:1px solid #edf2f6;
}
.qe-backtest-page .bt-section-head h2,
.qe-backtest-page .bt-results-head h2 {
margin:4px 0 0;
font-size:17px;
color:#173657;
letter-spacing:-.02em;
}
.qe-backtest-page .bt-section-head p {
margin:5px 0 0;
font-size:11px;
color:#8292a5;
}
.qe-backtest-page .bt-source-pill {
padding:6px 9px;
border:1px solid #dbe8f5;
border-radius:7px;
background:#f5f9fd;
color:#52789e;
font-size:9px;
font-weight:800;
letter-spacing:.07em;
}
.qe-backtest-page .bt-config-grid {
display:grid;
grid-template-columns:1.35fr 1.25fr repeat(4,1fr);
gap:0;
padding:0;
}
.qe-backtest-page .bt-period-panel,
.qe-backtest-page .bt-capital-panel,
.qe-backtest-page .bt-metric-panel {
min-width:0;
min-height:112px;
padding:17px 18px;
border-right:1px solid #edf2f6;
box-sizing:border-box;
}
.qe-backtest-page .bt-config-grid > :last-child {
border-right:0;
}
.qe-backtest-page .bt-period-panel,
.qe-backtest-page .bt-metric-panel {
display:flex;
flex-direction:column;
justify-content:center;
}
.qe-backtest-page .bt-period-panel b {
display:block;
margin-top:9px;
color:#173657;
font-size:15px;
line-height:1.3;
word-break:break-word;
}
.qe-backtest-page .bt-period-panel small,
.qe-backtest-page .bt-capital-panel small,
.qe-backtest-page .bt-metric-panel small {
margin-top:6px;
color:#94a2b2;
font-size:9px;
line-height:1.35;
}
.qe-backtest-page .bt-capital-panel {
cursor:default;
}
.qe-backtest-page .bt-input-wrap {
display:flex;
align-items:center;
margin-top:8px;
height:40px;
border:1px solid #cfdce8;
border-radius:9px;
background:#fff;
overflow:hidden;
transition:border-color .15s, box-shadow .15s;
}
.qe-backtest-page .bt-input-wrap:focus-within {
border-color:#78a9dc;
box-shadow:0 0 0 3px rgba(48,118,191,.09);
}
.qe-backtest-page .bt-input-wrap > span {
padding-left:12px;
color:#6c8097;
font-size:13px;
font-weight:700;
}
.qe-backtest-page .bt-input-wrap input {
width:100%;
height:100%;
margin:0;
padding:0 11px 0 6px;
border:0;
outline:0;
background:transparent;
color:#172f4a;
font-size:14px;
font-weight:750;
}
.qe-backtest-page .bt-metric-panel b {
margin-top:8px;
color:#173657;
font-size:17px;
letter-spacing:-.02em;
}
.qe-backtest-page .bt-action-row {
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
min-height:68px;
padding:13px 18px;
border-top:1px solid #edf2f6;
background:#fbfcfe;
}
.qe-backtest-page .bt-action-note {
display:flex;
align-items:center;
gap:8px;
color:#8798aa;
font-size:11px;
}
.qe-backtest-page .bt-action-note span:first-child {
color:#1aa06b;
font-size:9px;
}
.qe-backtest-page .bt-run-btn {
min-width:174px;
height:42px;
padding:0 18px;
border:0;
border-radius:9px;
background:#10223a;
color:#fff;
font-size:12px;
font-weight:800;
letter-spacing:.01em;
cursor:pointer;
box-shadow:0 5px 12px rgba(16,34,58,.13);
transition:transform .12s, background .12s, opacity .12s;
}
.qe-backtest-page .bt-run-btn span {
margin-left:8px;
opacity:.65;
}
.qe-backtest-page .bt-run-btn:hover {
background:#173657;
transform:translateY(-1px);
}
.qe-backtest-page .bt-run-btn:disabled {
background:#7e8792;
opacity:1;
cursor:wait;
transform:none;
}
.qe-backtest-page .bt-msg {
min-height:0;
margin:0;
padding:0 18px;
font-size:11px;
}
.qe-backtest-page .bt-results-head {
display:flex;
justify-content:space-between;
align-items:flex-end;
margin:28px 1px 12px;
}
.qe-backtest-page .bt-results-meta {
color:#8797a9;
font-size:11px;
}
.qe-backtest-page .bt-kpis {
display:grid;
grid-template-columns:repeat(4,1fr);
gap:12px;
}
.qe-backtest-page .bt-kpi {
min-height:100px;
padding:16px 18px;
background:#fff;
border:1px solid #dfe8f1;
border-radius:12px;
box-shadow:0 4px 16px rgba(22,53,82,.035);
box-sizing:border-box;
}
.qe-backtest-page .bt-kpi b {
display:block;
margin-top:9px;
color:#173657;
font-size:24px;
line-height:1;
letter-spacing:-.035em;
}
.qe-backtest-page .bt-kpi small {
display:block;
margin-top:9px;
color:#8a9aab;
font-size:10px;
}
.qe-backtest-page .bt-analysis-grid {
display:grid;
grid-template-columns:minmax(0,2.15fr) minmax(290px,.85fr);
gap:12px;
margin-top:12px;
}
.qe-backtest-page .bt-panel {
min-width:0;
overflow:hidden;
}
.qe-backtest-page .bt-panel-head {
display:flex;
justify-content:space-between;
align-items:flex-start;
padding:17px 19px 13px;
border-bottom:1px solid #edf2f6;
}
.qe-backtest-page .bt-panel-head h3 {
margin:4px 0 0;
color:#173657;
font-size:15px;
letter-spacing:-.015em;
}
.qe-backtest-page .bt-mini-label {
padding-top:3px;
color:#91a0b0;
font-size:9px;
font-weight:750;
letter-spacing:.06em;
}
.qe-backtest-page .bt-chart-shell {
height:310px;
padding:12px 15px 16px;
box-sizing:border-box;
}
.qe-backtest-page .bt-equity-panel svg {
width:100%;
height:100%;
color:#173657;
}
.qe-backtest-page .bt-stat-list {
padding:5px 19px 12px;
}
.qe-backtest-page .bt-stat-row {
display:flex;
align-items:center;
justify-content:space-between;
gap:14px;
min-height:47px;
border-bottom:1px solid #edf2f6;
}
.qe-backtest-page .bt-stat-row:last-child {
border-bottom:0;
}
.qe-backtest-page .bt-stat-row span {
color:#8091a4;
font-size:11px;
}
.qe-backtest-page .bt-stat-row b {
color:#173657;
font-size:12px;
text-align:right;
}
.qe-backtest-page .bt-trades-panel {
margin-top:12px;
}
.qe-backtest-page .bt-trades-head {
align-items:center;
}
.qe-backtest-page .bt-trade-count {
display:block;
margin-top:4px;
color:#8b9aaa;
font-size:10px;
}
.qe-backtest-page .bt-download-btn {
height:36px;
padding:0 13px;
border:1px solid #d7e2ec;
border-radius:8px;
background:#fff;
color:#365675;
font-size:10px;
font-weight:750;
cursor:pointer;
}
.qe-backtest-page .bt-download-btn:not(:disabled):hover {
background:#f6f9fd;
border-color:#b9cede;
}
.qe-backtest-page .bt-download-btn:disabled {
color:#a6b2be;
background:#f7f9fb;
cursor:not-allowed;
}
.qe-backtest-page .bt-table-wrap {
overflow:auto;
}
.qe-backtest-page .bt-trades-panel table {
min-width:1100px;
width:100%;
border-collapse:separate;
border-spacing:0;
}
.qe-backtest-page .bt-trades-panel th {
position:sticky;
top:0;
z-index:1;
padding:10px 11px;
border-bottom:1px solid #dfe8f1;
background:#f8fafc;
color:#718399;
font-size:9px;
font-weight:800;
letter-spacing:.07em;
text-align:left;
text-transform:uppercase;
white-space:nowrap;
}
.qe-backtest-page .bt-trades-panel td {
padding:11px;
border-bottom:1px solid #eef2f5;
color:#3f5267;
font-size:10px;
white-space:nowrap;
}
.qe-backtest-page .bt-trades-panel tbody tr:hover td {
background:#f9fbfd;
}
.qe-backtest-page .bt-trades-panel .empty {
padding:38px 20px;
color:#94a1ae;
text-align:center;
}
.qe-backtest-page .bt-min-capital {
margin:0 18px 12px;
}
@media (max-width:1250px) {
.qe-backtest-page .bt-config-grid {
grid-template-columns:repeat(3,1fr);
}
.qe-backtest-page .bt-period-panel,
.qe-backtest-page .bt-capital-panel,
.qe-backtest-page .bt-metric-panel {
border-right:1px solid #edf2f6;
border-bottom:1px solid #edf2f6;
}
.qe-backtest-page .bt-config-grid > :nth-child(3n) {
border-right:0;
}
.qe-backtest-page .bt-config-grid > :nth-child(n+4) {
border-bottom:0;
}
}
@media (max-width:900px) {
.qe-backtest-page .bt-hero {
align-items:flex-start;
}
.qe-backtest-page .bt-kpis {
grid-template-columns:repeat(2,1fr);
}
.qe-backtest-page .bt-analysis-grid {
grid-template-columns:1fr;
}
}
@media (max-width:700px) {
.qe-backtest-page .bt-hero {
display:block;
}
.qe-backtest-page .bt-hero-badge {
display:inline-block;
margin-top:14px;
}
.qe-backtest-page .bt-config-grid {
grid-template-columns:1fr;
}
.qe-backtest-page .bt-period-panel,
.qe-backtest-page .bt-capital-panel,
.qe-backtest-page .bt-metric-panel,
.qe-backtest-page .bt-config-grid > :nth-child(3n) {
border-right:0;
border-bottom:1px solid #edf2f6;
}
.qe-backtest-page .bt-config-grid > :last-child {
border-bottom:0;
}
.qe-backtest-page .bt-action-row {
display:block;
padding:13px 16px 15px;
}
.qe-backtest-page .bt-action-note {
margin-bottom:10px;
}
.qe-backtest-page .bt-run-btn {
width:100%;
}
.qe-backtest-page .bt-kpis {
grid-template-columns:1fr 1fr;
}
}
@media (max-width:480px) {
.qe-backtest-page .bt-kpis {
grid-template-columns:1fr;
}
.qe-backtest-page .bt-results-head {
display:block;
}
.qe-backtest-page .bt-results-meta {
display:block;
margin-top:6px;
}
.qe-backtest-page .bt-panel-head {
padding-left:15px;
padding-right:15px;
}
}
/* navigation performance v17 */
.qe-navigating::before {
content:"";
position:fixed;
top:0;
left:0;
right:0;
height:2px;
z-index:99999;
background:#1b74c8;
transform-origin:left center;
animation:qe-nav-progress .8s ease-out infinite alternate;
}
@keyframes qe-nav-progress {
from { transform:scaleX(.12); opacity:.55; }
to { transform:scaleX(.72); opacity:1; }
}
/* =========================================================
Quant Edge master shell refresh — v19
Presentation-only: compact header + structured sidebar.
========================================================= */
.qe .sidebar {
width: 232px;
background: #fbfcfe;
border-right: 1px solid #e3eaf2;
}
.qe .brand {
height: 62px;
padding: 0 17px;
border-bottom: 1px solid #e6edf4;
}
.qe .brand-lockup {
display: inline-flex;
align-items: center;
gap: 9px;
text-decoration: none;
color: #15395e;
}
.qe .brand-mark {
width: 31px;
height: 31px;
display: block;
flex: 0 0 31px;
}
.qe .brand-wordmark {
display: inline-flex;
gap: 4px;
align-items: baseline;
font-size: 13px;
letter-spacing: .85px;
line-height: 1;
}
.qe .brand-wordmark strong { font-weight: 800; }
.qe .brand-wordmark b { color: #1976e8; font-weight: 800; }
.qe .qe-sidebar-nav { padding: 16px 10px 70px; }
.qe .nav-section-label {
padding: 0 11px;
margin: 0 0 7px;
color: #8b9db1;
font-size: 8px;
font-weight: 800;
letter-spacing: 1.35px;
}
.qe .nav-section-gap { margin-top: 19px; }
.qe .nav {
height: 38px;
gap: 11px;
padding: 0 11px;
border-radius: 8px;
color: #36526f;
}
.qe .nav-icon {
width: 18px;
height: 18px;
display: grid;
place-items: center;
color: #71879e;
font-size: 14px;
font-weight: 600;
}
.qe .nav b { font-size: 11px; font-weight: 700; }
.qe .nav:hover { background: #f0f5fa; }
.qe .nav.active {
background: #eaf3fe;
color: #1269cf;
box-shadow: none;
}
.qe .nav.active .nav-icon { color: #1976e8; }
.qe .strategy-instrument {
min-height: 48px;
display: flex;
align-items: center;
gap: 9px;
margin: 0 2px;
padding: 7px 9px;
border: 1px solid #e3eaf2;
border-radius: 9px;
background: #fff;
}
.qe .instrument-icon {
width: 25px;
height: 25px;
border-radius: 7px;
display: grid;
place-items: center;
background: #edf5ff;
color: #1976e8;
font-size: 12px;
}
.qe .instrument-copy { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.qe .instrument-copy b { color: #244563; font-size: 10px; letter-spacing: .45px; }
.qe .instrument-copy small { color: #8a9bae; font-size: 8px; }
.qe .instrument-live {
margin-left: auto;
display: inline-flex;
align-items: center;
gap: 4px;
color: #168c69;
font-size: 7px;
font-weight: 800;
letter-spacing: .5px;
}
.qe .instrument-live i,
.qe .sidebar-footer-dot {
width: 6px; height: 6px; border-radius: 50%; background: #18b981;
}
.qe .sidebar-footer {
position: absolute;
left: 12px; right: 12px; bottom: 14px;
display: flex; align-items: center; gap: 7px;
padding: 9px 10px;
border: 1px solid #e5ecf3;
border-radius: 8px;
background: #f8fafc;
color: #7b8ea3;
font-size: 8px;
}
.qe .main { margin-left: 232px; width: calc(100% - 232px); }
.qe .topbar {
height: 60px;
padding: 0 22px;
border-bottom-color: #e5ebf2;
}
.qe .top-right { gap: 12px; min-height: 32px; }
.qe .market-live { gap: 6px; font-size: 9px; letter-spacing: .2px; }
.qe .market-live i { width: 6px; height: 6px; background: #c7d1dc; box-shadow: none; }
.qe .market-live i.is-live { background: #13b982; }
.qe .market-live i.is-auth { background: #f0a33a; }
.qe .date { font-size: 9px; }
.qe .qe-account-menu { margin-left: 4px; }
.qe .qe-account-trigger {
height: 32px;
min-width: 32px;
padding: 2px 5px 2px 2px;
gap: 4px;
border-radius: 9px;
background: #fff;
border-color: #e1e8ef;
}
.qe .qe-account-avatar { width: 26px; height: 26px; flex-basis: 26px; font-size: 11px; }
.qe .qe-account-chevron { width: 13px; height: 13px; }
.qe .qe-account-dropdown { top: calc(100% + 7px); width: 230px; border-radius: 11px; }
/* Login uses the same mark as the application shell. */
.qe-brand-mark-img {
width: 34px;
height: 34px;
display: block;
flex: 0 0 34px;
}
.qe-mobile-brand .qe-brand-mark-img { width: 31px; height: 31px; flex-basis: 31px; }
/* Keep the old mobile shell but adapt the refreshed sidebar width. */
@media (max-width: 900px) {
.qe .sidebar { width: 210px; }
.qe .main { margin-left: 210px; width: calc(100% - 210px); }
}
@media (max-width: 650px) {
.qe .sidebar { width: 240px; }
.qe .main { margin-left: 0; width: 100%; }
.qe .topbar { height: 56px; padding: 0 13px; }
}
/* SILVERMIC paper-engine styling */
.silver-hero{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:18px}.silver-hero h1{margin:4px 0 8px;font-size:34px;letter-spacing:-.04em}.silver-hero p{max-width:760px}.paper-badge{display:inline-flex;align-items:center;gap:9px;border:1px solid #dce5ee;border-radius:999px;padding:9px 13px;background:#fff;font-size:11px;font-weight:800;letter-spacing:.08em;color:#65778a;white-space:nowrap}.paper-badge i,.paper-dot{width:8px;height:8px;border-radius:50%;background:#c3cfdb;display:inline-block}.paper-badge i.active,.paper-dot.active{background:#10b77a;box-shadow:0 0 0 4px rgba(16,183,122,.10)}.silver-grid,.silver-two-col{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}.silver-price,.paper-control,.levels-card,.position-card,.pending-card,.executions-card{padding:20px}.silver-ltp{font-size:38px;font-weight:800;letter-spacing:-.04em;margin-top:8px}.silver-meta{font-size:12px;color:#75879a;margin-top:4px}.paper-control .card-top,.levels-card>header,.position-card>header,.pending-card>header,.executions-card>header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.paper-control h2,.position-card h2,.pending-card h2,.executions-card h2,.levels-card h2{margin:4px 0 0;font-size:18px}.paper-control p{color:#738497;font-size:13px;line-height:1.55;margin:12px 0 16px}.paper-actions{display:flex;gap:8px}.secondary-btn{border:1px solid #dce5ee;background:#fff;border-radius:9px;padding:9px 13px;font-weight:700;color:#53667a;cursor:pointer}.secondary-btn:disabled{opacity:.45;cursor:not-allowed}.danger-btn{color:#9a4d4d}.levels-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:16px}.levels-grid>div,.position-grid>div{border:1px solid #e4ebf2;border-radius:10px;padding:12px;background:#fbfcfe}.levels-grid small,.position-grid small{display:block;color:#8091a2;font-size:9px;font-weight:800;letter-spacing:.09em;margin-bottom:6px}.levels-grid b,.position-grid b{font-size:14px}.buy-level{border-left:3px solid #10b77a!important}.sell-level{border-left:3px solid #e47d7d!important}.status-pill{font-size:10px;font-weight:800;letter-spacing:.07em;padding:6px 9px;border-radius:999px;background:#f1f5f8;color:#687a8c}.position-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:16px}.pending-list{margin-top:16px;display:grid;gap:8px}.pending-list>div{display:grid;grid-template-columns:60px 1fr auto;gap:10px;align-items:center;border:1px solid #e4ebf2;border-radius:9px;padding:10px;font-size:12px}.pending-list span{color:#7a8b9d}.pending-list strong{font-size:12px}.executions-card{margin-bottom:20px}.nav-silvermic.active{background:#edf5fb;color:#1768ad}.nav-silvermic .nav-icon{font-size:13px}
@media(max-width:900px){.silver-hero{align-items:flex-start;flex-direction:column}.silver-grid,.silver-two-col{grid-template-columns:1fr}.levels-grid{grid-template-columns:repeat(2,1fr)}}
/* SILVERMIC paper-engine themed dialogs/toasts */
.qe-modal-backdrop{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(7,27,50,.34);backdrop-filter:blur(3px)}
.qe-modal{width:min(440px,calc(100vw - 32px));background:#fff;border:1px solid #dce6f0;border-radius:18px;box-shadow:0 24px 70px rgba(15,45,75,.22);padding:22px}
.qe-modal-icon{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;font-weight:800;font-size:17px;background:#eaf4ff;color:#1b74c8;float:left;margin-right:12px}
.qe-modal-icon.danger{background:#fff0f0;color:#c53b45}
.qe-modal-copy{min-height:46px}.qe-modal-copy h3{margin:1px 0 5px;color:#102f50;font-size:16px}.qe-modal-copy p{margin:0;color:#60758a;font-size:13px;line-height:1.55}.qe-modal-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:20px}.qe-modal-actions button{font:inherit;cursor:pointer}
.qe-modal-actions .danger-btn{color:#c53b45;border-color:#f0cfd2}.qe-toast{position:fixed;right:24px;bottom:24px;z-index:100001;background:#fff;border:1px solid #dce6f0;border-radius:12px;box-shadow:0 12px 35px rgba(15,45,75,.16);padding:11px 15px;color:#23435f;font-size:13px;opacity:0;transform:translateY(8px);transition:opacity .18s,transform .18s}.qe-toast.show{opacity:1;transform:translateY(0)}.qe-toast.success{border-left:3px solid #10a875}.qe-toast.info{border-left:3px solid #1b74c8}.qe-toast.danger{border-left:3px solid #c53b45}
@media(max-width:640px){.qe-modal-backdrop{padding:16px}.qe-modal{border-radius:15px;padding:18px}.qe-modal-actions{flex-direction:column-reverse}.qe-modal-actions button{width:100%}.qe-toast{left:16px;right:16px;bottom:16px;text-align:center}}
/* v23 compact SILVERMIC strategy navigation */
.strategy-group{width:100%}.strategy-toggle{width:100%;min-height:54px;border:1px solid #dfe8f1;background:#fff;border-radius:11px;display:flex;align-items:center;gap:11px;padding:7px 10px;cursor:pointer;text-align:left;color:#183657;box-shadow:none}.strategy-toggle:hover{background:#f7fbff;border-color:#d6e4f1}.strategy-toggle.open{background:#f7fbff;border-color:#cfe0ef}.strategy-toggle .instrument-icon{width:31px;height:31px;border-radius:8px;background:#edf5ff;color:#1679ef;display:grid;place-items:center;font-size:13px;flex:0 0 31px}.strategy-toggle .instrument-copy{display:flex;flex-direction:column;min-width:0}.strategy-toggle .instrument-copy b{font-size:11px;line-height:1.2}.strategy-toggle .instrument-copy small{font-size:8px;color:#8196ab;margin-top:3px}.strategy-chevron{margin-left:auto;color:#66829f;font-size:16px;line-height:1}.strategy-children{overflow:hidden;max-height:120px;padding:5px 0 0 8px;transition:max-height .16s ease,opacity .16s ease}.strategy-children.collapsed{max-height:0;padding-top:0;opacity:0}.nav-child{height:36px;padding-left:16px;border-radius:8px;gap:11px}.nav-child .nav-icon{font-size:11px}.nav-child b{font-size:11px}.nav-child.active{background:#eaf3ff;color:#116bd0;box-shadow:none}.nav-child.active .nav-icon{color:#116bd0}
.replay-card{padding:20px;margin-bottom:16px}.replay-card>header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.replay-help{margin:7px 0 0;color:#738497;font-size:13px;line-height:1.5;max-width:760px}.replay-controls{display:grid;grid-template-columns:190px 150px 1fr;gap:12px;align-items:end;margin-top:16px}.replay-controls label{font-size:11px;font-weight:800;color:#64788c;letter-spacing:.05em}.replay-controls input,.replay-controls select{display:block;width:100%;box-sizing:border-box;margin-top:7px;border:1px solid #dce5ee;border-radius:9px;background:#fff;padding:10px 11px;color:#163653;font:inherit;font-size:13px}.replay-actions{display:flex;gap:8px;justify-content:flex-end}.replay-progress{margin-top:15px;border-top:1px solid #e8eef4;padding-top:13px}.replay-progress>div:first-child{display:flex;justify-content:space-between;color:#718498;font-size:11px}.replay-progress strong{color:#173754;font-size:12px}.replay-track{height:6px;background:#eef3f7;border-radius:99px;overflow:hidden;margin-top:8px}.replay-track i{display:block;height:100%;width:0;background:#1b74c8;border-radius:99px;transition:width .12s linear}@media(max-width:760px){.replay-controls{grid-template-columns:1fr 1fr}.replay-actions{grid-column:1/-1;justify-content:flex-start}}@media(max-width:480px){.replay-controls{grid-template-columns:1fr}.replay-actions{grid-column:auto;flex-wrap:wrap}.replay-actions button{flex:1}}
.replay-error{margin-top:10px;padding:9px 11px;border:1px solid #f2c7c7;border-radius:9px;background:#fff6f6;color:#a33b3b;font-size:12px;font-weight:700}
.replay-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}.replay-summary>div{border:1px solid #e0e8f0;border-radius:9px;background:#fbfcfe;padding:10px 11px}.replay-summary small{display:block;color:#718498;font-size:9px;font-weight:800;letter-spacing:.08em}.replay-summary b{display:block;margin-top:5px;color:#173754;font-size:13px}.replay-log-wrap{margin-top:12px;border-top:1px solid #e8eef4;padding-top:12px}.replay-log-head{display:flex;justify-content:space-between;gap:10px;color:#718498;font-size:10px;font-weight:800;letter-spacing:.06em}.replay-log{margin-top:7px;border:1px solid #e0e8f0;border-radius:9px;overflow:hidden;background:#fff}.replay-log-row{display:grid;grid-template-columns:1.6fr .55fr .8fr 1fr .65fr 1.1fr 1fr;gap:8px;align-items:center;padding:9px 10px;border-bottom:1px solid #edf1f5;font-size:11px;color:#60758a}.replay-log-row:last-child{border-bottom:0}.replay-log-row b{color:#173754}.replay-log-row strong{color:#173754;text-align:right}.replay-log-row em{font-style:normal;color:#718498}.replay-log-empty{padding:14px;text-align:center;color:#8a9aac;font-size:11px}@media(max-width:760px){.replay-summary{grid-template-columns:1fr}.replay-log{overflow-x:auto}.replay-log-row{min-width:680px}}
/* Quant Edge Orders page v33 */
.orders-readonly-badge{
display:inline-flex;align-items:center;gap:8px;padding:10px 13px;border:1px solid #dce6ef;
border-radius:999px;background:#fff;color:#60758a;font-size:10px;font-weight:800;letter-spacing:.07em;
white-space:nowrap;
}
.orders-readonly-badge i{width:8px;height:8px;border-radius:50%;background:#c3cfdb;display:inline-block}
.orders-readonly-badge.enabled i{background:#10b77a;box-shadow:0 0 0 4px rgba(16,183,122,.10)}
.broker-status-card{padding:20px}
.broker-status-card .card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.broker-status-card h2{margin:4px 0 0;font-size:18px}
.broker-status-card p{color:#738497;font-size:13px;line-height:1.55;margin:12px 0 14px}
.orders-status-row{display:flex;flex-wrap:wrap;gap:8px}
.orders-section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin:22px 0 10px}
.orders-section-heading h2{margin:4px 0 0;font-size:20px;color:#102f50}
.orders-live-grid{margin-bottom:16px}
.orders-position-grid{grid-template-columns:repeat(3,1fr)}
.live-order-row{
border:1px solid #e4ebf2;border-radius:10px;padding:11px 12px;background:#fbfcfe;
}
.live-order-main{display:flex;align-items:center;justify-content:space-between;gap:10px}
.live-order-main strong{font-size:12px;color:#173657}
.live-order-main span{font-size:11px;color:#71869b}
.live-order-meta{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px;color:#647b92;font-size:10px}
.live-order-row small{display:block;margin-top:7px;color:#91a0ae;font-size:9px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.order-empty{border:1px dashed #dce6ef;border-radius:10px;padding:18px;text-align:center;color:#8294a7;font-size:12px;background:#fbfcfe}
.orders-history-card{margin-bottom:20px}
.orders-table-wrap{overflow-x:auto}
.orders-table-wrap table{min-width:1050px}
.order-status{
display:inline-block;padding:5px 7px;border-radius:999px;background:#f1f5f8;color:#65788b;
font-size:9px;font-weight:800;letter-spacing:.05em;white-space:nowrap
}
.order-status.complete,.order-status.filled{background:#eaf8f2;color:#087e55}
.order-status.cancelled,.order-status.rejected{background:#fff0f0;color:#b33d46}
.order-status.open,.order-status.trigger-pending,.order-status.open-pending{background:#edf5ff;color:#1768ad}
@media(max-width:900px){
.orders-section-heading{align-items:flex-start;flex-direction:column}
.orders-position-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
.orders-position-grid{grid-template-columns:1fr}
.orders-readonly-badge{font-size:9px}
}
/* Orders page v2: broker-focused SILVERMIC view */
.orders-position-card{padding:20px;margin-bottom:16px}.orders-working-card{padding:16px;margin-bottom:16px}.orders-table-wrap table{min-width:900px}.orders-table-wrap th,.orders-table-wrap td{white-space:nowrap}.order-side{font-weight:800;font-size:10px;letter-spacing:.04em}.order-side.buy{color:#087e55}.order-side.sell{color:#b33d46}.order-id{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px;color:#75879a}.live-order-row{background:#fff}.live-order-main strong{font-size:12px}.live-order-meta{font-size:10px}.orders-history-card{margin-bottom:20px}
.trade-pnl{font-weight:800;font-variant-numeric:tabular-nums}.trade-pnl.profit{color:#087e55}.trade-pnl.loss{color:#b33d46}.orders-table-wrap table{min-width:980px}
/* Orders execution history filters */
.orders-filter-card{padding:16px 18px;margin-bottom:18px}
.orders-filter-top{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:12px}
.orders-filter-top p{margin:4px 0 0;color:#738497;font-size:12px}
.filter-range-label{font-size:11px;font-weight:800;color:#647b92;white-space:nowrap}
.period-buttons{display:flex;flex-wrap:wrap;gap:7px;align-items:center}.filter-apply-btn{padding:8px 16px;margin-left:2px;cursor:pointer;box-shadow:none;min-width:88px;display:inline-flex;align-items:center;justify-content:center;gap:7px;transition:opacity .15s ease,transform .15s ease}.filter-apply-btn:hover:not(:disabled){transform:translateY(-1px)}.filter-apply-btn:disabled{cursor:wait;opacity:.72}.filter-apply-btn.is-loading{pointer-events:none}
.period-btn{border:1px solid #dce5ee;background:#fff;color:#5f7489;border-radius:8px;padding:8px 12px;font-size:11px;font-weight:800;cursor:pointer}
.period-btn:hover{border-color:#b9cad9;background:#f8fbfd}
.period-btn.active{border-color:#1768ad;background:#edf5fb;color:#1768ad}
.custom-date-row{display:flex;align-items:flex-end;gap:10px;margin-top:12px;padding-top:12px;border-top:1px solid #e7edf3}
.custom-date-row[hidden]{display:none!important}
.history-filter-message{margin-top:10px;padding:9px 11px;border:1px solid #e6c9c9;border-radius:8px;background:#fff7f7;color:#a23a3a;font-size:11px;font-weight:700}
.history-filter-message.success{border-color:#c7e3d0;background:#f4fbf6;color:#287548}.filter-spinner,.table-spinner{display:inline-block;width:12px;height:12px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:qe-spin .7s linear infinite}.table-spinner{width:15px;height:15px;vertical-align:-3px;margin-right:8px}@keyframes qe-spin{to{transform:rotate(360deg)}}.history-loading{text-align:center!important;padding:34px 12px!important;color:#66809a;font-weight:700}
.history-filter-message[hidden]{display:none!important}
.custom-date-row label{display:grid;gap:5px;color:#71869b;font-size:10px;font-weight:800;letter-spacing:.05em}
.custom-date-row input{border:1px solid #dce5ee;border-radius:8px;background:#fff;padding:8px 10px;color:#203b55;font:inherit;font-size:12px}
.custom-date-row .primary-btn{border:0;border-radius:8px;background:#1768ad;color:#fff;padding:9px 14px;font-size:11px;font-weight:800;cursor:pointer}
.execution-summary{display:flex;align-items:center;gap:12px}
.execution-total-pnl{font-size:11px;font-weight:800;color:#647b92;white-space:nowrap}
.execution-total-pnl.profit{color:#087e55}.execution-total-pnl.loss{color:#b33d46}
.orders-table-wrap table{min-width:1120px}
@media(max-width:560px){
.orders-filter-top{align-items:flex-start;flex-direction:column;gap:6px}
.execution-summary{align-items:flex-start;flex-direction:column;gap:3px}
.custom-date-row{align-items:stretch;flex-direction:column}
.custom-date-row .primary-btn{align-self:flex-start}
}