/* MOCK chrome only. Baseline look comes from the original ./assets/tailwind.min.css (copied from the clone root, local). */
#mockBanner { background: #b45309; color: #fff; padding: 8px 12px; position: sticky; top: 0; z-index: 1000; font-size: 13px; }
#mockUnsupported { padding: 6px 12px; background: #fef3c7; border-bottom: 1px solid #f59e0b; font-size: 12px; }
.guide-overlay { position: fixed; inset: 0; z-index: 2000; background: rgba(15,23,42,.55); }
.guide-spotlight { position: fixed; border-radius: 16px; box-shadow: 0 0 0 9999px rgba(15,23,42,.55); background: transparent; pointer-events: none; }
.guide-card { position: fixed; left: 50%; bottom: 96px; transform: translateX(-50%); width: min(92vw, 380px); background: #e8f1ff; color: #0f172a;
  border-radius: 24px; padding: 18px 20px; box-shadow: 0 10px 30px rgba(0,0,0,.25); outline: 0; font-size: 15px; line-height: 1.5; }
.guide-progress { font-size: 12px; font-weight: 700; color: #2563eb; margin-bottom: 6px; }
.guide-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 12px; }
.guide-actions button { border: 0; border-radius: 999px; padding: 8px 16px; font-weight: 700; background: #fff; }
.guide-actions button[data-guide="next"] { background: #2563eb; color: #fff; }
.guide-actions button:focus-visible, .guide-card:focus-visible { outline: 3px solid #1d4ed8; outline-offset: 2px; }
#mockError, #mockUnsupportedNotice { color: #b91c1c; font-weight: bold; }
#mockUnsupportedNotice { position: fixed; left: 12px; right: 12px; top: 48px; background: #fff; padding: 8px; z-index: 1001; border: 1px solid #b91c1c; }
