/* Store manager guide (/guide). Everything is scoped to .guide so the rest of the site is untouched. */
.guide {
  --g-card: #ffffff; --g-text: #18181b; --g-muted: #52525b; --g-line: #e4e4e7;
  --g-accent: #4f46e5; --g-accent-soft: #eef2ff; --g-tip: #ecfdf5; --g-tip-line: #10b981; --g-warn: #fffbeb; --g-warn-line: #f59e0b;
  max-width: 980px; color: var(--g-text); line-height: 1.6; text-align: left;
}
@media (prefers-color-scheme: dark) {
  .guide { --g-card: #18181b; --g-text: #f4f4f5; --g-muted: #a1a1aa; --g-line: #27272a;
    --g-accent: #818cf8; --g-accent-soft: #1e1b4b; --g-tip: #052e1f; --g-warn: #2d2006; }
}
.guide .guide-lang { display: flex; gap: 8px; margin-bottom: 20px; }
.guide .guide-lang a { padding: 6px 14px; border: 1px solid var(--g-line); border-radius: 999px; text-decoration: none; color: var(--g-muted); font-size: .9rem; }
.guide .guide-lang a[aria-current="page"] { background: var(--g-accent); border-color: var(--g-accent); color: #fff; }
.guide header.top { margin-bottom: 28px; }
.guide header.top h1 { font-size: 2rem; margin: 0 0 6px; }
.guide header.top p { color: var(--g-muted); margin: 0; }
.guide nav.toc, .guide section { background: var(--g-card); border: 1px solid var(--g-line); border-radius: 12px; padding: 20px 24px; margin-bottom: 24px; }
.guide nav.toc ol { margin: 8px 0 0; padding-left: 20px; columns: 2; column-gap: 32px; }
.guide nav.toc a { color: var(--g-accent); text-decoration: none; }
.guide section h2 { margin: 0 0 4px; font-size: 1.4rem; }
.guide section h3 { margin: 24px 0 8px; font-size: 1.1rem; }
.guide .where { display: inline-block; background: var(--g-accent-soft); color: var(--g-accent); border-radius: 999px; padding: 2px 12px; font-size: .85rem; font-weight: 600; margin: 4px 4px 12px 0; }
.guide figure { margin: 12px 0 16px; }
.guide figure img { width: 100%; height: auto; border: 1px solid var(--g-line); border-radius: 8px; display: block; }
.guide figcaption { color: var(--g-muted); font-size: .85rem; margin-top: 6px; }
.guide table { width: 100%; border-collapse: collapse; margin: 8px 0 16px; font-size: .95rem; }
.guide th, .guide td { text-align: left; border-bottom: 1px solid var(--g-line); padding: 8px 10px; vertical-align: top; }
.guide th { color: var(--g-muted); font-weight: 600; font-size: .85rem; }
.guide code, .guide .path { font-family: ui-monospace, Consolas, monospace; font-size: .88em; background: var(--g-accent-soft); padding: 1px 6px; border-radius: 4px; }
.guide .tip, .guide .warn { border-left: 4px solid var(--g-tip-line); background: var(--g-tip); padding: 10px 14px; border-radius: 6px; margin: 12px 0; }
.guide .warn { border-color: var(--g-warn-line); background: var(--g-warn); }
.guide ul, .guide ol { padding-left: 22px; }
.guide ol.steps li { margin-bottom: 6px; }
@media (max-width: 640px) {
  .guide nav.toc ol { columns: 1; }
  .guide nav.toc, .guide section { padding: 16px; }
  .guide table { display: block; overflow-x: auto; }
}
