:root{
  --gbz-guide-cyan:#00eaff;
  --gbz-guide-purple:#a66cff;
  --gbz-guide-border:rgba(0,234,255,.14);
  --gbz-guide-text:rgba(226,237,245,.80);
  --gbz-guide-muted:rgba(210,226,236,.58);
}
.gbz-guide-page{
  font-family:Inter,"Segoe UI",system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
}
.gbz-guide-shell{
  width:min(1080px,calc(100% - 48px));
  margin:74px auto 100px;
}
.gbz-guide-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:16px;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--gbz-guide-cyan);
}
.gbz-guide-kicker::before{
  content:"";
  width:30px;
  height:1px;
  background:var(--gbz-guide-cyan);
  box-shadow:0 0 10px rgba(0,234,255,.7);
}
.gbz-guide-page h1{
  max-width:900px;
  margin:0 0 18px;
  font-size:clamp(2.2rem,5vw,4.3rem);
  line-height:1.02;
  letter-spacing:-.045em;
  color:#f4fbff;
}
.gbz-guide-deck{
  max-width:850px;
  margin:0 0 26px;
  font-size:1.08rem;
  line-height:1.78;
  color:var(--gbz-guide-text);
}
.gbz-guide-meta{
  display:flex;
  flex-wrap:wrap;
  gap:10px 18px;
  padding:14px 0 22px;
  margin-bottom:30px;
  border-top:1px solid var(--gbz-guide-border);
  border-bottom:1px solid var(--gbz-guide-border);
  color:var(--gbz-guide-muted);
  font-size:.78rem;
  letter-spacing:.04em;
}
.gbz-guide-content{
  max-width:900px;
}
.gbz-guide-content h2{
  position:relative;
  margin:46px 0 14px;
  padding-top:18px;
  font-size:clamp(1.35rem,2.5vw,1.8rem);
  line-height:1.2;
  color:#effcff;
  border-top:1px solid var(--gbz-guide-border);
}
.gbz-guide-content h2::before{
  content:"";
  position:absolute;
  top:-1px;
  left:0;
  width:90px;
  height:2px;
  background:linear-gradient(90deg,var(--gbz-guide-cyan),var(--gbz-guide-purple));
  box-shadow:0 0 14px rgba(0,234,255,.28);
}
.gbz-guide-content h3{
  margin:30px 0 10px;
  color:#eafaff;
  font-size:1.08rem;
}
.gbz-guide-content p,
.gbz-guide-content li{
  color:var(--gbz-guide-text);
  line-height:1.82;
  font-size:.99rem;
}
.gbz-guide-content ul,
.gbz-guide-content ol{
  padding-left:1.2rem;
}
.gbz-guide-code{
  overflow:auto;
  margin:18px 0;
  padding:16px 18px;
  border:1px solid rgba(0,234,255,.13);
  border-left:3px solid var(--gbz-guide-cyan);
  background:rgba(0,0,0,.24);
  color:#dffbff;
  font: .91rem/1.65 Consolas,Monaco,monospace;
  white-space:pre;
}
.gbz-guide-callout{
  margin:24px 0;
  padding:18px 20px;
  border-left:3px solid var(--gbz-guide-purple);
  background:rgba(166,108,255,.06);
  color:var(--gbz-guide-text);
}
.gbz-guide-tool{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:18px;
  align-items:center;
  margin:34px 0;
  padding:20px 0;
  border-top:1px solid rgba(166,108,255,.18);
  border-bottom:1px solid rgba(166,108,255,.18);
}
.gbz-guide-tool strong{
  display:block;
  margin-bottom:5px;
  color:#f5fbff;
}
.gbz-guide-tool a,
.gbz-guide-inline-link{
  color:#b983ff;
  text-decoration:none;
  font-weight:750;
}
.gbz-guide-tool a:hover,
.gbz-guide-inline-link:hover{
  color:#d9bcff;
  text-decoration:underline;
  text-underline-offset:3px;
}
.gbz-guide-bottom-nav{
  display:flex;
  flex-wrap:wrap;
  gap:10px 22px;
  margin-top:58px;
  padding-top:20px;
  border-top:1px solid var(--gbz-guide-border);
}
.gbz-guide-bottom-nav a{
  position:relative;
  padding-bottom:4px;
  color:rgba(215,236,246,.72);
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.11em;
  font-size:.74rem;
  font-weight:800;
}
.gbz-guide-bottom-nav a::after{
  content:"";
  position:absolute;
  left:0;
  right:100%;
  bottom:0;
  height:1px;
  background:var(--gbz-guide-cyan);
  transition:right .2s ease;
}
.gbz-guide-bottom-nav a:hover::after{right:0}
.gbz-guides-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0 36px;
  border-top:1px solid var(--gbz-guide-border);
}
.gbz-guide-card{
  padding:28px 0;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.gbz-guide-card .num{
  color:var(--gbz-guide-cyan);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.13em;
}
.gbz-guide-card h2{
  margin:8px 0 10px;
  font-size:1.35rem;
}
.gbz-guide-card p{
  color:var(--gbz-guide-text);
  line-height:1.7;
}
.gbz-guide-card a{
  color:#b983ff;
  text-decoration:none;
  font-weight:750;
}
html[data-theme="light"] .gbz-guide-page h1,
html[data-theme="light"] .gbz-guide-content h2,
html[data-theme="light"] .gbz-guide-content h3,
html[data-theme="light"] .gbz-guide-tool strong,
html[data-theme="light"] .gbz-guide-card h2{
  color:#171717;
}
html[data-theme="light"] .gbz-guide-deck,
html[data-theme="light"] .gbz-guide-content p,
html[data-theme="light"] .gbz-guide-content li,
html[data-theme="light"] .gbz-guide-callout,
html[data-theme="light"] .gbz-guide-card p{
  color:rgba(25,25,25,.74);
}
html[data-theme="light"] .gbz-guide-kicker,
html[data-theme="light"] .gbz-guide-card .num{
  color:#927315;
}
html[data-theme="light"] .gbz-guide-kicker::before,
html[data-theme="light"] .gbz-guide-content h2::before{
  background:linear-gradient(90deg,#c9a227,#8f7417);
  box-shadow:none;
}
html[data-theme="light"] .gbz-guide-meta,
html[data-theme="light"] .gbz-guide-content h2,
html[data-theme="light"] .gbz-guide-bottom-nav,
html[data-theme="light"] .gbz-guides-grid{
  border-color:rgba(201,162,39,.24);
}
html[data-theme="light"] .gbz-guide-card{
  border-bottom-color:rgba(0,0,0,.08);
}
html[data-theme="light"] .gbz-guide-code{
  background:rgba(201,162,39,.05);
  border-color:rgba(201,162,39,.24);
  border-left-color:#c9a227;
  color:#2a2412;
}
@media(max-width:760px){
  .gbz-guide-shell{width:min(100% - 28px,1080px);margin:58px auto 80px}
  .gbz-guides-grid{grid-template-columns:1fr}
  .gbz-guide-tool{grid-template-columns:1fr}
}
