.performance-page main { padding-top: 58px; }
.performance-hero { display: flex; align-items: end; justify-content: space-between; gap: 28px; margin-bottom: 34px; }
.performance-hero h1 { max-width: 720px; margin: 0 0 16px; color: #edf7ff; font-size: clamp(2.35rem, 5vw, 4.7rem); font-weight: 850; line-height: 1.24; letter-spacing: -.055em; }
.performance-hero h1 span { color: transparent; background: linear-gradient(105deg, var(--cyan), var(--green)); background-clip: text; -webkit-background-clip: text; }
.performance-hero__copy { max-width: 710px; margin: 0; color: var(--muted); font-size: .91rem; line-height: 2; }
.performance-hero__badges { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 17px; }
.performance-hero__badges span { padding: 6px 10px; border: 1px solid rgba(85,214,239,.16); border-radius: 999px; background: rgba(85,214,239,.045); color: #a7dce8; font-size: .59rem; }
.performance-hero__action { display: flex; flex: 0 0 265px; flex-direction: column; align-items: flex-start; gap: 6px; padding: 18px; border-color: rgba(85,214,239,.18); }
.performance-hero__action-label { color: var(--cyan); font-size: .6rem; font-weight: 800; letter-spacing: .08em; }
.performance-hero__action strong { color: #eaf7ff; font-size: .9rem; }
.performance-hero__action small { min-height: 42px; color: var(--muted); font-size: .61rem; line-height: 1.8; }
.performance-hero__action .hero-button { width: 100%; margin-top: 8px; }
.performance-summary { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
.performance-stat { min-width: 0; padding: 15px; border: 1px solid var(--line); border-radius: 17px; background: linear-gradient(145deg, rgba(16,35,58,.86), rgba(8,22,38,.75)); }
.performance-stat span, .performance-stat strong, .performance-stat small { display: block; }
.performance-stat span { color: var(--muted); font-size: .6rem; }
.performance-stat strong { overflow: hidden; margin: 5px 0 2px; color: #eff7ff; font-size: clamp(1.05rem, 1.8vw, 1.45rem); font-weight: 850; letter-spacing: -.04em; text-overflow: ellipsis; white-space: nowrap; direction: ltr; text-align: right; }
.performance-stat small { overflow: hidden; color: var(--dim); font-size: .52rem; text-overflow: ellipsis; white-space: nowrap; }
.performance-stat--green strong { color: var(--green); }
.performance-stat--cyan strong { color: var(--cyan); }
.performance-stat--amber strong { color: var(--amber); }
.performance-filters { margin-top: 17px; padding: 17px; }
.performance-filters__heading, .performance-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px; }
.performance-filters__heading { align-items: center; margin-bottom: 13px; }
.performance-filters h2, .performance-section-heading h2 { margin: 0; color: #eaf5ff; font-size: 1rem; }
.performance-filters__heading > span, .performance-section-heading > span { color: var(--dim); font-size: .57rem; }
.performance-filter-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)) auto; align-items: end; gap: 9px; }
.performance-filter-grid label { display: block; }
.performance-filter-grid label > span { display: block; margin-bottom: 5px; color: var(--muted); font-size: .58rem; }
.performance-filter-grid select { width: 100%; min-height: 39px; padding: 0 10px; border: 1px solid var(--line); border-radius: 10px; outline: none; background: #0d1d31; color: #d9e8f8; color-scheme: dark; font: inherit; font-size: .65rem; }
.performance-filter-grid select:focus { border-color: rgba(85,214,239,.55); box-shadow: 0 0 0 3px rgba(85,214,239,.08); }
.performance-clear { min-height: 39px; padding: 0 11px; border: 1px solid rgba(255,197,106,.2); border-radius: 10px; background: rgba(255,197,106,.04); color: #d9bd82; font: inherit; font-size: .61rem; cursor: pointer; }
.performance-clear:hover { border-color: rgba(255,197,106,.55); color: var(--amber); }
.performance-main-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(300px, .75fr); gap: 14px; }
.performance-breakdown-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(300px, .75fr); gap: 14px; }
.performance-chart-panel, .performance-outcome-panel, .performance-table-panel, .performance-timeframe-panel, .performance-records { padding: 18px; }
.performance-section-heading { align-items: center; margin-bottom: 13px; }
.performance-section-heading .eyebrow { margin-bottom: 4px; font-size: .61rem; }
.performance-chart { min-height: 248px; display: grid; place-items: center; overflow: hidden; border: 1px solid rgba(157,185,219,.08); border-radius: 13px; background: linear-gradient(180deg, rgba(85,214,239,.035), rgba(5,17,29,.22)); }
.performance-chart svg { display: block; width: 100%; height: 248px; }
.performance-chart__empty { max-width: 260px; color: var(--dim); font-size: .67rem; line-height: 1.9; text-align: center; }
.performance-outcome-list { display: grid; gap: 12px; padding: 5px 0; }
.performance-outcome { display: grid; grid-template-columns: 11px minmax(0, 1fr) auto; align-items: center; gap: 8px; }
.performance-outcome__dot { width: 9px; height: 9px; border-radius: 50%; background: var(--muted); box-shadow: 0 0 0 4px rgba(141,163,189,.08); }
.performance-outcome__dot.is-positive { background: var(--green); box-shadow: 0 0 0 4px rgba(82,214,163,.1); }
.performance-outcome__dot.is-negative { background: var(--red); box-shadow: 0 0 0 4px rgba(255,124,157,.1); }
.performance-outcome__dot.is-warning { background: var(--amber); box-shadow: 0 0 0 4px rgba(255,197,106,.1); }
.performance-outcome__name strong, .performance-outcome__name small { display: block; }
.performance-outcome__name strong { color: #dbeafa; font-size: .67rem; }
.performance-outcome__name small { margin-top: 2px; color: var(--dim); font-size: .55rem; }
.performance-outcome__value { direction: ltr; color: var(--muted); font-size: .65rem; text-align: left; }
.performance-outcome__bar { grid-column: 2 / -1; height: 5px; overflow: hidden; border-radius: 999px; background: rgba(157,185,219,.08); }
.performance-outcome__bar span { display: block; height: 100%; min-width: 3px; border-radius: inherit; background: var(--cyan); }
.performance-table-wrap { overflow-x: auto; }
.performance-table { width: 100%; border-collapse: collapse; min-width: 610px; }
.performance-table th { padding: 8px 10px; border-bottom: 1px solid var(--line); color: var(--dim); font-size: .55rem; font-weight: 600; text-align: right; white-space: nowrap; }
.performance-table td { padding: 10px; border-bottom: 1px solid rgba(157,185,219,.07); color: var(--muted); font-size: .62rem; white-space: nowrap; }
.performance-table tr:last-child td { border-bottom: 0; }
.performance-table__asset { display: inline-flex; align-items: center; gap: 8px; border: 0; background: transparent; color: #e7f4ff; font: inherit; cursor: pointer; }
.performance-table__asset strong, .performance-table__asset small { display: block; text-align: right; }
.performance-table__asset strong { font-size: .66rem; }
.performance-table__asset small { color: var(--dim); font-size: .52rem; }
.performance-table__asset:hover strong { color: var(--cyan); }
.performance-table__r { direction: ltr; text-align: right; }
.performance-table__r.is-positive { color: var(--green); }
.performance-table__r.is-negative { color: var(--red); }
.performance-timeframe-list { display: grid; gap: 9px; }
.performance-timeframe-card { padding: 11px 12px; border: 1px solid rgba(157,185,219,.1); border-radius: 11px; background: rgba(255,255,255,.025); }
.performance-timeframe-card__head, .performance-timeframe-card__metrics { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.performance-timeframe-card__head strong { color: #eaf6ff; font-size: .72rem; }
.performance-timeframe-card__head span { color: var(--cyan); font-size: .59rem; }
.performance-timeframe-card__metrics { margin-top: 7px; color: var(--muted); font-size: .56rem; }
.performance-timeframe-card__metrics b { color: #dcebf8; font-weight: 700; }
.performance-empty { padding: 28px 16px; border: 1px dashed rgba(157,185,219,.15); border-radius: 12px; color: var(--dim); font-size: .67rem; line-height: 1.9; text-align: center; }
.performance-records { padding-bottom: 20px; }
.performance-record-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.performance-record { min-width: 0; padding: 13px; border: 1px solid rgba(157,185,219,.11); border-radius: 14px; background: linear-gradient(145deg, rgba(16,35,58,.75), rgba(7,18,31,.62)); }
.performance-record--tp2 { border-color: rgba(82,214,163,.28); }
.performance-record--sl { border-color: rgba(255,124,157,.26); }
.performance-record__top, .performance-record__identity, .performance-record__headline, .performance-record__metrics, .performance-record__plan { display: flex; align-items: center; justify-content: space-between; gap: 9px; }
.performance-record__identity { justify-content: flex-start; min-width: 0; }
.performance-record__asset { display: grid; min-width: 0; }
.performance-record__asset strong { overflow: hidden; color: #edf7ff; font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }
.performance-record__asset small { color: var(--dim); direction: ltr; font-size: .54rem; text-align: right; }
.performance-record__signal, .performance-record__status { padding: 4px 8px; border-radius: 999px; font-size: .55rem; white-space: nowrap; }
.performance-record__signal { background: rgba(85,214,239,.08); color: var(--cyan); }
.performance-record__signal.is-sell { background: rgba(255,124,157,.08); color: var(--red); }
.performance-record__status { background: rgba(141,163,189,.1); color: var(--muted); }
.performance-record__status.is-positive { background: rgba(82,214,163,.1); color: var(--green); }
.performance-record__status.is-negative { background: rgba(255,124,157,.1); color: var(--red); }
.performance-record__status.is-warning { background: rgba(255,197,106,.1); color: var(--amber); }
.performance-record__headline { align-items: end; margin-top: 13px; }
.performance-record__headline span, .performance-record__headline strong { display: block; }
.performance-record__headline span { color: var(--dim); font-size: .53rem; }
.performance-record__headline strong { color: #e9f4ff; font-size: .85rem; direction: ltr; }
.performance-record__headline small { color: var(--green); font-size: .55rem; }
.performance-record__plan { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 11px; padding: 9px; border-radius: 10px; background: rgba(85,214,239,.045); }
.performance-record__plan span, .performance-record__plan strong { display: block; }
.performance-record__plan span { color: var(--dim); font-size: .51rem; }
.performance-record__plan strong { margin-top: 2px; color: #dcebf8; direction: ltr; font-size: .58rem; }
.performance-record__metrics { justify-content: flex-start; flex-wrap: wrap; margin-top: 11px; color: var(--muted); font-size: .56rem; }
.performance-record__metrics b { color: #dcebf8; direction: ltr; }
.performance-record__metrics .is-positive { color: var(--green); }
.performance-record__metrics .is-negative { color: var(--red); }
.performance-record__note { margin: 10px 0 0; color: var(--muted); font-size: .59rem; line-height: 1.75; }
.performance-record__foot { display: flex; justify-content: space-between; gap: 8px; margin-top: 10px; color: var(--dim); font-size: .52rem; }
.performance-record details { margin-top: 9px; border-top: 1px solid rgba(157,185,219,.08); padding-top: 8px; }
.performance-record summary { color: var(--cyan); font-size: .57rem; cursor: pointer; }
.performance-record details p { margin: 7px 0 0; color: var(--muted); font-size: .57rem; line-height: 1.8; }
.performance-disclaimer { display: flex; align-items: start; gap: 9px; margin-top: 15px; padding: 13px 15px; border: 1px solid rgba(255,197,106,.16); border-radius: 14px; background: rgba(255,197,106,.04); color: #c7b384; }
.performance-disclaimer > span { color: var(--amber); font-size: .95rem; }
.performance-disclaimer p { margin: 0; font-size: .6rem; line-height: 1.85; }
.performance-disclaimer strong { color: #f1ce81; }
@media (max-width: 1120px) { .performance-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); } .performance-filter-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .performance-clear { min-height: 39px; } }
@media (max-width: 820px) { .performance-hero { align-items: stretch; flex-direction: column; } .performance-hero__action { flex-basis: auto; } .performance-main-grid, .performance-breakdown-grid { grid-template-columns: 1fr; } .performance-record-list { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .performance-page main { padding-top: 40px; } .performance-hero h1 { font-size: 2.45rem; } .performance-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } .performance-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .performance-filter-grid label:first-child { grid-column: 1 / -1; } .performance-clear { grid-column: 1 / -1; } .performance-chart-panel, .performance-outcome-panel, .performance-table-panel, .performance-timeframe-panel, .performance-records { padding: 14px; } .performance-section-heading { align-items: start; flex-direction: column; gap: 4px; } .performance-record__plan { gap: 5px; } }

/* کارنامه‌بان · نمای شخصی و شبیه‌ساز بازده فرضی */
.performance-scope { display: flex; align-items: center; justify-content: space-between; gap: 22px; margin-bottom: 17px; padding: 16px 18px; border-color: rgba(85,214,239,.18); background: linear-gradient(115deg, rgba(11,36,61,.9), rgba(8,21,37,.78)); }
.performance-scope__copy { min-width: 0; }
.performance-scope__copy h2 { margin: 0; color: #eaf5ff; font-size: 1rem; }
.performance-scope__copy p:last-child { max-width: 690px; margin: 6px 0 0; color: var(--muted); font-size: .62rem; line-height: 1.85; }
.performance-scope__actions { display: grid; flex: 0 0 370px; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.performance-scope__tab { min-height: 57px; padding: 8px 11px; border: 1px solid rgba(157,185,219,.16); border-radius: 11px; background: rgba(4,16,29,.52); color: var(--muted); font: inherit; cursor: pointer; text-align: right; transition: border-color 160ms ease, background 160ms ease, color 160ms ease, transform 160ms ease; }
.performance-scope__tab:hover { border-color: rgba(85,214,239,.5); color: #e9f7ff; transform: translateY(-1px); }
.performance-scope__tab.is-active { border-color: rgba(85,214,239,.72); background: linear-gradient(135deg, rgba(13,86,112,.58), rgba(14,43,70,.76)); color: #ecfbff; box-shadow: inset 0 1px rgba(255,255,255,.08), 0 8px 24px rgba(0,0,0,.14); }
.performance-scope__tab span, .performance-scope__tab small { display: block; }
.performance-scope__tab span { font-size: .68rem; font-weight: 750; }
.performance-scope__tab small { margin-top: 3px; color: var(--dim); font-size: .51rem; }
.performance-scope__tab.is-active small { color: #a9dce8; }
.performance-login-link { display: inline-flex; margin-top: .55rem; color: var(--cyan, #35d8ff); font-weight: 800; text-decoration: none; }
.performance-login-link:hover { text-decoration: underline; }
.performance-simulation { margin-top: 17px; padding: 18px; border-color: rgba(82,214,163,.18); background: linear-gradient(145deg, rgba(11,39,47,.68), rgba(8,22,38,.8)); }
.performance-simulation__heading { align-items: start; }
.performance-simulation__heading h2 { font-size: 1.05rem; }
.performance-simulation__heading p:not(.eyebrow) { margin: 5px 0 0; color: var(--dim); font-size: .59rem; line-height: 1.8; }
.performance-simulation__controls { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; margin-top: 14px; }
.performance-simulation__controls label { display: block; min-width: 0; }
.performance-simulation__controls label > span { display: block; margin-bottom: 5px; color: var(--muted); font-size: .58rem; }
.performance-simulation__controls input { width: 100%; min-height: 39px; box-sizing: border-box; padding: 0 10px; border: 1px solid rgba(157,185,219,.17); border-radius: 10px; outline: none; background: rgba(5,18,31,.72); color: #e6f4ff; color-scheme: dark; direction: ltr; font: inherit; font-size: .68rem; text-align: right; }
.performance-simulation__controls input:focus { border-color: rgba(82,214,163,.58); box-shadow: 0 0 0 3px rgba(82,214,163,.08); }
.performance-simulation__summary { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 9px; margin-top: 13px; }
.performance-sim-stat { min-width: 0; padding: 11px 12px; border: 1px solid rgba(157,185,219,.12); border-radius: 12px; background: rgba(4,17,29,.48); }
.performance-sim-stat span, .performance-sim-stat strong, .performance-sim-stat small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.performance-sim-stat span { color: var(--muted); font-size: .55rem; }
.performance-sim-stat strong { margin-top: 5px; color: #eaf7ff; direction: ltr; font-size: .87rem; font-weight: 800; letter-spacing: -.03em; }
.performance-sim-stat small { margin-top: 3px; color: var(--dim); font-size: .5rem; }
.performance-sim-stat--green strong { color: var(--green); }
.performance-sim-stat--cyan strong { color: var(--cyan); }
.performance-sim-stat--amber strong { color: var(--amber); }
.performance-simulation__chart { min-height: 170px; display: grid; place-items: center; overflow: hidden; margin-top: 13px; border: 1px solid rgba(157,185,219,.08); border-radius: 12px; background: linear-gradient(180deg, rgba(82,214,163,.035), rgba(5,17,29,.18)); }
.performance-simulation__chart svg { display: block; width: 100%; height: 170px; }
.performance-simulation__empty { max-width: 300px; padding: 25px 14px; color: var(--dim); font-size: .63rem; line-height: 1.9; text-align: center; }
.performance-simulation__note { margin: 9px 0 0; color: var(--dim); font-size: .57rem; line-height: 1.8; }
.performance-record__timeline { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin-top: 8px; }
.performance-record__timeline span { min-width: 0; padding: 6px 7px; border-radius: 8px; background: rgba(157,185,219,.06); color: var(--dim); font-size: .49rem; line-height: 1.65; }
.performance-record__timeline b { display: block; overflow: hidden; margin-top: 2px; color: #dcebf8; direction: ltr; font-size: .51rem; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.performance-record__timeline .is-done { border: 1px solid rgba(82,214,163,.15); color: #a6d8c3; }
.performance-record__timeline .is-done b { color: var(--green); }
@media (max-width: 1120px) { .performance-simulation__summary { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 820px) { .performance-scope { align-items: stretch; flex-direction: column; } .performance-scope__actions { flex-basis: auto; } .performance-simulation__controls { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .performance-scope, .performance-simulation { padding: 14px; } .performance-scope__actions { grid-template-columns: 1fr; } .performance-simulation__controls, .performance-simulation__summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } .performance-simulation__heading > span { white-space: normal; } .performance-sim-stat strong { font-size: .78rem; } .performance-record__timeline { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
