*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#07070a;color:#f5f5f7;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;min-height:100vh}a{color:inherit;text-decoration:none}button{font:inherit}.site-header{height:72px;display:flex;align-items:center;padding:0 22px;border-bottom:1px solid rgba(255,255,255,.08);background:rgba(7,7,10,.9);backdrop-filter:blur(14px);position:sticky;top:0;z-index:1000}.menu-btn{width:46px;height:46px;border:1px solid rgba(255,255,255,.12);border-radius:12px;background:#0d0d12;color:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;cursor:pointer}.menu-btn span{width:21px;height:2px;background:#fff;border-radius:2px;transition:.25s}.menu-btn.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}.menu-btn.open span:nth-child(2){opacity:0}.menu-btn.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}.brand{margin-left:14px;font-weight:800;font-size:20px}.brand small{display:block;font-size:10px;color:#888;margin-top:1px;letter-spacing:1.2px}.drawer{position:fixed;left:0;top:0;bottom:0;width:290px;background:#0a0a0e;border-right:1px solid rgba(255,255,255,.1);z-index:1200;transform:translateX(-102%);transition:transform .28s ease;box-shadow:20px 0 60px rgba(0,0,0,.45);padding:22px}.drawer.open{transform:translateX(0)}.drawer-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px}.drawer-title{font-size:22px;font-weight:800}.close-btn{width:38px;height:38px;border:0;border-radius:10px;background:#15151c;color:#fff;cursor:pointer;font-size:23px}.nav-label{text-transform:uppercase;color:#707078;font-size:10px;font-weight:800;letter-spacing:1.5px;margin:18px 8px 8px}.nav-link{display:flex;align-items:center;gap:12px;padding:13px 12px;border-radius:11px;color:#cfcfd5;margin:4px 0;transition:.18s}.nav-link:hover,.nav-link.active{background:#15151c;color:#fff}.nav-icon{width:25px;text-align:center}.overlay{position:fixed;inset:0;background:rgba(0,0,0,.58);z-index:1100;opacity:0;visibility:hidden;transition:.25s}.overlay.open{opacity:1;visibility:visible}main{max-width:1100px;margin:auto;padding:70px 22px 90px}.hero{text-align:center;padding:55px 0 45px}.badge{display:inline-block;padding:7px 12px;border:1px solid rgba(255,255,255,.12);border-radius:999px;color:#aaa;font-size:12px;margin-bottom:20px}h1{font-size:clamp(42px,8vw,78px);line-height:.95;margin:0 0 20px;letter-spacing:-3px}.hero p{max-width:680px;margin:0 auto;color:#9c9ca5;font-size:17px;line-height:1.7}.actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:30px}.btn{padding:13px 18px;border-radius:11px;border:1px solid rgba(255,255,255,.12);background:#f5f5f7;color:#09090b;font-weight:750}.btn.secondary{background:#111117;color:#eee}.section-title{margin:55px 0 18px;font-size:28px}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}.card{background:#0d0d12;border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:22px}.card h3{margin:0 0 8px}.card p{color:#9999a2;line-height:1.6;margin:0}.list{display:grid;gap:14px}.announcement{padding:22px;border:1px solid rgba(255,255,255,.08);border-radius:16px;background:#0d0d12}.meta{color:#777;font-size:12px;margin-bottom:8px}.doc-links{display:grid;gap:12px}.doc-link{display:block;padding:18px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:#0d0d12}.doc-link p{color:#999;margin:6px 0 0}article{max-width:820px;margin:auto}.prose{color:#b5b5bd;line-height:1.8}.prose h2{color:#fff;margin-top:32px}footer{text-align:center;color:#666;padding:30px;border-top:1px solid rgba(255,255,255,.07)}@media(max-width:600px){.site-header{padding:0 14px}.drawer{width:82vw;max-width:310px}main{padding:45px 16px 70px}h1{letter-spacing:-2px}.hero{padding-top:35px}}
a, button, .menu-btn {
  -webkit-tap-highlight-color: transparent;
  outline: none;
}
/* Ensure the scaling animation is smooth */
a, button, .menu-btn, .btn {
  transition: transform 0.2s ease, background 0.18s ease, color 0.18s ease;
}

/* Make elements 5% larger when actively pressed */
a:active, button:active, .menu-btn:active, .btn:active {
  transform: scale(1.05);
}
/* Add a smooth transition to the feature cards */
.card {
  transition: transform 0.25s ease, border-color 0.25s ease;
}

/* Make the card 3% bigger and brighten the border slightly on hover */
.card:hover {
  transform: scale(1.03);
  border-color: rgba(255, 255, 255, 0.25);
}
/* Documentation Slider and Tabs */
.tab-nav { display: flex; gap: 12px; justify-content: center; margin-bottom: 30px; }
.tab-btn { padding: 12px 20px; background: #0d0d12; border: 1px solid rgba(255,255,255,.08); border-radius: 11px; color: #707078; font-weight: 750; cursor: pointer; transition: 0.2s ease; font-size: 14px; }
.tab-btn.active { background: #15151c; color: #fff; border-color: rgba(255,255,255,.25); }
.slider-container { overflow: hidden; width: 100%; position: relative; transition: height 0.35s ease; }
.slider-track { display: flex; transition: transform 0.35s cubic-bezier(0.25, 1, 0.5, 1); width: 200%; align-items: flex-start; }
.slide { width: 50%; flex-shrink: 0; padding: 0 5px; box-sizing: border-box; }
.prose h3 { color: #fff; margin-top: 25px; font-size: 18px; }
.prose ul { color: #b5b5bd; line-height: 1.8; margin-top: 5px; }
