/* Trading Metrics (Trading-Metrics.aspx) - the trader profile layout (s8-trader.css) plus the
   metrics-only modules. Gold = Pro, as on the profile. Requires s8-tokens.css + s8-trader.css. */

.mm.is-loading .tp-wrap{opacity:.35;pointer-events:none;transition:opacity .2s}
.mm-error{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border:1px solid var(--s8-down-line);border-radius:8px;background:var(--s8-down-tint);color:var(--s8-fg);font-size:14px}
.mm-error[hidden]{display:none}
.mm .s8c-sub+.tp-meta{margin-top:14px}

/* identity: avatar + name on one row */
.mm-who{display:flex;align-items:center;gap:16px;min-width:0}
.mm-who .tp-av{width:64px;height:64px;font-size:26px}
/* photos are cropped round with the ring back (s8-trader.css leaves avatar art square and unringed) */
.mm-who .tp-av.is-photo img{border-radius:50%;object-fit:cover}
.mm-who .tp-av.is-photo{box-shadow:0 0 0 2px var(--s8-line-3),0 0 0 6px rgba(255,255,255,.04)}
.mm-who .tp-av.is-photo.is-pro{box-shadow:0 0 0 2px var(--tp-gold),0 0 0 6px var(--tp-gold-tint)}
.mm-who__txt{display:grid;gap:4px;min-width:0}
.mm-who__txt b{font-size:20px;font-weight:600;color:#fff;letter-spacing:-.01em;overflow-wrap:anywhere}
.mm-who__txt span{font-size:13px;color:var(--s8-fg-3)}
.tp-card.is-pro .mm-who__txt span{color:var(--tp-gold-fg)}
.mm-link{padding:0;border:0;background:none;color:var(--tp-gold-fg);font:inherit;font-weight:600;cursor:pointer}
.mm-link:hover{color:var(--tp-gold-hi)}

/* Pro marks */
.mm-pro{display:inline-flex;align-items:center;gap:5px;height:20px;padding:0 8px;border-radius:999px;background:var(--tp-reward);color:#2A1904;font-size:11px;font-weight:700;letter-spacing:.12em}
.mm-pro .tp-i{width:11px;height:11px;stroke-width:2.4}
.mm-pro[hidden]{display:none}
.mm-pro--sm{height:22px;cursor:pointer;vertical-align:middle}
.mm-btn--gold{border-color:var(--tp-gold-line);background:var(--tp-gold-tint);color:var(--tp-gold-fg)}
.mm-btn--gold:hover{border-color:var(--tp-gold);background:rgba(245,177,74,.22);color:#fff}
.mm-lockrow .tp-stat__k{letter-spacing:.06em}
.mm-lockrow .tp-btn{flex:none}

/* locked card: placeholder shapes, blurred, with the pitch on top */
.mm-lock{position:relative;min-height:220px;overflow:hidden}
.mm-lock__sample{filter:blur(5px);opacity:.55;pointer-events:none;user-select:none}
.mm-lock__over{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:8px;padding:24px;text-align:center;background:radial-gradient(60% 70% at 50% 50%,rgba(10,12,18,.82),rgba(10,12,18,.35))}
.mm-lock__over b{font-size:17px;font-weight:600;color:#fff}
.mm-lock__over p{max-width:420px;margin:0 0 6px;font-size:13px;color:var(--s8-fg-2)}
.mm-sk-cal{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;padding:16px}
.mm-sk-cal i{height:34px;border-radius:4px;background:var(--s8-inset)}
.mm-sk-cal i.up{background:rgba(62,214,155,.35)}.mm-sk-cal i.dn{background:rgba(255,110,122,.35)}
.mm-sk-bars{display:grid;gap:14px;padding:22px 18px}
.mm-sk-bars div{display:grid;grid-template-columns:44px 1fr;gap:12px;align-items:center}
.mm-sk-bars s{height:10px;border-radius:3px;background:var(--s8-line-3)}
.mm-sk-bars i{height:12px;border-radius:999px;background:linear-gradient(90deg,var(--s8-up),rgba(62,214,155,.3))}
.mm-sk-bars div:nth-child(even) i{background:linear-gradient(90deg,var(--s8-down),rgba(255,110,122,.3))}
.mm-sk-rows{display:grid;padding:6px 0}
.mm-sk-rows div{display:grid;grid-template-columns:36px 1fr 60px 80px;gap:14px;align-items:center;padding:12px 18px;border-bottom:1px solid var(--s8-line)}
.mm-sk-rows i{width:36px;height:36px;border-radius:5px;background:var(--s8-panel-2)}
.mm-sk-rows s{height:10px;border-radius:3px;background:var(--s8-line-3)}

/* performance tiles */
/* 10 tiles: 5 across on desktop, 2 on phones - always full rows */
.mm-tiles{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;background:var(--s8-line)}
@media (max-width:1240px){.mm-tile b{font-size:18px}}
@media (max-width:1000px){.mm-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
.mm-tile{display:grid;gap:4px;align-content:start;padding:16px;background:var(--s8-panel);min-width:0}
.mm-tile b{font-size:21px;font-weight:600;letter-spacing:-.015em;color:#fff;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mm-tile b.up{color:var(--s8-up)}.mm-tile b.down{color:var(--s8-down)}
.mm-tile small{font-size:12px;color:var(--s8-fg-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mm-tile s{display:block;height:9px;border-radius:3px;background:var(--s8-line-3)}
.mm-tile s.mm-big{width:70%;height:20px;margin-top:6px;background:var(--s8-fg-4)}

/* calendar */
.mm-cal__nav{display:flex;align-items:center;gap:6px;margin-left:auto;font-size:13px;font-weight:600;color:#fff;white-space:nowrap}
.mm-cal__nav[hidden]{display:none}
.mm-cal__nav b{margin-left:6px;font-weight:600}
.mm-cal__nav b.up{color:var(--s8-up)}.mm-cal__nav b.down{color:var(--s8-down)}
.mm-icon{display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--s8-line-2);border-radius:5px;background:none;color:var(--s8-fg-2);cursor:pointer}
.mm-icon:hover:not(:disabled){background:var(--s8-hover);color:#fff}
.mm-icon:disabled{opacity:.3;cursor:default}
.mm-cal{display:grid;gap:4px;padding:12px}
.mm-cal__h,.mm-cal__w{display:grid;grid-template-columns:repeat(7,minmax(0,1fr)) minmax(0,1.15fr);gap:4px}
.mm-cal__h span{padding:2px 6px;font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--s8-fg-4)}
.mm-cal__d{position:relative;display:grid;align-content:end;gap:1px;min-height:68px;padding:6px 8px;border-radius:5px;background:var(--s8-inset);min-width:0}
.mm-cal__d.is-out{background:none}
.mm-cal__d em{position:absolute;top:5px;left:8px;font-style:normal;font-size:11px;color:var(--s8-fg-4)}
.mm-cal__d.is-today{box-shadow:inset 0 0 0 1px var(--s8-accent)}
.mm-cal__d.has.up{background:rgba(62,214,155,var(--a))}
.mm-cal__d.has.down{background:rgba(255,110,122,var(--a))}
.mm-cal__d.has em{color:var(--s8-fg-2)}
.mm-cal__d b{font-size:13.5px;font-weight:600;color:#fff;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mm-cal__d small{font-size:11px;color:var(--s8-fg-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mm-cal__tot{background:var(--s8-panel-2);border:1px solid var(--s8-line)}
.mm-cal__tot b.up{color:var(--s8-up)}.mm-cal__tot b.down{color:var(--s8-down)}

/* two-up row */
.mm-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}

/* long vs short */
.mm-sides{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--s8-line)}
.mm-side{display:grid;gap:10px;align-content:start;padding:16px;background:var(--s8-panel)}
.mm-side__h{display:flex;align-items:center;justify-content:space-between;gap:8px}
.mm-side__h small{font-size:12px;color:var(--s8-fg-3)}
.mm-side>b{font-size:22px;font-weight:600;font-variant-numeric:tabular-nums}
.mm-side dl{display:grid;grid-template-columns:1fr auto;gap:6px 10px;margin:0;font-size:13px}
.mm-side dt{color:var(--s8-fg-3)}
.mm-side dd{margin:0;text-align:right;font-weight:600;color:#fff;font-variant-numeric:tabular-nums}
.mm-side dd.up{color:var(--s8-up)}.mm-side dd.down{color:var(--s8-down)}

/* day of week */
.mm-week{display:grid;gap:10px;padding:16px}
.mm-week__r{display:grid;grid-template-columns:34px minmax(0,1fr) 64px 72px;gap:10px;align-items:center;font-size:13px}
.mm-week__r>span{font-weight:600;color:var(--s8-fg-2)}
.mm-week__bar{position:relative;height:10px;border-radius:999px;background:var(--s8-inset)}
/* zero line: faint and solid, inside the track (a 1px dashed line here rendered as stray dots) */
.mm-week__bar::after{content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;background:var(--s8-line-2)}
.mm-week__bar i{position:absolute;top:0;bottom:0;z-index:1;border-radius:999px;background:var(--s8-up)}
.mm-week__bar i.down{background:var(--s8-down)}
.mm-week__r b{text-align:right;font-weight:600;font-variant-numeric:tabular-nums}
.mm-week__r small{text-align:right;font-size:12px;color:var(--s8-fg-3);white-space:nowrap}
.mm-week__foot{font-size:12px;color:var(--s8-fg-4)}

/* by ticker */
.mm-tt__h,.mm-tt__r{display:grid;grid-template-columns:minmax(0,1.6fr) 70px 80px 80px 110px;gap:10px;align-items:center;padding:0 20px}
.mm-tt__h{height:36px;border-bottom:1px solid var(--s8-line);font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--s8-fg-4)}
.mm-tt__r{min-height:58px;border-bottom:1px solid var(--s8-line);font-size:14px;font-variant-numeric:tabular-nums}
.mm-tt__h span:not(:first-child),.mm-tt__r span:not(:first-child){text-align:right}
.mm-tt__r span:last-child{font-weight:600}
.mm-tt__sym{display:flex;align-items:center;gap:12px;min-width:0}
.mm-tt__sym b{color:#fff;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Trade Coach grades: A green, B blue, C gold, D red */
.mm-gr{display:inline-grid;place-items:center;min-width:30px;height:22px;padding:0 6px;border-radius:4px;border:1px solid;font-size:12px;font-weight:700;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.mm-gr--a{color:var(--s8-up);border-color:var(--s8-up-line);background:var(--s8-up-tint)}
.mm-gr--b{color:#7cc4ff;border-color:rgba(62,162,242,.45);background:rgba(62,162,242,.12)}
.mm-gr--c{color:var(--tp-gold-fg);border-color:var(--tp-gold-line);background:var(--tp-gold-tint)}
.mm-gr--d{color:var(--s8-down);border-color:var(--s8-down-line);background:var(--s8-down-tint)}
.mm-gr--none{color:var(--s8-fg-4);border-color:var(--s8-line-2);background:none;font-weight:500;cursor:help}
.mm-gr--big{min-width:46px;height:34px;font-size:18px;border-radius:6px}
.mm-tr__gr{flex:none;width:42px;display:flex;justify-content:center}

/* Coach report card */
.mm-coach{display:grid;gap:14px;padding:18px 20px}
.mm-coach__sum{display:flex;align-items:center;gap:16px}
.mm-coach__sum .mm-gr--big{min-width:64px;height:52px;font-size:26px;border-radius:8px}
.mm-coach__sum>div{display:grid;gap:2px}
.mm-coach__sum b{font-size:16px;font-weight:600;color:#fff}
.mm-coach__sum small{font-size:12.5px;color:var(--s8-fg-3)}
.mm-dist{display:flex;gap:2px;height:10px;border-radius:999px;overflow:hidden;background:var(--s8-inset)}
.mm-dist i{display:block;min-width:4px}
.mm-dist--a{background:var(--s8-up)}.mm-dist--b{background:#3ea2f2}.mm-dist--c{background:var(--tp-gold)}.mm-dist--d{background:var(--s8-down)}
.mm-dist__k{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12px;color:var(--s8-fg-3)}
.mm-dist__k span{display:inline-flex;align-items:center;gap:6px}
.mm-dist__k i{width:8px;height:8px;border-radius:2px}
.mm-dist__k b{color:#fff;font-weight:600}
.mm-coach__h{margin-top:4px;font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--s8-fg-3)}
.mm-mist{display:grid;border:1px solid var(--s8-line);border-radius:6px;overflow:hidden}
.mm-mist__r{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,auto);gap:14px;align-items:center;padding:10px 14px;border-bottom:1px solid var(--s8-line);font-size:13.5px;color:#fff}
.mm-mist__r:last-child{border-bottom:0}
.mm-mist__r em{font-style:normal;font-size:12px;color:var(--s8-fg-3);white-space:nowrap}
.mm-mist__l{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--s8-accent-fg);white-space:nowrap}
.mm-mist__l:hover{color:#fff}
.mm-coach__str{font-size:13px;color:var(--s8-fg-3)}
.mm-coach__str b{color:var(--s8-up);font-weight:600}
.mm-coach__str em{font-style:normal;font-size:12px}
.mm-low{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--s8-line);font-size:13.5px}
.mm-low:last-child{border-bottom:0}
.mm-low[data-href]:hover b{color:var(--s8-accent-fg)}
.mm-low b{color:#fff;font-weight:600}
.mm-low small{color:var(--s8-fg-3);font-size:12px}
.mm-low__pnl{margin-left:auto;font-weight:600;font-variant-numeric:tabular-nums}
.mm-low .tp-play{width:26px;height:26px}
.mm-coach-empty{display:grid;justify-items:center;gap:8px;padding:28px 20px;text-align:center}
.mm-coach-empty b{font-size:15px;color:#fff;font-weight:600}
.mm-coach-empty p{margin:0;font-size:13px;color:var(--s8-fg-3)}
.mm-coach-empty s{display:block;width:min(260px,80%);height:6px;margin:6px 0 8px;border-radius:999px;background:var(--s8-inset);text-decoration:none;overflow:hidden}
.mm-coach-empty s i{display:block;height:100%;border-radius:999px;background:var(--s8-accent)}
.mm-sk-grades{display:grid;grid-template-columns:auto 1fr;gap:14px 18px;padding:22px 20px}
.mm-sk-grades b{grid-row:span 2;display:grid;place-items:center;width:64px;height:52px;border-radius:8px;background:rgba(62,162,242,.2);color:#7cc4ff;font-size:26px}
.mm-sk-grades div{display:grid;gap:8px}
.mm-sk-grades s{display:block;height:10px;border-radius:3px;background:var(--s8-line-3)}
.mm-sk-grades s+s{width:70%}
.mm-sk-grades i{display:block;height:10px;border-radius:999px;background:linear-gradient(90deg,var(--s8-up) 0 30%,#3ea2f2 30% 70%,var(--tp-gold) 70% 90%,var(--s8-down) 90%)}

/* trade row -> its Coach review, in place */
.tp-tr[data-mm-rv]{cursor:pointer}
.tp-tr.is-open{background:var(--s8-hover);border-bottom-color:transparent}
.mm-chev .tp-i{width:14px;height:14px;margin:0;transition:transform .2s}
.mm-chev.is-open .tp-i{transform:rotate(180deg)}
.tp-tr:hover .mm-chev{background:var(--s8-active);border-color:var(--s8-line-3);color:#fff}
.mm-rv{padding:18px 26px 22px 68px;background:var(--s8-hover);border-bottom:1px solid var(--s8-line)}
.mm-rv__go{display:flex;justify-content:flex-start;margin-top:22px}
@media (max-width:560px){.mm-rv{padding:14px 14px 18px}}

/* trades: forex rows don't open a replay */
.mm-noplay{visibility:hidden}

/* page actions */
.mm-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px}
.mm-actions .mm-pro{height:18px;padding:0 7px;font-size:10px}
.mm-danger{color:var(--s8-down);border-color:var(--s8-down-line);background:none}
.mm-danger:hover{background:var(--s8-down-tint);border-color:var(--s8-down)}
.mm-first{margin-top:14px}

/* reset modal */
.mm-modal{position:fixed;inset:0;z-index:1200;display:none;place-items:center;padding:16px;background:rgba(0,0,0,.7)}
.mm-modal.is-open{display:grid}
.mm-modal__card{width:100%;max-width:460px;padding:28px;border:1px solid var(--s8-line-2);border-top:2px solid var(--s8-down);border-radius:8px;background:var(--s8-panel);color:var(--s8-fg-2);font:400 14px/1.5 var(--s8-sans)}
.mm-modal__card h2{margin:0 0 12px;font-size:20px;font-weight:600;color:#fff}
.mm-modal__card p{margin:0 0 10px}
.mm-modal__card ul{margin:0 0 14px;padding-left:20px;color:var(--s8-fg-3)}
.mm-modal__warn{color:var(--s8-down);font-weight:600}
.mm-modal__note{font-size:13px;color:var(--s8-fg-3)}
.mm-modal__card label{display:block;margin-bottom:6px;font-size:13px;color:var(--s8-fg-3)}
.mm-modal__card label strong{color:var(--s8-down)}
.mm-modal__card input{width:100%;height:40px;margin-bottom:18px;padding:0 12px;border:1px solid var(--s8-line-2);border-radius:5px;background:var(--s8-inset);color:#fff;font:inherit}
.mm-modal__card input:focus{outline:none;border-color:var(--s8-down)}
.mm-modal__actions{display:flex;justify-content:flex-end;gap:10px}
.mm-danger--solid{border-color:transparent;background:var(--s8-down);color:#fff}
.mm-danger--solid:hover:not(:disabled){background:#ff8590;border-color:transparent}
.mm-danger--solid:disabled{opacity:.4;cursor:default}

@media (max-width:1000px){.mm-two{grid-template-columns:1fr}}
@media (max-width:640px){
    .mm-cal__h,.mm-cal__w{grid-template-columns:repeat(7,minmax(0,1fr))}
    .mm-cal__h span:last-child,.mm-cal__tot{display:none}
    .mm-cal__d{min-height:48px;padding:4px 5px}
    .mm-cal__d small{display:none}
    .mm-cal__d b{font-size:11px}
    .mm-cal__d em{left:5px;top:3px;font-size:10px}
    .mm-tt__h,.mm-tt__r{grid-template-columns:minmax(0,1fr) 54px 90px;padding:0 14px}
    .mm-tt__h span:nth-child(3),.mm-tt__r span:nth-child(3),.mm-tt__h span:nth-child(4),.mm-tt__r span:nth-child(4){display:none}
    .mm-sides{grid-template-columns:1fr}
    .mm-week__r{grid-template-columns:30px minmax(0,1fr) 56px}
    .mm-week__r small{display:none}
    .mm-tr__gr{width:auto}
    .mm-mist__r{grid-template-columns:minmax(0,1fr) auto}
    .mm-mist__l{grid-column:1/-1}
    .mm-low small{display:none}
}
