.guide-page{color-scheme:light dark}
.guide-header{justify-content:space-between}
.guide-header-links{display:flex;align-items:center;gap:24px}
.guide-header-links>a:not(.btn){color:#c0cbe0;font-size:.9rem;text-underline-offset:4px}
.guide-hero{padding:72px 0 64px;border-bottom:1px solid var(--line);background:radial-gradient(ellipse at 85% 0,color-mix(in srgb,var(--brand) 12%,transparent),transparent 65%)}
.guide-hero-grid{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:64px}
.guide-hero h1{font-size:clamp(2.5rem,5.8vw,4.3rem);letter-spacing:-.045em;line-height:1.04;margin-bottom:24px}
.guide-hero .lead{max-width:48ch}
.guide-map{padding:28px;background:var(--surface);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow)}
.guide-map-label{font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:700}
.guide-map ol{list-style:none;padding:0;margin:20px 0 24px}
.guide-map li{display:flex;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid var(--line);font-size:.95rem}
.guide-map li span{color:var(--brand);font:600 .85rem ui-monospace,monospace}
.guide-endpoint{display:grid;gap:6px;padding:16px;background:var(--bg-alt);border-radius:10px}
.guide-endpoint>span{font-size:.75rem;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.guide-endpoint code{font-size:.85rem;overflow-wrap:anywhere}
.guide-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:52px;align-items:start}
.guide-sidebar{position:sticky;top:100px;padding-block:44px}
.guide-sidebar nav{display:grid;gap:4px;margin-bottom:22px}
.guide-sidebar nav>a{display:flex;align-items:center;min-height:44px;padding:8px 10px;border-radius:8px;font-size:.88rem;text-decoration:none;color:var(--muted)}
.guide-sidebar nav>a:hover{color:var(--text);background:var(--bg-alt)}
.guide-sidebar .note{font-size:.8rem;padding:0 10px}
.guide-sidebar .eyebrow{padding-left:10px}
.guide-section{padding:48px 0;border-bottom:1px solid var(--line)}
.guide-section:last-child{border:0;padding-bottom:64px}
.guide-section h2{font-size:clamp(1.65rem,3vw,2.2rem);margin-bottom:18px}
.guide-section h3{font-size:1.05rem;line-height:1.4}
.guide-section>p{color:var(--muted)}
.guide-content{min-width:0}
.guide-content p code,.guide-steps code{font-size:.88em;color:var(--text);overflow-wrap:anywhere}
.guide-content p a{text-underline-offset:3px;color:var(--brand)}
.guide-steps{list-style:none;counter-reset:guide-step;padding:0;margin:28px 0}
.guide-steps li{position:relative;counter-increment:guide-step;padding:0 0 22px 48px}
.guide-steps li::before{content:counter(guide-step);display:grid;place-items:center;position:absolute;left:0;top:0;width:30px;height:30px;border:1px solid var(--line);border-radius:10px;background:var(--bg-alt);color:var(--brand);font-size:.85rem;font-weight:700}
.guide-steps p{color:var(--muted);font-size:.94rem;margin-bottom:0}
.guide-section>.guide-warning{padding:16px 18px;background:var(--bg-alt);border:1px solid var(--line);border-radius:12px;color:var(--text);font-size:.92rem;margin:24px 0}
.guide-tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-top:28px;overflow-x:auto;padding:4px 4px 0}
.guide-tabs button{flex-shrink:0;min-height:48px;padding:10px 16px;border:0;border-bottom:3px solid transparent;border-radius:8px 8px 0 0;background:transparent;color:var(--muted);font:inherit;font-size:.9rem;cursor:pointer}
.guide-tabs button[aria-selected=true]{color:var(--brand);border-bottom-color:var(--brand);background:var(--bg-alt);font-weight:700}
.guide-tabs button:hover{color:var(--text)}
.guide-tab-help{font-size:.8rem;margin-top:10px}
.guide-tab-panel{padding-top:20px}
.guide-tab-panel h3{margin-bottom:8px}
.guide-content .code-card{margin:16px 0;min-width:0}
.guide-content .code-head{gap:16px}
.guide-content .code-head>span{min-width:0}
.guide-content .copy{flex-shrink:0;padding:8px 12px}
.guide-content .copy:disabled{opacity:.65;cursor:wait}
.guide-content pre{tab-size:2;max-width:100%;padding:20px;font-size:.8rem}
.guide-content pre:focus-visible{outline-offset:-3px}
.guide-content .guide-security-note{margin:24px 0 0;font-size:.84rem}
.guide-sdk-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;margin-top:28px}
.guide-sdk-grid article{min-width:0}
.guide-sdk-grid article>.note{margin-bottom:8px}
.guide-evidence{padding:22px;border:1px solid var(--brand);border-radius:14px;margin:26px 0;background:color-mix(in srgb,var(--brand) 5%,var(--surface))}
.guide-evidence p{margin-bottom:0;color:var(--muted);font-size:.94rem}
.guide-section details p{font-size:.94rem}
.guide-finish{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:32px;padding:24px;background:var(--bg-alt);border:1px solid var(--line);border-radius:14px}
.guide-finish p{margin-bottom:0;color:var(--muted);font-size:.9rem}
.guide-finish .btn{flex-shrink:0}
.guide-copy-status{position:fixed;z-index:40;bottom:20px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 32px);padding:14px 20px;border:1px solid var(--brand);border-radius:12px;background:var(--surface);color:var(--text);box-shadow:var(--shadow);font-size:.9rem;pointer-events:none}
.guide-copy-status:empty{padding:0;border:0;box-shadow:none}
.guide-footer{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px}
.guide-footer p{margin:0}
.guide-footer>a:last-child{font-size:.88rem;text-underline-offset:4px}
@media(max-width:900px){
  .guide-hero-grid{gap:28px;grid-template-columns:1fr 1fr}
  .guide-map{padding:20px}
  .guide-layout{grid-template-columns:1fr;gap:0}
  .guide-sidebar{position:static;padding:24px 0;border-bottom:1px solid var(--line)}
  .guide-sidebar nav{display:flex;flex-wrap:wrap;gap:4px 12px;margin:0}
  .guide-sidebar .eyebrow{width:100%;margin-bottom:4px}
  .guide-sidebar>.note{display:none}
}
@media(max-width:640px){
  .guide-hero{padding:40px 0}
  .guide-hero-grid{grid-template-columns:1fr}
  .guide-header-links{gap:12px}
  .guide-header-links>a:not(.btn){font-size:.8rem}
  .guide-header-links .btn{padding:.6rem .8rem;font-size:.85rem}
  .guide-header{gap:10px}
  .guide-section{padding:36px 0}
  .guide-finish{align-items:flex-start;flex-direction:column;padding:20px}
  .guide-tabs button{font-size:.82rem;padding-inline:12px}
  .guide-copy-status{bottom:12px}
  .guide-footer{padding-bottom:48px}
}
@media(max-width:380px){
  .guide-header-links{width:100%;justify-content:space-between}
  .guide-map{padding:16px}
}