/* ══ Personal timing (.mt-*) — js/pages/mytiming.js ══
   Design records: tools/harness/personal_timing_timeline.html (main view),
   personal_timing_dayboard.html (board + wall mode). Phone/tablet rules at the
   bottom — the page is reachable from the More sheet below 768px. */

#mt-root { padding: 0 20px 60px; max-width: 1240px; margin: 0 auto; }
.mt-loading { padding: 60px 0; text-align: center; color: #5a6678; }

/* ── topbar ── */
.mt-top { display: flex; align-items: center; gap: 12px 14px; flex-wrap: wrap; padding: 14px 0 10px; }
.mt-title {
  font-family: 'Barlow Condensed', sans-serif; font-size: 19px; font-weight: 800;
  letter-spacing: 1px; text-transform: uppercase;
}
.mt-evpin {
  display: inline-flex; align-items: center; gap: 8px;
  border: 1px solid rgba(var(--accent-rgb), 0.45);
  background: rgba(var(--accent-rgb), 0.07); border-radius: 9px; padding: 6px 13px;
}
.mt-evpin b {
  font-family: 'Barlow Condensed', sans-serif; font-size: 12.5px; font-weight: 700;
  letter-spacing: .6px; text-transform: uppercase; color: var(--accent);
}
.mt-evpin small { font-size: 11px; color: #7a8a9b; }
.mt-evpin-peek { border-color: #2a3040; background: #141820; }
.mt-evpin-peek b { color: #9aa7b8; }
.mt-pin-x { background: none; border: none; color: #5a6678; cursor: pointer; font-size: 12px; padding: 0 0 0 4px; }
.mt-pin-x:hover { color: #dce3ed; }
.mt-live-dot {
  width: 7px; height: 7px; border-radius: 50%; background: var(--accent);
  box-shadow: 0 0 8px rgba(var(--accent-rgb), 0.8);
}
.mt-topr { margin-left: auto; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.mt-seg { display: flex; background: #0f1318; border: 1px solid #1a1f28; border-radius: 10px; padding: 3px; }
.mt-seg button {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 30px; border: none; border-radius: 7px; background: none;
  color: #7a8a9b; cursor: pointer;
}
.mt-seg button:hover { color: #dce3ed; }
.mt-seg button.on { background: rgba(var(--accent-rgb), 0.12); color: var(--accent); }
.mt-seg .material-symbols-outlined { font-size: 19px; }
.mt-ghost {
  display: inline-flex; align-items: center; gap: 6px; cursor: pointer;
  border: 1px solid #2a3040; border-radius: 9px; background: #141820; color: #9aa7b8;
  font-family: 'Barlow Condensed', sans-serif; font-size: 12px; font-weight: 700;
  letter-spacing: .6px; text-transform: uppercase; padding: 7px 12px;
}
.mt-ghost:hover { border-color: #7a8a9b; color: #dce3ed; }
.mt-ghost .material-symbols-outlined { font-size: 17px; }
.mt-cars { display: flex; gap: 3px; background: #0f1318; border: 1px solid #1a1f28; border-radius: 10px; padding: 3px; }
.mt-car {
  display: flex; flex-direction: column; align-items: center; gap: 2px;
  padding: 4px 15px 6px; border-radius: 8px; color: #7a8a9b;
  background: none; border: none; cursor: pointer; font: inherit;
}
.mt-car b {
  font-family: 'Barlow Condensed', sans-serif; font-size: 15px; font-weight: 800;
  letter-spacing: .5px; line-height: 1; color: #dce3ed;
}
.mt-car small { font-size: 9.5px; color: #5a6678; }
.mt-car.active { background: rgba(var(--accent-rgb), 0.1); }
.mt-car.active b { color: var(--accent); }
.mt-car-all { justify-content: center; font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase; }
/* A car entered at this event that is NOT on your crew-list row. It is offered
   — a driver in two cars, a mechanic covering the sister car — but quieter,
   because this board is yours first. Full strength once it IS what's on screen
   (the same treatment Pit Box gives the cars you are not crewed on). */
.mt-car-oth { opacity: .5; }
.mt-car-oth:hover, .mt-car-oth.active { opacity: 1; }
.mt-car-sep { width: 1px; align-self: stretch; margin: 3px 3px; background: #232a35; }

.mt-body { display: flex; flex-direction: column; gap: 13px; }

/* ── tabs: Timing | Track jobs ── */
.mt-tabs { display: flex; gap: 4px; border-bottom: 1px solid #1f2530; margin-bottom: 13px; }
.mt-tab {
  display: inline-flex; align-items: center; gap: 7px; cursor: pointer;
  background: none; border: none; border-bottom: 2px solid transparent;
  padding: 7px 13px 9px; margin-bottom: -1px; color: #7a8a9b;
  font-family: 'Barlow Condensed', sans-serif; font-size: 13.5px; font-weight: 800;
  letter-spacing: .8px; text-transform: uppercase;
}
.mt-tab:hover { color: #dce3ed; }
.mt-tab.on { color: var(--accent); border-bottom-color: var(--accent); }
.mt-tab .material-symbols-outlined { font-size: 17px; }
.mt-tab-n {
  min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(var(--accent-rgb), 0.16); color: var(--accent);
  font-size: 11px; letter-spacing: 0;
}
.mt-tab.on .mt-tab-n { background: var(--accent); color: #0b0e05; }

/* ── track jobs tab ── */
.mt-jlane + .mt-jlane { margin-top: 16px; }
.mt-jlane-h { display: flex; align-items: baseline; gap: 10px; padding: 0 2px 7px; }
.mt-jlane-t {
  font-family: 'Barlow Condensed', sans-serif; font-size: 13px; font-weight: 800;
  letter-spacing: .8px; text-transform: uppercase; color: #9aa7b8;
}
.mt-jlane-t.up { color: var(--accent); }
.mt-jlane-s { font-size: 11.5px; color: #5a6678; }
.mt-jcards { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 8px; }
.mt-jcard {
  display: flex; flex-direction: column; align-items: stretch; gap: 7px;
  text-align: left; cursor: pointer; font: inherit; color: inherit;
  border: 1px solid #1f2530; border-radius: 10px; background: #10141a;
  padding: 10px 12px; box-shadow: inset 3px 0 0 #2a3040;
}
.mt-jcard:hover { border-color: #7a8a9b; }
.mt-jcard.live { box-shadow: inset 3px 0 0 rgba(var(--accent-rgb), 0.7); }
.mt-jcard.blk { box-shadow: inset 3px 0 0 #ef4444; }
.mt-jcard.done { opacity: .45; }
.mt-jr1 { display: flex; align-items: center; gap: 8px; min-width: 0; }
.mt-jbadge {
  font-family: 'Barlow Condensed', sans-serif; font-size: 11.5px; font-weight: 800;
  letter-spacing: .6px; padding: 2px 7px; border-radius: 5px;
  background: rgba(var(--accent-rgb), 0.14); color: var(--accent); flex: 0 0 auto;
}
.mt-jtitle {
  font-size: 13px; font-weight: 600; color: #dce3ed;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.mt-jr2 { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.mt-jst {
  font-family: 'Barlow Condensed', sans-serif; font-size: 10.5px; font-weight: 800;
  letter-spacing: .7px; text-transform: uppercase; padding: 2px 8px; border-radius: 5px;
  background: #1a1f28; color: #7a8a9b;
}
.mt-jst.live { background: rgba(var(--accent-rgb), 0.14); color: var(--accent); }
.mt-jst.blocked { background: rgba(239, 68, 68, 0.14); color: #ef4444; }
.mt-jst.done { background: rgba(74, 200, 164, 0.13); color: #4ac8a4; }
.mt-jmeta { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; color: #7a8a9b; }
.mt-jmeta .material-symbols-outlined { font-size: 14px; }
.mt-jreason { font-size: 11.5px; color: #ef8f8f; }

/* ── hero ── */
.mt-hero {
  display: grid; grid-template-columns: 1fr auto; gap: 20px; align-items: center;
  border: 1px solid rgba(var(--accent-rgb), 0.35); border-radius: 14px;
  background: linear-gradient(120deg, rgba(var(--accent-rgb), 0.09), rgba(var(--accent-rgb), 0.02) 55%);
  padding: 16px 20px;
}
.mt-hx small {
  font-family: 'Barlow Condensed', sans-serif; font-size: 10.5px; font-weight: 700;
  letter-spacing: 1.2px; text-transform: uppercase; color: #7a8a9b;
}
.mt-hx h2 {
  font-family: 'Barlow Condensed', sans-serif; font-size: 24px; font-weight: 800;
  letter-spacing: .6px; text-transform: uppercase; line-height: 1.1; margin: 2px 0 4px;
}
.mt-hx p { color: #9aa7b8; font-size: 12.5px; margin: 0; }
.mt-hacts { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.mt-hbtn {
  display: inline-flex; align-items: center; gap: 6px; cursor: pointer;
  border: 1px solid #2a3040; border-radius: 9px; background: #141820; color: #dce3ed;
  font-family: 'Barlow Condensed', sans-serif; font-size: 12px; font-weight: 700;
  letter-spacing: .6px; text-transform: uppercase; padding: 7px 13px;
}
.mt-hbtn:hover { border-color: #7a8a9b; }
.mt-hbtn-acc { background: var(--accent); border-color: var(--accent); color: #0b0e05; }
.mt-hbtn-acc:hover { border-color: var(--accent); filter: brightness(1.06); }
/* Briefing chip: read it as a document, or replay it as slides — the same pick
   the driver portal offers. One control, so it reads as one destination. */
/* Subscribe sheet — hangs off <body>, because .main-content is
   position:relative;z-index:1 and would lose to the bottom nav (z 100). */
.mt-calsheet {
  position: fixed; inset: 0; z-index: 400; display: flex;
  align-items: center; justify-content: center; padding: 20px;
  background: rgba(4, 7, 12, 0.62); overflow-y: auto;
}
.mt-cal-card {
  width: min(460px, 100%); margin: auto; background: #10141b;
  border: 1px solid #2a3040; border-radius: 14px; padding: 16px 18px 14px;
  box-shadow: 0 24px 60px rgba(0,0,0,.55); display: flex; flex-direction: column; gap: 10px;
}
.mt-cal-head { display: flex; align-items: center; justify-content: space-between; }
.mt-cal-head b {
  font-family: 'Barlow Condensed', sans-serif; font-size: 17px; font-weight: 800;
  letter-spacing: .8px; text-transform: uppercase; color: #dce3ed;
}
.mt-cal-lede { margin: 0; font-size: 12.5px; color: #9aa7b8; line-height: 1.45; }
.mt-cal-row { display: flex; gap: 8px; flex-wrap: wrap; }
.mt-cal-row .mt-hbtn { text-decoration: none; }
.mt-cal-url {
  display: block; font-size: 11px; color: #7a8a9b; background: #0b0e13;
  border: 1px solid #232a36; border-radius: 8px; padding: 7px 9px;
  word-break: break-all; font-family: ui-monospace, Menlo, Consolas, monospace;
}
.mt-cal-note { margin: 0; font-size: 11.5px; color: #6b7a8d; line-height: 1.45; }
.mt-cal-alt {
  background: none; border: none; color: #7a8a9b; cursor: pointer; padding: 4px 0 0;
  font-size: 12px; text-decoration: underline; text-align: left;
}
.mt-cal-alt:hover { color: #dce3ed; }
.mt-updated {
  display: inline-flex; align-items: center; gap: 5px; border-radius: 9px;
  border: 1px solid rgba(251,191,36,.4); background: rgba(251,191,36,.1); color: #fbbf24;
  font-family: 'Barlow Condensed', sans-serif; font-size: 11.5px; font-weight: 700;
  letter-spacing: .5px; text-transform: uppercase; padding: 5px 10px;
}
.mt-updated .material-symbols-outlined { font-size: 14px; }
.mt-briefsplit { display: inline-flex; }
.mt-briefsplit .mt-hbtn { border-radius: 9px 0 0 9px; }
.mt-briefsplit .mt-hbtn-ico { border-radius: 0 9px 9px 0; border-left: none; padding: 7px 9px; }
.mt-hbtn-ico .material-symbols-outlined { font-size: 16px; }
.mt-hside { display: flex; align-items: center; gap: 22px; }
.mt-hcd { display: flex; flex-direction: column; align-items: center; }
.mt-hcd b {
  font-family: 'Barlow Condensed', sans-serif; font-size: 38px; font-weight: 800;
  color: var(--accent); line-height: 1; font-variant-numeric: tabular-nums; white-space: nowrap;
}
.mt-hcd small {
  font-family: 'Barlow Condensed', sans-serif; font-size: 10px; font-weight: 700;
  letter-spacing: 1.2px; text-transform: uppercase; color: #7a8a9b;
}
.mt-hwx { display: flex; flex-direction: column; gap: 2px; border-left: 1px solid #1f2530; padding-left: 20px; }
.mt-hwx b { font-family: 'Barlow Condensed', sans-serif; font-size: 15px; font-weight: 700; }
.mt-hwx small { font-size: 10.5px; color: #5a6678; }

/* ── sub row: blurb + role toggle ── */
.mt-sub { display: flex; align-items: flex-start; gap: 16px; flex-wrap: wrap; }
.mt-sub p { flex: 1; min-width: 240px; font-size: 12.5px; color: #7a8a9b; max-width: 72ch; margin: 0; }
.mt-sub p b { color: #dce3ed; font-weight: 600; }
.mt-tog {
  display: inline-flex; align-items: center; gap: 6px; cursor: pointer;
  border: 1px solid #2a3040; border-radius: 9px; background: #141820; color: #9aa7b8;
  font-family: 'Barlow Condensed', sans-serif; font-size: 12.5px; font-weight: 700;
  letter-spacing: .6px; text-transform: uppercase; padding: 7px 13px;
}
.mt-tog:hover { border-color: #7a8a9b; color: #dce3ed; }
.mt-tog.on { border-color: rgba(var(--accent-rgb), 0.5); color: var(--accent);
  background: rgba(var(--accent-rgb), 0.1); }
.mt-tog .material-symbols-outlined { font-size: 17px; }

/* ── day chips ── */
.mt-days { display: flex; gap: 6px; flex-wrap: wrap; }
.mt-dchip {
  display: flex; flex-direction: column; align-items: center; gap: 3px;
  border: 1px solid #2a3040; border-radius: 10px; background: #141820;
  padding: 6px 14px; color: #7a8a9b; cursor: pointer; font: inherit;
}
.mt-dchip b {
  font-family: 'Barlow Condensed', sans-serif; font-size: 13px; font-weight: 800;
  letter-spacing: .5px; text-transform: uppercase; color: #9aa7b8;
}
.mt-dchip.on { border-color: rgba(var(--accent-rgb), 0.5); background: rgba(var(--accent-rgb), 0.08); }
.mt-dchip.on b { color: var(--accent); }
.mt-dots { display: flex; gap: 3px; }
.mt-dt { width: 5px; height: 5px; border-radius: 50%; background: #5a6678; }
.mt-dt.me { background: var(--accent); }
.mt-dt.ses { background: #8ab4f8; }

/* ── timeline rail ── */
.mt-rail {
  position: relative; border: 1px solid #1f2530; border-radius: 12px;
  background: #10141a; padding: 6px 0 10px;
}
.mt-rail::before {
  content: ''; position: absolute; left: 117px; top: 14px; bottom: 14px;
  width: 2px; background: #171c24;
}
.mt-rrow {
  display: grid; grid-template-columns: 86px 14px 1fr auto; gap: 0 12px;
  align-items: center; padding: 9px 16px 9px 14px;
}
.mt-rrow + .mt-rrow { border-top: 1px solid #171c24; }
/* Track time reads differently from paddock lines — same accent family as the
   SESSION chip and the board's .mt-blk.ses. Declared BEFORE .isnow/.isnext so
   those state washes still win on the shared background property. */
.mt-rrow.ses {
  background: linear-gradient(90deg, rgba(var(--accent-rgb), 0.07), rgba(var(--accent-rgb), 0.015));
  box-shadow: inset 3px 0 0 rgba(var(--accent-rgb), 0.5);
}
.mt-rrow.ses .mt-knot { border-color: rgba(var(--accent-rgb), 0.65); }
.mt-rt {
  display: flex; flex-direction: column; text-align: right;
  font-family: 'Barlow Condensed', sans-serif; font-size: 16px; font-weight: 700;
  letter-spacing: .5px; font-variant-numeric: tabular-nums;
}
.mt-rt small { font-size: 11px; font-weight: 600; font-family: 'Barlow', sans-serif; color: #5a6678; }
.mt-plus { color: var(--accent); }
.mt-knot {
  width: 11px; height: 11px; border-radius: 50%; border: 2px solid #2a3040;
  background: #10141a; justify-self: center; position: relative; z-index: 1;
}
.mt-rrow.past { opacity: .45; }
.mt-rrow.past .mt-knot { background: #2a3040; }
.mt-rrow.isnow .mt-knot { border-color: #ef4444; background: #ef4444; box-shadow: 0 0 10px rgba(239, 68, 68, .6); }
.mt-rrow.isnext .mt-knot { border-color: var(--accent); background: var(--accent); }
.mt-rrow.isnow { background: rgba(239, 68, 68, 0.06); }
.mt-rrow.isnext { background: rgba(var(--accent-rgb), 0.05); }
.mt-rrow.notmine { opacity: .55; }
.mt-rn { display: flex; flex-direction: column; gap: 2px; font-size: 13.5px; }
.mt-rn small { font-size: 11.5px; color: #7a8a9b; }
.mt-rm { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.mt-where { font-size: 11.5px; color: #7a8a9b; }
.mt-chip {
  font-size: 10px; letter-spacing: .6px; text-transform: uppercase;
  padding: 2px 7px; border-radius: 5px; background: #1a1f28; color: #7a8a9b;
}
.mt-chip-ses { background: rgba(var(--accent-rgb), 0.12); color: var(--accent); }
.mt-chip-win { background: rgba(138, 180, 248, 0.14); color: #8ab4f8; }
.mt-chip-trv { background: rgba(74, 200, 164, 0.13); color: #4ac8a4; }
.mt-chip-oth { background: rgba(224, 166, 75, 0.14); color: #e0a64b; }
.mt-carchip {
  font-family: 'Barlow Condensed', sans-serif; font-size: 11px; font-weight: 700;
  letter-spacing: .5px; padding: 2px 8px; border-radius: 5px; background: #1a1f28; color: #9aa7b8;
}
.mt-state {
  font-family: 'Barlow Condensed', sans-serif; font-size: 11px; font-weight: 800;
  letter-spacing: .8px; text-transform: uppercase; padding: 3px 9px; border-radius: 6px;
}
.mt-state-now { background: #ef4444; color: #fff; }
.mt-state-next { background: rgba(var(--accent-rgb), 0.16); color: var(--accent); }
.mt-bell {
  display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: 7px; border: 1px solid #2a3040;
  background: #141820; color: #5a6678; cursor: pointer;
}
.mt-bell .material-symbols-outlined { font-size: 15px; }
.mt-bell:hover { color: #dce3ed; border-color: #7a8a9b; }
.mt-bell.on { border-color: rgba(var(--accent-rgb), 0.5); color: var(--accent);
  background: rgba(var(--accent-rgb), 0.08); }
.mt-nowline { position: relative; height: 0; border-top: 2px solid #ef4444; margin: 0 12px 0 96px; z-index: 2; }
.mt-nowline i { position: absolute; left: -6px; top: -5px; width: 8px; height: 8px; border-radius: 50%; background: #ef4444; }
.mt-nowline b {
  position: absolute; right: 0; top: -18px;
  font-family: 'Barlow Condensed', sans-serif; font-size: 10px; font-weight: 800;
  letter-spacing: .8px; color: #ef4444; background: #090b0e; padding: 1px 6px; border-radius: 4px;
}
.mt-none { padding: 20px 16px; color: #5a6678; font-size: 12.5px; }

/* ── briefing tab ──
   The document itself is rendered by administration-briefings.js (.admb-doc),
   whose styles are page-agnostic — only the picker above it and the host's own
   width belong here. */
.mt-briefhost { min-height: 200px; }
.mt-briefhost .admb-doc { max-width: 820px; margin: 0; }
.mt-bfpick { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 4px; }
.mt-bfchip {
  display: flex; flex-direction: column; align-items: flex-start; gap: 1px;
  padding: 7px 13px; cursor: pointer; text-align: left;
  background: #10141a; border: 1px solid #1f2530; border-radius: 9px; color: #7a8a9b;
}
.mt-bfchip:hover { border-color: #2e3646; color: #dce3ed; }
.mt-bfchip b {
  font-family: 'Barlow Condensed', sans-serif; font-size: 13.5px; font-weight: 800;
  letter-spacing: .5px; color: #dce3ed;
}
.mt-bfchip small { font-size: 11px; color: #5a6678; }
.mt-bfchip.on { border-color: var(--accent); background: rgba(var(--accent-rgb), 0.08); }
.mt-bfchip.on b { color: var(--accent); }

/* ── day board ── */
.mt-board { border: 1px solid #1f2530; border-radius: 12px; background: #10141a; overflow-x: auto; }
.mt-bhead { display: grid; border-bottom: 1px solid #1f2530; background: #0f1318; min-width: 560px; }
.mt-lh {
  padding: 8px 12px; font-family: 'Barlow Condensed', sans-serif; font-size: 13px;
  font-weight: 800; letter-spacing: .8px; text-transform: uppercase;
  display: flex; align-items: center; gap: 8px; border-left: 1px solid #1f2530;
}
.mt-lh small { font-family: 'Barlow', sans-serif; font-size: 10px; font-weight: 600;
  letter-spacing: .4px; color: #5a6678; text-transform: none; }
.mt-bgrid { display: grid; position: relative; min-width: 560px; }
.mt-gut { position: relative; border-right: 1px solid #171c24; }
.mt-gut span {
  position: absolute; right: 8px; transform: translateY(-6px);
  font-size: 10.5px; font-weight: 600; color: #5a6678; font-variant-numeric: tabular-nums;
}
.mt-lane { position: relative; border-right: 1px solid #171c24; }
.mt-lane:last-of-type { border-right: none; }
.mt-hline { position: absolute; left: 0; right: 0; height: 1px; background: #171c24; }
.mt-blk {
  position: absolute; left: 7px; right: 7px; border-radius: 8px; padding: 5px 10px;
  overflow: hidden; border: 1px solid #2a3040; background: #141820;
}
.mt-blk b {
  display: block; font-family: 'Barlow Condensed', sans-serif; font-size: 12.5px;
  font-weight: 700; letter-spacing: .4px; text-transform: uppercase; line-height: 1.15;
}
.mt-blk small { font-size: 10.5px; color: #7a8a9b; }
.mt-blk.ses { border-color: rgba(var(--accent-rgb), 0.4); background: rgba(var(--accent-rgb), 0.08); }
.mt-blk.ses b { color: var(--accent); }
.mt-blk.now { border-color: #ef4444; box-shadow: 0 0 0 1px #ef4444 inset; }
.mt-blk.notmine { opacity: .5; }
.mt-blk.win {
  background: repeating-linear-gradient(135deg, rgba(138, 180, 248, .07),
    rgba(138, 180, 248, .07) 6px, transparent 6px, transparent 12px);
  border: 1px dashed rgba(138, 180, 248, .4);
}
.mt-blk.win b { color: #8ab4f8; }
.mt-bnow { position: absolute; left: 52px; right: 0; height: 0; border-top: 2px solid #ef4444; z-index: 3; }
.mt-bnow b {
  position: absolute; left: 8px; top: -18px;
  font-family: 'Barlow Condensed', sans-serif; font-size: 10px; font-weight: 800;
  letter-spacing: .8px; color: #ef4444; background: #090b0e; padding: 1px 6px; border-radius: 4px;
}
.mt-clash {
  position: absolute; left: 50%; transform: translateX(-50%); z-index: 2;
  font-family: 'Barlow Condensed', sans-serif; font-size: 10px; font-weight: 800;
  letter-spacing: .6px; text-transform: uppercase;
  background: #e0a64b; color: #1a1206; border-radius: 5px; padding: 2px 7px;
}
.mt-untimed { font-size: 12px; color: #5a6678; padding: 2px 4px; }

/* ── wall mode ── */
.mt-wall {
  position: fixed; inset: 0; z-index: 4000; background: #07090c; cursor: pointer;
  display: flex; flex-direction: column; gap: 18px; padding: 4vh 5vw;
  overflow-y: auto;
}
.mt-whead { display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; }
.mt-whead h2 {
  font-family: 'Barlow Condensed', sans-serif; font-size: clamp(22px, 3.4vw, 34px);
  font-weight: 800; letter-spacing: 1.2px; text-transform: uppercase; color: #dce3ed;
}
.mt-whead small {
  font-family: 'Barlow Condensed', sans-serif; font-size: clamp(11px, 1.4vw, 14px);
  font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: #7a8a9b;
}
.mt-wclock {
  margin-left: auto; font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(30px, 5vw, 52px); font-weight: 800; color: var(--accent);
  font-variant-numeric: tabular-nums; line-height: 1;
}
.mt-wrow {
  display: grid; grid-template-columns: minmax(110px, 170px) 1fr auto; gap: 24px;
  align-items: center; border: 1px solid #1f2530; border-radius: 16px;
  background: #10141a; padding: clamp(14px, 2.4vh, 22px) clamp(16px, 2.6vw, 28px);
}
.mt-wrow.hot { border-color: #ef4444; }
.mt-wrow.up { border-color: rgba(var(--accent-rgb), 0.45); background: rgba(var(--accent-rgb), 0.05); }
.mt-wt {
  font-family: 'Barlow Condensed', sans-serif; font-size: clamp(30px, 4.6vw, 48px);
  font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1; color: #dce3ed;
}
.mt-wrow.hot .mt-wt { color: #ef4444; }
.mt-wrow.up .mt-wt { color: var(--accent); }
.mt-wn b {
  display: block; font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(20px, 3vw, 30px); font-weight: 800; letter-spacing: .6px;
  text-transform: uppercase; line-height: 1.1; color: #dce3ed;
}
.mt-wn small { font-size: clamp(12px, 1.5vw, 15px); font-weight: 600; color: #7a8a9b; }
.mt-wtag {
  font-family: 'Barlow Condensed', sans-serif; font-size: clamp(12px, 1.5vw, 15px);
  font-weight: 800; letter-spacing: 1px; text-transform: uppercase;
  padding: 8px 16px; border-radius: 10px; white-space: nowrap;
}
.mt-wtag.now { background: #ef4444; color: #fff; }
.mt-wtag.next { background: var(--accent); color: #0b0e05; }
.mt-wtag.later { background: #1a1f28; color: #7a8a9b; }
.mt-wfoot { font-size: 13px; font-weight: 600; color: #5a6678; text-align: center; margin-top: auto; }
.mt-wrow.done { opacity: .38; }
/* the control bar is the one surface a tap must NOT leave the wall from */
.mt-wbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; cursor: default; }
.mt-wbar button {
  font-family: 'Barlow Condensed', sans-serif; font-size: clamp(12px, 1.5vw, 15px);
  font-weight: 800; letter-spacing: 1px; text-transform: uppercase;
  padding: 8px 14px; border-radius: 10px; border: 1px solid #1f2530;
  background: #10141a; color: #7a8a9b; cursor: pointer; min-height: 38px;
}
.mt-wbar button.on {
  border-color: rgba(var(--accent-rgb), 0.5); color: var(--accent);
  background: rgba(var(--accent-rgb), 0.08);
}
.mt-wsp { flex: 1; }

/* ── idle (no live event) ── */
.mt-idle {
  border: 1px solid #1f2530; border-radius: 14px; background: #10141a;
  padding: 44px 30px; display: flex; flex-direction: column; align-items: center;
  gap: 8px; text-align: center; margin-top: 8px;
}
.mt-idle h2 {
  font-family: 'Barlow Condensed', sans-serif; font-size: 21px; font-weight: 800;
  letter-spacing: 1px; text-transform: uppercase;
}
.mt-idle p { color: #7a8a9b; font-size: 13px; max-width: 52ch; margin: 0; }
.mt-nextev {
  margin-top: 16px; display: flex; align-items: center; gap: 16px; cursor: pointer;
  border: 1px solid rgba(var(--accent-rgb), 0.4); background: rgba(var(--accent-rgb), 0.06);
  border-radius: 12px; padding: 14px 20px; text-align: left; font: inherit; color: inherit;
}
.mt-nextev:hover { background: rgba(var(--accent-rgb), 0.11); }
.mt-cd { display: flex; flex-direction: column; align-items: center; min-width: 76px; }
.mt-cd b {
  font-family: 'Barlow Condensed', sans-serif; font-size: 26px; font-weight: 800;
  color: var(--accent); line-height: 1; font-variant-numeric: tabular-nums;
}
.mt-cd small {
  font-family: 'Barlow Condensed', sans-serif; font-size: 10px; font-weight: 700;
  letter-spacing: 1px; text-transform: uppercase; color: #7a8a9b;
}
.mt-nx b {
  display: block; font-family: 'Barlow Condensed', sans-serif; font-size: 15px;
  font-weight: 700; letter-spacing: .6px; text-transform: uppercase;
}
.mt-nx small { color: #7a8a9b; font-size: 12px; }
.mt-go {
  display: block; margin-top: 4px; font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase;
  color: var(--accent);
}

/* ── tablet ── */
@media (max-width: 900px) {
  .mt-hero { grid-template-columns: 1fr; gap: 12px; }
  .mt-hside { border-top: 1px solid rgba(var(--accent-rgb), 0.15); padding-top: 12px; }
  .mt-hwx { border-left: none; padding-left: 0; flex-direction: row; gap: 10px; align-items: baseline; }
}

/* ── phone ── */
@media (max-width: 600px) {
  #mt-root { padding: 0 12px 90px; }
  .mt-top { padding-top: 10px; }
  .mt-topr { margin-left: 0; width: 100%; }
  .mt-ghost-t { display: none; }               /* icon-only "Add to calendar" */
  /* the switcher can now hold every car at the event — it wraps rather than
     pushing the page sideways */
  .mt-cars { margin-left: auto; flex-wrap: wrap; justify-content: flex-end; max-width: 100%; }
  .mt-car { padding: 4px 11px 6px; }
  .mt-rrow { grid-template-columns: 62px 12px 1fr; }
  .mt-rail::before { left: 89px; }
  .mt-nowline { margin-left: 72px; }
  .mt-rm { grid-column: 3; justify-content: flex-start; padding-left: 0; }
  .mt-rt { font-size: 15px; }
  .mt-hx h2 { font-size: 20px; }
  .mt-hcd b { font-size: 30px; }
  .mt-days { overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; padding-bottom: 2px; }
  .mt-days::-webkit-scrollbar { display: none; }
  .mt-dchip { flex: 0 0 auto; }
  .mt-wall { padding: 3vh 4vw calc(3vh + env(safe-area-inset-bottom)); }
  .mt-wrow { grid-template-columns: 84px 1fr; gap: 12px; }
  .mt-wtag { grid-column: 2; justify-self: start; }
  .mt-bell { width: 34px; height: 34px; }      /* touch target */
  .mt-tog, .mt-hbtn, .mt-ghost { min-height: 38px; }
  .mt-tab { min-height: 40px; }                /* touch target */
  .mt-bfchip { min-height: 44px; flex: 1 1 auto; }
  .mt-briefhost .admb-doc { max-width: 100%; }
  .mt-jcards { grid-template-columns: 1fr; }
}

/* ── light mode ── */
body.light-mode .mt-rail, body.light-mode .mt-board, body.light-mode .mt-idle {
  background: #ffffff; border-color: #e8ecf2;
}
body.light-mode .mt-bhead { background: #f8f9fc; border-color: #e8ecf2; }
body.light-mode .mt-lh { border-color: #e8ecf2; color: #1a2030; }
body.light-mode .mt-rrow + .mt-rrow, body.light-mode .mt-hline,
body.light-mode .mt-gut, body.light-mode .mt-lane { border-color: #eef1f6; }
body.light-mode .mt-rail::before { background: #eef1f6; }
body.light-mode .mt-rt, body.light-mode .mt-rn, body.light-mode .mt-title,
body.light-mode .mt-idle h2, body.light-mode .mt-hx h2, body.light-mode .mt-dchip.on b,
body.light-mode .mt-nx b { color: #1a2030; }
body.light-mode .mt-knot { background: #ffffff; border-color: #cdd5e0; }
body.light-mode .mt-rrow.isnow .mt-knot { background: #ef4444; border-color: #ef4444; }
body.light-mode .mt-rrow.isnext .mt-knot { background: var(--accent); border-color: var(--accent); }
body.light-mode .mt-blk { background: #f8f9fc; border-color: #dde2ec; }
body.light-mode .mt-blk b { color: #1a2030; }
body.light-mode .mt-chip, body.light-mode .mt-carchip, body.light-mode .mt-dt {
  background: #eef1f6; color: #6b7a8d;
}
body.light-mode .mt-dt.me { background: #5b7a00; }
body.light-mode .mt-dt.ses { background: #3b82f6; }
body.light-mode .mt-chip-ses { background: rgba(155, 204, 26, 0.15); color: #5b7a00; }
body.light-mode .mt-chip-win { background: rgba(59, 130, 246, 0.1); color: #2563eb; }
body.light-mode .mt-chip-trv { background: rgba(13, 148, 118, 0.1); color: #0d9476; }
body.light-mode .mt-chip-oth { background: rgba(180, 120, 20, 0.1); color: #b47814; }
body.light-mode .mt-evpin b, body.light-mode .mt-hcd b, body.light-mode .mt-go,
body.light-mode .mt-cd b, body.light-mode .mt-state-next, body.light-mode .mt-tog.on,
body.light-mode .mt-seg button.on, body.light-mode .mt-dchip.on b, body.light-mode .mt-plus,
body.light-mode .mt-blk.ses b { color: #5b7a00; }
/* The "upcoming" peek pin hard-codes a dark pill; without these it stayed black
   on the light page (and its ✕ hovered to near-white on white). Placed AFTER the
   .mt-evpin b rule above — same specificity, so source order decides. */
body.light-mode .mt-cal-card { background: #ffffff; border-color: #dde2ec; }
body.light-mode .mt-cal-head b { color: #1a2030; }
body.light-mode .mt-cal-lede { color: #4a5768; }
body.light-mode .mt-cal-url { background: #f5f7fb; border-color: #e8ecf2; color: #6b7a8d; }
body.light-mode .mt-cal-note, body.light-mode .mt-cal-alt { color: #8899aa; }
body.light-mode .mt-cal-alt:hover { color: #1a2030; }
body.light-mode .mt-updated { background: #fdf6e0; border-color: #ecd990; color: #8a6d1f; }
body.light-mode .mt-evpin-peek { background: #ffffff; border-color: #dde2ec; }
body.light-mode .mt-evpin-peek b { color: #6b7a8d; }
body.light-mode .mt-evpin small { color: #8899aa; }
body.light-mode .mt-pin-x { color: #b0b8c4; }
body.light-mode .mt-pin-x:hover { color: #1a2030; }
body.light-mode .mt-ghost, body.light-mode .mt-tog, body.light-mode .mt-hbtn,
body.light-mode .mt-dchip, body.light-mode .mt-bell {
  background: #ffffff; border-color: #dde2ec; color: #6b7a8d;
}
body.light-mode .mt-hbtn { color: #1a2030; }
body.light-mode .mt-hbtn-acc { background: var(--accent); border-color: var(--accent); color: #1a2400; }
body.light-mode .mt-seg, body.light-mode .mt-cars { background: #f7f9fc; border-color: #e8ecf2; }
body.light-mode .mt-car b { color: #1a2030; }
body.light-mode .mt-car-sep { background: #e2e7ef; }
body.light-mode .mt-hero { border-color: rgba(155, 204, 26, 0.4); }
body.light-mode .mt-sub p, body.light-mode .mt-hx p, body.light-mode .mt-idle p { color: #6b7a8d; }
body.light-mode .mt-nowline b, body.light-mode .mt-bnow b { background: #f4f6f9; }
/* wall mode followed the app theme from 2026-08-16 on (user's ask — it used to
   stay dark on purpose) */
body.light-mode .mt-wall { background: #f2f4f8; }
body.light-mode .mt-whead h2, body.light-mode .mt-wt, body.light-mode .mt-wn b { color: #1a2030; }
body.light-mode .mt-wrow { background: #ffffff; border-color: #e2e7ef; }
body.light-mode .mt-wrow.hot { border-color: #ef4444; }
body.light-mode .mt-wrow.hot .mt-wt { color: #ef4444; }
body.light-mode .mt-wrow.up .mt-wt, body.light-mode .mt-wclock { color: #5b7a00; }
body.light-mode .mt-wtag.next { background: #5b7a00; color: #ffffff; }
body.light-mode .mt-wtag.later { background: #e8ecf2; color: #6b7a8d; }
body.light-mode .mt-wbar button { background: #ffffff; border-color: #dfe4ec; color: #6b7a8d; }
body.light-mode .mt-wbar button.on {
  border-color: rgba(155, 204, 26, 0.55); background: rgba(155, 204, 26, 0.12); color: #5b7a00;
}
body.light-mode .mt-wfoot { color: #8899aa; }

/* track jobs tab */
body.light-mode .mt-tabs { border-color: #e8ecf2; }
body.light-mode .mt-tab:hover { color: #1a2030; }
body.light-mode .mt-tab.on { color: #5b7a00; border-bottom-color: #5b7a00; }
body.light-mode .mt-tab-n { background: rgba(155, 204, 26, 0.18); color: #5b7a00; }
body.light-mode .mt-tab.on .mt-tab-n { background: #5b7a00; color: #ffffff; }
body.light-mode .mt-bfchip { background: #ffffff; border-color: #e8ecf2; color: #6b7a8d; }
body.light-mode .mt-bfchip b { color: #1a2030; }
body.light-mode .mt-bfchip small { color: #8899aa; }
body.light-mode .mt-bfchip:hover { border-color: #ccd4e0; color: #1a2030; }
body.light-mode .mt-bfchip.on { border-color: #5b7a00; background: rgba(155, 204, 26, 0.1); }
body.light-mode .mt-bfchip.on b { color: #5b7a00; }
body.light-mode .mt-jcard { background: #ffffff; border-color: #e8ecf2; box-shadow: inset 3px 0 0 #dde2ec; }
body.light-mode .mt-jcard.live { box-shadow: inset 3px 0 0 rgba(155, 204, 26, 0.8); }
body.light-mode .mt-jcard.blk { box-shadow: inset 3px 0 0 #ef4444; }
body.light-mode .mt-jtitle, body.light-mode .mt-jlane-t { color: #1a2030; }
body.light-mode .mt-jlane-t.up { color: #5b7a00; }
body.light-mode .mt-jbadge { background: rgba(155, 204, 26, 0.15); color: #5b7a00; }
body.light-mode .mt-jst { background: #eef1f6; color: #6b7a8d; }
body.light-mode .mt-jst.live { background: rgba(155, 204, 26, 0.15); color: #5b7a00; }
body.light-mode .mt-jst.blocked { background: rgba(239, 68, 68, 0.1); color: #cc3333; }
body.light-mode .mt-jst.done { background: rgba(13, 148, 118, 0.1); color: #0d9476; }
body.light-mode .mt-jreason { color: #cc3333; }