:root{
    --bg:#0b0c0e; --panel:#151719; --panel-2:#1c1f22; --border:#2a2d31;
    --text:#eceef0; --text-dim:#9aa0a6; --accent:#c7cdd4; --accent-text:#0b0c0e;
    --metal1:#2b2e33; --metal2:#050506;
    --green:#3ecf8e; --red:#e5534b; --font:'Segoe UI',system-ui,-apple-system,Arial,sans-serif;
    --topbar-text:#eceef0; --topbar-text-dim:#9aa0a6; --topbar-border:#2a2d31;
  }
  :root[data-theme="light"]{
    --bg:#f4f5f7; --panel:#ffffff; --panel-2:#eef0f3; --border:#dde1e6;
    --text:#14171a; --text-dim:#5b6169; --accent:#1c2331; --accent-text:#ffffff;
    --green:#159163; --red:#d6453f;
  }
  *{box-sizing:border-box;}
  body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);transition:background .15s ease,color .15s ease;}
  .topbar{display:flex;align-items:center;justify-content:space-between;padding:8px 24px;background:linear-gradient(180deg,var(--metal1),var(--metal2));border-bottom:1px solid var(--topbar-border);}
  .brand{display:flex;align-items:center;gap:10px;}
  .logo-wrap{position:relative;display:inline-flex;line-height:0;}
  .logo-img{
    height:52px;width:auto;display:block;
    filter: saturate(1.55) brightness(1.24) contrast(1.14);
  }
  .logo-shine{
    position:absolute;inset:0;pointer-events:none;
    background-image:linear-gradient(115deg,transparent 0%,transparent 40%,rgba(255,255,255,.95) 50%,transparent 60%,transparent 100%);
    background-size:300% 100%;background-position:-120% 0;background-repeat:no-repeat;
    mix-blend-mode:screen;
    -webkit-mask-image:url('alphastrike_logo_v2.png');mask-image:url('alphastrike_logo_v2.png');
    -webkit-mask-size:100% 100%;mask-size:100% 100%;
    -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
    -webkit-mask-mode:alpha;mask-mode:alpha;
    clip-path:inset(14% 0% 40% 22%);
    animation:logoShineSweep 3.2s ease-in-out infinite;
  }
  @keyframes logoShineSweep{
    0%{background-position:-120% 0;}
    42%{background-position:120% 0;}
    100%{background-position:120% 0;}
  }
  nav{display:flex;gap:20px;align-items:center;}
  nav .settings-link{padding-right:24px;margin-right:4px;border-right:1px solid var(--topbar-border);}
  nav a{color:var(--topbar-text-dim);text-decoration:none;font-size:13px;letter-spacing:.5px;display:flex;align-items:center;gap:6px;cursor:pointer;}
  nav a.active{color:var(--topbar-text);font-weight:600;}
  nav a:hover{color:var(--topbar-text);}
  .theme-toggle{
    display:flex;align-items:center;gap:6px;margin-left:16px;padding:6px 12px;
    background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);border-radius:20px;
    color:var(--topbar-text);font-size:11px;letter-spacing:.5px;font-family:inherit;cursor:pointer;
    transition:background .15s ease,border-color .15s ease;
  }
  .theme-toggle:hover{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.35);}
  .wrap{max-width:1800px;width:96%;margin:0 auto;padding:24px;}
  .section-title{font-size:12px;letter-spacing:1px;color:var(--text-dim);margin:0 0 12px;font-weight:600;}
  .symbol-badge{margin-left:12px;font-size:20px;font-weight:800;letter-spacing:.5px;background:linear-gradient(90deg,#ff8a1e,#ffd23f);-webkit-background-clip:text;background-clip:text;color:transparent;vertical-align:middle;}
  .symbol-badge:empty{display:none;}
  .cards{display:grid;grid-template-columns:repeat(7,1fr);gap:12px;margin-bottom:20px;}
  .card{background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:14px;text-align:center;}
  .card .val{font-size:20px;font-weight:700;margin-top:6px;}
  .card .lbl{font-size:11px;color:var(--text-dim);letter-spacing:.5px;}
  .pos{color:var(--green);} .neg{color:var(--red);}
  .charts{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px;}
  .panel{background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:16px;}
  .panel h3{margin:0 0 12px;font-size:13px;color:var(--text-dim);font-weight:600;letter-spacing:.5px;}
  .chart-h{position:relative;height:220px;cursor:zoom-in;}
  .chart-zoom-overlay{position:fixed;inset:0;z-index:99999;background:rgba(0,0,0,.93);display:none;flex-direction:column;padding:28px 40px 40px;}
  .chart-zoom-overlay.show{display:flex;}
  .chart-zoom-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;flex-shrink:0;}
  .chart-zoom-title{color:#eceef0;font-size:18px;font-weight:700;letter-spacing:.5px;}
  .chart-zoom-sub{color:#9aa0a6;font-size:12px;margin-top:4px;}
  .chart-zoom-close{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.25);color:#eceef0;width:40px;height:40px;border-radius:50%;font-size:22px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s ease,border-color .15s ease;}
  .chart-zoom-close:hover{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.4);}
  .chart-zoom-canvas-wrap{flex:1;position:relative;min-height:0;}
  .chart-zoom-hint{color:#5b6169;font-size:11px;text-align:center;margin-top:10px;flex-shrink:0;}
  .chart-zoom-heatmap-wrap{position:absolute;inset:0;overflow:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;}
  .chart-zoom-heatmap-wrap .heatmap-outer{display:flex;gap:10px;}
  .chart-zoom-heatmap-wrap .heatmap-daylabels{gap:6px;padding-top:28px;font-size:12px;}
  .chart-zoom-heatmap-wrap .heatmap-daylabels span{height:22px;line-height:22px;}
  .chart-zoom-heatmap-wrap .heatmap-weeks{gap:6px;}
  .chart-zoom-heatmap-wrap .heatmap-week{gap:6px;}
  .chart-zoom-heatmap-wrap .heatmap-month-lbl{height:22px;font-size:13px;}
  .chart-zoom-heatmap-wrap .heatmap-days{gap:6px;}
  .chart-zoom-heatmap-wrap .heatmap-cell{width:22px;height:22px;border-radius:5px;}
  .chart-zoom-heatmap-wrap .heatmap-legend{margin-top:0;font-size:13px;gap:6px;justify-content:center;}
  .chart-zoom-heatmap-wrap .heatmap-legend .heatmap-cell{width:16px;height:16px;}
  .leg-chart-h{padding:6px;}
  .heatmap-panel{grid-column:span 2;}
  .heatmap-panel .heatmap-outer{cursor:zoom-in;}
  .heatmap-outer{display:flex;gap:6px;}
  .heatmap-daylabels{display:flex;flex-direction:column;gap:3px;padding-top:17px;font-size:9px;color:var(--text-dim);flex:none;}
  .heatmap-daylabels span{height:13px;line-height:13px;}
  .heatmap-scroll{overflow-x:auto;padding-bottom:4px;}
  .heatmap-weeks{display:flex;gap:3px;}
  .heatmap-week{display:flex;flex-direction:column;gap:3px;flex:none;}
  .heatmap-month-lbl{height:13px;font-size:10px;color:var(--text-dim);letter-spacing:.5px;white-space:nowrap;}
  .heatmap-days{display:flex;flex-direction:column;gap:3px;}
  .heatmap-cell{width:13px;height:13px;border-radius:3px;background:var(--panel-2);border:1px solid var(--border);}
  .heatmap-legend{display:flex;align-items:center;gap:4px;margin-top:12px;font-size:10px;color:var(--text-dim);}
  .heatmap-legend .heatmap-cell{width:11px;height:11px;}
  .leg-corner{position:absolute;display:flex;align-items:center;gap:6px;font-size:11px;color:var(--text-dim);max-width:46%;}
  .leg-corner .dot{width:9px;height:9px;border-radius:50%;flex:none;}
  .leg-corner.tl{top:6px;left:6px;}
  .leg-corner.tr{top:6px;right:6px;flex-direction:row-reverse;text-align:right;}
  .leg-corner.bl{bottom:6px;left:6px;}
  .leg-corner.br{bottom:6px;right:6px;flex-direction:row-reverse;text-align:right;}
  table{width:100%;border-collapse:collapse;font-size:12px;}
  th{text-align:left;color:var(--text-dim);font-weight:600;padding:8px;border-bottom:1px solid var(--border);letter-spacing:.5px;}
  td{padding:8px;border-bottom:1px solid var(--border);}
  .leg-price{font-size:10.5px;color:var(--text-dim);margin-top:2px;white-space:nowrap;}
  .leg-pnl{font-size:10.5px;font-weight:600;margin-top:1px;white-space:nowrap;}
  .leg-pnl.pos{color:var(--green);}
  .leg-pnl.neg{color:var(--red);}
  .tag{padding:2px 8px;border-radius:4px;font-size:11px;font-weight:600;}
  .tag.target{background:rgba(62,207,142,.15);color:var(--green);}
  .tag.stoploss{background:rgba(229,83,75,.15);color:var(--red);}
  .tag.expiry{background:rgba(154,160,166,.15);color:var(--text-dim);}
  .tag.duration{background:rgba(154,160,166,.15);color:var(--text-dim);}
  .log-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;}
  .log-head input{background:var(--panel-2);border:1px solid var(--border);color:var(--text);padding:7px 10px;border-radius:6px;font-size:12px;width:200px;}
  .btn{background:var(--panel-2);border:1px solid var(--border);color:var(--text);padding:7px 12px;border-radius:6px;font-size:12px;cursor:pointer;}
  .btn:hover{border-color:var(--accent);}
  .pager{display:flex;justify-content:flex-end;align-items:center;gap:6px;margin-top:12px;font-size:12px;color:var(--text-dim);}
  .pager span{padding:4px 9px;border:1px solid var(--border);border-radius:4px;cursor:pointer;}
  .pager span.on{background:var(--panel-2);color:var(--text);}
  .pager span.dots{border:none;cursor:default;}
  .overlay{display:none;position:fixed;inset:0;background:var(--bg);z-index:50;overflow-y:auto;}
  .overlay.show{display:block;}
  .drawer{width:100%;max-width:1560px;margin:0 auto;min-height:100%;background:var(--bg);padding:24px 32px 70px;box-sizing:border-box;}
  .drawer h2{font-size:20px;margin:0 0 20px;display:flex;justify-content:space-between;align-items:center;letter-spacing:1px;}
  .drawer .close{cursor:pointer;color:var(--text-dim);font-size:22px;line-height:1;}

  .settings-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;align-items:start;}
  .settings-grid .span-2{grid-column:span 2;}
  .settings-grid .span-4{grid-column:1/-1;}
  .settings-cols{display:flex;gap:16px;align-items:flex-start;}
  .settings-cols .settings-col{display:flex;flex-direction:column;gap:16px;flex:1 1 0;min-width:0;}
  .settings-cols .settings-col.wide{flex:2 1 0;}
  .panel-card{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:16px;}
  .panel-card h4{font-size:11px;color:var(--text-dim);letter-spacing:1px;margin:0 0 14px;display:flex;align-items:center;gap:8px;text-transform:uppercase;}
  .panel-card h4 .num{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:var(--accent);color:var(--accent-text);font-size:10px;font-weight:700;flex-shrink:0;}
  .panel-card h4 .atm-tag{margin-left:auto;color:var(--accent);font-weight:700;letter-spacing:0;text-transform:none;}

  .strategy-gallery{display:flex;flex-direction:column;gap:3px;max-height:440px;overflow-y:auto;}
  .strategy-item{display:flex;align-items:center;gap:9px;padding:8px 9px;border-radius:6px;cursor:pointer;font-size:12px;color:var(--text-dim);border:1px solid transparent;background:transparent;text-align:left;width:100%;font-family:inherit;}
  .strategy-item:hover{background:var(--panel-2);color:var(--text);}
  .strategy-item.active{background:var(--panel-2);color:var(--text);border-color:var(--accent);font-weight:700;}
  .strategy-item .ico{font-size:13px;width:16px;text-align:center;flex-shrink:0;}

  .strike-ladder{width:100%;border-collapse:collapse;font-size:11px;margin-top:12px;}
  .strike-ladder th{color:var(--text-dim);font-weight:400;padding:4px 6px;text-align:center;border-bottom:1px solid var(--border);}
  .strike-ladder td{padding:3px 6px;text-align:center;border-bottom:1px solid var(--border);color:var(--text-dim);}
  .strike-ladder tr.atm-row td{color:var(--accent);font-weight:700;border-bottom:1px solid var(--accent);}
  .strike-ladder td.strike-col{color:var(--text);}
  .ladder-badge{display:inline-block;padding:1px 7px;border-radius:4px;font-size:10px;font-weight:700;}
  .ladder-badge.buy{background:rgba(60,170,120,.18);color:#3fcf8e;}
  .ladder-badge.sell{background:rgba(220,90,90,.18);color:#e2534b;}
  .ladder-note{font-size:10px;color:var(--text-dim);margin-top:8px;line-height:1.4;}

  .filter-row{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid var(--border);}
  .filter-row:last-child{border-bottom:none;}
  .filter-row .filter-label{font-size:12px;color:var(--text);}
  .filter-row .filter-sub{font-size:10px;color:var(--text-dim);margin-top:2px;line-height:1.4;max-width:230px;}
  .filter-row .filter-inputs{display:flex;align-items:center;gap:6px;flex-shrink:0;}
  .filter-row .filter-inputs input{width:52px;background:var(--panel-2);border:1px solid var(--border);color:var(--text);padding:5px 6px;border-radius:5px;font-size:11px;text-align:center;}
  .filter-row .filter-inputs select{background:var(--panel-2);border:1px solid var(--border);color:var(--text);padding:5px 6px;border-radius:5px;font-size:11px;}
  .filter-row.disabled .filter-label,.filter-row.disabled .filter-sub{color:var(--text-dim);}
  .filter-row.disabled .filter-inputs input,.filter-row.disabled .filter-inputs select{opacity:.45;pointer-events:none;}
  .filter-est-tag{display:inline-block;font-size:9px;letter-spacing:.5px;color:var(--text-dim);border:1px solid var(--border);border-radius:4px;padding:1px 5px;margin-left:6px;vertical-align:middle;}

  .toggle-switch{position:relative;display:inline-block;width:32px;height:18px;flex-shrink:0;}
  .toggle-switch input{opacity:0;width:0;height:0;position:absolute;}
  .toggle-switch .slider{position:absolute;inset:0;background:var(--panel-2);border:1px solid var(--border);border-radius:20px;cursor:pointer;transition:.15s;}
  .toggle-switch .slider:before{content:"";position:absolute;width:12px;height:12px;left:1px;top:1px;background:var(--text-dim);border-radius:50%;transition:.15s;}
  .toggle-switch input:checked + .slider{background:var(--accent);border-color:var(--accent);}
  .toggle-switch input:checked + .slider:before{transform:translateX(14px);background:var(--accent-text);}

  .summary-list{font-size:12px;}
  .summary-list .srow{display:flex;justify-content:space-between;padding:5px 0;border-bottom:1px solid var(--border);gap:10px;}
  .summary-list .srow:last-child{border-bottom:none;}
  .summary-list .srow .slabel{color:var(--text-dim);}
  .summary-list .srow .sval{color:var(--accent);font-weight:600;text-align:right;}
  .field-grp{margin-bottom:16px;}
  .field-grp label{display:block;font-size:11px;color:var(--text-dim);margin-bottom:6px;letter-spacing:.5px;}
  .field-grp input,.field-grp select{width:100%;background:var(--panel-2);border:1px solid var(--border);color:var(--text);padding:8px;border-radius:6px;font-size:13px;}
  .field-grp input[readonly]{color:var(--text-dim);cursor:not-allowed;background:var(--bg);}
  input[type="time"]::-webkit-calendar-picker-indicator,
  input[type="date"]::-webkit-calendar-picker-indicator{
    filter:invert(1) brightness(1.6);
    cursor:pointer;
  }
  :root[data-theme="light"] input[type="time"]::-webkit-calendar-picker-indicator,
  :root[data-theme="light"] input[type="date"]::-webkit-calendar-picker-indicator{
    filter:none;
  }
  .row2{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
  .segmented{position:relative;display:grid;grid-template-columns:repeat(5,1fr);background:var(--panel-2);border:1px solid var(--border);border-radius:8px;padding:3px;}
  .seg-highlight{position:absolute;top:3px;left:0;height:calc(100% - 6px);background:var(--accent);border-radius:6px;transition:transform .25s ease,width .25s ease;z-index:0;}
  .seg-btn{position:relative;z-index:1;background:transparent;border:none;color:var(--text-dim);font-size:10px;letter-spacing:.5px;padding:8px 4px;border-radius:6px;cursor:pointer;font-family:inherit;transition:color .2s ease;}
  .seg-btn.active{color:var(--accent-text);font-weight:700;}
  .seg-btn:hover:not(.active){color:var(--text);}
  .grp-title{font-size:11px;color:var(--accent);letter-spacing:1px;margin:18px 0 10px;border-bottom:1px solid var(--border);padding-bottom:6px;}
  .field-note{font-size:10px;color:var(--text-dim);margin:-6px 0 12px;line-height:1.4;}
  .run-btn{width:100%;background:var(--accent);color:var(--accent-text);border:none;padding:12px;border-radius:6px;font-weight:700;letter-spacing:.5px;cursor:pointer;margin-top:20px;transition:transform .08s ease,filter .08s ease,opacity .08s ease;}
  .run-btn:hover{filter:brightness(1.08);}
  .run-btn:active{transform:scale(.97);filter:brightness(.92);}
  .run-btn:disabled{opacity:.6;cursor:wait;}
  .run-status{font-size:11px;margin-top:10px;line-height:1.5;}
  .run-status.ok{color:var(--green);}
  .run-status.warn{color:#e5b93e;}
  .cards.flash .card{animation:cardFlash .6s ease;}
  @keyframes cardFlash{0%{box-shadow:0 0 0 2px var(--accent);}100%{box-shadow:0 0 0 0 rgba(0,0,0,0);}}

  .loading-screen{
    position:fixed; inset:0; z-index:9999;
    display:flex; align-items:center; justify-content:center;
    background:radial-gradient(circle at 50% 42%, var(--panel) 0%, var(--bg) 70%);
    transition:opacity .5s ease, visibility .5s ease;
  }
  .loading-screen.hide{opacity:0; visibility:hidden; pointer-events:none;}
  .loading-inner{display:flex; flex-direction:column; align-items:center; gap:20px;}
  .loading-logo-wrap{position:relative;display:inline-flex;line-height:0;}
  .loading-logo{
    height:54px; width:auto;
    filter: saturate(1.55) brightness(1.24) contrast(1.14);
    animation: loadingLogoPulse 1.8s ease-in-out infinite;
  }
  .loading-logo-shine{
    position:absolute;inset:0;pointer-events:none;
    background-image:linear-gradient(115deg,transparent 0%,transparent 40%,rgba(255,255,255,.95) 50%,transparent 60%,transparent 100%);
    background-size:300% 100%;background-position:-120% 0;background-repeat:no-repeat;
    mix-blend-mode:screen;
    -webkit-mask-image:url('alphastrike_logo_v2.png');mask-image:url('alphastrike_logo_v2.png');
    -webkit-mask-size:100% 100%;mask-size:100% 100%;
    -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
    -webkit-mask-mode:alpha;mask-mode:alpha;
    clip-path:inset(14% 0% 40% 22%);
    animation:logoShineSweep 3.2s ease-in-out infinite;
  }
  @keyframes loadingLogoPulse{
    0%,100%{ transform:scale(1); opacity:1; }
    50%{ transform:scale(1.05); opacity:.82; }
  }
  .loading-bars{ display:flex; align-items:flex-end; gap:6px; height:34px; }
  .loading-bars span{
    width:6px; border-radius:3px;
    background:linear-gradient(180deg, var(--green), var(--accent));
    animation: loadingBarPulse 1s ease-in-out infinite;
    transform-origin:bottom;
  }
  .loading-bars span:nth-child(1){height:14px; animation-delay:0s;}
  .loading-bars span:nth-child(2){height:26px; animation-delay:.1s;}
  .loading-bars span:nth-child(3){height:34px; animation-delay:.2s;}
  .loading-bars span:nth-child(4){height:20px; animation-delay:.3s;}
  .loading-bars span:nth-child(5){height:30px; animation-delay:.4s;}
  @keyframes loadingBarPulse{
    0%,100%{ transform:scaleY(.35); opacity:.5; }
    50%{ transform:scaleY(1); opacity:1; }
  }
  .loading-progress{width:220px; height:3px; background:var(--border); border-radius:2px; overflow:hidden;}
  .loading-progress-fill{
    height:100%; width:35%; border-radius:2px;
    background:linear-gradient(90deg, var(--green), var(--accent));
    animation: loadingProgressSweep 1.15s ease-in-out infinite;
  }
  @keyframes loadingProgressSweep{
    0%{ transform:translateX(-140%); }
    100%{ transform:translateX(340%); }
  }
  .loading-text{ font-size:11px; letter-spacing:2px; color:var(--text-dim); font-weight:600; }
  .loading-dots span{ animation: loadingDotBlink 1.4s infinite; opacity:0; }
  .loading-dots span:nth-child(1){animation-delay:0s;}
  .loading-dots span:nth-child(2){animation-delay:.2s;}
  .loading-dots span:nth-child(3){animation-delay:.4s;}
  @keyframes loadingDotBlink{
    0%,80%,100%{ opacity:0; }
    40%{ opacity:1; }
  }
