/* Michele's website: the few things it adds on top of Mark's own styles (mark-site.css, mark-sniper.css, mark-login.css -
   copied verbatim by tools/sync-from-mark.sh). Nothing here restyles his card, header or lists, so they keep looking
   exactly like his. */

/* ---- sign-in / setup ---- */
.sis-login .login-card label small { font-weight: 400; color: var(--subtle); }

/* ---- desk: her one PRO BOT card, full width, beside the pool list (botpage.css, under .sis-desk) ---- */
.sis-desk .bots { grid-template-columns: minmax(0, 1fr); }
.sis-desk .bot:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.sis-desk .bots > .bot { min-height: 0; }
.botpage-wait { display: block; margin-top: 4px; font-size: 13px; color: var(--fg); }
.sis-desk .nav .meta { font-variant-numeric: tabular-nums; }
.sis-desk .nav .meta.botpage-off { color: var(--danger); font-weight: 600; }
.botpage-foot { margin: 0; padding: 0 2px; font-size: 12px; color: var(--subtle); }

/* the pool list (Mark's .watch-list rows): a letter instead of a coin picture, and the bot's reason under each pool */
.tletter { font-family: var(--sans); }
.sis-desk .watch-list li.trow { row-gap: 2px; }
.sis-desk .watch-list li.trow .twhy { grid-column: 2 / -1; font-size: 12px; line-height: 1.35; color: var(--subtle); overflow-wrap: anywhere; }
.sis-desk .tnum b small { font-size: 11px; font-weight: 400; color: var(--subtle); }
.sis-watch-foot { margin: 0; padding: 10px 14px 12px; border-top: 1px solid var(--border); font-size: 11.5px; color: var(--subtle); }

/* ---- history: the table scrolls sideways on a phone instead of the page; the reason may wrap ---- */
.sis-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.sis-history .blotter td.sis-why { white-space: normal; min-width: 220px; color: var(--muted); }
.sis-history .blotter td small { color: var(--subtle); }

/* phone: Mark's header wraps as his does (clock included); only the Desk's "updated" note steps aside */
@media (max-width: 640px) {
  .sis-desk .nav .meta { display: none; }
}

/* Pretend-money experiments */
.sis-experiments .desk { max-width: 1120px; }
.exp-hero { position:relative; padding:34px 0 22px; }
.exp-safe { display:inline-block; padding:7px 11px; border-radius:999px; color:#174d35; background:#dff5e9; font-size:12px; font-weight:700; letter-spacing:.06em; }
.exp-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin:10px 0 18px; }
.exp-card { padding:20px; }
.exp-card .panel-head { align-items:flex-start; gap:12px; }
.exp-card h2 { margin:2px 0 0; }
.exp-proof { max-width:130px; padding:6px 9px; border-radius:10px; background:#f6e6c8; color:#745014; font-size:12px; font-weight:650; text-align:center; }
.exp-proof.ready { background:#dff5e9; color:#174d35; }
.exp-balance { display:grid; grid-template-columns:1fr auto; align-items:end; padding:18px; margin:16px 0; border-radius:15px; background:color-mix(in srgb,var(--accent) 10%,transparent); }
.exp-balance small { grid-column:1/-1; color:var(--subtle); }
.exp-balance strong { font-family:var(--serif); font-size:30px; }
.exp-stats { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin:0; }
.exp-stats div { padding:10px 0; border-bottom:1px solid var(--border); }
.exp-stats dt { color:var(--subtle); font-size:12px; }.exp-stats dd { margin:2px 0 0; font-weight:650; }
.exp-time,.exp-rules .muted { color:var(--subtle); font-size:13px; }.exp-rules { padding:20px; margin-bottom:30px; }
@media(max-width:760px){.exp-grid{grid-template-columns:1fr}.exp-hero{padding-top:22px}}
