/* Public reading surface; intentionally independent of the dashboard utilities. */
.guide-page { margin:0; font-size:15px; line-height:1.85; }
.guide-page *, .guide-page *::before, .guide-page *::after { box-sizing:border-box; }
.guide-page a { color:inherit; text-decoration:none; }
.guide-header { position:sticky; top:0; z-index:10; display:flex; justify-content:space-between; align-items:center; gap:24px; padding:16px max(24px, calc((100vw - 1200px) / 2)); background:var(--air-navigation); border-bottom:1px solid var(--air-navigation-border); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); }
.guide-brand { display:flex; align-items:center; gap:12px; font-size:18px; font-weight:700; line-height:1.4; }
.guide-brand img { object-fit:contain; }
.guide-brand small { display:block; color:#686872; font-size:10px; letter-spacing:.12em; }
.guide-header nav { display:flex; gap:24px; align-items:center; font-size:13px; font-weight:600; }
.guide-header nav a { display:inline-flex; align-items:center; min-height:44px; }
.guide-primary { background:var(--air-primary); color:#fff !important; border-radius:12px; padding:8px 16px; gap:12px; }
.guide-primary:hover { background:var(--air-primary-dark); }
.guide-layout { max-width:1200px; margin:48px auto 80px; padding:0 24px; display:grid; grid-template-columns:240px minmax(0, 1fr); align-items:start; gap:48px; }
.guide-toc { position:sticky; top:112px; max-height:calc(100dvh - 136px); overflow-y:auto; font-size:13px; }
.guide-toc > p { font-size:12px; color:#686872; margin:0 0 16px; }
.guide-toc ol { list-style:none; padding:0; margin:0 0 24px; }
.guide-toc li a { display:block; padding:10px 8px; border-radius:8px; min-height:44px; }
.guide-toc li a:hover { background:var(--air-primary-light); }
.guide-download { display:inline-flex; align-items:center; gap:20px; min-height:44px; border:1px solid var(--air-navigation-border); background:#fff; border-radius:12px; padding:8px 16px; }
.guide-toc > small { display:block; color:#686872; margin-top:16px; }
.guide-page main { min-width:0; padding:40px 48px; background:var(--air-card-solid); border:1px solid var(--air-border); border-radius:22px; box-shadow:var(--air-shadow-card); }
.guide-page article { overflow-wrap:anywhere; }
.guide-page h1 { font-size:32px; line-height:1.3; margin:0 0 16px; }
.guide-page h1 + p { color:#52525b; font-size:17px; }
.guide-page h1 + p + p { color:#686872; font-size:12px; margin:20px 0 24px; }
.guide-page h2 { font-size:23px; line-height:1.4; margin:48px 0 20px; padding-top:32px; border-top:1px solid var(--air-border); scroll-margin-top:104px; }
.guide-page h3 { font-size:18px; line-height:1.5; margin:28px 0 12px; }
.guide-page p { margin:12px 0; }
.guide-page article li { margin:8px 0; }
.guide-page article ul { padding-left:24px; }
.guide-page article a { text-decoration:underline; text-underline-offset:4px; }
.guide-note { padding:16px 20px; border-left:3px solid var(--air-primary); background:var(--air-secondary); border-radius:0 12px 12px 0; font-size:13px; color:#52525b; }
.guide-note p { margin:0; }
.guide-footer { display:flex; flex-wrap:wrap; gap:24px; justify-content:space-between; margin-top:40px; padding-top:24px; border-top:1px solid var(--air-border); font-size:13px; }
.guide-footer a { display:inline-flex; align-items:center; min-height:44px; }
.guide-skip { position:fixed; top:8px; left:16px; z-index:20; transform:translateY(-180%); padding:12px 20px; background:#fff; border:2px solid #09090b; }
.guide-skip:focus { transform:none; }
#guide-content { scroll-margin-top:104px; }
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) { .guide-header { background:#fff; } }
@media (max-width:900px) {
  .guide-layout { grid-template-columns:minmax(0, 1fr); gap:24px; margin-top:24px; }
  .guide-toc { position:static; max-height:none; }
  .guide-toc ol { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 16px; margin-bottom:16px; }
}
@media (max-width:575px) {
  .guide-header { padding:12px 16px; gap:12px; }
  .guide-header nav { gap:12px; }
  .guide-header nav > a:first-child { display:none; }
  .guide-layout { padding:0 16px; }
  .guide-page main { padding:24px 20px; border-radius:18px; }
  .guide-page h1 { font-size:28px; }
  .guide-page h2 { font-size:21px; }
  .guide-toc ol { gap:0 4px; }
  .guide-toc li a { padding:10px 4px; }
}
@media print {
  .guide-header, .guide-toc, .guide-footer, .guide-skip { display:none; }
  .guide-layout { display:block; margin:0; padding:0; }
  .guide-page main { padding:0; border:0; box-shadow:none; }
  .guide-page { background:#fff; }
  .guide-page h2, .guide-page h3 { break-after:avoid; }
}
