/* 7.11 · THE MEMBER'S OWN THREAD (.mm-*) — the sheet behind the key in the app bar.
   Rides on .m-sheet (p1/styles.css) for the shell, the animation and the safe-area
   padding, so this file owns only the thread itself. Tier 3 app surfaces: cool
   neutrals, electric for HER side, the gym on white. */

.mm-key{margin-right:-2px}
.mm-sheet{background:var(--app-bg)}
.m-sheet-bar.mm-bar{gap:12px;align-items:center}
.mm-id{flex:1 1 auto;min-width:0}
.mm-id b{display:block;font-family:var(--font-cond);font-weight:900;text-transform:uppercase;font-size:17px;letter-spacing:.04em;line-height:1}
.mm-id span{display:block;font-family:var(--font-mono);font-size:9px;letter-spacing:.07em;text-transform:uppercase;color:var(--silver);margin-top:6px;text-wrap:pretty}

/* the thread scrolls; the bar and the dock do not */
.mm-th{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column;gap:12px;padding:16px 14px 20px;background:var(--app-bg)}
.mm-top{font-size:11.5px;line-height:1.5;color:var(--app-fg-subtle);text-align:center;text-wrap:pretty;padding:2px 18px 4px}
.mm-day{display:flex;align-items:center;gap:10px;margin:6px 0 2px}
.mm-day::before,.mm-day::after{content:"";flex:1 1 auto;height:1px;background:var(--app-border)}
.mm-day span{flex:0 0 auto;font-family:var(--font-mono);font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--app-fg-subtle)}

.mm-b{max-width:86%;display:flex;flex-direction:column;gap:5px}
.mm-b.them{align-self:flex-start;align-items:flex-start}
.mm-b.mine{align-self:flex-end;align-items:flex-end}
.mm-who{display:flex;align-items:baseline;gap:7px;padding:0 3px}
.mm-who b{font-size:12px;font-weight:700;color:var(--app-fg)}
.mm-who span{font-family:var(--font-mono);font-size:8.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--app-fg-subtle)}
.mm-bb{padding:11px 14px;font-size:14px;line-height:1.55;border-radius:4px 14px 14px 14px;background:var(--app-surface);border:1px solid var(--app-border);color:var(--app-fg);text-wrap:pretty}
.mm-b.mine .mm-bb{border-radius:14px 4px 14px 14px;background:var(--electric);border-color:var(--electric);color:#fff}
.mm-at{font-family:var(--font-mono);font-size:8.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--app-fg-subtle);padding:0 4px}

/* the card: a message that carries something she DOES */
.mm-card{width:min(300px,100%);background:var(--app-surface);border:1px solid var(--electric);border-radius:8px;overflow:hidden}
.mm-card-h{background:var(--electric-tint);border-bottom:1px solid var(--electric);padding:9px 13px;font-family:var(--font-mono);font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--electric-deep)}
.mm-card-rows{display:grid;gap:0;padding:4px 13px 10px}
.mm-card-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:8px 0 0;font-size:12.5px}
.mm-card-row+.mm-card-row{border-top:1px solid var(--app-border);margin-top:8px}
.mm-card-row span{color:var(--app-fg-muted)}
.mm-card-row b{font-family:var(--font-mono);font-size:12px;font-weight:700;color:var(--app-fg);text-align:right}
.mm-card-key{display:block;width:100%;background:var(--electric);color:#fff;border:0;border-top:1px solid var(--electric);padding:13px;font-family:var(--font-body);font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;min-height:46px;transition:background 120ms var(--ease)}
.mm-card-key:hover{background:var(--electric-hover)}
.mm-card-key:active{transform:translateY(1px)}
.mm-card-key.ghost{background:var(--app-surface);color:var(--electric-deep);border-top-color:var(--app-border)}
.mm-card-key.ghost:hover{background:var(--electric-tint)}
.mm-card-done{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px;border-top:1px solid var(--app-border);background:var(--turf-tint);color:var(--turf-deep);font-family:var(--font-mono);font-size:9.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase}

.mm-empty{margin:auto;padding:40px 26px;text-align:center;max-width:34ch}
.mm-empty b{display:block;font-family:var(--font-cond);font-weight:900;text-transform:uppercase;font-size:19px;letter-spacing:.03em;color:var(--app-fg)}
.mm-empty p{margin:9px 0 0;font-size:13px;line-height:1.55;color:var(--app-fg-muted);text-wrap:pretty}

/* the composer: no channel picker and no tag — that is the desk's business */
.mm-dock{flex:0 0 auto;display:flex;align-items:flex-end;gap:9px;padding:11px 12px calc(11px + env(safe-area-inset-bottom));background:var(--app-surface);border-top:1px solid var(--app-border)}
.mm-field{flex:1 1 auto;min-width:0;resize:none;max-height:110px;border:1px solid var(--app-border-strong);border-radius:20px;padding:12px 16px;font-family:var(--font-body);font-size:14px;line-height:1.45;color:var(--app-fg);background:var(--app-surface)}
.mm-field:focus{outline:none;border-color:var(--electric)}
.mm-send{flex:0 0 auto;width:46px;height:46px;display:flex;align-items:center;justify-content:center;border:0;border-radius:50%;background:var(--electric);color:#fff;cursor:pointer;transition:background 120ms var(--ease)}
.mm-send:hover{background:var(--electric-hover)}
.mm-send.off{background:var(--app-surface-sunk);color:var(--app-fg-subtle);cursor:not-allowed}
.mm-send.off:hover{background:var(--app-surface-sunk)}

/* [v7.62] a URL in a message body, tappable */
.mm-bb .mm-link{color:inherit;text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere}
/* [v8.35 · 23 Oct 2026, Adam] a link from the gym stands out: the brand blue, bold, on a light blue wash — not the body
   colour with an underline. On the member's own (blue) bubble it stays white, bold. */
.mm-b.them .mm-bb .mm-link{color:var(--electric,#075DC6);font-weight:700;background:rgba(7,93,198,.08);border-radius:3px;padding:0 3px;text-decoration-color:rgba(7,93,198,.45)}
.mm-b.mine .mm-bb .mm-link{color:#fff;font-weight:700}