between and .app-shell -- it must also fill the viewport */ body > div { height: 100%; } a { color: #93c5fd; } h1 { outline: none; } code { background: rgba(255,255,255,0.08); padding: 2px 6px; border-radius: 8px; } .app-shell { display: block; } .sidebar { position: fixed; top: 0; left: 0; width: 260px; height: 100vh; overflow-y: auto; border-right: 1px solid var(--border); background: rgba(17,26,46,0.95); backdrop-filter: blur(12px); padding: 18px; display: flex; flex-direction: column; box-sizing: border-box; z-index: 100; } .brand-title { font-weight: 700; font-size: 18px; } .brand-sub { color: var(--muted); font-size: 12px; margin-top: 4px; } .nav { margin-top: 18px; display: grid; gap: 8px; } .nav-link { display: block; padding: 10px 12px; border-radius: 12px; text-decoration: none; color: var(--text); border: 1px solid transparent; } .nav-link.active { border-color: var(--border); background: rgba(255,255,255,0.06); } .content { margin-left: 260px; padding: 22px; } .toolbar { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 12px; } .search { min-width: 260px; flex: 1; border-radius: 12px; border: 1px solid var(--border); padding: 10px 12px; background: rgba(255,255,255,0.06); color: var(--text); } .search::placeholder { color: rgba(169,180,204,0.85); } /* When .search is used on a