/* FTJ chart-type parity v1.1.
 * Exact WPF components listed in docs/trade-analyzer/ftj-chart-parity.md.
 * Chart TYPES, not desktop metrics or source data, are deliberately mirrored. */
.ftj-chart-links{max-width:none;margin:13px 0 20px;padding:0;display:flex;flex-wrap:wrap;gap:7px}
.ftj-chart-links a{display:inline-flex;align-items:center;color:#bfdbfe;text-decoration:none;
 border:1px solid #35537a;border-radius:999px;padding:9px 14px;font-size:12px;font-weight:700;
 background:#162235;transition:background .15s,border-color .15s}
.ftj-chart-links a:hover,.ftj-chart-links a:focus-visible{background:#223f69;border-color:#60a5fa}
.ftj-parity-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}
.ftj-parity-panel{min-width:0;padding:21px!important;overflow:hidden}
.ftj-parity-panel h3{font-size:17px;font-weight:750;margin:0 0 5px}
.ftj-parity-panel>p,.ftj-calendar-head p{font-size:12px;line-height:1.55;color:var(--ftj-secondary);margin:2px 0 14px}
.ftj-parity-panel .chart-caveat{margin-top:13px;line-height:1.5}
.ftj-bar-plot{width:100%;height:auto;display:block;min-height:180px;margin:11px 0 3px;overflow:visible}
.ftj-axis{font-family:Inter,"Segoe UI",sans-serif;font-size:11px;fill:#aabbd0}
.ftj-bar{transition:opacity .15s,fill .15s}
.ftj-chart-select{cursor:pointer;outline:none}
.ftj-chart-select:hover .ftj-bar,.ftj-chart-select:focus-visible .ftj-bar{opacity:.65}
.ftj-chart-select:focus-visible{filter:drop-shadow(0 0 3px #93C5FD)}
.ftj-chart-select:focus-visible circle{stroke:#93c5fd;stroke-width:3px}
.ftj-calendar-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;flex-wrap:wrap}
.ftj-calendar-nav{display:flex;align-items:center;justify-content:center;gap:5px}
.ftj-calendar-nav button{color:#bfdbfe;border:1px solid #374151;background:#202c42;
 border-radius:6px;min-width:33px;height:33px;font-size:24px;line-height:1}
.ftj-calendar-nav button:disabled{opacity:.3;cursor:default}
.ftj-calendar-nav strong{min-width:120px;text-align:center;font-size:12px;font-weight:750}
.ftj-calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;margin-top:12px}
.ftj-calendar-weekday{font-size:10px;text-align:center;font-weight:700;color:var(--ftj-secondary);padding:0 0 8px}
.ftj-calendar-day,.ftj-calendar-empty{min-height:53px;border:1px solid #303b4a;border-radius:6px;
 display:flex;flex-direction:column;gap:5px;justify-content:space-between;align-items:flex-start;
 padding:7px 6px;background:#18212c;color:var(--ftj-fg);min-width:0;overflow:hidden}
.ftj-calendar-empty{border:0;background:transparent}
button.ftj-calendar-day{cursor:pointer;text-align:left}
button.ftj-calendar-day:hover,button.ftj-calendar-day:focus-visible{outline:2px solid #93C5FD;outline-offset:1px;z-index:1}
.ftj-cal-day-num{font-size:11px;color:#e5e7eb}
.ftj-cal-amount{font-size:clamp(8px,.77vw,11px);font-variant-numeric:tabular-nums;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ftj-duration-content{display:flex;align-items:center;justify-content:center;gap:22px;flex-wrap:wrap;min-height:215px;padding:8px 0}
.ftj-duration-donut{width:173px;height:173px;flex:none;border-radius:50%;display:grid;place-items:center;box-shadow:0 0 0 1px #374151}
.ftj-duration-hole{width:105px;height:105px;border-radius:50%;background:#14161A;
 display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:4px}
.ftj-duration-hole strong{font-size:34px;line-height:1;font-weight:750;color:var(--ftj-fg)}
.ftj-duration-hole span{font-size:11px;color:var(--ftj-secondary)}
.ftj-duration-legend{flex:1;min-width:145px;display:flex;flex-direction:column;gap:7px}
.ftj-duration-item{border:1px solid #283648;background:transparent;color:#f3f4f6;text-align:left;
 display:grid;grid-template-columns:12px minmax(0,1fr) auto;gap:7px;align-items:center;
 padding:7px 9px;border-radius:7px;font-size:11px}
.ftj-duration-item strong{font-size:11px;font-variant-numeric:tabular-nums;color:#cbd5e1}
.ftj-duration-item:hover,.ftj-duration-item:focus-visible{background:#22334e;border-color:#60a5fa}
.ftj-duration-dot{width:9px;height:9px;border-radius:50%}
.ftj-no-data{font-size:12px;color:#cbd5e1;background:#1b2636;border:1px dashed #374151;border-radius:8px;padding:20px;line-height:1.6;max-width:100%}
.ftj-activity-panel{grid-column:1/-1}
.ftj-activity-scroll{overflow-x:auto;max-width:100%;padding:6px 2px 10px;scrollbar-color:#4d6480 transparent}
.ftj-activity-grid{min-width:660px;display:flex;flex-direction:column;gap:5px}
.ftj-activity-hours,.ftj-activity-row{display:grid;grid-template-columns:45px repeat(24,minmax(0,1fr));gap:5px;align-items:center}
.ftj-activity-hours{color:var(--ftj-secondary);font-size:10px;text-align:center;margin-bottom:7px}
.ftj-activity-weekday{font-size:11px;font-weight:750;color:var(--ftj-secondary)}
.ftj-activity-cell{height:23px;min-width:0;padding:0;border:1px solid #374151;
 border-radius:4px;font-size:10px;font-weight:700;color:white;text-align:center}
.ftj-activity-cell:disabled{cursor:default;opacity:.55}
.ftj-activity-cell:not(:disabled):hover,.ftj-activity-cell:focus-visible{outline:2px solid #bfdbfe;outline-offset:1px;z-index:2}
#ftj-chart-explorer{scroll-margin-top:24px;margin-bottom:10px}
#ftj-trade-performance,#ftj-month-summary,#ftj-calendar-panel,#ftj-duration-panel,#ftj-activity-panel,#ftj-risk{scroll-margin-top:20px}
@media(max-width:1000px){
 .ftj-parity-grid{grid-template-columns:1fr}
 .ftj-activity-panel{grid-column:auto}
 .ftj-cal-amount{font-size:11px}
 .ftj-duration-content{justify-content:space-around}
}
@media(max-width:560px){
 .ftj-parity-panel{padding:16px!important}
 .ftj-chart-links{flex-wrap:nowrap;overflow-x:auto;max-width:100%;padding-bottom:7px}
 .ftj-chart-links a{white-space:nowrap;flex:none}
 .ftj-calendar-day,.ftj-calendar-empty{min-height:47px;padding:6px 4px}
 .ftj-cal-amount{font-size:9px}
 .ftj-cal-day-num{font-size:10px}
 .ftj-duration-donut{width:145px;height:145px}
 .ftj-duration-hole{width:87px;height:87px}
 .ftj-duration-hole strong{font-size:27px}
 .ftj-activity-scroll:after{content:"Scroll sideways to explore all 24 hours";display:block;
 color:var(--ftj-secondary);font-size:11px;margin-top:8px}
}
@media(prefers-reduced-motion:reduce){.ftj-chart-links a,.ftj-bar{transition:none}}

/* FTJ Reports OutcomeQuality uses a semicircular win-rate gauge, not a
 * unique chart of three competing horizontal P&L bars. Counts remain clickable. */
.outcome-chart{display:flex;flex-direction:column;align-items:stretch;gap:11px;margin:15px 0 12px}
.ftj-semi-gauge{display:flex;align-items:center;justify-content:center}
.ftj-semi-gauge svg{display:block;width:min(260px,100%);height:auto;max-height:180px}
.ftj-semi-rate{fill:#f3f4f6;font-family:Inter,"Segoe UI",sans-serif;font-size:32px;font-weight:750}
.ftj-semi-label{fill:#9ca3af;font-family:Inter,"Segoe UI",sans-serif;font-size:11px;font-weight:700;letter-spacing:1.4px}
.ftj-outcome-legend{display:grid;grid-template-columns:1fr;gap:7px;width:100%}
.ftj-outcome-legend .outcome-button{display:grid;grid-template-columns:minmax(0,1fr) auto;
 background:#18212c;border:1px solid #303946;padding:10px 13px;min-height:46px}
.ftj-outcome-legend .outcome-button:disabled{opacity:.55}
.ftj-outcome-legend .outcome-value{font-size:12px;text-align:right}
.ftj-outcome-legend .outcome-label{font-size:12px}
.ftj-outcome-legend .outcome-label small{font-size:10px;margin-top:3px}
