/* ============ Reeve mobile drawer ============
   Simple, flat flex layout. No position:absolute on inner elements - children
   stack via flex-direction:column and can never overlap.
*/

.hamburger{
  display:none;
  background:transparent;
  border:1px solid rgba(255,255,255,0.08);border-radius:8px;
  color:#a8a8a3;cursor:pointer;
  width:38px;height:38px;flex-shrink:0;
  align-items:center;justify-content:center;
  transition:color .2s, border-color .2s, background .2s;
}
.hamburger:hover{color:#f4f4f2;border-color:rgba(255,255,255,0.14);background:rgba(255,255,255,0.04);}
.hamburger svg{width:18px;height:14px;}

.auth-only:not(.show){display:none !important;}
html,body{overflow-x:hidden;}

/* ============ Custom scrollbars - matches site aesthetic ============
   Applied globally so every scroll surface (page, drawer panel, code blocks,
   tables, sidebars) gets the same dark thin scroller instead of the default
   chunky Windows/macOS one. Firefox uses scrollbar-* shorthand, WebKit gets
   the ::-webkit-scrollbar pseudo elements. */
*{
  scrollbar-width:thin;
  scrollbar-color:rgba(255,255,255,0.14) transparent;
}
*::-webkit-scrollbar{ width:8px; height:8px; }
*::-webkit-scrollbar-track{ background:transparent; }
*::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,0.14);
  border-radius:100px;
  border:2px solid transparent;
  background-clip:content-box;
  transition:background .2s;
}
*::-webkit-scrollbar-thumb:hover{
  background:rgba(255,255,255,0.26);
  background-clip:content-box;
}
*::-webkit-scrollbar-corner{ background:transparent; }
/* Hide native arrows on Webkit */
*::-webkit-scrollbar-button{ display:none; height:0; width:0; }

@media(max-width:900px){
  .hamburger{display:inline-flex;}
  .nav-links{display:none !important;}
  .nav-inner > a.btn,
  .nav-actions > a.btn:not(.hamburger){display:none !important;}
  #auth-slot{display:none !important;}
}

/* ============ DRAWER CONTAINER ============ */
.reev-drawer{
  position:fixed;
  inset:0;
  z-index:99999;
  background:#0a0a09;
  display:flex;
  justify-content:flex-end;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .28s ease, visibility .28s ease;
}
.reev-drawer.open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

/* Lock body scroll while open */
body.reev-drawer-active{
  position:fixed;
  left:0;right:0;top:0;
  width:100%;
  height:100vh;
  overflow:hidden;
}
body.reev-drawer-active footer,
body.reev-drawer-active #reev-shared-footer{ display:none !important; }

/* ============ DRAWER PANEL ============
   The single flex child. Phones: full width + height. Tablets+: 380px wide,
   slides in from the right. Children stack as a column - no overlapping possible.
*/
.reev-drawer-panel{
  width:100%;
  height:100vh;
  background:#0d0d0c;
  display:flex;
  flex-direction:column;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  padding-top:env(safe-area-inset-top, 0);
  padding-bottom:env(safe-area-inset-bottom, 0);
}
@media(min-width:561px){
  .reev-drawer-panel{
    width:380px;
    border-left:1px solid rgba(255,255,255,0.08);
    transform:translateX(105%);
    transition:transform .32s cubic-bezier(.2,.7,.2,1);
  }
  .reev-drawer.open .reev-drawer-panel{ transform:translateX(0); }
}

/* ============ TOP BAR (just the close button) ============ */
.reev-drawer-top{
  display:flex;align-items:center;justify-content:flex-end;
  padding:22px 22px 16px;
  flex-shrink:0;
  background:#0d0d0c;
}
.reev-drawer-brand{
  display:inline-flex;align-items:center;gap:10px;
  text-decoration:none;color:#f4f4f2;
  font-size:18px;font-weight:600;letter-spacing:-0.025em;
}
.reev-drawer-brand img{width:28px;height:28px;border-radius:7px;display:block;}
.reev-drawer-close{
  background:transparent;border:1px solid rgba(255,255,255,0.08);
  border-radius:50%;
  width:36px;height:36px;
  color:#a8a8a3;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
  flex-shrink:0;
  transition:color .2s, border-color .2s, background .2s;
}
.reev-drawer-close:hover{color:#f4f4f2;border-color:rgba(255,255,255,0.14);background:rgba(255,255,255,0.04);}
.reev-drawer-close svg{width:13px;height:13px;}

/* ============ NAV LINKS ============ */
.reev-drawer-nav{
  display:flex;flex-direction:column;
  padding:0 22px 24px;
  flex-shrink:0;
}
.reev-drawer-nav a{
  font-size:16px;color:#a8a8a3;text-decoration:none;
  padding:14px 0;
  border-bottom:1px solid rgba(255,255,255,0.06);
  display:flex;align-items:center;justify-content:space-between;
  transition:color .2s, padding-left .2s;
}
.reev-drawer-nav a:last-child{ border-bottom:none; }
.reev-drawer-nav a:hover,.reev-drawer-nav a:active{ color:#f4f4f2; padding-left:6px; }
.reev-drawer-nav a .arrow{
  font-family:'Geist Mono',ui-monospace,monospace;font-size:14px;color:#6b6b67;
  opacity:0.4;transition:opacity .2s, transform .2s;
}
.reev-drawer-nav a:hover .arrow{ opacity:1; transform:translateX(2px); }

/* ============ ACTIONS GROUP (pinned to bottom under Docs) ============ */
.reev-drawer-actions{
  margin-top:auto;
  padding-top:24px;
  border-top:1px solid rgba(255,255,255,0.08);
  display:flex;flex-direction:column;
  gap:14px;
  flex-shrink:0;
}

/* Auth slot - sits inside the actions group */
.reev-drawer-auth{
  padding:0 22px;
  display:flex;justify-content:flex-start;
}
.reev-drawer-auth:empty{ display:none; }

.reev-drawer-signin{
  width:100%;
  font-family:'Geist',-apple-system,sans-serif;font-size:15px;font-weight:600;
  letter-spacing:-0.01em;padding:13px 18px;border-radius:11px;border:none;
  background:#f4f4f2;color:#0a0a09;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:7px;
  transition:transform .2s, box-shadow .2s;
}
.reev-drawer-signin:hover{ transform:translateY(-1px); box-shadow:0 8px 22px rgba(0,0,0,0.5); }

.reev-drawer-pillrow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  width:100%;
}
.reev-drawer-pill{
  display:inline-flex;align-items:center;gap:8px;
  padding:9px 14px;border-radius:100px;
  background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);
  color:#a8a8a3;font-family:'Geist Mono',ui-monospace,monospace;font-size:12.5px;
  text-decoration:none;
  flex:1;min-width:0;
  transition:border-color .2s, background .2s;
}
.reev-drawer-pill:hover{ border-color:rgba(255,255,255,0.14); background:rgba(255,255,255,0.06); }
.reev-drawer-pill .dot{
  width:6px;height:6px;border-radius:50%;background:#3aa66b;flex-shrink:0;
  box-shadow:0 0 0 0 rgba(58,166,107,.5);
  animation:reevPulse 2.4s infinite;
}
.reev-drawer-pill .addr{ color:#f4f4f2; font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
@keyframes reevPulse{0%{box-shadow:0 0 0 0 rgba(58,166,107,.5);}70%{box-shadow:0 0 0 8px rgba(58,166,107,0);}100%{box-shadow:0 0 0 0 rgba(58,166,107,0);}}
.reev-drawer-signout{
  display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,0.08);
  background:transparent;color:#6b6b67;cursor:pointer;
  flex-shrink:0;
  transition:color .2s, border-color .2s, background .2s;
}
.reev-drawer-signout:hover{ color:#d65a5a; border-color:rgba(214,90,90,0.3); background:rgba(214,90,90,0.05); }
.reev-drawer-signout svg{ width:12px; height:12px; }

/* ============ LAUNCH CTA (last item) ============ */
.reev-drawer-launch{
  margin:0 22px 24px;
  font-family:'Geist',-apple-system,sans-serif;font-size:15px;font-weight:600;
  letter-spacing:-0.01em;text-align:center;
  padding:13px 24px;border-radius:12px;
  background:#f4f4f2;color:#0a0a09;
  text-decoration:none;
  display:block;
  flex-shrink:0;
  transition:transform .22s, box-shadow .22s;
}
.reev-drawer-launch:hover,.reev-drawer-launch:active{ transform:translateY(-1px); box-shadow:0 8px 22px rgba(0,0,0,0.5); }
