:root { --guide-panel:var(--panel); --guide-panel-soft:var(--panel2); --guide-line:var(--border); --guide-copy:var(--muted); --guide-text:var(--text); --guide-accent:var(--blue); }
body.getting-started-page { margin:0; color:var(--guide-text); background:var(--bg); }
.guide-shell.site-shell { width:100%; max-width:none; margin:0; padding:0 0 40px; }
.guide-shell > :not(.viewer-site-nav) { width:min(1120px,calc(100% - 64px)); margin-left:auto; margin-right:auto; }
.guide-hero { margin-top:32px; padding:clamp(24px,4vw,40px); border:1px solid var(--guide-line); border-radius:18px; background:var(--guide-panel); }
.guide-hero h1 { max-width:850px; margin:12px 0 18px; font-size:clamp(2rem,4vw,3.4rem); line-height:1.12; letter-spacing:normal; text-shadow:none; }
.guide-hero > p:last-of-type { max-width:720px; color:var(--guide-copy); font-size:clamp(1rem,2vw,1.2rem); line-height:1.65; }
.guide-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:26px; }
.guide-actions .btn,.guide-after .btn { white-space:normal; text-align:center; }
.guide-prerequisites,.guide-after { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,1fr); gap:36px; align-items:center; margin-top:18px; padding:28px 32px; border:1px solid var(--guide-line); border-radius:14px; background:var(--guide-panel); }
.guide-prerequisites h2,.guide-after h2 { margin:6px 0 0; font-size:clamp(1.6rem,3vw,2.4rem); }
.guide-prerequisites ul { margin:0; padding-left:24px; color:var(--guide-copy); line-height:1.8; }
.guide-journey { margin-top:32px; }
.guide-section-heading { max-width:760px; }
.guide-section-heading h2 { margin:8px 0 24px; font-size:clamp(1.5rem,3vw,2rem); }
.guide-step-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin:0; padding:0; list-style:none; }
.guide-step-list > li { display:grid; grid-template-columns:auto 1fr; gap:18px; padding:28px; border:1px solid var(--guide-line); border-radius:14px; background:linear-gradient(180deg,var(--guide-panel-soft),var(--guide-panel)); }
.guide-step-list > li > span { display:grid; place-items:center; width:46px; height:46px; border:1px solid rgba(21,157,255,.54); border-radius:50%; color:#71c5ff; font-weight:800; }
.guide-step-list h3 { margin:2px 0 10px; font-size:1.3rem; }
.guide-step-list p,.guide-after p { margin:0; color:var(--guide-copy); line-height:1.65; overflow-wrap:anywhere; }
.guide-step-list a { display:inline-flex; margin-top:18px; color:#71c5ff; font-size:.82rem; font-weight:800; letter-spacing:.06em; overflow-wrap:anywhere; }
.guide-after { margin-top:18px; grid-template-columns:minmax(0,1fr) auto; }
.guide-after p { margin-top:10px; max-width:760px; }
.guide-footer { display:flex; justify-content:center; flex-wrap:wrap; gap:24px; margin-top:28px!important; padding:24px; }
.guide-footer a { color:var(--guide-copy); }
.guide-shell a:focus-visible { outline:3px solid #69c7ff; outline-offset:3px; }
html.bracketr-theme-light { --guide-panel:var(--panel); --guide-panel-soft:var(--panel2); --guide-line:var(--border); --guide-copy:var(--muted); --guide-text:var(--text); }
html.bracketr-theme-light body.getting-started-page { background:var(--bg); }
html.bracketr-theme-light .guide-hero { background:var(--guide-panel); }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
@media (max-width:760px) { .guide-shell > :not(.viewer-site-nav) { width:min(100% - 28px,1120px); } .guide-hero { margin-top:14px; padding:30px 22px; } .guide-step-list { grid-template-columns:1fr; } .guide-prerequisites,.guide-after { grid-template-columns:1fr; padding:24px 20px; } .guide-after .btn { width:100%; } }

.guide-shell h1,.guide-shell h2,.guide-shell h3 { color:var(--guide-text); text-transform:none; }
.guide-step-list a,.guide-step-list > li > span { color:var(--blue); }
.guide-shell .btn-secondary { background:var(--panel2); color:var(--text); border:1px solid var(--border2); }
.guide-shell .btn { min-height:44px; max-width:100%; overflow-wrap:anywhere; }
.guide-shell .btn-primary { background:var(--brk-workspace-primary); color:white; border-color:var(--brk-workspace-primary); }
.guide-shell .btn-primary:hover { background:var(--brk-workspace-primary-hover); }
html.bracketr-theme-light .guide-shell { --guide-copy:var(--brk-light-muted); }
html.bracketr-theme-light .guide-shell a:focus-visible { outline-color:var(--light-focus); }
html.bracketr-theme-light .guide-step-list a,html.bracketr-theme-light .guide-step-list > li > span { color:var(--brk-workspace-primary,var(--light-action)); }
