/* Performance Tracker only. All selectors are scoped to its root. */
#performancePage { color:#332846; font-size:14px; }
#performancePage *,#performancePage *::before,#performancePage *::after { box-sizing:border-box; }
#performancePage [hidden] { display:none!important; }
#performancePage .pf-shell { max-width:var(--content-max-wide); margin:0 auto; padding:0 0 70px; }
#performancePage h1,#performancePage h2,#performancePage h3,#performancePage p { margin-top:0; }
#performancePage .pf-hero { display:flex; justify-content:space-between; align-items:center; gap:18px; margin-bottom:18px; padding:26px 30px; border:1px solid #eddef5; border-radius:22px; background:linear-gradient(115deg,#faf5ff,#fff 55%,#fff7ed); box-shadow:0 12px 35px #51278610; }
#performancePage .pf-hero-title { display:flex; align-items:center; gap:17px; min-width:0; }
#performancePage .pf-hero-icon { display:grid; place-items:center; flex:0 0 58px; height:58px; border-radius:17px; background:linear-gradient(135deg,#9333ea,#f97316); color:#fff; box-shadow:0 9px 20px #9333ea35; }
#performancePage .pf-hero-icon svg { width:27px; height:27px; }
#performancePage .pf-hero h1 { margin:2px 0 5px; font-size:30px; letter-spacing:-.03em; line-height:1.1; }
#performancePage .pf-hero p { margin:0; color:#725d80; font-size:14px; line-height:1.5; }
#performancePage .pf-hero-tag { flex:0 0 auto; padding:8px 12px; border-radius:30px; border:1px solid #e5d4ee; background:#fff; color:#744d89; font-size:11px; font-weight:700; }
#performancePage .pf-eyebrow { color:#8551a7; font-size:11px; text-transform:uppercase; letter-spacing:.09em; font-weight:800; }
#performancePage .pf-stepper { position:sticky; top:0; z-index:5; display:flex; align-items:center; gap:6px; overflow-x:auto; padding:10px 8px; margin:0 0 18px; border-bottom:1px solid #eadff1; background:#fcfafdf2; backdrop-filter:blur(10px); }
#performancePage .pf-stepper a { display:flex; align-items:center; gap:9px; flex:0 0 auto; padding:6px; border-radius:8px; color:#816e8e; text-decoration:none; font-size:12px; font-weight:700; }
#performancePage .pf-stepper a:hover { background:#f3eafa; }
#performancePage .pf-stepper a b { display:grid; place-items:center; flex:0 0 33px; height:33px; border:2px solid #d8c6e6; border-radius:50%; background:white; }
#performancePage .pf-stepper a.is-current b { border-color:#9333ea; box-shadow:0 0 0 3px #9333ea25; }
#performancePage .pf-stepper a.is-done b { background:linear-gradient(135deg,#9333ea,#f97316); border-color:#9333ea; color:white; }
#performancePage .pf-stepper i { display:block; flex:1 0 16px; height:1px; background:#ded2ea; }
#performancePage .pf-card { scroll-margin-top:95px; margin-bottom:22px; padding:25px; border:1px solid #eae0f1; border-radius:17px; background:#fff; box-shadow:0 12px 32px #51278613; }
#performancePage .pf-card>p { margin:10px 0 17px; color:#776585; line-height:1.55; }
#performancePage .pf-section-title { display:flex; align-items:center; gap:11px; }
#performancePage .pf-number { display:grid; place-items:center; flex:0 0 32px; height:32px; border-radius:50%; background:linear-gradient(135deg,#9333ea,#f97316); color:white; font-size:12px; font-weight:800; }
#performancePage .pf-card h2 { margin:3px 0 0; font-size:20px; color:#291e3d; }
#performancePage .pf-card h3 { margin:0 0 5px; font-size:16px; color:#342644; }
#performancePage input,#performancePage select { display:block; width:100%; min-width:0; margin-top:6px; padding:10px 11px; border:1px solid #ded2eb; border-radius:9px; background:white; font:inherit; color:#35234a; }
#performancePage button { font:inherit; cursor:pointer; }
#performancePage button:disabled { cursor:wait; opacity:.6; }
#performancePage button:focus-visible,#performancePage a:focus-visible,#performancePage input:focus-visible,#performancePage select:focus-visible { outline:2px solid #9333ea; outline-offset:2px; }
#performancePage .pf-primary,#performancePage .pf-secondary { display:inline-block; padding:10px 15px; border:1px solid #ddcbea; border-radius:10px; background:white; color:#763da3; font-size:12px; font-weight:700; text-decoration:none; white-space:nowrap; }
#performancePage .pf-primary { border:0; background:linear-gradient(90deg,#9333ea,#f97316); color:white; }
#performancePage .pf-primary:hover { filter:brightness(1.05); }
#performancePage .pf-selected { display:flex; align-items:center; gap:14px; margin-top:15px; padding:14px; border:1px solid #e5d8ef; border-radius:12px; background:linear-gradient(120deg,#faf6ff,#fffaf5); }
#performancePage .pf-selected>div:nth-child(2) { flex:1; min-width:0; }
#performancePage .pf-selected strong,#performancePage .pf-selected small,#performancePage .pf-selected span { display:block; }
#performancePage .pf-selected strong { font-size:17px; margin:4px 0; overflow-wrap:anywhere; }
#performancePage .pf-selected small,#performancePage .pf-selected span { color:#786887; font-size:12px; }
#performancePage .pf-product-image { display:grid; place-items:center; flex:0 0 68px; height:68px; border-radius:11px; overflow:hidden; background:#f1e7f8; color:#8e4dbb; }
#performancePage .pf-product-image img { width:100%; height:100%; object-fit:cover; }
#performancePage .pf-accounts { display:grid; grid-template-columns:1fr 1fr; gap:11px; margin:15px 0 20px; }
#performancePage .pf-account { display:flex; justify-content:space-between; align-items:center; gap:12px; min-width:0; padding:15px; border:1px solid #e8dff0; border-radius:12px; background:linear-gradient(120deg,#faf7ff,#fffaf6); }
#performancePage .pf-account strong,#performancePage .pf-account small { display:block; }
#performancePage .pf-account small { margin-top:5px; color:#766682; line-height:1.5; }
#performancePage .pf-upcoming { background:#fafafa; }
#performancePage .pf-upcoming>span { color:#84738c; font-size:11px; white-space:nowrap; }
#performancePage .pf-controls,#performancePage .pf-pairing { display:grid; grid-template-columns:2fr 1fr 1fr; align-items:end; gap:13px; margin-bottom:13px; }
#performancePage .pf-pairing { grid-template-columns:2fr 1.4fr auto auto; }
#performancePage .pf-controls label,#performancePage .pf-pairing label,#performancePage .pf-snapshot-actions label { min-width:0; font-size:12px; font-weight:700; color:#52405d; }
#performancePage .pf-pairing label small { font-weight:400; }
#performancePage .pf-feedback { min-height:19px; margin:10px 0 0; color:#55755a; font-size:12px; }
#performancePage .pf-feedback.is-error { color:#b03857; }
#performancePage .pf-report-top { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
#performancePage .pf-source-tag { padding:7px 11px; border-radius:99px; background:#f7ecfb; color:#733cab; font-size:11px; font-weight:700; }
#performancePage .pf-warning { margin:17px 0; padding:12px 14px; border:1px solid #efbd8e; border-radius:10px; background:#fff4e7; color:#813f10; font-size:13px; font-weight:600; }
#performancePage .pf-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:11px; margin:17px 0; }
#performancePage .pf-kpis article { min-width:0; padding:16px; border:1px solid #eee8f3; border-radius:12px; background:linear-gradient(120deg,#faf7ff,#fffaf6); }
#performancePage .pf-kpis span,#performancePage .pf-kpis strong,#performancePage .pf-kpis small { display:block; }
#performancePage .pf-kpis span { color:#624d74; font-weight:700; }
#performancePage .pf-kpis strong { margin:9px 0 4px; color:#3c2853; font-size:25px; overflow-wrap:anywhere; }
#performancePage .pf-kpis small { color:#86778d; }
#performancePage .pf-chart-wrap { padding:20px; border:1px solid #e9e0f0; border-radius:14px; }
#performancePage .pf-chart-header,#performancePage .pf-table-head { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }
#performancePage .pf-chart-header p,#performancePage .pf-table-head p { margin:4px 0 0; color:#7c6b87; font-size:12px; }
#performancePage .pf-chart-key { color:#756686; font-size:11px; }
#performancePage .pf-chart-key i { display:inline-block; width:9px; height:9px; border-radius:50%; margin-left:9px; background:#9333ea; }
#performancePage .pf-chart-key i:nth-of-type(2) { background:#f97316; }
#performancePage .pf-chart-key i:nth-of-type(3) { background:#15a39b; }
#performancePage .pf-chart-box { position:relative; height:300px; margin:16px 0 8px; }
#performancePage .pf-chart-box>p { position:absolute; inset:0; display:grid; place-items:center; margin:0; color:#887696; }
#performancePage .pf-week-cards { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; margin-top:16px; }
#performancePage .pf-week { padding:11px; border:1px solid #eee5f2; border-radius:11px; background:#faf8fc; }
#performancePage .pf-week small,#performancePage .pf-week strong,#performancePage .pf-week span { display:block; }
#performancePage .pf-week small,#performancePage .pf-week span { color:#786887; font-size:11px; }
#performancePage .pf-week strong { font-size:17px; margin:5px 0; }
#performancePage .pf-table-head { margin:24px 0 12px; }
#performancePage .pf-table-head a { color:#8032ae; font-size:12px; font-weight:700; }
#performancePage .pf-table-scroll { width:100%; overflow-x:auto; }
#performancePage table { width:100%; min-width:920px; border-collapse:collapse; font-size:12px; text-align:left; }
#performancePage th { padding:10px; background:#f8f3fc; color:#675475; white-space:nowrap; }
#performancePage td { border-bottom:1px solid #eee7f2; padding:12px 10px; color:#423350; }
#performancePage td:first-child { font-weight:700; }
#performancePage .pf-insights { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:11px; margin-top:20px; }
#performancePage .pf-insights article { padding:15px; border:1px solid #e7dcef; border-radius:12px; background:#faf7fd; }
#performancePage .pf-insights strong { display:block; color:#75419c; }
#performancePage .pf-insights p { margin:7px 0 0; color:#68577a; font-size:12px; line-height:1.5; }
#performancePage .pf-snapshot-actions { display:flex; gap:10px; align-items:end; flex-wrap:wrap; }
#performancePage .pf-snapshot-actions label { flex:1 1 250px; max-width:400px; }
#performancePage .pf-snapshot-list { margin-top:16px; }
#performancePage .pf-snapshot { display:flex; align-items:center; gap:10px; padding:10px; border-bottom:1px solid #eee7f2; }
#performancePage .pf-snapshot button:first-child { flex:1; text-align:left; border:0; background:transparent; color:#7932a8; font-weight:700; }
#performancePage .pf-snapshot>span { color:#7b6a87; font-size:11px; }
#performancePage .pf-delete { border:0; background:none; color:#b03857; font-size:11px; }
#performancePage .pf-journey>p { margin-top:10px; }
#performancePage .pf-journey nav { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; margin-top:20px; }
#performancePage .pf-journey nav>a,#performancePage .pf-journey nav>span { display:flex; align-items:center; gap:9px; padding:12px; min-width:0; border:1px solid #ece4f1; border-radius:12px; background:#faf8fb; color:#322644; text-decoration:none; font-weight:700; }
#performancePage .pf-journey nav>a:hover,#performancePage .pf-journey nav>.is-current { border-color:#c799dd; background:#faf3ff; }
#performancePage .pf-journey nav b { display:grid; place-items:center; flex:0 0 27px; height:27px; border-radius:50%; background:#eadcf4; color:#8043a7; }
#performancePage .pf-journey nav>.is-current b { background:linear-gradient(135deg,#9333ea,#f97316); color:white; }
#performancePage .pf-journey nav small { display:block; margin-top:3px; color:#857289; font-size:11px; font-weight:400; }
@media(max-width:1000px){ #performancePage .pf-accounts,#performancePage .pf-controls,#performancePage .pf-pairing { grid-template-columns:repeat(2,minmax(0,1fr)); } #performancePage .pf-kpis,#performancePage .pf-week-cards,#performancePage .pf-journey nav { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:620px){ #performancePage .pf-hero { padding:18px; flex-wrap:wrap; } #performancePage .pf-card { padding:18px; } #performancePage .pf-accounts,#performancePage .pf-controls,#performancePage .pf-pairing,#performancePage .pf-insights,#performancePage .pf-journey nav { grid-template-columns:1fr; } #performancePage .pf-selected { flex-wrap:wrap; } #performancePage .pf-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); } #performancePage .pf-week-cards { grid-template-columns:1fr; } }