/* Selected first-visit guide: three steps above the actual tab navigation. */
body[data-app] #tab-walkthrough {
  --guide-ground: #f6f6f2; --guide-ink: #101b24; --guide-muted: #4b5660;
  --guide-line: #8b959c; --guide-blue: #226192; --guide-on-blue: #fff;
  position: fixed; inset: 0; margin: 0; padding: 0; width: 100%; max-width: none;
  height: 100%; max-height: none; border: 0; border-radius: 0;
  background: transparent; color: var(--guide-ink); overflow: hidden;
}
body[data-app] #tab-walkthrough[data-theme="dark"] {
  --guide-ground: #000; --guide-ink: #eae6de; --guide-muted: #b6c1ca;
  --guide-line: #627581; --guide-blue: #82b7df; --guide-on-blue: #101b24;
}
#tab-walkthrough::backdrop { background: #101b2466; }
.walkthrough-card {
  position: absolute; width: min(360px, calc(100% - 32px)); padding: 20px;
  background: var(--guide-ground); border: 1px solid var(--guide-line);
  border-radius: 20px; max-height: calc(100% - 32px); overflow: auto;
}
body[data-app] #tab-walkthrough #walkthrough-progress { font-size: 12px; line-height: 1.5; color: var(--guide-muted); margin: 0 0 10px; }
#walkthrough-title { font-size: 26px; line-height: 1.12; letter-spacing: -.03em; margin: 0 0 12px; }
#walkthrough-title:focus { outline: none; }
body[data-app] #tab-walkthrough #walkthrough-copy { font-size: 14px; line-height: 1.55; color: var(--guide-muted); margin: 0; }
.walkthrough-actions { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 20px; }
.walkthrough-actions > div { display: flex; gap: 8px; }
.walkthrough-actions button, #replay-walkthrough { min-height: 44px; padding: 10px 14px; border: 1px solid currentColor; border-radius: 12px; background: transparent; color: inherit; font: inherit; font-size: 14px; cursor: pointer; }
.walkthrough-actions #skip-walkthrough { border-color: transparent; color: var(--guide-muted); }
.walkthrough-actions #next-walkthrough { background: var(--guide-blue); border-color: transparent; color: var(--guide-on-blue); min-width: 88px; }
.walkthrough-actions button:focus-visible, #replay-walkthrough:focus-visible { outline: 3px solid #ef8557; outline-offset: 3px; }
.walkthrough-highlight { position: absolute; border: 2px solid var(--guide-blue); border-radius: 14px; pointer-events: none; }
