/*! © 2026 Noxx Labs. All rights reserved. Noxx™ and Noxx Labs™ are trademarks of Noxx Labs. Proprietary: no licence is granted to copy, modify, host or redistribute any part of this code. noxxreplays.co.uk · build 6.1.0-f984a20 · 3d818a9198 */

.mc-btn { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); z-index: 6; background: rgba(8, 12, 18, 0.86); color: #f2f2f3; border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 10px; padding: 0.45rem 0.7rem; font: inherit; font-size: 0.76rem; cursor: pointer; }
.mc-btn b { color: #ef4444; margin-left: 2px; }
.mc-btn:hover { border-color: var(--accent, #e1ff3c); }
.mc-drawer { position: absolute; top: 8px; right: 8px; bottom: 8px; width: min(300px, 82%); z-index: 7; background: rgba(10, 14, 20, 0.95); border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 12px; display: flex; flex-direction: column; transform: translateX(calc(100% + 16px)); transition: transform 0.2s ease; padding: 0.6rem; gap: 0.5rem; }
.mc-drawer.open { transform: none; }
.mc-head { display: flex; align-items: center; gap: 0.5rem; color: #f2f2f3; font-size: 0.85rem; }
.mc-head .mc-x { margin-left: auto; background: none; border: 0; color: #9a9aa3; cursor: pointer; font-size: 0.95rem; }
.mc-scope { display: flex; gap: 2px; background: rgba(255, 255, 255, 0.06); border-radius: 8px; padding: 2px; }
.mc-scope button { background: none; border: 0; color: #b9b9c2; font: inherit; font-size: 0.68rem; padding: 0.2rem 0.45rem; border-radius: 6px; cursor: pointer; }
.mc-scope button.on { background: rgba(225, 255, 60, 0.16); color: #e1ff3c; }
.mc-all { background: #e1ff3c; color: #0a0f14; border: 0; border-radius: 8px; padding: 0.4rem; font: inherit; font-size: 0.76rem; font-weight: 700; cursor: pointer; }
.mc-list { overflow-y: auto; display: flex; flex-direction: column; gap: 4px; min-height: 0; }
.mc-item { display: flex; gap: 0.55rem; align-items: flex-start; text-align: left; background: rgba(255, 255, 255, 0.04); border: 1px solid transparent; border-left: 3px solid var(--c); border-radius: 7px; padding: 0.38rem 0.5rem; color: #e8e8ec; font: inherit; font-size: 0.74rem; cursor: pointer; }
.mc-item:hover { background: rgba(255, 255, 255, 0.08); }
.mc-item.cur { border-color: rgba(225, 255, 60, 0.5); border-left-color: var(--c); background: rgba(225, 255, 60, 0.07); }
.mc-t { font-family: var(--mono, monospace); color: #9a9aa3; flex: none; }
.mc-tt { display: flex; flex-direction: column; min-width: 0; }
.mc-tt b { font-weight: 600; }
.mc-tt em { font-style: normal; color: #9a9aa3; font-size: 0.68rem; }
.mc-empty { color: #9a9aa3; font-size: 0.74rem; margin: 0.3rem 0; }
.mc-card { position: absolute; left: 12px; bottom: 12px; width: min(390px, calc(100% - 24px)); z-index: 7; display: none; background: rgba(10, 14, 20, 0.95); border: 1px solid rgba(255, 255, 255, 0.14); border-left: 3px solid var(--c); border-radius: 12px; padding: 0.65rem 0.8rem 0.6rem; color: #e8e8ec; font-size: 0.78rem; line-height: 1.45; max-height: calc(100% - 24px); overflow-y: auto; }
.mc-card.show { display: block; }
.mc-ct { display: flex; align-items: center; color: #9a9aa3; font-size: 0.68rem; font-family: var(--mono, monospace); }
.mc-ct button { margin-left: auto; background: none; border: 0; color: #9a9aa3; cursor: pointer; font-size: 0.9rem; }
.mc-card h4 { margin: 0.1rem 0 0.25rem; font-size: 0.92rem; color: var(--c); }
.mc-card p { margin: 0 0 0.35rem; }
.mc-facts { color: #9a9aa3; font-size: 0.7rem; }
.mc-adv { color: #8affc1; }
.mc-steps { margin: 0.3rem 0 0.5rem; padding-left: 1.2rem; }
.mc-steps li { color: #8d8d96; margin: 0.15rem 0; transition: color 0.2s; }
.mc-steps li.done { color: #c9c9cf; }
.mc-steps li.now { color: #fff; font-weight: 600; }
.mc-steps li.now::marker { color: #e1ff3c; }
.mc-nav { display: flex; gap: 0.35rem; }
.mc-nav button { flex: 1; background: rgba(255, 255, 255, 0.08); border: 1px solid rgba(255, 255, 255, 0.14); color: #f2f2f3; border-radius: 8px; padding: 0.3rem 0.4rem; font: inherit; font-size: 0.72rem; cursor: pointer; }
.mc-nav button:hover { border-color: #e1ff3c; }
.mc-ticks { position: relative; height: 0; }
.mc-ticks i { position: absolute; top: -22px; width: 7px; height: 7px; transform: translateX(-50%) rotate(45deg); cursor: pointer; border-radius: 1px; box-shadow: 0 0 4px rgba(0, 0, 0, 0.6); }
.mc-on #pitch3dAnnotation, .mc-on .p3d-hud-focus { display: none !important; }
@media (max-width: 720px) {
  .mc-card { font-size: 0.72rem; padding: 0.5rem 0.6rem; max-height: 62%; }
  .mc-steps { margin: 0.2rem 0 0.35rem; }
}